:root{color:#241a16;background:#fff7db;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;line-height:1.5;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button{font:inherit}.app{position:relative;min-height:100vh;overflow:hidden;background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.95),transparent 24rem),linear-gradient(135deg,#ffe39a,#ffb36e 42%,#67c6bf);transition:background .7s ease,color .7s ease}.app:after{position:absolute;inset:0;z-index:1;pointer-events:none;content:"";background:#080a1400;transition:background .9s ease}.app--blackout{color:#fff7db;background:radial-gradient(circle at 50% 25%,rgba(255,255,255,.08),transparent 18rem),linear-gradient(135deg,#111827,#080b13)}.app--blackout:after{background:#01030a7a}.app__background{position:absolute;inset:0;z-index:0;opacity:.4;background-image:linear-gradient(rgba(255,255,255,.38) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.38) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 78%);mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 78%)}.app__content{position:relative;z-index:2;isolation:isolate;display:flex;width:min(100%,780px);min-height:100vh;min-height:100svh;margin:0 auto;padding:clamp(1.25rem,3vw,2.5rem);flex-direction:column;align-items:center;justify-content:center;gap:clamp(.9rem,2.4vw,1.35rem);text-align:center}.app__header{display:grid;gap:0}h1{margin:0;color:#27180f;font-size:clamp(2.5rem,8vw,5.6rem);line-height:.92;letter-spacing:0;text-shadow:0 5px 0 rgba(255,255,255,.4)}.app--blackout h1{color:#fff7db;text-shadow:0 5px 0 rgba(0,0,0,.5)}.counter{position:relative;z-index:4;display:inline-flex;grid-area:counter;align-self:center;justify-self:start;min-height:4rem;padding:.75rem 1.15rem;align-items:center;justify-content:center;gap:.7rem;border:3px solid rgba(39,24,15,.14);border-radius:.5rem;background:#ffffffb8;box-shadow:0 16px 30px #49271229;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.app--blackout .counter{border-color:#fff7db29;background:#ffffff14;box-shadow:0 18px 38px #00000047}.counter__mug{display:inline-block;font-size:clamp(1.8rem,5vw,2.6rem);animation:mug-bounce .42s cubic-bezier(.2,.9,.35,1.45)}.counter__number{font-size:clamp(2rem,5vw,3rem);font-weight:950;line-height:1}.counter__label{font-size:clamp(1rem,2.5vw,1.2rem);font-weight:850}.app__ted-layout{position:relative;z-index:3;display:grid;width:min(100%,40rem);grid-template-columns:minmax(0,380px) auto;grid-template-areas:"ted counter";align-items:center;justify-content:center;column-gap:clamp(.75rem,3vw,1.5rem)}.ted-avatar{position:relative;z-index:1;display:grid;grid-area:ted;width:min(78vw,380px);height:clamp(250px,48vh,430px);margin:0;place-items:center;transform-origin:50% 82%;transition:filter .45s ease,transform .45s ease}.ted-avatar:before{position:absolute;bottom:2.8%;left:50%;width:76%;height:13%;border-radius:999px;content:"";background:#301e1229;filter:blur(3px);transform:translate(-50%);transition:background .6s ease,transform .6s ease}.ted-avatar--blackout:before{background:#00000057;transform:translate(-50%) scaleX(1.1)}.ted-avatar--wobbly{animation:ted-image-wobble 1.25s ease-in-out infinite}.ted-avatar--blackout{filter:saturate(.45) brightness(.82);transform:rotate(2deg) translateY(4px)}.ted-avatar__stage{position:relative;z-index:1;display:grid;width:100%;height:100%;place-items:center;animation:ted-state-pop .42s cubic-bezier(.2,.9,.35,1.45)}.ted-avatar__image{display:block;width:min(100%,380px);height:100%;max-height:100%;object-fit:contain;object-position:center bottom;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 22px 22px rgba(64,31,12,.22));animation:ted-image-fade .26s ease both;transition:filter .45s ease,transform .45s ease}.ted-avatar--blackout .ted-avatar__image{filter:drop-shadow(0 26px 28px rgba(0,0,0,.36))}.ted-avatar__preload{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}.ted-avatar__preload img{position:absolute;width:1px;height:1px}.status{position:relative;z-index:3;display:flex;width:min(100%,30rem);min-height:clamp(6.2rem,12vh,7.4rem);margin-top:clamp(2.75rem,7vh,4.5rem);flex-direction:column;align-items:center;justify-content:flex-end;gap:.6rem;overflow-wrap:anywhere}.status__headline,.status__subtext,.status__warning{margin:0}.status__headline{font-size:clamp(1.22rem,3.5vw,1.8rem);font-weight:950;line-height:1.16;max-width:100%}.status__subtext{color:#fff7dbd1;font-size:clamp(1rem,2.5vw,1.25rem);font-weight:750}.status__warning{display:inline-flex;width:100%;max-width:100%;min-height:2.45rem;padding:.4rem .8rem;align-items:center;justify-content:center;border:3px solid #2a1c16;border-radius:.45rem;color:#2a1c16;background:#fff071;box-shadow:0 5px #2a1c16;font-size:clamp(1rem,3vw,1.3rem);font-weight:1000;line-height:1.12;text-align:center;transform:rotate(-1.5deg)}.controls{position:relative;z-index:3;display:flex;width:min(100%,30rem);margin-top:0;gap:.75rem;justify-content:center}.button{min-height:3.25rem;padding:.75rem 1.1rem;border:3px solid #2a1c16;border-radius:.5rem;cursor:pointer;font-weight:950;line-height:1.05;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease,background .16s ease}.button:hover:not(:disabled){transform:translateY(-2px)}.button:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px #2a1c16}.button:focus-visible{outline:4px solid rgba(35,85,106,.42);outline-offset:3px}.button:disabled{cursor:not-allowed;opacity:.5}.button--primary{flex:1.35;color:#241a16;background:#fff071;box-shadow:0 7px #2a1c16}.button--secondary{flex:.9;color:#241a16;background:#fff;box-shadow:0 7px #2a1c16}.app--blackout .button{border-color:#fff7db;box-shadow:0 7px #fff7db59}.app--blackout .button--secondary{color:#080b13}@keyframes ted-image-fade{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes ted-state-pop{0%{transform:translateY(0) rotate(0)}36%{transform:translateY(-12px) rotate(-2deg)}68%{transform:translateY(3px) rotate(1deg)}to{transform:translateY(0) rotate(0)}}@keyframes ted-image-wobble{0%,to{transform:rotate(-2.4deg) translate(-2px)}50%{transform:rotate(2.8deg) translate(2px)}}@keyframes mug-bounce{0%{transform:translateY(0) rotate(0)}35%{transform:translateY(-14%) rotate(-9deg)}65%{transform:translateY(4%) rotate(7deg)}to{transform:translateY(0) rotate(0)}}@media(max-width:560px){.app__content{justify-content:start;padding-top:1rem}.ted-avatar{width:min(62vw,300px);height:clamp(220px,64vw,340px)}.ted-avatar__image{max-height:100%}.app__ted-layout{width:100%;grid-template-columns:minmax(0,1fr) auto;column-gap:.45rem}.counter{min-height:3.35rem;padding:.55rem .7rem;gap:.45rem}.counter__mug{font-size:clamp(1.5rem,8vw,2rem)}.counter__number{font-size:clamp(1.65rem,8vw,2.25rem)}.counter__label{display:block;font-size:.9rem;line-height:1}.status{min-height:6.4rem;margin-top:2.25rem;gap:.55rem}.controls{margin-top:0;flex-direction:column}.button{width:100%}}@media(max-height:820px)and (min-width:561px){.app__content{justify-content:start;gap:.8rem}.ted-avatar{height:clamp(230px,40vh,340px)}.status{min-height:5.8rem;gap:.45rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}