*,*:before,*:after{margin:0;padding:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}:root{--sky-blue: #96D1F6;--forest-green: #423F1A;--olive: #72692F;--warm-earth: #988A55;--stone-grey: #B6AC92;--bg: #2a2810;--surface: var(--forest-green);--border: var(--olive);--text: var(--stone-grey);--text-muted: var(--warm-earth);--accent: var(--sky-blue);--accent-glow: rgba(150, 209, 246, .2);--accent-secondary: var(--sky-blue)}html,body{height:100%;font-family:Inter,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);-webkit-text-size-adjust:100%}#app{height:100%;overflow-y:auto;overflow-x:hidden}.countdown-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%;padding:1.5rem 1rem;position:relative;z-index:1}.bg-photo{position:fixed;inset:-5%;width:110%;height:110%;z-index:-2;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;transition:opacity 1.5s ease-in-out;pointer-events:none;will-change:transform,opacity}.bg-photo.visible{opacity:.25}.background-glow{position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse 60% 50% at 50% 40%,var(--accent-glow),transparent 70%),radial-gradient(ellipse 40% 40% at 30% 60%,rgba(114,105,47,.15),transparent 60%),radial-gradient(ellipse 40% 40% at 70% 60%,rgba(150,209,246,.06),transparent 60%);pointer-events:none;animation:pulse 8s ease-in-out infinite alternate}@keyframes pulse{0%{opacity:.6}to{opacity:1}}.header{text-align:center;margin-bottom:2rem}.subtitle{font-size:.75rem;font-weight:400;letter-spacing:.15em;text-transform:uppercase;color:var(--text);margin-bottom:.35rem;text-shadow:0 1px 4px rgba(0,0,0,.6)}.title{font-size:clamp(1.5rem,6vw,3rem);font-weight:700;letter-spacing:-.02em;background:linear-gradient(105deg,var(--stone-grey) 0%,var(--stone-grey) 35%,var(--sky-blue) 50%,var(--stone-grey) 65%,var(--stone-grey) 100%);background-size:250% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:sheen 4s ease-in-out infinite;filter:drop-shadow(0 1px 3px rgba(0,0,0,.7))}@keyframes sheen{0%{background-position:100% 50%}to{background-position:-50% 50%}}.time-label{font-size:1rem;color:var(--text);margin-top:.2rem;font-weight:300;text-shadow:0 1px 4px rgba(0,0,0,.6)}.timer{display:flex;align-items:baseline;justify-content:center;gap:.2rem;width:100%;max-width:700px}.segment{display:flex;flex-direction:column;align-items:center;background:#423f1a8c;-webkit-backdrop-filter:blur(12px) saturate(1.3);backdrop-filter:blur(12px) saturate(1.3);border:1px solid rgba(114,105,47,.4);border-radius:.75rem;padding:.6rem .5rem .5rem;min-width:0;flex:1 1 0;max-width:6rem;transition:box-shadow .3s ease;overflow:hidden;box-shadow:0 2px 12px #00000080,inset 0 1px #ffffff0f}.segment.shaking{animation:shake .35s ease-in-out}@keyframes shake{0%{transform:translate(0)}15%{transform:translate(-1.5px,1px)}30%{transform:translate(1.5px,-1px)}45%{transform:translate(-1.2px,-.6px)}60%{transform:translate(1.2px,.6px)}75%{transform:translate(-.6px,.4px)}to{transform:translate(0)}}@media(hover:hover){.segment:hover{box-shadow:0 0 20px var(--accent-glow)}}.digit-group{display:flex;gap:.04em}.digit-roller{display:inline-block;position:relative;overflow:hidden;font-family:JetBrains Mono,monospace;font-size:clamp(1.5rem,7vw,3.5rem);font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums;color:var(--text);width:.65em;height:1.2em}.digit-current,.digit-next{display:block;position:absolute;left:0;right:0;text-align:center;will-change:transform,opacity;text-shadow:0 1px 3px rgba(0,0,0,.5)}.digit-current{top:0}.digit-next{top:100%}.digit-roller.rolling .digit-current{animation:slideOutUp .35s cubic-bezier(.4,0,.2,1) forwards}.digit-roller.rolling .digit-next{animation:slideInUp .35s cubic-bezier(.4,0,.2,1) forwards}@keyframes slideOutUp{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:0}}@keyframes slideInUp{0%{transform:translateY(0);opacity:0}to{transform:translateY(-100%);opacity:1}}.label{font-size:.6rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-top:.35rem}.separator{font-family:JetBrains Mono,monospace;font-size:clamp(1.25rem,5vw,3rem);font-weight:300;color:var(--text-muted);flex-shrink:0;padding-bottom:.75rem;text-shadow:0 1px 3px rgba(0,0,0,.5)}.finished-message{margin-top:1.5rem;font-size:1.1rem;font-weight:600;color:var(--accent-secondary);opacity:0;transform:translateY(10px);transition:opacity .6s ease,transform .6s ease;pointer-events:none;text-align:center}.finished-message.visible{opacity:1;transform:translateY(0)}@media(max-width:360px){.countdown-container{padding:1rem .5rem}.header{margin-bottom:1.25rem}.subtitle{font-size:.65rem}.timer{gap:.1rem}.segment{padding:.5rem .25rem .4rem;border-radius:.5rem}.digit-roller{font-size:clamp(1.25rem,6vw,2rem)}.label{font-size:.5rem;margin-top:.25rem}.separator{font-size:clamp(1rem,4vw,1.5rem);padding-bottom:.5rem}.finished-message{font-size:.95rem;margin-top:1rem}}@media(min-width:481px){.countdown-container{padding:2rem}.header{margin-bottom:2.5rem}.subtitle{font-size:.875rem}.timer{gap:.35rem}.segment{padding:1rem 1rem .75rem;border-radius:1rem;max-width:7rem}.label{font-size:.7rem;margin-top:.5rem}.separator{padding-bottom:1rem}.finished-message{margin-top:2rem;font-size:1.25rem}}@media(min-width:768px){.header{margin-bottom:3rem}.timer{gap:.5rem}.segment{padding:1.25rem 1.5rem 1rem;max-width:8rem}.time-label{font-size:1.1rem}}.sound-toggle{position:fixed;bottom:1.5rem;right:1.5rem;width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid rgba(114,105,47,.5);background:#423f1ab3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease;z-index:100}.sound-toggle:hover{background:#423f1ae6;border-color:var(--olive)}.sound-toggle:active{transform:scale(.95)}.sound-toggle svg{width:1.25rem;height:1.25rem;stroke-linecap:round;stroke-linejoin:round}.sound-toggle .icon-sound-on{display:none}.sound-toggle .icon-sound-off{display:block}.sound-toggle.enabled{color:var(--accent);border-color:#96d1f666;box-shadow:0 0 12px #96d1f633}.sound-toggle.enabled .icon-sound-on{display:block}.sound-toggle.enabled .icon-sound-off{display:none}@media(max-width:360px){.sound-toggle{width:2.25rem;height:2.25rem;bottom:1rem;right:1rem}.sound-toggle svg{width:1rem;height:1rem}}