*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--o:#f37f0d;--d:'Syne',sans-serif;--b:'DM Sans',sans-serif;--m:'JetBrains Mono',monospace;--e:cubic-bezier(.22,1,.36,1)}
[data-theme="dark"]{--bg:#07070b;--sf:rgba(255,255,255,.045);--sfh:rgba(255,255,255,.08);--sfa:rgba(255,255,255,.11);--tx:#f2f2f8;--tx2:rgba(255,255,255,.86);--tx3:rgba(255,255,255,.7);--tx4:rgba(255,255,255,.32);--bd:rgba(255,255,255,.09);--bdh:rgba(255,255,255,.16);--glass:rgba(12,12,18,.93);--sh:0 20px 60px rgba(0,0,0,.45);--pa:.5;--pg:.3}
[data-theme="light"]{--bg:#f4f4f6;--sf:rgba(0,0,0,.04);--sfh:rgba(0,0,0,.07);--sfa:rgba(0,0,0,.1);--tx:#0e0e12;--tx2:rgba(0,0,0,.78);--tx3:rgba(0,0,0,.62);--tx4:rgba(0,0,0,.32);--bd:rgba(0,0,0,.1);--bdh:rgba(0,0,0,.18);--glass:rgba(240,240,242,.93);--sh:0 20px 60px rgba(0,0,0,.12);--pa:.55;--pg:.35}
[data-theme="langa"]{--bg:#f37f0d;--sf:rgba(255,255,255,.12);--sfh:rgba(255,255,255,.18);--sfa:rgba(255,255,255,.22);--tx:#fff;--tx2:#fff;--tx3:rgba(255,255,255,.85);--tx4:rgba(255,255,255,.55);--tx-body:#1a1a1a;--bd:rgba(255,255,255,.18);--bdh:rgba(255,255,255,.3);--glass:rgba(220,110,10,.88);--sh:0 20px 60px rgba(0,0,0,.2);--pa:.55;--pg:.35;--o:#fff}
[data-theme="langa"] .sg.live{background:#fff;color:#b85e00}
[data-theme="langa"] .ai-pill.active{color:#fff;border-color:rgba(255,255,255,.4)}
[data-theme="langa"] .aegis-wm{color:rgba(255,255,255,.4)}
[data-theme="langa"] .pre-gx span{color:#fff}
[data-theme="langa"] .nb{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.3)}
[data-theme="langa"] .dgo{color:#fff;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2)}
html,body{height:100%;height:100dvh;overflow:hidden;background:var(--bg);color:var(--tx);font-family:var(--b);-webkit-font-smoothing:antialiased;transition:background .4s,color .4s}
a{text-decoration:none;color:inherit}::selection{background:rgba(243,127,13,.15)}
*{scrollbar-width:thin;scrollbar-color:var(--tx4) transparent}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--tx4);border-radius:2px}

/* Preloader overlay - same canvas shows through */
#pre{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:var(--bg);transition:opacity 1.2s var(--e),background .8s var(--e),visibility 1.2s}
#pre.fade{background:color-mix(in srgb,var(--bg) 60%,transparent)}
#pre.done{opacity:0;visibility:hidden;pointer-events:none}
.pre-b{display:flex;flex-direction:column;align-items:center;gap:6px;opacity:0;transform:scale(.9);transition:all .7s var(--e)}
#pre.go .pre-b{opacity:1;transform:none}
.pre-b img{height:22px}
.pre-gx{display:flex;gap:2px;margin-top:4px;height:16px;overflow:hidden}
.pre-gx span{display:inline-block;font-family:var(--d);font-weight:700;font-size:11px;letter-spacing:3px;color:var(--o);opacity:0;transform:rotate(var(--ir,0deg)) translateY(var(--iy,8px));transition:all .6s var(--e);transition-delay:var(--d,0s)}
#pre.go .pre-gx span{opacity:1;transform:rotate(0deg) translateY(0)}
.pre-gx span.scramble{animation:scrambleLetter .8s var(--e) forwards;animation-delay:var(--d,0s)}
@keyframes scrambleLetter{0%{opacity:0;transform:rotate(var(--ir,180deg)) translateY(12px) scale(.5)}40%{opacity:1;transform:rotate(calc(var(--ir,180deg) * -.3)) translateY(-3px) scale(1.1)}70%{transform:rotate(8deg) translateY(1px) scale(.98)}100%{transform:rotate(0deg) translateY(0) scale(1)}}
.pre-dim{font-family:var(--d);font-weight:600;font-size:10px;letter-spacing:.25em;color:rgba(255,255,255,.5);opacity:0;transition:opacity .6s ease;margin-top:-16px;height:16px;line-height:16px;text-align:center}
#pre.go .pre-dim{opacity:0}
.pre-dim.show{opacity:1 !important;transform:none !important}
.pre-bar{width:44px;height:1px;background:var(--bd);border-radius:1px;overflow:hidden;opacity:0;transition:opacity .4s .3s}
#pre.go .pre-bar{opacity:1}
.pre-bar div{height:100%;width:0;background:var(--o);border-radius:1px;transition:width 1.4s var(--e)}
#pre.go .pre-bar div{width:100%}

/* Frame */
.frame{position:fixed;inset:0;height:100dvh;display:flex;flex-direction:column;z-index:1}
canvas#gx{position:fixed;inset:0;width:100%;height:100%;z-index:0}

/* Nav */
.nav{position:relative;z-index:10;height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,4vw,44px);background:var(--glass);backdrop-filter:blur(20px) saturate(1.3);border-bottom:1px solid var(--bd);flex-shrink:0;opacity:0;transform:translateY(-4px);transition:all .5s var(--e)}
body.loaded .nav{opacity:1;transform:none}
.nav-logo img{height:15px;display:block}
.nav-r{display:flex;align-items:center;gap:2px}
.nl{font-size:11px;color:var(--tx2);padding:5px 12px;border-radius:7px;transition:all .2s;font-weight:500}
.nl:hover{color:var(--tx);background:var(--sf)}
.nl svg{vertical-align:-2px;margin-left:2px;opacity:.35;width:9px;height:9px}
.nt{width:28px;height:28px;border:none;background:transparent;border-radius:7px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--tx3);transition:all .2s}
.nt:hover{color:var(--tx);background:var(--sf)}
.dim-sw{position:relative;display:flex;align-items:center;border-radius:13px;background:var(--sf);border:1px solid var(--bd);cursor:pointer;padding:0 2px;gap:0;user-select:none;transition:all .3s var(--e);overflow:hidden}
.dim-l{font-size:9px;font-family:var(--m);font-weight:700;letter-spacing:-.3px;color:var(--tx3);padding:0 8px;position:relative;z-index:1;transition:color .3s var(--e);line-height:26px}
.dim-l.dim-active{color:var(--tx)}
.dim-dot{position:absolute;top:2px;left:2px;width:calc(50% - 2px);height:22px;border-radius:11px;background:var(--sfh);transition:transform .35s cubic-bezier(.4,.0,.2,1);pointer-events:none}
.dim-sw.on .dim-dot{transform:translateX(100%)}
.dim-sw:hover{border-color:var(--bdh)}
[data-theme="langa"] .dim-sw{border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.1)}
[data-theme="langa"] .dim-l.dim-active{color:#fff}
[data-theme="langa"] .dim-dot{background:rgba(255,255,255,.2)}
.nb{font-size:11px;font-weight:600;color:var(--tx);padding:5px 16px;border-radius:980px;background:var(--sfa);border:1px solid var(--bdh);margin-left:4px;transition:all .3s var(--e)}
.nb:hover{background:var(--sfh);transform:scale(1.02)}

/* Center content */
.center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;z-index:20;padding:0 20px}
.h-sub{margin-bottom:48px;opacity:0;transform:translateY(8px);transition:opacity .8s var(--e),transform .8s var(--e)}
body.loaded .h-sub{opacity:1;transform:none;transition-delay:.15s}
.h-sub p{font-size:14px;color:var(--tx2);text-align:center;min-height:20px;transition:color .4s;display:flex;align-items:center;justify-content:center;gap:6px}
.h-sub p .cursor{display:inline-block;width:1px;height:14px;background:var(--o);margin-left:1px;vertical-align:middle;animation:blink 1s step-end infinite;opacity:.7}
@keyframes blink{50%{opacity:0}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes shakeBar{0%,100%{transform:translateX(0)}15%{transform:translateX(-6px)}30%{transform:translateX(5px)}45%{transform:translateX(-4px)}60%{transform:translateX(3px)}75%{transform:translateX(-2px)}90%{transform:translateX(1px)}}
.h-sub p .ai-spark{color:var(--o);display:none;flex-shrink:0}
.h-sub.ai p{color:var(--o);font-weight:500}
.h-sub.ai p .ai-spark{display:inline-flex}

/* AI pill in search */
.ai-pill{display:none!important;flex-shrink:0;height:36px;align-items:center;gap:4px;font-size:9px;font-family:var(--m);font-weight:600;color:var(--tx4);padding:0 10px;border-radius:10px;background:var(--sf);border:1px solid var(--bd);cursor:pointer;transition:all .3s var(--e);letter-spacing:.5px;text-transform:uppercase}
.ai-pill:hover{color:var(--o);border-color:color-mix(in srgb,var(--o) 25%,var(--bd));background:color-mix(in srgb,var(--o) 5%,transparent)}
.ai-pill.active{color:var(--o);border-color:color-mix(in srgb,var(--o) 30%,var(--bd));background:color-mix(in srgb,var(--o) 8%,transparent)}
.ai-pill .ai-dot{width:4px;height:4px;border-radius:50%;background:var(--o);animation:aidot 2s ease-in-out infinite}
@keyframes aidot{0%,100%{opacity:.3}50%{opacity:1}}
.sw{width:100%;max-width:620px;position:relative;z-index:10;opacity:0;transform:translateY(8px);transition:all .8s var(--e)}
body.loaded .sw{opacity:1;transform:none;transition-delay:.25s}
.sb{display:flex;align-items:center;gap:10px;background:var(--sf);border:1.5px solid var(--bd);border-radius:14px;padding:4px 5px 4px 18px;transition:all .3s var(--e)}
.sb:focus-within{border-color:color-mix(in srgb,var(--o) 40%,var(--bd));box-shadow:0 0 0 4px color-mix(in srgb,var(--o) 8%,transparent);background:var(--sfh)}
.sb svg.si{flex-shrink:0;color:var(--tx3);transition:color .3s}.sb:focus-within svg.si{color:var(--o)}
.sb input{flex:1;border:none;background:none;outline:none;font-size:16px;color:var(--tx);font-family:var(--b);padding:12px 0}
.sb input::placeholder{color:var(--tx3)}
.sg{flex-shrink:0;width:36px;height:36px;border-radius:10px;background:var(--o);border:none;cursor:default;display:flex;align-items:center;justify-content:center;color:#fff;transition:all .2s var(--e);opacity:.2;pointer-events:none}
.sg.live{opacity:1;pointer-events:auto;cursor:pointer}
.sg:hover{transform:scale(1.06);filter:brightness(1.1)}

/* Search results */
.sr{position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--glass);backdrop-filter:blur(32px) saturate(1.4);border:1px solid var(--bdh);border-radius:16px;display:none;z-index:999;box-shadow:var(--sh);overflow:hidden;max-height:60vh}
.sr.open{display:flex;animation:pop .2s var(--e) both}
@keyframes pop{from{opacity:0;transform:translateY(-4px) scale(.99)}to{opacity:1;transform:none}}
.sr-l{flex:1;min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;padding:6px}
.sr-r{width:280px;flex-shrink:0;border-left:1px solid var(--bd);padding:16px;overflow-y:auto;display:none;background:var(--sf);min-height:0}
.sr.hd .sr-r{display:block;animation:slideR .2s var(--e) both}
@keyframes slideR{from{opacity:0;transform:translateX(6px)}to{opacity:1;transform:none}}
.sr-cat{font-size:8px;font-family:var(--m);font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:var(--tx4);padding:8px 12px 3px}
.sri{display:flex;align-items:center;gap:9px;padding:7px 11px;border-radius:9px;cursor:pointer;overflow:hidden;transition:background .1s}
.sri:hover,.sri.ac{background:var(--sfh)}
.sri-go{display:flex;align-items:center;justify-content:center;width:0;height:24px;border-radius:6px;color:var(--tx4);text-decoration:none;flex-shrink:0;overflow:hidden;transition:width .2s,opacity .2s,background .15s;opacity:0}
.sri:hover .sri-go,.sri.ac .sri-go{width:24px;opacity:1;background:var(--sf);color:var(--o)}
.sri-go:hover{color:var(--o);background:var(--sf)}
.sr-ic{width:26px;height:26px;border-radius:7px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--sf);overflow:hidden}
.sr-ic img{width:14px;height:14px;border-radius:2px;object-fit:contain}
.sr-inf{flex:1;min-width:0}
.sr-t{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-d{font-size:10px;color:var(--tx2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-bg{font-size:7.5px;font-family:var(--m);font-weight:500;color:var(--tx4);text-transform:uppercase;letter-spacing:.8px;flex-shrink:0}
.sr-empty{padding:24px;text-align:center;font-size:12px;color:var(--tx3)}
/* Mobile inline detail (shown under active result) */
.sri-detail{display:none;padding:8px 12px 12px 46px;font-size:10.5px;color:var(--tx2);line-height:1.5}
.sri-detail.show{display:block}

/* Detail panel */
.dt{font-family:var(--d);font-size:14px;font-weight:700;margin-bottom:2px}.dy{font-size:8.5px;font-family:var(--m);color:var(--tx3);text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}
.ds{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--tx2);margin-bottom:10px;padding:6px 9px;background:var(--sf);border-radius:7px}.dd{font-size:11.5px;color:var(--tx2);line-height:1.6;margin-bottom:12px}
.dst{display:flex;gap:6px;margin-bottom:12px}.dst>div{flex:1;padding:6px;background:var(--sf);border-radius:7px;text-align:center}.dst-v{font-family:var(--d);font-size:14px;font-weight:700}.dst-l{font-size:8px;color:var(--tx3);margin-top:2px}
.dsvl{font-size:8px;font-family:var(--m);color:var(--tx3);text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}
.dsv{font-size:10.5px;color:var(--tx2);padding:5px 8px;display:flex;align-items:center;gap:6px;border-radius:6px;cursor:pointer;transition:background .15s;text-decoration:none}
.dsv:hover{background:var(--sf)}
.dsv img{width:14px;height:14px;border-radius:3px;flex-shrink:0;object-fit:contain}
.dsv-n{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dsv .sd{margin-left:auto}
.dgo{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--o);padding:7px 12px;border-radius:7px;background:color-mix(in srgb,var(--o) 8%,transparent);border:1px solid color-mix(in srgb,var(--o) 15%,transparent);transition:all .2s var(--e);margin-top:auto}
.dgo:hover{background:color-mix(in srgb,var(--o) 14%,transparent)}
.sd{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--sc);flex-shrink:0}

/* Footer */
.foot{position:relative;z-index:10;flex-shrink:0;border-top:1px solid var(--bd);background:var(--glass);backdrop-filter:blur(20px);opacity:0;transition:opacity .5s var(--e)}
body.loaded .foot{opacity:1;transition-delay:.35s}
.foot-top{display:flex;align-items:center;justify-content:space-between;padding:8px clamp(16px,4vw,44px)}
.ft-l{display:flex;align-items:center;gap:8px}
.net-btn,.lang-btn{font-size:9.5px;font-family:var(--m);font-weight:600;color:var(--tx2);padding:4px 11px;border-radius:980px;background:var(--sf);border:1px solid var(--bd);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:4px}
.net-btn:hover,.lang-btn:hover{background:var(--sfh);border-color:var(--bdh);color:var(--tx)}
.net-btn svg{transition:transform .3s var(--e)}.net-btn.active svg{transform:rotate(180deg)}
.lang-btn{text-transform:uppercase;letter-spacing:1px}
.fc{font-size:8.5px;color:var(--tx4)}

/* AEGIS badge - exact spec */
.aegis-badge{display:flex;align-items:center;justify-content:space-between;border:none;background:transparent;border-radius:0;margin:0;width:100%;font-family:var(--b);padding:6px clamp(16px,4vw,44px) max(6px,env(safe-area-inset-bottom,6px));border-top:1px solid var(--bd)}
.aegis-badge-left{display:flex;align-items:center;gap:8px}
.aegis-badge-logo{display:flex;align-items:center;justify-content:center;flex-shrink:0}
.aegis-badge-text{font-size:9px;color:var(--tx4);line-height:1.6}
.aegis-badge-text strong{font-weight:600;color:var(--tx3)}
.aegis-badge-text a{color:var(--tx4);transition:color .2s}
.aegis-badge-text a:hover{color:var(--tx2)}
.aegis-wm{font-family:var(--d);font-weight:800;font-size:11px;letter-spacing:.5px;color:var(--tx4);transition:color .2s}
.aegis-wm:hover{color:var(--tx3)}

/* Lang popup */
.lang-pop{position:fixed;z-index:400;background:var(--glass);backdrop-filter:blur(24px);border:1px solid var(--bdh);border-radius:12px;padding:6px;display:none;box-shadow:var(--sh)}
.lang-pop.open{display:block;animation:pop .15s var(--e) both}
.lang-pop button{display:block;width:100%;text-align:left;font-size:10.5px;font-family:var(--m);color:var(--tx2);padding:6px 14px;border:none;background:none;border-radius:7px;cursor:pointer;transition:all .12s}
.lang-pop button:hover{background:var(--sfh);color:var(--tx)}
.lang-pop button.cur{color:var(--o);font-weight:700}

/* Network drawer */
.net-drawer{position:fixed;bottom:0;left:0;right:0;z-index:250;background:var(--glass);backdrop-filter:blur(28px) saturate(1.4);border-top:1px solid var(--bdh);transform:translateY(100%);transition:transform .5s var(--e);padding:0 clamp(16px,4vw,44px);max-height:60vh;overflow-y:auto}
.net-drawer.open{transform:translateY(0)}
.net-inner{max-width:900px;margin:0 auto;padding:20px 0 16px}
.net-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.net-lbl{font-size:9px;font-family:var(--m);font-weight:600;text-transform:uppercase;letter-spacing:3px;color:var(--tx3)}
.net-x{width:26px;height:26px;border:none;background:var(--sf);border-radius:7px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--tx2);transition:all .2s}
.net-x:hover{background:var(--sfh);color:var(--tx)}
.ng{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.nc{background:var(--sf);border:1px solid var(--bd);border-radius:10px;padding:14px 8px 12px;text-align:center;transition:all .3s var(--e);position:relative;overflow:hidden;display:block}
.nc:hover{border-color:var(--bdh);background:var(--sfh);transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.1)}
.nc::after{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:22px;height:2px;border-radius:0 0 2px 2px;background:var(--nc);opacity:.5;transition:all .3s}
.nc:hover::after{opacity:1;width:34px}
.nc svg.ni{margin:0 auto 6px;display:block;color:var(--tx3);transition:color .3s}.nc:hover svg.ni{color:var(--tx)}
.nn{font-family:var(--d);font-size:11px;font-weight:700;letter-spacing:.5px;margin-bottom:2px}
.nd{font-size:8.5px;color:var(--tx3);line-height:1.3;margin-bottom:5px;min-height:22px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nm{display:flex;align-items:center;justify-content:center;gap:4px;font-size:8px;font-family:var(--m);color:var(--tx3)}
.nsvcs{margin-top:8px;display:flex;flex-wrap:wrap;gap:4px}
.nsvc{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:500;color:var(--tx3);padding:3px 10px;border-radius:980px;border:1px solid var(--bd);transition:all .2s}
.nsvc:hover{border-color:var(--bdh);color:var(--tx2);background:var(--sf)}
.nsvc img{width:11px;height:11px;border-radius:2px;object-fit:contain}

@media(max-width:768px){
  .sr{left:0;right:0}.sr-r{display:none!important}
  .sri-detail{font-size:10px}
  .sri.ac+.sri-detail{display:block}
  .sri-go{opacity:0.5}
  .ng{grid-template-columns:repeat(3,1fr)}.nd{display:none}
  .foot-top{gap:4px;padding:4px 16px;min-height:36px}
  .fc{font-size:7.5px}
  .aegis-badge{font-size:8px;padding-top:4px;padding-bottom:max(4px,env(safe-area-inset-bottom,4px))}
  .aegis-badge-text{font-size:8px}
  .aegis-wm{font-size:10px}
  /* 3D elements repositioned for mobile */
  .wn-row{bottom:90px}
  .wn-name{bottom:133px}
  .wn-dot{width:20px;height:20px}
  .wn-dot svg{width:9px;height:9px}
  .wn-ctrl{width:24px;height:24px}
  .wn-ctrl svg{width:10px;height:10px}
  .wn-name-t{font-size:11px}
  .wn-name-d{font-size:6px}
  .back-gx{top:50px;font-size:7px;padding:4px 10px 4px 6px}
  .nav{height:44px}
  .h-sub{margin-bottom:24px}
  .sb input{padding:8px 0;font-size:16px}
}
@media(max-width:480px){
  .ng{grid-template-columns:repeat(2,1fr)}
  .nav{height:44px;padding:0 16px}
  .center{padding:0 16px}
  .wn-dots{padding:2px 5px;gap:2px}
  .wn-dot{width:18px;height:18px}
  .wn-dot svg{width:8px;height:8px}
  .wn-ctrl{width:22px;height:22px}
  #muWave{width:24px;height:16px}
}
/* Gravity fall effect */
@keyframes fall{0%{transform:translateY(0) rotate(0deg);opacity:1}100%{transform:translateY(120vh) rotate(var(--fr,15deg));opacity:0}}
.falling{pointer-events:none}
.falling>*,.falling .center>*{animation:fall 1.8s var(--e) forwards;animation-delay:var(--fd,0s)}
.falling .nav{--fd:.05s;--fr:-12deg}
.falling .center .h-sub{--fd:.15s;--fr:8deg}
.falling .center .sw{--fd:.25s;--fr:-5deg}
.falling .foot{--fd:.35s;--fr:15deg}
/* RTL support - full mirror for Arabic */
[dir="rtl"]{direction:rtl;text-align:right}
/* Brand names NEVER reverse */
[dir="rtl"] .nav-logo,[dir="rtl"] .aegis-wm,[dir="rtl"] .nn,[dir="rtl"] .pre-b,[dir="rtl"] .pre-gx{direction:ltr;unicode-bidi:isolate}
/* Nav: direction:rtl auto-reverses flex, just fix margins */
[dir="rtl"] .nl svg{margin-left:0;margin-right:2px}
[dir="rtl"] .nb{margin-left:0;margin-right:4px}
/* Search */
[dir="rtl"] .sb{padding:4px 18px 4px 5px}
[dir="rtl"] .sb input{text-align:right;direction:rtl}
/* Results */
[dir="rtl"] .sr{direction:rtl}
[dir="rtl"] .sr-r{border-left:none;border-right:1px solid var(--bd)}
[dir="rtl"] .sr-inf{text-align:right}
[dir="rtl"] .sr-bg{text-align:left}
[dir="rtl"] .sr-cat{text-align:right}
/* Detail */
[dir="rtl"] .dt,[dir="rtl"] .dy,[dir="rtl"] .dd,[dir="rtl"] .dsvl{text-align:right}
[dir="rtl"] .dd{direction:rtl}
/* Footer */
[dir="rtl"] .fc{text-align:right}
[dir="rtl"] .aegis-badge-text{text-align:right;direction:rtl}
/* Popup */
[dir="rtl"] .lang-pop{text-align:right}
[dir="rtl"] .lang-pop button{text-align:right;direction:rtl}
[dir="rtl"] .net-drawer{direction:rtl}
[dir="rtl"] .net-head{flex-direction:row-reverse}
[dir="rtl"] .nc{text-align:center}
[dir="rtl"] .nsvcs{direction:rtl}
[dir="rtl"] .sg svg{transform:scaleX(-1)}
[dir="rtl"] .dgo svg{transform:scaleX(-1)}
[dir="rtl"] .nl svg{transform:scaleX(-1)}
[dir="rtl"] .net-btn svg{transform:scaleX(-1)}
[dir="rtl"] .dim-sw{flex-direction:row-reverse}
[dir="rtl"] .dim-dot{left:auto;right:2px}
[dir="rtl"] .dim-sw.on .dim-dot{transform:translateX(-100%)}

/* ── 3D mode: search moves to bottom ── */
/* 3D mode transitions — only search bar and subtitle hide */
body.mode3d .h-sub{animation:fadeSlideOut .8s var(--e) .2s forwards}
body.mode3d .sw{animation:fadeSlideOut .8s var(--e) .4s forwards}
body.mode3d .center{pointer-events:none}
body.mode3d .frame{pointer-events:none;z-index:3}
body.mode3d .nav{pointer-events:auto;position:relative;z-index:10}
body.mode3d .foot{pointer-events:auto;position:relative;z-index:10}
body.mode3d .back-gx{pointer-events:auto}
body.mode3d .wn-row{pointer-events:auto}
body.mode3d{user-select:none;cursor:grab}
body.mode3d:active{cursor:grabbing}
@keyframes fadeSlideOut{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(20px);pointer-events:none;visibility:hidden}}
/* Back to 2D */
body.was3d:not(.mode3d) .h-sub,body.was3d:not(.mode3d) .sw{animation:fadeSlideIn .8s var(--e) .3s both}
@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}

