@layer base,components,variants;@layer variants{.candlestick{width:min(100%,clamp(154px,40cqi,214px));max-height:100%;align-self:center;container-type:inline-size;display:grid;justify-content:center;justify-items:center;gap:clamp(.3rem,1.4cqi,.5rem);color:var(--tk-face-text, var(--tk-text));filter:opacity(var(--tk-face-opacity, 1));margin-inline:auto}.candlestick__scene{--candle-base-offset: clamp(8px, 2.6cqi, 12px);--wax-height: max(30px, calc(var(--tk-candle-wax-level, 1) * clamp(98px, 33cqi, 136px)));position:relative;width:clamp(86px,28cqi,114px);height:clamp(162px,51cqi,196px);display:grid;place-items:end center}.candlestick__halo{position:absolute;inset:clamp(9px,2.5cqi,16px) clamp(5px,1.8cqi,8px) auto;height:clamp(122px,43cqi,156px);border-radius:999px;background:radial-gradient(circle at 50% 45%,var(--tk-accent-glow, rgba(255,176,92,.4)) 0%,transparent 72%);filter:blur(14px);opacity:.7;pointer-events:none}.candlestick__body{position:absolute;width:clamp(58px,20cqi,72px);height:max(36px,var(--wax-height));bottom:var(--candle-base-offset);border-radius:14px 14px 10px 10px;background:linear-gradient(100deg,rgba(255,255,255,.34) 0 10%,transparent 26%),linear-gradient(180deg,color-mix(in srgb,var(--tk-accent, #E9D7B7) 96%,#fff 4%),color-mix(in srgb,var(--tk-accent, #E9D7B7) 85%,#000 15%));box-shadow:inset 0 -10px 20px #00000038,0 10px 28px #00000059;transition:height .26s var(--tk-ease);overflow:visible}.candlestick__cap{position:absolute;top:-8px;left:4px;right:4px;height:14px;border-radius:999px;background:linear-gradient(180deg,#ffffffb3,#ffffff2e);box-shadow:inset 0 -4px 8px #0000001f}.candlestick__shine{position:absolute;top:16px;left:10px;width:12px;bottom:14px;border-radius:999px;background:linear-gradient(180deg,#ffffff6b,#ffffff14);opacity:.82}.candlestick__drip{position:absolute;top:6px;width:7px;border-radius:0 0 8px 8px;transform-origin:top center;background:linear-gradient(180deg,color-mix(in srgb,var(--tk-accent, #E9D7B7) 82%,#fff 18%),color-mix(in srgb,var(--tk-accent, #E9D7B7) 86%,#000 14%));box-shadow:inset 0 -4px 6px #0000001f;transition:height .35s ease,opacity .35s ease;animation:tk-candle-dribble calc((2.4s / var(--tk-candle-dribble-speed, 1))) ease-in-out infinite}.candlestick__drip:after{content:"";position:absolute;left:50%;bottom:-3px;width:calc(5px * var(--tk-candle-dribble-amount, 1));height:calc(5px * var(--tk-candle-dribble-amount, 1));border-radius:999px;transform:translate(-50%);background:radial-gradient(circle at 35% 30%,#ffffff73,color-mix(in srgb,var(--tk-accent, #E9D7B7) 88%,#000 12%));box-shadow:0 2px 4px #0003;animation:tk-candle-bead calc((2.2s / var(--tk-candle-dribble-speed, 1))) ease-in-out infinite}.candlestick__drip:nth-child(3n){animation-delay:.25s}.candlestick__drip:nth-child(2n):after{animation-delay:.35s}.candlestick__wick{position:absolute;width:clamp(2px,.9cqi,3px);height:clamp(14px,6cqi,20px);bottom:calc(var(--candle-base-offset) + var(--wax-height) - clamp(6px,2cqi,8px));border-radius:999px;background:linear-gradient(180deg,#2b1d1a,#0f0a08);box-shadow:0 0 6px #00000073;transition:bottom .26s var(--tk-ease);z-index:3}.candlestick__flame-wrap{position:absolute;bottom:calc(var(--candle-base-offset) + var(--wax-height) + clamp(1px,.5cqi,2px));width:clamp(26px,11cqi,36px);height:clamp(54px,24cqi,70px);display:grid;place-items:center;transform:translate(calc(var(--tk-candle-jitter, 0) * 2px));transition:bottom .26s var(--tk-ease),transform 90ms linear;z-index:4}.candlestick__flame{position:absolute;border-radius:70% 70% 56% 56%/82% 82% 38% 38%;transform-origin:50% 95%;filter:drop-shadow(0 0 14px color-mix(in srgb,var(--tk-accent-glow, rgba(255,176,92,.4)) 85%,#ff9a3c 15%));animation:tk-candle-flicker calc(.82s + (1.1 - var(--tk-candle-flicker, .8)) * .3s) ease-in-out infinite}.candlestick__flame--outer{width:calc(clamp(24px,10cqi,34px) * var(--tk-candle-flame-scale, 1));height:calc(clamp(44px,21cqi,62px) * var(--tk-candle-flame-scale, 1));background:radial-gradient(ellipse at 50% 68%,rgba(255,130,30,.45),rgba(255,84,24,.18) 48%,transparent 74%);opacity:.95}.candlestick__flame--mid{width:calc(clamp(16px,7cqi,24px) * var(--tk-candle-flame-scale, 1));height:calc(clamp(30px,16cqi,46px) * var(--tk-candle-flame-scale, 1));background:radial-gradient(ellipse at 50% 72%,#ffbe50,#ff8d2a 62%,#ff8d2a26);animation-duration:calc(.65s + (1.2 - var(--tk-candle-flicker, .8)) * .25s)}.candlestick__flame--core{width:calc(clamp(8px,3.8cqi,11px) * var(--tk-candle-flame-scale, 1));height:calc(clamp(14px,8cqi,21px) * var(--tk-candle-flame-scale, 1));background:radial-gradient(ellipse at 50% 78%,#fff6bf,#ffe484 70%,#ffe48433);animation-duration:calc(.48s + (1.2 - var(--tk-candle-flicker, .8)) * .22s)}.candlestick__smoke{position:absolute;bottom:calc(var(--candle-base-offset) + var(--wax-height) + clamp(4px,1.7cqi,6px));width:clamp(30px,11cqi,38px);height:clamp(54px,24cqi,68px);pointer-events:none;z-index:2}.candlestick__smoke span{position:absolute;bottom:0;left:50%;width:16px;height:46px;border-radius:999px;background:linear-gradient(180deg,#cad2dc47,#cad2dc00);transform:translate(-50%);animation:tk-candle-smoke 1.8s ease-out infinite}.candlestick__smoke span:nth-child(2){animation-delay:.35s;left:36%}.candlestick__smoke span:nth-child(3){animation-delay:.7s;left:64%}.candlestick__time{font-family:var(--tk-font-mono);font-size:clamp(1.2rem,5.1vw,2.1rem);font-weight:500;letter-spacing:.08em;text-shadow:0 0 14px color-mix(in srgb,var(--tk-accent-glow, rgba(255,176,92,.35)) 72%,transparent 28%),0 0 2px rgba(0,0,0,.5)}.candlestick--paused .candlestick__flame{animation-play-state:paused;opacity:.8}.candlestick--complete .candlestick__flame-wrap,.candlestick--complete .candlestick__halo{opacity:0}.candlestick[data-tone=amber] .candlestick__body{background:linear-gradient(100deg,rgba(255,255,255,.2) 0 10%,transparent 26%),linear-gradient(180deg,#c79042,#8d5d2b)}.candlestick[data-tone=crimson] .candlestick__body{background:linear-gradient(100deg,rgba(255,255,255,.2) 0 10%,transparent 26%),linear-gradient(180deg,#8e2a3a,#5a1824)}.candlestick[data-tone=midnight] .candlestick__body{background:linear-gradient(100deg,rgba(255,255,255,.14) 0 10%,transparent 26%),linear-gradient(180deg,#3e445c,#23283a)}.timer-shell--stopwatch .candlestick{width:min(100%,clamp(136px,34cqi,186px));gap:clamp(.25rem,1cqi,.4rem)}.timer-shell--stopwatch .candlestick__scene{height:clamp(144px,47cqi,182px)}.timer-shell--stopwatch .candlestick__time{font-size:clamp(1.05rem,4.2vw,1.8rem)}[data-fullscreen] .candlestick{width:min(24vw,320px);gap:1rem}[data-fullscreen] .candlestick__scene{width:min(17vw,206px);height:min(29vh,280px)}[data-fullscreen] .candlestick__body{width:min(9vw,94px);height:max(34px,calc(var(--tk-candle-wax-level, 1) * min(18vh,170px)))}[data-fullscreen] .candlestick__wick{bottom:calc(var(--candle-base-offset) + max(34px,calc(var(--tk-candle-wax-level, 1) * min(18vh,170px))) - 8px)}[data-fullscreen] .candlestick__flame-wrap{bottom:calc(var(--candle-base-offset) + max(34px,calc(var(--tk-candle-wax-level, 1) * min(18vh,170px))) + 2px)}[data-fullscreen] .timer-shell--stopwatch .candlestick{width:min(22vw,270px)}[data-fullscreen] .timer-shell--stopwatch .candlestick__scene{height:min(25vh,236px)}@container (max-width: 360px){.candlestick__scene{height:clamp(146px,51cqi,174px)}.candlestick__drip{width:clamp(5px,2.2cqi,7px)}}@keyframes tk-candle-flicker{0%{transform:scaleY(1) scaleX(1) rotate(-1.2deg);opacity:.9}20%{transform:scaleY(1.05) scaleX(.96) rotate(1.6deg);opacity:.98}45%{transform:scaleY(.94) scaleX(1.05) rotate(-2.2deg);opacity:.84}70%{transform:scaleY(1.06) scaleX(.95) rotate(1.8deg);opacity:.98}to{transform:scaleY(1) scaleX(1) rotate(-1deg);opacity:.9}}@keyframes tk-candle-smoke{0%{transform:translate(-50%) scale(.75);opacity:0}25%{opacity:.42}75%{opacity:.1}to{transform:translate(-20%,-62px) scale(1.16);opacity:0}}@keyframes tk-candle-dribble{0%,to{transform:scaleY(.96)}45%{transform:scaleY(calc(1 + .07 * var(--tk-candle-dribble-amount, 1)))}70%{transform:scaleY(.98)}}@keyframes tk-candle-bead{0%,18%,to{transform:translate(-50%) translateY(0) scale(.76);opacity:.38}42%{transform:translate(-50%) translateY(calc(3px * var(--tk-candle-dribble-amount, 1))) scale(1);opacity:.84}70%{transform:translate(-50%) translateY(calc(8px * var(--tk-candle-dribble-amount, 1))) scale(.82);opacity:.28}}}
