/* Servus, Therese: the map fills the screen, Therese has the left column (wide screens) or the search bar and a sheet
   (phones, below 820 px). Brand: navy #0B2B45, gold #C9A962, cream #F8F5EC; Source Serif 4 and Outfit (src/brand/, SIL OFL). */
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:200 900;font-display:swap;src:url(../brand/source-serif-4-latin-variable.woff2) format("woff2")}
@font-face{font-family:Outfit;font-style:normal;font-weight:400;font-display:swap;src:url(../brand/outfit-regular.woff) format("woff")}
@font-face{font-family:Outfit;font-style:normal;font-weight:700;font-display:swap;src:url(../brand/outfit-bold.woff) format("woff")}
:root{--ink:#0B2B45;--ink-2:#44596C;--ink-3:#5E6F7F;--paper:#F8F5EC;--paper-2:#EFEADD;--card:#FFFDF8;--line:#DDD6C7;--gold:#C9A962;--gold-ink:#7D5F27;--side-w:380px;--sheet-h:0px;--top-h:0px;--serif:"Source Serif 4",Georgia,serif;--sans:Outfit,"Avenir Next","Segoe UI",system-ui,sans-serif;font-family:var(--sans);color:var(--ink);background:#eae8de}
*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit;color:inherit}button,a,select,input,summary{touch-action:manipulation}button,summary{cursor:pointer}a{color:inherit}[hidden]{display:none!important}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
#app{position:relative;width:100%;height:100dvh;min-height:560px;overflow:hidden}
#viewport{position:absolute;inset:0;outline:none;touch-action:none}#viewport canvas{display:block;width:100%;height:100%}
/* The selected place's staging (place-highlight.mjs): the map dims and greys round a soft hole the script moves each frame */
.place-veil{position:absolute;inset:0;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .6s,visibility .6s;backdrop-filter:brightness(.58) saturate(.3);-webkit-backdrop-filter:brightness(.58) saturate(.3)}
@media (prefers-reduced-motion:reduce){.place-veil{transition:none}}

