:root{color-scheme:dark;--bg:#100d19;--panel:#211a2d;--border:#ffffff18;--muted:#aca2be;--gold:#efcc83;--purple:#c09ae9;--blue:#72c5fa;font-family:'Segoe UI',system-ui,sans-serif;color:#f5f0fa;background:var(--bg)}*{box-sizing:border-box}body{margin:0;font-size:14px;line-height:1.5}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.topbar{height:90px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;background:#0b0912;border-bottom:1px solid var(--border)}.brand{display:flex;align-items:center;gap:22px}.brand img{width:165px;height:76px;object-fit:contain}.brand span{border-left:1px solid var(--border);padding-left:22px;letter-spacing:2px;font-size:12px;color:var(--muted)}.top-status{display:flex;align-items:center;gap:12px;color:var(--gold);font-size:12px;letter-spacing:1px}.live-dot{width:7px;height:7px;background:var(--gold);border-radius:50%}.avatar{width:38px;height:38px;border:1px solid #9371bd;border-radius:5px;background:#332044;display:grid;place-items:center;color:#fff;margin-left:18px;font-weight:700}.shell{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:calc(100vh - 90px)}aside{background:#14101e;border-right:1px solid var(--border);padding:32px 18px;display:flex;flex-direction:column}.caption{font-size:10px;letter-spacing:2px;color:var(--muted);margin:0 12px 18px}nav{display:grid;gap:8px}.side{display:flex;gap:14px;align-items:center;border:1px solid transparent;border-radius:5px;padding:14px;color:#c0b4d0}.side.active{border-color:#a674d94a;background:linear-gradient(90deg,#51316b70,#2b1d3940);color:#e2c3ff}.side:hover{background:#282033}.side-bottom{margin-top:auto;padding-top:60px;color:var(--muted);font-size:11px}.side-bottom p{margin-left:12px}main{padding:34px 40px 40px;max-width:1500px;width:100%;margin:0 auto;min-width:0}.breadcrumb{color:var(--muted);font-size:12px;margin:0 0 18px}.title-row{display:flex;justify-content:space-between;align-items:center;gap:20px}h1{font-size:34px;letter-spacing:-1px;margin:0}h2{font-size:21px;margin:0}p,footer,.hint{color:var(--muted);line-height:1.6}.title-row p{margin:8px 0 26px}.button,button{border:1px solid #d1aef04d;background:linear-gradient(#b78beb,#7140a8);padding:11px 18px;border-radius:5px;font-weight:600;color:#fff;cursor:pointer}.secondary,button[type=button]{background:#241b31;border-color:#ffffff25}.feature{background:linear-gradient(90deg,#1b1129 8%,#21142ab5 55%,#100d1925),url('/background.png') center 45%/cover;border:1px solid #a27ac238;border-radius:7px;padding:26px 30px;min-height:170px;display:flex;align-items:center;margin:0 0 25px}.eyebrow{color:var(--gold);font-size:10px;letter-spacing:2px}.feature h2{font-size:28px;margin:7px 0}.feature p{margin:0;max-width:490px;color:#c8bcd6}.controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}input{flex:1;min-width:180px}input,select{background:#191321;border:1px solid #ffffff20;color:#fff;padding:11px 14px;border-radius:5px}button:disabled{opacity:.45;cursor:default}button:hover:enabled,.button:hover{filter:brightness(1.12)}a:focus-visible,input:focus,button:focus-visible,select:focus-visible{outline:2px solid var(--purple);outline-offset:3px}#connect-form{background:linear-gradient(#211a2d,#19131f);border:1px solid var(--border);border-radius:7px;padding:20px 24px;margin:22px 0}label{font-size:12px;color:var(--muted)}#connection{margin:12px 0 0;font-size:12px}.summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:24px 0}.summary>div{padding:23px;background:linear-gradient(#251b31,#19131f);border:1px solid var(--border);border-radius:7px}.summary span{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}.summary strong{display:block;font-size:32px;margin-top:12px;color:var(--gold);font-weight:650}.summary>div:nth-child(2) strong{color:var(--blue)}.summary>div:nth-child(3) strong{color:var(--purple)}.panel{border:1px solid var(--border);border-radius:7px;background:#15101e;padding:24px;margin:24px 0;scroll-margin-top:20px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}.section-heading .controls{margin:0}.badge{font-size:9px;letter-spacing:1px;color:var(--gold);border:1px solid #dfbb6870;background:#151020;border-radius:3px;padding:4px 8px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left}th,td{padding:14px 12px;border-bottom:1px solid var(--border)}th{font-size:11px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);font-weight:500}td{font-size:13px}td:last-child{color:var(--blue)}tbody tr:hover{background:#211a2d}.hint{font-size:12px}#events{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.event{padding:18px;background:linear-gradient(#251b31,#19131f);border:1px solid var(--border);border-radius:7px;min-width:0}.event header{display:flex;justify-content:space-between;gap:12px}.event strong{font-size:13px;color:var(--purple)}.event time{font-size:11px;color:var(--muted)}.event pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.6;color:#c8bcd6;max-height:260px;overflow:auto;margin-bottom:0}.empty{grid-column:1/-1;padding:24px;border:1px dashed #a674d94a;border-radius:5px}footer{border-top:1px solid var(--border);padding-top:20px;margin-top:28px;font-size:11px}@media(min-width:1600px){main{padding-top:42px}.shell{grid-template-columns:250px minmax(0,1fr)}}@media(max-width:1050px){.shell{grid-template-columns:180px minmax(0,1fr)}main{padding:26px}.side{padding:12px 10px;font-size:12px}#events{grid-template-columns:1fr}.feature h2{font-size:25px}.summary>div{padding:18px}}@media(max-width:700px){.topbar{height:76px;padding:0 16px}.brand img{width:115px;height:64px}.brand{gap:10px}.brand span{font-size:9px;padding-left:10px}.avatar{display:none}.top-status{font-size:9px;gap:6px}.shell{display:block}aside{padding:10px 16px;border-right:0;border-bottom:1px solid var(--border)}aside nav{display:flex;overflow:auto;gap:6px}.caption,.side-bottom{display:none}.side{white-space:nowrap;gap:7px;padding:9px;font-size:11px}main{padding:24px 16px}.title-row{align-items:start}h1{font-size:28px}.title-row .button{font-size:10px;padding:9px;white-space:nowrap}.feature{padding:23px;min-height:170px}.feature h2{font-size:23px}.feature p{font-size:12px}.summary{gap:9px}.summary>div{padding:13px}.summary span{font-size:9px;letter-spacing:0}.summary strong{font-size:25px}.panel,#connect-form{padding:18px}.controls input{flex-basis:100%;min-width:0}.controls button{padding:10px 12px;font-size:12px}.event header{flex-direction:column;gap:3px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
:root{--header-height:90px;--sidebar-width:220px;scroll-padding-top:calc(var(--header-height) + 20px)}
.topbar{position:fixed;inset:0 0 auto;height:var(--header-height);z-index:100}
.shell{display:block;padding-top:var(--header-height);padding-left:var(--sidebar-width);min-height:100vh}
.shell>aside{position:fixed;top:var(--header-height);bottom:0;left:0;width:var(--sidebar-width);overflow-y:auto;overscroll-behavior:contain;z-index:90}
.panel{scroll-margin-top:calc(var(--header-height) + 20px)}
@media(min-width:1600px){:root{--sidebar-width:250px}}
@media(min-width:701px) and (max-width:1050px){:root{--sidebar-width:180px}}
@media(max-width:700px){:root{--header-height:76px;--sidebar-width:0px;scroll-padding-top:160px}.shell{padding-top:140px}.shell>aside{top:var(--header-height);bottom:auto;width:100%;height:64px;overflow-y:hidden}.panel{scroll-margin-top:160px}}

/* Fill the banner and keep the character faces in the upper crop. */
.feature{background-color:#1b1129;background-position:center,center 12%;background-size:100% 100%,cover;background-repeat:no-repeat}

.feature{overflow:hidden;background-clip:padding-box;border-color:#382943}

.player-search{display:flex;align-items:center;gap:12px}.player-search input{min-width:200px}.player-table th:nth-child(2){width:85px}.player-row td:first-child{font-weight:600;color:#f5f0fa}.player-row td:nth-child(2){color:var(--gold)}.player-table .stale{opacity:.45}.player-enter{animation:player-arrive .4s ease-out}@keyframes player-arrive{from{opacity:0;transform:translateX(-12px);background:#51316b}to{opacity:1;transform:translateX(0);background:transparent}}@media(max-width:700px){.player-search{width:100%;flex-wrap:wrap}.player-search input{width:100%;min-width:0}.player-table{min-width:480px}}@media(prefers-reduced-motion:reduce){.player-enter{animation:none}}

.service-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.service-card{display:flex;flex-direction:column;gap:10px;padding:18px;border:1px solid var(--border);border-radius:6px;background:var(--panel)}.service-card strong{font-size:13px}.service-card span{font-size:12px;color:var(--muted)}.service-card[data-status=running] span{color:#8edba4}.service-card[data-status=stopped] span{color:#ee9b9b}.service-card[data-status=starting] span,.service-card[data-status=stopping] span{color:var(--gold)}.service-history-heading{font-size:15px;margin:28px 0 12px}.service-activity{max-height:280px;overflow-y:auto}.service-change{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid var(--border);font-size:12px}.service-change time{color:var(--muted);white-space:nowrap}@media(max-width:700px){.service-change{flex-direction:column;gap:4px}}

.map-display-name{display:block}.map-identifier{display:block;margin-top:3px;font-size:10px;line-height:1.4;color:var(--muted);font-family:Consolas,monospace;letter-spacing:.2px}

.service-list{table-layout:fixed}.service-list th:first-child{width:50%}.service-list .service-pid{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}.service-row td:first-child{font-weight:600;color:#e9e1f3}.service-state{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.service-state:before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}.service-row[data-status=running] .service-state{color:#8edba4}.service-row[data-status=stopped] .service-state{color:#ee9b9b}.service-row[data-status=starting] .service-state,.service-row[data-status=stopping] .service-state{color:var(--gold)}.service-activity{max-height:340px;border:1px solid var(--border);border-radius:5px}.service-log{font-size:12px;min-width:480px}.service-log thead{position:sticky;top:0;background:#191321;z-index:1}.service-log th:first-child{width:135px}.service-log-date{display:block;font-size:10px;color:var(--muted);margin-top:3px}.service-log td:nth-child(2){font-weight:600;color:#e9e1f3}.service-log .service-log-state{color:var(--muted)}.service-log tr[data-event=started] .service-event{color:#8edba4}.service-log tr[data-event=stopped] .service-event{color:#ee9b9b}.service-log tr[data-event=restarted] .service-event{color:var(--gold)}.service-log tr:last-child td,.service-list tr:last-child td{border-bottom:0}@media(max-width:700px){.service-list{min-width:390px}}

.character-activity{max-height:440px;border:1px solid var(--border);border-radius:5px}.character-log{min-width:650px}.character-log thead{position:sticky;top:0;background:#191321;z-index:1}.character-log th:first-child{width:135px}.character-log td:nth-child(2){font-weight:600;color:#e9e1f3}.character-log tr[data-event=login] .character-action{color:#8edba4}.character-log tr[data-event=logout] .character-action{color:#ee9b9b}.character-log tr[data-event=map_changed] .character-action{color:var(--gold)}.character-location>div+div{margin-top:7px}.character-log tr:last-child td{border-bottom:0}