/* ═══════════════════════════════════════════
   3D ELEMENTS — inline in footer + fixed name
   ═══════════════════════════════════════════ */

/* 2D defaults: music + console hidden */
.mu{display:none}
.wn-row{position:fixed;bottom:47px;left:50%;transform:translateX(-50%);z-index:190;display:none;align-items:center;gap:5px;pointer-events:none}

/* 3D: swap Networks→Music, show floating console */
body.mode3d .net-btn{display:none}
body.mode3d .mu{display:flex;align-items:center;gap:0;border-radius:980px;background:var(--sf);border:1px solid var(--bd);padding:2px 2px 2px 4px;cursor:pointer;height:26px;user-select:none;transition:all .3s var(--e)}
body.mode3d .mu:hover{border-color:var(--bdh);background:var(--sfh)}
body.mode3d .mu.mu-on{border-color:color-mix(in srgb,var(--o) 22%,var(--bd))}
body.mode3d .wn-row{display:flex;pointer-events:auto;animation:fadeInRow .6s ease .8s both}
@keyframes fadeInRow{from{opacity:0;transform:translateX(-50%) translateY(10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
body.was3d:not(.mode3d) .wn-row{display:none}
#muWave{display:block;width:32px;height:20px;border-radius:3px;opacity:.45;transition:opacity .4s}
.mu.mu-on #muWave{opacity:1}
.mu-pick{width:20px;height:20px;border:none;background:transparent;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--tx3);transition:all .2s;flex-shrink:0}
.mu-pick:hover{color:var(--tx);background:var(--sf)}
.mu-pick svg{transition:transform .3s var(--e)}
.mu-pick.open svg{transform:rotate(180deg)}

/* Console components */
.wn-ctrl{width:28px;height:28px;border-radius:50%;background:var(--sf);border:1px solid var(--bd);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--tx3);transition:all .25s var(--e);flex-shrink:0}
.wn-ctrl:hover{background:var(--sfh);color:var(--tx);border-color:var(--bdh);transform:scale(1.12)}
.wn-ctrl:active{transform:scale(.85);transition-duration:.08s}
.wn-ctrl svg{width:11px;height:11px}
.wn-ctrl.wn-paused{color:var(--o);border-color:color-mix(in srgb,var(--o) 25%,var(--bd));background:color-mix(in srgb,var(--o) 6%,var(--sf))}
.wn-dots{display:flex;align-items:center;gap:4px;background:var(--sf);border:1px solid var(--bd);border-radius:980px;padding:3px}
.wn-dot{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .35s var(--e);position:relative;border:1.5px solid transparent}
.wn-dot svg{width:11px;height:11px;opacity:.3;transition:all .25s var(--e)}
.wn-dot:hover{background:var(--sfh);transform:scale(1.15)}
.wn-dot:hover svg{opacity:.65}
.wn-dot:active{transform:scale(.88);transition-duration:.1s}
.wn-dot.wn-ac{border-color:var(--wc);background:color-mix(in srgb,var(--wc) 12%,transparent);transform:scale(1.1)}
.wn-dot.wn-ac svg{opacity:1;color:var(--wc);filter:drop-shadow(0 0 3px var(--wc))}
.wn-dot.wn-ac::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--wc);opacity:.2;animation:wnRing 2.5s ease-in-out infinite}
@keyframes wnRing{0%,100%{transform:scale(1);opacity:.2}50%{transform:scale(1.2);opacity:.05}}

