/* Stable console silhouette: the physical cap moves within its reserved base. */
.buzzer-player{position:relative;display:grid;justify-items:center;gap:28px;width:100%;box-sizing:border-box;padding:30px 18px 24px;border:1px solid #ffffff16;border-radius:30px;background:radial-gradient(ellipse at 50% 40%,#52618625,transparent 65%),linear-gradient(155deg,#17223d,#0c1429 75%);box-shadow:inset 0 1px 0 #ffffff0d,0 18px 42px #0003;color:#f8fafc;overflow:hidden}
.buzzer-console-label{display:flex;align-items:center;justify-content:center;gap:9px;font:800 .7rem/1.5 Arial,sans-serif;letter-spacing:.2em;color:#a6b5d0;text-align:center}
.buzzer-console-label>i{width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 12px #34d39999}
.buzzer-button-base{position:relative;display:grid;place-items:center;margin:8px 0 10px;width:min(70vw,290px);aspect-ratio:1;border-radius:50%;background:linear-gradient(160deg,#8c9bb0 0%,#283349 24%,#101827 65%,#637086 100%);box-shadow:0 14px 25px #0006,inset 0 2px 3px #ffffff4d;border:1px solid #8593a04d}
.buzzer-button-base::before{content:"";position:absolute;inset:8px;border-radius:50%;border:2px solid #0b1223;background:radial-gradient(circle at 50% 50%,#182239 64%,#5b6c824d 65%,#101827 72%);box-shadow:inset 0 4px 12px #000b}
.ludik-buzzer{--buzzer-color:inherit;position:relative;display:grid;place-items:center;width:82%;aspect-ratio:1;padding:0;box-sizing:border-box;border:1px solid #ffffff50;border-radius:50%;background:radial-gradient(ellipse at 38% 20%,#ffffff65,transparent 55%),linear-gradient(180deg,#ffffff10,#0000003b),var(--buzzer-color,#ef4444);box-shadow:inset 0 3px 3px #ffffff60,inset 0 -9px 9px #0005,0 8px 0 #080d19,0 13px 15px #000b;color:#fff;cursor:pointer;touch-action:manipulation;transition:transform .1s ease,box-shadow .1s ease,filter .2s ease;font:900 clamp(1.5rem,7vw,2.8rem)/1 Arial,sans-serif;letter-spacing:.035em;text-shadow:0 2px 7px #000b;isolation:isolate}
.ludik-buzzer>span{z-index:2;position:relative;pointer-events:none}
.buzzer-button-shine{position:absolute;top:9%;left:18%;width:64%;height:25%;border-radius:50%;background:linear-gradient(#ffffff35,#ffffff00);transform:rotate(-12deg);pointer-events:none}
.ludik-buzzer:active:not(:disabled){transform:translateY(6px);box-shadow:inset 0 3px 6px #0004,0 2px 0 #080d19,0 7px 8px #000a}
.ludik-buzzer:focus-visible{outline:4px solid #67e8f9;outline-offset:7px}
.ludik-buzzer:disabled{cursor:default;filter:saturate(.2) brightness(.7)}
.ludik-buzzer.is-winner{filter:none;transform:translateY(4px);box-shadow:inset 0 3px 3px #ffffff50,inset 0 -6px 9px #0005,0 4px 0 #080d19,0 0 30px #34d39955;outline:3px solid #6ee7b7;outline-offset:5px}
[data-buzzer-state="locked"] .ludik-buzzer,[data-buzzer-state="closed"] .ludik-buzzer{font-size:clamp(1rem,4.8vw,1.65rem);letter-spacing:.02em}
[data-buzzer-state="locked"] .buzzer-console-label>i,[data-buzzer-state="closed"] .buzzer-console-label>i{background:#fbbf24;box-shadow:0 0 10px #fbbf2466}
[data-buzzer-state="winner"] .buzzer-console-label{color:#6ee7b7}
.buzzer-status{max-width:640px;margin:0 auto;text-align:center;font-size:1.05rem;font-weight:700;line-height:1.6;overflow-wrap:anywhere}
.buzzer-caption{color:#8293b3;font:700 .6rem/1.5 Arial,sans-serif;letter-spacing:.16em;text-align:center}
.buzzer-host-panel{padding:26px 18px;border:1px solid #64748b55;border-radius:22px;background:#64748b12}
.buzzer-host-copy{display:grid;justify-items:center;gap:18px}.buzzer-host-copy>small{max-width:440px;text-align:center;line-height:1.5;color:inherit;opacity:.7}
.buzzer-rearm{display:inline-flex!important;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 22px!important;border-radius:14px!important;font-weight:800!important;cursor:pointer}.buzzer-rearm:disabled{opacity:.4;cursor:default}
.buzzer-color-field{display:flex;align-items:center;gap:16px;font-weight:700}.buzzer-color-field input{width:80px;min-height:48px;padding:4px}
@media(max-width:380px){.buzzer-player{padding:24px 12px;gap:22px;border-radius:24px}.buzzer-button-base{width:min(67vw,250px)}}
@media(prefers-reduced-motion:reduce){.ludik-buzzer{transition:none}}
.buzzer-winner-hero{display:flex;align-items:center;justify-content:center;gap:28px;width:100%;padding:24px 10px;box-sizing:border-box;animation:buzzerAnnounce .4s ease-out}
.buzzer-winner-hero>div{display:grid;gap:10px;min-width:0}.buzzer-winner-hero small{font-size:.82rem;letter-spacing:.22em;font-weight:900;color:#a16207}
.buzzer-winner-name{display:block;font-size:clamp(2.6rem,6vw,5.6rem);font-weight:950;letter-spacing:-.045em;line-height:1.08;overflow-wrap:anywhere;color:#182239}
.buzzer-winner-time{font-weight:800;font-size:1.1rem;color:#475569}
.buzzer-winner-avatar{width:clamp(90px,12vw,150px);height:clamp(90px,12vw,150px);border:5px solid #fff;object-fit:cover;border-radius:30%;box-shadow:0 12px 35px #a1620726}
.buzzer-host-panel[data-buzzer-state="announced"]{border:2px solid #fbbf24;background:radial-gradient(ellipse at 20% 0%,#fef3c7,#fffbeb 65%);box-shadow:0 14px 44px #d9771820}
@keyframes buzzerAnnounce{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
@media(max-width:600px){.buzzer-winner-hero{flex-direction:column;gap:18px;text-align:center}}
@media(prefers-reduced-motion:reduce){.buzzer-winner-hero{animation:none}}
.buzzer-host-panel[data-buzzer-state="announced"] .buzzer-status{color:#475569}
.buzzer-host-panel[data-buzzer-state="announced"] .buzzer-console-label{color:#92400e}
.buzzer-host-panel[data-buzzer-state="announced"] .buzzer-rearm{background:#1e293b;color:#fff;border-color:#1e293b}