*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:#fff;color:#111;font:15px/1.5 Inter,system-ui,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased}
#scene{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;outline:none}
#labels{position:fixed;inset:0;pointer-events:none}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit}

/* ---------- chrome ---------- */
.brand{position:fixed;left:22px;top:18px;z-index:5;display:flex;align-items:center;gap:9px;text-decoration:none;font:600 13px/1 'JetBrains Mono',monospace;letter-spacing:.24em;color:#111}
.brand img{width:28px;height:28px;object-fit:contain}
.old-link{position:fixed;right:20px;top:16px;z-index:5;font:500 12px/1 'JetBrains Mono',monospace;color:#111;text-decoration:none;padding:9px 13px;border:1px solid rgba(0,0,0,.14);border-radius:999px;background:rgba(255,255,255,.75);backdrop-filter:blur(6px);transition:.2s}
.old-link:hover{background:#111;color:#fff;border-color:#111}
.loading{position:fixed;left:0;top:0;height:2px;width:100%;z-index:9;pointer-events:none}
.loading i{display:block;height:100%;width:0;background:#111;transition:width .3s,opacity .6s .3s}
.loading.done i{width:100%;opacity:0}

.music{position:fixed;right:18px;bottom:18px;z-index:7;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(0,0,0,.1);background:rgba(255,255,255,.8);backdrop-filter:blur(6px);color:#222;transition:.2s}
.music:hover{background:#111;color:#fff}
.music .x{display:none}.music.off .x{display:block}.music.off{opacity:.65}
.theme{position:fixed;right:66px;bottom:18px;z-index:7;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(0,0,0,.1);background:rgba(255,255,255,.8);backdrop-filter:blur(6px);color:#222;transition:.2s}
.theme:hover{background:#111;color:#fff}
.theme .sun{display:none}
[data-theme="dark"] .theme .sun{display:block}[data-theme="dark"] .theme .moon{display:none}

/* dark mode: black ground, light ink */
[data-theme="dark"] body{background:#0a0a0c;color:#ececf1}
[data-theme="dark"] .intro p{color:#9b9aa6}
[data-theme="dark"] .intro::before{background:radial-gradient(closest-side,rgba(10,10,12,.9),rgba(10,10,12,.65) 55%,rgba(10,10,12,0))}
[data-theme="dark"] .cta{background:#fff;color:#0a0a0c}
[data-theme="dark"] .music,[data-theme="dark"] .theme,[data-theme="dark"] .hint{background:rgba(24,24,28,.8);border-color:rgba(255,255,255,.1);color:#ddd}
[data-theme="dark"] .music:hover,[data-theme="dark"] .theme:hover{background:#fff;color:#111}
[data-theme="dark"] .hint span{color:#777}
[data-theme="dark"] .head{background:rgba(22,22,26,.9);border-color:rgba(255,255,255,.12);color:#eee}
[data-theme="dark"] .head b{background:#fff;color:#111}
[data-theme="dark"] .tag3d{background:rgba(22,22,26,.85);border-color:rgba(255,255,255,.12);color:#eee}
[data-theme="dark"] .word{text-shadow:0 0 6px #000,0 0 2px #000}
[data-theme="dark"] .toast{background:#fff;color:#111}
[data-theme="dark"] .loading i{background:#fff}

/* ---------- intro ---------- */
.intro{position:fixed;left:clamp(22px,7vw,110px);bottom:clamp(40px,14vh,140px);z-index:4;max-width:640px;transition:opacity .9s ease,transform .9s ease}
.intro h1{font:600 clamp(40px,6.4vw,88px)/.95 'Bricolage Grotesque',Inter,sans-serif;letter-spacing:-.035em;margin:0 0 18px;animation:rise 1.2s cubic-bezier(.2,.8,.2,1) both}
.intro p{font-size:clamp(15px,1.6vw,17px);color:#555;margin:0 0 26px;max-width:430px;animation:rise 1.2s .15s cubic-bezier(.2,.8,.2,1) both}
.cta{border:0;background:#111;color:#fff;font:600 15px/1 Inter,sans-serif;padding:16px 26px;border-radius:999px;box-shadow:0 10px 30px -10px rgba(0,0,0,.5);transition:transform .2s,box-shadow .2s;animation:rise 1.2s .3s cubic-bezier(.2,.8,.2,1) both}
.cta:hover{transform:translateY(-2px);box-shadow:0 16px 34px -12px rgba(0,0,0,.55)}
body:not(.mode-intro) .intro{opacity:0;transform:translateY(20px);pointer-events:none}
.intro::before{content:"";position:absolute;inset:-90px -120px -80px -140px;z-index:-1;background:radial-gradient(closest-side,rgba(255,255,255,.92),rgba(255,255,255,.7) 55%,rgba(255,255,255,0));pointer-events:none}
@keyframes rise{from{opacity:0;transform:translateY(24px)}}

.hint{position:fixed;left:50%;top:18px;transform:translate(-50%,-10px);z-index:4;font:500 13px/1 'JetBrains Mono',monospace;color:#333;background:rgba(255,255,255,.8);backdrop-filter:blur(6px);border:1px solid rgba(0,0,0,.08);padding:10px 16px;border-radius:999px;opacity:0;pointer-events:none;transition:.6s;white-space:nowrap}
.hint span{color:#999}
body.mode-compass .hint{opacity:1;transform:translate(-50%,0)}

/* ---------- 3d labels ---------- */
.head{pointer-events:auto;display:flex;align-items:center;gap:8px;border:1px solid rgba(0,0,0,.12);background:rgba(255,255,255,.9);backdrop-filter:blur(4px);padding:8px 13px 8px 8px;border-radius:999px;font:500 13px/1 Inter,sans-serif;color:#111;white-space:nowrap;transition:background .2s,color .2s,transform .2s,opacity .5s;box-shadow:0 4px 14px -6px rgba(0,0,0,.25)}
.head b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#111;color:#fff;font:600 11px/1 'JetBrains Mono',monospace}
.head i{font-style:normal;transition:transform .2s}
.head:hover,.head.hot{background:var(--c);color:#fff;border-color:var(--c);transform:scale(1.05)}
.head:hover b,.head.hot b{background:#fff;color:var(--c)}
.head:hover i,.head.hot i{transform:translateX(3px)}
body:not(.mode-compass) .head{opacity:0;pointer-events:none}
.tag3d{font:500 11px/1 'JetBrains Mono',monospace;color:#111;background:rgba(255,255,255,.85);border:1px solid rgba(0,0,0,.1);padding:5px 8px;border-radius:999px;white-space:nowrap;transition:opacity .4s}
.word{font:500 12px/1 'JetBrains Mono',monospace;color:var(--c);white-space:nowrap;text-shadow:0 0 6px #fff,0 0 2px #fff;letter-spacing:.04em}
.city{display:flex;align-items:center;gap:5px;font:600 11px/1 Inter,sans-serif;color:#fff;background:rgba(24,26,32,.84);padding:4px 7px;border-radius:6px;white-space:nowrap;transform:translate(10px,-10px);border:1px solid rgba(255,255,255,.09)}

/* ---------- panels (shared) ---------- */
.panel{position:fixed;z-index:6;right:24px;top:50%;width:min(380px,calc(100vw - 32px));max-height:calc(100vh - 110px);overflow:auto;transform:translate(30px,-50%);opacity:0;pointer-events:none;transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
.panel.show{opacity:1;transform:translate(0,-50%);pointer-events:auto}
.panel h2{margin:0}
.p-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.p-actions.col{flex-direction:column;align-items:center}
.p-url{display:block;margin-top:14px;font:400 12px/1 'JetBrains Mono',monospace;opacity:.55}
.p-note{font-size:13px;opacity:.7}

/* ---------- Akira AI (ai.akiramc.com) ---------- */
.p-ai{--ink:#14131c;--muted:#514e63;--faint:#7a7690;--accent:#573fdd;--mine:rgba(95,76,230,.13);background:rgba(255,255,255,.88);backdrop-filter:blur(18px) saturate(1.2);color:var(--ink);border-radius:26px;padding:26px;font-family:'Public Sans',sans-serif;box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 24px 60px -24px rgba(40,30,110,.35),0 0 0 1px rgba(20,19,28,.08)}
.p-ai-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.p-ai-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--accent);color:#fff;font-size:18px}
.p-ai-badge{font:500 12px/1 'Public Sans';padding:6px 10px;border-radius:999px;background:var(--mine);color:var(--accent)}
.p-ai h2{font:500 40px/1 'Bricolage Grotesque',sans-serif;letter-spacing:-.03em}
.p-ai-sub{font:400 20px/1.2 'Bricolage Grotesque';color:var(--faint);margin:6px 0 14px}
.p-ai p{color:var(--muted)}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:14px 0;padding:0}
.chips li{font-size:12.5px;padding:5px 10px;border-radius:999px;background:var(--mine);color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 16px;border-radius:11px;font-size:14px;border:0;text-decoration:none;transition:transform .18s cubic-bezier(.2,.9,.3,1),background .18s}
.btn:hover{transform:translateY(-1px)}
.btn-lg{padding:13px 20px;font-size:15px;border-radius:14px}
.btn-primary{background:var(--accent);color:#fff;font-weight:500}
.btn-soft{background:var(--mine);color:var(--ink)}

/* ---------- Minecraft (mc.akiramc.com) ---------- */
.p-mc{background:#2b1f14 url(mc/dirt.png) 0 0/64px 64px;image-rendering:pixelated;color:#fff;padding:24px;border:2px solid #000;box-shadow:inset 0 0 0 9999px rgba(0,0,0,.55),0 20px 50px -20px rgba(0,0,0,.6);font:22px/1.15 VT323,monospace}
.p-mc h2{font:400 34px/1 Silkscreen,monospace;text-align:center;color:#fff;text-shadow:3px 3px 0 #3f3f3f;letter-spacing:1px}
.p-mc-ver{text-align:center;color:#ffff55;text-shadow:2px 2px 0 #3f3f15;margin:6px 0 14px;font-size:20px}
.p-mc p{text-shadow:2px 2px 0 #3f3f3f;margin:0 0 12px}
.p-mc .p-note{color:#aaa;opacity:1;font-size:19px}
.p-mc .p-actions{flex-direction:column}
.mcb{display:block;width:100%;text-align:center;font:22px/1 VT323,monospace;color:#e0e0e0;text-shadow:2px 2px 0 #383838;text-decoration:none;padding:9px 0 11px;background:#6f6f6f;border:2px solid #000;box-shadow:inset 2px 2px 0 #aaa,inset -2px -3px 0 #3c3c3c}
.mcb:hover{background:#7d86b8;color:#ffffa0;box-shadow:inset 2px 2px 0 #bcc5ff,inset -2px -3px 0 #4b5384;border-color:#fff}
.p-mc .p-url{color:#aaa;font:18px VT323,monospace;text-align:center}

/* ---------- ClaudeEarth (earth.akiramc.com) ---------- */
.p-earth{--glass:rgba(24,26,32,.84);--line:rgba(255,255,255,.09);--text:#eef0f4;--muted:#9aa3b2;--accent:#5b9dff;background:var(--glass);backdrop-filter:blur(14px);color:var(--text);border-radius:14px;border:1px solid var(--line);box-shadow:0 8px 28px rgba(0,0,0,.45);font:14px/1.5 Inter,sans-serif}
.p-earth-top{display:flex;align-items:center;gap:9px;padding:12px 14px;border-bottom:1px solid var(--line);font-size:15px}
.p-earth-sep{flex:1}
.p-earth-pill{font-size:11px;font-weight:600;padding:3px 8px;border-radius:6px;background:rgba(91,157,255,.18);color:var(--accent)}
.p-earth-body{padding:14px}
.p-earth-body p{color:var(--muted);margin:0 0 12px}
.p-earth-list{display:grid;gap:1px;background:var(--line);border-radius:10px;overflow:hidden;margin-bottom:12px}
.p-earth-list div{background:rgba(38,41,50,.92);padding:9px 12px;color:var(--muted);font-size:13px}
.p-earth-list span{display:block;color:var(--text);font-weight:600}
.eb{display:inline-flex;align-items:center;padding:8px 13px;border-radius:9px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--text);font:500 13px Inter,sans-serif;text-decoration:none;transition:.15s}
.eb:hover{background:rgba(255,255,255,.12)}
.eb-primary{background:var(--accent);border-color:var(--accent);color:#fff}
.eb-primary:hover{background:#2f6fe0}

/* ---------- AkiraMC (old akiramc.com) ---------- */
.p-amc{background:rgba(18,18,18,.9);color:#fff;border:2px solid #555;border-radius:4px;padding:24px;text-align:center;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;box-shadow:0 20px 50px -20px rgba(0,0,0,.6)}
.p-amc-logo{width:120px;filter:drop-shadow(0 0 15px rgba(0,0,0,.6))}
.p-amc h2{font-size:2rem;font-weight:700}
.p-amc-sub{margin:2px 0 16px;font-size:1.05rem}
.p-amc-status{background:rgba(10,10,10,.8);border:2px solid #555;border-radius:4px;padding:16px;margin-bottom:14px}
.p-amc-status b{font-weight:700}
.sdot{display:inline-block;width:10px;height:10px;border-radius:50%;background:#888;margin-right:8px}
.sdot.on{background:#5cb85c;box-shadow:0 0 8px #5cb85c}.sdot.off{background:#d9534f}
.p-amc-players{color:#ccc;margin-top:8px}.p-amc-ver{color:#888;font-size:.85rem;margin-top:6px}
.p-amc p{color:#ccc;font-size:.95rem}
.p-amc code{background:#111;padding:2px 6px;border-radius:3px}
.amb{display:inline-flex;align-items:center;justify-content:center;width:250px;max-width:100%;height:52px;border:0;color:#fff;font:700 1.05rem 'Segoe UI',sans-serif;text-transform:uppercase;text-shadow:2px 2px 0 #000;text-decoration:none;background:#555 url(../old/assets/buttonlarge.png) 0 0/100% 100% no-repeat;image-rendering:pixelated;transition:transform .1s}
.amb:hover{filter:brightness(1.15)}.amb:active{transform:translateY(2px)}
.amb.small{height:40px;font-size:.78rem;text-transform:none}

.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,30px);opacity:0;z-index:20;background:#111;color:#fff;font:500 13px 'JetBrains Mono',monospace;padding:11px 16px;border-radius:10px;transition:.25s;pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media (max-width:720px){
  .old-link{font-size:11px;padding:8px 10px;max-width:56vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .brand span{display:none}
  .panel{left:12px;right:12px;width:auto;top:auto;bottom:12px;max-height:46vh;transform:translate(0,30px)}
  .panel.show{transform:none}
  .p-ai,.p-mc,.p-amc{padding:18px}
  .p-ai h2{font-size:32px}
  .hint span{display:none}
  .head{font-size:12px;padding:6px 10px 6px 6px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}

/* shown only if the 3D scene fails to start */
.fallback{position:fixed;left:clamp(22px,7vw,110px);top:clamp(30px,12vh,120px);z-index:8;max-width:520px;font-size:15px;color:#444}
.fallback nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.fallback a{padding:10px 14px;border:1px solid rgba(0,0,0,.15);border-radius:999px;text-decoration:none;color:#111;font-weight:500}
.fallback a:hover{background:#111;color:#fff}
.fallback[hidden]{display:none}