.speedtest-bench[data-style=teapot] .teapot-panel{display:block;margin:24px 0;padding:24px;border:1px solid #bc9b68;border-radius:20px;background:linear-gradient(135deg,#302047,#101e30);--show-card:#211c38;--show-ink:#fff0be;--show-muted:#b9d7d8;color:#fff0be}.speedtest-bench[data-style=teapot] :is(.speedtest-instruments,.bloat-instrument){display:none}.speedtest-bench[data-style=teapot] .bloat-panel{grid-template-columns:1fr}.tea-title{font:700 23px Georgia,serif;letter-spacing:2px;fill:#ffe4a4}.tea-heading{font:700 19px Georgia,serif;letter-spacing:2px;fill:#ffe4a4}.tea-label{font:10px ui-monospace,monospace;letter-spacing:1.3px;fill:#bde8dd}.tea-tiny{font:8px ui-monospace,monospace;fill:#e6e7b5}.tea-alert{font:700 14px ui-monospace,monospace;fill:#f1ff89;filter:drop-shadow(0 0 5px #b8ff48)}.tea-glow{filter:drop-shadow(0 0 5px #71ffdb)}.tea-lid{transition:transform 1s ease;transform:translateY(0)}.teapot-panel[data-overdrive=true] .tea-lid{transform:translateY(-85px)}.tea-galaxy,.tea-orbit-cups,.tea-legs{opacity:0;transition:opacity .7s}.teapot-panel[data-overdrive=true] :is(.tea-galaxy,.tea-orbit-cups),.teapot-panel[data-tea-legs=true] .tea-legs{opacity:1}.teapot-panel[data-overdrive=true] .tea-pot-body{filter:drop-shadow(0 0 15px #ab4df799)}.teapot-panel[data-tea-bell=true] .tea-bell{animation:tea-bell .14s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}.teapot-panel[data-motion=false] .tea-bell{animation-play-state:paused}@keyframes tea-bell{to{rotate:18deg}}@media(max-width:650px){.speedtest-bench[data-style=teapot] .teapot-panel{padding:15px 9px}}@media(prefers-reduced-motion:reduce){.teapot-panel *{animation:none!important;transition:none!important}}

.teapot-panel [data-machine][data-hot=true] .tea-heading{fill:#f3ff96;filter:drop-shadow(0 0 7px #c1ff55)}

.tea-horizon-label{fill:#b2e5ff;font-size:11px;letter-spacing:1px}[data-biscuit-swirl]{filter:drop-shadow(0 0 4px #398ddf)}

.tea-duck-skin{transform-box:fill-box;transform-origin:center}.tea-duck-brow,.tea-duck-feathers>*{opacity:0}
.teapot-panel:is([data-duck-burst=true],[data-duck-preview=true]) .tea-duck-skin{animation:tea-duck-pop 3s linear both}
.teapot-panel:is([data-duck-burst=true],[data-duck-preview=true]) .tea-duck-brow{opacity:1}
.teapot-panel:is([data-duck-burst=true],[data-duck-preview=true]) .tea-duck-feathers ellipse{animation:tea-feather-pop 3s ease-out both}
.teapot-panel:is([data-duck-burst=true],[data-duck-preview=true]) .tea-duck-puff{animation:tea-duck-puff 3s ease-out both;transform-origin:0 0}
.teapot-panel[data-motion=false] :is(.tea-duck-skin,.tea-duck-feathers>*){animation-play-state:paused}
@keyframes tea-duck-pop{0%{transform:scale(1) rotate(0)}5%{transform:scale(1.05) rotate(-9deg)}10%{transform:scale(1.1) rotate(9deg)}16%{transform:scale(1.2) rotate(-7deg);opacity:1}19%,55%{transform:scale(.02);opacity:0}60%{transform:scale(.12);opacity:1}88%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
@keyframes tea-feather-pop{0%,16%{opacity:0;transform:translate(0,0) rotate(0)}19%{opacity:1}65%,100%{opacity:0;transform:translate(var(--feather-x),var(--feather-y)) rotate(var(--feather-turn))}}
@keyframes tea-duck-puff{0%,16%{opacity:0;transform:scale(.3)}19%{opacity:.8}45%,100%{opacity:0;transform:scale(5)}}
@media(prefers-reduced-motion:reduce){.teapot-panel .tea-duck-skin{animation:none!important;opacity:1;transform:none}.teapot-panel .tea-duck-feathers{display:none}}

.tea-duck-demo{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px;padding:8px 14px 12px;background:#101b2b}.tea-duck-demo span{font-size:.7rem;color:#bdd8d4}.tea-duck-demo button,.tea-black-button{min-height:44px;padding:8px 18px;border:1px solid #d7b471;border-radius:10px;background:#293d46;color:#ffe5a2;font-family:inherit;font-size:.85rem;font-weight:700;cursor:pointer}.tea-duck-demo button:disabled{opacity:.5;cursor:default}.tea-duck-demo button:focus-visible,.tea-black-button:focus-visible{outline:3px solid #8de6ff;outline-offset:3px}
.teapot-panel[data-duck-preview=true] :is(.tea-duck-skin,.tea-duck-feathers>*){animation-play-state:running}

.tea-milk,.tea-sugar{opacity:0;pointer-events:none;filter:drop-shadow(0 0 6px #b4eaff)}.tea-ingredient-label{font:bold 10px ui-monospace,monospace;fill:#342443}.tea-milk-stream{animation:tea-milk-flow .7s linear infinite}.tea-sugar-cube{animation:tea-sugar-fall 1.2s linear infinite}.tea-spoon-orbit{opacity:0;transition:opacity .5s;pointer-events:none}.teapot-panel[data-overdrive=true] .tea-spoon-orbit{opacity:1}.tea-spoon-position{transform-origin:550px 330px;animation:tea-spoon-orbit 4s linear infinite}.tea-spoon{transform:translate(755px,330px) rotate(25deg);filter:drop-shadow(0 0 5px #c0e9ff)}
@keyframes tea-milk-flow{to{stroke-dashoffset:-36}}@keyframes tea-sugar-fall{0%{transform:translate(712px,194px) rotate(0);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translate(628px,263px) rotate(-160deg);opacity:0}}@keyframes tea-spoon-orbit{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.teapot-panel[data-tea-milk=true] .tea-milk,.teapot-panel[data-tea-sugar=true] .tea-sugar{opacity:1}.tea-sugar-cube{transform:translate(685px,222px)}.tea-spoon-position{transform:none}}

.teapot-panel[data-black-tea=true] :is(.tea-milk,.tea-sugar,.tea-spoon-orbit){display:none}

.tea-black-button[aria-pressed=true]{background:#49634b;border-color:#adf5a3;color:#fff6b8;box-shadow:0 0 10px #9fea8055}.tea-black-button[aria-pressed=true]::before{content:"✓ ";}
.teapot-panel:not([data-state=running]) .tea-spoon-position,.teapot-panel[data-overdrive=false] .tea-spoon-position{animation-play-state:paused}
