/* The hatchery: full-screen 3D with a dark-glass HUD over it. */
:root{--bg:#030807;--ink:#f4f6f4;--mut:#9fb0aa;--line:rgba(140,255,200,.16);--green:#10e88a;--green2:#8ff0c0;--glass:rgba(7,13,14,.66);--font:var(--font-chirp-num),var(--font-universal-text),ui-sans-serif,system-ui,sans-serif;--disp:var(--font-chirp-num),var(--font-universal-display),ui-sans-serif,system-ui,sans-serif;--mono:var(--font-geist-mono),ui-monospace,Menlo,monospace}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:var(--bg);color:var(--ink);font-family:var(--font);overflow:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}
[hidden]{display:none!important}
#w-canvas{position:fixed;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:none;outline:none}
#w-canvas.is-drag{cursor:grabbing}
#w-labels{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:2}
.w-top{position:fixed;top:0;left:0;right:0;z-index:6;display:flex;align-items:center;gap:18px;height:64px;padding:0 20px;background:linear-gradient(180deg,rgba(4,9,10,.72),rgba(4,9,10,0))}
.w-brand{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-size:18px;font-weight:600;letter-spacing:-.01em;text-shadow:0 1px 10px rgba(0,0,0,.6)}
.w-brand img{width:34px;height:34px}
.w-nav{display:flex;gap:2px;margin-left:10px;padding:4px;border-radius:999px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%)}
.w-nav a{padding:7px 13px;border-radius:999px;font-size:14px;color:#d5ded9;transition:color .15s,background-color .15s;white-space:nowrap}
.w-nav a:hover{color:#fff;background:rgba(255,255,255,.1)}
.w-pill{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 13px;border-radius:999px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);font-size:12.5px;color:#d5ded9;white-space:nowrap}
.w-top .w-pill{margin-left:auto}
.w-pill i{width:7px;height:7px;border-radius:50%;background:var(--mut)}
.w-pill.is-live i{background:var(--green);box-shadow:0 0 0 3px rgba(16,232,138,.22);animation:wPulse 2s ease-in-out infinite}
.w-pill.is-preview{color:#ffd98a;border-color:rgba(255,217,138,.35)}.w-pill.is-preview i{background:#ffcf6b}
button.w-pill:hover{color:#fff;border-color:rgba(140,255,200,.4)}
button.w-pill.is-on{background:var(--green);color:#03130a;border-color:var(--green);font-weight:600}
@keyframes wPulse{0%,100%{box-shadow:0 0 0 3px rgba(16,232,138,.22)}50%{box-shadow:0 0 0 7px rgba(16,232,138,.05)}}
.w-menu{display:none;width:38px;height:38px;border-radius:999px;border:1px solid var(--line);background:var(--glass);flex-direction:column;align-items:center;justify-content:center;gap:5px}
.w-menu span{width:16px;height:1.75px;background:#fff;border-radius:2px}
.w-hud{position:fixed;inset:64px 0 0 0;z-index:4;pointer-events:none}
.w-card{pointer-events:auto;border:1px solid var(--line);border-radius:20px;background:var(--glass);backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 24px 70px rgba(0,0,0,.42)}
.w-x{position:absolute;top:10px;right:10px;width:28px;height:28px;border-radius:999px;border:0;background:rgba(255,255,255,.08);font-size:17px;line-height:1;color:#cfd8d3}
.w-x:hover{background:rgba(255,255,255,.18);color:#fff}
.w-pitch{position:absolute;left:20px;top:14px;width:min(400px,calc(100vw - 40px));padding:22px 22px 20px;display:flex;flex-direction:column;gap:12px}
.w-help{position:absolute;left:20px;top:14px;pointer-events:auto}
.w-kicker{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--green)}
.w-pitch h1{font-family:var(--disp);font-size:clamp(26px,2.6vw,34px);line-height:1.05;letter-spacing:-.03em;font-weight:500;background:linear-gradient(180deg,#fff 30%,#b9f5d6);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:20px}
.w-lead{font-size:14.5px;line-height:1.55;color:#cdd6d1}
.w-steps{list-style:none;counter-reset:s;display:flex;flex-direction:column;gap:9px}
.w-steps li{position:relative;padding-left:32px;font-size:13px;line-height:1.45;color:var(--mut)}
.w-steps li b{color:var(--ink);font-weight:500}
.w-steps li:before{counter-increment:s;content:counter(s);position:absolute;left:0;top:0;width:21px;height:21px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;background:rgba(16,232,138,.16);color:var(--green)}
.w-cta{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.w-btn{display:inline-flex;align-items:center;height:38px;padding:0 17px;border-radius:999px;font-size:13.5px;font-weight:600;background:var(--green);color:#03130a;transition:filter .15s}
.w-btn:hover{filter:brightness(1.12)}
.w-btn-ghost{background:transparent;color:var(--ink);border:1px solid rgba(255,255,255,.18);font-weight:500}.w-btn-ghost:hover{background:rgba(255,255,255,.08);filter:none}
.w-stats{position:absolute;left:20px;bottom:20px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;width:min(440px,calc(100vw - 40px))}
.w-stat{padding:11px 12px 10px;border-radius:14px;display:flex;flex-direction:column;gap:3px;min-width:0}
.w-stat span{font-size:10.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.w-stat b{font-family:var(--disp);font-size:20px;font-weight:500;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.w-stat em{font-style:normal;font-size:10px;color:var(--mut)}
.w-stat.is-bump b{animation:wBump .7s ease-out}
@keyframes wBump{0%{color:var(--green);text-shadow:0 0 18px rgba(16,232,138,.8)}100%{color:var(--ink);text-shadow:none}}
.w-feed{position:absolute;right:20px;bottom:20px;width:min(330px,calc(100vw - 40px));padding:15px 15px 9px;display:flex;flex-direction:column;gap:9px}
.w-feed ul{list-style:none;display:flex;flex-direction:column;height:204px;overflow:hidden}
.w-feed li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:center;height:34px;font-size:12.5px;color:var(--mut);animation:wIn .45s ease-out both}
.w-feed li b{color:var(--ink);font-weight:500}
.w-feed li span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.w-feed li i{width:28px;height:28px;border-radius:9px;background:rgba(255,255,255,.08) center/cover no-repeat;display:block}
.w-feed li.is-buy span b{color:var(--green)}.w-feed li.is-sell span b{color:#ff7466}
.w-feed .w-feed-empty{display:block;height:auto;padding:6px 0;line-height:1.5}
@keyframes wIn{from{opacity:0;transform:translateY(8px);background:rgba(16,232,138,.12)}to{opacity:1;transform:none;background:transparent}}
.w-ctl{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;pointer-events:auto}
.w-hint{font-size:11.5px;letter-spacing:.02em;color:rgba(255,255,255,.72);white-space:nowrap;text-shadow:0 1px 8px rgba(0,0,0,.7);margin-left:6px}
/* agent / master profile */
.w-panel{position:absolute;right:20px;top:14px;bottom:20px;width:min(370px,calc(100vw - 40px));padding:20px;display:flex;flex-direction:column;gap:13px;overflow-y:auto;scrollbar-width:thin}
.w-p-head{display:flex;gap:13px;align-items:center;padding-right:26px}
.w-p-face{width:66px;height:66px;border-radius:18px;flex:none;background:rgba(255,255,255,.07) center/cover no-repeat;border:1px solid var(--line)}
.w-p-head h2{font-family:var(--disp);font-size:23px;font-weight:600;letter-spacing:-.02em;line-height:1.1;margin-top:2px}
.w-p-tag{font-size:12.5px;color:var(--mut);margin-top:3px}
.w-p-coin{display:flex;align-items:center;gap:11px;padding:11px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07)}
.w-p-logo{width:42px;height:42px;border-radius:50%;flex:none;background:rgba(255,255,255,.08) center/cover no-repeat}
.w-p-coin div{display:flex;flex-direction:column;min-width:0;flex:1}
.w-p-coin b{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.w-p-coin div span{font-size:12px;color:var(--mut);font-family:var(--mono)}
.w-p-mc{font-family:var(--disp);font-size:19px;font-weight:500;color:var(--green);font-variant-numeric:tabular-nums}
.w-p-desc{font-size:13px;line-height:1.5;color:#c3ccc7}
.w-p-desc:empty{display:none}
.w-p-chart{height:170px;flex:none;border-radius:12px;overflow:hidden;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.06)}
.w-p-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.w-p-stats div{display:flex;flex-direction:column;gap:2px;padding:9px 11px;border-radius:12px;background:rgba(255,255,255,.05)}
.w-p-stats span{font-size:10.5px;color:var(--mut)}
.w-p-stats b{font-family:var(--disp);font-size:16px;font-weight:500;font-variant-numeric:tabular-nums}
.w-p-work{list-style:none;display:flex;flex-direction:column;gap:6px}
.w-p-work li{font-size:12.5px;line-height:1.4;color:var(--mut);padding-left:12px;border-left:2px solid rgba(16,232,138,.4)}
.w-p-work li b{color:var(--ink);font-weight:500}
/* labels pinned to agents in the world */
.w-tag{position:absolute;left:0;top:0;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;gap:5px;will-change:transform,opacity;transition:opacity .25s}
.w-tag-name{display:inline-flex;align-items:center;gap:6px;height:23px;padding:0 9px;border-radius:999px;background:rgba(5,10,10,.8);border:1px solid var(--line);font-size:11px;font-weight:600;white-space:nowrap}
.w-tag-name em{font-style:normal;font-weight:500;color:var(--green);font-family:var(--mono);font-size:10px}
.w-tag-name u{text-decoration:none;font-weight:500;color:#dfe7e2;font-variant-numeric:tabular-nums}
.w-tag.is-master .w-tag-name{height:27px;font-size:12.5px;background:var(--green);color:#03130a;border-color:var(--green)}
.w-tag.is-master .w-tag-name em{color:#04351f}
.w-tag-say{max-width:210px;padding:6px 10px;border-radius:12px 12px 12px 3px;background:rgba(250,252,250,.96);color:#07110b;font-size:11.5px;line-height:1.35;font-weight:500;opacity:0;transform:translateY(6px) scale(.96);transition:opacity .3s,transform .3s;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.w-tag-say.is-on{opacity:1;transform:none}
.w-loader{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#07100f;transition:opacity .7s;font-size:13px;color:var(--mut)}
.w-loader div{display:flex;flex-direction:column;align-items:center;gap:14px}
.w-loader img{width:64px;height:64px;animation:wSpin 2.4s ease-in-out infinite}
@keyframes wSpin{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(60deg) scale(1.08)}}
.w-loader.is-done{opacity:0;pointer-events:none}
@media(max-width:980px){
 .w-top{gap:10px;padding:0 12px}
 .w-nav{display:none;position:fixed;top:60px;left:12px;right:12px;margin:0;flex-direction:column;border-radius:18px;padding:8px}
 .w-nav.is-open{display:flex}.w-nav a{padding:12px 14px;font-size:16px}
 .w-menu{display:flex}
 .w-pitch{left:12px;right:12px;top:6px;width:auto;padding:16px;gap:9px}.w-help{left:12px;top:6px}
 .w-steps{display:none}.w-lead{font-size:13px}
 .w-stats{left:12px;right:12px;bottom:58px;width:auto}
 .w-feed{display:none}.w-hint{display:none}
 .w-ctl{bottom:14px}
 .w-panel{left:12px;right:12px;top:auto;bottom:12px;width:auto;max-height:62vh}
}
@media(prefers-reduced-motion:reduce){.w-feed li,.w-loader img{animation:none}}
