.clock-page *,.clock-page *:before,.clock-page *:after{box-sizing:border-box}.clock-page{--clock-bg: #ffffff;--clock-card: #f5f6f7;--clock-ink: #171a1f;--clock-line: #eaeaec;--clock-muted: #5a616e;--clock-accent: #2a5bd7;--clock-radius: 6px;--clock-hover: rgba(23, 26, 31, .05);--clock-scroll: #d8dade;--clock-shadow: 0 10px 30px rgba(23, 26, 31, .07);--noise-opacity: .03;--digit-w: clamp(2.6rem, 11.5vw, 10.5rem);--card-h: 1.8;--sep-w: .62;--row-gap: .06;--seam-h: clamp(1.2px, calc(var(--digit-w) * .021), 3px);--glyph-nudge: -.005em;margin:0;min-height:100vh;min-height:100dvh;display:grid;place-items:center;place-content:center;background:var(--clock-bg);color:var(--clock-ink);font-family:system-ui,-apple-system,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Noto Sans SC,sans-serif;color-scheme:light;-webkit-user-select:none;user-select:none;overflow:hidden}:root[data-clock-sec=off] .clock-page,:root[data-clock-mode=countdown] .clock-page{--digit-w: clamp(3.2rem, 16vw, 13rem)}:root[data-clock-theme=dark]{color-scheme:dark}:root[data-clock-theme=dark] .clock-page{--clock-bg: #0d0f13;--clock-card: #171b21;--clock-ink: #f3f5f7;--clock-line: #272c33;--clock-muted: #9aa2ad;--clock-accent: #8aafff;--clock-hover: rgba(255, 255, 255, .08);--clock-scroll: #39414c;--clock-shadow: 0 12px 32px rgba(0, 0, 0, .5)}.clock-page:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:var(--noise-opacity);background-repeat:repeat;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='table' tableValues='1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}@media print{.clock-page:before{display:none}}.clock-stage{display:flex;flex-direction:column;align-items:center}.clock{position:relative;display:flex;align-items:center;justify-content:center;gap:calc(var(--digit-w) * var(--row-gap));padding:0 clamp(.5rem,2vw,1rem);max-width:100%}.clock__sep{flex:none;width:calc(var(--digit-w) * var(--sep-w));text-align:center;font-size:calc(var(--digit-w) * .6);line-height:1;color:var(--clock-muted)}.clock__hour{position:relative;flex:none;display:flex}.clock__meridiem{display:none;position:absolute;left:calc(var(--digit-w) * .08);bottom:calc(var(--digit-w) * .1);font-size:clamp(.7rem,calc(var(--digit-w) * .2),1.05rem);font-weight:600;letter-spacing:.12em;line-height:1;color:var(--clock-muted)}:root[data-clock-format="12"] .clock__meridiem{display:block}:root:not([data-clock-mode=clock]) .clock__meridiem{display:none}:root[data-clock-sec=off] .clock__card--second,:root[data-clock-sec=off] .clock__sep--second,:root[data-clock-mode=countdown] .clock__card--second,:root[data-clock-mode=countdown] .clock__sep--second{display:none}.clock-page.is-done .clock__card,.clock-page.is-done .clock__sep,.clock-page.is-done .clock-date{color:var(--clock-accent)}.clock__card{position:relative;flex:none;overflow:hidden;width:calc(var(--digit-w) * 2);height:calc(var(--digit-w) * var(--card-h));font-size:calc(var(--digit-w) * 1.44);font-weight:600;line-height:1;font-variant-numeric:tabular-nums;perspective:calc(var(--digit-w) * 14)}.clock__card:after{content:"";position:absolute;left:0;right:0;top:calc(50% - var(--seam-h) / 2);height:var(--seam-h);background:var(--clock-bg);pointer-events:none}.clock__half,.clock__flip{position:absolute;left:0;right:0;height:50%;overflow:hidden;background:var(--clock-card);border:1px solid var(--clock-bg);backface-visibility:hidden}.clock__half--top,.clock__flip--top{top:0;border-bottom:0;border-radius:var(--clock-radius) var(--clock-radius) 0 0}.clock__half--bottom,.clock__flip--bottom{bottom:0;border-top:0;border-radius:0 0 var(--clock-radius) var(--clock-radius)}.clock__half span,.clock__flip span{position:absolute;left:0;right:0;height:200%;display:flex;align-items:center;justify-content:center;line-height:1;white-space:pre;transform:translateY(var(--glyph-nudge))}.clock__half--top span,.clock__flip--top span{top:0}.clock__half--bottom span,.clock__flip--bottom span{bottom:0}.clock__flip{opacity:0;pointer-events:none;border-color:var(--clock-card)}.clock__flip--top{transform-origin:50% 100%;transform:rotateX(0)}.clock__flip--bottom{transform-origin:50% 0%;transform:rotateX(90deg)}.clock__card.is-flipping .clock__flip{opacity:1}.clock__card.is-flipping .clock__flip--top{animation:clock-fold-top .24s cubic-bezier(.4,0,1,1) forwards}.clock__card.is-flipping .clock__flip--bottom{animation:clock-fold-bottom .26s cubic-bezier(0,0,.6,1) .22s forwards}@keyframes clock-fold-top{0%{transform:rotateX(0)}to{transform:rotateX(-90deg)}}@keyframes clock-fold-bottom{0%{transform:rotateX(90deg)}to{transform:rotateX(0)}}@media(prefers-reduced-motion:reduce){.clock__card.is-flipping .clock__flip{display:none}}.clock-date{margin:calc(var(--digit-w) * .22) 0 0;font-size:clamp(.95rem,.55rem + 1.6vw,1.3rem);letter-spacing:.05em;color:var(--clock-muted);text-align:center}.clock-date[hidden]{display:none}.clock-date:not([hidden]){animation:clock-date-in .28s ease}@keyframes clock-date-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.clock-date:not([hidden]){animation:none}}button.clock{margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;appearance:none;-webkit-appearance:none;cursor:pointer}.clock:focus-visible{outline:2px solid var(--clock-accent);outline-offset:6px;border-radius:var(--clock-radius)}.clock-page__back{position:fixed;z-index:2;top:max(1rem,env(safe-area-inset-top));left:max(1rem,env(safe-area-inset-left));padding:.4rem .8rem;border:1px solid var(--clock-line);border-radius:999px;background:var(--clock-bg);color:var(--clock-muted);font-size:.875rem;text-decoration:none;transition:color .2s ease,border-color .2s ease}.clock-page__icon{position:fixed;z-index:2;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:none;color:var(--clock-muted);cursor:pointer;appearance:none;-webkit-appearance:none}.clock-page__icon:focus-visible{outline:2px solid var(--clock-accent);outline-offset:2px;border-radius:999px}.clock-page__icon svg{display:block;width:22px;height:22px}.clock-page__icon[hidden]{display:none}.clock-page__fullscreen{right:max(.6rem,env(safe-area-inset-right));bottom:max(.6rem,env(safe-area-inset-bottom))}.clock-page__gear{right:calc(max(.6rem,env(safe-area-inset-right)) + 44px);bottom:max(.6rem,env(safe-area-inset-bottom))}.clock-page__fullscreen .icon-collapse,.clock-page.is-fullscreen .clock-page__fullscreen .icon-expand{display:none}.clock-page.is-fullscreen .clock-page__fullscreen .icon-collapse{display:block}.clock-page.is-fullscreen .clock-page__back{visibility:hidden}.clock-panel{position:fixed;z-index:3;right:max(.6rem,env(safe-area-inset-right));bottom:calc(max(.6rem,env(safe-area-inset-bottom)) + 52px);width:min(20rem,calc(100vw - 1.2rem));max-height:calc(100vh - 5rem);overflow-y:auto;padding:.4rem;border:1px solid var(--clock-line);border-radius:10px;background:var(--clock-card);box-shadow:var(--clock-shadow);animation:clock-panel-in .16s ease}.clock-panel[hidden]{display:none}@keyframes clock-panel-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.clock-panel{animation:none}}.clock-panel__row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:2.5rem;padding:0 .5rem}.clock-panel__row[hidden]{display:none}.clock-panel__label{color:var(--clock-muted);font-size:.875rem}.clock-seg{display:flex;gap:2px;padding:2px;border:1px solid var(--clock-line);border-radius:999px}.clock-seg__btn{margin:0;min-height:1.6rem;padding:.25rem .6rem;border:0;border-radius:999px;background:none;color:var(--clock-muted);font:inherit;font-size:.8125rem;white-space:nowrap;cursor:pointer;appearance:none;-webkit-appearance:none;transition:color .2s ease,background-color .2s ease}.clock-seg__btn[aria-pressed=true]{background:var(--clock-ink);color:var(--clock-bg)}.clock-seg__btn[disabled]{opacity:.35;cursor:default}.clock-seg__btn:focus-visible{outline:2px solid var(--clock-accent);outline-offset:2px}.clock-panel__item{display:flex;align-items:center;justify-content:space-between;gap:.75rem;width:100%;min-height:2.5rem;margin:0;padding:0 .5rem;border:0;border-radius:8px;background:none;color:var(--clock-muted);font:inherit;font-size:.875rem;text-align:left;cursor:pointer;appearance:none;-webkit-appearance:none;transition:background-color .2s ease}.clock-panel__item:focus-visible{outline:2px solid var(--clock-accent);outline-offset:-2px}.clock-panel__switch{position:relative;flex:none;width:2.25rem;height:1.25rem;border:1px solid var(--clock-line);border-radius:999px;background:var(--clock-line);transition:background-color .2s ease,border-color .2s ease}.clock-panel__switch:after{content:"";position:absolute;top:50%;left:2px;width:.875rem;height:.875rem;margin-top:-.4375rem;border-radius:50%;background:var(--clock-card);box-shadow:0 1px 2px #0003;transition:transform .2s ease}.clock-panel__item[aria-pressed=true] .clock-panel__switch{border-color:var(--clock-accent);background:var(--clock-accent)}.clock-panel__item[aria-pressed=true] .clock-panel__switch:after{transform:translate(1rem)}@media(prefers-reduced-motion:reduce){.clock-panel__switch,.clock-panel__switch:after{transition:none}}.clock-panel__value{display:flex;align-items:center;gap:.4rem}.clock-panel__stepper{display:flex;align-items:stretch;height:3.2rem;border:1px solid var(--clock-line);border-radius:8px;background:var(--clock-bg);overflow:hidden}.clock-panel__input{width:3rem;padding:0 .4rem;border:0;background:none;color:var(--clock-ink);font:inherit;font-size:.875rem;font-variant-numeric:tabular-nums;text-align:center}.clock-panel__input:focus-visible{outline:2px solid var(--clock-accent);outline-offset:-2px}.clock-panel__arrows{display:flex;flex-direction:column;flex:none;border-left:1px solid var(--clock-line)}.clock-panel__arrow{flex:1;display:grid;place-items:center;width:1.6rem;padding:0;border:0;background:none;color:var(--clock-muted);cursor:pointer;appearance:none;-webkit-appearance:none}.clock-panel__arrow+.clock-panel__arrow{border-top:1px solid var(--clock-line)}.clock-panel__arrow svg{display:block;width:.7rem;height:.7rem}.clock-panel__arrow:focus-visible{outline:2px solid var(--clock-accent);outline-offset:-2px}.clock-panel__unit{color:var(--clock-muted);font-size:.8125rem}.clock-panel__log{margin-top:.25rem;padding:.3rem .5rem .4rem;border-top:1px solid var(--clock-line)}.clock-panel__log[hidden]{display:none}.clock-panel__log-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.clock-panel__log-toggle{display:flex;align-items:center;gap:.35rem;margin:0;min-height:1.6rem;padding:0 .25rem;border:0;border-radius:6px;background:none;color:var(--clock-muted);font:inherit;font-size:.8125rem;cursor:pointer;appearance:none;-webkit-appearance:none}.clock-panel__log-toggle:focus-visible{outline:2px solid var(--clock-accent);outline-offset:-2px}.clock-log__caret{display:block;width:.7rem;height:.7rem;transition:transform .15s ease}.clock-panel__log-toggle[aria-expanded=true] .clock-log__caret{transform:rotate(90deg)}@media(prefers-reduced-motion:reduce){.clock-log__caret{transition:none}}.clock-panel__log-list[hidden]{display:none}.clock-panel__clear{margin:0;min-height:1.6rem;padding:.15rem .5rem;border:0;border-radius:6px;background:none;color:var(--clock-muted);font:inherit;font-size:.75rem;cursor:pointer;appearance:none;-webkit-appearance:none}.clock-panel__clear:focus-visible{outline:2px solid var(--clock-accent);outline-offset:-2px}.clock-panel__log-list{margin:0;padding:0;max-height:9rem;overflow-y:auto;list-style:none}.clock-log__item{display:grid;grid-template-columns:auto auto auto minmax(2.5rem,1fr);align-items:center;gap:.5rem;min-height:2rem;font-size:.75rem}.clock-log__item+.clock-log__item{border-top:1px solid var(--clock-line)}.clock-log__time{color:var(--clock-muted);font-variant-numeric:tabular-nums}.clock-log__mode{color:var(--clock-muted);font-size:.6875rem}.clock-log__event{color:var(--clock-ink);white-space:nowrap}.clock-log__dur{color:var(--clock-muted);font-variant-numeric:tabular-nums}.clock-log__note,.clock-log__note-input{min-width:0;min-height:1.6rem;border-radius:4px;color:var(--clock-ink);font:inherit;font-size:.75rem}.clock-log__note{display:block;padding:0 .25rem;line-height:1.6rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:text}.clock-log__note:focus-visible,.clock-log__note-input:focus-visible{outline:2px solid var(--clock-accent);outline-offset:-2px}.clock-log__note-input{width:100%;padding:0 .25rem;border:0;background:var(--clock-bg);appearance:none;-webkit-appearance:none}.clock-log__empty{padding:.25rem 0 .35rem;color:var(--clock-muted);font-size:.75rem}.clock-panel,.clock-panel__log-list{scrollbar-width:thin;scrollbar-color:var(--clock-scroll) transparent}.clock-panel::-webkit-scrollbar,.clock-panel__log-list::-webkit-scrollbar{width:6px;height:6px}.clock-panel::-webkit-scrollbar-track,.clock-panel__log-list::-webkit-scrollbar-track{background:transparent}.clock-panel::-webkit-scrollbar-thumb,.clock-panel__log-list::-webkit-scrollbar-thumb{border-radius:999px;background:var(--clock-scroll)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media(hover:hover){.clock-page__back:hover{color:var(--clock-accent);border-color:var(--clock-accent)}.clock-seg__btn:not([disabled]):hover{color:var(--clock-accent)}.clock-seg__btn[aria-pressed=true]:not([disabled]):hover{color:var(--clock-bg)}.clock-panel__item:hover{background:var(--clock-hover)}.clock-panel__arrow:hover,.clock-panel__clear:hover,.clock-panel__log-toggle:hover{color:var(--clock-accent)}.clock-log__note:hover{background:var(--clock-hover)}}@media(max-width:30rem)and (orientation:portrait){.clock-page{--digit-w: clamp(2.4rem, min((100dvh - 132px) / 5.52, 35vw), 10.5rem)}:root[data-clock-sec=off] .clock-page,:root[data-clock-mode=countdown] .clock-page{--digit-w: clamp(3rem, min((100dvh - 132px) / 3.66, 46vw), 12rem)}.clock{flex-direction:column;gap:calc(var(--digit-w) * .06);padding:0}.clock__sep{display:none}.clock-stage{position:relative;transform:translateY(-14px)}.clock-date:not([hidden]){position:absolute;top:100%;left:0;right:0}}@media(max-height:27rem){.clock-page{--digit-w: clamp(2.2rem, min(13.5vw, 30dvh), 10.5rem);--sep-w: .36;--row-gap: .035}:root[data-clock-sec=off] .clock-page,:root[data-clock-mode=countdown] .clock-page{--digit-w: clamp(2.6rem, min(15vw, 34dvh), 13rem)}}