:root{color-scheme:dark;--bg:#0a1521;--panel:#122334;--line:#2a3d4d;--text:#ecf1f4;--muted:#9db0c1;--gold:#e5bb70;font-family:Segoe UI,Arial,sans-serif;font-size:14px}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top left,#1a3045,transparent 60%),var(--bg);color:var(--text)}button,input,select{font:inherit}button,summary{cursor:pointer}button{border:1px solid #3c5062;border-radius:7px;background:#1c3042;color:var(--text);padding:9px 12px;white-space:nowrap}button:hover{background:#2a445b}button:disabled{opacity:.4;cursor:default}.gold{background:var(--gold);color:#202633;border-color:var(--gold);font-weight:650}.gold:hover{background:#f5cd86}input,select{border:1px solid #3c5062;background:#0e1c2a;color:var(--text);border-radius:6px;padding:9px;min-width:0;max-width:100%}input[type=color]{width:42px;height:38px;padding:3px}input[type=checkbox]{accent-color:var(--gold)}:focus-visible{outline:2px solid var(--gold);outline-offset:3px}[hidden]{display:none!important}header{min-height:90px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 32px;background:#0b1722b3}.brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none;letter-spacing:2px;font-weight:700;font-size:17px}.brand small{display:block;font-size:9px;color:var(--muted);letter-spacing:3px;margin-top:5px}.crest{color:var(--gold);font-size:36px;border:1px solid #6a593e;border-radius:12px;padding:0 10px}.head-actions,.row{display:flex;gap:8px;align-items:center}#saveState{font-size:12px;color:var(--muted);margin-right:12px}main{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;max-width:1650px;margin:auto;padding:28px 32px}.workspace{min-width:0}.mapheading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:2px 0 22px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--gold);font-weight:700;margin:0 0 9px}#title{font-size:30px;font-weight:650;padding:0;border:0;background:transparent;width:100%;letter-spacing:-.7px}.mapheading p:not(.eyebrow){color:var(--muted);margin-bottom:0}.counter{border-left:1px solid var(--line);padding:4px 24px;text-align:center}.counter b{display:block;font-size:30px;font-weight:400;color:var(--gold)}.counter small{font-size:9px;letter-spacing:2px;color:var(--muted)}.toolbar{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:12px;background:#152636;border:1px solid var(--line);border-radius:12px 12px 0 0}.segmented,.viewtools{display:flex;gap:4px;align-items:center;flex-wrap:wrap}.segmented button{border-color:transparent;background:transparent}.segmented button[aria-pressed=true]{background:#e5bb7025;border-color:#a78b54;color:#f3cf8e}.viewtools label{font-size:12px;display:flex;gap:4px;align-items:center}#mapwrap{position:relative;height:clamp(400px,65vh,800px);background:radial-gradient(ellipse,#203f4d,#0d202e 75%);border:1px solid var(--line);border-top:0;overflow:hidden}#map{width:100%;height:100%;touch-action:none;user-select:none;display:block}.compass{position:absolute;right:18px;top:18px;display:flex;flex-direction:column;align-items:center;gap:1px;color:#b4c8cc;pointer-events:none;font-size:11px}.compass span{letter-spacing:5px;padding-left:5px}.compass b{color:var(--gold)}#maphint{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);padding:8px 14px;border:1px solid #3e5362;border-radius:20px;background:#0a1622e8;color:#b8c8d3;font-size:11px;width:max-content;max-width:90%;text-align:center;pointer-events:none}.mapfooter{display:flex;justify-content:space-between;gap:12px;padding:12px 15px;border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px;color:var(--muted);font-size:11px}#position{color:var(--gold)}#status{min-height:24px;color:var(--gold);line-height:1.5}aside{display:flex;flex-direction:column;gap:14px}.panel{background:linear-gradient(130deg,#182c3d,#112130);border:1px solid var(--line);border-radius:12px;padding:19px}h2{font-size:17px;margin:0 0 10px;letter-spacing:-.2px}.panel p:not(.eyebrow){font-size:12px;color:var(--muted);line-height:1.6;margin:6px 0 15px}#allianceform{display:flex;gap:6px}#tag{width:100%}#alliances{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}.alliance{border-left-width:5px}.alliance[aria-pressed=true]{outline:1px solid var(--gold);outline-offset:2px}.coordinates{display:flex;gap:10px}.coordinates label{display:flex;align-items:center;gap:7px;width:50%;color:var(--muted)}.coordinates input{width:100%}.field{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:12px 0;font-size:12px}.field select{flex:1}.field input{width:64px}.row>*{flex:1}.objective,.cityrow{display:flex;width:100%;text-align:left;justify-content:space-between;gap:8px;align-items:center;margin-top:7px;padding:10px;background:#0e1d2a}.objective small,.cityrow small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.objective strong{font-weight:500;color:var(--gold);font-size:12px}.objective[aria-pressed=true]{border-color:var(--gold)}details+details{border-top:1px solid var(--line);margin-top:14px;padding-top:14px}summary{font-size:13px;color:#c5d2db}#citylist{max-height:300px;overflow:auto}#sharebar,#shared{padding:14px 32px;display:flex;gap:12px;align-items:center;background:#1b3041;border-bottom:1px solid var(--line);flex-wrap:wrap}#sharebar span,#shared span{font-size:12px;color:#c7d6df}#shareurl{flex:1;min-width:220px}dialog{border:1px solid #6a593e;border-radius:12px;background:#142738;color:var(--text);max-width:440px;padding:28px}dialog p{line-height:1.6;color:var(--muted)}dialog::backdrop{background:#000b}.expanded{position:fixed!important;inset:0;z-index:5;background:var(--bg);padding:14px;display:flex;flex-direction:column}.expanded #mapwrap{height:auto;flex:1}.expanded .mapheading{display:none}.expanded #status{margin:4px}.tile{fill:#75a69f05;stroke:#8bb5ae33;stroke-width:.025}.building{stroke-width:.07}.maplabel{font-family:Segoe UI,Arial,sans-serif;pointer-events:none;fill:#fff;text-anchor:middle;font-weight:650;paint-order:stroke;stroke:#091725;stroke-width:.08;stroke-linejoin:round}.coordlabel{fill:#9bb7bb;font-size:.38px;pointer-events:none}body.shared .editcontrol{display:none}@media(min-width:1450px){main{grid-template-columns:minmax(0,1fr) 350px}}@media(max-width:1050px){main{padding:20px;gap:16px;grid-template-columns:minmax(0,1fr) 290px}.toolbar button{padding:8px}.viewtools{width:100%}header{padding:16px 20px}#saveState{display:none}}@media(max-width:740px){header{gap:10px;padding:14px 12px;min-height:76px}.brand{font-size:12px;letter-spacing:1px;gap:8px}.brand small{font-size:8px;letter-spacing:1px}.crest{font-size:28px;padding:0 7px}.head-actions button{padding:8px;font-size:12px}main{display:flex;flex-direction:column;padding:18px 12px;gap:12px}.mapheading{margin-bottom:16px}#title{font-size:25px}.mapheading p:not(.eyebrow){font-size:12px;line-height:1.6}.counter{padding:4px 12px}#mapwrap{height:58vh;min-height:370px}.toolbar{padding:8px}.viewtools{gap:5px}.viewtools button{min-height:36px}.segmented button{min-height:40px}aside{display:grid;grid-template-columns:1fr;gap:12px}.panel{padding:16px}.mapfooter{font-size:10px;padding:10px}#sharebar,#shared{padding:12px}#shareurl{min-width:100%;order:2}#maphint{font-size:10px}.expanded{padding:5px}.expanded #mapwrap{min-height:0}.compass{top:12px;right:12px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* A view menu adapted from Pocket Guide, scoped to this standalone toolbar. */
.map-view-menu{position:relative;flex-shrink:0;margin:0;padding:0;border:0;background:none}
.map-view-menu summary{display:flex;align-items:center;gap:8px;min-height:38px;padding:8px 12px;border:1px solid #486787;border-radius:24px;background:#081526;color:#c9def1;font-size:12px;cursor:pointer;list-style:none}
.map-view-menu summary::-webkit-details-marker{display:none}
.map-view-menu summary b{font-weight:500}
.map-view-menu summary i{width:11px;height:11px;display:block;border:1px solid var(--gold);transform:rotate(45deg)}
.map-view-chevron{width:6px;height:6px;border:solid #c9def1;border-width:0 1.5px 1.5px 0;transform:rotate(45deg);margin:-3px 2px 0 3px}
.map-view-menu[open] summary{border-color:var(--gold)}
.map-view-choices{position:absolute;top:calc(100% + 8px);right:0;z-index:8;display:grid;gap:4px;min-width:180px;padding:7px;border:1px solid #58728e;border-radius:16px;background:#0b1b30;box-shadow:0 12px 30px #0005}
.map-view-choices button{border:1px solid transparent;border-radius:10px;padding:10px 12px;background:transparent;text-align:left;color:#c9def1;font-size:13px}
.map-view-choices button[aria-pressed=true]{border-color:#6585a4;background:#31547499;color:#f4d89d}
.map-view-choices button:hover{background:#27465e}
#map{cursor:crosshair}#map[data-mode=select]{cursor:default}#map .city-object{cursor:grab}#map .fixed-object{cursor:pointer}#map[data-mode=pan],#map[data-mode=pan] .city-object,#map[data-mode=pan] .fixed-object{cursor:grab}#map.dragging,#map.dragging .city-object{cursor:grabbing}#map.readonly .city-object{cursor:pointer}
#cityActions{border-top:1px solid var(--line);margin-top:16px;padding-top:8px}
.nudge-pad{display:grid;grid-template-columns:repeat(3,42px);grid-template-rows:repeat(2,40px);justify-content:center;gap:6px;margin:10px 0 16px}
.nudge-pad [data-nudge=up]{grid-column:2}.nudge-pad [data-nudge=left]{grid-row:2;grid-column:1}.nudge-pad [data-nudge=down]{grid-row:2;grid-column:2}.nudge-pad [data-nudge=right]{grid-row:2;grid-column:3}
.nudge-pad button{font-size:20px;padding:4px;line-height:1}#duplicate{width:100%}.cityrow[aria-pressed=true]{border-color:var(--gold);background:#294055}
#allianceform input[type=color]{flex:0 0 42px}.mapfooter{flex-wrap:wrap}.mapfooter span:last-child{color:var(--gold)}
@media(max-width:740px){.viewtools{gap:6px}.map-view-menu{margin-left:auto}.map-view-menu summary{min-height:40px}.mapfooter{gap:6px}.map-view-choices{min-width:170px}}

/* Alliance pills share one surface, with a color dot and a quiet remove action. */
#alliances{gap:8px}
.alliance-chip{display:inline-flex;align-items:center;max-width:100%;min-height:40px;border:1px solid #3b5266;border-radius:12px;background:#172b3c}
.alliance-chip:hover{border-color:#617b90;background:#1d3447}
.alliance-chip.selected{border-color:var(--gold);background:#243848;box-shadow:inset 0 0 0 1px #e5bb7014}
.alliance-chip .alliance{display:flex;align-items:center;gap:9px;min-height:38px;border:0;border-radius:11px;background:transparent;padding:6px 6px 6px 12px;outline:none}
.alliance-chip .alliance:only-child{padding-right:12px}
.alliance-chip .alliance::before{content:'';width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--alliance-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--alliance-color) 12%,transparent)}
.alliance-chip .alliance[aria-pressed=true]{outline:none}
.alliance-chip .alliance:hover{background:transparent}
.alliance-tag{font-size:12px;font-weight:650;letter-spacing:.3px;color:#e4edf4}
.alliance-count{display:flex;align-items:center;justify-content:center;min-width:21px;height:21px;padding:0 5px;border-radius:6px;background:#07152265;color:#adc0cf;font-size:11px;font-variant-numeric:tabular-nums}
.alliance-chip.selected .alliance-tag{color:#f5d797}
.alliance-remove{display:flex;align-items:center;justify-content:center;flex:0 0 30px;width:30px;height:30px;min-height:0;border:0;border-radius:8px;margin:4px 4px 4px 0;padding:0;background:transparent;color:#8ea5b6}
.alliance-remove:hover{color:#ffc6c6;background:#e8797922}
.alliance-chip .alliance:focus-visible,.alliance-remove:focus-visible{outline:none}
.alliance-chip:has(:focus-visible){outline:2px solid var(--gold);outline-offset:2px}
@media(max-width:740px){.alliance-chip{min-height:44px}.alliance-chip .alliance{min-height:42px}.alliance-remove{flex-basis:36px;width:36px;height:36px;margin:3px 3px 3px 0}}

.objective-labels .maplabel{stroke:none;fill:#edf3f8}.objective-labels .objective-name{fill:#f4dfb4}
