/* unify.css — makes the classic screens (game page, standings, News, Fantasy, More)
   look like the new app at /next/: same font, width, header, bottom bar, cards, buttons.
   Loaded last; tokens copied from ui/src/style.css. */
:root{
  --hub-bg:#080b0e;--hub-card:#191e23;--hub-card-border:#232c36;--hub-rail:#0c1528f5;--hub-line:#26344e;
  --hub-text:#edf3ff;--hub-muted:#a6b5cb;--hub-blue:#54baff;--hub-blue-soft:#70c5ff;--hub-secondary:#1c2940;
  --f7-font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f7-page-bg-color:var(--hub-bg);--f7-theme-color:var(--hub-blue);
  --f7-navbar-height:96px;--f7-tabbar-labels-height:68px;--f7-toolbar-height:68px;
}
html,body{background:var(--hub-bg)!important;font-family:var(--f7-font-family)}
#f7app,#f7app .view,#f7app .page,#f7app .page-content{background:var(--hub-bg)}

/* Same centered phone-width column as the new app */
#f7app .page{width:min(100%,520px);left:50%!important;right:auto;transform:translateX(-50%)}

/* Header: "SPORTS / HUB" brand line + bold page title, like the new app */
#f7app .navbar{height:var(--f7-navbar-height)}
#f7app .navbar .navbar-bg{background:var(--hub-bg)!important}
#f7app .navbar .navbar-bg::after,#f7app .navbar .navbar-bg::before{display:none}
#f7app .navbar .navbar-inner{padding:calc(16px + env(safe-area-inset-top)) 16px 10px;align-items:flex-start;height:auto}
#f7app .navbar .title.app-title{position:static;transform:none;left:auto;margin:0;text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:12px;max-width:none;overflow:visible}
#f7app .app-brand{font-size:12px;font-weight:850;letter-spacing:.19em;color:var(--hub-text);opacity:1}
#f7app .app-brand b{color:var(--hub-blue);font-weight:850}
#f7app #navTitle{font-size:23px;font-weight:850;letter-spacing:-.06em;line-height:1.1;color:var(--hub-text)}
#f7app #navTitle::after{content:'.';color:var(--hub-blue)}

/* Bottom bar identical to the new app's */
#f7app .toolbar.hub-nav{height:auto;background:var(--hub-rail);border-top:1px solid #30415d;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#f7app .toolbar.hub-nav::before,#f7app .toolbar.hub-nav::after{display:none}
#f7app .toolbar.hub-nav .toolbar-inner{position:static;height:auto;padding:12px 8px calc(12px + env(safe-area-inset-bottom));justify-content:space-around;background:none}
#f7app .hub-nav .tab-link{flex:0 1 auto;min-width:56px;min-height:44px;gap:5px;color:var(--hub-muted);background:none!important;padding:0;width:auto}
#f7app .hub-nav .tab-link .nav-svg{width:22px;height:22px}
#f7app .hub-nav .tab-link .tabbar-label{font-size:10px;font-weight:500;line-height:1;margin:0;letter-spacing:0;color:inherit}
#f7app .hub-nav .tab-link-active{color:var(--hub-blue-soft)}
#f7app .hub-nav .tab-link-active .nav-svg{filter:drop-shadow(0 0 6px #54baff88)}
#f7app .hub-nav .tab-link::before,#f7app .hub-nav .tab-link::after{display:none}

/* League pickers (Scores/Standings, News): full-width buttons with a blue selected state */
#f7app .leaguetabs,#f7app .bet-leagues{display:flex;gap:6px;margin:0 16px 12px;padding:0;background:none;border:0}
#f7app .leaguetabs>button,#f7app .bet-leagues>button{flex:1;min-height:44px;border-radius:12px;border:1px solid transparent;background:transparent;color:var(--hub-text);font:800 14px/1 var(--f7-font-family);box-shadow:none}
#f7app .leaguetabs>button.active,#f7app .bet-leagues>button.active,#f7app .leaguetabs>button[aria-pressed=true],#f7app .bet-leagues>button[aria-pressed=true]{background:#54baff33;border-color:#54baff99;color:var(--hub-text)}

/* Sub-tabs (Games/Standings, Headlines/Highlights, NFL/NBA, QB/RB…, Scoreboard/Play-by-play): filled pills */
#f7app .segmented,#f7app .feed-tabs{display:flex;gap:7px;margin:0 16px 14px;padding:0;background:none!important;border:0!important;border-radius:0;box-shadow:none}
#f7app .segmented .segmented-highlight{display:none}
#f7app .segmented>.button,#f7app .feed-tabs>.button{flex:1;min-height:44px;height:auto;border:0!important;border-radius:10px!important;background:transparent!important;color:var(--hub-muted);font:600 13px/1.1 var(--f7-font-family);text-transform:none;letter-spacing:0;box-shadow:none}
#f7app .segmented>.button::before,#f7app .segmented>.button::after,#f7app .feed-tabs>.button::before,#f7app .feed-tabs>.button::after{display:none}
#f7app .segmented>.button.button-active,#f7app .feed-tabs>.button[aria-pressed=true],#f7app .feed-tabs>.button.button-active{background:var(--hub-secondary)!important;color:var(--hub-text)}

/* Cards and sections match the new app's game cards */
#f7app .card{background:var(--hub-card)!important;border:1px solid var(--hub-card-border)!important;border-radius:12px!important;box-shadow:none!important;margin-left:16px;margin-right:16px}
#f7app .card .card-content,#f7app .data-table,#f7app .data-table table,#f7app .data-table th,#f7app .data-table td{background:transparent!important}
#f7app .data-table th{color:var(--hub-muted)}
#f7app .data-table tr{border-color:#262f3a}
#f7app .block-title,#f7app .section-head h2,#f7app .sec-head{color:var(--hub-text);font-size:18px;font-weight:750;letter-spacing:-.02em;text-transform:none}
#f7app .backlink{color:var(--hub-blue-soft);font-weight:700;min-height:44px}
#f7app .more-card{background:var(--hub-card);border:1px solid var(--hub-card-border);border-radius:12px}
#f7app input,#f7app select,#f7app textarea{font-size:16px}

/* Emoji reactions on game pages and plays: same pill chips as the chat panel, scroll sideways */
#f7app .react-bar{display:flex!important;gap:6px!important;overflow-x:auto;scrollbar-width:none;padding:10px 0!important;-webkit-overflow-scrolling:touch}
#f7app .react-bar::-webkit-scrollbar{display:none}
#f7app .react-bar button{flex:0 0 auto!important;min-width:48px;min-height:40px;padding:0 12px!important;border-radius:999px!important;border:1px solid #2a3b55!important;background:#141f30!important;color:var(--hub-text);font:700 15px/1 var(--f7-font-family)!important;white-space:nowrap}
#f7app .react-bar button[aria-pressed=true]{border-color:var(--hub-blue)!important;background:#173452!important}
#f7app .react-bar button{width:auto!important;min-width:48px!important;max-width:none!important}
/* Older styles hid the brand line; the new app always shows it */
#f7app .app-brand{display:block!important}
/* Section headings (Box Score, Game Leaders…) sit on the same 16px edge as everything else */
#f7app .sechead{padding:0 16px;margin:22px 0 10px;color:var(--hub-text);font-size:18px;font-weight:750;letter-spacing:-.02em;text-transform:none}
