:root{font-family:Inter,SF Pro Display,Segoe UI,Roboto,sans-serif;color:#efe8df;background:radial-gradient(circle at 20% 10%,#2a2b38,#151721 65%,#0c0d12)}*{box-sizing:border-box}body{margin:0;min-height:100vh}button{font:inherit}#root{min-height:100vh}.app{min-height:100vh;position:relative;display:grid;place-items:center;padding:2rem;overflow:hidden}.ambient-glow{position:absolute;width:42rem;height:42rem;border-radius:999px;background:radial-gradient(circle,#ffd99b24,#ffd99b00 72%);filter:blur(16px);pointer-events:none}.panel{position:relative;width:min(60rem,100%);padding:1rem 2rem 1.8rem;border-radius:1.2rem;border:1px solid rgba(255,255,255,.1);background:linear-gradient(160deg,#faf6f014,#faf6f008);box-shadow:0 20px 50px #00000057,inset 0 1px #ffffff0f}.topbar{position:absolute;top:.8rem;right:1rem;display:flex;justify-content:flex-end;align-items:center;gap:1rem;z-index:3}h1{margin:0;font-size:30px;font-weight:560;letter-spacing:.02em;font-family:Slabo,Times New Roman,serif;text-shadow:0 1px 0 rgba(255,255,255,.12),0 8px 22px rgba(0,0,0,.22)}.digital-time{margin:0 0 .25rem;font-size:clamp(2.25rem,4.5vw,3.1rem);font-weight:650;letter-spacing:.08em;color:#f7f3eb}.helper-text{margin:.5rem 0 1.3rem;color:#f1ece5c7}.scene{display:grid;grid-template-columns:1fr 16rem;align-items:end;min-height:22rem}.candle-wrap{justify-self:center;position:relative;width:13rem;height:22rem;display:flex;align-items:end;justify-content:center}.candle-shell-outer{position:relative;width:4.35rem;height:17rem;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.candle-shell{position:relative;width:100%;min-height:0;overflow:visible;border-radius:.9rem .9rem .55rem .55rem;border:1px solid rgba(255,255,255,.28);transition:height .4s linear,box-shadow .45s ease}.candle-shell--lit{box-shadow:0 0 32px #ffb96e57,0 0 64px #ff964b33,0 0 96px #ff78321a}.wax-fill{position:absolute;top:0;right:0;bottom:0;left:0;overflow:visible;border-radius:inherit;background-color:#f4efe6;background-image:radial-gradient(130% 58% at 14% 18%,rgba(255,255,255,.5),transparent 50%),radial-gradient(120% 46% at 86% 80%,rgba(117,99,83,.12),transparent 58%),repeating-linear-gradient(64deg,#fff7e952 0,#fff7e952 7px,#e8d6bf57 7px,#e8d6bf57 14px,#f7ecdd3d 14px,#f7ecdd3d 22px),repeating-linear-gradient(-62deg,#ffffff2e 0,#ffffff2e 6px,#e4d0b729 6px,#e4d0b729 13px,#977c6012 13px,#977c6012 19px),linear-gradient(180deg,#fffaf1,#f4ecdd 48%,#d2c3ad);background-blend-mode:screen,multiply,soft-light,overlay,normal;box-shadow:inset -10px 0 16px #4e3f2f24,inset 10px 0 18px #ffffff57,inset 0 8px 10px #fff3}.wax-fill:before{content:"";position:absolute;top:.35rem;right:.5rem;bottom:.4rem;left:.5rem;border-radius:.7rem .7rem .45rem .45rem;background:repeating-radial-gradient(ellipse at 50% 0,#ffffff3d 0,#ffffff3d 8px,#eedabf29 8px,#eedabf29 15px,#a6846114 15px,#a6846114 22px);opacity:.42;mix-blend-mode:soft-light;pointer-events:none}.wick-target{position:absolute;left:50%;bottom:100%;transform:translate(-50%);width:8.75rem;height:5.85rem;margin-bottom:-.35rem;padding:0;background:transparent;border:none;cursor:pointer;z-index:2}.wick-target:focus-visible{outline:2px solid rgba(255,220,170,.75);outline-offset:4px;border-radius:.45rem}.wick-target.ready .wick{box-shadow:0 0 6px #ffc25894}.wick{position:absolute;left:50%;bottom:0;transform:translate(-50%);width:.2rem;height:1.05rem;border-radius:99px;background:#2a211e}.candle-flame-wrap{position:absolute;left:50%;top:0;z-index:1;width:1.75rem;height:2.65rem;transform:translate(-50%,-76%);pointer-events:none}.candle-flame-wrap:has(.candle-flame.on):before{content:"";position:absolute;left:50%;bottom:-.15rem;width:5.5rem;height:5.5rem;transform:translate(-50%,32%);background:radial-gradient(circle at 50% 38%,rgba(255,236,200,.55) 0%,rgba(255,200,120,.28) 38%,rgba(255,150,70,.1) 58%,transparent 72%);filter:blur(22px);pointer-events:none;z-index:-1;animation:candleAmbientPulse 2.6s ease-in-out infinite alternate}.candle-flame-wrap:has(.candle-flame.on):after{content:"";position:absolute;left:50%;bottom:-.25rem;width:9rem;height:9rem;transform:translate(-50%,28%);background:radial-gradient(circle at 50% 40%,rgba(255,195,115,.22) 0%,rgba(255,150,80,.08) 45%,transparent 70%);filter:blur(36px);pointer-events:none;z-index:-2}.candle-flame{position:absolute;left:0;bottom:0;width:1.75rem;height:2.65rem;opacity:0;border-radius:60% 60% 62% 62%/70% 70% 40% 40%;background:radial-gradient(circle at 50% 30%,#fffddb 8%,#ffce67 58%,#ff7a2f);filter:drop-shadow(0 0 10px rgba(255,202,124,.9));transform-origin:50% 100%}.candle-flame.on{opacity:1;filter:drop-shadow(0 0 14px rgba(255,220,140,.95)) drop-shadow(0 0 32px rgba(255,185,95,.65)) drop-shadow(0 0 56px rgba(255,140,60,.38)) drop-shadow(0 0 88px rgba(255,100,40,.18));animation:flameFlicker 1.15s ease-in-out infinite alternate}.plate{position:absolute;bottom:-.2rem;width:8.5rem;height:1.2rem;border-radius:999px;background:linear-gradient(180deg,#ceb7914d,#5c4f4042)}.matchbox-wrap{align-self:center;justify-self:center}.matchbox{position:relative;width:14.4rem;aspect-ratio:492 / 277;height:auto;border-radius:.5rem;background:transparent;box-shadow:0 12px 25px #0000004d;color:#f2dfd3;overflow:visible}.matchbox-art{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;pointer-events:none}.matchbox-pick{position:absolute;top:0;right:1.7rem;bottom:0;left:0;margin:0;padding:.7rem 0 0 .8rem;border:none;border-radius:.5rem 0 0 .5rem;background:#0000;color:inherit;font:inherit;cursor:pointer;text-align:left;z-index:1}.matchbox-pick:hover{background:#ffffff0d}.matchbox-pick:focus-visible{outline:2px solid rgba(255,220,170,.65);outline-offset:2px}.striker-strip{position:absolute;top:.24rem;right:.24rem;width:1.35rem;height:calc(100% - .48rem);margin:0;padding:0;border-radius:.3rem;border:1px solid rgba(0,0,0,.2);background-image:radial-gradient(circle at 1px 1px,#2f2018 1.4px,#56362a 0);background-size:4px 4px;background-color:transparent;font:inherit;overflow:visible;cursor:grab;touch-action:none;z-index:2}.striker-strip:active:not(:disabled){cursor:grabbing}.striker-strip:focus-visible{outline:2px solid rgba(255,220,170,.65);outline-offset:2px}.striker-strip:disabled{cursor:not-allowed;opacity:.45}.striker-strip--dragging:not(:disabled){opacity:.92;filter:brightness(1.06)}.striker-strip--spark:after{content:"";position:absolute;top:-6px;right:-4px;bottom:-6px;left:-4px;border-radius:.35rem;pointer-events:none;background:radial-gradient(ellipse 70% 100% at 50% 42%,rgba(255,252,235,.95) 0%,rgba(255,200,100,.45) 38%,rgba(255,140,60,.12) 62%,transparent 72%);box-shadow:0 0 14px #ffd282a6;opacity:0;animation:strikerSparkFlash .42s ease-out forwards}@media (prefers-reduced-motion: reduce){.striker-strip--spark:after{animation-duration:.15s}}.matchbox-note{max-width:12rem;margin:.8rem auto 0;text-align:center;font-size:.86rem;color:#ede6dcb3}.controls-row{margin-top:1.2rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}.durations{display:flex;gap:.65rem}.chip,.soft-button{border:1px solid rgba(255,255,255,.23);border-radius:999px;color:#f2ede6;background:#ffffff0f;padding:.52rem 1rem;cursor:pointer;transition:transform .16s ease,border-color .2s ease,background .2s ease}.chip:hover:enabled,.soft-button:hover:enabled{transform:translateY(-1px);border-color:#ffedca73;background:#ffffff1a}.chip.selected{border-color:#ffdc9fe6;background:#ffd38e33;color:#fff9ef}.chip:disabled{opacity:.5;cursor:not-allowed}.restart{min-width:6.5rem}.cursor-match{position:fixed;width:5.1rem;height:2.35rem;transform-origin:0 0;transform:translate(calc(-.36rem - 14px),calc(-.5rem - 20px));pointer-events:none;z-index:20}.cursor-match-swing{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:.36rem .5rem;will-change:transform}.match-stick{position:absolute;left:.72rem;top:.4rem;width:3.05rem;height:.2rem;border-radius:999px;background:linear-gradient(90deg,#e5cfb5,#ba9169);box-shadow:inset 0 1px #ffffff59}.match-head{position:absolute;left:.08rem;top:.22rem;z-index:1;width:.56rem;height:.56rem;border-radius:50%;background:radial-gradient(circle at 38% 30%,#ff6a58,#de2e24 62%,#9f1d18);box-shadow:0 0 5px #ff503a59}.match-flame-wrap{position:absolute;left:.36rem;top:.22rem;width:1.05rem;height:1.48rem;transform:translate(-50%,-100%);pointer-events:none;z-index:2}.match-flame{position:absolute;left:0;bottom:0;width:1.05rem;height:1.48rem;opacity:0;border-radius:60% 60% 63% 63%/68% 68% 36% 36%;background:radial-gradient(circle at 50% 28%,#fff9e5 5%,#ffd78a 48%,#ff923a 88%,#d84a18);filter:drop-shadow(0 0 10px rgba(255,195,105,.92));transform-origin:50% 100%}.cursor-match.lit .match-flame{opacity:1;animation:matchFlameFlicker .88s ease-in-out infinite alternate}.cursor-match.lit .match-head{background:radial-gradient(circle at 40% 35%,#ff8a70,#e43d28 56%,#7c160f);box-shadow:0 0 12px #ff7c48b8}@keyframes matchFlameFlicker{0%{transform:translate(-.6px) scaleY(.94) rotate(-2deg)}50%{transform:translate(.7px) scaleY(1.02) rotate(1.2deg)}to{transform:translate(-.35px) scaleY(1.05) rotate(-.9deg)}}@media (prefers-reduced-motion: reduce){.cursor-match.lit .match-flame{animation:none}}@keyframes candleAmbientPulse{0%{opacity:.88;transform:translate(-50%,32%) scale(1)}to{opacity:1;transform:translate(-50%,32%) scale(1.07)}}@media (prefers-reduced-motion: reduce){.candle-flame-wrap:has(.candle-flame.on):before{animation:none;opacity:.94}}@keyframes flameFlicker{0%{transform:translate(-2px) scale(.95) rotate(-2deg)}50%{transform:translate(2px) scale(1) rotate(1deg)}to{transform:translate(-1px) scale(1.04) rotate(-1deg)}}@keyframes strikerSparkFlash{0%{opacity:0;transform:scale(.88,.92);filter:blur(0)}22%{opacity:1;transform:scale(1.06,1.12);filter:blur(.3px)}to{opacity:0;transform:scale(1);filter:blur(3px)}}@media (max-width: 900px){.panel{padding:1.2rem}.scene{grid-template-columns:1fr;justify-items:center;gap:1rem}.controls-row{flex-direction:column;align-items:stretch}.durations{justify-content:center;flex-wrap:wrap}}