:root,:root[data-theme=gb]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#9bbc0f;--ink:#0f380f;--mid:#306230;--ghost:#8bac0f;--cell:12px;--sans:"PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", "Source Han Sans SC", sans-serif}:root[data-theme=mono]{--bg:#f4f1ea;--ink:#141414;--mid:#8d887c;--ghost:#e4dfd4}:root[data-theme=warm]{--bg:#f6e2c4;--ink:#3a2416;--mid:#c47a4a;--ghost:#efd0a4}*{box-sizing:border-box}html,body,#root{height:100%}html{background:var(--bg)}body{height:100%;color:var(--ink);background:var(--bg);font-family:var(--sans);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;margin:0;font-weight:400;overflow:hidden}button,p{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:0}button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.stage{height:100%;min-height:100dvh;padding:calc(16px + env(safe-area-inset-top)) 20px calc(20px + env(safe-area-inset-bottom));flex-direction:column;display:flex}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 24px;display:flex}.brand{letter-spacing:.42em;text-indent:.42em;margin:0;font-size:.95rem}.toolbar{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:14px;display:flex}.themes{gap:8px;display:flex}.swatch,.tool{letter-spacing:.12em;background:0 0;border:2px solid #0000;min-height:36px;padding:0 10px;font-size:.82rem}.swatch{align-items:center;gap:8px;display:inline-flex}.swatch i{border:2px solid var(--ink);width:12px;height:12px;image-rendering:pixelated}.swatch[aria-checked=true],.tool[aria-pressed=true]{border-color:var(--ink)}.tool{padding-inline:14px}main{flex:1;place-items:center;width:100%;min-width:0;min-height:0;display:grid;container-type:inline-size}.clock-block{--cell:7px;justify-items:center;gap:clamp(22px,4vh,40px);width:100%;min-width:0;display:grid}.sprite{image-rendering:pixelated;gap:0;display:grid}.sprite-row{grid-auto-flow:column;height:4px;display:grid}.sprite-row i{background:0 0;width:4px;height:4px}.sprite-row i.on,.sprite-row i.star{background:var(--ink)}.sprite:not(.is-still) .star{animation:1.2s steps(2,end) infinite blink}.clock{align-items:center;gap:var(--cell);display:flex}.pair{gap:var(--cell);display:flex}.reel{height:calc(var(--cell) * 7);image-rendering:pixelated;display:block;overflow:hidden}.strip{display:grid}.glyph{height:calc(var(--cell) * 7);display:grid}.glyph-row{grid-template-columns:repeat(5, var(--cell));height:var(--cell);display:grid}.glyph i{width:var(--cell);height:var(--cell);background:var(--ghost)}.glyph i.on{background:var(--ink)}.colon{width:var(--cell);height:calc(var(--cell) * 7);display:grid}.colon i{width:var(--cell);height:var(--cell);background:0 0}.colon i.on{background:var(--ink)}.meridiem{writing-mode:vertical-rl;letter-spacing:.2em;color:var(--mid);font-size:.78rem}.date{text-align:center;letter-spacing:.08em;max-width:100%;margin:0;font-size:clamp(1rem,2.4vw,1.35rem)}.today{justify-content:center;align-items:center;gap:12px;max-width:100%;display:flex}.today-label{letter-spacing:.28em;color:var(--mid);font-size:.78rem}.bar{gap:3px;display:flex}.bar i{background:var(--ghost);width:8px;height:8px;image-rendering:pixelated}.bar i.on{background:var(--ink)}@container (width>=320px){.clock-block{--cell:8px}}@container (width>=359px){.clock-block{--cell:9px}}@container (width>=398px){.clock-block{--cell:10px}}@container (width>=437px){.clock-block{--cell:11px}}@container (width>=520px){.clock-block{--cell:14px}}@container (width>=680px){.clock-block{--cell:16px}}@container (width>=900px){.clock-block{--cell:20px}.sprite-row{height:5px}.sprite-row i{width:5px;height:5px}.bar i{width:10px;height:10px}}@container (width<=520px){.clock{flex-wrap:wrap;justify-content:center}.meridiem{writing-mode:horizontal-tb;text-align:center;flex:1 0 100%}}@media (width<=420px){.stage{padding-inline:16px}.swatch span{display:none}.swatch{padding:6px}.clock-block{gap:18px}.date{letter-spacing:.04em;font-size:.95rem}}@media (height<=560px){.clock-block{gap:12px}}@keyframes blink{50%{background:0 0}}@media (prefers-reduced-motion:reduce){*,:before,:after{animation:none!important}}