body{display:flex;min-height:100vh;flex-direction:column}main{flex:1}.timer-hero{padding:50px 0 80px}.hero-copy{max-width:930px;margin:0 auto 34px;text-align:center}.crumbs{margin-bottom:18px;color:var(--muted);font-size:.82rem}.crumbs a{color:var(--primary);font-weight:750}.hero-copy h1{max-width:920px;font-size:clamp(2.75rem,7vw,5.15rem)}.timer-app{max-width:1060px;margin:auto;overflow:hidden;border:1px solid var(--border);border-radius:30px;background:rgba(255,255,255,.9);box-shadow:var(--shadow)}.setup-panel{padding:28px 32px 26px;border-bottom:1px solid var(--border);background:rgba(250,249,255,.76)}.setup-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.panel-kicker,.section-label{display:block;margin-bottom:7px;color:var(--primary);font-size:.72rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.setup-heading h2{margin:0;font-size:1.25rem;letter-spacing:-.025em}.sound-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid rgba(0,194,168,.2);border-radius:999px;color:#087b6c;background:rgba(0,194,168,.08);font-size:.74rem;font-weight:800}.sound-badge span{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(0,194,168,.12)}.duration-controls{display:grid;grid-template-columns:120px 1fr;gap:14px;margin-top:20px}.minute-field{display:grid;gap:7px}.minute-field span{color:var(--muted);font-size:.72rem;font-weight:800}.minute-field input{width:100%;height:48px;padding:0 13px;border:1px solid rgba(31,34,62,.14);border-radius:13px;color:var(--text);background:#fff;outline:none;font-weight:850}.minute-field input:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(108,92,231,.1)}.presets{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;align-self:end}.preset{height:48px;padding:0 8px;border:1px solid var(--border);border-radius:13px;color:#55586e;background:#fff;font-size:.8rem;font-weight:800;transition:.18s}.preset:hover{border-color:rgba(108,92,231,.3);color:var(--primary)}.preset.active{border-color:var(--primary);color:#fff;background:var(--primary);box-shadow:0 8px 20px rgba(108,92,231,.22)}.color-option{display:flex;align-items:center;gap:11px;width:max-content;max-width:100%;margin-top:17px;cursor:pointer}.color-option input{position:absolute;opacity:0;pointer-events:none}.toggle-ui{position:relative;width:42px;height:24px;flex:none;border-radius:999px;background:#c7c8d3;transition:.2s}.toggle-ui:after{content:"";position:absolute;top:4px;left:4px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(31,34,62,.2);transition:.2s}.color-option input:checked+.toggle-ui{background:var(--primary)}.color-option input:checked+.toggle-ui:after{transform:translateX(18px)}.color-option input:focus-visible+.toggle-ui{box-shadow:0 0 0 4px rgba(108,92,231,.16)}.color-option strong,.color-option small{display:block}.color-option strong{font-size:.8rem}.color-option small{margin-top:2px;color:var(--muted);font-size:.7rem}.public-stage{position:relative;isolation:isolate;min-height:390px;padding:28px 34px;overflow:hidden;background:radial-gradient(circle at 50% 48%,rgba(108,92,231,.15),transparent 34%),linear-gradient(160deg,#fcfbff,#f4f2ff 55%,#f4fffd)}.stage-aura{position:absolute;z-index:-1;inset:50% auto auto 50%;width:380px;height:160px;border-radius:50%;background:rgba(108,92,231,.12);filter:blur(55px);opacity:.5;transform:translate(-50%,-50%);transition:.6s}.stage-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--muted);font-size:.7rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.stage-state{display:inline-flex;align-items:center;gap:8px}.stage-state i{width:8px;height:8px;border-radius:50%;background:#a4a6b5}.numberless-badge{padding:7px 10px;border:1px solid rgba(108,92,231,.12);border-radius:999px;color:var(--primary);background:rgba(255,255,255,.68)}.bar-scene{display:flex;min-height:265px;flex-direction:column;align-items:center;justify-content:center}.progress-track{position:relative;width:min(850px,96%);height:58px;overflow:hidden;border:1px solid rgba(108,92,231,.12);border-radius:999px;background:rgba(255,255,255,.76);box-shadow:inset 0 2px 8px rgba(38,35,86,.07),0 24px 60px rgba(55,47,126,.1)}.progress-fill{position:absolute;inset:0 auto 0 0;width:100%;border-radius:inherit;background:linear-gradient(90deg,#6c5ce7,#7968eb 50%,#00c2a8);box-shadow:0 0 28px rgba(108,92,231,.24);transition:background .5s}.progress-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 25%,rgba(255,255,255,.28) 48%,transparent 68%);transform:translateX(-120%)}.timer-app.running .progress-fill:after{animation:softSweep 4.5s ease-in-out infinite}.phase-label{min-height:24px;margin:22px 0 0;color:#4e5169;font-size:.84rem;font-weight:800;transition:.3s}.stage-hint{margin:0;color:var(--muted);font-size:.72rem;text-align:center}.fullscreen-exit{display:none}.speaker-controls{display:flex;justify-content:center;gap:10px;padding:24px 24px 13px;border-top:1px solid var(--border);background:#fff}.control-primary,.control-secondary{display:inline-flex;min-height:50px;align-items:center;justify-content:center;gap:9px;padding:0 19px;border-radius:14px;font-weight:850;transition:.18s}.control-primary{min-width:190px;border:0;color:#fff;background:linear-gradient(135deg,var(--primary),#8575f1);box-shadow:0 12px 28px rgba(108,92,231,.24)}.control-primary:hover{transform:translateY(-2px);box-shadow:0 16px 33px rgba(108,92,231,.31)}.control-secondary{border:1px solid var(--border);color:#55586e;background:#fff}.control-secondary:hover{color:var(--primary);background:#f6f4ff}.control-icon{font-size:.75rem}.shortcut-note{margin:0;padding:0 20px 22px;color:var(--muted);background:#fff;font-size:.7rem;text-align:center}.shortcut-note span{margin:0 5px}.shortcut-note kbd{padding:2px 6px;border:1px solid var(--border);border-radius:5px;background:#f8f8fc;box-shadow:0 2px 0 rgba(31,34,62,.08);font:inherit;font-weight:800}.sr-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.timer-app.running .stage-state i{background:var(--accent);box-shadow:0 0 0 5px rgba(0,194,168,.12);animation:statePulse 2s ease-in-out infinite}.timer-app.paused .stage-state i{background:#ffb648;box-shadow:0 0 0 5px rgba(255,182,72,.14)}.timer-app.warning .progress-fill{background:linear-gradient(90deg,#6c5ce7,#a878da 52%,#f5a642)}.timer-app.final .progress-fill{background:linear-gradient(90deg,#6c5ce7,#ee7897 58%,#f05d70)}.timer-app.complete .public-stage{background:radial-gradient(circle at 50% 50%,rgba(0,194,168,.22),transparent 38%),linear-gradient(160deg,#fcfbff,#effffa)}.timer-app.complete .stage-aura{background:rgba(0,194,168,.22);opacity:1;transform:translate(-50%,-50%) scale(1.3)}.finish-mark{position:absolute;display:grid;width:82px;height:82px;place-items:center;border-radius:50%;opacity:0;background:#fff;box-shadow:0 18px 50px rgba(0,164,141,.2);transform:scale(.5);transition:.45s}.finish-mark span{width:28px;height:15px;border-left:4px solid var(--accent);border-bottom:4px solid var(--accent);transform:translateY(-3px) rotate(-45deg)}.timer-app.complete .finish-mark{opacity:1;transform:scale(1);animation:finishPop .8s cubic-bezier(.2,.8,.2,1)}.timer-app.complete .progress-track{opacity:.14;transform:scaleX(.92);transition:.4s}.timer-app.complete .phase-label{color:#087b6c;font-size:.92rem}.timer-app:fullscreen,.public-stage:fullscreen{width:100vw;height:100vh;border:0;border-radius:0;background:#f8f7ff}.public-stage:fullscreen{display:grid;min-height:100vh;padding:clamp(24px,5vw,80px);place-items:center}.public-stage:fullscreen .stage-aura{width:52vw;height:30vh}.public-stage:fullscreen .stage-topline,.public-stage:fullscreen .phase-label,.public-stage:fullscreen .stage-hint,.public-stage:fullscreen .fullscreen-exit{display:none}.public-stage:fullscreen .bar-scene{width:100%;min-height:0}.public-stage:fullscreen .progress-track{width:min(88vw,1600px);height:clamp(58px,8vh,110px);border-width:2px}.public-stage:fullscreen .finish-mark{width:clamp(86px,12vw,150px);height:clamp(86px,12vw,150px)}.public-stage:fullscreen .finish-mark span{width:38%;height:22%;border-width:clamp(4px,.65vw,9px)}.content-section{padding:72px 0}.content-section.alt{border-block:1px solid rgba(31,34,62,.06);background:rgba(255,255,255,.45)}.content{max-width:930px;margin:auto}.content h2{margin:0 0 12px;font-size:clamp(1.85rem,4vw,2.65rem);letter-spacing:-.045em}.content>p,.content-split p{color:var(--muted);line-height:1.75}.steps,.try-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:25px}.step{padding:23px;border:1px solid var(--border);border-radius:19px;background:#fff}.step-number{display:grid;width:43px;height:43px;place-items:center;margin-bottom:15px;border-radius:13px;color:var(--primary);background:rgba(108,92,231,.1);font-weight:900}.step h3{margin:0 0 8px;font-size:1rem}.step p{margin:0;color:var(--muted);font-size:.86rem;line-height:1.65}.privacy-note{display:flex;align-items:center;gap:16px;margin-top:22px;padding:18px 20px;border:1px solid rgba(0,194,168,.18);border-radius:17px;background:rgba(0,194,168,.07)}.privacy-icon{display:grid;width:48px;height:48px;flex:none;place-items:center;border-radius:14px;color:#087b6c;background:#fff;font-size:.75rem;font-weight:900}.privacy-note strong,.privacy-note small{display:block}.privacy-note strong{margin-bottom:4px;font-size:.9rem}.privacy-note small{color:var(--muted);font-size:.8rem;line-height:1.55}.content-split{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:start}.benefit-list{display:grid;gap:11px}.benefit-list article{display:flex;align-items:flex-start;gap:14px;padding:17px;border:1px solid var(--border);border-radius:16px;background:#fff}.benefit-list article>span{display:grid;width:43px;height:43px;flex:none;place-items:center;border-radius:12px;color:var(--primary);background:#f0edff;font-size:.67rem;font-weight:900}.benefit-list h3{margin:1px 0 5px;font-size:.92rem}.benefit-list p{margin:0;font-size:.78rem;line-height:1.55}.faq{display:grid;gap:10px;margin-top:24px}.faq details{border:1px solid var(--border);border-radius:15px;background:#fff}.faq summary{padding:17px 19px;cursor:pointer;font-weight:800}.faq details p{margin:0;padding:0 19px 18px;color:var(--muted);line-height:1.7}.try-head{display:flex;align-items:end;justify-content:space-between;gap:20px}.try-head h2{margin-bottom:5px}.try-head p{margin:0;color:var(--muted)}.try-head>a{color:var(--primary);font-size:.86rem;font-weight:800}.try-card{display:flex;align-items:center;gap:13px;padding:18px;border:1px solid var(--border);border-radius:17px;background:#fff;transition:.2s}.try-card:hover{transform:translateY(-3px);box-shadow:0 14px 35px rgba(53,49,110,.1)}.try-icon{display:grid;width:44px;height:44px;flex:none;place-items:center;border-radius:13px;color:var(--primary);background:#f0edff;font-size:.72rem;font-weight:900}.try-card strong,.try-card span span{display:block}.try-card span span{margin-top:4px;color:var(--muted);font-size:.75rem}.timer-app.controls-locked .setup-panel{opacity:.62}.timer-app.controls-locked .setup-panel input,.timer-app.controls-locked .setup-panel button{pointer-events:none}
@keyframes softSweep{45%,100%{transform:translateX(140%)}}@keyframes statePulse{50%{opacity:.5}}@keyframes finishPop{0%{transform:scale(.45) rotate(-8deg)}65%{transform:scale(1.12) rotate(2deg)}100%{transform:scale(1)}}@media(max-width:760px){.timer-hero{padding:38px 0 58px}.timer-app{border-radius:23px}.setup-panel{padding:23px 18px}.setup-heading{align-items:flex-start;flex-direction:column;gap:13px}.duration-controls{grid-template-columns:95px 1fr}.presets{grid-template-columns:repeat(3,1fr)}.public-stage{min-height:330px;padding:23px 18px}.progress-track{height:45px}.speaker-controls{display:grid;grid-template-columns:1fr 1fr;padding-inline:17px}.control-primary{grid-column:1/-1}.control-primary,.control-secondary{width:100%}.steps,.try-grid,.content-split{grid-template-columns:1fr}.content-split{gap:30px}.content-section{padding:55px 0}.try-head{align-items:flex-start;flex-direction:column}.privacy-note{align-items:flex-start}}@media(max-width:430px){.duration-controls{grid-template-columns:1fr}.presets{grid-template-columns:repeat(3,1fr)}.minute-field{max-width:110px}.numberless-badge{display:none}.shortcut-note span{display:none}.shortcut-note kbd{margin:0 3px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}