/* Therese's column */
.side{position:absolute;z-index:6;left:0;top:0;bottom:0;width:var(--side-w);display:flex;flex-direction:column;background:var(--paper);border-right:1px solid var(--line);box-shadow:6px 0 30px #0b2b4514}
.side-top{flex:none;padding:16px 18px 14px;border-bottom:1px solid var(--line)}
.side-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.brand{display:flex;align-items:center;gap:10px;min-width:0;text-decoration:none}
.brand-mark{flex:none;width:46px;height:44px}
.brand-name{font:640 1.3rem/1.05 var(--serif);letter-spacing:-.01em}
.brand-name .kicker{display:block;margin-bottom:6px;font:600 .58rem/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold-ink)}
.brand-name small{display:block;margin-top:5px;font:400 .62rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.side-search{margin-top:14px}
.side-search label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#place-search{width:100%;border:1px solid var(--line);border-radius:12px;padding:11px 14px 11px 38px;font-size:.95rem;background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='%235E6F7F' stroke-width='2'/%3E%3Cpath d='M15.5 15.5l5 5' stroke='%235E6F7F' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 12px 50%/17px}
.side-sheet{flex:1;min-height:0;display:flex;flex-direction:column}
/* Folded column (wide screens): the search card at the top and the credits at the bottom stay; the tab at the edge unfolds it */
.side-toggle{position:absolute;left:100%;top:50%;width:22px;height:52px;margin-top:-26px;padding:0;display:grid;place-items:center;border:1px solid var(--line);border-left:0;border-radius:0 10px 10px 0;background:var(--paper);color:var(--ink-2);box-shadow:6px 0 14px #0b2b4514;pointer-events:auto}
.side-toggle:hover{color:var(--ink)}.side-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media (min-width:820px){
  .side.collapsed{background:none;border-right:0;box-shadow:none;pointer-events:none}
  .side.collapsed .side-top{margin:12px;border:1px solid var(--line);border-radius:16px;background:var(--paper);box-shadow:0 6px 24px #0b2b4526;pointer-events:auto}
  .side.collapsed .side-sheet{justify-content:flex-end}.side.collapsed .side-sheet>:not(.side-foot){display:none}
  .side.collapsed .side-foot{margin:0 12px 12px;border:1px solid var(--line);border-radius:12px;background:var(--paper);pointer-events:auto}
  .side.collapsed .side-toggle{left:0;border-radius:0 10px 10px 0}.side.collapsed .side-toggle svg{transform:scaleX(-1)}
  .side.collapsed~.view-controls{left:50%}
}
.sheet-handle,.sheet-min{display:none}

/* The place card: what a pick (map, search, chip, link) shows */
.place-card{flex:none;max-height:60%;overflow:auto;margin:12px 14px 0;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 6px 20px #0b2b450d}
.map-chat-messages .place-card{margin:0;max-height:none} /* in the conversation (main.mjs showCard): the chat scrolls, not the card */
dialog .place-card{display:none} /* the chat follows a single view into its dialog; the map's card stays behind */
.place-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
#place-name{margin:0;font:640 1.2rem/1.2 var(--serif)}
#place-close{flex:none;border:0;background:none;color:var(--ink-3);font-size:1.35rem;line-height:1;padding:2px 7px;border-radius:8px}#place-close:hover{background:var(--paper-2)}
#place-kind{margin:6px 0 10px;font-size:.84rem;line-height:1.45;color:var(--ink-2)}
.place-card dl{margin:0 0 8px;font-size:.68rem}.place-card dl div{display:flex;justify-content:space-between;gap:10px;padding:3px 0;border-bottom:1px solid var(--paper-2)}.place-card dt{color:var(--ink-3)}.place-card dd{margin:0;text-align:right}.unverified{color:#8a5f22}
.place-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0;font-size:.78rem}
#place-share{border:1px solid var(--ink);background:var(--ink);color:var(--paper);border-radius:999px;padding:.5em .95em;font-size:.72rem;font-weight:700;letter-spacing:.05em}
#source-link{color:var(--ink-2)}

/* Therese: greeting, conversation, category buttons, question field */
.side-chat{flex:1;min-height:0;min-width:0;display:flex}
.map-chat-root{flex:1;min-height:0;min-width:0;display:flex;flex-direction:column}
.map-chat-toggle{display:none}
.map-chat{flex:1;min-height:0;min-width:0;display:flex;flex-direction:column;overflow-y:auto} /* scrolls as a whole when the column is full, never runs under the next block */
.map-chat-messages{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px 16px 8px;display:flex;flex-direction:column;gap:10px;font-size:.92rem;line-height:1.45}
.map-chat-messages>*{flex:none} /* a short column scrolls; a shrunk bubble would spill its text over the notice below */
.map-chat-bubble{align-self:flex-start;max-width:92%;white-space:pre-wrap;overflow-wrap:anywhere;padding:10px 13px;background:var(--card);border:1px solid var(--line);border-radius:14px 14px 14px 4px}
.map-chat-search{margin-top:4px;font-size:.8rem;color:var(--ink-3)}.map-chat-search::before{content:"";display:inline-block;width:.5em;height:.5em;margin-right:.5em;border-radius:50%;background:var(--gold);animation:map-chat-pulse 1s ease-in-out infinite}
@keyframes map-chat-pulse{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.map-chat-search::before{animation:none}}
.map-chat-user{align-self:flex-end;background:var(--ink);color:var(--paper);border-color:var(--ink);border-radius:14px 14px 4px 14px}
.map-chat-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;white-space:normal}
.map-chat-chips button{border:1px solid var(--gold);background:var(--paper);border-radius:999px;padding:.4em .8em;font-size:.8rem}.map-chat-chips button:hover{background:#f3ead4}
.map-chat-check{flex:none;padding:2px 16px 6px;font-size:.8rem}
.map-chat-notice{margin:0 0 8px;line-height:1.45;color:var(--ink-2)}
.map-chat-check button{border:1px solid var(--ink);background:var(--ink);color:var(--paper);border-radius:999px;padding:.55em 1.1em;font-size:.78rem;font-weight:700}
.map-chat-note{margin:0;font-size:.72rem;color:var(--ink-3);text-align:center}.map-chat-resting{flex:none;margin:0;padding:0 16px 10px;font-size:.8rem;line-height:1.45;color:var(--ink-2)}
.map-chat-form{flex:none;display:flex;flex-wrap:wrap;gap:8px;padding:6px 14px 8px}
.map-chat-form input{flex:1;min-width:0;border:1px solid var(--line);border-radius:999px;padding:11px 16px;font-size:16px;background:var(--card)}
.map-chat-form button{flex:none;min-height:44px;border:0;border-radius:999px;background:var(--ink);color:var(--paper);padding:0 16px;font-size:.85rem;font-weight:700}
/* The Live lane's voice assistant: its own row under the question field. */
.map-chat-form .map-chat-talk{order:1;flex-basis:100%;border:1px solid var(--line);background:var(--card);color:var(--ink);font-variant-numeric:tabular-nums}
.map-chat :disabled{opacity:.55;cursor:wait}
.map-chat-footer{flex:none;margin:0;padding:0 16px 10px;font-size:.66rem;line-height:1.5;color:var(--ink-3)}

/* One line at the foot of the column: the OpenStreetMap credit, imprint, privacy and licences */
.side-foot{flex:none;padding:8px 18px 12px;border-top:1px solid var(--line);font-size:.66rem;line-height:1.5;color:var(--ink-3)}.side-foot a{text-decoration:none}.side-foot a:hover{text-decoration:underline}.link-button{border:0;padding:0;background:none;font:inherit;color:inherit;cursor:pointer}.link-button:hover{text-decoration:underline}

/* Over the map, centred in the part Therese leaves free */
.view-controls{position:absolute;z-index:4;bottom:22px;left:calc(var(--side-w) + (100% - var(--side-w))/2);transform:translateX(-50%);display:flex;gap:4px;padding:5px;background:#fffdf8f0;border:1px solid #fff;border-radius:14px;box-shadow:0 8px 30px #0b2b4526;white-space:nowrap}
.view-controls button{border:0;background:transparent;border-radius:10px;padding:11px 15px;color:var(--ink-2);font-size:.78rem}.view-controls button span{margin-right:5px;font-size:15px}
.view-controls button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.view-controls button:hover{box-shadow:inset 0 0 0 1px var(--gold)}
.map-tools{position:absolute;z-index:4;right:20px;bottom:64px;display:grid;gap:8px} /* bottom right above the scale, as Google Maps stacks them */
.map-tools button{width:44px;height:44px;border:1px solid #fff;border-radius:50%;background:#fffdf8ec;color:var(--ink);box-shadow:0 3px 16px #0b2b451f;font-size:14px}
.map-tools #north{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:8px}.north-arrow{font-size:22px;line-height:20px}
.map-meta{position:absolute;z-index:3;right:20px;bottom:24px;display:flex;align-items:flex-end;gap:16px;pointer-events:none;font-size:.62rem;color:var(--ink-2)}
.scale{width:110px;line-height:1.8}#scale-bar{height:5px;width:100px;border:solid var(--ink);border-width:0 1px 2px}
#coordinates{font:.6rem ui-monospace,monospace;color:var(--ink-3)}
#status{position:absolute;z-index:7;top:22px;left:calc(var(--side-w) + (100% - var(--side-w))/2);transform:translateX(-50%);max-width:440px;padding:12px 18px;background:#fffdf8f5;border:1px solid var(--line);border-radius:12px;font-size:.82rem;line-height:1.5}#status.error{background:#fff0de;border-color:#b88c55}
#walk-help{position:absolute;z-index:4;bottom:84px;left:calc(var(--side-w) + (100% - var(--side-w))/2);transform:translateX(-50%);white-space:nowrap;gap:10px;align-items:center;padding:6px 6px 6px 13px;border-radius:10px;background:#0b2b45e6;color:var(--paper);font-size:.7rem}
#touch-pad{position:absolute;z-index:4;right:80px;bottom:132px;grid-template-columns:repeat(3,44px);gap:4px}#touch-pad:not([hidden]){display:grid} /* left of the map tools, above the help line; its top (224 px up) stays under the walk's ground chips (main.mjs, 232 px) */
#touch-pad button{height:44px;border:1px solid #fff9;border-radius:10px;background:#fffdf8ec;color:var(--ink);font-size:19px}#touch-pad button:first-child{grid-column:2}#touch-pad button:nth-child(2){grid-row:2;grid-column:1}#touch-pad button:nth-child(3){grid-row:2;grid-column:2}#touch-pad button:nth-child(4){grid-row:2;grid-column:3}
.map-label{position:absolute;pointer-events:auto;white-space:nowrap;color:var(--ink);font:600 11px/1 var(--sans);background:#fffdf8d9;padding:6px 9px;border:1px solid #fff;border-radius:6px;box-shadow:0 2px 8px #0b2b4514;transform:translate(-50%,-100%)}
.map-label.selected{background:var(--ink);color:var(--paper);border-color:var(--ink)}
/* Walk mode's ground chips (main.mjs, updateGroundChips): each stands just above its spot on the ground at a ride's ticket booth */
#ground-chips{position:absolute;inset:0;z-index:2;pointer-events:none}
.ground-chip{position:absolute;align-items:center;gap:4px;padding:4px 4px 4px 11px;border-radius:999px;background:#0b2b45e6;color:var(--paper);font:600 11px/1 var(--sans);white-space:nowrap;transform:translate(-50%,calc(-100% - 9px));pointer-events:auto;box-shadow:0 3px 12px #0b2b4540}
.ground-chip:not([hidden]){display:flex}
.ground-chip::after{content:"";position:absolute;left:50%;top:calc(100% + 6px);width:16px;height:6px;margin-left:-8px;border-radius:50%;background:#0b2b45cc;box-shadow:0 0 0 2px #f8f5ec99}.ground-chip.edge::after{display:none}
.ground-chip button{border:1px solid #f8f5ec66;background:transparent;color:inherit;border-radius:999px;padding:.55em .9em;font:inherit}.ground-chip button:hover{background:#f8f5ec1f}
/* The map's chip menu: the picked ride's or tent's actions in a pill right above its name chip, with a small pointer down to it. */
.chip-menu{position:absolute;z-index:3;align-items:center;gap:4px;padding:4px;border-radius:999px;background:#0b2b45f2;color:var(--paper);font:600 11px/1 var(--sans);white-space:nowrap;transform:translate(-50%,-100%);pointer-events:auto;box-shadow:0 4px 14px #0b2b4547}
.chip-menu:not([hidden]){display:flex}
.chip-menu::after{content:"";position:absolute;left:50%;top:100%;margin-left:-5px;border:5px solid transparent;border-top-color:#0b2b45f2;border-bottom:0}
.chip-menu button{border:1px solid #f8f5ec66;background:transparent;color:inherit;border-radius:999px;padding:.55em .9em;font:inherit;cursor:pointer}.chip-menu button:hover{background:#f8f5ec1f}
.carrying .chip-menu{display:none!important}

/* The figure (Google's Pegman, as Therese): carried at its head, the lanes light up, the ring marks where it will stand */
.map-tools #pegman{display:grid;place-items:center;padding:0;touch-action:none;cursor:grab}.map-tools #pegman svg{width:20px;height:32px}
.carrying #pegman svg{opacity:.25}.carrying #viewport canvas{cursor:crosshair}.carrying .map-label{opacity:.35;pointer-events:none}
.lanes{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:none;overflow:visible}
.lanes path{fill:none;stroke:#C9A962;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.lanes path.glow{stroke:#0B2B45;stroke-width:8;opacity:.16}
.figure{position:fixed;z-index:60;left:0;top:0;width:32px;height:52px;pointer-events:none;transform-origin:16px 4px;will-change:transform;filter:drop-shadow(0 6px 6px #0b2b4540)}.figure svg{display:block;width:32px;height:52px}
.drop-ring{position:fixed;z-index:59;left:0;top:0;width:30px;height:12px;margin:-6px 0 0 -15px;border:2px solid var(--gold);border-radius:50%;background:#c9a96240;pointer-events:none}.drop-ring.on-place{background:#c9a962b0}.drop-ring[data-name]:not([data-name=""])::after{content:attr(data-name);position:absolute;left:50%;top:16px;transform:translateX(-50%);white-space:nowrap;padding:5px 8px;border-radius:6px;background:var(--ink);color:var(--paper);font:600 11px/1 var(--sans)}
#spot-help{position:absolute;z-index:5;bottom:84px;left:calc(var(--side-w) + (100% - var(--side-w))/2);transform:translateX(-50%);gap:10px;align-items:center;padding:7px 7px 7px 14px;border-radius:12px;background:#0b2b45f0;color:var(--paper);font-size:.8rem;white-space:nowrap;box-shadow:0 8px 24px #0b2b4533}
#spot-help:not([hidden]),#walk-help:not([hidden]){display:flex}
#spot-help button,#walk-help button{border:1px solid #f8f5ec66;background:transparent;color:var(--paper);border-radius:999px;padding:.4em .85em;font-size:.75rem}#spot-help button:hover,#walk-help button:hover{background:#f8f5ec1f}

.about-top{position:absolute;z-index:9;top:20px;right:20px;display:flex;align-items:center;height:40px;padding:0 16px;border:1px solid #fff;border-radius:999px;background:#fffdf8f2;color:var(--ink);font:600 .85rem var(--sans);text-decoration:none;box-shadow:0 6px 20px #07162533}
.about-top:hover{border-color:var(--gold)}

/* As in Google and Apple Maps (J, 2026-09-27): one field for questions and places, and a place card with tiles: the shared
   single view, standing in front of it, asking Therese, and entering it where an interior exists. */
.place-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0 8px}
.tile{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-height:84px;padding:10px 11px;border:1px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);text-align:left;line-height:1.2}
.tile:hover{border-color:var(--gold)}
.tile svg{width:22px;height:22px;margin-bottom:4px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}.tile svg circle{fill:currentColor;stroke:none}
.tile b{font:640 .9rem/1.15 var(--serif)}.tile small{font-size:.62rem;color:var(--ink-2)}
.tile-main{background:var(--ink);border-color:var(--ink);color:var(--paper)}.tile-main svg{color:var(--gold)}.tile-main small{color:#f8f5ecc4}
#place-tiles #wm-interior-enter{margin:0;width:auto;min-height:84px;padding:10px 11px;border:1px solid var(--gold);border-radius:14px;background:var(--card);color:var(--ink);font:640 .92rem/1.15 var(--serif);text-align:left}
.place-info{margin-top:6px;font-size:.72rem}.place-info summary{color:var(--ink-2)}.place-info dl{margin:6px 0}

/* Over the single view (a modal dialog) Therese folds into a button where the old launcher sat */
dialog .map-chat-root{position:fixed;z-index:40;right:22px;bottom:22px;width:min(380px,calc(100vw - 32px));max-height:min(72dvh,600px);background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 40px #0b2b4540;overflow:hidden}
dialog .map-chat-toggle{display:block;flex:none;width:100%;border:0;background:var(--ink);color:var(--paper);padding:12px 18px;font-weight:700;text-align:left}
dialog .map-chat-root:not(.open){width:auto;border-radius:999px}dialog .map-chat-root:not(.open) .map-chat{display:none}

@media (min-width:820px) and (max-width:1100px){:root{--side-w:340px}.view-controls button{padding:10px 11px}.map-meta #coordinates{display:none}}
@media (max-width:819px){
  #app{min-height:520px}
  .side{inset:0;width:auto;display:block;background:none;border:0;box-shadow:none;pointer-events:none}
  .side-top{position:absolute;top:calc(env(safe-area-inset-top,0px) + 10px);left:10px;right:10px;padding:10px 12px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 6px 24px #0b2b4524;pointer-events:auto}
  .brand-mark{width:34px;height:33px}.brand-name{font-size:1.05rem}.brand-name small{display:none}
  .side-search{margin-top:8px}#place-search{padding:10px 12px 10px 34px;font-size:16px;background-position:10px 50%}
  .side-sheet{position:absolute;left:0;right:0;bottom:0;max-height:46dvh;padding-bottom:env(safe-area-inset-bottom,0px);background:var(--paper);border-radius:18px 18px 0 0;box-shadow:0 -10px 30px #0b2b4526;pointer-events:auto}
  .side-sheet.open{max-height:80dvh}
  .sheet-handle{display:block;flex:none;position:relative;width:100%;height:28px;border:0;background:none}
  .sheet-handle::before{content:"";position:absolute;top:11px;left:50%;width:40px;height:5px;margin-left:-20px;border-radius:3px;background:#c7c0b0}
  .sheet-min{display:block;position:absolute;z-index:1;top:0;right:6px;width:48px;height:28px;padding:0;border:0;background:none;color:var(--ink-3)}
  .sheet-min svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
  /* Minimized: the sheet gives the map back; a "Therese" pill brings it back, the credits stay in a slim strip (as at rest) */
  .side-sheet.min{max-height:none;padding-bottom:0;background:none;box-shadow:none;pointer-events:none}
  .side-sheet.min>:not(.sheet-handle):not(.side-foot){display:none}
  .side-sheet.min .side-foot{pointer-events:auto;background:var(--paper);padding-bottom:calc(8px + env(safe-area-inset-bottom,0px))}
  .side-sheet.min .sheet-handle{align-self:center;width:auto;height:44px;margin-bottom:8px;padding:0 22px;border-radius:999px;background:var(--ink);color:var(--paper);box-shadow:0 6px 20px #0b2b4540;font:700 .85rem var(--sans);pointer-events:auto}
  .side-sheet.min .sheet-handle::before{content:"Therese";position:static;display:inline;width:auto;height:auto;margin:0;background:none}
  .side-sheet:not(.open) .map-chat-messages>:not(.place-card),.side-sheet:not(.open) .map-chat-footer{display:none}
  .side-sheet:not(.open) .map-chat-messages{padding:0 12px 4px} /* at rest the sheet shows the place card alone, the conversation waits behind the handle */
  .place-card{margin:0 12px 4px;max-height:60%}
  .side-foot{padding:4px 14px 8px;text-align:center;font-size:.6rem}
  .view-controls{left:50%;bottom:calc(var(--sheet-h) + 10px);max-width:calc(100% - 20px)}.view-controls button{padding:9px 10px;font-size:.72rem}
  .map-tools{top:calc(var(--top-h) + 10px);bottom:auto;right:12px}.map-tools button{width:38px;height:38px}
  .side-top{padding:0;background:none;border:0;box-shadow:none;pointer-events:none}.side-top>*{pointer-events:auto}
  .side-head{position:absolute;z-index:1;left:8px;top:8px}.brand-name{display:none}
  .side-search{margin:0}#place-search{height:50px;padding:0 96px 0 52px;border:1px solid #fff;border-radius:25px;background-image:none;box-shadow:0 4px 18px #0b2b452e}#place-search::placeholder{font-size:.8em}
  .side-sheet:not(.open) .map-chat-form{display:none} /* one field at rest, as in Google Maps; the sheet's own field returns for the conversation */
  .about-top{top:calc(env(safe-area-inset-top,0px) + 19px);right:21px;height:32px;padding:0 12px;font-size:.75rem;box-shadow:none;background:var(--paper-2);border-color:var(--paper-2)}
  .map-meta{display:none}
  #status{top:calc(var(--top-h) + 12px);left:50%;width:min(92%,340px);font-size:.75rem}
  #walk-help{left:50%;bottom:calc(var(--sheet-h) + 64px);max-width:92%;white-space:normal;text-align:center;font-size:.62rem}
  #touch-pad{left:12px;right:auto;bottom:calc(var(--sheet-h) + 148px)} /* left, above the help line (77 px high at 320 px wide): the right edge holds the map tools and the rail */
  #spot-help{left:50%;bottom:calc(var(--sheet-h) + 64px);width:max-content;max-width:calc(100% - 20px);white-space:normal;flex-wrap:wrap;justify-content:center;text-align:center}
  .map-label{font-size:10px;padding:5px 7px}
  dialog .map-chat-root.open{top:64px;bottom:auto;left:10px;right:10px;width:auto;max-height:45dvh}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* Imprint, privacy (#122) and licences */
.legal{max-width:44rem;margin:0 auto;padding:28px 20px 48px;font-size:16px;line-height:1.55}.legal h1{font:640 34px/1.1 var(--serif)}.legal h2{margin:28px 0 6px;font:640 20px/1.25 var(--serif)}

/* The rail on the right, like the layer buttons of Google Maps: round buttons as the map tools, each opens its panel to the
   left, one at a time. Sonne holds Echte Sonne's day slider and the "Darstellung" choices (both built by map-runtime.mjs). */
.map-rail{position:absolute;z-index:5;right:20px;top:50%;transform:translateY(-50%);display:grid;gap:8px}
.rail-button{width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid #fff;border-radius:50%;background:#fffdf8ec;color:var(--ink);box-shadow:0 3px 16px #0b2b451f}
.rail-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rail-button:hover{box-shadow:0 3px 16px #0b2b451f,inset 0 0 0 1px var(--gold)}.rail-button[aria-expanded=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.rail-panel{position:absolute;right:56px;top:50%;transform:translateY(-50%);width:320px;max-height:calc(100dvh - 40px);overflow:auto;padding:12px 14px 14px;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 10px 36px #0b2b4526}
.rail-panel header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.rail-panel h2{margin:0;font:640 1.05rem/1.2 var(--serif)}
.rail-close{border:0;background:none;color:var(--ink-3);font-size:1.3rem;line-height:1;padding:2px 7px;border-radius:8px}.rail-close:hover{background:var(--paper-2)}
.wm-time{display:grid;grid-template-columns:auto auto 1fr auto;grid-template-areas:"icon time phase now" "slider slider slider slider";align-items:center;gap:8px;font-size:.8rem;color:var(--ink)}
.wm-time-icon{grid-area:icon;width:18px;text-align:center;font-size:17px;line-height:1;color:#c98a14}.wm-time[data-phase=golden-hour] .wm-time-icon{color:#d0761e}.wm-time[data-phase=evening] .wm-time-icon,.wm-time[data-phase=night] .wm-time-icon{color:#34487f}.wm-time[data-phase=fixed] .wm-time-icon{color:#8a978f}
.wm-time input{grid-area:slider;width:100%;height:26px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}.wm-time input:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:999px}
.wm-time input::-webkit-slider-runnable-track{height:10px;border-radius:999px;background:var(--wm-track,#a8d4f2);box-shadow:inset 0 0 0 1px #183c3426}.wm-time input::-moz-range-track{height:10px;border-radius:999px;background:var(--wm-track,#a8d4f2);box-shadow:inset 0 0 0 1px #183c3426}
.wm-time input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;margin-top:-6px;border-radius:50%;background:#fffdf8;border:2px solid var(--ink);box-shadow:0 2px 8px #183c3440}.wm-time input::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fffdf8;border:2px solid var(--ink)}
.wm-time output{grid-area:time;font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}.wm-time-phase{grid-area:phase;color:var(--ink-2)}
.wm-time-now{grid-area:now;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:999px;padding:6px 11px;font-size:.72rem;font-weight:700}.wm-time-now[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.wm-graphics{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:.78rem}.wm-graphics summary{font-weight:700;color:var(--ink-2)}.wm-graphics select{border:1px solid var(--line);background:var(--card)}.wm-graphics p{margin:8px 0 0;font-size:.7rem;color:var(--ink-3)}
.wm-performance{right:76px;bottom:64px}
/* Night (Echte Sonne after dusk, not in the plan view): the texts on the map turn light */
.wm-night .map-meta{color:#f3eee0}.wm-night #scale-bar{border-color:#f3eee0}
@media (max-width:819px){
  .map-rail{top:calc(var(--top-h) + 170px);right:12px;transform:none}
  .rail-panel{position:fixed;z-index:12;left:12px;right:12px;top:calc(var(--top-h) + 10px);transform:none;width:auto;max-height:calc(100dvh - var(--top-h) - var(--sheet-h) - 20px)}
  .wm-performance{right:12px;bottom:calc(var(--sheet-h) + 60px)}
}
/* Map symbols (poi-layer.mjs): a coloured dot per kind, the name beside it when there is room; the tent names stay on top */
.map-label{z-index:1}
.map-poi{position:absolute;display:flex;align-items:center;gap:4px;padding:0;border:0;background:none;transform:translate(-11px,-50%);pointer-events:auto;color:var(--ink);font:600 10.5px/1.1 var(--sans);white-space:nowrap}
.poi-dot{width:22px;height:22px;flex:none;display:grid;place-items:center;border-radius:50%;background:var(--poi);border:1.5px solid #fff;box-shadow:0 1px 5px #0b2b4540;color:#fff;font-size:9.5px;font-weight:700;letter-spacing:-.02em;transition:transform .12s}
.poi-dot svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.poi-name{display:none;padding:2px 5px;border-radius:5px;background:#fffdf8d9}.map-poi.named .poi-name{display:block}
.map-poi:hover .poi-dot,.map-poi:focus-visible .poi-dot{transform:scale(1.15)}.map-poi.selected .poi-dot{transform:scale(1.2);box-shadow:0 0 0 3px var(--gold),0 1px 5px #0b2b4540}
.wm-night .poi-name{background:#0b2b45cc;color:#f3eee0}
.webcam-preview-active .map-poi,.wm-interior-active .map-poi{display:none}.carrying .map-poi{opacity:.35;pointer-events:none} /* no symbols over a webcam still or inside a tent */
/* Orte in the rail: all symbols, then each group with its colour and count */
.poi-all{display:flex;align-items:center;gap:9px;padding:2px 2px 10px;border-bottom:1px solid var(--line);font-size:.85rem;font-weight:700}
.poi-groups{display:grid;gap:1px;margin:8px 0 0;padding:0;border:0;min-width:0}.poi-groups legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.poi-groups:disabled{opacity:.45}
.poi-group{display:flex;align-items:center;gap:9px;padding:5px 2px;border-radius:8px;font-size:.82rem}.poi-group:hover{background:var(--paper-2)}.poi-group small{margin-left:auto;color:var(--ink-3);font-variant-numeric:tabular-nums}
.poi-swatch{width:12px;height:12px;flex:none;border-radius:50%;background:var(--poi);box-shadow:0 0 0 1.5px #fff,0 0 0 2.5px var(--line)}
.rail-panel input[type=checkbox]{width:16px;height:16px;margin:0;accent-color:var(--ink)}

/* Weather choices share the rail's paper and ink. */
#panel-weather p{font-size:.78rem;line-height:1.5;color:var(--ink-2);margin:8px 0}.weather-choices{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}.weather-choices button{border:1px solid var(--line);border-radius:999px;padding:8px 11px;background:transparent;color:var(--ink);font-size:.75rem}.weather-choices button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.weather-choices button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
