:root { color-scheme: dark; --bg:#07121d; --panel:#0d2532; --ink:#f8faf7; --muted:#a8b8be; --accent:#ff4d4d; --gold:#ffd166; --line:rgba(255,255,255,.14); }
* { box-sizing: border-box; }
html, body { min-width: 260px; min-height: 100%; margin: 0; }
body { display: grid; min-height: 100vh; place-items: center; color: var(--ink); background:var(--bg); font-family:Inter,ui-sans-serif,system-ui,sans-serif; }
.widget { width:100%; max-width:720px; padding:1rem; text-align:center; }
.widget-title { margin:0 0 .65rem; color:var(--gold); font-size:.75rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.widget-clock { display:grid; grid-template-columns:repeat(4,1fr); overflow:hidden; background:var(--panel); border:1px solid var(--line); border-radius:1rem; }
.widget-clock div { padding:1rem .45rem; border-left:1px solid var(--line); }
.widget-clock div:first-child { background:var(--accent); border-left:0; }
.widget-clock strong { display:block; color:var(--gold); font-size:clamp(1.7rem,8vw,3.25rem); font-variant-numeric:tabular-nums; line-height:1; }
.widget-clock div:first-child strong { color:#fff; }
.widget-clock span { display:block; margin-top:.4rem; color:var(--muted); font-size:.62rem; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.widget a { display:inline-block; margin-top:.6rem; color:var(--muted); font-size:.68rem; }
body.theme-berry { --bg:#2b0710; --panel:#45101c; --accent:#d51f3a; --gold:#ffe08a; }
body.theme-snow { color-scheme:light; --bg:#f3f8f8; --panel:#fff; --ink:#102c35; --muted:#526970; --accent:#c7273c; --gold:#8f6300; --line:rgba(10,35,45,.14); }
body.layout-compact .widget { padding:.7rem; }
body.layout-compact .widget-title { display:none; }
body.layout-compact .widget-clock div { padding:.8rem .35rem; }
body.layout-compact .widget-clock strong { font-size:clamp(1.5rem,8vw,2.6rem); }
body.layout-compact .widget a { margin-top:.4rem; }
@media (max-width:390px) { .widget-clock { grid-template-columns:repeat(3,1fr); } .widget-clock .seconds { display:none; } }
