:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#edf4ff;background:#080c14;font-synthesis:none;--pink:#ff728e;--amber:#ffc76c;--violet:#ab99ff;--aqua:#5be3d6;--muted:#97a7bf;--stroke:#263247}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{position:fixed;inset:0;touch-action:none;user-select:none;-webkit-user-select:none}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:focus-visible,input:focus-visible{outline:2px solid #a8c7ff;outline-offset:3px}.hidden{display:none!important}.screen{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
#hub{display:flex;flex-direction:column;padding:clamp(12px,2.1vw,30px) clamp(18px,3vw,56px) 12px;background:radial-gradient(ellipse at 50% 15%,#192338 0%,#0b111d 46%,#080c14 100%)}#hub:before{content:"";position:absolute;inset:0;opacity:.23;background-image:linear-gradient(#748aa10c 1px,transparent 1px),linear-gradient(90deg,#748aa10c 1px,transparent 1px);background-size:46px 46px;pointer-events:none}#hub>*{position:relative;z-index:1}
.masthead{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px}.brand{display:flex;align-items:center;gap:13px;min-width:0}.brand-mark{width:36px;height:36px;display:grid;grid-template-columns:1fr 1fr;gap:4px;transform:rotate(-12deg)}.brand-mark i{border-radius:4px;background:var(--pink)}.brand-mark i:nth-child(2){background:var(--amber)}.brand-mark i:nth-child(3){background:var(--aqua)}.brand-mark i:nth-child(4){background:var(--violet)}.brand strong{display:block;font-size:clamp(20px,2.1vw,30px);font-weight:950;letter-spacing:-.065em;line-height:.9}.brand strong span{color:#96a5bb}.brand small{display:block;color:#8998b1;letter-spacing:.23em;font-size:9px;font-weight:900;margin-top:8px}.top-actions{display:flex;align-items:center;gap:8px}.device-chip{font-size:10px;color:#899bb4;font-weight:800;letter-spacing:.12em;white-space:nowrap;margin-right:15px}.utility{color:#d9e5fa;font-size:11px;font-weight:900;letter-spacing:.07em;border:1px solid #36475f;background:#172235;min-height:41px;border-radius:10px;padding:0 15px;display:flex;align-items:center;gap:9px;white-space:nowrap}.utility:active,.button:active,.game-card:active{transform:scale(.98)}.utility:hover{border-color:#7999b9}.primary-outline{background:#e8eef9;border-color:#e8eef9;color:#101827}.btn-icon{font-size:20px;font-weight:400;line-height:1}
.intro{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;gap:28px;padding:clamp(17px,3vh,34px) 0 clamp(15px,2.4vh,24px);border-bottom:1px solid #263248}.eyebrow,.modal-eyebrow{font-size:10px;font-weight:900;letter-spacing:.19em;color:#a8b9d0;display:flex;align-items:center;gap:9px}.live-dot,.signal{display:inline-block;width:7px;height:7px;border-radius:50%;background:#5de3d4;box-shadow:0 0 12px #5de3d4a9}h1{font-size:clamp(26px,3.2vw,53px);letter-spacing:-.065em;margin:10px 0 5px;line-height:1.08;font-weight:950}h1 em{color:#95aaff;font-style:normal}.intro p{color:#99a9c1;margin:9px 0 0;font-size:clamp(11px,1.1vw,14px);line-height:1.4}.players-preview{width:clamp(220px,28vw,370px);flex-shrink:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.player-pill{display:flex;gap:6px;flex-direction:column;align-items:center;justify-content:center;padding:11px 6px;border:1px solid #364256;border-radius:9px;background:#121a29;min-width:0}.player-pill b{font-size:12px;color:#fff}.player-pill span{font-size:10px;font-weight:800;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:100%;color:#a3b3c9}.dot{display:block;width:6px;height:6px;border-radius:50%}
.shelf{display:flex;flex-direction:column;flex:1;min-height:0;padding-top:clamp(10px,1.7vh,17px)}.shelf-label{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;min-height:30px;padding-bottom:9px}.shelf-label h2{font-size:11px;letter-spacing:.15em;margin:0;font-weight:950;color:#cad5e5}.shelf-label .count{color:#7d8ca6;margin-left:8px}.shelf-label>span{color:#657792;font-size:9px;letter-spacing:.14em;font-weight:900}.game-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:clamp(8px,1.3vw,16px);padding-bottom:3px}.game-card{border:1px solid #30405a;text-align:left;background:#141e30;border-radius:14px;position:relative;overflow:hidden;color:#f5f8ff;padding:0;min-width:0;min-height:0;transition:border-color .16s,transform .16s,box-shadow .16s;display:flex;flex-direction:column}.game-card:hover{border-color:#8c9bb7;box-shadow:0 12px 28px #0006;transform:translateY(-2px)}.game-card.featured{grid-column:span 1}.card-art{flex:1;position:relative;min-height:0;overflow:hidden;background:#101927;display:grid;place-items:center}.card-art:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 70%,var(--tint, #657fff) 0%,transparent 65%);opacity:.13}.art-svg{height:100%;width:100%;display:block;max-height:200px}.card-info{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:clamp(10px,1.6vh,15px) clamp(11px,1.4vw,18px);border-top:1px solid #2b3b52;background:#172236;min-height:65px}.card-name{display:flex;flex-direction:column;gap:6px;min-width:0}.card-name strong{font-size:clamp(13px,1.45vw,18px);letter-spacing:-.035em;line-height:1;font-weight:950}.card-name small{color:#9bacc4;font-size:clamp(9px,.85vw,11px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-arrow{height:36px;width:36px;border:1px solid #45556b;border-radius:9px;display:grid;place-items:center;font-size:21px;flex-shrink:0;background:#223149}.card-number{position:absolute;top:12px;left:14px;font-size:10px;font-weight:900;letter-spacing:.13em;color:#a5b2c7}.card-badge{position:absolute;top:10px;right:11px;background:#e5edff;color:#142038;padding:5px 8px;border-radius:5px;font-size:9px;font-weight:900;letter-spacing:.06em}.game-card.empty{background:transparent;border:1px dashed #2c384b;justify-content:center;align-items:center;pointer-events:none;min-height:0}.empty-inner{display:grid;gap:7px;text-align:center;color:#60718b}.empty-inner span{font-size:28px}.empty-inner b{font-size:12px;letter-spacing:.13em}.empty-inner small{font-size:10px}
.hub-foot{min-height:35px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:9px;font-weight:800;letter-spacing:.07em;color:#74869f}.hub-foot>span{display:flex;align-items:center;gap:9px}.hub-foot .signal{width:6px;height:6px}
#play{background:#090e18}#arena,#legacy{width:100%;height:100%;position:absolute;inset:0;display:block;border:0;touch-action:none}#legacy{background:#090e18}.game-controls{position:absolute;inset:10px 10px auto 10px;z-index:8;display:flex;align-items:center;gap:8px;pointer-events:none}.game-controls>*{pointer-events:auto}.game-control{height:41px;min-width:41px;padding:0 13px;border-radius:10px;color:#eaf0fa;background:#101927e8;border:1px solid #34445d;font-size:17px;font-weight:950;box-shadow:0 4px 10px #0004}.game-control:hover{background:#243249}.game-control:active{transform:scale(.96)}.game-control.home-control{display:flex;align-items:center;gap:6px;font-size:20px}.home-control span{font-size:10px;letter-spacing:.09em;font-weight:900}.mode-chip{margin-left:3px;background:#101927c9;border:1px solid #32425b;padding:10px 14px;border-radius:10px;letter-spacing:.11em;font-size:10px;font-weight:950;color:#b3c3d9}.control-spacer{flex:1}.modal-backdrop{position:absolute;z-index:25;inset:0;background:#060a12ca;display:grid;place-items:center;padding:20px;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.modal{width:min(470px,94vw);max-height:95dvh;overflow:auto;touch-action:pan-y;padding:30px;border:1px solid #394a61;border-radius:18px;background:linear-gradient(145deg,#17243a,#101927);box-shadow:0 28px 85px #0009}.modal h2{font-size:34px;letter-spacing:-.055em;margin:9px 0}.modal p{color:#a0b0c8;font-size:13px;line-height:1.5;margin:8px 0 23px}.modal-actions{display:flex;align-items:center;gap:9px;margin-top:20px}.button{font-size:12px;font-weight:900;letter-spacing:.06em;border-radius:10px;padding:14px 15px;border:1px solid #46556d;min-width:0;flex:1}.button.solid{background:#e8efff;color:#111a28;border-color:#e8efff}.button.ghost{background:#1c2a40;color:#d8e2f3}.player-inputs{display:grid;gap:11px}.player-field{display:flex;align-items:center;gap:12px;padding:9px 11px;border:1px solid #34435b;background:#0d1727;border-radius:10px}.player-field span{font-size:10px;letter-spacing:.07em;font-weight:950;min-width:55px}.player-field input{min-width:0;width:100%;padding:10px 0;background:none;border:0;outline:none;color:#fff;font-weight:800;font-size:15px;touch-action:auto;user-select:text;-webkit-user-select:text}.winner-badge{margin:20px auto 8px;width:76px;height:76px;display:grid;place-items:center;border:1px solid #52607c;border-radius:22px;font-size:27px;font-weight:950}.score-list{display:grid;gap:7px;margin:16px 0}.score-item{display:flex;align-items:center;justify-content:space-between;background:#101c2c;border:1px solid #2c3b51;border-radius:8px;padding:11px 13px;font-size:13px;font-weight:850}.score-item b{font-size:18px}.winner-title{font-size:30px!important}.hint{color:#8598b0;font-size:11px;margin-top:12px}.result-note{text-align:center;font-size:12px;color:#a6b6cc}
@media(max-height:740px){#hub{padding-top:13px;padding-bottom:5px}.masthead{min-height:39px}.intro{padding:11px 0 12px}h1{font-size:clamp(27px,3vw,40px)}.intro p{margin-top:5px}.player-pill{padding:7px 5px}.card-info{min-height:53px;padding:9px 14px}.card-arrow{height:31px;width:31px}.hub-foot{min-height:24px}}@media(max-width:900px){.device-chip{display:none}.brand small{font-size:8px}.game-grid{gap:8px}.players-preview{width:250px}.game-card.featured{grid-column:auto}}@media(max-width:680px){#hub{padding:12px}.brand strong{font-size:20px}.brand small{font-size:7px}.intro{flex-direction:column;align-items:flex-start;gap:10px}.intro p{display:none}.players-preview{width:100%}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr))}.hub-foot{font-size:7px}.hub-foot>span:last-child{display:none}.utility{padding:0 8px;min-height:36px}.fsText{display:none}.card-name small{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Five cards fill the available board: three on the first row, two wide on the second. */
@media(min-width:681px){.game-card:nth-child(4),.game-card:nth-child(5){grid-column:span 1}.game-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.game-card{grid-column:span 2!important}.game-card:nth-child(4),.game-card:nth-child(5){grid-column:span 3!important}}