
.who.one p{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.who.one{min-width:0}.who.one .meta{margin-left:6px}#sega .it{padding:10px 18px}
:root{--bg:#0A090D;--card:#15141a;--card2:#1c1b22;--ink:#F7F5FA;--mute:rgba(247,245,250,.7);--faint:rgba(247,245,250,.48);--line:rgba(255,255,255,.1);--line2:rgba(255,255,255,.22);--spectrum:linear-gradient(90deg,#B61DFF,#CE13A8 33%,#FF0000);--live:#3BE08A;--ok:#2fa36b;--wait:#FFB23E;--back:#FF6B6B;--soft:#1c1b22;--ink2:rgba(247,245,250,.7);--ink3:rgba(247,245,250,.48);color-scheme:dark}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Manrope,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}img{display:block;max-width:100%;height:auto}button,input{font:inherit}button{cursor:pointer}
h1,h2,h3,p,a,li,span{overflow-wrap:anywhere}
:focus-visible{outline:2px solid #CE13A8;outline-offset:2px}[hidden]{display:none!important}
.w{max-width:1280px;margin:0 auto;padding:0 16px}@media(min-width:768px){.w{padding:0 32px}}
header.w{padding-top:22px}.top{display:flex;align-items:center;justify-content:space-between;gap:12px}.logo{height:22px;width:auto}
.crumbs{font-size:14px;color:var(--mute);display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 0}.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--ink)}
.lay{display:grid;gap:28px;padding-bottom:72px;margin-top:8px}
@media(min-width:960px){.lay{grid-template-columns:230px minmax(0,1fr)}.navd{position:sticky;top:16px;align-self:start}.nav{max-height:calc(100vh - 32px);overflow:auto}.navd>summary{display:none}}
main{min-width:0}
h1{font-size:clamp(30px,5vw,48px);line-height:1.05;letter-spacing:-.03em;margin:12px 0 8px}
.lead{color:var(--mute);max-width:66ch;margin:0}
section{padding:40px 0 0}
h2.sec{font-size:24px;letter-spacing:-.02em;margin:0 0 6px;display:flex;align-items:center;gap:12px}
h2.sec .n{display:grid;place-items:center;width:34px;height:34px;flex:none;background:var(--spectrum);font:700 14px Unbounded,sans-serif}
h2.sec .cnt{font:600 14px Manrope;color:var(--faint)}
.sub{color:var(--mute);margin:0 0 12px;max-width:66ch;font-size:15px}
.it{display:grid;gap:8px 18px;padding:16px 18px;background:var(--card);border:1px solid var(--line);margin-top:10px;text-decoration:none}
@media(min-width:760px){.it{grid-template-columns:1fr auto;align-items:center}.it.opt{grid-template-columns:200px 1fr auto}}
a.it:hover{border-color:var(--line2);background:var(--card2)}
.it b{font-size:17px}.it p{margin:2px 0 0;color:var(--mute);font-size:15px}
.it.main{border-color:#CE13A8;box-shadow:0 0 0 1px #CE13A8}
.go{display:flex;flex-wrap:wrap;gap:6px}
.go a,.go span.b,.btn{text-decoration:none;font-size:14px;font-weight:800;min-height:42px;display:inline-flex;align-items:center;justify-content:center;padding:0 14px;border:1px solid var(--line2);white-space:nowrap;background:transparent;color:var(--ink);font-family:inherit;cursor:pointer}
.go a:hover,.btn:hover,a.it:hover .b{background:#fff;color:#0A090D}
.go .pri,.btn.pri{background:var(--spectrum);border-color:transparent;color:#fff}
.th{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border:1px solid var(--line2);background:#000}
.th.placeholder{display:grid;place-items:center;font-size:12px;color:var(--faint)}
.st{display:inline-block;font-size:11px;font-weight:800;padding:3px 7px;margin-left:8px;vertical-align:2px;color:#0A090D;background:var(--c)}
.who{display:flex;align-items:center;gap:10px}
.av{width:34px;height:34px;flex:none;border-radius:50%;display:inline-grid;place-items:center;font-weight:800;font-size:13px;color:#fff;background:#3a3940}
.ldot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--live);margin-right:6px;box-shadow:0 0 0 3px rgba(59,224,138,.18)}.ldot.idle{background:var(--faint);box-shadow:none}
.meta{color:var(--faint);font-size:13px}
.search{width:100%;min-height:44px;background:var(--card);border:1px solid var(--line2);color:var(--ink);padding:0 14px;margin-bottom:6px}
.navd>summary{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;padding:0 14px;border:1px solid var(--line2);font-weight:800}.navd>summary::-webkit-details-marker{display:none}.navd>summary::after{content:"▾";margin-left:auto}.navd[open]>summary::after{content:"▴"}
.nav a{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--mute);padding:7px 10px;font-size:15px}
.nav a span{margin-left:auto;color:var(--faint);font-size:13px}
.nav a:hover,.nav a.on{color:var(--ink);background:var(--card)}.nav a.on{box-shadow:inset 2px 0 0 #CE13A8}
.nav .h{font-size:12px;font-weight:800;color:var(--faint);margin:16px 10px 4px;text-transform:uppercase;letter-spacing:.06em}
.nav .mrow{display:flex;align-items:stretch}.nav .mrow a{flex:1;padding-left:4px}.nav .tg{flex:none;width:28px;background:none;border:0;color:var(--faint);cursor:pointer;font:inherit;font-size:15px;line-height:1;transition:transform .15s}.nav .tg:hover{color:var(--ink)}.nav .tg[aria-expanded=true]{transform:rotate(90deg)}.nav .tg:focus-visible{outline:2px solid #CE13A8;outline-offset:-2px}
.nav .s{padding-left:34px;font-size:14px}.nav .s i{width:8px;height:8px;border-radius:50%;flex:none}.nav .s i.k{border-radius:0;background:var(--spectrum)}
.proto{display:grid;gap:10px;margin-top:12px}@media(min-width:1100px){.proto{grid-template-columns:minmax(0,1fr) 300px}}
.frame{background:#000;border:1px solid var(--line2);overflow:hidden;min-width:0}.frame iframe{width:100%;border:0;display:block;height:560px;background:#0A090D}.frame.m{max-width:300px}
.fakeimg{width:100%;height:auto;max-height:560px;object-fit:cover;object-position:top}.frame .placeholder.fakeimg{min-height:300px}.fakebox{min-height:360px;display:grid;place-content:center;gap:6px;text-align:center;padding:24px;background:radial-gradient(circle at 30% 20%,rgba(182,29,255,.22),transparent 60%),radial-gradient(circle at 80% 80%,rgba(255,0,0,.16),transparent 55%),#0d0c11}.fakebox p{margin:0;color:var(--mute)}
.fbar{display:flex;justify-content:space-between;padding:8px 12px;font-size:13px;color:var(--mute);border-bottom:1px solid var(--line)}
.grid{display:grid;gap:10px;margin-top:10px}@media(min-width:700px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:1100px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.grid .it{margin-top:0;display:flex;flex-direction:column;gap:12px}.grid .it .go{margin-top:auto}
.empty{color:var(--mute);padding:12px 0}
/* screen page (versions) */
.rv{display:grid;gap:24px}@media(min-width:1440px){.rv{grid-template-columns:minmax(0,1fr) 240px}}.rv>div{min-width:0}
.rv-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.stats{display:flex;gap:24px}.stats div{text-align:right}.stats b{display:block;font-size:24px}.stats small{color:var(--mute);font-size:12px}
.decision{margin:20px 0 0;padding:14px 16px;border:1px solid var(--ok);background:rgba(47,163,107,.12);font-size:15px}
.tl-data{padding:20px 0 0}.data{display:inline-flex;border:1px solid var(--line2);padding:3px}.data button{border:0;background:none;padding:6px 12px;font-size:13px;color:var(--mute)}.data button.on{background:#fff;color:#0A090D}.data button:disabled{cursor:not-allowed;color:var(--faint)}.datahint{font-size:12px;color:var(--faint);margin:6px 0 0}
.notice{font-size:14px;color:var(--mute)}.notice:not(:empty){padding:12px 0}.notice input,.figma-prompt input{display:block;width:100%;margin-top:8px;background:var(--card);color:var(--ink);border:1px solid var(--line2);padding:8px}
.version{scroll-margin-top:24px;margin-top:12px;background:var(--card);border:1px solid var(--line);padding:16px}.version:target{border-color:#CE13A8;box-shadow:0 0 0 1px #CE13A8}
.ver{display:grid;gap:16px}@media(min-width:900px){.ver{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) 168px;align-items:start}}
.ver .bul{display:none}
.shots{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,1fr);gap:8px;align-items:start}.shots figure{margin:0;min-width:0}.shots figcaption{font-size:11px;color:var(--faint);margin-bottom:4px}.shots img{border:1px solid var(--line2)}
.info h2{font-size:17px;margin:0 0 8px}.info h2 a{text-decoration:none}
.note{white-space:pre-wrap;margin:8px 0 0;color:var(--mute);font-size:15px}
.acts{display:flex;flex-wrap:wrap;gap:6px;align-content:start}.acts .muted{font-size:12px;line-height:1.4}@media(min-width:900px){.ver>.acts{flex-direction:column}}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:3px 9px;background:var(--card2);color:var(--mute);margin:0 6px 6px 0;max-width:100%}
.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--faint)}
.s-ok .dot{background:var(--ok)}.s-wait .dot{background:var(--wait)}.s-back .dot{background:var(--back)}.s-ok{color:#7fe0ad}.s-wait{color:var(--wait)}.s-back{color:var(--back)}
.figma-prompt{display:block;margin:12px 0;font-size:13px;color:var(--mute)}
.version details{margin-top:12px;font-size:14px}.version summary{cursor:pointer;color:var(--mute);padding:6px 0}.version ol{padding-left:20px}.version li{margin:8px 0}
.branches{color:var(--faint);font-size:12px}.muted{color:var(--mute)}.small{font-size:13px}
.placeholder{display:grid;place-items:center;min-height:80px;font-size:12px;color:var(--faint);background:var(--card2);text-align:center}
.ppl{min-width:0}.ppl h2{font-size:12px;letter-spacing:.08em;color:var(--faint);text-transform:uppercase;margin:0 0 10px}.ppl h2:not(:first-child){margin-top:24px}
.pp{display:flex;align-items:center;gap:10px;font-size:14px;margin-bottom:10px}.pp .av{width:28px;height:28px;font-size:12px}.pp .pill{margin-left:auto}
.cmt{font-size:14px;margin:0 0 14px}.cmt a{color:var(--mute)}
.pn{display:flex;justify-content:space-between;gap:12px;margin-top:36px}.pn a{text-decoration:none;font-weight:800;padding:12px 16px;border:1px solid var(--line2)}.pn a:hover{background:#fff;color:#0A090D}
.generated{color:var(--faint);font-size:12px;margin-top:40px}
/* canvas page */
body.kv{height:100vh;overflow:hidden}
.cbar{position:fixed;left:0;right:0;top:0;height:64px;z-index:5;display:flex;align-items:center;gap:14px;padding:0 16px;background:rgba(10,9,13,.95);border-bottom:1px solid var(--line)}
.cbar .crumbs{margin:0}.cbar .sp{flex:1}
.cvwrap{position:fixed;inset:64px 0 0 0;overflow:hidden;background:#0d0c11 radial-gradient(rgba(255,255,255,.09) 1px,transparent 1px) 0 0/22px 22px;cursor:grab;touch-action:none}.cvwrap.drag{cursor:grabbing}
.cv{position:absolute;left:0;top:0;transform-origin:0 0;width:2860px;height:1800px}
.grp{position:absolute;width:520px;padding:18px;background:rgba(21,20,26,.92);border:1px solid var(--line);border-top:3px solid var(--c)}
.gh{display:flex;justify-content:space-between;align-items:center}.gh b{font:700 20px Unbounded,sans-serif;color:var(--c)}.gh span{font-weight:800;color:var(--faint)}
.cc{display:block;text-decoration:none;margin-top:14px;padding:10px;background:var(--card2);border:1px solid var(--line);transition:opacity .2s}.cc:hover{border-color:var(--c)}
.cc img,.cc .placeholder{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border:1px solid var(--line);margin-bottom:8px}.cc b{display:block;font-size:16px}
.tools{display:flex;gap:6px;flex-wrap:wrap}.tools.br{position:absolute;right:12px;bottom:12px;z-index:3}
.chip{min-height:38px;display:inline-flex;align-items:center;padding:0 12px;background:#15141a;border:1px solid var(--line2);color:var(--ink);font:700 13px Manrope;cursor:pointer}.chip.on{background:#fff;color:#0A090D}
.hint{position:absolute;left:12px;bottom:12px;z-index:3;font-size:12px;color:var(--faint);background:rgba(10,9,13,.8);padding:6px 10px}
@media(max-width:800px){.cbar .crumbs,.cbar .tools,.hint{display:none}}
