:root{color-scheme:dark;font-family:Inter,system-ui,sans-serif;color:#e5eef0;background:#10191e}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{background:#253b44;border:1px solid #47616b;color:#deeeed;border-radius:8px;padding:10px 16px;cursor:pointer}button:hover{border-color:#78e6c4}header{height:72px;display:flex;align-items:center;gap:24px;padding:0 28px;background:#142128;border-bottom:1px solid #2a3e47}header a{color:#f1f7f7;text-decoration:none;font-weight:800;letter-spacing:.12em}header a span{color:#78e6c4}.map-tag,.eyebrow{font-size:10px;letter-spacing:.18em;color:#78b5ad}#connection{margin-left:auto;font-size:12px;color:#8ca4ad}main{display:grid;grid-template-columns:280px 1fr;height:calc(100dvh - 72px)}[hidden]{display:none!important}aside{background:#142128;padding:28px 22px;border-right:1px solid #2a3e47;overflow:auto}h1{font-size:24px;margin:12px 0 28px}h2{font-size:13px;letter-spacing:.06em}label{display:grid;gap:8px;font-size:12px;color:#a9bdc4;margin-bottom:20px}input,select{width:100%;background:#0e191f;border:1px solid #30474f;border-radius:7px;padding:11px;color:#e5eef0}input[type=checkbox]{width:16px;height:16px;accent-color:#78e6c4}.layers{border-block:1px solid #2a3e47;padding:16px 0;margin:24px 0}.layers label{display:flex;align-items:center;margin:12px 0}.map-help{font-size:12px;color:#839ca7;line-height:1.7}.map-viewport{position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#1f3237,#101b22)}canvas{width:100%;height:100%;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.map-controls{position:absolute;top:22px;right:22px;display:flex;gap:8px}.map-controls button{box-shadow:0 6px 18px #0004}.map-empty{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);text-align:center;pointer-events:none;max-width:360px}.compass{font-family:Georgia,serif;color:#94b0b3;font-size:36px;line-height:1.1;margin-bottom:30px}.map-empty h2{font-size:20px;font-weight:500}.map-empty p{color:#8299a2;font-size:13px;line-height:1.7}.map-legend{position:absolute;bottom:22px;left:22px;background:#15242fe8;border:1px solid #334953;border-radius:8px;padding:12px 16px;display:flex;align-items:center;gap:10px;font-size:11px;color:#bed1d5}.player-dot,.warp-dot,.poi-dot{display:inline-block;width:7px;height:7px;background:#78e6c4;border-radius:50%}.warp-dot{background:#bda1f7;border-radius:2px}.poi-dot{background:#eed198;transform:rotate(45deg);border-radius:0}output{position:absolute;bottom:24px;right:24px;font:12px ui-monospace,monospace;color:#bdd0d5}.roster-player{display:flex;align-items:center;gap:9px;padding:9px 0;font-size:12px}.auth-card{max-width:400px;margin:8vh auto;padding:30px;border:1px solid #30474f;border-radius:14px;background:#142128}.auth-card p{font-size:13px;color:#94acb5}.auth-card button{width:100%}#loginError{color:#f3a59d}@media(max-width:720px){header{padding:0 16px;gap:12px}.map-tag{display:none}main{grid-template-columns:1fr;height:auto}aside{padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:10px}aside h1,aside .eyebrow,.layers,.map-help,#mapRoster{display:none}aside label{margin:0}.map-viewport{height:70dvh}.map-legend{bottom:50px;left:10px}.auth-card{margin:6vh 16px}}
.roster-toggle{display:flex;align-items:center;gap:9px}.roster-player{width:100%;background:transparent;border:1px solid transparent;border-radius:8px;padding:8px;text-align:left}.roster-player:hover,.roster-player[aria-pressed=true]{background:#223a42;border-color:#4f8c7c}.roster-player img{border-radius:50%;border:2px solid #78e6c4;object-fit:cover}.roster-player span{display:grid;gap:4px}.roster-player small{color:#8ca4ad}.roster-player strong{overflow-wrap:anywhere}.map-controls{flex-wrap:wrap;justify-content:flex-end;max-width:calc(100% - 44px)}@media(max-width:720px){aside .roster-toggle{display:flex;grid-column:1/-1}#mapRoster{display:block;grid-column:1/-1;max-height:180px;overflow:auto}}

dialog{color:#e5eeef;background:#142128;border:1px solid #30474f;border-radius:12px;max-width:420px}dialog::backdrop{background:#0009}dialog label{display:block;margin:16px 0}dialog input{padding:8px;font:inherit}.layers a{display:block;margin-top:12px}

header{flex-wrap:wrap;gap:16px}#mapPortalNav{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-left:auto}#mapPortalNav a,.selected-map-tab{padding:9px 12px;border:1px solid #30474f;border-radius:8px;font-weight:600;letter-spacing:0}.selected-map-tab{border-color:#78e6c4}#mapBrand{letter-spacing:0;white-space:nowrap}@media(max-width:650px){#mapPortalNav{order:3;width:100%}}

#mapMarkerList{display:grid;gap:6px;max-height:260px;overflow:auto}.map-marker-entry{text-align:left;display:flex;gap:10px;align-items:center;width:100%}.map-marker-entry small{display:block;color:#a9bdc4}.marker-symbol{font-size:22px}.map-marker-entry span{overflow-wrap:anywhere}#waypointCrosshair{position:absolute;left:50%;top:50%;width:32px;height:32px;transform:translate(-50%,-50%);pointer-events:none;filter:drop-shadow(0 1px 2px #000);border:2px solid white;border-radius:50%}#waypointCrosshair:before,#waypointCrosshair:after{content:"";position:absolute;background:#fff;left:50%;top:50%;transform:translate(-50%,-50%)}#waypointCrosshair:before{width:48px;height:2px}#waypointCrosshair:after{width:2px;height:48px}#waypointSelection{position:absolute;bottom:70px;left:50%;transform:translateX(-50%);background:#142128ee;padding:12px;border:1px solid #78e6c4;border-radius:10px;text-align:center;max-width:95%;width:max-content}#waypointSelection p{margin:0 0 10px;font-size:13px}.waypoint-pan{display:flex;justify-content:center;gap:6px;margin-bottom:10px}#mapWaypointDialog{background:#142128;color:#e5eef0;border:1px solid #47616b;border-radius:12px;width:min(430px,95vw);max-height:90dvh;overflow:auto}#mapWaypointDialog::backdrop{background:#0008}#mapWaypointForm input[type=color]{height:44px;padding:4px}#waypointError{color:#f3a59d}@media(max-width:720px){aside .marker-panel{display:block;grid-column:1/-1;margin:0}#mapMarkerList{max-height:150px}#waypointSelection{bottom:60px}.map-legend{display:none}}

body{display:flex;flex-direction:column;height:100dvh}header{height:auto;min-height:72px;padding:16px 28px;flex:none}main{height:auto;flex:1;min-height:0}@media(max-width:720px){body{height:auto;min-height:100dvh}header{padding:16px}main{flex:none}}