:root{--ck-primary:#0d9488;--ck-primary-h:#0f766e;--ck-primary-soft:#0d94881f;--ck-hour:#f97316;--ck-minute:#2563eb;--ck-second:#dc2626;--ck-face:#fff;--ck-face-edge:#334155;--ck-num:#1e293b;--ck-minnum:#2563eb;--ck-tick:#94a3b8;--ck-zone:#f9731629;--ck-bg:#f1f5f4;--ck-panel:#fff;--ck-border:#e2e8f0;--ck-text:#1e293b;--ck-muted:#64748b;--ck-btn:#f1f5f9;--ck-btn-h:#e2e8f0;--ck-star:#f59e0b;--ck-ok:#15803d;--ck-no:#c2410c;--sk-accent:var(--ck-primary)}[data-theme=dark]{--ck-primary:#2dd4bf;--ck-primary-h:#5eead4;--ck-primary-soft:#2dd4bf24;--ck-hour:#fb923c;--ck-minute:#60a5fa;--ck-second:#f87171;--ck-face:#1e293b;--ck-face-edge:#cbd5e1;--ck-num:#f1f5f9;--ck-minnum:#93c5fd;--ck-tick:#64748b;--ck-zone:#fb923c38;--ck-bg:#0b1215;--ck-panel:#111a1f;--ck-border:#1f2e35;--ck-text:#e2e8f0;--ck-muted:#94a3b8;--ck-btn:#1a262c;--ck-btn-h:#22323a;--ck-ok:#4ade80;--ck-no:#fdba74;--sk-accent-fg:#0b1215}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{background:var(--ck-bg);color:var(--ck-text);-webkit-tap-highlight-color:transparent;min-height:100dvh;font-family:-apple-system,BlinkMacSystemFont,Pretendard,Inter,Segoe UI,sans-serif;overflow:hidden}button{font-family:inherit}.screen{display:none}.screen.active{display:flex}@keyframes fadeUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@keyframes pop{0%{opacity:.3;transform:scale(.85)}to{opacity:1;transform:none}}.ck-btn{border:1px solid var(--ck-border);background:var(--ck-btn);min-height:48px;color:var(--ck-text);cursor:pointer;touch-action:manipulation;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:0 20px;font-size:16px;font-weight:800;transition:background .15s,transform 80ms,border-color .15s;display:inline-flex}.ck-btn:hover{background:var(--ck-btn-h)}.ck-btn:active{transform:scale(.96)}.ck-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.ck-btn.primary{background:var(--ck-primary);border-color:var(--ck-primary);color:#fff}[data-theme=dark] .ck-btn.primary{color:#0b1215}.ck-btn.primary:hover{background:var(--ck-primary-h)}.ck-btn.big{border-radius:99px;min-height:60px;padding:0 36px;font-size:19px}.ck-btn.sm{border-radius:12px;min-height:44px;padding:0 14px;font-size:14px}.intro-screen{text-align:center;background:radial-gradient(circle at 20% 25%, #0d94881a 0, transparent 40%), radial-gradient(circle at 80% 75%, #f9731614 0, transparent 38%), var(--ck-bg);flex-direction:column;align-items:center;height:100dvh;padding:64px 20px 28px;animation:.5s fadeUp;overflow-y:auto}.intro-tag{background:var(--ck-primary);color:#fff;border-radius:99px;margin-bottom:14px;padding:6px 14px;font-size:14px;font-weight:800;display:inline-block}[data-theme=dark] .intro-tag{color:#0b1215}.intro-art{width:112px;height:112px;margin-bottom:8px}.intro-screen h1{letter-spacing:-.02em;margin-bottom:6px;font-size:34px;font-weight:900}.intro-sub{color:var(--ck-muted);margin-bottom:18px;font-size:16px;line-height:1.7}.unit-pick{width:min(640px,100%);margin-bottom:20px}.unit-pick h2{color:var(--ck-muted);margin-bottom:10px;font-size:15px;font-weight:800}.unit-grid{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.unit-btn{border:2px solid var(--ck-border);background:var(--ck-panel);min-height:76px;color:var(--ck-text);cursor:pointer;touch-action:manipulation;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:8px 4px;display:flex}.unit-btn .g{color:var(--ck-muted);font-size:13px;font-weight:700}.unit-btn .u{font-size:18px;font-weight:900}.unit-btn[aria-pressed=true]{border-color:var(--ck-primary);background:var(--ck-primary-soft)}.unit-btn[aria-pressed=true] .u{color:var(--ck-primary)}.lock-note{color:var(--ck-primary);background:var(--ck-primary-soft);border-radius:14px;margin-bottom:20px;padding:12px 18px;font-size:15px;font-weight:800}.main-screen{width:100vw;height:100dvh;animation:.35s fadeUp}.main-layout{grid-template-columns:minmax(0,1fr) 360px;width:100%;height:100%;display:grid}.clock-zone{background-color:var(--ck-bg);background-image:radial-gradient(#0d94881a 1.5px,#0000 1.5px);background-size:28px 28px;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-width:0;min-height:0;padding:64px 16px 16px;display:flex;position:relative;overflow:hidden}.q-banner{z-index:4;background:var(--ck-panel);border:2px solid var(--ck-primary);text-align:center;border-radius:16px;flex-shrink:0;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:10px 14px 10px 18px;font-size:19px;font-weight:800;line-height:1.35;display:flex;position:relative;box-shadow:0 6px 18px #00000014}.q-banner[hidden]{display:none}.q-banner .tts{flex-shrink:0}.clocks{flex-wrap:nowrap;justify-content:center;align-items:center;gap:18px;display:flex}.clock-box{flex-direction:column;align-items:center;gap:6px;display:flex}.clock-box .ccap{color:var(--ck-muted);font-size:16px;font-weight:800}.clock-box[hidden]{display:none}svg.clock{touch-action:none;user-select:none;display:block;overflow:visible}svg.clock .face{fill:var(--ck-face);stroke:var(--ck-face-edge);stroke-width:6px}svg.clock .tick{stroke:var(--ck-tick);stroke-width:2px;stroke-linecap:round}svg.clock .tick.five{stroke:var(--ck-num);stroke-width:4px}svg.clock .num{fill:var(--ck-num);text-anchor:middle;dominant-baseline:central;font-size:34px;font-weight:900}svg.clock .num.zone-on{fill:var(--ck-hour)}svg.clock .minnum{fill:var(--ck-minnum);text-anchor:middle;dominant-baseline:central;font-size:15px;font-weight:800}svg.clock .zone{fill:var(--ck-zone)}svg.clock .hand{stroke-linecap:round}svg.clock .hand.hour{stroke:var(--ck-hour);stroke-width:13px}svg.clock .hand.minute{stroke:var(--ck-minute);stroke-width:7px}svg.clock .hand.second{stroke:var(--ck-second);stroke-width:2.5px}svg.clock .tipdot.hour{fill:var(--ck-hour)}svg.clock .tipdot.minute{fill:var(--ck-minute)}svg.clock .cap{fill:var(--ck-face-edge)}svg.clock .knob{fill:#0000}svg.clock.live{cursor:grab}svg.clock.live.dragging{cursor:grabbing}svg.clock .grab:focus{outline:none}svg.clock .grab:focus-visible .hand{filter:drop-shadow(0 0 4px var(--ck-primary))}svg.clock .bubble rect{fill:var(--ck-text)}svg.clock .bubble text{fill:var(--ck-bg);text-anchor:middle;dominant-baseline:central;font-size:20px;font-weight:800}.readout{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;min-height:52px;display:flex}.readout .digital{font-variant-numeric:tabular-nums;background:var(--ck-panel);border:1px solid var(--ck-border);color:var(--ck-muted);letter-spacing:.04em;border-radius:10px;padding:6px 12px;font-size:22px;font-weight:800}.readout .reading{color:var(--ck-text);font-size:30px;font-weight:900}.readout .reading.hidden-text{color:#0000;background:var(--ck-btn);user-select:none;border-radius:10px;min-width:180px}.readout .before{color:var(--ck-muted);font-size:15px;font-weight:700}.icon-btn{border:1px solid var(--ck-border);background:var(--ck-panel);cursor:pointer;touch-action:manipulation;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:20px;display:inline-flex}.daybar{width:min(520px,92%)}.daybar[hidden]{display:none}.daybar .track{border:1px solid var(--ck-border);background:linear-gradient(90deg,#1e3a8a 0% 22%,#f59e0b 27%,#fde68a 50%,#f59e0b 73%,#1e3a8a 78% 100%);border-radius:99px;height:26px;position:relative;overflow:hidden}.daybar .mark{background:var(--ck-second);border-radius:3px;width:6px;height:32px;margin-left:-3px;position:absolute;top:-3px;box-shadow:0 0 0 2px #fff}.daybar .labels{color:var(--ck-muted);justify-content:space-between;margin-top:4px;font-size:12.5px;font-weight:700;display:flex}.panel{background:var(--ck-panel);border-left:1px solid var(--ck-border);flex-direction:column;min-height:0;display:flex;overflow-y:auto}.panel-head{border-bottom:1px solid var(--ck-border);flex-wrap:wrap;align-items:center;gap:10px;padding:62px 18px 12px;display:flex}.panel-head h2{flex:1;min-width:120px;font-size:20px;font-weight:900}.unit-chip{border:2px solid var(--ck-primary);background:var(--ck-primary-soft);min-height:44px;color:var(--ck-primary);cursor:pointer;touch-action:manipulation;border-radius:99px;padding:0 14px;font-size:14px;font-weight:900}.unit-chip:disabled{cursor:default;border-style:dashed}.mode-tabs{gap:6px;padding:12px 14px 0;display:flex}.mode-tab{border:2px solid var(--ck-border);background:var(--ck-btn);min-height:48px;color:var(--ck-muted);cursor:pointer;touch-action:manipulation;border-radius:12px;flex:1;font-size:15px;font-weight:800}.mode-tab.active{border-color:var(--ck-primary);background:var(--ck-primary-soft);color:var(--ck-primary)}.panel-body{flex:1;padding:14px}.pane[hidden]{display:none}.group{border:1px solid var(--ck-border);background:var(--ck-bg);border-radius:16px;margin-bottom:12px;padding:12px}.group-title{color:var(--ck-muted);margin-bottom:8px;font-size:13.5px;font-weight:800}.step-grid{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.step-grid .ck-btn{min-height:52px;padding:0 4px;font-size:15px}.toggles{grid-template-columns:1fr 1fr;gap:6px;display:grid}.tog{border:2px solid var(--ck-border);background:var(--ck-panel);min-height:48px;color:var(--ck-text);cursor:pointer;text-align:left;touch-action:manipulation;border-radius:12px;align-items:center;gap:8px;padding:0 10px;font-size:14px;font-weight:700;display:flex}.tog:before{content:"";border:2px solid var(--ck-muted);border-radius:5px;flex-shrink:0;width:18px;height:18px}.tog[aria-pressed=true]{border-color:var(--ck-primary);background:var(--ck-primary-soft)}.tog[aria-pressed=true]:before{background:var(--ck-primary);border-color:var(--ck-primary);box-shadow:inset 0 0 0 3px var(--ck-panel)}.tog[hidden]{display:none}.ampm{grid-template-columns:1fr 1fr;gap:6px;margin-top:8px;display:grid}.ampm[hidden]{display:none}.ampm .ck-btn[aria-pressed=true]{border-color:var(--ck-primary);background:var(--ck-primary-soft);color:var(--ck-primary)}.hint-text{color:var(--ck-muted);font-size:13.5px;line-height:1.6}.m-title{margin:10px 0 4px;font-size:18px;font-weight:900}.m-desc{color:var(--ck-muted);margin-bottom:8px;font-size:15px;line-height:1.6}.m-step{color:var(--ck-muted);align-items:center;gap:6px;margin-bottom:10px;font-size:13.5px;font-weight:800;display:flex}.m-step .dot{background:var(--ck-border);border-radius:50%;width:12px;height:12px}.m-step .dot.ok{background:var(--ck-ok)}.m-step .dot.no{background:var(--ck-no)}.m-step .dot.cur{box-shadow:0 0 0 3px var(--ck-primary-soft);background:var(--ck-primary)}.opts{grid-template-columns:1fr 1fr;gap:8px;display:grid}.opt{border:2px solid var(--ck-border);background:var(--ck-panel);min-height:60px;color:var(--ck-text);cursor:pointer;touch-action:manipulation;border-radius:14px;padding:6px;font-size:19px;font-weight:900}.opt.big{min-height:76px;font-size:24px}.opt.sel{border-color:var(--ck-primary);background:var(--ck-primary-soft)}.opt.right{border-color:var(--ck-ok);background:#16a34a1f}.opt.wrong{border-color:var(--ck-no);background:#ea580c1a}.fields{flex-direction:column;gap:10px;display:flex}.field-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.field-row .lbl{min-width:34px;font-size:17px;font-weight:900}.chips{flex:1;grid-template-columns:repeat(6,1fr);gap:5px;display:grid}.chip{border:2px solid var(--ck-border);background:var(--ck-panel);min-height:46px;color:var(--ck-text);cursor:pointer;touch-action:manipulation;font-variant-numeric:tabular-nums;border-radius:10px;font-size:17px;font-weight:800}.chip[aria-pressed=true]{border-color:var(--ck-primary);background:var(--ck-primary);color:#fff}[data-theme=dark] .chip[aria-pressed=true]{color:#0b1215}.pad-field{border:2px solid var(--ck-border);background:var(--ck-panel);min-width:84px;min-height:52px;color:var(--ck-text);cursor:pointer;font-variant-numeric:tabular-nums;border-radius:12px;font-size:26px;font-weight:900}.pad-field.focus{border-color:var(--ck-primary);box-shadow:0 0 0 3px var(--ck-primary-soft)}.pad-field:empty:before{content:"?";color:var(--ck-muted)}.keypad{grid-template-columns:repeat(5,1fr);gap:5px;margin-top:4px;display:grid}.keypad .chip{min-height:50px;font-size:20px}.m-actions{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.m-actions .ck-btn{flex:1}.m-actions [hidden]{display:none}#mFeedback{margin-top:10px;font-size:15.5px}#mFeedback:empty{display:none}.sk-mnav{gap:6px}.big-bar,body.big .panel{display:none}body.big .main-layout{grid-template-columns:1fr}body.big .clock-zone{padding:56px 12px 96px}body.big .big-bar{z-index:20;background:var(--ck-panel);border:1px solid var(--ck-border);border-radius:22px;flex-wrap:wrap;justify-content:center;gap:8px;width:max-content;max-width:calc(100vw - 20px);padding:8px;display:flex;position:fixed;bottom:14px;left:50%;transform:translate(-50%);box-shadow:0 8px 26px #00000024}.ck-modal{z-index:10000;background:#00000073;justify-content:center;align-items:center;padding:16px;display:none;position:fixed;inset:0}.ck-modal.open{display:flex}.ck-mbox{background:var(--ck-panel);color:var(--ck-text);border:1px solid var(--ck-border);border-radius:20px;width:min(560px,100%);max-height:calc(100dvh - 32px);padding:22px;overflow:auto}.ck-mbox h2{margin-bottom:6px;font-size:20px;font-weight:900}.ck-mbox p{color:var(--ck-muted);margin-bottom:12px;font-size:14px;line-height:1.6}.ck-mbox .unit-grid{margin-bottom:14px}.mfoot{flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:8px;display:flex}.result-screen{text-align:center;background:var(--ck-bg);flex-direction:column;align-items:center;height:100dvh;padding:64px 20px 28px;animation:.45s fadeUp;overflow-y:auto}.intro-screen>:first-child,.result-screen>:first-child{margin-top:auto}.intro-screen>:last-child,.result-screen>:last-child{margin-bottom:auto}.result-screen h1{margin:6px 0;font-size:30px;font-weight:900}.result-sub{color:var(--ck-muted);margin-bottom:16px;font-size:16px}.result-grid{grid-template-columns:repeat(3,1fr);gap:8px;width:min(520px,100%);margin-bottom:16px;display:grid}.result-cell{background:var(--ck-panel);border:1px solid var(--ck-border);border-radius:14px;padding:10px 6px;font-size:14px;font-weight:700}.result-cell .stars{color:var(--ck-star);letter-spacing:.05em;font-size:18px}.summary{background:var(--ck-panel);border:1px solid var(--ck-border);text-align:left;border-radius:18px;width:min(520px,100%);margin-bottom:18px;padding:18px 22px}.summary h3{color:var(--ck-primary);margin-bottom:8px;font-size:16px}.summary li{color:var(--ck-text);margin-left:18px;font-size:15px;line-height:1.7}.result-btns{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}@media (width<=900px),(orientation:portrait) and (width<=1100px){body{overflow-y:auto}.main-screen{height:auto;min-height:100dvh}.main-layout{flex-direction:column;height:auto;min-height:100dvh;display:flex}.clock-zone{flex-shrink:0;height:54dvh;min-height:320px;padding-top:58px}.panel{border-left:0;border-top:1px solid var(--ck-border);overflow:visible}.panel-head{padding-top:14px}.q-banner{font-size:17px}body.big .clock-zone{height:100dvh}}.ck-btn .ic{flex-shrink:0;width:1.1em;height:1.1em}.ck-btn[hidden],.say-btn[hidden]{display:none}.say-btn{border:1px solid var(--ck-border);background:var(--ck-panel);min-height:44px;color:var(--ck-text);cursor:pointer;touch-action:manipulation;border-radius:99px;align-items:center;gap:6px;padding:0 14px;font-size:15px;font-weight:800;display:inline-flex}.say-btn[aria-pressed=true]{border-color:var(--ck-primary);background:var(--ck-primary-soft);color:var(--ck-primary)}.q-banner .say-btn{min-height:40px;padding:0 12px;font-size:14px}.panel-head h2{align-items:center;gap:8px;display:flex}.mode-tab{justify-content:center;align-items:center;gap:6px;display:inline-flex}.hint-text .ic{vertical-align:-.15em;color:var(--ck-star)}.daybar .labels span{align-items:center;gap:3px;display:inline-flex}.unit-chip,.clock-box .ccap{align-items:center;gap:6px;display:inline-flex}.opt{justify-content:center;align-items:center;gap:8px;display:inline-flex}.result-trophy{color:var(--ck-star);line-height:1}.result-trophy .ic{width:64px;height:64px}.summary h3{align-items:center;gap:6px;display:flex}.intro-screen h1 .app-title-en{color:var(--ck-muted);letter-spacing:0;margin-top:2px;font-size:.5em;font-weight:700;display:block}#btnNow[aria-pressed=true]{border-color:var(--ck-primary);background:var(--ck-primary-soft);color:var(--ck-primary)}body.big{--vui-toast-bottom:96px}@media (width<=560px){body.big .big-bar{grid-template-columns:repeat(3,1fr);width:calc(100vw - 20px);display:grid}body.big .big-bar .ck-btn{padding:0 6px}body.big .clock-zone{padding-bottom:136px}body.big{--vui-toast-bottom:150px}.unit-grid{grid-template-columns:repeat(3,1fr)}.intro-screen h1{font-size:28px}.readout .reading{font-size:24px}.chips{grid-template-columns:repeat(4,1fr)}}
