:root { color-scheme: dark; background: #181f1c; color: #e5e8e1; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.55;
  font-size: 18px;
  background: #19201e;
  min-height: 100vh;
}
body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 40% 85% at -8% 50%, #719c8136, transparent 85%),
    radial-gradient(ellipse 40% 85% at 108% 50%, #719c8136, transparent 85%),
    radial-gradient(ellipse 80% 35% at 50% -15%, #62897424, transparent 85%),
    radial-gradient(ellipse 80% 45% at 50% 115%, #74a88c29, transparent 85%);
}
.site-header { position: relative; display: flex; justify-content: space-between; gap: 24px; max-width: 1184px; margin: 0 auto; padding: 30px 32px 0; font-size: 1rem; }
.site-header a { color: #e5e8e1; text-decoration-color: #a6c9b7; text-underline-offset: 8px; }
main { position: relative; max-width: 780px; margin: 0 auto; padding: 46px 24px 80px; }
h1 { font-size: clamp(2rem, 5vw, 2.6rem); font-weight: 400; line-height: 1.2; margin: 0 0 24px; letter-spacing: -0.025em; }
h2 { font-size: 1.25rem; margin: 34px 0 12px; }
h3 { font-size: 1.05rem; margin: 27px 0 9px; }
p { margin: 0 0 18px; }
.intro { font-size: 1.1em; }
.eyebrow { font-size: 0.78rem; font-weight: 400; letter-spacing: 0.16em; text-transform: uppercase; color: #b0cebd; }
.contents { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 30px 0 34px; padding: 14px 0; border-top: 1px solid rgba(127,127,127,.25); border-bottom: 1px solid rgba(127,127,127,.25); font-size: .92rem; }
.contents strong { margin-right: 8px; }
ul { padding-left: 22px; margin: 0; }
li { margin: 0 0 12px; }
.facts { margin: 0; }
.facts div { display: grid; grid-template-columns: 130px 1fr; gap: 12px; padding: 8px 0; border-top: 1px solid rgba(127,127,127,.25); }
.facts dt { font-weight: 700; }
.facts dd { margin: 0; }
.work { list-style: none; padding: 0; }
.work li { padding: 10px 0; border-top: 1px solid rgba(127,127,127,.25); }
.references { font-size: .94rem; }
a { color: #a6c9b7; text-underline-offset: 3px; }
a:hover { color: #d4eddf; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid #a6c9b7; outline-offset: 5px; }
main > section { padding: 24px 30px; margin-top: 16px; border: 1px solid #63857040; border-radius: 7px; background: #8cac9308; }
main > section > h2:first-child { margin-top: 0; }
main > section > :last-child { margin-bottom: 0; }
.now-section { margin: 16px 0; }
.now-section p { margin: 0; }
.now-hero { margin-top: 0; padding-top: 28px; padding-bottom: 28px; }
.now-hero .eyebrow { margin-bottom: 12px; }
.now-hero h1 { margin-bottom: 24px; }
.wind-background { position: fixed; inset: 0; pointer-events: none; z-index: 0; }
.wind-background canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: opacity 1.4s ease; }
.shore-canvas { z-index: 0; opacity: .07; image-rendering: pixelated; filter: contrast(1.08) saturate(.86); -webkit-mask-image: linear-gradient(to bottom, transparent, rgb(0 0 0 / .12) 12%, rgb(0 0 0 / .4) 25%, #000 40%); mask-image: linear-gradient(to bottom, transparent, rgb(0 0 0 / .12) 12%, rgb(0 0 0 / .4) 25%, #000 40%); }
.wind-canvas { z-index: 1; opacity: .15; }
body::before { z-index: 1; }
.site-header, main { z-index: 2; transition: opacity 1s ease, transform 1s ease; }
.wind-focused .shore-canvas { opacity: .95; filter: none; -webkit-mask-image: linear-gradient(to bottom, rgb(0 0 0 / .48), rgb(0 0 0 / .78) 18%, #000 38%); mask-image: linear-gradient(to bottom, rgb(0 0 0 / .48), rgb(0 0 0 / .78) 18%, #000 38%); }
.wind-focused .wind-canvas { opacity: var(--coast-wind-opacity, .7); mix-blend-mode: screen; -webkit-mask-image: linear-gradient(to bottom, #000 52%, rgb(0 0 0 / .8) 72%, rgb(0 0 0 / .3)); mask-image: linear-gradient(to bottom, #000 52%, rgb(0 0 0 / .8) 72%, rgb(0 0 0 / .3)); }
.wind-focused::before { opacity: var(--coast-veil-opacity, 1); }
.wind-focused { background: #030708; }
.wind-focused .site-header, .wind-focused main { opacity: 0; transform: translateY(5px); pointer-events: none; }
.wind-focused { overflow: hidden; }
.wind-invitation { margin-top: 30px; }
.wind-invitation button, .wind-experience button { font: inherit; font-size: .85rem; min-height: 44px; padding: 9px 13px; border: 1px solid #759c7d44; border-radius: 5px; background: #17231c45; color: #c0d3c6; cursor: pointer; }
.wind-invitation button:hover, .wind-experience button:hover { background: #729e801c; border-color: #89b99a80; }
.wind-invitation button:disabled { opacity: .5; cursor: default; }
.wind-experience { position: fixed; inset: 0; width: 100%; height: 100dvh; max-width: none; max-height: none; box-sizing: border-box; margin: 0; padding: 0; border: 0; background: transparent; color: #e5e8e1; }
.wind-experience::backdrop { background: transparent; }
.wind-experience:focus { outline: none; }
.wind-experience[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.resident-canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.wind-experience .resident-shell { position: absolute; z-index: 1; width: 44px; height: 44px; padding: 0; min-height: 44px; transform: translate(-50%, -50%); border: 0; border-radius: 50%; background: transparent; box-shadow: none; }
.wind-experience .resident-shell:hover { background: transparent; border: 0; }
.wind-experience .resident-shell:focus-visible { outline: 1px solid #dfead380; outline-offset: 0; background: #dfead30b; }
.resident-shell[hidden] { display: none; }
.resident-quiet-hint { position: absolute; z-index: 1; width: 240px; max-width: calc(100% - 32px); margin: 0; transform: translate(-50%, -100%); text-align: center; pointer-events: none; font-size: 11px; line-height: 1.5; letter-spacing: .025em; color: rgb(223 237 226 / .76); text-shadow: 0 1px 8px #0b211a; opacity: 0; animation: resident-quiet-hint 6s ease both; }
.resident-quiet-hint[hidden] { display: none; }
@keyframes resident-quiet-hint { 0%, 100% { opacity: 0; } 12%, 76% { opacity: 1; } }
.resident-hold-ring { position: absolute; z-index: 1; width: 36px; height: 36px; transform: translate(-50%, -50%); pointer-events: none; }
.resident-hold-ring svg { display: block; width: 100%; height: 100%; overflow: visible; }
.resident-hold-track { fill: none; stroke: rgb(229 246 235 / .2); stroke-width: 1; }
.resident-hold-progress { fill: none; stroke: rgb(229 246 235 / .75); stroke-width: 1.5; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; transform: rotate(-90deg); transform-origin: center; animation: resident-hold-progress .8s linear both; }
@keyframes resident-hold-progress { to { stroke-dashoffset: 0; } }
.resident-invitation-ripple { position: absolute; z-index: 1; width: 18px; height: 18px; box-sizing: border-box; border: 1px solid rgb(235 250 240 / .48); border-radius: 50%; background: radial-gradient(circle, rgb(235 250 240 / .2), transparent 70%); pointer-events: none; opacity: 0; animation: resident-invitation 1.6s cubic-bezier(.16, .6, .3, 1) both; }
.resident-invitation-ripple::after { content: ''; position: absolute; inset: 4px; border: 1px solid rgb(235 250 240 / .2); border-radius: 50%; }
@keyframes resident-invitation { 0% { opacity: .8; transform: translate(-50%, -50%) scale(.4); } 18% { opacity: .65; } 100% { opacity: 0; transform: translate(-50%, -50%) scale(3.4); } }
@keyframes resident-invitation-quiet { 0% { opacity: .65; } 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .resident-invitation-ripple { transform: translate(-50%, -50%); animation-name: resident-invitation-quiet; } }
.wind-immersive-notice { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.wind-note { grid-row: 2; align-self: center; justify-self: center; width: min(740px, calc(100% - 40px)); max-height: calc(100dvh - 190px); overflow: auto; scrollbar-width: thin; scrollbar-color: #63857060 transparent; box-sizing: border-box; padding: 28px 34px; border: 1px solid #83a88d45; border-radius: 8px; background: var(--coast-surface); box-shadow: 0 12px 70px #07130c30; opacity: 0; transform: translateY(5px); pointer-events: none; transition: opacity 650ms ease, transform 650ms ease; }
.wind-note.is-visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
.wind-note[inert] { pointer-events: none; }
.wind-note[hidden] { display: none; }
.wind-note { min-height: 0; max-height: min(calc(100dvh - 190px), 100%); }
.coast-usage-choice { margin-top: 24px; border-top: 1px solid #83a88d28; padding-top: 16px; font-size: .84rem; line-height: 1.6; }
.coast-usage-choice summary { cursor: pointer; min-height: 44px; display: list-item; }
.coast-usage-choice label { display: flex; align-items: center; gap: 10px; min-height: 44px; cursor: pointer; }
.coast-usage-choice input { flex-shrink: 0; width: 18px; height: 18px; accent-color: #91c9ad; }
.wind-note .eyebrow { margin: 0 0 10px; font-size: .7rem; }
.wind-note h2 { margin: 0 0 16px; font-size: 1.3rem; font-weight: 400; }
.wind-explanation { font-size: .85rem; color: #b1c6ba; line-height: 1.55; }
.wind-resident-hint { font-size: .78rem; color: #b1c6ba; }
.wind-story { border-top: 1px solid #83a88d28; padding-top: 18px; font-size: 1rem; line-height: 1.6; }
.wind-story p { margin-bottom: 15px; }
.wind-note-end { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: .85rem; color: #a6c1b1; }
.station-tabs { display: flex; gap: 6px; padding: 8px 0 12px; }
.wind-experience .station-tabs button { min-height: 44px; flex: 1; border: 0; border-radius: 8px; padding: 10px; background: transparent; color: #afc8b8; }
.wind-experience .station-tabs button[aria-selected="true"] { color: #edddbc; background: var(--coast-selected); }
.station-tabs button:focus-visible { outline: 2px solid #e8c994; outline-offset: 2px; }
.station-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 8px; }
.station-section-heading h2, .station-section-heading h3 { margin: 0; font-size: .88rem; font-weight: 400; color: #dce8d8; }
.station-section-heading span, .station-sky small, .station-condition-grid small, .station-moon-cycle-labels { color: #afc8b8; font-size: .7rem; }
.station-wave-readings { display: flex; justify-content: space-between; gap: 16px; }
.wind-sensors strong { display: block; margin-top: 5px; font-size: 1.08rem; font-weight: 400; color: #edddbc; font-variant-numeric: tabular-nums; }
.station-wave { margin: 12px 0 0; }
.station-wave svg { display: block; width: 100%; height: 110px; border-radius: 8px; background: #071710; }
.station-wave-line { fill: none; stroke: #91d1b8; stroke-width: 2; vector-effect: non-scaling-stroke; }
.station-wave-mean { fill: none; stroke: #658b7350; stroke-width: 1; stroke-dasharray: 4 6; }
.station-wave-bracket { fill: none; stroke: #edc994; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.station-wave-dot { fill: #f0ddae; }
.station-wave figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding: 8px 0; font-size: .7rem; color: #afc8b8; }
.station-disclaimer { margin: 8px 0 12px; }
.station-condition-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding-top: 12px; border-top: 1px solid #83a88d28; }
.station-wind-row { display: flex; gap: 12px; align-items: center; }
.station-compass { flex: 0 0 52px; height: 52px; border: 1px solid #658b7370; border-radius: 50%; position: relative; text-align: center; color: #e3d5ae; }
.station-compass span { position: absolute; top: -8px; left: 21px; font-size: .65rem; background: #0b1d16; }
.station-compass div { font-size: 28px; line-height: 52px; transform-origin: center; }
.station-sky { margin-top: 22px; padding-top: 18px; border-top: 1px solid #83a88d28; }
.station-sky > div { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 6px 0; }
.station-sky [data-station-value="scene"] { text-transform: capitalize; }
.wind-sensors meter, .wind-sensors progress { display: block; height: 10px; width: 100%; margin: 12px 0; accent-color: #91c9ad; }
.wind-sensors meter[hidden], .wind-sensors progress[hidden], .station-sky > div[hidden] { display: none; }
.station-sky progress { width: 100px; margin: 0; }
.station-sky .station-moon { justify-content: flex-start; margin: 12px 0; }
.station-moon svg { width: 84px; height: 84px; flex: 0 0 84px; }
.station-moon-dark { fill: #0b1814; stroke: #afc8b870; stroke-width: 1; }
.station-moon-lit { fill: #e4d8b5; }
.station-moon-cycle { position: relative; margin: 12px 0 4px; height: 8px; border-radius: 4px; background: #afc8b830; }
.station-moon-cycle::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, #afc8b870 0 1px, transparent 1px 25%); }
.station-moon-cycle i { position: absolute; left: var(--moon-position, 0%); top: -3px; width: 14px; height: 14px; border: 1px solid #edddbc; border-radius: 50%; background: #edddbc; transform: translateX(-50%); }
.station-sky .station-moon-cycle { display: block; padding: 0; }
.station-sky .station-moon-cycle-labels { display: grid; grid-template-columns: repeat(5, 1fr); align-items: start; gap: 4px; margin: 8px 0 12px; }
.station-moon-cycle-labels span { text-align: center; }
.station-moon-cycle-labels span:first-child { text-align: left; }
.station-moon-cycle-labels span:last-child { text-align: right; }
.wind-sensors dd { max-width: 230px; overflow-wrap: anywhere; }
.wind-sensors a { pointer-events: auto; }
@media (prefers-reduced-motion: reduce) { .wind-background canvas, .site-header, main, .wind-note { transition: none; } }
footer { margin-top: 28px; padding: 0 3px; font-size: .94rem; opacity: .8; }
footer .updated { font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 8px; }
@media (max-width: 540px) { body { font-size: 16px; } .site-header { padding: 24px 18px 0; } main { padding: 32px 18px 56px; } .facts div { grid-template-columns: 1fr; gap: 0; } main > section { padding: 20px; } .wind-experience button { padding: 10px 9px; font-size: .78rem; } .wind-note { padding: 22px; width: calc(100% - 32px); max-height: calc(100dvh - 190px); } }

.wind-experience [data-wind-about][aria-pressed="true"] { color: #e0f0e5; background: #729e801c; }
.wind-experience [data-wind-about] { transition: color 650ms ease, border-color 650ms ease, background-color 650ms ease, box-shadow 650ms ease; }
.wind-note-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.wind-note-heading .eyebrow { margin: 0; }
.wind-note-heading button { flex-shrink: 0; font-size: .75rem; }
@media (prefers-reduced-motion: reduce) { .wind-experience [data-wind-about] { transition: none; } }

/* The experience has a second entrance in the site's top navigation. */
.site-header { align-items: center; }
.site-actions { display: flex; align-items: center; gap: 24px; }
.wind-entry { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; padding: 9px 17px 9px 13px; box-sizing: border-box; border: 1px solid #94bca36b; border-radius: 999px; background: #789d8312; color: #c4ddce; box-shadow: 0 0 20px #83b79812; font: inherit; font-size: .85rem; cursor: pointer; transition: background-color 500ms ease, box-shadow 500ms ease; }
.wind-entry svg { flex: 0 0 26px; }
.wind-entry-label { white-space: nowrap; }
.wind-entry:is(:hover, :focus-visible) { gap: 10px; padding-inline: 13px 17px; background: #789d8324; box-shadow: 0 0 25px #83b79826; }
.wind-stroke { transition: transform 600ms ease, stroke-dashoffset 600ms ease; transform-origin: center; stroke-dasharray: 40 5; }
.wind-entry:is(:hover, :focus-visible) .wind-stroke-top { transform: translateX(1px) scaleX(1.04); stroke-dashoffset: -4; }
.wind-entry:is(:hover, :focus-visible) .wind-stroke-middle { transform: translateX(-1px); stroke-dashoffset: 3; }
.wind-entry:is(:hover, :focus-visible) .wind-stroke-bottom { transform: translateX(1px) scaleX(.96); stroke-dashoffset: -3; }
.wind-entry:disabled { opacity: .5; cursor: default; }
@media (max-width: 540px) {
  .site-header { display: grid; grid-template-columns: 1fr auto; gap: 14px; }
  .site-actions { display: contents; }
  .site-actions > a { justify-self: end; }
  .wind-entry { grid-column: 1 / -1; justify-self: end; gap: 10px; padding-inline: 13px 17px; }
}
@media (prefers-reduced-motion: reduce) { .wind-entry, .wind-entry-label, .wind-stroke { transition: none; } }
@media (max-width: 540px) {
  .wind-note { max-height: min(calc(100dvh - 250px), 100%); }
}

/* Local optional story: captions echo the resident's quiet sand hint. */
.coast-story { position:absolute; z-index:3; inset:0; pointer-events:none; color:#dfe9e2; }
.coast-story[hidden] { display:none; }
.coast-story-caption { position:absolute; left:50%; top:43%; transform:translate(-50%,-50%); width:430px; max-width:calc(100% - 56px); margin:0; text-align:center; font-size:12px; line-height:1.7; letter-spacing:.025em; color:rgb(223 237 226 / .86); text-shadow:0 1px 8px #0b211a,0 1px 3px #030a07; }
.wind-experience.story-view .wind-resident-hint {display:none;}
@media(max-width:600px) { .coast-story-caption {font-size:12px;max-width:calc(100% - 40px);top:43%;} }

/* The coast keeps moving behind this quiet choice. No extra modal or backdrop. */
.coast-entry {position:absolute;inset:0;z-index:4;display:grid;place-items:center;color:#dfe9e2;}
.coast-entry[hidden] {display:none;}
.coast-entry-inner {width:min(420px,calc(100% - 40px));text-align:center;transform:translateY(-10vh);}
.coast-entry-title {font-size:12px;letter-spacing:.08em;margin:0 0 22px;color:rgb(223 237 226 / .7);text-shadow:0 1px 8px #030a07;}
.coast-entry-choices {display:flex;justify-content:center;gap:34px;}
.coast-entry-choice {position:relative;flex:1;max-width:170px;}
.wind-experience .coast-entry-choice button {min-height:48px;min-width:110px;padding:8px 14px;border:0;background:rgb(7 20 15 / .55);border-radius:6px;color:#dfe9e2;font-size:16px;}
.coast-entry-choice button:focus-visible {outline:2px solid #dfe9e2;outline-offset:4px;}
.coast-entry-description {position:absolute;top:100%;left:50%;transform:translateX(-50%);width:190px;max-width:44vw;margin:12px 0 0;padding:10px;box-sizing:border-box;border-radius:6px;background:rgb(7 20 15 / .88);font-size:11px;line-height:1.6;color:#c6d5ca;visibility:hidden;opacity:0;transition:opacity 180ms ease;pointer-events:none;}
.coast-entry-choice:hover .coast-entry-description,.coast-entry-choice:focus-within .coast-entry-description {visibility:visible;opacity:1;}
@media(hover:none) { .coast-entry-description {position:relative;left:auto;transform:none;width:auto;max-width:none;background:rgb(7 20 15 / .55);visibility:visible;opacity:1;} .coast-entry-choices {gap:16px;} }
@media(prefers-reduced-motion:reduce) {.coast-entry-description,.coast-console {transition:none;}}

.coast-volume {display:flex;align-items:center;gap:8px;box-sizing:border-box;width:190px;max-width:100%;min-height:44px;padding:0 8px;color:#dce8d8;font-size:11px;background:rgb(7 20 15 / .55);border-radius:5px;}
.coast-volume input[type="range"] {flex:1;min-width:50px;width:86px;min-height:44px;margin:0;accent-color:#a9c6b2;cursor:pointer;}
.coast-volume input:focus-visible {outline:2px solid #eef3ee;outline-offset:1px;border-radius:4px;}
.coast-volume output {min-width:4ch;text-align:right;font-variant-numeric:tabular-nums;}
.coast-mix {margin:14px 0 0;padding:8px 0 0;min-width:0;border:0;border-top:1px solid #83a88d40;}
.coast-mix legend {padding:0 8px 0 0;color:#edddbc;font-size:12px;}
.coast-track-volume {width:100%;background:transparent;padding:0;gap:12px;font-size:12px;}
.coast-track-volume>span {min-width:4ch;}
.coast-mix-note {margin:5px 0 0;color:#b4cbbb;font-size:11px;line-height:1.6;}
.coast-update {margin:18px 0;border-top:1px solid #83a88d40;font-size:12px;line-height:1.7;color:#c8dccc;}
.coast-update summary {display:flex;align-items:center;min-height:44px;cursor:pointer;color:#edddbc;}
.coast-update summary:focus-visible {outline:2px solid #e8c994;outline-offset:2px;}

/* Shared Coast player and Field-station console. */
.coast-console {position:absolute;z-index:5;left:max(12px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));width:min(470px,calc(100% - 24px));pointer-events:none;transition:opacity 450ms ease;}
.coast-console[hidden],.coast-console [hidden] {display:none;}
.coast-dock {display:flex;align-items:center;gap:4px;width:fit-content;max-width:100%;padding:4px;border:1px solid #83a88d60;border-radius:9px;background:var(--coast-surface);box-shadow:0 4px 20px #030a0740;pointer-events:auto;transition:opacity 650ms ease;}
.wind-experience .coast-dock button {display:inline-flex;align-items:center;justify-content:center;min-height:44px;box-sizing:border-box;border:0;border-radius:5px;background:transparent;color:#dce8d8;padding:0 10px;font-size:12px;}
.wind-experience .coast-dock .coast-player-button {width:44px;min-width:44px;padding:0;}
.wind-experience .coast-dock .coast-console-trigger {gap:4px;color:#edddbc;}
.coast-dock button:hover,.console-actions button:hover,.coast-console-footer button:hover {background:#729e8020;}
.coast-console button:focus-visible {outline:2px solid #e8c994;outline-offset:2px;}
.coast-dock button:disabled {opacity:.4;cursor:default;}
.coast-console-panel:not([open]) {display:none;}
.coast-console-panel[open] {position:absolute;left:0;bottom:max(calc(100% + 10px),calc(10dvh + 10px));font-size:13px;line-height:1.55;width:100%;max-height:min(620px,calc(100dvh - 110px));box-sizing:border-box;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:12px 16px 10px;border:1px solid #83a88d60;border-radius:10px;background:var(--coast-surface);box-shadow:0 10px 35px #030a0760;pointer-events:auto;}
.coast-console-panel > summary {display:none;}
.coast-console-panel .station-tabs {gap:2px;padding:0 0 10px;}
.wind-experience .coast-console-panel .station-tabs button {min-width:0;padding:8px 4px;font-size:12px;}
.console-actions {display:flex;flex-wrap:wrap;gap:4px;margin-top:10px;}
.wind-experience .console-actions button,.wind-experience .coast-console-footer button {min-height:44px;max-width:100%;padding:8px 10px;border:0;border-radius:5px;background:transparent;color:#c8dccc;font-size:12px;}
.coast-console-footer {display:flex;flex-wrap:wrap;gap:2px;margin:12px 0 0;padding:8px 0 0;border-top:1px solid #83a88d28;font-size:11px;opacity:1;}
.console-story-note {margin:0 0 12px;font-size:11px;line-height:1.5;color:#edc994;}
.wind-experience.ui-hidden {cursor:none;}
.wind-experience.ui-hidden .coast-console {opacity:0;pointer-events:none;}
@media(prefers-reduced-motion:reduce) {.coast-console,.coast-dock {transition:none;}}

.station-condition-grid small {display:block;}
@media(max-width:380px) {.station-condition-grid {grid-template-columns:minmax(0,1fr);gap:18px;}}

/* One translucent scene material; text and controls retain full opacity. */
.wind-experience {--coast-surface:rgb(11 29 22 / .82);--coast-selected:rgb(48 75 58 / .8);}
.wind-experience .coast-entry-choice button,.coast-entry-description {background:var(--coast-surface);}
.coast-dock {width:fit-content;}
.coast-dock .coast-volume {width:110px;flex:0 1 110px;min-width:86px;padding:0 3px;gap:3px;background:rgb(7 20 15 / .75);}
.coast-dock .coast-volume input {width:58px;}
.coast-volume-label {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);}
.coast-expand {flex:none;transition:transform 200ms ease;}
[aria-expanded="true"] > .coast-expand {transform:rotate(180deg);}
.console-heading {display:flex;align-items:center;justify-content:space-between;color:#edddbc;}
.wind-experience .console-heading button {min-height:44px;border:0;background:transparent;color:#dce8d8;font-size:12px;}
.console-playback-status {margin:0 0 10px;color:#edddbc;font-size:12px;}
.console-actions button[aria-pressed="true"] {background:var(--coast-selected);color:#edddbc;}
.station-provenance {font-size:11px;line-height:1.5;overflow-wrap:anywhere;}
.station-air {margin-top:20px;border-top:1px solid #83a88d45;padding-top:12px;}
@media(max-width:380px) {.coast-dock-name {display:none;}.wind-experience .coast-dock .coast-console-trigger {padding:0 5px;font-size:11px;}.coast-dock .coast-volume {width:93px;flex-basis:93px;}.coast-dock {gap:2px;}}

/* One caption node joins Experience while that panel is open. */
.coast-story-caption[data-inline="true"] {position:static;transform:none;width:auto;max-width:none;margin:6px 0 16px;text-align:left;color:#dfe9e2;text-shadow:none;}
.coast-story-caption[data-inline="true"]:empty {display:none;}
.console-help {margin-top:12px;color:#c8dccc;}
.console-help summary {min-height:44px;display:flex;align-items:center;cursor:pointer;color:#edddbc;}
.console-help summary:focus-visible {outline:2px solid #e8c994;outline-offset:2px;}
.console-help p {margin:0 0 12px;line-height:1.65;}
