/* Raster illustration layers follow the timer's actual progress. */
.steep-timer.steep-theatre{grid-template-columns:minmax(0,1.55fr) minmax(280px,.85fr);gap:30px;padding:29px 0 0;align-items:stretch}.pour-stage{--pot-angle:0deg;--liquid-cut:100%;--liquid-level:0;--stream-opacity:0;--stream-height:54.5%;color:#49362d;background:#e8d9bd;border:1px solid #bdab8b;position:relative;overflow:hidden;align-self:start}.pour-folio,.pour-caption{display:flex;justify-content:space-between;gap:16px;padding:14px 21px;font:400 .75rem/1.4 var(--mono);position:relative;z-index:5}.pour-folio{border-bottom:1px solid #cabb9c}.pour-folio>span:last-child{color:var(--red);white-space:nowrap}.pour-caption{padding-top:11px;border-top:1px solid #cabb9c;color:#615540}.pour-caption>span:last-child{white-space:nowrap;color:#89765b}.pour-artboard{position:relative;aspect-ratio:1.86;isolation:isolate;overflow:hidden}.pour-artboard img{pointer-events:none;user-select:none;-webkit-user-drag:none}.pour-pot{position:absolute;left:12%;top:21%;width:48%;height:auto;padding:0;border:0;background:transparent;transform-origin:98.4% 23.6%;transform:rotate(var(--pot-angle));z-index:4;cursor:pointer;transition:transform .6s cubic-bezier(.2,.8,.2,1)}.pour-pot img{width:100%;height:auto;filter:drop-shadow(0 8px 4px #59412417)}.pour-stage[data-phase=running] .pour-pot,.pour-stage[data-phase=paused] .pour-pot{transition:none}.pour-pot:focus-visible{outline:2px dashed #2d436c;outline-offset:9px;border-radius:12px}.pour-stage[data-phase=idle] .pour-pot:hover img{filter:drop-shadow(0 9px 4px #5941242a) brightness(1.05)}.pour-stream{position:absolute;left:58.68%;top:37.4%;width:2.4%;height:var(--stream-height);z-index:2;opacity:var(--stream-opacity);transform-origin:top center;overflow:hidden;mask-image:linear-gradient(to bottom,#000 0%,#000 94%,transparent 100%)}.pour-stream img{height:104%;width:100%;max-width:none;object-fit:fill;animation:tea-stream-flow .4s linear infinite;animation-play-state:paused;filter:saturate(.8)}.pour-stage[data-phase=running] .pour-stream img{animation-play-state:running}.pour-cup{position:absolute;left:44.3%;top:55.5%;width:32%;aspect-ratio:497/347;z-index:3}.pour-glass{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:3}.pour-liquid-window{position:absolute;left:4.8%;top:7.5%;width:90.5%;height:82.7%;clip-path:inset(var(--liquid-cut) 0 0 0);overflow:hidden;z-index:1}.pour-liquid{opacity:.9;width:100%;height:100%;object-fit:fill;transform-origin:50% 80%;animation:tea-surface-sway 1.9s ease-in-out infinite;animation-play-state:paused}.pour-stage[data-phase=running] .pour-liquid{animation-play-state:running}.pour-stage[data-phase=done] .pour-liquid{animation:tea-settle .9s ease-out 1 both}.pour-measure{position:absolute;left:6%;bottom:14%;display:flex;flex-direction:column;color:#9b472b;transform:rotate(-5deg)}.pour-measure>span{font:400 clamp(2.2rem,3.5vw,3.7rem)/.9 var(--serif);font-variant-numeric:tabular-nums}.pour-measure small{margin-top:8px;font:italic 1.05rem/1.2 var(--serif);color:#72593c}.pour-steam{position:absolute;left:54%;top:35%;width:24%;height:30%;z-index:4;pointer-events:none;opacity:0;transition:opacity .6s}.pour-stage[data-phase=done] .pour-steam{opacity:.55}.pour-steam img{position:absolute;width:17%;height:88%;object-fit:fill;filter:grayscale(1) brightness(4) blur(4px);transform-origin:center bottom;mask-image:linear-gradient(transparent,#000 40%,#000 85%,transparent);animation:tea-steam-rise 3.2s ease-in-out infinite;animation-play-state:paused}.pour-steam img:first-child{left:22%;animation-delay:-1.6s}.pour-steam img:last-child{left:57%;height:77%;animation-delay:-.3s}.pour-stage[data-phase=done] .pour-steam img{animation-play-state:running}.timer-console{position:relative;display:flex;flex-direction:column;justify-content:center;padding:4px 0 14px;min-width:0}.steep-theatre .timer-intro .eyebrow{font-size:.75rem;line-height:1.5;margin-bottom:7px}.steep-theatre .timer-intro h3{font-size:2.4rem;line-height:1.03;margin-bottom:12px}.steep-theatre .timer-intro>p:last-child{font-size:.875rem;line-height:1.6}.steep-theatre .timer-dial{display:flex;flex-direction:row;align-items:center;gap:15px;margin:18px 0 16px;flex-wrap:wrap}.steep-theatre .timer-dial>output{font-size:4.9rem;line-height:.95}.steep-theatre .duration-picker{gap:7px}.steep-theatre .duration-picker>button{width:40px;height:44px}.steep-theatre .timer-actions{grid-template-columns:minmax(0,1fr) auto;gap:10px 18px}.steep-theatre .timer-actions .solid-link{font-size:.875rem;min-height:48px}.steep-theatre .timer-actions p{font-size:.875rem;min-height:23px;line-height:1.6}.steep-theatre .timer-count{font-size:.75rem}.timer-brewing-note{margin-top:12px;font-size:.75rem;line-height:1.5;color:#cdb89d}.steep-theatre .timer-progress{height:2px;bottom:0}.pour-artboard:has(.pour-pot:focus-visible){overflow:visible}
@keyframes tea-stream-flow{0%{transform:translateY(-3%) scaleX(.9)}50%{transform:translateY(-1%) scaleX(1.07)}100%{transform:translateY(0) scaleX(.9)}}
@keyframes tea-surface-sway{0%,100%{transform:scaleX(.995) rotate(-.25deg)}50%{transform:scaleX(1.015) rotate(.25deg)}}
@keyframes tea-settle{0%{transform:rotate(.7deg)}40%{transform:rotate(-.5deg)}70%{transform:rotate(.2deg)}100%{transform:rotate(0)}}
@keyframes tea-steam-rise{0%{opacity:0;transform:translateY(15%) scaleX(.8) rotate(-6deg)}30%{opacity:.7}75%{opacity:.3}100%{opacity:0;transform:translateY(-35%) scaleX(1.8) rotate(8deg)}}
@media(max-width:1150px){.steep-timer.steep-theatre{grid-template-columns:minmax(0,1.4fr) minmax(270px,.9fr);gap:26px}.pour-artboard{aspect-ratio:1.86}.pour-folio,.pour-caption{padding-inline:15px;font-size:.75rem}.pour-caption>span:last-child{display:none}.steep-theatre .timer-dial>output{font-size:4.2rem}.steep-theatre .timer-dial{gap:13px}.steep-theatre .duration-picker>button{width:35px}.steep-theatre .timer-intro h3{font-size:2.15rem}}
@media(max-width:850px){.steep-timer.steep-theatre{grid-template-columns:1fr;gap:22px}.pour-stage{max-width:670px;width:100%;justify-self:center}.pour-artboard{aspect-ratio:1.86}.timer-console{display:grid;grid-template-columns:1fr 1fr;gap:0 26px;padding-bottom:20px}.steep-theatre .timer-intro{grid-column:1;grid-row:1/3}.steep-theatre .timer-dial{grid-column:2;grid-row:1;margin:0 0 16px}.steep-theatre .timer-actions{grid-column:2;grid-row:2/4}.timer-brewing-note{grid-column:1;grid-row:3;align-self:end;margin-top:9px}.steep-theatre .timer-intro h3{font-size:2.4rem}.steep-theatre .timer-dial>output{font-size:4.5rem}.pour-measure>span{font-size:3.7rem}.steep-theatre .timer-intro>p:last-child br{display:none}}
@media(max-width:560px){.steep-timer.steep-theatre{gap:23px;padding-top:25px}.pour-folio,.pour-caption{padding:11px 12px;font-size:.75rem;gap:8px}.pour-folio>span:first-child{font-size:.75rem;letter-spacing:0}.pour-caption{font-size:.75rem}.pour-artboard{aspect-ratio:1.86}.pour-measure{left:6%;bottom:17%}.pour-measure>span{font-size:2.55rem}.pour-measure small{font-size:.875rem;margin-top:5px}.timer-console{display:block;padding-bottom:23px}.steep-theatre .timer-intro .eyebrow{font-size:.75rem}.steep-theatre .timer-intro h3{font-size:2.5rem}.steep-theatre .timer-intro>p:last-child{font-size:.9375rem}.steep-theatre .timer-dial{margin:22px 0 19px;justify-content:space-between;gap:16px}.steep-theatre .timer-dial>output{font-size:5.2rem}.steep-theatre .duration-picker{gap:10px}.steep-theatre .duration-picker>button{width:44px;height:44px}.steep-theatre .timer-actions{gap:12px 21px}.steep-theatre .timer-actions .solid-link{font-size:.9375rem}.steep-theatre .timer-actions p{font-size:.875rem}.timer-brewing-note{font-size:.75rem;margin-top:14px}}
@media(prefers-reduced-motion:reduce){.pour-artboard *{animation:none!important;transition:none!important}.pour-stream{opacity:0!important}.pour-steam{display:none}.pour-pot{transform:none!important}.pour-liquid-window{transition:none}.pour-stage[data-phase=running] .pour-liquid{transform:none}}
.pour-caption{font-size:.875rem}.steep-theatre .duration-picker>span{font-size:.875rem}