/* World name — fixed ABOVE footer top edge, centered */
.wn-name{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);z-index:190;pointer-events:none;text-align:center;opacity:0;visibility:hidden;transition:all .5s var(--e);white-space:nowrap}
body.mode3d .wn-name{opacity:1;visibility:visible}
body.was3d:not(.mode3d) .wn-name{opacity:0;visibility:hidden}
.wn-name-t{font-family:var(--d);font-size:13px;font-weight:700;letter-spacing:1px;color:var(--tx);text-transform:uppercase;display:block}
.wn-name-d{display:block;font-family:var(--m);font-size:7px;font-weight:400;color:var(--tx3);letter-spacing:1px;margin-top:1px}
.wn-name.wn-flash .wn-name-t,.wn-name.wn-flash .wn-name-d{animation:wnFlash .4s var(--e)}
@keyframes wnFlash{0%{opacity:0;transform:translateY(4px)}100%{opacity:1;transform:translateY(0)}}

/* Track picker popup */
.mu-pop{position:fixed;z-index:400;background:var(--glass);backdrop-filter:blur(24px) saturate(1.4);border:1px solid var(--bdh);border-radius:12px;padding:6px;display:none;box-shadow:var(--sh);min-width:180px}
.mu-pop.open{display:block;animation:pop .15s var(--e) both}
.mu-pop-h{font-size:7px;font-family:var(--m);font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:var(--tx4);padding:5px 10px 3px}
.mu-trk{display:flex;align-items:center;gap:7px;width:100%;text-align:left;font-size:10px;font-family:var(--b);color:var(--tx2);padding:6px 10px;border:none;background:none;border-radius:7px;cursor:pointer;transition:all .12s}
.mu-trk:hover{background:var(--sfh);color:var(--tx)}
.mu-trk.mu-trk-ac{color:var(--o);font-weight:600}
.mu-trk-d{width:5px;height:5px;border-radius:50%;background:var(--tc);flex-shrink:0}

