@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap";.app{min-height:100vh;background:linear-gradient(135deg,#fff4e6,#ffe0c2);overflow:clip;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Inter,sans-serif}.app.dark{background:radial-gradient(circle at 20% 20%,rgba(245,130,32,.15),transparent 40%),radial-gradient(circle at 80% 70%,rgba(245,130,32,.1),transparent 40%),linear-gradient(135deg,#0f172a,#111827)}.app.dark .branding__text{color:#f9fafb}.app.dark .settings__volume,.app.dark .settings__button{background:#1f2937}.app.dark .card{background:linear-gradient(180deg,#111827,#1f2937)}.app.dark .card__title{color:#f9fafb}.app.dark .card__caption{color:#9ca3af}.app.dark .card .timer__svg{filter:drop-shadow(0 0 20px rgba(245,130,32,.6))}.app.dark .card .timer__circle--bg{fill:#2a3441}.app.dark .card .timer__countdown{color:#f9fafb}.app.dark .card .start__button{box-shadow:0 20px 40px #f5822033}.app.dark .card .start__button--primary{background:linear-gradient(135deg,#f58220,#ff9a3d)}.app.dark .reset__button{box-shadow:0 20px 40px #f5822033}.app.dark .reset__button--selected{background:linear-gradient(135deg,#f58220,#ff9a3d)}.app.dark .reset__button--secondary{background:#1f2937;color:#f9fafb}.app.dark .reset__button--secondary:hover{border-color:#f58220;color:#f58220}.header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:5px clamp(12px,4vw,30px);border-bottom:.5px solid lightgrey}.header .branding{display:flex;align-items:center;gap:8px}.header .branding__logo{width:35px}.header .branding__text{font-size:clamp(16px,4.5vw,22px);font-weight:600;color:#111827}.header .branding__text span{color:#f58220}.header .settings{display:flex;align-items:center;gap:16px}.header .settings__volume{display:flex;justify-content:space-around;align-items:center;gap:8px;background:#f3eeec;padding:4px 10px;border-radius:20px}.header .settings__button{display:flex;justify-content:center;align-items:center;background:#f3eeec;padding:4px 10px;border-radius:20px;opacity:.6;transition:opacity .2s}.header .settings__button:hover{opacity:1}.card{display:inline-block;background:linear-gradient(180deg,#fff,#fdf8f3);opacity:.85;padding:0 0 60px;text-align:center;border-radius:32px;max-width:900px;width:90%;box-sizing:border-box;box-shadow:0 60px 100px #00000014,0 10px 40px #0000000d}.card__title{font-size:clamp(28px,5.5vw,44px);font-weight:600;color:#111827;margin:30px 0 8px}.card__caption{font-size:clamp(16px,2.75vw,22px);color:#6b7280;margin:0}.timer{display:grid;grid-template-rows:repeat(20,minmax(0,1fr));width:min(400px,100%);aspect-ratio:1;margin:20px auto 0}.timer.running{animation:ringPulse 3s ease-in-out infinite}.timer.resetting_variant_1{animation:spin 3s ease-in-out infinite}.timer.resetting_variant_2{animation:leaveScreen 3s ease-in-out infinite}.timer.resetting_variant_2__svg,.timer.resetting_variant_2__countdown,.timer.resetting_variant_2__caption{transform:rotateX(0)}.timer__svg{grid-row:1/1;grid-column:1/1;z-index:-1;fill:none;stroke:#f58220;transform:rotateX(25deg);filter:drop-shadow(0 0 14px rgba(245,130,32,.6))}.timer__circle--bg{fill:#f7f0ed;stroke:#f3f4f6}.timer__circle--static{stroke:#e9dcd3;stroke-width:2px}.timer__circle--progress{stroke:#f58220;stroke-width:6px;stroke-linecap:round;transform:rotate(125deg);transform-origin:center}.timer .logo{grid-row:1/5;grid-column:1/1;z-index:1;margin-top:6px}.timer .logo__img{width:50px;height:50px;object-fit:contain;animation:float 3s ease-in-out infinite}.timer__countdown{z-index:1;grid-row:6/12;grid-column:1/1;margin-top:8px;font-size:clamp(36px,14vw,66px);font-weight:800;font-variant-numeric:tabular-nums;color:#111827;transform:rotateX(25deg)}.timer__caption{z-index:1;grid-row:11/12;grid-column:1/1;font-size:clamp(14px,5vw,22px);color:#6b7280;margin:2px 0 0;transform:rotateX(25deg)}.start{z-index:1;grid-row:13/16;grid-column:1/1;margin-top:15px;transform:rotateX(25deg)}.start__button{border:none;border-radius:999px;padding:clamp(5px,2.5%,10px) 22px;font-size:22px;font-weight:500;letter-spacing:.5px;width:min(200px,50%);cursor:pointer;box-shadow:0 8px 20px #f5822040}.start__button--primary{background:linear-gradient(135deg,#f58220,#d96a12);color:#fdf8f3}.start__button--primary:hover{transform:translateY(-2px)}.start__button--primary:active{transform:scale(.97)}.reset{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;padding:12px}.reset__button{border:none;border-radius:999px;padding:clamp(5px,2.5%,10px) 22px;font-size:22px;font-weight:500;letter-spacing:.5px;max-width:135px;cursor:pointer;box-shadow:0 8px 20px #f5822040}.reset__button--selected{flex:1 1 auto;background:linear-gradient(135deg,#f58220,#d96a12);color:#fdf8f3}.reset__button--secondary{flex:1 1 auto;background:#fff;border:1px solid #e5e7eb;color:#111827}.reset__button--secondary:hover{border-color:#f58220;color:#f58220}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-6px)}to{transform:translateY(0)}}@keyframes ringPulse{0%{filter:drop-shadow(0 0 6px rgba(245,130,32,.4))}50%{filter:drop-shadow(0 0 18px rgba(245,130,32,.9))}to{filter:drop-shadow(0 0 6px rgba(245,130,32,.4))}}@keyframes spin{0%{transform:scale(1) rotateX(0)}33%{transform:scale(.4) rotateX(0)}66%{transform:scale(.4) rotateX(20turn)}to{transform:scale(1) rotateX(20turn)}}@keyframes leaveScreen{0%{transform:translate(0) rotate(0) scale(1)}20%{transform:translate(0) rotate(0) scale(.4)}48%{transform:translate(-1200px) rotate(-2.5turn) scale(.4);visibility:hidden}52%{transform:translate(1200px) rotate(-2.5turn) scale(.4);visibility:hidden}80%{transform:translate(0) rotate(-5turn) scale(.4)}to{transform:translate(0) rotate(-5turn) scale(1)}}@media screen and (max-width:390px){.card{padding:0}.reset{flex-direction:column}.reset__button{max-width:100%}}@media screen and (max-width:438px){.header .settings__volume{display:none}}body{margin:0;background:#fff4e5}