@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap");
:root{color-scheme:dark;--bg:#10101b;--panel:#191926;--soft:#222232;--text:#f5f2fa;--muted:#a5a2b4;--purple:#b99aff;--lime:#d6ff6b;--pink:#ff8db4;--line:rgba(255,255,255,.1);font-family:"DM Sans",system-ui,sans-serif;background:var(--bg);color:var(--text);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(ellipse at 80% 0,#28203b 0,transparent 32rem),var(--bg)}button,input,textarea,select{font:inherit}button{color:inherit}button:disabled{cursor:default}.app-shell{width:min(100%,760px);min-height:100vh;margin:0 auto;padding:max(14px,env(safe-area-inset-top)) 20px max(25px,env(safe-area-inset-bottom))}.topbar{display:flex;align-items:center;justify-content:space-between;min-height:40px}.brand{font:700 23px "Space Grotesk",sans-serif;letter-spacing:-1.5px}.brand span{color:var(--lime)}.tag,.round-badge{padding:6px 9px;border:1px solid rgba(214,255,107,.22);border-radius:99px;color:var(--lime);background:rgba(214,255,107,.07);font-size:9px;font-weight:800;letter-spacing:.12em}.round-badge{border-color:var(--line);color:var(--muted);background:var(--panel)}.home-screen,.play-screen,.bus-screen{max-width:570px;margin:0 auto}.home-screen{padding-top:8vh}.eyebrow{color:var(--purple);font-size:10px;font-weight:800;letter-spacing:.16em}.home-screen h1{margin:14px 0;font:700 clamp(46px,12vw,75px)/.97 "Space Grotesk",sans-serif;letter-spacing:-.07em}.home-screen h1 span{color:var(--purple)}.intro{max-width:450px;color:var(--muted);font-size:14px;line-height:1.6}.field-label{display:block;margin:20px 0 8px;color:#d4d0df;font-size:12px;font-weight:700}.field-label span{display:block;margin-top:4px;color:var(--muted);font-weight:400}.text-input{width:100%;min-height:52px;padding:12px 14px;border:1px solid var(--line);border-radius:13px;outline:none;background:var(--panel);color:var(--text)}.text-input:focus{border-color:var(--purple);box-shadow:0 0 0 3px #b99aff20}.text-input::placeholder{color:#777487}.names-input{resize:vertical;min-height:66px}.invalid{border-color:#ff718e!important}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.mode-card{display:flex;min-height:135px;flex-direction:column;align-items:flex-start;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--panel);text-align:left;cursor:pointer}.mode-card.selected{border-color:var(--purple);background:linear-gradient(145deg,#b99aff22,var(--panel) 75%)}.mode-card>span{font-size:24px}.mode-card strong{margin-top:9px;font-size:14px}.mode-card small{margin-top:5px;color:var(--muted);font-size:11px;line-height:1.4}.button{display:flex;min-height:51px;align-items:center;justify-content:center;gap:9px;padding:10px 16px;border:0;border-radius:13px;font-weight:800;cursor:pointer}.primary{color:#15141c;background:var(--lime)}.primary:hover{background:#e3ff9c}.secondary{border:1px solid var(--line);background:var(--panel)}.full-width{width:100%}.safety-note{margin:18px 0;color:#928fa0;font-size:10px;line-height:1.55;text-align:center}.quiet-button{padding:8px 0;border:0;background:transparent;color:var(--muted);cursor:pointer}.play-screen{padding-top:5vh}.big-emoji{margin:18px 0 9px;font-size:38px}.question-title{margin:12px 0 21px;font:700 clamp(32px,8vw,51px)/1.04 "Space Grotesk",sans-serif;letter-spacing:-.055em}.turn-card{display:flex;align-items:center;gap:11px;margin:18px 0 14px;padding:12px;border:1px solid var(--line);border-radius:15px;background:var(--panel)}.turn-card>div{display:flex;flex:1;flex-direction:column;gap:3px}.turn-card small,.hand-heading small{color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.1em}.turn-card strong{font-size:12px}.turn-number{color:var(--purple);font-size:11px;font-weight:800}.avatar{display:grid;flex:0 0 36px;width:36px;height:36px;place-items:center;border-radius:12px;background:var(--lime);color:#17141c;font-weight:800}.hue-0{background:var(--lime)}.hue-1{background:var(--pink)}.hue-2{background:var(--purple)}.hue-3{background:#76e0d1}.hue-4{background:#ffc875}.choice-list,.results-list{display:grid;gap:8px}.choice-button,.result-row{display:flex;min-height:56px;align-items:center;gap:11px;padding:9px 12px;border:1px solid var(--line);border-radius:14px;background:var(--panel);text-align:left}.choice-button{cursor:pointer}.choice-button:disabled{opacity:.4}.choice-button:not(:disabled):hover{border-color:var(--purple);background:var(--soft)}.choice-button strong,.result-row strong{flex:1;font-size:13px}.chevron{color:var(--purple);font-size:24px}.result-row>span:last-child{color:var(--muted);font-size:11px}.top-voted{border-color:var(--pink);background:#ff8db414}.loser-card{margin:17px 0;padding:18px;border:1px solid #ff8db455;border-radius:16px;background:#ff8db410;text-align:center}.loser-card>strong{display:block;margin:8px 0;font:700 25px "Space Grotesk",sans-serif}.loser-card p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.5}.loser-card b{color:var(--pink)}.bus-screen{max-width:680px;padding-top:18px}.bus-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.bus-header h1{margin:8px 0 0;font:700 36px "Space Grotesk",sans-serif;letter-spacing:-.06em}.bus-header h1 span{color:var(--purple)}.deck-count{display:flex;flex-direction:column;align-items:center;padding:9px 13px;border:1px solid var(--line);border-radius:13px;background:var(--panel)}.deck-count strong{color:var(--lime);font-size:20px}.deck-count small{color:var(--muted);font-size:9px}.status-banner{margin:11px 0;padding:12px 14px;border:1px solid #b99aff38;border-radius:13px;background:#b99aff10;color:#e5dcff;font-size:12px;line-height:1.4}.pyramid-wrap{overflow-x:auto;padding:7px 0 12px}.pyramid{display:grid;width:max-content;min-width:100%;justify-items:center;gap:5px}.pyramid-row{display:flex;justify-content:center;gap:5px}.pyramid-cell{position:relative;width:clamp(39px,10vw,57px);height:clamp(54px,14vw,77px);padding:2px;border:0;border-radius:7px;background:transparent;cursor:pointer}.pyramid-cell:disabled{cursor:default}.pyramid-cell:not(:disabled):hover{transform:translateY(-2px)}.pyramid-cell small{position:absolute;right:-2px;bottom:-3px;display:grid;min-width:15px;height:15px;place-items:center;border-radius:50%;background:var(--purple);color:#17141c;font-size:9px;font-weight:800}.playing-card{display:flex;width:clamp(35px,9vw,50px);height:clamp(50px,12.5vw,70px);flex:0 0 auto;flex-direction:column;align-items:center;justify-content:center;border:1px solid #c8c5d2;border-radius:6px;background:#f7f3fb;color:#191722;box-shadow:0 3px 8px #0005}.playing-card strong{font:700 17px "Space Grotesk",sans-serif;line-height:1}.playing-card b{font-size:17px;line-height:1}.playing-card.red{color:#d44360}.playing-card.black{color:#242331}.face-down{border:2px solid #b99aff;background:repeating-linear-gradient(135deg,#29223e,#29223e 4px,#37304e 4px,#37304e 8px);color:var(--purple)}.face-down i{display:grid;width:20px;height:25px;place-items:center;border:1px solid #b99aff;border-radius:5px;font-style:normal;font-weight:800}.pyramid-legend{padding:4px;color:var(--muted);font-size:9px;text-align:center}.hand-panel{margin-top:7px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}.hand-heading{display:flex;align-items:center;justify-content:space-between}.hand-heading>div{display:flex;flex-direction:column;gap:3px}.hand-heading strong{font-size:13px}.hand-heading>span{color:var(--muted);font-size:11px}.hand-cards{display:flex;min-height:78px;align-items:center;gap:5px;overflow-x:auto;padding:6px 0}.hand-cards .playing-card{width:clamp(36px,9vw,48px)}.empty-hand{color:var(--lime);font-size:12px;font-weight:800}.claim-box{display:grid;gap:9px;margin:8px 0;padding:12px;border:1px solid #b99aff40;border-radius:13px;background:#b99aff0c}.claim-box>strong{font-size:12px}.claim-box>small{color:var(--muted);font-size:10px}.claim-box .field-label{display:flex;align-items:center;gap:10px;margin:0}.small-select{padding:5px 10px;border:1px solid var(--line);border-radius:8px;background:var(--soft);color:var(--text)}.claim-box .button{min-height:42px;font-size:12px}.player-strip{display:flex;gap:7px;overflow-x:auto;margin-top:12px;padding-bottom:3px}.player-chip{display:grid;min-width:95px;grid-template-columns:28px 1fr;align-items:center;gap:2px 7px;padding:7px;border:1px solid var(--line);border-radius:11px;background:#11111b}.player-chip.active{border-color:var(--lime)}.player-chip .avatar{grid-row:span 2;width:28px;height:28px;flex-basis:28px;border-radius:9px;font-size:11px}.player-chip strong{overflow:hidden;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.player-chip small{color:var(--muted);font-size:9px}.award-screen{padding-top:8vh}.award-list{display:grid;gap:7px}.award-row{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.award-row strong{flex:1;font-size:12px}.award-count{width:67px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text)}.award-total{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.award-total strong{color:var(--lime)}.bus-steps{display:grid;gap:8px;margin:22px 0}.bus-steps span{padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--purple);font-size:11px;font-weight:800}.rider-button{margin:9px 0}.bus-ride{padding-top:6vh}.bus-cards{display:flex;min-height:110px;align-items:center;justify-content:center;gap:12px;margin:20px 0}.bus-cards .playing-card{width:68px;height:94px}.bus-cards .playing-card strong{font-size:24px}.bus-cards .playing-card b{font-size:23px}.card-placeholder{display:grid;width:68px;height:94px;place-items:center;border:2px dashed #696477;border-radius:8px;color:var(--muted);font-size:35px}.guess-options{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:18px 0}.ride-progress{display:flex;justify-content:center;gap:8px;margin:20px 0}.ride-progress span{padding:6px 11px;border:1px solid var(--line);border-radius:99px;color:var(--muted);font-size:10px}.ride-progress .current{border-color:var(--purple);color:var(--purple)}.ride-progress .complete{border-color:#d6ff6b55;color:var(--lime)}
@media(min-width:620px){.app-shell{padding-right:32px;padding-left:32px}.home-screen{padding-top:10vh}.play-screen{padding-top:7vh}.pyramid-row{gap:9px}.pyramid{gap:9px}.bus-screen{padding-top:24px}}
@media(max-width:380px){.app-shell{padding-right:14px;padding-left:14px}.mode-grid{gap:7px}.mode-card{padding:11px}.pyramid-row{gap:2px}.pyramid{gap:2px}.playing-card{border-radius:5px}}

/* Premium polish */
:root{--bg:#0b0b14;--panel:#151521;--soft:#201f30;--purple:#c5a7ff;--lime:#dcff79;--pink:#ff93bd;--line:rgba(232,225,255,.11)}
body{background:radial-gradient(ellipse at 50% -18%,#443269 0,rgba(30,23,49,.75) 20rem,transparent 43rem),radial-gradient(ellipse at 100% 55%,#17233a 0,transparent 28rem),var(--bg)}
.app-shell{position:relative}.topbar{position:sticky;top:0;z-index:5;padding:7px 0;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.topbar-actions{display:flex;align-items:center;gap:8px}.sound-toggle{display:flex;align-items:center;gap:5px;padding:7px 9px;border:1px solid var(--line);border-radius:99px;background:#171522;color:var(--purple);font-size:11px;font-weight:800;cursor:pointer}.sound-toggle span{color:var(--muted);font-size:9px}
.home-screen,.play-screen,.bus-screen{animation:screen-in .42s cubic-bezier(.18,.78,.28,1) both}.home-screen{padding-top:clamp(36px,8vh,84px)}
.home-screen h1{line-height:.94;text-shadow:0 12px 50px #b99aff22}.intro{font-size:14px}
.text-input,.mode-card,.turn-card,.choice-button,.result-row,.hand-panel,.players-panel{box-shadow:0 12px 34px #00000019}
.mode-card{transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease}.mode-card:hover{transform:translateY(-3px);box-shadow:0 16px 34px #0004}.mode-card.selected{box-shadow:inset 0 0 26px #b99aff0c,0 10px 30px #0003}
.button,.choice-button,.quiet-button,.sound-toggle,.pyramid-cell{transition:transform .18s ease,filter .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease}
.button:not(:disabled):hover{filter:brightness(1.08);box-shadow:0 8px 25px #d6ff6b25}.button:disabled{opacity:.42;cursor:not-allowed}.button:not(:disabled):active,.choice-button:not(:disabled):active{transform:scale(.975)}
.button.primary{background:linear-gradient(135deg,#e4ff9d,#caff5d);box-shadow:0 7px 26px #d6ff6b16}
.rows-setting{margin-top:17px;padding:15px;border:1px solid #c5a7ff32;border-radius:15px;background:linear-gradient(125deg,#c5a7ff12,#151521 65%)}.rows-heading{display:flex;align-items:center;justify-content:space-between}.rows-heading label{font-size:12px;font-weight:700}.rows-heading strong{color:var(--lime);font:700 20px "Space Grotesk",sans-serif}.rows-heading strong small{color:var(--muted);font:500 10px "DM Sans",sans-serif}.rows-slider{width:100%;height:5px;margin:16px 0 5px;accent-color:var(--purple);cursor:pointer}.setting-hint{min-height:15px;color:var(--muted);font-size:10px;line-height:1.45}.setup-error{margin:8px 0;color:#ff92b3;font-size:11px;line-height:1.4}.hidden{display:none!important}
.pyramid-wrap{max-height:48vh;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#5a4a75 transparent;border:1px solid #ffffff08;border-radius:16px;background:linear-gradient(180deg,#1715229c,#10101a8c);padding:10px 5px}
.pyramid{min-width:max-content;padding:5px 13px}.pyramid-cell{width:clamp(37px,9.2vw,55px);height:clamp(53px,13.5vw,75px);overflow:visible}.pyramid-cell .playing-card{animation:card-deal .38s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--deal-delay,0ms);box-shadow:0 4px 13px #0006,0 0 0 1px #ffffff12}.pyramid-cell.playable{z-index:1;filter:drop-shadow(0 0 8px #c5a7ff99)}.pyramid-cell.playable:hover{transform:translateY(-4px) scale(1.045)}.pyramid-cell.claimed{opacity:.36;filter:grayscale(.75)}.pyramid-cell.claimed .playing-card{box-shadow:none}.match-count{position:absolute;top:-6px;left:-5px;z-index:2;display:grid;min-width:22px;height:18px;place-items:center;padding:0 4px;border:1px solid #10101b;border-radius:99px;background:var(--purple);color:#191523;font-size:9px;font-style:normal;font-weight:900}.pyramid-legend{position:sticky;bottom:0;padding:8px;background:#12111bea;backdrop-filter:blur(8px);font-size:10px}
.status-banner{box-shadow:inset 0 1px #ffffff0a,0 8px 24px #0002}.hand-panel{border-color:#ffffff16;background:linear-gradient(145deg,#191926,#12121c)}.player-chip{transition:border-color .2s,transform .2s}.player-chip.active{box-shadow:0 0 18px #d6ff6b16;transform:translateY(-2px)}.pass-turn{margin-top:5px}
.playing-card{transition:transform .18s ease,box-shadow .18s ease}.hand-cards .playing-card:hover{z-index:2;transform:translateY(-5px) rotate(-2deg);box-shadow:0 12px 20px #0006}
.turn-card,.claim-box,.loser-card{animation:soft-pop .3s cubic-bezier(.2,.8,.2,1) both}.result-row{animation:screen-in .3s both}.result-row:nth-child(2){animation-delay:50ms}.result-row:nth-child(3){animation-delay:100ms}.result-row:nth-child(4){animation-delay:150ms}
.guess-options .button{min-height:60px}.bus-cards .playing-card{animation:card-deal .3s cubic-bezier(.2,.8,.2,1) both}.ride-progress .current{box-shadow:0 0 17px #c5a7ff25}
@keyframes screen-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes card-deal{from{opacity:0;transform:translateY(-8px) rotateY(65deg) scale(.92)}to{opacity:1;transform:translateY(0) rotateY(0) scale(1)}}
@keyframes soft-pop{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@media(max-width:620px){.app-shell{padding-right:16px;padding-left:16px}.round-badge{font-size:8px}.sound-toggle{padding:6px 8px}.pyramid-wrap{max-height:44vh}.bus-screen{padding-top:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.hand-card{display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:9px;background:transparent;cursor:pointer;transition:transform .18s ease,filter .18s ease,opacity .18s ease}.hand-card.playable{filter:drop-shadow(0 0 7px #c5a7ff99)}.hand-card.selected{transform:translateY(-7px);filter:drop-shadow(0 0 9px #d6ff6b99)}.hand-card:disabled{opacity:.72}.hand-cards .hand-card:not(.playable){cursor:default}.award-breakdown{color:var(--muted);font-size:13px;text-align:center}
body.game-active{height:100vh;height:100dvh;min-height:0;overflow:hidden}
body.game-active .app-shell{display:flex;height:100%;min-height:0;flex-direction:column;overflow:hidden;padding: max(6px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
body.game-active .topbar{position:static;height:36px;min-height:36px;flex:0 0 36px;padding:0;backdrop-filter:none;-webkit-backdrop-filter:none}
body.game-active .bus-screen{display:flex;width:100%;height:auto;min-height:0;flex:1 1 0;flex-direction:column;overflow:hidden;margin:0 auto;padding:2px 0 0}
body.game-active .bus-header{flex:0 0 auto;margin:0 0 4px}
body.game-active .bus-header h1{margin:2px 0 0;font-size:clamp(23px,6vw,32px)}
body.game-active .deck-count{padding:4px 8px}
body.game-active .deck-count strong{font-size:16px}
body.game-active .status-banner{display:-webkit-box;overflow:hidden;flex:0 0 auto;-webkit-box-orient:vertical;-webkit-line-clamp:2;margin:2px 0 5px;padding:7px 9px;font-size:11px;line-height:1.25}
body.game-active .pyramid-wrap{display:flex;min-height:0;max-height:none;flex:1 1 0;align-items:stretch;overflow:hidden;padding:2px;border-radius:12px}
body.game-active .pyramid{display:grid;width:100%;min-width:0;height:100%;grid-template-rows:repeat(var(--row-count),minmax(0,1fr));gap:var(--pyramid-gap,2px);padding:0}
body.game-active .pyramid-row{min-height:0;align-items:center;gap:var(--pyramid-gap,2px)}
body.game-active .pyramid-cell{width:var(--pyramid-card-width,24px);height:var(--pyramid-card-height,34px);min-width:0;flex:0 0 auto;padding:0}
body.game-active .pyramid-cell .playing-card{width:100%;height:100%;border-radius:4px}
body.game-active .pyramid-cell .face-down i{width:45%;height:50%;font-size:clamp(5px,1.5vw,8px)}
body.game-active .pyramid-cell .playing-card strong,body.game-active .pyramid-cell .playing-card b{font-size:clamp(6px,2vw,11px);line-height:.8}
body.game-active .pyramid-cell small{right:0;bottom:0;width:min(12px,100%);height:min(12px,90%);min-width:0;font-size:clamp(5px,1.6vw,7px)}
body.game-active .pyramid-cell .match-count{top:-3px;left:-3px;min-width:14px;height:13px;font-size:7px}
body.game-active .hand-panel{flex:0 0 auto;margin:5px 0 0;padding:7px 8px;border-radius:12px}
body.game-active .hand-heading{min-height:21px}
body.game-active .hand-heading small{font-size:8px}
body.game-active .hand-heading strong{font-size:12px}
body.game-active .hand-cards{height:clamp(55px,9vh,68px);min-height:0;gap:clamp(3px,1vw,7px);overflow:hidden;padding:2px 0}
body.game-active .hand-card{min-width:0;flex:0 1 auto}
body.game-active .hand-card .playing-card{width:clamp(36px,11vw,48px);height:clamp(50px,8vh,62px);border-radius:5px}
body.game-active .hand-card.selected{transform:translateY(-3px)}
body.game-active .claim-box{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin:3px 0 0;padding:0;border:0;background:none}
body.game-active .claim-box .button{min-height:36px;padding:6px;font-size:10px}
body.game-active .player-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;overflow:hidden;margin:5px 0 0;padding:0}
body.game-active .player-chip{min-width:0;min-height:32px;grid-template-columns:24px minmax(0,1fr);gap:1px 6px;padding:3px 5px}
body.game-active .player-chip .avatar{width:24px;height:24px;flex-basis:24px;border-radius:7px;font-size:10px}
body.game-active .player-chip strong{overflow-wrap:anywhere;font-size:9px;line-height:1.05;white-space:normal}
body.game-active .player-chip small{font-size:8px;line-height:1}
body.game-active .empty-hand{font-size:10px}
/* Match setup and reusable mini-game rounds */
.section-heading{display:flex;align-items:center;justify-content:space-between;margin-top:22px}
.match-settings,.game-pool{margin:16px 0;padding:14px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,#b99aff0b,var(--panel) 75%)}
.match-settings .rows-heading{margin:0}
.match-settings .rows-heading label{color:#e5e0ee;font-size:12px;font-weight:700}
.match-settings .rows-heading strong{color:var(--lime);font-size:15px}
.match-settings .rows-slider{margin:14px 0 8px}
.game-pool{padding:14px}
.game-pool .section-heading{margin:0 0 12px}
.pool-count{color:var(--muted);font-size:10px;font-weight:700}
.game-pool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.pool-option{display:flex;min-height:48px;min-width:0;align-items:center;gap:7px;padding:8px;border:1px solid var(--line);border-radius:11px;background:#10101b;cursor:pointer}
.pool-option:has(input:checked){border-color:#b99aff66;background:#b99aff10}
.pool-option input{width:16px;height:16px;flex:0 0 auto;accent-color:var(--purple)}
.pool-option>span{font-size:16px}
.pool-option strong{overflow:hidden;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.mini-game-screen{padding-top:4vh}
.mini-game-screen .choice-list{margin-top:14px}
.number-answer-form{display:grid;gap:10px}
.number-answer-form .text-input{min-height:56px}
.mini-game-screen .turn-card{margin-top:12px}
.result-screen{padding-bottom:20px}
.online-match-settings{margin-top:24px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.online-match-settings .field-label{margin-top:0}
.online-match-settings .rows-heading{margin:16px 0 4px}
.online-match-settings .rows-heading label{font-size:12px;font-weight:700}
.online-match-settings .rows-heading strong{color:var(--lime)}
.online-match-settings .rows-slider{width:100%;margin:10px 0 15px;accent-color:var(--purple)}
@media(max-width:390px){.app-shell{padding-right:12px;padding-left:12px}.mode-grid{gap:7px}.mode-card{min-height:124px;padding:11px}.game-pool-grid{gap:5px}.pool-option{gap:5px;padding:7px}.pool-option strong{font-size:9px}}
@media(max-height:680px){body.game-active .app-shell{padding-top:max(3px,env(safe-area-inset-top));padding-bottom:max(3px,env(safe-area-inset-bottom))}body.game-active .bus-header{margin-bottom:2px}body.game-active .status-banner{margin:1px 0 3px;padding:5px 8px}body.game-active .hand-panel{margin-top:3px;padding:5px 7px}body.game-active .hand-cards{height:52px}body.game-active .hand-card .playing-card{height:48px}body.game-active .player-strip{gap:2px;margin-top:3px}body.game-active .player-chip{min-height:28px}}
.online-panel{margin-top:26px;padding:18px;border:1px solid #b99aff35;border-radius:18px;background:linear-gradient(145deg,#b99aff10,#191926 68%)}.online-panel .field-label{margin-top:14px}.online-copy,.room-setup-note{color:var(--muted);font-size:12px;line-height:1.5}.room-join{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:9px}.room-join .button{min-width:76px}.room-join .text-input{text-transform:uppercase;letter-spacing:.16em}.room-error{margin:10px 0;color:#ff92b3;font-size:12px;line-height:1.4}.room-setup-note{margin:11px 0 0;font-size:10px}.room-screen{padding-top:8vh}.room-code-display{color:var(--lime);font-size:clamp(42px,13vw,70px);letter-spacing:.12em}.room-player-heading{display:flex;justify-content:space-between;margin:26px 0 10px;font-size:13px}.room-player-heading span{color:var(--muted)}.room-player-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.room-player{display:flex;min-width:0;align-items:center;gap:8px;padding:9px;border:1px solid var(--line);border-radius:13px;background:var(--panel)}.room-player .avatar{width:30px;height:30px;flex-basis:30px;border-radius:9px;font-size:12px}.room-player>strong{overflow:hidden;flex:1;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.host-badge{color:var(--lime);font-size:8px;font-weight:800;letter-spacing:.08em}.online-dot{width:8px;height:8px;border-radius:50%;background:#8ae8b0;box-shadow:0 0 10px #8ae8b077}.room-screen .status-banner{margin-top:22px}.room-screen .room-setup-note{text-align:center}

body:not(.game-active){background:var(--bg)}
body:not(.game-active)::before{position:fixed;z-index:0;inset:-20%;background:radial-gradient(ellipse at 18% 14%,#8a49ef20,transparent 34%),radial-gradient(ellipse at 85% 38%,#80ff6b12,transparent 31%);content:"";pointer-events:none;animation:club-glow 16s ease-in-out infinite alternate}
.app-shell{position:relative;z-index:1}
.home-screen{padding-top:6vh;padding-bottom:30px}
.home-screen h1 span{background:linear-gradient(95deg,#fff 3%,#c7a8ff 48%,#cfff75 100%);background-clip:text;-webkit-background-clip:text;color:transparent}
.intro,.online-copy{font-size:15px}
.field-label{font-size:13px}
.player-tag-input{display:flex;min-height:58px;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(145deg,#191926,#13131e);transition:border-color .18s,box-shadow .18s}
.player-tag-input:focus-within{border-color:var(--purple);box-shadow:0 0 0 3px #b99aff20,0 0 24px #b99aff12}
.player-tag-list{display:contents}
.player-tag{display:inline-flex;max-width:100%;align-items:center;gap:5px;padding:5px 7px;border:1px solid #ffffff1c;border-radius:999px;background:#b99aff20;color:var(--text)}
.player-tag>span{font-size:15px}
.player-tag strong{overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.player-tag button{width:21px;height:21px;padding:0;border:0;border-radius:50%;background:#ffffff16;color:var(--text);font-size:17px;line-height:1;cursor:pointer}
.player-tag button:hover{background:#ff8db455}
.player-tag-text{width:clamp(110px,40%,220px);min-width:100px;min-height:35px;flex:1;padding:4px;border:0;outline:0;background:transparent;color:var(--text);font-size:14px}
.player-tag-text::placeholder{color:#858195}
.player-tag-text:disabled{opacity:.65}
.tag-input-hint{margin:6px 2px 0;color:var(--muted);font-size:11px}
.mode-grid{gap:12px}
.mode-card{position:relative;min-height:148px;overflow:hidden;padding:15px;border-color:#ffffff17;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease}
.mode-card:hover{transform:translateY(-3px);border-color:#b99aff77}
.mode-card.selected{border:1px solid var(--purple);background:linear-gradient(145deg,#b99aff25,#191926 76%);box-shadow:0 0 0 1px #b99aff35,0 8px 30px #a56aff16}
.mode-card[data-mode="bus"].selected{border-color:var(--lime);box-shadow:0 0 0 1px #d6ff6b35,0 8px 30px #d6ff6b12}
.mode-card .mode-icon{font-size:29px;transition:transform .2s ease}
.mode-card.selected .mode-icon{transform:rotate(-8deg) scale(1.08)}
.mode-card strong{margin-top:7px;font-size:15px}
.mode-card small{font-size:12px}
.mode-check{position:absolute;top:10px;right:10px;display:grid;width:23px;height:23px;place-items:center;border:1px solid #ffffff38;border-radius:7px;background:#11111b;color:transparent;font-size:13px;font-weight:900;opacity:.8;transition:transform .18s,border-color .18s,background .18s}
.mode-card.selected .mode-check{transform:scale(1.05);border-color:var(--purple);background:var(--purple);color:#17141c;opacity:1}
.mode-card[data-mode="bus"].selected .mode-check{border-color:var(--lime);background:var(--lime)}
.mode-badge{position:absolute;top:12px;right:42px;padding:4px 7px;border-radius:999px;background:#d6ff6b16;color:var(--lime);font-size:9px;font-weight:800}
.mode-card>.mode-badge{z-index:1;font-size:9px;white-space:nowrap}
.mode-card[data-mode="bus"] .mode-badge{background:#b99aff1c;color:#d3bdff}
.button{transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}
.button:not(:disabled):hover{transform:translateY(-1px);filter:brightness(1.06)}
.button.primary:not(:disabled){box-shadow:0 0 0 1px #d6ff6b35,0 8px 25px #d6ff6b17}
.button.primary:not(:disabled):active{transform:scale(.985);box-shadow:0 0 18px #d6ff6b38}
.button.secondary:not(:disabled):hover{border-color:#b99aff88;box-shadow:0 0 17px #b99aff1c}
.button:focus-visible,.mode-card:focus-visible,.pool-tool:focus-visible,.player-tag button:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
.game-pool{margin-top:10px;padding:15px;border:1px solid #ffffff12;border-radius:17px;background:#191926aa}
.pool-tools{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 12px}
.pool-tool{min-height:34px;padding:6px 10px;border:1px solid #ffffff1b;border-radius:999px;background:#10101b;color:#e2deed;font-size:11px;font-weight:700;cursor:pointer}
.pool-tool:hover{border-color:var(--purple);color:#fff}
.game-pool-grid{gap:8px}
.pool-option{min-height:67px;gap:9px;padding:9px;border-color:#ffffff17;transition:transform .18s,border-color .18s,background .18s}
.pool-option:hover{transform:translateY(-2px);border-color:#b99aff77}
.pool-option.selected{border-color:#b99aff77;background:linear-gradient(140deg,#b99aff16,#10101b 80%)}
.pool-option input{width:18px;height:18px;accent-color:var(--purple)}
.pool-icon{font-size:23px!important;filter:saturate(1.2);transition:transform .2s}
.pool-option.selected .pool-icon{transform:scale(1.15) rotate(-7deg)}
.pool-copy{display:grid;min-width:0;gap:4px}
.pool-copy strong{font-size:11px}
.pool-copy small{color:var(--muted);font-size:9px;white-space:nowrap}
.match-settings{margin-top:17px;padding:15px;border:1px solid #ffffff12;border-radius:15px;background:#191926aa}
.start-sticky{margin-top:18px}
.start-cta{min-height:56px;font-size:15px}
.rows-slider{touch-action:pan-y}
.touch-game{display:grid;gap:14px;margin:18px 0;padding:16px;border:1px solid #ffffff15;border-radius:20px;background:linear-gradient(145deg,#b99aff0d,#191926 65%);text-align:center}
.play-screen.touch-screen{animation:none}
.touch-instruction{margin:0;color:#d2cfe0;font-size:14px;line-height:1.5}
.touch-button{min-height:54px;font-size:14px;touch-action:manipulation}
.touch-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.touch-black{display:grid;min-height:190px;place-items:center;border:1px solid #ffffff18;border-radius:16px;background:#000;color:#d6ff6b;font-size:15px}
.reaction-pad{display:grid;width:100%;min-height:190px;place-items:center;border:1px solid #ffffff25;border-radius:20px;background:#c62643;color:white;font-size:21px;font-weight:900;letter-spacing:.08em;touch-action:none}
.reaction-pad.green{background:#17a974;box-shadow:inset 0 0 55px #baff6530}
.reaction-pad.red{background:#c62643}
.stroop-word{padding:22px 0;font:900 clamp(42px,13vw,76px)/1 "Space Grotesk",sans-serif}
.memory-grid{display:grid;width:min(100%,330px);grid-template-columns:repeat(3,1fr);gap:9px;margin:0 auto}
.memory-cell{aspect-ratio:1;border:1px solid #ffffff25;border-radius:15px;background:#29283a;touch-action:manipulation}
.memory-cell.lit{background:var(--lime);box-shadow:0 0 25px #d6ff6b99;transform:scale(.97)}
.memory-cell:disabled{opacity:1}
.hot-potato{font-size:70px;animation:potato-wobble .55s infinite alternate ease-in-out}
.touch-turn{color:var(--muted);font-size:13px}
.touch-turn strong{color:var(--lime)}
.touch-timer{color:var(--lime);font:700 35px "Space Grotesk",sans-serif;font-variant-numeric:tabular-nums}
.math-equation{font:700 clamp(42px,12vw,68px) "Space Grotesk",sans-serif}
.touch-opinion{padding:13px;border:1px solid #b99aff36;border-radius:14px;background:#b99aff0b;font-size:19px;font-weight:800;line-height:1.4}
.touch-range{accent-color:var(--purple);touch-action:pan-y}
.fortune-wheel{position:relative;width:min(78vw,310px);aspect-ratio:1;margin:0 auto;border:8px solid #d6ff6b;border-radius:50%;background:conic-gradient(#ff6384 0 45deg,#b99aff 45deg 90deg,#51d4bd 90deg 135deg,#ffd36b 135deg 180deg,#ff6384 180deg 225deg,#b99aff 225deg 270deg,#51d4bd 270deg 315deg,#ffd36b 315deg);box-shadow:0 0 24px #b99aff35;transition:transform 2.2s cubic-bezier(.13,.7,.12,1);transform:rotate(var(--rotation,0deg))}
.fortune-wheel::after{position:absolute;top:-18px;left:calc(50% - 12px);width:0;height:0;border-right:12px solid transparent;border-bottom:25px solid #fff;border-left:12px solid transparent;content:""}
.fortune-wheel.spinning{transform:rotate(var(--rotation))}
.wheel-labels{position:absolute;inset:0}
.wheel-labels span{position:absolute;top:8%;left:50%;width:43%;transform:rotate(calc(var(--i)*45deg)) translateX(3%);transform-origin:left center;color:#17141c;font-size:9px;font-weight:900;text-align:right}
.touch-canvas{display:block;width:100%;height:auto;border:1px solid #ffffff22;border-radius:15px;background:#11111b;touch-action:none}
.secret-word{padding:20px;border:1px solid #b99aff50;border-radius:16px;background:#b99aff14;color:var(--lime);font:800 30px "Space Grotesk",sans-serif;letter-spacing:.08em}
.decoder-text{padding:14px;border:1px solid #ffffff20;border-radius:14px;background:#11111b;font-size:17px;font-weight:800}
.decoder-input{font-size:16px}
.balance-track{position:relative;height:56px;overflow:hidden;border:1px solid #ffffff30;border-radius:99px;background:#282738}
.balance-zone{position:absolute;top:0;bottom:0;left:40%;width:20%;background:#d6ff6b30;box-shadow:inset 0 0 14px #d6ff6b30}
.balance-ball{position:absolute;top:50%;width:26px;height:26px;border:3px solid white;border-radius:50%;background:#ff5274;box-shadow:0 0 14px #ff5274;transform:translate(-50%,-50%)}
.balance-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.balance-controls .button{min-height:60px;font-size:24px;touch-action:none}
.card-duel{display:flex;align-items:center;justify-content:center;gap:18px}
.card-duel>span{color:var(--muted);font-size:12px;font-weight:900}
.card-duel .playing-card{width:72px;height:102px;font-size:28px}
.category-card{display:flex;align-items:center;justify-content:center;gap:18px;padding:17px;border:1px solid #ffffff20;border-radius:16px;background:#11111b}
.category-card span{font-size:17px}
.category-card strong{display:grid;width:58px;height:58px;place-items:center;border-radius:17px;background:var(--purple);color:#17141c;font:800 32px "Space Grotesk",sans-serif}
.pairs-grid{display:grid;width:min(100%,350px);grid-template-columns:repeat(3,1fr);gap:9px;margin:0 auto}
.pair-card{aspect-ratio:1;border:1px solid #b99aff6b;border-radius:14px;background:#242235;color:var(--purple);font-size:30px;font-weight:900;touch-action:manipulation}
.pair-card.flipped{background:#f7f3fb;color:#191722}
.touch-safe{border-color:#d6ff6b55;background:#d6ff6b0c}
@keyframes potato-wobble{to{transform:rotate(14deg) scale(1.05)}}
@keyframes club-glow{from{transform:translate3d(-1%,0,0) scale(1)}to{transform:translate3d(1%,2%,0) scale(1.05)}}
@media(max-width:640px){
  .app-shell{padding-right:16px;padding-left:16px}
  .home-screen{padding-top:5vh;padding-bottom:105px}
  .home-screen h1{font-size:clamp(46px,13vw,68px)}
  .start-sticky{position:sticky;z-index:5;bottom:0;margin:18px -16px 0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(180deg,#10101b00,#10101bf2 22%,#10101b 100%);backdrop-filter:blur(12px)}
  .start-cta{min-height:58px;border-radius:16px}
  .mode-grid{gap:9px}
  .mode-card{min-height:142px;padding:12px}
  .mode-card strong{font-size:14px}
  .mode-card small{font-size:11px}
  .online-panel{margin-top:22px}
  .touch-game{padding:13px}
  .touch-options .touch-button{padding:9px;font-size:12px}
}
@media(max-width:390px){
  .app-shell{padding-right:13px;padding-left:13px}
  .start-sticky{margin-right:-13px;margin-left:-13px;padding-right:13px;padding-left:13px}
  .mode-card>.mode-badge{top:10px;right:39px;bottom:auto;font-size:8px}
  .game-pool-grid{grid-template-columns:1fr}
}
@media(hover:none){.mode-card:hover,.pool-option:hover,.button:not(:disabled):hover{transform:none}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
