:root{color-scheme:dark;--bg-app: #0a0b0f;--bg-panel: #101218;--bg-raised: #161920;--bg-overlay: #1c2029;--bg-hover: rgb(255 255 255 / .05);--bg-active: rgb(255 255 255 / .08);--bg-map: #0b0c1a;--text: #e9eaf0;--text-strong: #ffffff;--muted: rgb(233 234 240 / .58);--faint: rgb(233 234 240 / .38);--line: rgb(255 255 255 / .07);--line-strong: rgb(255 255 255 / .14);--accent: #9b7bff;--accent-soft: rgb(155 123 255 / .16);--live: #f0475c;--siren-red: #ff3b4e;--siren-blue: #3b7bff;--radius-sm: 6px;--radius: 10px;--radius-lg: 14px;--shadow-sm: 0 1px 2px rgb(0 0 0 / .4);--shadow: 0 6px 20px rgb(0 0 0 / .45), 0 1px 3px rgb(0 0 0 / .4);--shadow-lg: 0 12px 32px rgb(0 0 0 / .55), 0 2px 6px rgb(0 0 0 / .4);--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-spring: cubic-bezier(.34, 1.4, .64, 1);--hover: 75ms;--base: .22s;--slow: .36s;--font: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif}*{box-sizing:border-box}body{height:100dvh;margin:0;background:var(--bg-app);color:var(--text);font:14px/1.4 var(--font);-webkit-font-smoothing:antialiased}#root{height:100%}.app{display:grid;height:100%;grid-template:0 minmax(0,1fr) auto / 320px minmax(0,1fr);grid-template-areas:"mini main" "drawer main" "reports reports"}.app:not([data-streams="0"]){grid-template-rows:220px minmax(0,1fr) auto}button,input{font:inherit;color:inherit}button{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}button:focus-visible,.reports-list:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;border:0;clip-path:inset(50%);white-space:nowrap}*{scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .14) transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{border:2px solid transparent;border-radius:999px;background:#ffffff24 padding-box}::-webkit-scrollbar-track{background:transparent}.row__face,.group__faces span,.marker__face,.marker-stack__face{position:relative;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:var(--bg-overlay);font-weight:700}.row__face img,.group__faces img,.marker__face img,.marker-stack__face img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}@keyframes pop-in{0%{opacity:0;scale:.6}}@keyframes fade-in{0%{opacity:0}}@keyframes rise-in{0%{opacity:0;translate:0 8px}}@keyframes pin-in{0%{opacity:0;scale:.85}}@keyframes slide-in{0%{opacity:0;translate:-12px 0;scale:.96}}@keyframes fade-out{to{opacity:0;scale:.94}}@keyframes siren{0%,to{border-color:var(--siren-red);box-shadow:0 0 0 3px #ff3b4e8c,0 0 16px 6px #ff3b4e80}50%{border-color:var(--siren-blue);box-shadow:0 0 0 3px #3b7bff8c,0 0 16px 6px #3b7bff80}}.drawer{grid-area:drawer;display:flex;min-height:0;flex-direction:column;border-right:1px solid var(--line);background:var(--bg-panel)}.title{margin:0;padding:14px 16px 8px;color:var(--text-strong);font-family:"Barlow Condensed",var(--font);font-size:22px;font-style:italic;font-weight:700;letter-spacing:.06em;line-height:1;text-align:center}.groups{display:flex;flex:0 1 auto;max-height:40%;min-height:0;flex-direction:column;gap:4px;padding:0 10px;overflow-y:auto;overscroll-behavior:contain}.group{display:grid;flex-shrink:0;grid-template:auto auto / auto minmax(0,1fr);align-items:center;column-gap:10px;border:0;border-radius:var(--radius);padding:8px 10px;background:var(--bg-raised);text-align:left;cursor:pointer;transition:background-color var(--hover) ease,translate var(--base) var(--ease-out)}.group:hover,.group:focus-visible{background:var(--bg-overlay)}.group:active{translate:0 1px}.group__faces{display:flex}.group__faces span{width:26px;height:26px;border:2px solid var(--bg-raised);font-size:11px;transition:border-color var(--hover) ease}.group:hover .group__faces span{border-color:var(--bg-overlay)}.group__faces span+span{margin-left:-9px}.group__place{overflow:hidden;color:var(--muted);font-size:12px;text-align:right;text-overflow:ellipsis;white-space:nowrap}.group__names{grid-column:1 / -1;overflow:hidden;margin-top:5px;color:var(--text);font-size:12px;font-weight:500;text-overflow:ellipsis;white-space:nowrap}.streamer-search{display:flex;flex:1;min-height:0;flex-direction:column}.search{margin:10px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:8px 12px;background:var(--bg-app);outline:none;transition:border-color var(--hover) ease,box-shadow var(--base) var(--ease-out)}.search::placeholder{color:var(--faint)}.search:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.list{flex:1;min-height:0;margin:0;padding:0 8px 8px;overflow-y:auto;list-style:none}.list>li{position:relative}.list>li:before{content:"";position:absolute;top:50%;left:-8px;width:4px;height:8px;border-radius:0 4px 4px 0;background:var(--accent);opacity:0;translate:-4px -50%;transition:opacity var(--base) var(--ease-out),translate var(--base) var(--ease-out),height var(--base) var(--ease-out)}.list>li.open:before{height:24px;opacity:1;translate:0 -50%}.row{display:grid;width:100%;grid-template:auto auto / 34px minmax(0,1fr) auto;column-gap:10px;border:0;border-radius:var(--radius-sm);padding:7px 8px;background:none;text-align:left;cursor:pointer;transition:background-color var(--hover) ease}.row:hover,.row:focus-visible{background:var(--bg-hover)}.open .row{background:var(--accent-soft)}.row__face{grid-row:span 2;height:34px}.row__name,.row__sub,.row__zone{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row__name{color:var(--text-strong);font-weight:600}.row__viewers,.row__sub,.row__zone{color:var(--muted);font-size:12px}.row__viewers{justify-self:end;text-align:right}.row__viewers:before{content:"";display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:var(--live);vertical-align:1px}.row__zone{max-width:120px;text-align:right}.near .row{background:#ffffff09}.row__zone.near{color:#e9eaf0d9}.list .separator{height:1px;margin:6px 8px;background:var(--line)}.list .separator:before{display:none}.map{grid-area:main;position:relative;overflow:hidden;background:var(--bg-map);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;transition:opacity var(--base) var(--ease-out)}.map:active{cursor:grabbing}.world{position:absolute;top:0;left:0;width:743.33px;height:1041.78px;transform-origin:0 0}.world img{display:block;width:100%;height:100%;pointer-events:none}.dots,.map-reports{position:absolute;inset:0;pointer-events:none}.app:not([data-streams="0"]) .map{grid-area:mini;border-right:1px solid var(--line);border-bottom:1px solid var(--line);cursor:pointer;animation:fade-in var(--slow) var(--ease-out)}.app:not([data-streams="0"]) .map:hover{opacity:.6}.app:not([data-streams="0"]) .marker,.app:not([data-streams="0"]) .marker-stack{pointer-events:none}.marker{--ring: #ffffff;position:absolute;top:-15px;left:-15px;width:30px;height:30px;pointer-events:auto}.marker:hover{z-index:3}.marker__body{position:relative;width:100%;height:100%;animation:pop-in var(--base) var(--ease-spring);transition:scale var(--base) var(--ease-spring)}.marker:hover .marker__body{scale:1.22}.marker__face{z-index:1;width:100%;height:100%;border:2px solid var(--ring);padding:0;box-shadow:0 2px 6px #0000008c;font-size:12px;cursor:pointer;transition:border-color var(--base) ease,filter var(--base) ease}.marker__arrow{display:none;position:absolute;inset:-14px;z-index:0;pointer-events:none;rotate:var(--heading);filter:drop-shadow(0 1px 1.5px rgb(0 0 0 / .85));transition:rotate .45s var(--ease-out)}.marker--heading .marker__arrow{display:block}.marker__arrow:before{content:"";position:absolute;top:0;left:50%;width:14px;height:12px;background:var(--ring);clip-path:polygon(50% 0,100% 100%,50% 74%,0 100%);translate:-50% 0;transition:background-color var(--base) ease}.marker--open{--ring: var(--accent);z-index:2}.marker--lights .marker__face{animation:siren 1.1s ease-in-out infinite}.marker--downed .marker__face{filter:grayscale(1) brightness(.7)}.marker__downed{display:none;position:absolute;right:-5px;bottom:-5px;z-index:2;width:15px;height:15px;border:1.5px solid #fff;border-radius:50%;background:#d91e18;font-size:9px;line-height:12px;text-align:center;pointer-events:none}.marker--downed .marker__downed{display:block;animation:pop-in var(--base) var(--ease-spring)}.marker-stack{position:absolute;top:0;left:0;transform:translate(-50%,-50%);transform-origin:0 0;display:inline-flex;align-items:center;gap:7px;border:2px solid rgb(255 255 255 / .85);border-radius:999px;padding:3px 10px 3px 3px;background:var(--bg-raised);box-shadow:var(--shadow);pointer-events:auto;cursor:pointer;animation:pop-in var(--base) var(--ease-spring);transition:background-color var(--hover) ease,border-color var(--base) ease,scale var(--base) var(--ease-spring)}.marker-stack:hover{z-index:3;border-color:#fff;background:var(--bg-overlay);scale:1.08}.marker-stack--open{border-color:var(--accent)}.marker-stack--lights{animation:pop-in var(--base) var(--ease-spring),siren 1.1s ease-in-out infinite}.marker-stack__faces{display:flex}.marker-stack__face{flex:none;width:28px;height:28px;border:2px solid var(--bg-raised);font-size:11px}.marker-stack__face+.marker-stack__face{margin-left:-11px}.marker-stack__face.is-open{border-color:var(--accent)}.marker-stack__face.is-downed{filter:grayscale(1) brightness(.7)}.marker-stack__count{color:var(--text-strong);font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}.map-report{position:absolute;top:0;left:0;border:0;border-radius:999px;padding:5px 10px;background:var(--report-bg);box-shadow:var(--shadow);color:var(--report-color);font-size:11px;font-weight:700;letter-spacing:.01em;white-space:nowrap;pointer-events:auto;cursor:pointer;transform:translate(-50%);transform-origin:0 100%;animation:pin-in var(--base) var(--ease-spring);transition:background-color var(--hover) ease,scale var(--base) var(--ease-spring)}.map-report:after{content:"";position:absolute;bottom:-5px;left:50%;width:8px;height:8px;background:var(--report-bg);translate:-50% 0;rotate:45deg;transition:background-color var(--hover) ease}.map-report:hover{z-index:1;background:var(--report-hover);scale:1.06}.map-report:hover:after{background:var(--report-hover)}.stage{grid-area:main;display:none;overflow:auto;align-content:start;grid-template-columns:repeat(auto-fit,minmax(534px,1fr));grid-auto-rows:max-content;gap:10px;padding:10px}.app:not([data-streams="0"]) .stage{display:grid;animation:fade-in var(--base) var(--ease-out)}.stage[data-count="1"]{grid-template:minmax(0,1fr) / minmax(400px,1fr)}.card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--bg-panel);box-shadow:var(--shadow-sm);animation:rise-in var(--slow) var(--ease-out);transition:border-color var(--base) ease,box-shadow var(--base) ease}.card.focused{border-color:#9b7bff8c;box-shadow:0 0 0 1px #9b7bff33,var(--shadow)}.card header{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 14px}.card__name{flex:1;overflow:hidden;color:var(--text-strong);font-weight:600;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;transition:color var(--hover) ease}.card__name:hover{color:var(--accent)}.card__close{display:grid;width:30px;height:30px;flex:none;place-items:center;border:0;border-radius:var(--radius-sm);padding:0;background:none;color:var(--muted);cursor:pointer;transition:background-color var(--hover) ease,color var(--hover) ease}.card__close:hover{background:var(--bg-active);color:var(--text-strong)}.player{flex:none;aspect-ratio:16 / 9;min-width:400px;min-height:300px;background:#000}.stage[data-count="1"] .player{flex:1 1 0;aspect-ratio:auto}.player iframe{display:block;width:100%;height:100%;border:0;color-scheme:normal;opacity:0;transition:opacity var(--slow) var(--ease-out)}.player iframe.loaded{opacity:1}.report--crime{--report-color: #ff8a96;--report-bg: #2a171d;--report-hover: #3a1f27;--report-tint: rgb(255 138 150 / .14)}.report--social{--report-color: #62e0c4;--report-bg: #12261f;--report-hover: #18352b;--report-tint: rgb(98 224 196 / .13)}.report--lore{--report-color: #c6a6ff;--report-bg: #1f1830;--report-hover: #2b2142;--report-tint: rgb(198 166 255 / .14)}.report-chips{display:flex;flex:none;gap:4px}.report-chip{display:inline-flex;min-height:30px;align-items:center;justify-content:center;gap:6px;border:0;border-radius:999px;padding:4px 11px;background:var(--report-tint);color:var(--report-color);font-size:12px;font-weight:600;cursor:pointer;transition:background-color var(--hover) ease,opacity var(--base) ease,scale var(--hover) var(--ease-out)}.report-chip:hover:enabled{background:color-mix(in srgb,var(--report-color) 24%,transparent)}.report-chip:active:enabled{scale:.95}.report-chip:disabled{opacity:.4;cursor:not-allowed}.report-chip.report-chip--sent:disabled{background:color-mix(in srgb,var(--report-color) 30%,transparent);opacity:1}.report-chip__symbol{display:inline-block;min-width:1em;text-align:center}.report-chip--sent .report-chip__symbol{animation:pop-in var(--base) var(--ease-spring)}.reports-bar{grid-area:reports;display:flex;height:calc(76px + env(safe-area-inset-bottom));min-width:0;min-height:0;align-items:stretch;gap:16px;border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--bg-panel)}.reports-bar__heading{display:flex;flex:0 0 100px;flex-direction:column;justify-content:center;gap:4px}.reports-bar__heading strong{color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1.35;text-transform:uppercase}.reports-list{display:flex;flex:1;min-width:0;align-items:center;gap:8px;padding:2px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;border-radius:var(--radius)}.reports-empty{color:var(--faint);font-size:12px;white-space:nowrap;animation:fade-in var(--base) ease}.report-item{display:flex;max-width:290px;flex:0 0 auto;align-items:center;gap:10px;border:0;border-radius:var(--radius);padding:7px 10px 7px 7px;background:var(--bg-raised);color:var(--text);text-align:left;cursor:pointer;animation:slide-in var(--slow) var(--ease-out);transition:background-color var(--hover) ease,translate var(--base) var(--ease-out)}.report-item:hover:enabled{background:var(--bg-overlay);translate:0 -1px}.report-item:disabled{cursor:default}.report-item.is-leaving{animation:fade-out .22s var(--ease-out) forwards;pointer-events:none}.report-symbol{display:grid;width:36px;height:36px;flex:none;place-items:center;border-radius:var(--radius-sm);background:var(--report-tint);color:var(--report-color);font-size:18px}.report-item__text{display:grid;min-width:0;gap:1px}.report-item strong,.report-item small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.report-item strong{color:var(--text-strong);font-size:12.5px;font-weight:600}.report-item small{color:var(--muted);font-size:11px}.report-count{display:inline-flex;flex:none;align-items:center;gap:4px;border-radius:999px;padding:2px 8px;background:var(--report-tint);color:var(--report-color);font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums}@media(max-width:860px){.app,.app:not([data-streams="0"]){height:100%;overflow:hidden;grid-template:42dvh minmax(0,1fr) auto / minmax(0,1fr);grid-template-areas:"main" "drawer" "reports"}.app:not([data-streams="0"]){grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"main" "mini" "reports"}.app:not([data-streams="0"]) .drawer{display:none!important}.app:not([data-streams="0"]) .map{border-right:0}.drawer{overflow:hidden;overscroll-behavior:contain;border-top:1px solid var(--line);border-right:0}.title{padding-top:12px}.list{overflow-y:auto}.stage,.stage[data-count="1"]{grid-template:auto / minmax(400px,1fr);overflow-x:auto;padding:0}.card{border-width:0 0 1px;border-radius:0}.stage[data-count="1"] .player{flex:none;aspect-ratio:16 / 9}.card header{position:sticky;left:0;width:min(100%,100vw)}.report-chip{min-width:34px;min-height:34px;padding:4px 8px}.report-chip__label{display:none}.reports-bar{height:calc(70px + env(safe-area-inset-bottom));gap:10px;padding:8px 10px calc(8px + env(safe-area-inset-bottom))}.reports-bar__heading{flex-basis:70px}.report-item{max-width:245px;padding:6px 9px 6px 6px}.report-symbol{width:32px;height:32px;font-size:16px}}
