/* Member clubhouse: a rink at night, a warm stack of chips, room for the crew. */
.hub-page { --hub-accent:var(--gold); --hub-line:var(--border); min-width:0; }
.hub-hero { position:relative; overflow:hidden; display:grid; grid-template-columns:1.3fr .7fr; min-height:325px; border:1px solid #304766; border-radius:24px; background:linear-gradient(110deg,#152841ed,#0b1827a8),url('/static/img/arena.svg') center/cover; margin:4px 0 24px; }
.hub-hero-copy { position:relative; z-index:1; padding:36px 40px; }
.hub-hero h1 { margin:14px 0; font:700 clamp(48px,6vw,76px)/.92 var(--font-display); letter-spacing:.015em; }
.hub-hero-copy>p:last-of-type { max-width:430px; color:#bbcadd; font-size:14px; line-height:1.65; }
.hub-hero .eyebrow { color:#edc984; }
.hub-hero-links { display:flex; gap:10px; flex-wrap:wrap; margin-top:24px; }
.hub-hero .btn-primary,.hub-wallet .btn-primary,.hub-market .btn-primary { background:var(--gold); border-color:var(--gold); color:#101b28; }
.hub-hero-art { position:relative; align-self:center; justify-self:center; width:260px; height:260px; display:grid; place-items:center; }
.hub-puck { position:relative; z-index:1; display:grid; place-items:center; width:132px; height:132px; border-radius:50%; color:#e6c386; border:9px double #c3a36a; box-shadow:0 16px 0 #050c15,0 26px 40px #0009,inset 0 0 0 13px #142841; background:repeating-linear-gradient(45deg,#102238,#102238 6px,#172c44 6px,#172c44 7px); font:700 80px var(--font-display); transform:rotate(-16deg); }
.hub-orbit { position:absolute; inset:3px; border:1px solid #6c91b94d; border-radius:50%; transform:rotate(-30deg) scaleY(.58); }
.orbit-two { inset:-20px; transform:rotate(35deg) scaleY(.63); border-style:dashed; }
.hub-jumps { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.hub-jumps a { display:flex; align-items:center; min-height:42px; padding:9px 15px; border:1px solid #2c3b52; border-radius:30px; background:#111d30; color:#c2cede; font-size:12px; font-weight:600; text-decoration:none; }
.hub-jumps a:hover { background:#1c2d46; border-color:#647c9a; color:#fff; }
.hub-feedback { min-height:22px; margin:12px 0; color:#d9c99f; font-size:13px; }
.hub-feedback.is-error { color:#ffb5b9; }
.hub-layout { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(250px,1fr); align-items:start; gap:24px; }
.hub-main,.hub-aside { display:flex; flex-direction:column; gap:28px; min-width:0; }
.hub-section { min-width:0; scroll-margin-top:100px; }
.hub-section-head { margin-bottom:20px; }
.hub-section-head .eyebrow { margin:0 0 7px; color:#bca578; }
.hub-section-head h2 { font:600 36px/1.05 var(--font-display); margin:0 0 10px; letter-spacing:.01em; }
.hub-section-head p:not(.eyebrow) { font-size:13px; color:var(--muted); margin:0; line-height:1.7; max-width:65ch; }
.hub-small { color:#adbbce; font-size:11px; line-height:1.6; }
.hub-empty { font-size:13px; line-height:1.7; color:#b3c0d1; padding:20px 0; }
.hub-empty-card { display:flex; align-items:center; gap:24px; background:linear-gradient(135deg,#172b40,var(--surface)); border:1px solid var(--border); border-radius:18px; padding:32px; margin-bottom:20px; }
.hub-empty-mark { display:grid; place-items:center; width:68px; height:68px; flex-shrink:0; border:1px solid #48617d; border-radius:50%; color:#c0d1e5; font:600 30px var(--font-display); }
.hub-empty-card h3 { margin:0 0 7px; font-size:16px; }
.hub-empty-card p { margin:0; color:#aab9cb; font-size:12px; line-height:1.6; }
.hub-text-link { display:inline-block; padding:10px 0; color:#d7bd8d; font-size:12px; text-underline-offset:4px; }
.hub-bet-groups { margin-bottom:12px; }
.hub-bet-group>h3 { margin:0 0 16px; font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.hub-bet-list { list-style:none; padding:0; margin:0 0 24px; display:grid; gap:12px; }
.hub-bet-list>li { border:1px solid var(--border); border-left:3px solid #6688a3; border-radius:10px; background:var(--surface); padding:22px; }
.hub-bet-top { display:flex; align-items:start; justify-content:space-between; gap:12px; }
.hub-bet-top>strong { font-size:15px; line-height:1.45; }
.hub-bet-list p { margin:10px 0 0; font-size:12px; color:#b3c2d4; line-height:1.65; white-space:pre-line; }
.hub-pill { display:inline-flex; padding:5px 9px; border-radius:20px; background:#223c41; color:#c0e0d4; font-size:10px; font-weight:600; white-space:nowrap; }
.hub-inline-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.hub-inline-actions .btn { font-size:11px; padding:9px 14px; }
.hub-wallet { padding:26px; border:1px solid #83704c; border-radius:18px; background:radial-gradient(ellipse at top right,#a8873c33,transparent 70%),linear-gradient(125deg,#282723,#142133); scroll-margin-top:100px; }
.hub-wallet .eyebrow { margin:0 0 17px; color:#d7bd8d; }
.hub-balance { font:600 56px/1 var(--font-display); letter-spacing:.01em; color:#f4e3bf; font-variant-numeric:tabular-nums; }
.hub-wallet-unit { color:#c6b99c; font-size:12px; margin:5px 0 22px; }
.hub-wallet-actions { display:flex; flex-direction:column; align-items:stretch; gap:10px; }
.hub-wallet-actions .btn { width:100%; font-size:12px; }
.hub-wallet-actions p { margin:0 0 4px; }
.hub-wallet>.hub-text-link { margin-top:12px; }
.hub-markets { display:grid; gap:16px; }
.hub-market { border:1px solid var(--border); border-radius:18px; background:linear-gradient(135deg,#172c41,var(--surface)); padding:28px; min-width:0; box-shadow:0 12px 32px #02071124,inset 0 1px 0 #c1d9ee08; }
.hub-market.has-bet { border-color:#537b72; }
.hub-market-meta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-bottom:16px; }
.hub-market-meta .eyebrow { margin:0; color:#b8cae0; font-size:10px; }
.hub-market h3 { margin:0 0 15px; font:600 29px/1.15 var(--font-display); }
.hub-market-form { display:grid; grid-template-columns:minmax(0,1fr) 88px auto; align-items:end; gap:10px; margin:18px 0 12px; }
.hub-market-form .field { min-width:0; gap:7px; }
.hub-market-form label { font-size:11px; color:#b8c6d9; }
.hub-market-form select,.hub-market-form input { width:100%; min-width:0; min-height:44px; border:1px solid #415671; background:#0c1728; border-radius:9px; color:#eef2f8; font:12px var(--font-text); padding:10px; }
.hub-market-form .btn { min-height:44px; padding:10px 16px; font-size:12px; }
.hub-bet-rule { color:#b2bfd0; font-size:10px; line-height:1.7; margin:9px 0 0; }
.hub-saved-bet { font-size:13px; color:#bddcca; margin:16px 0 0; }
.hub-access-note { background:#2b271e; border:1px solid #756344; color:#e4d2ab; border-radius:10px; padding:15px; font-size:12px; line-height:1.6; }
.hub-activity-list { display:grid; gap:12px; }
.hub-activity { padding:23px 24px; border:1px solid var(--border); border-radius:12px; background:var(--surface); }
.hub-activity h3 { margin:0 0 8px; font:600 21px var(--font-display); }
.hub-activity p,.hub-duels p { font-size:12px; line-height:1.6; color:#aebed2; margin:0 0 7px; }
.hub-duels { border:1px solid var(--border); padding:26px; border-radius:16px; background:linear-gradient(135deg,#172b3e,var(--surface)); }
.hub-duels h2 { font:600 23px var(--font-display); margin:0 0 12px; }
.hub-duels .btn { width:100%; font-size:12px; margin-top:9px; }
.hub-news { margin-top:40px; }
.hub-shop,.hub-more { margin-top:40px; }
.hub-shop-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.hub-shop-product { display:flex; flex-direction:column; padding:26px; border:1px solid #b49b6d30; border-radius:16px; background:radial-gradient(ellipse at top right,#c09b5620,transparent 70%),var(--surface); min-width:0; }
.hub-product-mark { display:grid; place-items:center; width:48px; height:48px; border:2px solid #d0b47f; background:#755d32; color:#ffedbf; border-radius:50%; font:600 28px var(--font-display); margin-bottom:20px; }
.hub-product-mark.badge { border-radius:13px; background:#273f5f; border-color:#789fcf; color:#cee4ff; }
.hub-shop-product h3 { font:600 23px/1.15 var(--font-display); margin:0 0 10px; }
.hub-shop-product p { font-size:11px; line-height:1.6; color:#b3c2d5; margin:0 0 18px; }
.hub-shop-product>strong { color:#ead2a0; font-size:13px; margin-top:auto; }
.hub-shop-product>.btn { width:100%; font-size:11px; margin-top:16px; }
.hub-shop-offers { display:grid; gap:12px; margin:0 0 22px; }
.hub-shop-offer { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:24px; border:1px solid #a48a5e; border-radius:15px; background:#2d281f; }
.hub-shop-offer .eyebrow { margin:0 0 10px; color:#d5b476; }
.hub-shop-offer h3 { font:600 25px var(--font-display); margin:0 0 8px; }
.hub-shop-offer p { color:#e2ceb0; font-size:12px; margin:5px 0; }
.hub-shop-offer .hub-inline-actions { margin-top:0; }
.hub-custom-shop { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:20px; }
.hub-custom-product { padding:24px; border:1px solid #324761; border-radius:15px; background:#101d30; min-width:0; }
.hub-custom-product>h3,.hub-community-group>h3,.hub-bracket>h3,.hub-role-panels>h3 { font:600 27px var(--font-display); margin:0 0 15px; }
.hub-member-form { min-width:0; }
.hub-form-description { font-size:12px; color:#aec0d7; line-height:1.7; margin:0 0 18px; }
.hub-member-fields { display:grid; gap:16px; }
.hub-member-field { min-width:0; gap:7px; }
.hub-member-field label { font-size:11px; color:#bbcee4; }
.hub-member-field input:not([type=checkbox]),.hub-member-field select,.hub-member-confirm input { min-width:0; width:100%; min-height:44px; border:1px solid #455e7c; border-radius:8px; background:#091627; color:#ecf2fb; font:12px var(--font-text); padding:12px; }
.hub-member-field input[type=checkbox] { width:18px; height:18px; accent-color:#e0bb78; flex-shrink:0; }
.hub-checkbox-field label { display:flex; align-items:center; gap:10px; min-height:44px; line-height:1.6; }
.hub-member-form>.btn { margin-top:18px; min-height:44px; font-size:12px; }
.hub-member-form .hub-small { margin:0; }
.hub-member-confirm { margin-top:20px; padding:18px; border:1px solid #82525a; background:#39232b; border-radius:9px; }
.hub-member-confirm p { font-size:12px; line-height:1.65; color:#ecc0c8; margin:0 0 13px; }
.hub-member-confirm label { display:block; color:#e8c4cc; font-size:11px; margin-bottom:8px; }
.hub-community-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
.hub-community-group { min-width:0; }
.hub-command { overflow:hidden; border:1px solid #354c68; border-radius:10px; margin:10px 0; background:#111e30; }
.hub-command>summary { min-height:52px; padding:16px 18px; cursor:pointer; color:#d3e1f2; font-size:12px; font-weight:500; }
.hub-command[open]>summary { border-bottom:1px solid #2f4763; background:#1a2c42; }
.hub-command>.hub-member-form { padding:22px 18px; }
.hub-command-reply { padding:17px; border:1px solid #4c705e; border-radius:10px; background:#132d27; color:#c1dfd1; margin-top:20px; overflow-wrap:anywhere; }
.hub-command-reply p { white-space:pre-line; font-size:12px; line-height:1.75; margin:8px 0; }
.hub-command-reply h4 { font:600 23px var(--font-display); margin:0 0 12px; }
.hub-reply-embed { border-top:1px solid #3c6255; padding-top:14px; margin-top:14px; }
.hub-reply-embed strong { color:#d9eee4; font-size:12px; }
.hub-role-panels,.hub-bracket { border:1px solid #344c68; border-radius:15px; padding:24px; background:#101e30; margin-bottom:26px; }
.hub-memories { border:1px solid #344c68; border-radius:15px; padding:24px; background:#101e30; margin-bottom:26px; }
.hub-memories>h3 { font:600 27px var(--font-display); margin:0 0 15px; }
.hub-memories-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:20px; }
.hub-memory { padding:18px; border:1px solid #334c68; border-radius:10px; background:#122237; }
.hub-memory h4 { font-size:14px; margin:0; }
.hub-memory>.btn { font-size:11px; margin-top:12px; }
.hub-role-panel { border-top:1px solid #304760; padding-top:18px; margin-top:18px; }
.hub-role-panel h4 { color:#c7d6e8; font-size:13px; margin:0 0 12px; }
.hub-bracket-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.hub-bracket-grid>.hub-member-form { border:1px solid #2e4662; border-radius:10px; padding:18px; background:#122237; }
.hub-bracket-leaders { list-style:none; padding:0; margin:24px 0 0; }
.hub-bracket-leaders li { display:flex; justify-content:space-between; gap:15px; padding:11px 0; border-top:1px solid #30475f; font-size:12px; color:#bed0e4; }
.hub-news-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.hub-news-card { display:flex; flex-direction:column; min-width:0; padding:26px 4px; border:0; border-top:2px solid #7897ad55; border-radius:0; background:transparent; }
.hub-news-meta { display:flex; align-items:center; gap:10px; color:#9eb3cd; font-size:10px; margin-bottom:20px; }
.hub-news-card h3 { margin:0 0 17px; font:600 29px/1.1 var(--font-display); }
.hub-news-card h3 a { color:#e8eff7; text-decoration:none; }
.hub-news-card h3 a:hover { color:#f2d099; text-decoration:underline; text-underline-offset:4px; }
.hub-news-card>p { color:#b1bfd0; font-size:12px; line-height:1.65; }
.hub-news-card>p:last-child { margin-top:auto; padding-top:14px; margin-bottom:0; font-size:10px; }
.hub-receipt { display:flex; justify-content:space-between; align-items:center; gap:20px; border:1px solid #c5a168; border-radius:16px; padding:22px; background:#30291f; margin-bottom:24px; }
.hub-receipt h2 { font:600 25px var(--font-display); margin:0 0 7px; }
.hub-receipt p { font-size:12px; line-height:1.65; color:#e3d1b0; margin:0; }
.hub-page input:focus-visible,.hub-page select:focus-visible,.hub-page button:focus-visible,.hub-page a:focus-visible { outline:3px solid #9cceff; outline-offset:4px; }
.hub-page button:disabled,.hub-page input:disabled,.hub-page select:disabled { cursor:not-allowed; opacity:.5; }
@media(max-width:900px) { .hub-hero { grid-template-columns:1.6fr .6fr; } .hub-hero-copy { padding:30px; } .hub-hero-art { width:180px; height:180px; } .hub-puck { width:105px; height:105px; font-size:62px; } .hub-layout { grid-template-columns:minmax(0,1.5fr) minmax(230px,1fr); gap:20px; } .hub-market-form { grid-template-columns:minmax(0,1fr) 80px; } .hub-market-form>.btn { grid-column:1/-1; } .hub-news-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:650px) { .hub-hero { display:block; min-height:0; } .hub-hero-copy { padding:28px 24px; } .hub-hero-art { position:absolute; right:-35px; top:40px; opacity:.22; } .hub-hero h1 { font-size:58px; } .hub-hero-copy>p:last-of-type { max-width:310px; } .hub-hero-links .btn { flex:1; font-size:11px; padding:12px; } .hub-layout { display:flex; flex-direction:column; } .hub-main,.hub-aside { width:100%; } .hub-aside { gap:24px; } .hub-section-head h2 { font-size:29px; } .hub-market { padding:20px; } .hub-market-form { grid-template-columns:minmax(0,1fr) 85px; } .hub-bet-top { flex-direction:column; gap:9px; } .hub-news-grid { grid-template-columns:1fr; } .hub-empty-card { padding:20px; gap:16px; } .hub-empty-mark { width:52px; height:52px; font-size:24px; } .hub-receipt { align-items:stretch; flex-direction:column; } .hub-receipt .btn { width:100%; } }
@media(prefers-reduced-motion:reduce) { .hub-page * { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
@media(max-width:900px) { .hub-shop-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .hub-bracket-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:650px) { .hub-shop-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .hub-shop-product { padding:18px 15px; } .hub-shop-product h3 { font-size:22px; } .hub-custom-shop,.hub-community-grid,.hub-bracket-grid { grid-template-columns:1fr; } .hub-custom-product,.hub-role-panels,.hub-bracket { padding:20px; } .hub-shop-offer { align-items:stretch; flex-direction:column; padding:22px; } .hub-shop-offer .hub-inline-actions { flex-direction:column; } .hub-shop-offer .btn { width:100%; } .hub-command>.hub-member-form { padding:20px 16px; } .hub-member-form>.btn { width:100%; } }
@media(max-width:650px) { .hub-memories { padding:20px; } .hub-memories-grid { grid-template-columns:1fr; } }

/* Compact navigation keeps one task in view without discarding the others. */
.hub-welcome { display:flex; justify-content:space-between; align-items:center; gap:28px; margin:8px 0 16px; }
.hub-welcome h1 { font:700 clamp(40px,5vw,60px)/.98 var(--font-display); margin:0 0 12px; letter-spacing:.01em; }
.hub-welcome p { color:var(--text-2); font-size:14px; line-height:1.7; margin:0; }
.hub-welcome-links { display:flex; flex-wrap:wrap; gap:18px; flex-shrink:0; }
.hub-welcome-links a { font-size:12px; }
.hub-feedback { margin:0 0 12px; min-height:18px; }
.hub-wallet { display:grid; grid-template-columns:minmax(160px,1fr) auto auto; align-items:center; gap:20px; padding:16px 22px; margin-bottom:24px; background:radial-gradient(ellipse at 0 0,#99713522,transparent 65%),linear-gradient(110deg,#252c30,#13253b); border-color:#c9a56b55; box-shadow:0 16px 40px #02071135,inset 0 1px 0 #efd5a614; }
.hub-wallet-total { display:flex; flex-wrap:wrap; align-items:baseline; gap:10px; }
.hub-wallet-total h2 { width:100%; font-size:12px; color:#d1ba8f; font-weight:500; text-transform:uppercase; letter-spacing:.08em; margin:0; }
.hub-wallet .hub-balance { font:600 36px/1 var(--font-display); color:#f1dbb4; letter-spacing:.015em; }
.hub-wallet .hub-wallet-unit { margin:0; font-size:11px; }
.hub-wallet-actions { gap:6px; }
.hub-wallet-actions .btn { min-height:44px; width:auto; padding:10px 16px; }
.hub-wallet-actions .hub-small { margin:0; font-size:10px; }
.hub-wallet-options { position:relative; align-self:center; }
.hub-wallet-options>summary { min-height:44px; display:flex; align-items:center; gap:8px; font-size:12px; color:#d6c7a8; cursor:pointer; }
.hub-wallet-options>summary::after { content:"+"; font-size:17px; }
.hub-wallet-options[open]>summary::after { content:"\2212"; }
.hub-wallet-options>div { position:absolute; top:calc(100% + 12px); right:0; z-index:5; width:270px; max-width:calc(100vw - 50px); background:#182638; border:1px solid #626653; border-radius:12px; padding:20px; box-shadow:0 16px 40px #0007; }
.hub-wallet-options .btn { width:100%; font-size:12px; margin-bottom:12px; }
.hub-wallet-options .hub-small { margin:0; }
.hub-tabs { display:flex; align-items:stretch; gap:8px; overflow-x:auto; padding:4px 2px 10px; margin:0 -2px 14px; scrollbar-width:thin; border-bottom:1px solid var(--border); }
.hub-tabs[hidden] { display:none; }
.hub-page>.rewards-guide { margin-top:24px; }
.hub-tabs>[role=tab] { display:flex; align-items:center; justify-content:center; flex:1 0 auto; min-height:48px; padding:13px 19px; border:1px solid transparent; border-radius:8px; background:transparent; font-size:13px; font-weight:500; color:var(--text-2); text-decoration:none; white-space:nowrap; }
.hub-tabs>[aria-selected=true] { background:#e9bd7112; color:var(--gold); border-color:#e9bd7145; box-shadow:inset 0 -2px 0 var(--gold); }
.hub-tabs>[role=tab]:hover { border-color:#a3b2c5; }
.hub-panel { min-width:0; }
.hub-panel[hidden] { display:none!important; }
.hub-panel>.hub-section { margin-top:0; }
.hub-panel:focus-visible { outline:2px solid #9cceff; outline-offset:7px; border-radius:8px; }
.hub-panel .hub-section-head { margin-bottom:20px; }
.hub-bets-extras { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:30px; }
.hub-bets-extras .hub-activity-list { grid-template-columns:1fr 1fr; }
.hub-bets-extras .hub-activity { padding:20px; }
.hub-bets-extras .hub-activities { min-width:0; }
.hub-bets-extras .hub-duels { min-width:0; }
.hub-bet-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.hub-empty-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.hub-empty-actions .btn { font-size:12px; min-height:44px; }
.hub-markets { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:20px; }
.hub-market-form { grid-template-columns:minmax(0,1fr) 95px; }
.hub-market-form>.btn { grid-column:1/-1; }
.hub-bet-review { padding:20px; background:#26322b; border:1px solid #81916a; border-radius:10px; margin-top:18px; }
.hub-bet-review h4 { font:600 24px var(--font-display); color:#e2e9c9; margin:0 0 13px; }
.hub-bet-review>.hub-small { font-size:10px; margin:0 0 6px; }
.hub-review-question { font-size:13px; font-weight:500; line-height:1.6; margin:0 0 16px; color:#dce8d6; }
.hub-bet-review dl { display:grid; gap:12px; margin:0; }
.hub-bet-review dl>div { display:flex; justify-content:space-between; align-items:start; gap:18px; }
.hub-bet-review dt { color:#b0c3ad; font-size:11px; }
.hub-bet-review dd { color:#edf2db; font-size:12px; font-weight:600; text-align:right; margin:0; }
.hub-review-final { font-size:11px; line-height:1.6; color:#e8d4aa; border-top:1px solid #6b7757; padding-top:15px; margin:16px 0 0; }
.hub-review-balance { color:#ffcfb5; font-size:12px; line-height:1.6; }
.hub-bet-review .hub-inline-actions { margin-top:18px; }
.hub-bet-review .btn { min-height:44px; flex:1; font-size:11px; padding:11px 14px; }
.hub-category { border:1px solid var(--border); border-radius:14px; background:var(--surface); align-self:start; overflow:hidden; min-width:0; }
.hub-category>summary { display:flex; justify-content:space-between; align-items:center; gap:18px; min-height:90px; padding:20px 22px; cursor:pointer; list-style:none; }
.hub-category>summary::-webkit-details-marker { display:none; }
.hub-category>summary strong { display:block; font:600 25px var(--font-display); color:#deebf7; }
.hub-category>summary small { display:block; color:#a7bdd5; font-size:11px; line-height:1.65; margin-top:6px; }
.hub-category-arrow { font-size:25px; color:#afc3dd; line-height:1; }
.hub-category[open]>summary>.hub-category-arrow { transform:rotate(45deg); }
.hub-category[open]>summary { border-bottom:1px solid #304863; background:#172a40; }
.hub-category-body { padding:20px; }
.hub-category-body .hub-command:first-child { margin-top:0; }
.hub-category-body .hub-command:last-child { margin-bottom:0; }
.hub-category-body>.hub-role-panels,.hub-category-body>.hub-bracket,.hub-category-body>.hub-memories { padding:0; border:0; background:transparent; margin:0; }
.hub-category-body .hub-bracket-grid { grid-template-columns:1fr; }
.hub-category-body .hub-memories-grid { grid-template-columns:1fr; }
.hub-tools-retry { padding:20px; border:1px solid #5b5b4a; border-radius:12px; background:#27291f; margin-bottom:20px; }
.hub-tools-retry p { color:#d5d0b5; font-size:13px; line-height:1.6; margin:0 0 12px; }
.hub-manual-ids { padding:18px; }
.hub-page details>summary:focus-visible { outline:3px solid #9cceff; outline-offset:-4px; border-radius:9px; }
@media(max-width:900px) { .hub-bets-extras { grid-template-columns:1fr; } .hub-market-form { grid-template-columns:minmax(0,1fr) 90px; } .hub-wallet { gap:18px; } }
@media(max-width:650px) { .hub-welcome { flex-direction:column; align-items:stretch; gap:8px; margin-bottom:12px; } .hub-welcome h1 { font-size:31px; } .hub-welcome-links { gap:20px; } .hub-welcome-links a { padding:6px 0; } .hub-wallet { grid-template-columns:minmax(0,1fr) auto; gap:12px 18px; padding:17px 18px; margin-bottom:16px; } .hub-wallet .hub-balance { font-size:32px; } .hub-wallet-options { grid-column:1/-1; border-top:1px solid #665e4b; } .hub-wallet-options>summary { min-height:32px; font-size:11px; } .hub-wallet-options>div { top:calc(100% + 8px); left:0; right:auto; max-width:calc(100vw - 70px); } .hub-wallet-actions .btn { padding:10px 12px; font-size:11px; } .hub-wallet-actions .hub-small { max-width:120px; } .hub-tabs { gap:5px; margin-bottom:20px; } .hub-tabs>[role=tab] { padding:11px 15px; font-size:12px; } .hub-bet-groups,.hub-markets { grid-template-columns:1fr; gap:18px; } .hub-bets-extras .hub-activity-list { grid-template-columns:1fr; } .hub-bet-review { padding:18px; } .hub-bet-review .hub-inline-actions { flex-direction:column; } .hub-bet-review .btn { width:100%; } .hub-category>summary { padding:19px; } .hub-category-body { padding:18px 15px; } }
@media(max-width:480px) { .hub-tabs { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); overflow:visible; } .hub-tabs>[role=tab] { grid-column:span 2; min-width:0; min-height:46px; padding:11px 8px; white-space:normal; text-align:center; } .hub-tabs>[role=tab]:nth-child(n+4) { grid-column:span 3; } }
@media(max-width:650px) { .hub-tabs { margin-bottom:14px; } .hub-wallet-options>summary { min-height:44px; font-size:12px; } .hub-wallet { padding:14px 16px; } }

/* A saved wager stays easy to spot; the shared pulse is added only after an acknowledgement. */
.hub-market[data-bet-state="confirmed"],.hub-bet-list>.hub-bet-item[data-bet-state="confirmed"] { border-color:#73bd9a; background:linear-gradient(125deg,#19372f,#122735); box-shadow:0 0 0 1px #8bd9af22,0 0 22px #43b88920,inset 3px 0 0 #86d5ad; }
.hub-market[data-bet-state="confirmed"] .hub-pill,.hub-bet-item[data-bet-state="confirmed"] .hub-pill { color:#e1f9e9; background:#285543; border:1px solid #75bd95; }
.hub-market[data-bet-state="pending"],.hub-bet-list>.hub-bet-item[data-bet-state="pending"],.hub-duels[data-bet-state="pending"] { border-color:#d0b36f; box-shadow:0 0 18px #d4ad4c29; }
.hub-market[data-bet-state="uncertain"],.hub-bet-list>.hub-bet-item[data-bet-state="uncertain"],.hub-duels[data-bet-state="uncertain"] { border-color:#d5b275; border-style:dashed; box-shadow:0 0 18px #c9963e25; }
.hub-market[data-bet-state="uncertain"] .hub-pill,.hub-bet-item[data-bet-state="uncertain"] .hub-pill { background:#50412a; color:#ffe5b1; }
.hub-market[data-bet-state="locked"] { border-color:#596b7e; }
.hub-feedback[data-bet-state="confirmed"] { padding:12px 16px; border:1px solid #699e7f; border-radius:10px; background:#19382d; color:#d4f0dc; }
.hub-feedback[data-bet-state="pending"] { color:#c3dbf4; }
.hub-feedback[data-bet-state="uncertain"] { color:#f0d39d; }
.hub-action-state { font-size:12px; line-height:1.65; color:#d6c7a5; margin:14px 0 0; }
.hub-bet-list p.hub-bet-timing { color:#bdd9c7; font-size:10px; margin-top:10px; }

/* Friendly games show only recorded, participant-private outcomes. */
.duel-results-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:14px; }
.duel-result { min-width:0; padding:20px; border:1px solid #71664f; border-radius:18px; background:radial-gradient(ellipse at 50% 30%,#24483c,#132735 70%); overflow:hidden; }
.duel-result-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.duel-result h3 { font:600 24px var(--font-display); }
.duel-profit { color:#b3dfbd; font-size:12px; }.duel-loss { color:#d1bdad; font-size:12px; }
.duel-outcome { margin-top:16px; font-size:12px; color:#d5decf; }
.duel-draws { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:20px; }
.duel-draw { display:grid; justify-items:center; gap:10px; min-width:0; }.duel-player { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#c9d4d9; font-size:11px; }
.duel-pieces { display:flex; justify-content:center; gap:7px; perspective:600px; }
.duel-card { display:flex; flex-direction:column; justify-content:space-between; width:48px; height:68px; padding:6px 8px; border-radius:7px; background:linear-gradient(135deg,#fffdf3,#e2e3d9); color:#172534; box-shadow:0 4px 10px #0004; }
.duel-card b { font:700 20px var(--font-display); }.duel-card>span { font:25px Georgia,serif; text-align:center; }.duel-card.is-red { color:#b03543; }
.duel-die { display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(3,1fr); gap:3px; width:38px; height:38px; padding:6px; border-radius:8px; background:linear-gradient(130deg,#fffaf0,#d5dbd7); border:1px solid #f4e8d0; box-shadow:0 4px 0 #a5aca5,0 7px 10px #0004; }
.duel-die>i.duel-pip { border-radius:50%; background:#26323d; }
.duel-coin { display:flex; flex-direction:column; align-items:center; justify-content:center; width:90px; height:90px; margin:20px auto 0; border:5px double #fbdfa0; border-radius:50%; color:#fff0c6; background:radial-gradient(ellipse at 32% 24%,#b98d3c,#6c4a22 75%); box-shadow:inset 0 0 0 4px #84632a,0 6px 0 #493718,0 11px 20px #0004; }
.duel-coin b { font:700 35px var(--font-display); }.duel-coin>span { font-size:10px; letter-spacing:.1em; }
.duel-result.is-revealing .duel-coin { animation:duel-coin-toss 900ms cubic-bezier(.16,.74,.3,1) both; }
.duel-result.is-revealing .duel-die { animation:duel-dice-roll 700ms cubic-bezier(.14,.76,.28,1) both; }
.duel-result.is-revealing .duel-draw:nth-child(2) .duel-die { animation-delay:70ms; }
.duel-result.is-revealing .duel-card { animation:duel-card-turn 620ms cubic-bezier(.2,.75,.3,1) both; }
.duel-result.is-revealing .duel-draw:nth-child(2) .duel-card { animation-delay:100ms; }
@keyframes duel-coin-toss { 0% { opacity:0; transform:translateY(-30px) rotateY(0) scale(.65); } 40% { opacity:1; transform:translateY(-15px) rotateY(620deg) scale(1.1); } 78% { transform:translateY(3px) rotateY(1050deg) scale(.98); } 100% { opacity:1; transform:translateY(0) rotateY(1080deg) scale(1); } }
@keyframes duel-dice-roll { 0% { opacity:0; transform:translate3d(-16px,-26px,0) rotate(-130deg) scale(.7); } 50% { opacity:1; transform:translate3d(4px,4px,0) rotate(12deg) scale(1.05); } 80% { transform:translate3d(-2px,-3px,0) rotate(-5deg) scale(1); } 100% { opacity:1; transform:translate3d(0,0,0) rotate(0) scale(1); } }
@keyframes duel-card-turn { 0% { opacity:0; transform:translateY(-15px) rotateY(85deg) rotate(-9deg); } 70% { opacity:1; transform:translateY(2px) rotateY(-8deg) rotate(2deg); } 100% { opacity:1; transform:translateY(0) rotateY(0) rotate(0); } }
@media(max-width:400px) { .duel-result { padding:16px; }.duel-draws { gap:10px; }.duel-die { width:34px; height:34px; padding:5px; gap:2px; } }
@media(prefers-reduced-motion:reduce) { .duel-result * { animation:none!important; transition:none!important; } }
@media(forced-colors:active) { .hub-page :is(.hub-wallet,.hub-market,.hub-bet-list>li,.hub-shop-product,.hub-empty-card,.hub-category,.hub-activity,.hub-duels) { background:Canvas; border-color:CanvasText; box-shadow:none; }.hub-tabs>[aria-selected=true] { background:Highlight; color:HighlightText; border-color:Highlight; box-shadow:none; }.hub-wallet .hub-balance,.hub-section-head h2,.hub-market h3 { color:CanvasText; } }