/* Adventsljusstake (js/widgets/advent.js). Sizes inside the stage are in cqw so the candlestick scales with the widget. */
.advw{position:absolute;inset:0;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 75%,#2a2236,#141120 72%);color:#ffe9c2}
.advw-lbl{flex:0 0 auto;text-align:center;font:700 clamp(.9rem,3.4cqmin,1.6rem)/1.2 "Poppins",sans-serif;letter-spacing:.03em;padding:.7em .5em 0;text-shadow:0 .1em .6em rgba(0,0,0,.5);min-height:2.2em}
.advw-fit{flex:1;min-height:0;display:flex;align-items:flex-end;justify-content:center;padding:0 4% 4%;container-type:size}
.advw-stage{position:relative;aspect-ratio:100/62;container-type:inline-size;user-select:none}
.advw img{display:block;-webkit-user-drag:none}
.advw-room{position:absolute;inset:-10% -6% -4%;pointer-events:none;opacity:0;transition:opacity 1.2s;background:radial-gradient(ellipse 60% 55% at 50% 62%,rgba(255,176,82,.26),rgba(255,150,60,.08) 55%,transparent 75%)}
.advw-holder{position:absolute;left:0;bottom:0;width:100%;z-index:1;filter:drop-shadow(0 1.2cqw 1.4cqw rgba(0,0,0,.5))}
.advw-warm{position:absolute;left:0;bottom:0;width:100%;height:26.125cqw;z-index:2;pointer-events:none}
.advw-c{position:absolute;bottom:24.25cqw;width:6.1cqw;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column}
.advw-c img{width:100%;height:3.945cqw}
.advw-body{width:100%;background:url(../assets/advent/candle-body.webp) 0 0/100% 100% no-repeat}
.advw-stage.is-ready .advw-body{transition:height 1.2s ease}
.advw-c::after{content:'';position:absolute;left:0;right:0;top:0;height:6cqw;border-radius:50%;pointer-events:none;opacity:0;transition:opacity .8s;background:radial-gradient(ellipse 50% 45% at 50% 18%,rgba(255,214,140,.55),rgba(255,190,110,.18) 60%,transparent 80%)}
.advw-c.is-lit::after{opacity:1}
.advw-f{position:absolute;left:50.4%;top:.62cqw;width:1.25cqw;height:3.6cqw;transform:translate(-50%,-100%) scale(0);transform-origin:50% 100%;pointer-events:none;transition:transform .9s cubic-bezier(.2,1.4,.4,1)}
.is-lit .advw-f{transform:translate(-50%,-100%) scale(1)}
.advw-f i{position:absolute;inset:0;transform-origin:50% 92%;animation:advw-flick 1.6s ease-in-out infinite;animation-delay:var(--dl,0s)}
.advw-f i::before{content:'';position:absolute;inset:0;border-radius:50% 50% 50% 50%/64% 64% 36% 36%;background:radial-gradient(ellipse 60% 70% at 50% 78%,#fff 0%,#fffbe6 16%,#ffe07a 34%,#ffad2e 58%,rgba(255,120,20,.55) 78%,rgba(255,100,20,0) 100%);box-shadow:0 0 .9cqw .25cqw rgba(255,170,60,.55),0 0 2.6cqw 1cqw rgba(255,150,50,.22)}
.advw-f i::after{content:'';position:absolute;left:28%;right:28%;bottom:2%;height:24%;border-radius:50%;background:radial-gradient(ellipse at 50% 70%,rgba(110,150,255,.75),rgba(90,120,255,0) 75%)}
.advw-halo{position:absolute;left:50%;top:-1.6cqw;width:18cqw;height:18cqw;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;opacity:0;transition:opacity 1s;background:radial-gradient(circle,rgba(255,200,110,.32),rgba(255,170,70,.12) 35%,transparent 68%)}
.is-lit .advw-halo{opacity:1;animation:advw-glow 2.4s ease-in-out infinite;animation-delay:var(--dl,0s)}
.advw-c.is-due,.advw-c.is-tap{cursor:pointer}
.advw-smoke{position:absolute;left:50.4%;top:-.4cqw;width:0;height:0;pointer-events:none;z-index:4}
.advw-smoke i{position:absolute;left:-.5cqw;bottom:0;width:1cqw;height:1cqw;border-radius:50%;background:radial-gradient(circle,rgba(230,225,235,.55),rgba(230,225,235,0) 70%);animation:advw-smoke 2.4s ease-out forwards}
.advw-smoke i:nth-child(2){animation-delay:.25s}.advw-smoke i:nth-child(3){animation-delay:.5s}
@keyframes advw-smoke{0%{opacity:0;transform:translate(0,0) scale(.6)}15%{opacity:1}60%{transform:translate(.9cqw,-6cqw) scale(2.2)}100%{opacity:0;transform:translate(-.6cqw,-11cqw) scale(3.4)}}
.advw-c.is-due .advw-wick{position:absolute;left:50.4%;top:.3cqw;width:2.4cqw;height:2.4cqw;transform:translate(-50%,-50%);border-radius:50%;box-shadow:0 0 0 .2cqw rgba(255,230,160,.75);animation:advw-hint 1.6s ease-in-out infinite}
.advw-match{position:absolute;width:12cqw;z-index:5;pointer-events:none;opacity:0}
.advw-match img{width:100%}
.advw-match b{position:absolute;left:70.6%;top:7.2%;width:1.3cqw;height:3cqw;transform:translate(-50%,-92%);opacity:0}
.advw-match b::before{content:'';position:absolute;inset:0;border-radius:50% 50% 50% 50%/64% 64% 36% 36%;background:radial-gradient(ellipse 60% 70% at 50% 78%,#fff 0%,#ffe07a 30%,#ff9a20 62%,rgba(255,100,20,0) 100%);box-shadow:0 0 1.2cqw .3cqw rgba(255,160,60,.5);animation:advw-flick 1s ease-in-out infinite}
.advw-set{position:absolute;right:.6rem;top:.6rem;z-index:10;width:min(17rem,calc(100% - 1.2rem));max-height:calc(100% - 1.2rem);overflow:auto;background:#fffaf2;color:#3a2414;border-radius:1rem;padding:.8rem;box-shadow:0 .6rem 1.6rem rgba(0,0,0,.4);display:flex;flex-direction:column;gap:.45rem}
.advw-set[hidden]{display:none}
.advw-set-h{font:700 .78rem "Poppins",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#9a5a2a;margin:.1rem .2rem .2rem}
.advw-opt{display:flex;gap:.6rem;align-items:flex-start;text-align:left;border:1px solid #ead9bf;background:#fff;border-radius:.8rem;padding:.55rem .65rem;cursor:pointer;font:500 .85rem "Poppins",sans-serif;color:inherit}
.advw-opt b{display:block;font-weight:700}
.advw-opt small{display:block;opacity:.7;font-size:.75rem;line-height:1.3}
.advw-opt.is-on{border-color:#d4762c;background:#fff1e0;box-shadow:inset 0 0 0 1px #d4762c}
.advw-opt .material-icons-outlined{color:#d4762c;font-size:1.2rem;margin-top:.1rem}
.advw-out{border:0;background:none;color:#9a5a2a;font:600 .8rem "Poppins",sans-serif;cursor:pointer;text-decoration:underline;align-self:flex-start;padding:.1rem .2rem}
.advw-done{border:0;border-radius:999px;background:#d4762c;color:#fff;font:700 .85rem "Poppins",sans-serif;padding:.5rem;cursor:pointer;margin-top:.2rem}
@keyframes advw-flick{0%,100%{transform:scale(1,1) rotate(-1deg)}22%{transform:scale(.95,1.05) rotate(1.6deg)}48%{transform:scale(1.04,.96) rotate(-.6deg)}70%{transform:scale(.97,1.07) rotate(1deg)}86%{transform:scale(1.02,.98) rotate(-1.4deg)}}
@keyframes advw-glow{0%,100%{opacity:.92}40%{opacity:.78}60%{opacity:1}}
@keyframes advw-hint{0%,100%{opacity:.25;transform:translate(-50%,-50%) scale(.85)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}
.advw-c.is-tap.is-lit:hover .advw-f{filter:brightness(1.15)}
@media (prefers-reduced-motion:reduce){.advw-f i,.is-lit .advw-halo,.advw-match b::before,.advw-c.is-due .advw-wick{animation:none}}
