.site-header{flex-wrap:wrap}
.site-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:16px;margin-left:auto}
.gozo-clock-button{display:flex;align-items:center;gap:9px;padding:5px 11px 5px 6px;color:#fff5e8;background:#15100c;border:1px solid #815632;border-radius:999px;text-align:left;cursor:pointer;transition:border-color .18s,background .18s,transform .18s}
.gozo-clock-button:hover{background:#24170f;border-color:#ff9b43;transform:translateY(-1px)}
.gozo-clock-button:focus-visible,.timer-panel-close:focus-visible{outline:3px solid #ff9b43;outline-offset:3px}
.gozo-clock-face{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border:1px solid #ffac60;border-radius:50%;background:radial-gradient(circle at 40% 35%,#442816,#120e0b 72%);box-shadow:0 0 14px #ff881422}
.gozo-clock-face svg{width:36px;height:36px;overflow:visible}
.gozo-clock-face circle:first-child{fill:#17110d;stroke:#f5c08b;stroke-width:1.5}
.clock-tick{fill:none;stroke:#d6a271;stroke-width:1.3;stroke-linecap:round}
.clock-hand{fill:none;stroke-linecap:round}
.clock-hour{stroke:#fff4e4;stroke-width:2.8}
.clock-minute{stroke:#ffb15f;stroke-width:2}
.clock-second{stroke:#f06536;stroke-width:1;opacity:.9}
.clock-pin{fill:#ffd5a2}
.gozo-clock-copy{display:grid;gap:1px;min-width:69px}
.gozo-clock-copy small{color:#d9a76e;font-size:.62rem;font-weight:800;letter-spacing:.14em}
.gozo-clock-copy strong{font-size:1.05rem;font-variant-numeric:tabular-nums;line-height:1.05}
.gozo-clock-copy em{color:#ddd0c3;font-size:.66rem;font-style:normal;line-height:1.2}
.timer-panel{display:block;margin:16px 0 24px;padding:20px;border:1px solid #a16431;border-radius:17px;background:linear-gradient(145deg,#21150d,#100e0c 72%);box-shadow:0 16px 42px #0007}
.timer-panel[hidden]{display:none!important}
.timer-panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.timer-panel-kicker{margin:0 0 5px;color:#f3a75c;font-size:.7rem;font-weight:800;letter-spacing:.15em}
.timer-panel-head h2{margin:0;color:#fff4e8;font-size:1.3rem}
.timer-panel-close{min-height:42px;padding:0 15px;border:1px solid #9b714c;border-radius:10px;background:#1a1511;color:#f7dec5;font:700 .9rem Arial,sans-serif;cursor:pointer}
.timer-panel-close:hover{border-color:#ff9b43;background:#2a1a10}
.timer-cards{display:grid;grid-template-columns:1fr 1.2fr;gap:12px}
.radio-timer-card{min-width:0;padding:16px;border:1px solid #705036;border-radius:13px;background:linear-gradient(150deg,#241a12,#11100e)}
.radio-timer-card h3{margin:0 0 6px;color:#ffe2b7;font-size:1.05rem}
.radio-timer-card>p{margin:0 0 12px;color:#c5b4a4;font-size:.86rem;line-height:1.4}
.timer-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.timer-row+.timer-row{margin-top:9px}
.timer-row input,.timer-row select{min-height:44px;min-width:120px;flex:1;background:#161310;color:#fff0d9;border:1px solid #8b694e;border-radius:8px;padding:0 12px;font:inherit;color-scheme:dark}
.timer-row button{min-height:44px;border:0;border-radius:8px;background:#e58a39;color:#1a0e07;padding:0 15px;font:800 .88rem Arial,sans-serif;cursor:pointer}
.timer-row button:hover{background:#ffad5e}
.timer-row .timer-clear{background:transparent;color:#eab77d;border:1px solid #8b694e}
.timer-row .timer-clear[hidden]{display:none}
.timer-state{color:#eab77d;min-height:1.4em;margin:11px 0 0;font-size:.85rem;line-height:1.4}
.timer-panel-note{margin:14px 0 0;color:#bcb0a5;font-size:.8rem;line-height:1.5}
@media(max-width:680px){.site-header{align-items:flex-start;gap:12px}.site-header-actions{gap:9px}.gozo-clock-button{gap:7px;padding:4px 9px 4px 4px}.gozo-clock-face{width:36px;height:36px;flex-basis:36px}.gozo-clock-face svg{width:31px;height:31px}.gozo-clock-copy{min-width:60px}.gozo-clock-copy strong{font-size:.96rem}.gozo-clock-copy small{font-size:.56rem}.gozo-clock-copy em{font-size:.61rem}.header-link{font-size:.78rem;align-self:center}.timer-panel{padding:14px;margin:12px 0 17px}.timer-cards{grid-template-columns:1fr}.timer-panel-head{margin-bottom:12px}.radio-timer-card{padding:14px}.timer-row input,.timer-row select{min-width:0}.timer-row button{padding-inline:12px}}
@media(max-width:400px){.site-header{gap:8px}.brand{font-size:.8rem!important;letter-spacing:.09em!important;gap:7px!important}.brand img{width:40px;height:40px}.site-header-actions{gap:7px}.gozo-clock-copy em{display:none}.header-link{font-size:.72rem}}
@media(prefers-reduced-motion:reduce){.gozo-clock-button{transition:none}}
/* A proper radio-station clockface: warm metal, clear hour numerals and visible hands. */
.gozo-clock-button{gap:12px;padding:7px 15px 7px 8px;border-radius:14px;background:linear-gradient(145deg,#1d140e,#0f0d0b);box-shadow:inset 0 1px #ffd59a18,0 4px 16px #0004}
.gozo-clock-face{width:64px;height:64px;flex-basis:64px;border:0;background:none;box-shadow:none}
.gozo-clock-face svg{width:64px;height:64px;overflow:visible}
.clock-bezel{fill:#23170e;stroke:#d3975d;stroke-width:1.5}
.clock-dial{fill:#24190f;stroke:#f5cc9b;stroke-width:.8}
.gozo-clock-face svg{background:radial-gradient(circle at 36% 30%,#593920 0,#21170f 70%);border-radius:50%;filter:drop-shadow(0 2px 4px #0009)}
.clock-tick{stroke:#e3b783;stroke-width:.8;stroke-linecap:round;opacity:.88}
.clock-numerals{fill:#f4d9b6;font-family:Georgia,"Times New Roman",serif;font-size:5.4px;font-weight:700;text-anchor:middle;dominant-baseline:central}
.clock-hour{stroke:#fff1d8;stroke-width:2.2}
.clock-minute{stroke:#f9b96d;stroke-width:1.5}
.clock-second{stroke:#ee7144;stroke-width:.75;opacity:.95}
.clock-pin{fill:#ffe0ae;stroke:#9d683d;stroke-width:.7}
.gozo-clock-copy{gap:3px;min-width:88px}
.gozo-clock-copy small{font-size:.67rem;letter-spacing:.16em}
.gozo-clock-copy strong{font-size:1.28rem;line-height:1.05}
.gozo-clock-copy em{font-size:.73rem;color:#f2c28e}
@media(max-width:680px){.gozo-clock-button{gap:8px;padding:5px 10px 5px 6px;border-radius:13px}.gozo-clock-face,.gozo-clock-face svg{width:54px;height:54px}.gozo-clock-face{flex-basis:54px}.gozo-clock-copy{min-width:74px}.gozo-clock-copy strong{font-size:1.08rem}.gozo-clock-copy small{font-size:.58rem}.gozo-clock-copy em{font-size:.65rem}}
@media(max-width:400px){.gozo-clock-face,.gozo-clock-face svg{width:48px;height:48px}.gozo-clock-face{flex-basis:48px}.gozo-clock-copy{min-width:66px}.gozo-clock-button{gap:6px;padding:4px 8px 4px 5px}}
/* Keep the red sweep hand long and legible at the compact header size. */
.clock-second{stroke-width:1;}
@media(max-width:400px){.clock-second{stroke-width:1.15}}
/* Compact Gozo weather readout to pair with the station clock. */
.gozo-temperature{display:flex;align-items:center;gap:10px;min-height:68px;padding:7px 13px;color:#fff4e4;text-decoration:none;border:1px solid #815632;border-radius:14px;background:linear-gradient(145deg,#1d140e,#0f0d0b);box-shadow:inset 0 1px #ffd59a18,0 4px 16px #0004;transition:border-color .18s,background .18s,transform .18s}
.gozo-temperature:hover{background:linear-gradient(145deg,#291a10,#120e0b);border-color:#ff9b43;transform:translateY(-1px)}
.gozo-temperature:focus-visible{outline:3px solid #ff9b43;outline-offset:3px}
.temperature-sun{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid #a56c37;border-radius:50%;color:#ffb461;background:radial-gradient(circle at 40% 35%,#442816,#120e0b 72%);font-size:1.8rem;line-height:1}
.temperature-copy{display:grid;gap:2px;min-width:76px}
.temperature-copy small{color:#d9a76e;font-size:.61rem;font-weight:800;letter-spacing:.13em}
.temperature-copy strong{font-size:1.22rem;font-variant-numeric:tabular-nums;line-height:1}
.temperature-copy sup{margin-left:2px;color:#f2c28e;font-size:.72rem}
.temperature-copy em{overflow:hidden;color:#ddd0c3;font-size:.68rem;font-style:normal;line-height:1.15;text-overflow:ellipsis;text-transform:capitalize;white-space:nowrap}
@media(max-width:680px){.site-header-actions{flex-wrap:wrap}.gozo-temperature{gap:7px;min-height:60px;padding:5px 9px;border-radius:13px}.temperature-sun{width:32px;height:32px;flex-basis:32px;font-size:1.5rem}.temperature-copy{min-width:68px}.temperature-copy strong{font-size:1.06rem}.temperature-copy small{font-size:.55rem}.temperature-copy em{font-size:.62rem}}
@media(max-width:400px){.gozo-temperature{gap:5px;min-height:54px;padding:4px 7px}.temperature-sun{width:27px;height:27px;flex-basis:27px;font-size:1.25rem}.temperature-copy{min-width:58px}.temperature-copy em{max-width:70px}}
.gozo-date{display:flex;align-items:center;gap:9px;min-height:68px;padding:7px 12px;color:#fff4e4;border:1px solid #815632;border-radius:14px;background:linear-gradient(145deg,#1d140e,#0f0d0b);box-shadow:inset 0 1px #ffd59a18,0 4px 16px #0004}
.date-icon{display:grid;place-items:center;width:35px;height:35px;flex:0 0 35px;border:1px solid #a56c37;border-radius:50%;color:#ffb461;background:radial-gradient(circle at 40% 35%,#442816,#120e0b 72%)}
.date-icon svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.date-copy{display:grid;gap:3px;min-width:78px}
.date-copy small{color:#d9a76e;font-size:.61rem;font-weight:800;letter-spacing:.13em}
.date-copy strong{font-size:.97rem;font-variant-numeric:tabular-nums;line-height:1.05;white-space:nowrap}
.date-copy em{color:#ddd0c3;font-size:.68rem;font-style:normal;line-height:1.15}
@media(max-width:680px){.gozo-date{gap:7px;min-height:60px;padding:5px 9px;border-radius:13px}.date-icon{width:30px;height:30px;flex-basis:30px}.date-icon svg{width:17px;height:17px}.date-copy{min-width:69px}.date-copy small{font-size:.55rem}.date-copy strong{font-size:.88rem}.date-copy em{font-size:.62rem}}
@media(max-width:400px){.gozo-date{gap:5px;min-height:54px;padding:4px 7px}.date-icon{width:26px;height:26px;flex-basis:26px}.date-icon svg{width:15px;height:15px}.date-copy{min-width:61px}.date-copy em{display:none}}
/* Keep the three Gozo header panels on one consistent grid. */
.gozo-clock-button,.gozo-temperature,.gozo-date,.gozo-sun-times{box-sizing:border-box;width:178px;height:80px;flex:0 0 178px}
.gozo-clock-button{gap:8px;padding:6px 8px}
.gozo-clock-face,.gozo-clock-face svg{width:56px;height:56px}
.gozo-clock-face{flex-basis:56px}
@media(max-width:680px){.gozo-clock-button,.gozo-temperature,.gozo-date,.gozo-sun-times{width:160px;height:68px;flex-basis:160px}.gozo-clock-button{gap:7px;padding:5px 8px}.gozo-clock-face,.gozo-clock-face svg{width:48px;height:48px}.gozo-clock-face{flex-basis:48px}}

.gozo-sun-times{display:flex;align-items:center;gap:9px;padding:7px 10px;border:1px solid #815632;border-radius:14px;background:linear-gradient(145deg,#1d140e,#0f0d0b);color:#fff4e4;box-shadow:inset 0 1px #ffd59a18,0 4px 16px #0004}
.sun-times-icon{display:grid;width:36px;height:36px;flex:0 0 36px;place-items:center;border:1px solid #ca8542;border-radius:50%;background:#e7882f18;color:#ffc66e;font-size:1.55rem}
.sun-times-copy{min-width:0;display:flex;flex-direction:column;gap:4px}
.sun-times-copy small{color:#d9a76e;font-size:.61rem;font-weight:800;letter-spacing:.13em}
.sun-times-copy strong{display:flex;align-items:center;gap:8px;color:#fff4e4;font-size:.9rem;font-variant-numeric:tabular-nums;line-height:1;white-space:nowrap}
.sun-times-copy strong span{display:inline-flex;align-items:center;gap:3px}
.sun-times-copy strong i{color:#ffc66e;font-size:.78rem;font-style:normal}
.sun-times-copy em{color:#ddd0c3;font-size:.63rem;font-style:normal;line-height:1.15}
@media(min-width:681px){.site-header-actions{display:grid;grid-template-columns:repeat(2,178px);gap:8px;margin-left:auto}}

/* Keep the Gozo clock, temperature and date in a stable two-column phone grid. */
@media(max-width:680px){
  .site-header{align-items:center;gap:10px}
  .site-header .brand{flex:0 0 100%;min-width:0}
  .site-header-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;justify-content:initial;gap:8px;width:100%;margin:0}
  .site-header-actions .gozo-clock-button,.site-header-actions .gozo-temperature,.site-header-actions .gozo-date,.site-header-actions .gozo-sun-times{width:100%;min-width:0;height:70px;min-height:70px;flex:initial;gap:8px;padding:6px 8px;border-radius:12px}
  .site-header-actions .gozo-clock-face,.site-header-actions .gozo-clock-face svg{width:42px;height:42px}
  .site-header-actions .gozo-clock-face{flex:0 0 42px}
  .site-header-actions .gozo-clock-copy,.site-header-actions .temperature-copy,.site-header-actions .date-copy{min-width:0}
  .site-header-actions .gozo-clock-copy strong,.site-header-actions .temperature-copy strong,.site-header-actions .date-copy strong{font-size:.98rem;white-space:nowrap}
  .site-header-actions .gozo-clock-copy em,.site-header-actions .temperature-copy em,.site-header-actions .date-copy em{display:block;max-width:100%;overflow:hidden;font-size:.58rem;text-overflow:ellipsis;white-space:nowrap}
  .site-header-actions .temperature-sun{width:30px;height:30px;flex:0 0 30px;font-size:1.35rem}
  .site-header-actions .date-icon{width:28px;height:28px;flex:0 0 28px}
  .site-header-actions .sun-times-icon{width:28px;height:28px;flex-basis:28px;font-size:1.2rem}
  .site-header-actions .sun-times-copy{gap:4px}
  .site-header-actions .sun-times-copy small{font-size:.55rem}
  .site-header-actions .sun-times-copy strong{gap:6px;font-size:.79rem}
  .site-header-actions .sun-times-copy strong i{font-size:.68rem}
  .site-header-actions .sun-times-copy em{font-size:.58rem}
}
@media(max-width:360px){
  .site-header-actions{gap:6px}
  .site-header-actions .gozo-clock-button,.site-header-actions .gozo-temperature,.site-header-actions .gozo-date,.site-header-actions .gozo-sun-times{height:64px;min-height:64px;padding:5px 6px}
  .site-header-actions .gozo-clock-face,.site-header-actions .gozo-clock-face svg{width:36px;height:36px}
  .site-header-actions .gozo-clock-face{flex-basis:36px}
  .site-header-actions .gozo-clock-button,.site-header-actions .gozo-temperature,.site-header-actions .gozo-date,.site-header-actions .gozo-sun-times{gap:5px}
}
