.page-intro{font-size:14px;line-height:1.7;color:#737e92;max-width:750px;margin:8px 0 0}.page-intro:empty{display:none}
.clock-panel{--clock-text:#213252;--clock-muted:#748095;--clock-border:#e5e9f1;--clock-surface:#fff;color:var(--clock-text);background:var(--clock-surface);overflow:auto;container-type:inline-size}
.clock-toolbar{padding:18px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid var(--clock-border);flex-wrap:wrap}
.clock-format{display:flex;padding:4px;background:#f0f3f8;border-radius:11px;gap:3px}.clock-format button{border:0;background:transparent;color:#737e92;padding:8px 15px;font-size:14px;min-height:38px;white-space:nowrap}.clock-format button[aria-pressed=true]{background:#fff;color:#3158db;box-shadow:0 2px 6px #1c315412}
.clock-options{display:flex;gap:22px;flex-wrap:wrap}.clock-toggle{display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer;white-space:nowrap}.clock-toggle input{margin:0;width:17px;height:17px;accent-color:#3158db}.clock-toggle:has(input:disabled){opacity:.6;cursor:not-allowed}
.clock-face{flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:24px;padding:30px 16px;min-height:240px}.clock-date{font-size:clamp(16px,2cqw,26px);letter-spacing:1px;color:var(--clock-muted)}.clock-time-row{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%}.clock-period{font-size:20px;color:var(--clock-muted)}.clock-digits{font-family:Inter,"Arial",sans-serif;font-size:clamp(40px,14.8cqw,200px);font-weight:550;letter-spacing:-.045em;font-variant-numeric:tabular-nums;line-height:1.05;white-space:nowrap}.clock-caption{font-size:13px;letter-spacing:1px;color:var(--clock-muted)}
.clock-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:20px 24px;border-top:1px solid var(--clock-border)}.clock-awake-wrap{display:flex;flex-direction:column;gap:8px}.clock-awake-wrap>span{font-size:12px;color:var(--clock-muted)}.clock-actions{display:flex;gap:10px;flex-wrap:wrap}.clock-actions button{font-size:14px}.clock-actions .primary{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 18px}#clock-share-url{margin:0 24px 20px;border:1px solid #dce2ef;padding:12px;border-radius:8px}
.clock-panel:fullscreen{width:100vw;height:100dvh;border:0;border-radius:0;padding:10px 24px;background:var(--clock-surface)}.clock-panel:fullscreen .clock-digits{font-size:clamp(40px,min(17cqw,32vh),300px)}.clock-panel:fullscreen .clock-face{min-height:0;padding:20px 0}.clock-panel:fullscreen .clock-date{font-size:clamp(16px,2.5cqw,38px)}.clock-panel:fullscreen .clock-caption{display:none}
body.clock-dark{background:#101722;color:#e5ebf5}.clock-dark aside{background:#141d2b;border-color:#283446}.clock-dark .brand{color:#eef3fc}.clock-dark nav a{color:#aebcd0}.clock-dark nav a.active,.clock-dark nav a:hover{background:#233454;color:#a9c1ff}.clock-dark nav .divider{background:#283446}.clock-dark .iconbutton{background:#1b2739;color:#e0e8f4;border-color:#2b3a50}.clock-dark .page-intro,.clock-dark footer,.clock-dark .headerRight{color:#a4b2c6}.clock-dark .clock-panel{--clock-text:#ecf2ff;--clock-muted:#9dacc3;--clock-border:#2b374c;--clock-surface:#141e2e;border-color:#2b374c}.clock-dark .clock-format{background:#0f1724}.clock-dark .clock-format button{color:#aab8cd}.clock-dark .clock-format button[aria-pressed=true]{background:#2c405f;color:#e0ebff}.clock-dark .clock-actions button:not(.primary){background:#1c2b40;border-color:#35445b;color:#e5ebf5}.clock-dark .clock-actions .primary{background:#577bea;border-color:#577bea;color:#fff}.clock-dark .clock-toggle input{accent-color:#84a2ff}.clock-dark .toolhelp{color:#b4c2d8}.clock-dark .toolhelp article{background:#1c293d;border-color:#35445b;color:#dce6f5}.clock-dark .toolhelp a{color:#9fbbff}
.related-tools{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0 0}.related-tools a{color:#3158db;text-underline-offset:4px}
@media(max-width:800px){.page-intro{font-size:13px;line-height:1.6}.clock-toolbar{padding:14px;gap:14px}.clock-options{gap:14px}.clock-face{min-height:190px;gap:20px;padding:24px 10px}.clock-bottom{padding:16px;gap:16px}.clock-actions{width:100%}.clock-actions button{flex:1}.clock-digits{font-size:15cqw}.clock-caption{font-size:12px;letter-spacing:0}.clock-panel:fullscreen{padding:0 14px}.clock-panel:fullscreen .clock-bottom{padding:10px}.clock-panel:fullscreen .clock-actions{width:auto}}
@media(max-height:580px){.clock-panel:fullscreen .clock-toolbar,.clock-panel:fullscreen .clock-bottom{padding:6px 12px}.clock-panel:fullscreen .clock-face{gap:8px;padding:10px}.clock-panel:fullscreen .clock-awake-wrap>span{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.related-tools{flex-direction:row}