:root{--bg: #F4F6F4;--surface: #FFFFFF;--sunken: #EAEEEC;--ink: #1D2A2B;--muted: #5B6B6D;--line: #D8E0DD;--accent: #2C6E5F;--accent-deep: #22594C;--accent-weak: #E1EEE9;--warn: #B8741A;--warn-weak: #F6EAD8;--font: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", "Noto Sans JP", "Noto Sans CJK JP", system-ui, sans-serif;--ease: cubic-bezier(.2, .7, .2, 1)}:root[data-theme=dark]{--bg: #121A1B;--surface: #1A2425;--sunken: #223031;--ink: #E6EEEC;--muted: #9DB0AE;--line: #2E3F40;--accent: #5FB59F;--accent-deep: #7CC9B4;--accent-weak: #1F3A35;--warn: #E0A34E;--warn-weak: #3A2D17}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg);color:var(--ink);font-family:var(--font);line-height:1.7;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}a{color:var(--accent);text-underline-offset:3px}:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px}h1,h2{margin:0;line-height:1.35}.skip{position:absolute;left:-999px;top:8px;background:var(--surface);padding:8px 12px;z-index:60}.skip:focus{left:8px}.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px}.title{font-size:18px;font-weight:900;letter-spacing:.04em}.bar-actions{display:flex;gap:8px}.chip{min-height:40px;padding:4px 16px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:14px;font-weight:500;cursor:pointer}.chip:hover{border-color:var(--muted)}.stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin:8px 16px;padding:28px 16px;border:2px solid transparent;border-radius:20px;transition:border-color .4s var(--ease),background-color .4s var(--ease)}.phase{margin:0;padding:2px 18px;border-radius:999px;font-size:clamp(16px,2.4vw,22px);font-weight:700;background:var(--sunken);color:var(--ink)}.clock{margin:12px 0 0;font-size:clamp(88px,26vw,300px);font-weight:900;line-height:1.05;letter-spacing:.01em;font-variant-numeric:tabular-nums;font-feature-settings:"tnum";white-space:nowrap}.sub{margin:4px 0 0;color:var(--muted);font-size:clamp(14px,2vw,18px)}.next{margin:18px 0 0;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:clamp(14px,2vw,18px);font-variant-numeric:tabular-nums}.dots{color:var(--accent);letter-spacing:.3em;font-size:1.1em}.stage[data-phase=qa]{border-color:var(--accent)}.stage[data-phase=qa] .phase{background:var(--accent-weak);color:var(--accent)}.stage[data-phase=qa] .clock{color:var(--accent)}.stage[data-phase=over]{border-color:var(--warn);background:var(--warn-weak)}.stage[data-phase=over] .phase{background:var(--warn);color:#fff}.stage[data-phase=over] .clock{color:var(--warn)}:root[data-theme=dark] .stage[data-phase=over] .phase{color:#1b1204}.controls{margin-top:28px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.btn{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;padding:8px 22px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:16px;font-weight:500;cursor:pointer;transition:border-color .15s ease,background .15s ease}.btn:hover{border-color:var(--muted)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}:root[data-theme=dark] .btn-primary{color:#0d1514}.btn-primary:hover{background:var(--accent-deep);border-color:var(--accent-deep)}.btn-main{min-width:140px;font-size:18px;font-weight:700}.notice{margin:22px 0 0;max-width:34em;color:var(--muted);font-size:14px}.notice.warn{color:var(--warn)}.keys{margin:6px 0 0;color:var(--muted);font-size:12.5px}.flash{position:fixed;inset:0;z-index:40;pointer-events:none;background:var(--accent);opacity:0}.flash.on{animation:flash .7s var(--ease)}@keyframes flash{0%{opacity:.28}to{opacity:0}}.panel{width:min(720px,100% - 32px);margin:8px auto 24px;padding:22px;background:var(--surface);border:1px solid var(--line);border-radius:16px}.panel[hidden]{display:none}.panel h2{font-size:16px;margin:20px 0 10px}.panel h2:first-child{margin-top:0}.presets{display:flex;flex-wrap:wrap;gap:8px}.presets button{min-height:48px;padding:6px 16px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;font-size:15px;cursor:pointer}.presets button[aria-pressed=true]{border-color:var(--accent);background:var(--accent-weak);color:var(--accent);font-weight:700}.custom{margin-top:14px;display:grid;gap:8px}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.row input[type=checkbox]{width:22px;height:22px;accent-color:var(--accent)}.row-spacer{width:22px}.row-name{width:2.5em;font-weight:700}.row-note{color:var(--muted);font-size:13px}.custom input[type=text],#share-url{min-height:44px;padding:4px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font:inherit;font-size:17px;font-variant-numeric:tabular-nums}.custom input[type=text]{width:6.5em;text-align:center}.custom input[type=text]:disabled{opacity:.45}.error{margin:4px 0 0;color:var(--warn);font-size:14px}.error[hidden]{display:none}.row-group{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.row.inline{gap:10px}.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}.seg label{display:block}.seg input{position:absolute;opacity:0;pointer-events:none}.seg span{display:inline-flex;align-items:center;min-height:44px;padding:4px 18px;cursor:pointer;background:var(--bg)}.seg input:checked+span{background:var(--accent-weak);color:var(--accent);font-weight:700}.seg input:focus-visible+span{outline:3px solid var(--accent);outline-offset:-3px}.check{display:inline-flex;align-items:center;gap:8px;min-height:44px}.check input{width:22px;height:22px;accent-color:var(--accent)}input[type=range]{width:180px;accent-color:var(--accent)}#share-url{flex:1 1 260px;min-width:0;font-size:14px}.foot{padding:18px 20px 28px;text-align:center;color:var(--muted);font-size:13px}.foot p{margin:2px 0}:fullscreen .bar,:fullscreen .foot,:fullscreen .keys,:fullscreen .notice{display:none}@media(max-width:560px){.controls .btn-main{flex:1 1 100%;order:-1}.controls .btn{flex:1 1 28%;padding-inline:10px}.panel{padding:16px}}@media(prefers-reduced-motion:reduce){.flash.on{animation:none;opacity:0}.stage.hit{border-color:var(--accent)}.stage,.btn{transition:none}}