/* Intent: a player sees their standing, pending invitations and what changed.
   Hierarchy: account information + events; play paths live in Tables.
   Palette: card paper / ink / cobalt, retained from the selected design.
   Density: 16px sections, 12px row padding; no decorative feature banners.
   Signature: game record, invitations, seats, public-game rank; no invented XP. */
:root{--paper:#f6f7fb;--muted:#626b80;--blue:#3265f3;--line:#e9ecf3}
.phone{box-shadow:0 22px 70px #21345812}.app-header{height:74px;padding:10px 18px 8px}.balance{gap:7px}.balance strong{font-size:21px}.balance small{font-size:10px}.header-actions .icon{background:white;border:1px solid #eef0f6}.header-actions{gap:7px}main{padding:8px 16px 24px}.nav{height:74px;border-color:#e8ebf2;backdrop-filter:none}.nav button{min-width:0;width:25%;font-size:10px}.nav button svg{width:22px;height:22px}.nav button[aria-current=page]{position:relative}.nav button[aria-current=page]:before{content:'';position:absolute;top:3px;width:19px;height:3px;background:var(--blue);border-radius:4px}.overview-profile{background:white;border-radius:20px;padding:14px 16px 13px;border:1px solid #eceef5}.overview-user{display:flex;align-items:center;gap:10px}.overview-user>.avatar{width:34px;height:34px;font-size:16px;border-radius:12px}.overview-user h1{font-size:18px;letter-spacing:-.5px}.overview-user small{font-size:10px;display:block;line-height:1.4}.rank-link{min-height:40px;margin-left:auto;padding:2px 0 2px 10px;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;color:var(--blue)}.rank-link strong{font-size:18px;line-height:1.15;letter-spacing:-.6px}.rank-link small{font-size:10px;color:#626b80}.overview-stats{display:grid;grid-template-columns:repeat(3,1fr);margin-top:14px}.overview-stats>div+div{border-left:1px solid var(--line);padding-left:15px}.overview-stats strong{display:block;font-size:24px;letter-spacing:-1px;line-height:1.2}.overview-stats span{font-size:11px;color:var(--muted);display:block;margin-top:3px}.block-heading{display:flex;align-items:center;justify-content:space-between;margin:17px 0 8px;min-height:24px}.block-heading h2{font-size:15px;letter-spacing:-.3px}.block-heading>span{color:var(--muted);font-size:11px}.block-heading .text-action{font-size:11px;min-height:30px;padding:0 4px;display:flex;align-items:center;gap:2px}.block-heading .text-action svg{width:14px;height:14px}.event-row{display:flex;align-items:center;gap:10px;background:white;border:1px solid #eceef5;border-radius:15px;padding:12px;min-height:73px;width:100%;text-align:left}.event-row .avatar{height:34px;width:34px;font-size:16px;flex-shrink:0}.event-row strong{font-size:13px;display:block}.event-row small{font-size:10px;display:block;margin-top:3px}.event-row .event-open{min-height:40px;border-radius:10px;padding:8px 11px;display:flex;align-items:center;background:var(--tint);font-size:11px;color:#214fc8;font-weight:700}.overview-friends{display:grid;grid-template-columns:1fr 1fr;background:white;border:1px solid #eceef5;border-radius:15px;padding:11px 12px;gap:9px}.friend-peek{display:flex;align-items:center;gap:7px;text-align:left;min-height:38px;padding:0}.friend-peek+.friend-peek{border-left:1px solid var(--line);padding-left:11px}.friend-peek .avatar{width:30px;height:30px;font-size:13px;position:relative}.friend-peek .avatar:after{content:'';position:absolute;right:-1px;bottom:0;width:7px;height:7px;background:#45866b;border:2px solid white;border-radius:50%}.friend-peek strong{font-size:12px;display:block}.friend-peek small{font-size:10px;display:block}.record-icon{width:34px;height:40px;display:grid;place-items:center;border-radius:8px;background:#edf1ff;color:#3560c4;flex-shrink:0}.record-icon svg{width:20px}.record-info{min-width:0}.record-info .record-time{font-size:10px;color:var(--muted)}.record-info strong{font-size:13px}.record-info .record-detail{font-size:10px;color:var(--muted);display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}.outcome{margin-left:auto;display:flex;align-items:flex-end;justify-content:center;flex-direction:column;gap:4px;font-size:11px}.outcome .chip{font-size:10px;padding:3px 6px}.outcome svg{width:15px;height:15px;color:var(--muted)}.lobby-digest{margin-top:16px;padding:11px 13px;background:#eaf0ff;border-radius:13px;display:flex;align-items:center;gap:10px;text-align:left;width:100%;min-height:63px}.lobby-digest>svg{color:var(--blue);width:21px}.lobby-digest strong{font-size:12px;display:block}.lobby-digest small{font-size:10px;display:block;margin-top:3px}.lobby-digest .next{width:17px}.no-events{font-size:11px;color:var(--muted);padding:11px 0;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:7px}.no-events svg{width:16px;height:16px}.active-event{border:1px solid #d5e0fe;background:#eef3ff}.active-event .event-open{background:var(--blue);color:#fff}.welcome-record{padding:12px 0 0;font-size:11px;color:var(--muted)}.empty-help{margin-top:18px;background:white;border-radius:16px;padding:15px}.empty-help h2{font-size:16px;margin-bottom:7px}.empty-help p{font-size:12px;color:var(--muted);margin-bottom:10px}.empty-help .secondary{font-size:12px;min-height:40px}.topbar-create{display:flex;align-items:center;justify-content:space-between;margin:2px 0 17px}.topbar-create h1{font-size:25px}.create-mini{background:var(--blue);color:#fff;border-radius:11px;min-height:43px;padding:9px 12px;display:flex;gap:6px;align-items:center;font-size:12px;font-weight:700}.create-mini svg{width:17px;height:17px}.lobby-subtitle{font-size:12px;color:var(--muted);margin:-9px 0 15px}.filter-row{gap:8px}.filter-row select{font-size:12px}.table{padding:14px;border:1px solid #eceef5;border-radius:15px}.table .stake{font-size:21px}.table .small{font-size:11px}.table .pill{font-size:10px}.table .preview{font-size:12px}.table .seat{font-size:8px}.automatic-entry{margin-top:20px;padding:15px;background:#edf0f8;border-radius:15px}.automatic-entry h2{font-size:15px;margin-bottom:5px}.automatic-entry p{font-size:12px;color:var(--muted);margin-bottom:13px}.automatic-entry .secondary{background:white;min-height:43px;font-size:13px}.page-title{font-size:25px;margin:1px 0 18px}.stats-breakdown{display:grid;gap:12px}.mode-stat{padding:14px;background:white;border-radius:15px}.mode-stat strong{font-size:14px}.stat-meter{height:5px;background:#e8edf5;border-radius:4px;overflow:hidden;margin:12px 0 8px}.stat-meter>span{display:block;background:var(--blue);height:100%;border-radius:4px}.mode-stat small{display:flex;justify-content:space-between;font-size:11px}.ranking-list{background:white;border-radius:16px;overflow:hidden}.rank-row{display:flex;align-items:center;padding:13px 14px;gap:12px;border-bottom:1px solid var(--line);min-height:65px}.rank-row:last-child{border-bottom:0}.rank-row .rank-num{width:23px;font-size:16px;color:var(--muted)}.rank-row .avatar{width:30px;height:30px;font-size:13px}.rank-row strong{font-size:13px}.rank-row small{font-size:10px}.rank-row.current{background:#edf2ff}.rank-row .rank-wins{margin-left:auto;text-align:right}.history-list{display:grid;gap:9px}.mode-tabs{display:flex;gap:8px;margin-bottom:17px}.mode-tabs button{border-radius:9px;font-size:12px;padding:10px 12px;min-height:40px;background:white;color:var(--muted)}.mode-tabs button[aria-pressed=true]{background:#e6edff;color:#2853c8;font-weight:700}.pref-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}.pref-row strong{font-size:14px;display:block}.pref-row small{font-size:11px;display:block}.pref-row input{width:20px;height:20px;accent-color:var(--blue);flex-shrink:0}.muted-body{font-size:13px;color:var(--muted);line-height:1.65}.detail-label{font-size:12px;color:var(--muted);margin-bottom:8px}.detail-avatar{margin:10px auto 12px;width:58px;height:58px;font-size:25px}.subnav-back{font-size:12px;color:var(--blue);min-height:44px;margin:0 0 5px;display:flex;align-items:center;gap:6px}.subnav-back svg{width:17px}.support-text{width:100%;min-height:130px;resize:vertical;padding:12px;border-radius:12px;border:1px solid #d9deea;font:inherit;font-size:13px;color:var(--ink)}.op-row{padding:12px 0;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.op-row strong{font-size:13px;display:block}.op-row small{font-size:11px;display:block;margin-top:3px}.schema-note{font-size:10px;line-height:1.6;color:var(--muted);margin-top:15px}.demo-tools{max-width:430px;flex-wrap:wrap}.demo-tools select{font-size:11px;max-width:185px}.demo-tools a{white-space:nowrap}.phone.scroll-page{height:auto;max-height:none;min-height:844px}.phone.scroll-page main{overflow:visible}.phone.scroll-page .nav{position:sticky;bottom:0}.profile-compact{padding:13px;background:white;border:1px solid #eceef5;border-radius:16px;margin-bottom:18px}.profile-compact .avatar{width:42px;height:42px}.profile-compact h1{font-size:20px}.profile-compact small{font-size:11px}.profile-menu{background:#fff;border:1px solid #eceef5;border-radius:16px;overflow:hidden}.profile-menu .route{min-height:63px;padding:12px}.profile-menu .route strong{font-size:14px}.profile-menu .route small{font-size:11px}.profile-menu .route-symbol{background:none;width:28px}.profile-menu .route-symbol svg{width:21px}.profile-meta{margin-top:18px;display:flex;gap:14px;flex-wrap:wrap}.profile-meta button{font-size:11px;min-height:36px;color:var(--muted)}
@media(max-width:480px){.demo-tools{height:auto;min-height:40px;flex-wrap:nowrap}.demo-tools>span{display:none}.demo-tools select{max-width:169px;font-size:9px}.demo-tools a{font-size:9px}main{padding:8px 14px 24px}.app-header{height:70px;padding:8px 14px}.phone{height:calc(100dvh - 40px)}.overview-profile{padding:13px 14px}.block-heading{margin-top:15px}}
@media(min-width:700px){.phone{height:min(844px,calc(100dvh - 96px))}}

/* Small print stays readable at the actual phone width. */
.overview-user small,.rank-link small,.event-row small,.friend-peek small,.record-info .record-time,.record-info .record-detail,.lobby-digest small,.block-heading>span{font-size:12px}.overview-stats span,.friend-peek strong,.event-row .event-open,.outcome .chip,.table .small,.profile-menu .route small{font-size:12px}.event-row strong,.record-info strong,.block-heading h2{font-size:14px}.overview-friends{padding:10px 12px}.friend-peek{gap:6px}.friend-peek+.friend-peek{padding-left:8px}.overview-stats>div+div{padding-left:12px}.block-heading{margin-top:14px}.event-row{padding:11px}.record-info .record-detail{font-size:11px}.record-info .record-time{font-size:11px}.nav button{font-size:11px}.rank-link small{font-size:10px}