:root{--glass: rgba(14, 20, 36, .62);--glass-brd: rgba(120, 160, 230, .22);--ink: #e9eefc;--muted: #93a0bd;font-family:Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;background:#070912;overflow:hidden}.app{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.app>div:first-child{position:absolute;top:0;right:0;bottom:0;left:0;width:100%!important;height:100%!important}.app canvas{display:block;width:100%!important;height:100%!important}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;color:var(--ink);padding:18px;display:grid;grid-template-columns:340px 1fr 300px;grid-template-rows:auto 1fr auto;gap:14px}.hud>*{pointer-events:auto}header{grid-column:1 / 4;display:flex;justify-content:space-between;align-items:flex-start}.brand h1{margin:0;font-size:30px;letter-spacing:4px;font-weight:800;background:linear-gradient(90deg,#3ba7ff,#b76bff 55%,#e0457b);-webkit-background-clip:text;background-clip:text;color:transparent}.brand p{margin:2px 0 0;color:var(--muted);font-size:13px;letter-spacing:1px}.status{display:flex;gap:10px;align-items:center}.badge{font-size:11px;font-weight:700;letter-spacing:1px;padding:5px 9px;border-radius:20px;border:1px solid var(--glass-brd);background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.badge.on{color:#37d67a;border-color:#37d67a66}.badge.off{color:#f2a04c;border-color:#f2a04c66}.badge.model{color:#8fbaff;text-transform:none}.clock{display:flex;flex-direction:column;align-items:flex-end;background:var(--glass);border:1px solid var(--glass-brd);border-radius:12px;padding:6px 12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.clock .big{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}.clock .sub{font-size:11px;color:var(--muted)}.left{grid-column:1;grid-row:2 / 4;display:flex;flex-direction:column;gap:14px;min-height:0}.right{grid-column:3;grid-row:2 / 4;display:flex;flex-direction:column;gap:14px;min-height:0;overflow-y:auto}.panel{background:var(--glass);border:1px solid var(--glass-brd);border-radius:16px;padding:14px 16px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 10px 40px #00000059}.panel h3{margin:0 0 10px;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:#c7d3ef}.panel h3 small{color:var(--muted);text-transform:none;letter-spacing:0}.gen{display:flex;align-items:baseline;gap:8px;margin-bottom:12px}.genN{font-size:44px;font-weight:800;line-height:1;background:linear-gradient(90deg,#37d67a,#3ba7ff);-webkit-background-clip:text;background-clip:text;color:transparent}.gen span:last-child{color:var(--muted);font-size:12px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.grid>div{background:#ffffff08;border-radius:10px;padding:8px 10px}.grid b{font-size:20px;font-variant-numeric:tabular-nums}.grid span{display:block;color:var(--muted);font-size:11px}.flow{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;color:var(--muted);font-size:11px;align-items:center}.flow span{background:#78a0e61f;padding:3px 7px;border-radius:6px;color:#cfe0ff}.eval{margin-top:12px}.evalhead{display:flex;align-items:baseline;gap:8px}.evalhead span{color:var(--muted);font-size:11px;flex:1}.evalhead span small{color:#6b7794}.evalhead b{font-size:22px;color:#37d67a;font-variant-numeric:tabular-nums}.evalhead i{color:var(--muted);font-style:normal;font-size:11px}.spark{width:100%;height:30px;margin-top:6px;display:block}.spark-empty{color:var(--muted);font-size:11px;margin-top:6px}.ctrl.active{border-color:#37d67a;color:#37d67a}.elorow{display:grid;grid-template-columns:46px 1fr 34px;align-items:center;gap:8px;margin:6px 0}.elorow .who{font-size:12px;text-transform:capitalize;color:#d6e0f7}.elorow .rating{font-size:12px;text-align:right;font-variant-numeric:tabular-nums;color:var(--muted)}.bar{height:9px;background:#ffffff0f;border-radius:6px;overflow:hidden}.bar>div{height:100%;border-radius:6px;background:linear-gradient(90deg,#3ba7ff,#b76bff);transition:width .6s ease}.feed{flex:1 1 auto;display:flex;flex-direction:column;min-height:140px}.feed-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding-right:4px}.feed-item{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;line-height:1.35}.feed-item .dot{width:8px;height:8px;border-radius:50%;margin-top:4px;flex:none}.ftext{color:#d7ddf0}.ftext b{color:#fff}footer{grid-column:1 / 4;display:flex;align-items:center;gap:14px}.ctrl{pointer-events:auto;cursor:pointer;background:var(--glass);color:var(--ink);border:1px solid var(--glass-brd);border-radius:10px;padding:8px 14px;font-weight:600;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.ctrl:hover{border-color:#3ba7ff88}.hint{color:var(--muted);font-size:12px}.district-label{transform:translateY(-6px);background:#090d18b8;border:1px solid;border-radius:10px;padding:5px 9px;text-align:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);white-space:nowrap}.district-label b{display:block;font-size:13px}.district-label span{font-size:10px;color:#9fb0d0}.district-label.active{box-shadow:0 0 22px #78b4ff80}.district-label .pips{display:block;font-style:normal;font-size:9px;letter-spacing:2px;color:#ffd166;margin-top:1px}.gate-label{background:#090d18a8;border:1px solid rgba(127,212,255,.45);border-radius:10px;padding:4px 9px;font-size:11px;color:#bfe9ff;letter-spacing:1px;white-space:nowrap;text-transform:uppercase;box-shadow:0 0 18px #7fd4ff40}.name-tag{background:#090d18cc;border:1px solid;border-radius:20px;padding:3px 9px;font-size:12px;white-space:nowrap}.name-tag i{color:#93a0bd;font-style:normal;font-size:10px;margin-left:4px}.bubble{max-width:220px;background:#0d1424ee;border:1px solid;border-radius:12px;padding:7px 11px;font-size:12px;line-height:1.35;color:#eaf0ff;box-shadow:0 6px 24px #0006}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-thumb{background:#78a0e64d;border-radius:3px}.add-wrap{position:fixed;left:18px;bottom:66px;z-index:20;display:flex;flex-direction:column;gap:10px;align-items:flex-start}.add-btn{pointer-events:auto;cursor:pointer;font-weight:700;font-size:13px;color:#fff;border:none;border-radius:12px;padding:10px 15px;background:linear-gradient(90deg,#3ba7ff,#b76bff);box-shadow:0 8px 24px #3c5aa066}.add-btn:hover{filter:brightness(1.08)}.add-panel{pointer-events:auto;width:300px;background:var(--glass, rgba(14,20,36,.72));border:1px solid var(--glass-brd, rgba(120,160,230,.22));border-radius:16px;padding:14px 16px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 14px 44px #0006;color:var(--ink,#e9eefc);display:flex;flex-direction:column;gap:9px}.add-panel h3{margin:0 0 2px;font-size:13px;letter-spacing:1px;text-transform:uppercase}.add-panel h3 small{color:var(--muted,#93a0bd);text-transform:none;letter-spacing:0}.add-panel label{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--muted,#93a0bd);flex:1}.add-panel input,.add-panel select{background:#ffffff14;color:inherit;border:1px solid rgba(120,160,230,.3);border-radius:8px;padding:7px 9px;font-size:13px}.add-panel input[type=color]{padding:2px;height:34px}.add-panel .row{display:flex;gap:8px}.add-panel .row.end{justify-content:flex-end;margin-top:4px}.add-panel .warn{color:#ffb14e;font-size:11px;margin:0;line-height:1.35}.add-panel button{cursor:pointer;border-radius:9px;padding:8px 13px;font-weight:700;font-size:12.5px;border:none}.add-panel .ghost{background:transparent;color:var(--muted,#93a0bd);border:1px solid rgba(120,160,230,.3)}.add-panel .go{background:linear-gradient(90deg,#37d67a,#3ba7ff);color:#06210f}.add-panel .go:disabled{opacity:.6;cursor:default}.residents{flex:none;max-height:42%;overflow-y:auto}.resrow{pointer-events:auto;cursor:pointer;display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:8px;width:100%;margin:3px 0;padding:7px 9px;border-radius:10px;background:#ffffff08;border:1px solid transparent;border-left:3px solid var(--rc, #55617a);color:var(--ink);font:inherit;font-size:12.5px;text-align:left;transition:transform .12s,background .12s}.resrow:hover{background:#ffffff14;transform:translate(2px)}.resrow.sel{background:#3ba7ff24;border-color:#3ba7ff66}.resrow .dot{width:9px;height:9px;border-radius:50%}.resrow .rname{font-weight:600;color:#e8eeff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.resrow .rmodel{font-size:10.5px;color:var(--muted);font-family:ui-monospace,monospace;white-space:nowrap}.drawer-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;background:#04070f66;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);pointer-events:auto;animation:fade .2s ease}@keyframes fade{0%{opacity:0}}.drawer{position:fixed;top:0;right:0;z-index:31;width:400px;max-width:94vw;height:100%;overflow-y:auto;pointer-events:auto;color:var(--ink);background:linear-gradient(180deg,#11172af7,#090d18fa);border-left:1px solid var(--accent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:-24px 0 70px #0009;padding:22px 22px 46px;animation:slideIn .3s cubic-bezier(.16,1,.3,1)}@keyframes slideIn{0%{transform:translate(40px);opacity:0}}.drawer-x{position:absolute;top:16px;right:16px;width:30px;height:30px;border-radius:8px;background:#ffffff0f;border:1px solid var(--glass-brd);color:var(--muted);cursor:pointer;font-size:14px}.drawer-x:hover{color:#fff;border-color:var(--accent)}.drawer-head{display:flex;gap:14px;align-items:center;margin-bottom:14px;padding-right:34px}.drawer-ava{width:60px;height:60px;border-radius:16px;display:grid;place-items:center;font-size:32px;border:1.5px solid;flex:none}.drawer-id h2{margin:0;font-size:23px;letter-spacing:.3px}.drawer-model{display:inline-block;margin-top:3px;font-size:12px;color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent);padding:2px 8px;border-radius:6px}.drawer-role{font-size:12px;color:var(--muted);margin-top:4px}.drawer-now{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#c4d0ea;background:#ffffff0a;border-radius:10px;padding:9px 12px;margin-bottom:18px}.drawer-now b{color:#fff;text-transform:capitalize}.live-dot{width:8px;height:8px;border-radius:50%;background:#55617a;flex:none}.live-dot.on{background:#37d67a;box-shadow:0 0 8px #37d67a;animation:pulse 1.4s infinite}@keyframes pulse{50%{opacity:.4}}.drawer-muted{color:var(--muted);font-size:12.5px;font-style:italic;padding:4px 0}.drawer-sec{margin-bottom:22px}.drawer-sec h4{margin:0 0 11px;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#cdd8ef}.drawer-sec h4 small{display:block;text-transform:none;letter-spacing:0;font-weight:400;font-size:11px;color:var(--muted);margin-top:2px}.say{margin:0 0 10px;padding:10px 13px;background:#ffffff09;border-left:3px solid var(--accent);border-radius:0 10px 10px 0;font-size:13px;line-height:1.5;color:#e8eefb}.say cite{display:block;margin-top:6px;font-size:10.5px;color:var(--muted);font-style:normal}.mem{font-size:12.5px;line-height:1.45;color:#cfd8ee;margin:0 0 8px;padding-left:10px;border-left:2px solid var(--glass-brd)}.mem i{color:var(--accent);font-style:normal;font-size:10px;text-transform:uppercase;letter-spacing:.5px;margin-right:6px}.mem-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.chip{font-size:10.5px;color:#c8d3ea;background:#ffffff0d;border:1px solid var(--glass-brd);padding:3px 9px;border-radius:20px}.drawer-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.drawer-stats>div{background:#ffffff0a;border-radius:10px;padding:10px 6px;text-align:center}.drawer-stats b{font-size:19px;font-variant-numeric:tabular-nums}.drawer-stats b.w{color:#37d67a}.drawer-stats b.l{color:#ff6f91}.drawer-stats span{display:block;font-size:9px;color:var(--muted);margin-top:3px;text-transform:uppercase;letter-spacing:.4px}.drawer-note{font-size:11px;line-height:1.5;color:#8ea1c2;margin:12px 0 0;border-left:2px solid var(--glass-brd);padding-left:10px}.mtabs{display:none}@media (max-width: 720px){.hud{display:flex;flex-direction:column;padding:10px;gap:8px}header{flex:none;align-items:center}.brand h1{font-size:17px;letter-spacing:2px}.brand p{display:none}.status{gap:6px}.badge{font-size:9px;padding:4px 7px}.badge.model{display:none}.clock{padding:3px 8px}.clock .big{font-size:15px}.clock .sub{font-size:9px}.mtabs{display:flex;flex:none;gap:6px;pointer-events:auto}.mtabs button{flex:1;background:var(--glass);border:1px solid var(--glass-brd);color:var(--muted);border-radius:10px;padding:8px 4px;font-size:11.5px;font-weight:700;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);white-space:nowrap}.mtabs button.on{color:#fff;border-color:#7fd4ff88;background:#7fd4ff24}.left,.right{flex:1;min-height:0;display:none;flex-direction:column;gap:8px;overflow:hidden}.hud[data-tab=feed] .left,.hud[data-tab=town] .left{display:flex}.hud[data-tab=loop] .right{display:flex;overflow-y:auto}.hud[data-tab=feed] .panel.residents,.hud[data-tab=town] .feed{display:none}.hud[data-tab=town] .panel.residents{flex:1;max-height:none;margin-top:0}.feed{flex:1;max-height:none}.feed-item{font-size:13px;line-height:1.4}footer{flex:none;gap:8px}.ctrl{padding:7px 10px;font-size:11.5px}.hint,.add-wrap{display:none}.drawer{width:100vw;max-width:100vw;padding:16px 14px 32px}.drawer-id h2{font-size:19px}.district-label b{font-size:11px}.district-label span{display:none}.name-tag{font-size:10px;padding:2px 7px}.name-tag i{display:none}}