:root{--paper:#eef2fb;--panel:rgba(255,255,255,.92);--ink:#16213e;--mut:#6b7590;--line:#dfe5f2;--cobalt:#2a4fd6;--cobalt2:#e6ecff;--ok:#1f9d63;--warn:#e08a00;--bad:#d64040;--xp:#7a3cf0;
--sh:0 6px 24px rgba(30,45,90,.10),0 1px 2px rgba(30,45,90,.08)}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:var(--paper);color:var(--ink);font:14px/1.35 "IBM Plex Sans",system-ui,sans-serif}
#scene{position:fixed;inset:0;width:100%;height:100%;display:block;cursor:grab}
#scene.drag{cursor:grabbing}
#labels{position:fixed;inset:0;pointer-events:none}
.tag{position:absolute;transform:translate(-50%,-100%);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:2px 8px;font:600 11px "IBM Plex Sans";white-space:nowrap;box-shadow:var(--sh);display:flex;gap:6px;align-items:center}
.tag i{width:7px;height:7px;border-radius:50%;background:var(--ok)}
.tag.idle i{background:#a5adc2}.tag.error i{background:var(--bad)}.tag.error{border-color:#f3c2c2;color:var(--bad)}
.tag .bar{width:36px;height:4px;border-radius:2px;background:var(--line);overflow:hidden}.tag .bar b{display:block;height:100%;background:var(--cobalt)}
.tag.sel{outline:2px solid var(--cobalt)}
.bar.top,header.bar{position:fixed;top:12px;left:12px;right:12px;height:52px;background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:14px;display:flex;align-items:center;gap:12px;padding:0 14px;box-shadow:var(--sh);z-index:5}
.brand{font:700 17px "Space Grotesk";display:flex;align-items:center;gap:8px}
.logo{width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,#4a6cff,#2a4fd6);transform:rotate(45deg) scale(.8)}
.site{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:6px 10px;font-weight:600}
.site .dot{width:8px;height:8px;border-radius:2px;background:var(--cobalt)}.chev{color:var(--mut)}
.chip{font:600 11px "JetBrains Mono";padding:4px 8px;border-radius:8px;letter-spacing:.04em}
.chip.sample{background:#fff4dc;color:#8a5a00;border:1px solid #f1d9a0}
.chip.live{background:#e7f7ef;color:var(--ok);display:flex;gap:6px;align-items:center}
.pulse{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:p 1.6s infinite}
@keyframes p{0%{box-shadow:0 0 0 0 rgba(31,157,99,.5)}100%{box-shadow:0 0 0 8px rgba(31,157,99,0)}}
.spacer{flex:1}
.me{display:flex;gap:8px;align-items:center}.me small{display:block;color:var(--mut);font-size:11px}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--xp);color:#fff;display:grid;place-items:center;font-weight:700}
.kpis{position:fixed;top:76px;left:12px;display:flex;gap:10px;z-index:4}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 14px;min-width:132px;box-shadow:var(--sh)}
.kpi small{display:block;color:var(--mut);font-size:11.5px}.kpi b{font:700 22px "Space Grotesk";margin-right:6px}
.kpi em{font-style:normal;font-size:11.5px;color:var(--warn)}.kpi em.up{color:var(--ok)}
.xpbar{height:5px;border-radius:3px;background:#ece5fd;margin-top:6px;overflow:hidden}.xpbar i{display:block;height:100%;width:40%;background:var(--xp);transition:width .6s}
.card{position:fixed;top:76px;right:12px;width:300px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--sh);z-index:4}
.cardhead{display:flex;gap:10px;align-items:center}.cardhead small{color:var(--mut);font:600 10.5px "JetBrains Mono"}.cardhead b{display:block;font:700 16px "Space Grotesk"}
.cardhead button{margin-left:auto;border:0;background:none;font-size:20px;color:var(--mut);cursor:pointer}
.ico{width:34px;height:34px;border-radius:9px;background:var(--cobalt2);display:grid;place-items:center;font-size:17px}
.state{display:inline-block;margin:10px 0 6px;padding:3px 9px;border-radius:7px;font-weight:600;font-size:12px;background:#e7f7ef;color:var(--ok)}
.state.idle{background:#eef0f5;color:var(--mut)}.state.error{background:#fde8e8;color:var(--bad)}
dl{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;margin:6px 0 10px;font-size:13px}dt{color:var(--mut)}dd{margin:0;text-align:right;font-weight:500}
.prog{height:6px;border-radius:3px;background:var(--line);overflow:hidden}.prog i{display:block;height:100%;background:var(--cobalt);transition:width .4s}
.act{margin-top:12px;width:100%;border:0;border-radius:9px;padding:9px;background:var(--cobalt);color:#fff;font-weight:600;cursor:pointer}
.quests{position:fixed;left:12px;bottom:110px;width:280px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 14px;box-shadow:var(--sh);z-index:4}
.quests h3{margin:2px 0 8px;font:700 13px "Space Grotesk";color:var(--mut);text-transform:uppercase;letter-spacing:.06em}
.quests ul,.quests ol{list-style:none;margin:0 0 10px;padding:0}
.quests li{margin-bottom:9px}.quests li .t{display:flex;justify-content:space-between;font-size:13px;font-weight:500}.quests li .t span{color:var(--xp);font:600 11px "JetBrains Mono"}
.quests li .qb{height:5px;border-radius:3px;background:var(--line);margin-top:4px;overflow:hidden}.quests li .qb i{display:block;height:100%;background:var(--xp);transition:width .5s}
.quests li.done .t{color:var(--ok)}.quests li.done .qb i{background:var(--ok)}
#crew li{display:flex;align-items:center;gap:8px;font-size:13px;margin-bottom:6px}#crew .lv{font:600 11px "JetBrains Mono";background:#ece5fd;color:var(--xp);border-radius:6px;padding:1px 6px}#crew .x{margin-left:auto;color:var(--mut);font:500 11px "JetBrains Mono"}
.timeline{position:fixed;left:12px;right:12px;bottom:12px;height:86px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:10px 18px;box-shadow:var(--sh);z-index:4}
.tlhead{display:flex;gap:14px;align-items:baseline;font-size:13px}.tlhead span{color:var(--mut)}.tlhead .due{margin-left:auto}
.steps{list-style:none;display:flex;margin:12px 0 0;padding:0}
.steps li{flex:1;position:relative;text-align:center;font-size:12px;color:var(--mut);padding-top:16px}
.steps li:before{content:"";position:absolute;top:0;left:50%;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:#fff;border:2px solid var(--line);z-index:1}
.steps li:after{content:"";position:absolute;top:6px;left:-50%;width:100%;height:2px;background:var(--line)}
.steps li:first-child:after{display:none}
.steps li.on{color:var(--ink);font-weight:600}.steps li.on:before{background:var(--cobalt);border-color:var(--cobalt)}.steps li.on:after{background:var(--cobalt)}
.steps li.now:before{box-shadow:0 0 0 5px rgba(42,79,214,.18)}
#toasts{position:fixed;top:76px;left:50%;transform:translateX(-50%);z-index:9;display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{background:#1b1640;color:#fff;border-radius:12px;padding:10px 16px;font-weight:600;box-shadow:0 10px 30px rgba(40,20,90,.35);display:flex;gap:10px;align-items:center;animation:t 3.6s forwards}
.toast b{color:#c9b3ff;font-family:"JetBrains Mono"}
@keyframes t{0%{opacity:0;transform:translateY(-10px) scale(.96)}8%{opacity:1;transform:none}85%{opacity:1}100%{opacity:0;transform:translateY(-6px)}}
@media (max-width:820px){.kpis{top:72px;left:8px;right:8px;overflow-x:auto}.kpi{min-width:120px}.quests{display:none}.card{top:auto;bottom:108px;left:8px;right:8px;width:auto}.me div,.site{display:none}header.bar{left:8px;right:8px}.timeline{left:8px;right:8px}}
body.embed header.bar .me{display:none}