@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&display=swap');
:root{font-family:'Be Vietnam Pro',sans-serif;color:#253e35;background:#f7f8f4;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid #dce2d9;border-radius:9px;background:white;color:#345345;padding:12px 17px;font-size:12px;font-weight:500}button:hover{filter:brightness(.96)}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #e4ae45;outline-offset:3px}.primary{background:#294c3e;color:white;border-color:#294c3e}header{height:88px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e4e7de;background:#fafbf8}.brand{text-decoration:none;color:#294c3e;display:flex;align-items:center;gap:12px;font-size:34px;font-weight:600;letter-spacing:-2px}.brand-icon{font-size:42px;color:#c38e38}.brand-divider{height:24px;width:1px;background:#d5dcd2;margin:0 10px}.brand-sub{font-size:10px;letter-spacing:2px;font-weight:500}.header-note{font-size:11px;color:#79867c;display:flex;align-items:center;gap:8px}.header-note i{width:6px;height:6px;background:#6e916e;border-radius:50%}main{max-width:1320px;margin:auto;padding:45px 40px 20px}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:34px}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:600;color:#819082}h1{font-size:39px;letter-spacing:-1.7px;font-weight:500;margin:12px 0}p{font-size:12px;line-height:1.8;color:#819084}.intro p{margin:0;font-size:13px}.workspace{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(290px,1fr);gap:24px}.compass-card,.settings-card,.sun-times,.timeline-card{border:1px solid #e0e5db;border-radius:16px;background:#fff}.card-heading{display:flex;justify-content:space-between;padding:25px 27px 0;align-items:center}h2{font-size:16px;font-weight:500;margin:9px 0}h2 small{font-size:9px;font-weight:400;color:#899286;margin-left:6px}.badge{font-size:10px;padding:7px 10px;border-radius:30px;background:#f8f3e5;color:#a3833f}.compass-wrap{max-width:500px;margin:-8px auto 0}svg{display:block;width:100%;overflow:visible}.compass-mode{display:flex;justify-content:center;align-items:center;gap:13px;margin-top:-24px;position:relative}.compass-mode span{font-size:10px;color:#7a897d}.compass-mode button{font-size:10px;border:none;background:#f3f5f0;padding:8px}.legend{display:flex;justify-content:center;flex-wrap:wrap;gap:18px;margin:26px 15px 23px;font-size:9px;color:#7a857b}.legend span{display:flex;align-items:center;gap:5px}.dot{width:7px;height:7px;display:inline-block;border-radius:50%}.yellow{background:#edbb54}.green{background:#6b977d}.terracotta{background:#cb8564}.dash{width:13px;border-top:1px dashed #b2a77b}.you{font-size:9px;letter-spacing:1.3px;text-anchor:middle;fill:#96a092}aside{display:flex;flex-direction:column;gap:18px}.settings-card{padding:26px}.settings-card label{display:block;font-size:11px;color:#697b6e;margin:20px 0 9px}input:not([type=range]){width:100%;background:#fafbf8;border:1px solid #dfe5da;border-radius:8px;padding:11px 12px;color:#395243;min-width:0;font-size:12px}.coordinates{display:grid;grid-template-columns:1fr 1fr;gap:12px}.tz-row{display:flex;align-items:center;justify-content:space-between;margin-top:15px}.tz-row label{margin:0}.tz-row input{width:80px}#feedback{font-size:10px;line-height:1.7;margin:15px 0 0;min-height:34px}.sun-times{padding:7px 24px 0}.event{display:flex;align-items:center;gap:14px;padding:18px 0}.event+.event{border-top:1px solid #edf0e8}.event-icon{font-size:23px;border-radius:50%;width:42px;height:42px;display:grid;place-items:center}.sunrise{background:#f4f1df;color:#b4944b}.sunset{background:#f6eae1;color:#bc815f}.event div{display:flex;flex-direction:column;gap:6px}.event div span{font-size:10px;color:#809080}.event strong{font-size:24px;font-weight:500;letter-spacing:-.5px}.event-dir{margin-left:auto;font-size:11px;color:#7f8b7b}.daylength{border-top:1px solid #edf0e8;display:flex;justify-content:space-between;padding:17px 0;font-size:10px;color:#83917e}.daylength b{font-weight:500;color:#526c53}.tip{display:flex;gap:12px;padding:0 14px}.tip>span{font-size:25px;color:#b5a374}.tip p{font-size:10px;margin:0}.tip b{display:block;color:#75806b;font-weight:500;margin-bottom:3px}.timeline-card{margin-top:24px;padding:27px 30px}.timeline-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.time-display{display:flex;align-items:center;gap:15px;margin-top:9px}#selected-time{font-size:34px;font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:-1px}#phase{font-size:10px;color:#899480}.metrics{display:flex;gap:40px}.metrics div{display:flex;flex-direction:column;gap:8px}.metrics span{font-size:10px;color:#859080}.metrics b{font-size:20px;font-weight:500}.play-actions{display:flex;gap:9px}.range-wrap{margin-top:24px}input[type=range]{width:100%;margin:0;cursor:pointer;appearance:none;height:8px;border-radius:10px;background:linear-gradient(90deg,#d1d8db 0%,#eadcba 24%,#edc366 40%,#edc366 60%,#e6bd9c 76%,#cdd5dc 100%)}input[type=range]::-webkit-slider-thumb{appearance:none;width:21px;height:21px;background:#fff;border:5px solid #345545;border-radius:50%;box-shadow:0 1px 5px #0002}input[type=range]::-moz-range-thumb{width:13px;height:13px;background:#fff;border:5px solid #345545;border-radius:50%}.time-ticks{display:flex;justify-content:space-between;margin-top:14px;color:#939b90;font-size:9px;font-variant-numeric:tabular-nums}footer{display:flex;justify-content:space-between;margin:24px 0 0;color:#99a18f;font-size:9px}footer a{color:inherit} @media(min-width:1400px){main{padding-top:55px}.compass-wrap{max-width:530px}}@media(max-width:800px){header{height:70px;padding:0 22px}.header-note{display:none}main{padding:28px 18px}.intro{align-items:flex-start;gap:15px}h1{font-size:30px}.intro .primary{font-size:10px;padding:11px}.intro p{font-size:11px}.workspace{grid-template-columns:1fr}.compass-wrap{max-width:480px}aside{display:grid;grid-template-columns:1fr 1fr;gap:14px}.tip{grid-column:1/-1}.settings-card{padding:18px}.sun-times{padding:7px 16px}.timeline-top{flex-wrap:wrap}.metrics{gap:25px}.play-actions{margin-left:auto}.timeline-card{padding:22px}.legend{gap:12px}.card-heading{padding:22px 20px 0}footer{gap:20px;line-height:1.7}}@media(max-width:480px){.brand-sub{font-size:8px}.intro{display:block}.intro .primary{margin-top:18px}aside{grid-template-columns:1fr}.compass-mode{margin-top:-14px}.legend{font-size:8px;gap:10px}.time-display{gap:8px}#phase{max-width:70px;line-height:1.5}.metrics{gap:15px}.metrics b{font-size:17px}.play-actions{width:100%;justify-content:flex-end}.card-heading h2{font-size:13px}h2 small{display:block;margin:5px 0 0}footer{flex-direction:column;gap:5px}}

.weather-card{border:1px solid #e0e5db;border-radius:16px;background:#fff;padding:22px 24px}.cloud-options{display:flex;gap:7px;margin-top:15px}.cloud-options button{flex:1;padding:10px 5px;font-size:10px}.cloud-options button[aria-pressed=true]{background:#294c3e;color:#fff;border-color:#294c3e}.weather-card p{font-size:10px;margin:12px 0 0}.month-ticks{display:flex;justify-content:space-between;font-size:9px;color:#899480;margin-top:10px}#month-label{float:right;font-size:10px;color:#294c3e}#month{background:linear-gradient(90deg,#d6e5e5,#e8cb86,#d6e5e5);height:6px}#clouds{pointer-events:none}.cloud-drift{animation:cloud-drift 35s ease-in-out infinite alternate}@keyframes cloud-drift{from{transform:translateX(-22px)}to{transform:translateX(22px)}}@media(prefers-reduced-motion:reduce){.cloud-drift{animation:none}}

.compass-help{margin:16px 25px 24px;padding:17px;background:#f7f8f4;border-radius:10px}.compass-help b{font-size:12px;font-weight:500}.compass-help p{font-size:11px;margin:8px 0 0}.weather-values{display:flex;flex-direction:column;gap:10px;margin:14px 0}.weather-values strong{font-size:12px;font-weight:500}.weather-card a{color:#345345}.weather-card button{font-size:11px}.rain-drop{animation:rain-fall 1.2s linear infinite}@keyframes rain-fall{from{transform:translate(3px,-8px);opacity:.15}to{transform:translate(-3px,8px);opacity:.65}}@media(prefers-reduced-motion:reduce){.rain-drop{animation:none}}

#energy-dialog{border:1px solid #dce2d9;border-radius:20px;padding:28px;width:min(620px,calc(100% - 28px));max-height:90vh;color:#253e35;background:#fff}#energy-dialog::backdrop{background:#142b2377;backdrop-filter:blur(3px)}.energy-heading{display:flex;align-items:center;justify-content:space-between}.energy-heading h2{font-size:23px;margin:10px 0}.energy-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0 12px}.energy-fields label{font-size:11px;line-height:1.6}.energy-fields input{display:block;margin-top:8px}#energy-result{background:#f3f6ee;border-radius:14px;padding:22px;margin-top:20px}.energy-total{display:flex;align-items:baseline;gap:10px}.energy-total strong{font-size:48px;letter-spacing:-2px;font-weight:500}.energy-total span{font-size:13px}#energy-summary{margin-top:4px}#energy-formula{color:#345345}.energy-note{font-size:10px}.energy-note a{color:#345345}#energy-open{margin:0 14px}button:disabled{opacity:.55;cursor:wait}@media(max-width:600px){header{height:auto;min-height:76px;gap:12px;padding:14px;flex-wrap:wrap}#energy-open{font-size:10px;margin:0;padding:10px}.energy-fields{gap:12px}#energy-dialog{padding:20px}.energy-heading h2{font-size:19px}}

/* Keep the time controls immediately above the compass on every screen. */
.timeline-card{margin:0 0 24px}
header{gap:16px}#theme-toggle{white-space:nowrap}
:root{color-scheme:light}
:root[data-theme=dark]{color-scheme:dark;background:#101b20;color:#e4ede8}
[data-theme=dark] header{background:#142127;border-color:#314148}
[data-theme=dark] .brand{color:#d8e9df}
[data-theme=dark] .brand-divider{background:#405159}
[data-theme=dark] :is(.compass-card,.settings-card,.sun-times,.timeline-card,.weather-card,#energy-dialog){background:#19282e;border-color:#34464c;color:#e4ede8}
[data-theme=dark] :is(p,.eyebrow,.legend,.compass-mode span,.settings-card label,.event div span,.event-dir,.daylength,.metrics span,.time-ticks,.month-ticks,footer,h2 small,#phase){color:#b0c1bd}
[data-theme=dark] :is(button,input:not([type=range])){background:#23363d;border-color:#455b61;color:#e2ede8}
[data-theme=dark] .primary{background:#a8d6bd;border-color:#a8d6bd;color:#142b22}
[data-theme=dark] :is(.compass-help,#energy-result,.compass-mode button){background:#21353b}
[data-theme=dark] :is(.tip b,.daylength b,#month-label,#energy-formula,.weather-card a,.energy-note a){color:#baddc9}
[data-theme=dark] :is(.event+.event,.daylength){border-color:#34464c}
[data-theme=dark] .badge{background:#403823;color:#f1d58b}
[data-theme=dark] .sunrise{background:#403823;color:#f1d58b}
[data-theme=dark] .sunset{background:#44312b;color:#efb393}
[data-theme=dark] #dial circle{stroke:#3b5158}
[data-theme=dark] #dial line{stroke:#697d83}
[data-theme=dark] #dial text{fill:#b8c9c6}
[data-theme=dark] #dial text:first-of-type{fill:#f1c77d}
[data-theme=dark] .you{fill:#b8c9c6}
[data-theme=dark] #compass>circle[r="7"]{fill:#baddc9}
[data-theme=dark] #compass>circle[r="15"]{stroke:#baddc9;stroke-opacity:.5}
[data-theme=dark] #plot circle[stroke="white"]{stroke:#243941}
[data-theme=dark] input[type=range]{background:linear-gradient(90deg,#3e5364,#877755,#c29a4e,#877755,#3e5364)}
[data-theme=dark] #month{background:linear-gradient(90deg,#47636a,#b59658,#47636a)}
[data-theme=dark] input[type=range]::-webkit-slider-thumb{background:#152820;border-color:#a8d6bd}
[data-theme=dark] input[type=range]::-moz-range-thumb{background:#152820;border-color:#a8d6bd}
@media(max-width:1000px){header{height:auto;min-height:88px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}.brand{margin-right:auto}}
@media(max-width:480px){header{gap:10px}.brand{width:100%}#energy-open{margin:0}#theme-toggle{font-size:10px;padding:10px}.timeline-card{margin-bottom:18px}}

.top-tip{padding:18px 22px;margin:0 0 28px;border-left:3px solid #c9a254;background:#f0f3e9;border-radius:0 12px 12px 0}.top-tip p{font-size:13px}.top-tip b{font-size:16px;color:#345345;margin-bottom:5px}.energy-preview{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;margin-bottom:24px;border:1px solid #cbdccd;border-radius:12px;background:#edf4e9;font-size:13px;line-height:1.7}.energy-preview[hidden]{display:none}.energy-preview button{flex-shrink:0}[data-theme=dark] :is(.top-tip,.energy-preview){background:#21353b;border-color:#647d6f}[data-theme=dark] .top-tip b{color:#baddc9}#profile-status{font-size:11px}
@media(max-width:600px){main{padding:20px 12px}.top-tip{padding:14px;margin-bottom:20px}.top-tip p{font-size:12px}.top-tip b{font-size:15px}.timeline-card{padding:18px 15px}.timeline-top{gap:14px}.metrics{gap:18px}.time-display{gap:10px}.energy-preview{align-items:stretch;flex-direction:column;padding:14px;gap:10px}.energy-preview button{width:100%}button{min-height:44px}input:not([type=range]){font-size:16px;min-height:44px}input[type=range]{touch-action:pan-y;min-height:12px}.range-wrap{padding:10px 0;margin-top:12px}#month{margin:10px 0}#energy-dialog{max-height:calc(100dvh - 24px);padding:20px 16px}#energy-calculate{width:100%}.compass-help{margin:16px 15px}.time-ticks{font-size:9px}.weather-card,.settings-card{padding:20px 16px}.energy-fields{grid-template-columns:1fr 1fr}.brand{gap:8px}.brand-divider{margin:0 5px}}@media(max-width:360px){.energy-fields{grid-template-columns:1fr}.metrics b{font-size:15px}#selected-time{font-size:28px}.timeline-top{gap:10px}.brand-sub{letter-spacing:1px}}

.view-switch{display:flex;justify-content:center;gap:8px;margin:18px 16px 0}.view-switch button[aria-pressed=true]{background:#294c3e;border-color:#294c3e;color:#fff}.compass-wrap[hidden],#solar-3d[hidden]{display:none}#solar-3d{padding:0 16px}#sun-canvas{display:block;width:100%;height:440px;touch-action:none;cursor:grab;border-radius:14px}#sun-canvas:active{cursor:grabbing}#sun-canvas:focus-visible{outline:3px solid #c9a254;outline-offset:2px}.scene-controls{display:flex;justify-content:center;gap:10px}.scene-hint,#scene-status{text-align:center;font-size:11px;line-height:1.7;margin:12px auto;max-width:480px}[data-theme=dark] .view-switch button[aria-pressed=true]{background:#a8d6bd;color:#142b22;border-color:#a8d6bd}@media(max-width:600px){#sun-canvas{height:350px}#solar-3d{padding:0 8px}.scene-hint{padding:0 10px}.view-switch button{flex:1;max-width:180px}}@media(max-width:360px){#sun-canvas{height:310px}}
#sensor-status{font-size:11px;text-align:center;line-height:1.7;margin:12px 22px 0;min-height:38px}.compass-mode{flex-wrap:wrap}.compass-mode button{min-height:44px}

.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-left:auto}.header-actions #energy-open{margin:0}.language-picker select{min-height:44px;border:1px solid #dce2d9;border-radius:9px;padding:10px;background:#fff;color:#345345;font:inherit;font-size:12px;cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[data-theme=dark] .language-picker select{background:#23363d;border-color:#455b61;color:#e2ede8}.language-picker select:focus-visible{outline:3px solid #e4ae45;outline-offset:3px}@media(max-width:800px){.header-actions{gap:8px;flex-wrap:wrap}.brand{flex-shrink:0}}@media(max-width:600px){.header-actions{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.header-actions #energy-open{grid-column:1}.header-actions #theme-toggle{grid-column:2}.language-picker{grid-column:1/-1;justify-self:end}.header-actions button{white-space:normal;line-height:1.5}.language-picker select{font-size:16px;padding:7px 10px}}

#header-menu-toggle{display:none}.coordinates[hidden]{display:none}.location-notice{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;margin-bottom:22px;border:1px solid #dce2d9;border-radius:10px;font-size:12px;line-height:1.7;background:#eef3e9}.location-notice button[hidden]{display:none}[data-theme=dark] .location-notice{background:#21353b;border-color:#455b61}
@media(max-width:800px){header{position:relative;flex-wrap:nowrap;min-height:72px;height:auto;padding:12px 16px;gap:10px;z-index:20}header .brand{width:auto;min-width:0;margin:0 auto 0 0;font-size:30px}.brand-icon{font-size:34px}header .brand-sub{font-size:8px;letter-spacing:1px}header .brand-divider{margin:0 3px}#header-menu-toggle{display:block;flex-shrink:0;min-height:44px}.header-actions{display:none;position:absolute;top:calc(100% + 6px);right:12px;width:min(300px,calc(100vw - 24px));margin:0;padding:12px;flex-direction:column;align-items:stretch;gap:8px;background:#fff;border:1px solid #dce2d9;border-radius:14px;box-shadow:0 12px 35px #142b2326}.header-actions.is-open{display:flex}.header-actions #energy-open,.header-actions #theme-toggle,.header-actions .language-picker,.header-actions select{width:100%;margin:0;text-align:left;font-size:14px;min-height:44px}.header-actions .language-picker{display:block}.header-actions button{padding:12px}.location-notice{flex-wrap:wrap}[data-theme=dark] .header-actions{background:#19282e;border-color:#455b61}}

/* Use a centered chevron instead of browser-specific select arrow spacing. */
.header-actions .language-picker{position:relative;display:block;color:#345345}
.header-actions .language-picker select{appearance:none;-webkit-appearance:none;display:block;width:100%;padding:10px 40px 10px 12px;line-height:22px}
.language-picker::after{content:"";position:absolute;right:16px;top:50%;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-70%) rotate(45deg);pointer-events:none}
[data-theme=dark] .header-actions .language-picker{color:#e2ede8}
.reserve-option{display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.6;margin:16px 0}.reserve-option input[type=checkbox]{appearance:auto;width:20px;min-height:20px;height:20px;flex:0 0 20px;padding:0;accent-color:#54765f}#energy-weather{font-weight:500;color:#345345}[data-theme=dark] #energy-weather{color:#baddc9}
.compass-card>.compass-mode{margin:18px 12px 0}.scene-controls{flex-wrap:wrap}#scene-mode{font-size:11px;text-align:center;line-height:1.7;margin:12px}#scene-follow[aria-pressed=true]{background:#294c3e;color:#fff}[data-theme=dark] #scene-follow[aria-pressed=true]{background:#a8d6bd;color:#142b22}

/* Consistent stroke icons retain crisp edges on mobile and follow theme colors. */
#header-menu-toggle::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%206h16M4%2012h16M4%2018h16%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
#energy-open::before,#energy-preview-open::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m13%202-9%2012h7l-1%208%2010-13h-7Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
#theme-toggle::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2015A8%208%200%200%201%209%204a8%208%200%201%200%2011%2011Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
[data-theme=dark] #theme-toggle::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M12%202v2m0%2016v2M2%2012h2m16%200h2M5%205l1%201m12%2012%201%201M5%2019l1-1M18%206l1-1%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
#sensor::before,#view-2d::before,#scene-follow::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22m16%208-2%206-6%202%202-6Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
#view-3d::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%202%209%205v10l-9%205-9-5V7Zm0%2010v10M3%207l9%205%209-5M12%202v10%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
#now::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M12%206v6l4%202%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
#play::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m8%204%2012%208-12%208Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
#play[data-playing=true]::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%204v16M16%204v16%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
#weather-retry::before,#scene-reset::before{content:"";display:inline-block;width:20px;height:20px;flex:0 0 20px;vertical-align:middle;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%207v5h-5M4%2017v-5h5M5%208a8%208%200%200%201%2014-3l1%202M4%2017l1%202a8%208%200%200%200%2014-3%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}
.sun-times .compass-help{margin:0 0 16px;padding:12px 14px}.compass-help summary{font-size:11px;line-height:1.7;font-weight:500;cursor:pointer}.compass-help summary::marker{color:#c49b46}.compass-help[open] p{margin-top:10px}.sun-times .compass-help+.event{border-top:1px solid #edf0e8}[data-theme=dark] .sun-times .compass-help+.event{border-color:#34464c}@media(max-width:800px){.energy-preview{margin-bottom:16px}.timeline-card{margin-bottom:20px}.intro{margin-bottom:22px}.header-actions button{display:flex;align-items:center}.view-switch button,.scene-controls button{line-height:1.5}.view-switch button::before{width:18px;height:18px;flex-basis:18px}}

.brand-logo{display:block;width:38px;height:38px;flex-shrink:0;border-radius:9px}@media(max-width:800px){.brand-logo{width:34px;height:34px}}