@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg-0:#04060f;--bg-1:#0a0f1f;--ink:#e9ecf5;--ink-dim:#8b93ad;--line:#ffffff14;--panel:#0e1424b8;--accent:#5b8cff}*{box-sizing:border-box}html,body,#root{background:var(--bg-0);width:100%;height:100%;color:var(--ink);margin:0;padding:0;font-family:IBM Plex Sans Arabic,system-ui,sans-serif;overflow:hidden}#canvas-host{position:fixed;inset:0}canvas{display:block}.brand{z-index:10;pointer-events:none;direction:ltr;align-items:center;gap:12px;display:flex;position:fixed;top:22px;left:22px}.brand-mark{background:linear-gradient(135deg,#2b3656,#0e1428);border:1px solid #ffffff14;border-radius:10px;place-items:center;width:36px;height:36px;display:grid}.brand-mark svg{width:22px;height:22px}.brand-text{line-height:1.1}.brand-text .ar{letter-spacing:.2px;direction:rtl;font-size:16px;font-weight:700}.brand-text .en{color:var(--ink-dim);text-transform:uppercase;letter-spacing:2px;font-family:JetBrains Mono,monospace;font-size:10px}.meta{z-index:10;color:var(--ink-dim);letter-spacing:1.5px;text-transform:uppercase;text-align:left;pointer-events:none;direction:ltr;font-family:JetBrains Mono,monospace;font-size:10px;position:fixed;top:22px;right:22px}.meta b{color:var(--ink);font-weight:500}.hud{z-index:10;pointer-events:none;direction:ltr;justify-content:space-between;align-items:flex-end;display:flex;position:fixed;bottom:22px;left:22px;right:22px}.hint{color:var(--ink-dim);letter-spacing:1.5px;text-transform:uppercase;font-family:JetBrains Mono,monospace;font-size:10px}.hint span{color:var(--ink)}.stats{color:var(--ink-dim);text-align:right;letter-spacing:1px;font-family:JetBrains Mono,monospace;font-size:10px}.coords{z-index:10;color:var(--ink-dim);letter-spacing:.5px;-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);pointer-events:none;direction:ltr;background:#0e1424a6;border-radius:8px;min-width:180px;padding:8px 12px;font-family:JetBrains Mono,monospace;font-size:10px;position:fixed;top:70px;left:22px}.coords-section{color:var(--ink-dim);letter-spacing:1.5px;opacity:.65;margin-bottom:3px;font-size:9px}.coords-row{justify-content:space-between;gap:16px;line-height:1.55;display:flex}.coords-key{color:var(--ink-dim)}.coords-val{color:var(--ink);font-variant-numeric:tabular-nums}.coords-sep{background:var(--line);height:1px;margin:6px 0}.spin-badge{z-index:11;pointer-events:none;-webkit-backdrop-filter:blur(16px);direction:ltr;border:1.5px solid;border-radius:999px;align-items:center;gap:14px;padding:10px 18px;font-family:JetBrains Mono,monospace;transition:background .2s,border-color .2s,color .2s;display:flex;position:fixed;top:22px;left:50%;transform:translate(-50%)}.spin-badge.running{color:#5eff8e;background:#5eff8e1f;border-color:#5eff8e80;box-shadow:0 0 24px #5eff8e40}.spin-badge.paused{color:#ffd166;background:#ffd1661f;border-color:#ffd16680;box-shadow:0 0 16px #ffd1662e}.spin-badge-icon{font-size:22px;line-height:1}.spin-badge-text{flex-direction:column;line-height:1.1;display:flex}.spin-badge-state{letter-spacing:1.5px;font-size:11px;font-weight:600}.spin-badge-axis{letter-spacing:1px;opacity:.85;font-size:9px}.drag-delta-badge{z-index:11;color:var(--ink);pointer-events:none;direction:ltr;background:#0e1424d9;border:1.5px solid #ffd1668c;border-radius:10px;min-width:140px;padding:10px 14px;font-family:JetBrains Mono,monospace;position:fixed;top:22px;right:22px;box-shadow:0 0 18px #ffd1662e}.drag-delta-title{color:#ffd166;letter-spacing:2px;margin-bottom:6px;font-size:10px;font-weight:600}.drag-delta-row{justify-content:space-between;gap:16px;font-size:12px;line-height:1.6;display:flex}.drag-delta-key{font-weight:600}.drag-delta-val{font-variant-numeric:tabular-nums}.lang-switcher{z-index:12;border:1px solid var(--line);width:44px;height:32px;color:var(--ink);cursor:pointer;-webkit-backdrop-filter:blur(12px);letter-spacing:.5px;direction:ltr;background:#0e1424d9;border-radius:8px;font-family:JetBrains Mono,monospace;font-size:12px;font-weight:600;transition:background .15s,border-color .15s;position:fixed;bottom:60px;left:22px}.lang-switcher:hover{background:#5b8cff2e;border-color:#5b8cff80}