.landing:has(.discovery.is-game-view .game-tab-content[data-game-id="5-second-rule"][data-game-component="party"]),
.landing:has(.discovery.is-game-view .game-tab-content[data-game-id="beat-the-5"][data-game-component="party"]) { grid-template-rows: minmax(0, 1fr) 0 !important; }
.discovery.is-game-view:has(.game-tab-content[data-game-id="5-second-rule"][data-game-component="party"]),
.discovery.is-game-view:has(.game-tab-content[data-game-id="beat-the-5"][data-game-component="party"]) { min-height: 0; overflow: hidden; }
.discovery.is-game-view .game-tab-content[data-game-id="5-second-rule"][data-game-component="party"],
.discovery.is-game-view .game-tab-content[data-game-id="beat-the-5"][data-game-component="party"] { width:100%; max-width:none; height:100%; max-height:none; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior-y:contain; -webkit-overflow-scrolling:touch; padding-bottom:clamp(18px,4vh,34px); }
.five-sr-game,.five-sr-players,.five-sr-settings { width:min(100%,760px); margin-inline:auto; }
.five-sr-engine { display:grid; gap:1rem; align-content:start; }
.five-sr-ready-player,.five-sr-active-player,.five-sr-get-ready,.five-sr-pass-banner,.five-sr-winner-title,.five-sr-judging-label,.five-sr-reading-label,.five-sr-voice-status,.five-sr-sudden { text-align:center; }
.five-sr-ready-player { margin:1rem 0 .35rem; font-size:clamp(2rem,8vw,4.5rem); font-weight:800; line-height:1; }
.five-sr-active-player { font-size:clamp(1.2rem,4vw,1.8rem); font-weight:800; }
.five-sr-prompt-card { display:grid; gap:.75rem; padding:clamp(1.1rem,4vw,2rem); border:2px solid var(--cubiri-brand-purple,#7c3cff); border-radius:1.25rem; background:color-mix(in srgb,var(--cubiri-brand-purple,#7c3cff) 5%,transparent); box-shadow:0 0 18px color-mix(in srgb,var(--cubiri-brand-purple,#7c3cff) 12%,transparent); text-align:center; }
.five-sr-prompt-card p { margin:0; font-size:clamp(1.45rem,5vw,2.4rem); font-weight:750; line-height:1.18; }
.five-sr-prompt-card.is-loading { min-height:8rem; place-items:center; font-size:2rem; }
.five-sr-linear-timer { height:.55rem; overflow:hidden; border-radius:999px; background:color-mix(in srgb,currentColor 12%,transparent); }
.five-sr-linear-timer span { display:block; width:100%; height:100%; transform:scaleX(1); transform-origin:left center; background:currentColor; will-change:transform; }
.five-sr-linear-timer.is-fail { height:.7rem; }
.five-sr-get-ready { font-size:clamp(1.35rem,4.5vw,2rem); font-weight:800; }
.five-sr-flc { --five-sr-progress:0; display:grid; place-items:center; min-height:min(56vw,380px); }
.five-sr-flc-ring { position:relative; display:grid; place-items:center; width:min(66vw,340px); aspect-ratio:1; border:clamp(4px,1vw,8px) solid currentColor; border-radius:50%; overflow:hidden; }
.five-sr-flc-ring::before,.five-sr-flc-ring::after { content:""; position:absolute; background:color-mix(in srgb,currentColor 35%,transparent); }
.five-sr-flc-ring::before { width:100%; height:1px; }
.five-sr-flc-ring::after { width:1px; height:100%; }
.five-sr-flc-sweep { position:absolute; inset:-10%; transform:rotate(calc(var(--five-sr-progress) * 360deg)); transform-origin:center; }
.five-sr-flc-sweep::before { content:""; position:absolute; top:50%; left:50%; width:50%; height:2px; background:currentColor; transform-origin:left center; }
.five-sr-flc-number { position:relative; z-index:1; font-size:clamp(6rem,28vw,12rem); font-weight:900; line-height:1; font-variant-numeric:tabular-nums; }
.five-sr-flc.is-reduced .five-sr-flc-sweep { display:none; }
.five-sr-judging-label { font-size:clamp(1.3rem,4vw,1.8rem); font-weight:750; }
.five-sr-judge-actions,.five-sr-winner-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(.8rem,2.5vw,1.2rem); }
.five-sr-pass,.five-sr-fail { min-height:clamp(7.5rem,22vw,10.5rem); display:grid; place-items:center; border:1px solid transparent; border-radius:1.1rem; font:inherit; font-size:clamp(1.2rem,3.5vw,1.6rem); font-weight:900; color:#fff; cursor:pointer; line-height:1.05; }
.five-sr-fail::before,.five-sr-pass::before { display:block; font-size:200%; line-height:.85; margin-bottom:.35rem; }
.five-sr-fail::before { content:"×"; }
.five-sr-pass::before { content:"✓"; }
.five-sr-fail { border-color:color-mix(in srgb,#e5484d 72%,white 8%); background:color-mix(in srgb,#e5484d 28%,transparent); box-shadow:0 0 18px color-mix(in srgb,#e5484d 16%,transparent); }
.five-sr-pass { border-color:color-mix(in srgb,#30a46c 72%,white 8%); background:color-mix(in srgb,#30a46c 36%,transparent); box-shadow:0 0 20px color-mix(in srgb,#30a46c 18%,transparent); }
.five-sr-fail:active,.five-sr-pass:active { transform:scale(.985); }
.five-sr-pass-banner { font-size:clamp(1.7rem,6vw,2.8rem); font-weight:900; }
.five-sr-scoreboard { display:grid; gap:.45rem; }
.five-sr-score-row { display:grid; grid-template-columns:2rem minmax(0,1fr) auto; align-items:center; gap:.65rem; padding:.75rem .85rem; border:1px solid color-mix(in srgb,currentColor 12%,transparent); border-radius:.85rem; }
.five-sr-score-row:first-child { border:2px solid var(--cubiri-brand-purple,#7c3cff); background:color-mix(in srgb,var(--cubiri-brand-purple,#7c3cff) 5%,transparent); box-shadow:0 0 14px color-mix(in srgb,var(--cubiri-brand-purple,#7c3cff) 12%,transparent); }
.five-sr-score-row.is-last-scorer { font-weight:800; }
.five-sr-rank,.five-sr-score-value { font-variant-numeric:tabular-nums; }
.five-sr-score-value { font-size:1.25rem; }
.five-sr-sudden { font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.five-sr-winner-icon { text-align:center; font-size:clamp(3.5rem,16vw,7rem); }
.five-sr-winner-title { margin:0; font-size:clamp(2rem,7vw,3.8rem); }
.five-sr-player-row { grid-template-columns:minmax(0,1fr) auto; }
.five-sr-settings-card { display:grid; gap:1rem; }
.five-sr-settings-card > div + div { padding-top:1rem; border-top:1px solid color-mix(in srgb,currentColor 14%,transparent); }
.five-sr-settings-card p { margin:.45rem 0 0; }
.five-sr-setting-group.is-hidden { display:none; }
.five-sr-segmented,.five-sr-number-choice { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.6rem; }
.five-sr-segmented button,.five-sr-number-choice > button { min-height:2.8rem; border:1px solid color-mix(in srgb,currentColor 20%,transparent); border-radius:.8rem; background:transparent; color:inherit; font:inherit; padding:.55rem .85rem; cursor:pointer; }
.five-sr-segmented button.is-active,.five-sr-number-choice > button.is-active { background:transparent; color:inherit; font-weight:800; }
.five-sr-segmented button:disabled { opacity:.4; cursor:not-allowed; }
.five-sr-stepper { position:relative; display:inline-grid; grid-template-columns:2.8rem 3.7rem 2.8rem; align-items:stretch; min-height:2.8rem; overflow:visible; border:1px solid color-mix(in srgb,currentColor 20%,transparent); border-radius:.8rem; background:color-mix(in srgb,currentColor 2%,transparent); isolation:isolate; }
.five-sr-stepper::before { content:""; position:absolute; inset:-2px; z-index:-1; border-radius:calc(.8rem + 2px); padding:2px; background:var(--cubiri-brand-gradient); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:0; pointer-events:none; }
.five-sr-stepper.is-active { border-color:transparent; box-shadow:0 0 10px color-mix(in srgb,var(--cubiri-brand-purple) 24%,transparent),0 0 14px color-mix(in srgb,var(--cubiri-brand-pink) 18%,transparent),0 0 18px color-mix(in srgb,var(--cubiri-brand-orange) 12%,transparent); }
.five-sr-stepper.is-active::before { opacity:1; }
.five-sr-stepper-button,.five-sr-custom-number { min-width:0; border:0; border-radius:0; background:transparent; color:inherit; font:inherit; }
.five-sr-stepper-button { display:grid; place-items:center; padding:0; font-size:1.35rem; font-weight:800; line-height:1; cursor:pointer; touch-action:manipulation; user-select:none; -webkit-user-select:none; }
.five-sr-stepper-button:first-child { border-right:1px solid color-mix(in srgb,currentColor 14%,transparent); border-radius:.8rem 0 0 .8rem; }
.five-sr-stepper-button:last-child { border-left:1px solid color-mix(in srgb,currentColor 14%,transparent); border-radius:0 .8rem .8rem 0; }
.five-sr-stepper-button:hover,.five-sr-stepper-button:focus-visible { color:var(--cubiri-brand-pink,var(--pink)); background:color-mix(in srgb,currentColor 6%,transparent); outline:none; }
.five-sr-stepper-button:active { background:color-mix(in srgb,currentColor 12%,transparent); transform:scale(.96); }
.five-sr-custom-number { width:100%; padding:.45rem .3rem; text-align:center; font-variant-numeric:tabular-nums; -moz-appearance:textfield; appearance:textfield; }
.five-sr-custom-number:focus { outline:none; background:color-mix(in srgb,currentColor 5%,transparent); }
.five-sr-custom-number::-webkit-outer-spin-button,.five-sr-custom-number::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
@media (max-width:560px) { .five-sr-judge-actions { grid-template-columns:repeat(2,minmax(0,1fr)); } .five-sr-winner-actions { grid-template-columns:1fr; } .five-sr-prompt-card { border-radius:1rem; } .five-sr-pass,.five-sr-fail { min-height:clamp(6.8rem,28vw,8.5rem); } .discovery.is-game-view .game-tab-content[data-game-id="5-second-rule"][data-game-component="party"],.discovery.is-game-view .game-tab-content[data-game-id="beat-the-5"][data-game-component="party"] { padding-bottom:18px; } }
html[data-reduced-motion="reduce"] .five-sr-linear-timer span,html[data-reduced-motion="reduce"] .five-sr-flc-sweep { transition:none !important; animation:none !important; }