.functional-protocol{display:grid;grid-template-columns:minmax(150px,1fr) auto auto auto;align-items:center;gap:12px;margin:13px 0;padding:12px 14px;border:1px solid #3f7550;border-radius:12px;background:linear-gradient(135deg,#17261c,#0b1510);box-shadow:inset 4px 0 0 var(--green)}
.functional-protocol[hidden]{display:none}.functional-protocol small,.functional-protocol span{display:block;color:var(--muted);font-size:8px;letter-spacing:1px}.functional-protocol strong{display:block;margin:3px 0;color:var(--green);font-size:17px}.functional-clock{font-size:28px;font-variant-numeric:tabular-nums}.functional-controls{display:flex;gap:6px}
.functional-progress{min-width:112px;padding:8px 11px;border:1px solid #294734;border-radius:10px;text-align:center}.functional-progress[hidden]{display:none}.functional-progress strong{font-size:24px}.functional-progress>div{display:flex;justify-content:center;gap:5px}.functional-progress .mini{border:1px solid #3f7550;border-radius:7px;background:#0c1811;color:#edf7ef;padding:4px 8px;font-weight:800}.functional-progress .mini.primary{background:var(--green);color:#061009}
@media(max-width:760px){.functional-protocol{grid-template-columns:1fr auto}.functional-progress{grid-column:1/2;grid-row:2}.functional-controls{grid-column:1/-1}.functional-controls .btn{flex:1}.functional-clock{font-size:23px}}
.functional-celebration{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:#031009db;backdrop-filter:blur(8px);overflow:hidden}.functional-celebration section{position:relative;z-index:2;width:min(480px,88vw);padding:42px;text-align:center;border:1px solid #55db75;border-radius:24px;background:linear-gradient(145deg,#16291d,#07110b);box-shadow:0 0 60px #62ed8555}.functional-celebration small{color:var(--green);letter-spacing:3px}.functional-celebration h2{margin:12px 0 8px;font-size:clamp(34px,7vw,68px);line-height:.95}.functional-celebration p{color:#b7c8bb;font-size:18px}.functional-celebration .confetti i{position:absolute;top:-10%;left:calc(var(--i) * 3.57%);width:8px;height:18px;background:hsl(calc(var(--i) * 47),85%,62%);animation:functional-confetti 2.8s calc(var(--i) * -.08s) linear infinite;transform:rotate(calc(var(--i) * 23deg))}@keyframes functional-confetti{to{top:110%;transform:translateX(calc((var(--i) - 14) * 4px)) rotate(720deg)}}