/* Back to galaxy — top-left, 3D only */
.back-gx{position:fixed;top:58px;left:clamp(16px,4vw,44px);z-index:200;display:flex;align-items:center;gap:5px;background:var(--glass);backdrop-filter:blur(20px);border:1px solid var(--bd);border-radius:980px;padding:5px 12px 5px 7px;cursor:pointer;font-family:var(--m);font-size:8px;font-weight:500;color:var(--tx3);letter-spacing:.4px;transition:all .3s var(--e);opacity:0;visibility:hidden;pointer-events:none}
body.mode3d .back-gx{opacity:1;visibility:visible;pointer-events:auto;transition-delay:.7s}
body.was3d:not(.mode3d) .back-gx{opacity:0;visibility:hidden;pointer-events:none}
.back-gx:hover{color:var(--tx);background:var(--sfh);border-color:var(--bdh)}
.back-gx svg{width:11px;height:11px;transition:transform .3s var(--e)}
.back-gx:hover svg{transform:translateX(-2px)}

/* ═══ MOBILE OVERRIDE — must come AFTER desktop definitions ═══ */
@media(max-width:768px){
  .wn-row{bottom:calc(90px + env(safe-area-inset-bottom,0px))!important}
  .wn-name{bottom:calc(133px + env(safe-area-inset-bottom,0px))!important}
}
/* Music waveform always same opacity — shape changes not opacity */
#muWave{opacity:1!important}



/* ═══ 6th card (Account) — fills mobile grid gap ═══ */
.nc-extra{display:none;text-decoration:none}
.nc-extra::after{background:var(--nc)!important}
@media(max-width:768px){
  .nc-extra{display:block}
  .ng{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:480px){
  .ng{grid-template-columns:repeat(2,1fr)!important}
  .nc-extra{display:block}
}

/* Search result badges */
.sr-badge{display:inline-block;padding:1px 5px;border-radius:4px;font-size:8px;font-weight:600;letter-spacing:.3px;background:rgba(255,255,255,.08);color:var(--tx3);margin-right:3px}

/* Mobile: pull searchbar up on focus */
@media(max-width:768px){
  .center{transition:padding .3s ease}
  .h-sub{transition:opacity .25s,max-height .3s,margin .3s;max-height:80px;overflow:hidden}
  body.sf .center{justify-content:flex-start;padding-top:10px}
  body.sf .h-sub{opacity:0;max-height:0;margin:0;pointer-events:none}
  body.sf .sw{opacity:1!important;transform:none!important}
}