html{--coast-text:var(--text);--coast-muted:var(--muted);--coast-link:var(--accent)}html[data-coast-theme=night]{--coast-text:var(--moonlight);--coast-muted:var(--moonlight);--coast-link:var(--moonlight)}html,body{margin:0;min-width:320px}:root,body{background:var(--coast-background,var(--background))}.toolbar{z-index:5}.sidebar{min-width:0}.intro{padding:0 8px 17px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin:0 0 12px}h1{font-size:38px;line-height:1.08;font-weight:500;letter-spacing:-1.5px;margin:0}.intro>p:last-child{font-size:13px;line-height:1.6;max-width:265px;margin:14px 0 0;color:var(--muted)}.phase-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px}h2{font-size:17px;font-weight:550;margin:0}#cycle-name{font-size:10px;border:1px solid var(--border);border-radius:20px;padding:5px 8px;background:var(--background)}#orbit{display:block;width:100%;overflow:visible;margin:0 0 4px}svg text{fill:var(--muted);font-family:inherit;font-size:11px}.orbit-track{fill:none;stroke:var(--border);stroke-dasharray:3 5}#tidal-bulge{fill:var(--water-drop);fill-opacity:.25;stroke:var(--water);stroke-width:1.5}.earth-disc{fill:var(--water)}#continents{fill:var(--grass)}.earth-label{fill:var(--selection);font-size:10px}#coast-marker,.coast-key{fill:var(--sun-energy);stroke:var(--surface-hover);stroke-width:1.5}#moon{fill:var(--fur-mid);stroke:var(--muted);stroke-width:1}.sun-disc{fill:var(--sun-energy)}.sun-rays{stroke:var(--sun-energy);stroke-width:2}.bulge-key{stroke:var(--water);stroke-width:2}.diagram-note{font-size:10px;color:var(--muted);line-height:1.5;margin:2px 0 18px}.slider-label{display:flex;gap:6px;justify-content:space-between;font-size:11px}output{font-variant-numeric:tabular-nums;color:var(--muted)}input[type=range]{display:block;width:100%;accent-color:var(--accent);margin:10px 0 14px;min-height:24px}.phase-shortcuts{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.phase-shortcuts button{padding:9px 2px;border:1px solid var(--border);background:var(--background);color:var(--text);border-radius:6px;font:inherit;font-size:10px;cursor:pointer;min-height:44px}.phase-shortcuts button:hover{background:var(--surface-hover)}.phase-shortcuts button[aria-pressed=true]{border-color:var(--accent);background:var(--grid)}.phase-shortcuts span{display:block;color:var(--muted);font-size:9px;margin-top:4px}.hint{font-size:10px;color:var(--muted);line-height:1.5}.explanation{font-size:12px;line-height:1.6;border-top:1px solid var(--grid);padding-top:12px;margin:12px 0 0;min-height:69px}.model-note{margin:14px 8px 0;font-size:10px;line-height:1.6;color:var(--muted)}.model-note a{color:var(--accent)}.scene-heading{display:flex;justify-content:space-between;align-items:center;padding:3px 6px;gap:12px}.scene-heading .eyebrow{margin:0}#elapsed{color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}.coast-time{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:8px}#daylight-label{padding:3px 8px;border-radius:20px;font-size:10px;background:var(--sun-disc);color:var(--text)}#daylight-label[data-period=night]{background:var(--sky-night);color:var(--moonlight)}#daylight-label[data-period=dawn],#daylight-label[data-period=dusk]{background:var(--sky-twilight)}.scene-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}#gauge-label{position:absolute;transform:translate(-50%,-100%);border:1px solid var(--border);border-radius:5px;padding:4px 7px;font-size:10px;background:var(--surface);white-space:nowrap}.camera-hint{position:absolute;left:340px;bottom:0;color:var(--muted);font-size:10px;pointer-events:none}.tide-readings{display:flex;justify-content:space-between;gap:20px;margin:0 0 18px}.tide-readings span{display:block;font-size:10px;color:var(--muted)}.tide-readings strong{display:block;font-size:30px;font-weight:500;font-variant-numeric:tabular-nums;margin:3px 0;letter-spacing:-1px}.tide-readings small{font-size:15px;letter-spacing:0}.range-reading{text-align:right}.range-reading strong{font-size:25px;margin:6px 0}.chart-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.chart-heading h2{font-size:12px}.chart-heading span{font-size:10px;color:var(--muted)}#tide-chart{display:block;width:100%;margin-top:8px;max-height:150px}.chart-grid{stroke:var(--grid);fill:none}#chart-line{fill:none;stroke:var(--water);stroke-width:2.5}#chart-fill{fill:var(--water);fill-opacity:.09}#chart-now{fill:var(--sun-energy);stroke:var(--surface-hover);stroke-width:1.5}.camera-hint{color:var(--coast-muted)}@media(max-width:760px){.camera-hint{left:12px;bottom:44dvh}}@media(max-width:760px){.toolbar{top:12px;left:12px;right:12px}.control{font-size:12px}}