.roast{--roast:#ff9457;--roast-hot:#ff5d5d;--roast-bg:#0c0807;--roast-card:#1a110ddb;isolation:isolate;background:radial-gradient(70% 40% at 12% 0%, #ff94572b, transparent 70%), radial-gradient(55% 35% at 100% 18%, #ff5d5d17, transparent 70%), var(--roast-bg);position:relative;overflow:hidden}main:has(>.roast){flex-direction:column;display:flex}main>.roast{flex:1}.roast:before{content:"";z-index:-1;pointer-events:none;background-image:radial-gradient(#ff945742 1px,#0000 1.5px);background-size:28px 28px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 55%);mask-image:linear-gradient(#000,#0000 55%)}.roast :focus-visible{outline-color:var(--roast)}.roast-title{color:var(--roast);text-shadow:3px 3px #8f2f1f,0 0 42px #ff945747}.roast-box{background:var(--roast-card);border:1px solid #ff945757;box-shadow:0 0 0 1px #ff94570f,0 18px 50px -24px #ff5d5d73}.roast-box input::placeholder{color:#ffbe968c}.roast-btn{color:#1a0c06;background:linear-gradient(#ffa56f,#ff7e45);transition:filter .15s,opacity .15s}.roast-btn:hover:not(:disabled){filter:brightness(1.08)}.roast-btn:disabled{opacity:.6}.roast-card{background:var(--roast-card);border:1px solid #ff945742}.roast-label{font-family:var(--font-mono);color:#c08a6c;font-size:.75rem}.roast-verdict{color:var(--hi);text-shadow:0 0 34px #ff945759}.roast-meter{background:#ff945724;border-radius:999px;height:.625rem;overflow:hidden}.roast-meter>span{border-radius:inherit;background:linear-gradient(90deg, var(--roast), var(--roast-hot));transform-origin:0;height:100%;animation:.9s cubic-bezier(.2,.8,.2,1) both roast-fill;display:block}@keyframes roast-fill{0%{transform:scaleX(0)}}.roast-line{animation:.42s cubic-bezier(.2,.8,.2,1) both roast-in;animation-delay:calc(var(--i) * .55s + .25s)}@keyframes roast-in{0%{opacity:0;transform:translateY(8px)}}.roast-face{flex-shrink:0;place-items:end center;width:3.5rem;height:3rem;display:grid}.roast-chip{font-family:var(--font-mono);color:var(--roast);border:1px solid #ff945773;border-radius:.5rem;padding:.5rem .875rem;font-size:.8125rem;transition:background-color .15s,border-color .15s}.roast-chip:hover{border-color:var(--roast);background:#ff94571a}.roast-progress{background:#ff94572e;height:2px;position:relative;overflow:hidden}.roast-progress:after{content:"";background:var(--roast);box-shadow:0 0 10px var(--roast);animation:1.1s ease-in-out infinite roast-progress;position:absolute;inset:0 60% 0 0}@keyframes roast-progress{0%{transform:translate(-100%)}to{transform:translate(260%)}}.roast-stat{border-top:1px solid #ff945724}@media (prefers-reduced-motion:reduce){.roast-meter>span,.roast-line{animation:none}.roast-progress:after{opacity:.6;animation:none;inset:0}}