@import"https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700;800&display=swap";:root{--blue: #1f50ff;--blue-hover: #1840cc;--navy: #021344;--text: #1d2433;--muted: #6b7a99;--soft: #f4f6fa;--border: #e2e5ec;--line: #eef0f5;--success: #27ae60;--danger: #d6332f;--gold: #f3d56b;--radius: 10px;font-family:Rubik,ui-sans-serif,system-ui,sans-serif;color:var(--text);background:var(--soft)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--soft)}.login-card{position:relative;width:min(100%,420px);background:white;border:1px solid #e6e9f0;border-radius:16px;box-shadow:0 4px 24px #0213440f;padding:28px}.login-logo,.brand-row,.sidebar-footer,.user-chip,.panel-heading,.topbar,.summary-strip,.nav-list button,.secondary-button,.result{display:flex;align-items:center}.login-logo,.brand-row{gap:14px}.login-logo{padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:22px}.brand-mark{width:46px;height:46px;border-radius:12px;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:800;box-shadow:0 6px 18px #1f50ff38;flex:none}.brand-logo{width:104px;height:48px;object-fit:contain;flex:none}.login-brand-logo{width:112px}.login-mascot{position:absolute;right:18px;top:88px;width:74px;height:74px;object-fit:contain;pointer-events:none}.eyebrow{margin:0 0 4px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:0;text-transform:uppercase}h1,h2,h3{margin:0;color:var(--navy);line-height:1.2}h1{font-size:22px}h2{font-size:24px}h3{font-size:17px}form label,.select-inline{display:block;margin:14px 0 6px;font-size:13px;font-weight:600;color:var(--text)}input,select{width:100%;height:40px;padding:0 12px;border-radius:8px;border:1px solid #d6dbe5;background:white;color:var(--text);outline:none;transition:border-color .15s ease,box-shadow .15s ease}input:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px #1f50ff1f}.primary-button,.secondary-button{min-height:40px;border-radius:8px;font-weight:700;transition:background .15s ease,border-color .15s ease}.primary-button{width:100%;margin-top:18px;border:0;background:var(--blue);color:#fff}.primary-button:hover{background:var(--blue-hover)}.link-button{width:100%;min-height:38px;margin-top:10px;border:0;border-radius:8px;background:transparent;color:var(--blue);font-weight:700}.link-button:hover{background:#eef2ff}.secondary-button{width:100%;justify-content:center;gap:8px;border:1px solid var(--border);background:#f8f9fc;color:var(--navy)}.secondary-button:hover{border-color:var(--blue);color:var(--blue)}.form-error{margin:12px 0 0;color:var(--danger);font-size:13px}.helper-text{margin:10px 0 0;color:var(--muted);font-size:12px;line-height:1.45}.lock-message{margin:0;padding:10px 12px;border-radius:8px;background:#fdecec;color:var(--danger);font-size:12px;font-weight:700}.save-message{margin:0;padding:10px 12px;border-radius:8px;background:#e6f5ee;color:#1e8e5a;font-size:12px;font-weight:700}.save-message.saving{background:#eef2ff;color:var(--blue)}.save-message.error{background:#fdecec;color:var(--danger)}.demo-box{display:grid;gap:5px;margin-top:18px;padding:12px;border-radius:8px;background:#f8f9fc;border:1px solid var(--line);color:var(--muted);font-size:12px}.demo-box strong{color:var(--navy)}.app-shell{min-height:100vh;display:grid;grid-template-columns:240px minmax(0,1fr);grid-template-rows:72px minmax(0,1fr)}.app-header{position:sticky;top:0;z-index:20;grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 22px;border-bottom:1px solid var(--border);background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.header-brand{display:flex;align-items:center;gap:12px;min-width:0}.header-brand .brand-mark{width:42px;height:42px;border-radius:10px}.header-brand h1{font-size:18px}.header-mascot{display:flex;align-items:center;gap:8px;margin-left:auto;padding:5px 10px 5px 6px;border:1px solid var(--line);border-radius:999px;background:#f8f9fc;color:var(--muted);font-size:12px;font-weight:700}.header-mascot img{width:34px;height:34px;object-fit:contain}.profile-menu{position:relative;flex:none}.profile-trigger{display:flex;align-items:center;gap:10px;min-height:44px;padding:5px 8px 5px 5px;border:1px solid var(--border);border-radius:10px;background:white;color:var(--text);box-shadow:0 3px 10px #0213440a}.profile-trigger:hover{border-color:#cbd3e1}.profile-trigger-copy{display:grid;min-width:120px;text-align:left}.profile-trigger-copy strong{color:var(--navy);font-size:13px}.profile-trigger-copy small{color:var(--muted);font-size:11px}.chevron{color:var(--muted);transition:transform .15s ease}.chevron.open{transform:rotate(180deg)}.profile-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:280px;display:grid;gap:8px;padding:10px;border:1px solid var(--border);border-radius:12px;background:white;box-shadow:0 16px 38px #02134429}.profile-card{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;background:#f8f9fc}.profile-card div{display:grid;min-width:0}.profile-card strong{color:var(--navy);font-size:14px}.profile-card small{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-stat{display:flex;align-items:center;justify-content:space-between;padding:10px;border-radius:10px;border:1px solid var(--line)}.profile-stat span{color:var(--muted);font-size:12px;font-weight:700}.profile-stat strong{color:var(--blue);font-size:18px}.dropdown-action{display:flex;align-items:center;gap:8px;min-height:38px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--text);font-weight:700;text-align:left}.dropdown-action:hover{background:#f4f6fa;color:var(--blue)}.dropdown-action.danger{color:var(--danger)}.dropdown-action.danger:hover{background:#fdecec}.sidebar{grid-column:1;grid-row:2;display:flex;flex-direction:column;gap:18px;padding:20px;background:var(--navy);color:#fff}.sidebar h1,.sidebar .eyebrow{color:#fff}.sidebar .eyebrow{opacity:.64}.nav-list{display:grid;gap:6px}.nav-list button{gap:10px;height:40px;padding:0 12px;border:0;border-radius:8px;background:transparent;color:#ffffffb8;text-align:left}.nav-list button:hover,.nav-list button.active{background:rgba(255,255,255,.1);color:#fff}.sidebar-footer{margin-top:auto;justify-content:space-between;gap:10px}.user-chip{gap:10px;min-width:0}.user-chip span,.avatar{width:32px;height:32px;border-radius:999px;background:var(--success);color:#fff;display:inline-grid;place-items:center;font-weight:700;flex:none}.avatar.large{width:42px;height:42px;font-size:16px}.avatar.xl{width:64px;height:64px;font-size:24px}.user-chip div{display:grid;min-width:0}.user-chip small{color:#ffffff94}.icon-button{width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:8px;background:rgba(255,255,255,.08);color:#fff}.main-panel{grid-column:2;grid-row:2;min-width:0;padding:22px}.topbar{justify-content:space-between;gap:20px;margin-bottom:18px}.summary-strip{gap:10px;flex-wrap:wrap}.metric{min-width:108px;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:white}.metric span{display:block;color:var(--muted);font-size:11px;font-weight:600}.metric strong{color:var(--navy);font-size:18px}.betting-layout{position:relative;display:grid;grid-template-columns:minmax(760px,1fr) 340px;gap:16px;align-items:start}.desktop-fixture{min-width:0}.mobile-fixture{display:none}.bracket-board{position:relative;min-height:720px;overflow:hidden;border-radius:12px;border:1px solid #173a2a;background:linear-gradient(rgba(35,255,114,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(35,255,114,.08) 1px,transparent 1px),radial-gradient(circle at 7% 8%,rgba(30,255,93,.36),transparent 16%),radial-gradient(circle at 94% 12%,rgba(30,255,93,.42),transparent 20%),radial-gradient(circle at 50% 46%,rgba(255,255,255,.09),transparent 25%),#080a0a;background-size:38px 38px,38px 38px,auto,auto,auto,auto;box-shadow:0 18px 50px #02134429;color:#fff}.bracket-board:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.28),transparent 24%,transparent 76%,rgba(0,0,0,.28))}.bracket-glow{position:absolute;top:0;width:260px;height:260px;background:radial-gradient(circle,rgba(0,255,88,.28),transparent 64%);filter:blur(8px)}.bracket-glow.left{left:-90px}.bracket-glow.right{right:-90px}.bracket-title{position:relative;z-index:1;display:grid;justify-items:center;padding-top:22px;text-transform:uppercase}.bracket-title strong{color:#fff;font-size:clamp(44px,7vw,76px);font-weight:800;line-height:.9}.bracket-title span{color:#fff;font-size:24px;font-weight:500}.bracket-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(320px,1fr) 230px minmax(320px,1fr);gap:16px;padding:28px 22px 24px}.bracket-side{display:grid;gap:10px;align-items:start}.bracket-side.left{grid-template-columns:1.45fr 1fr .78fr .64fr}.bracket-side.right{grid-template-columns:.64fr .78fr 1fr 1.45fr}.round-column{display:grid;align-content:space-around;gap:12px;min-height:565px}.round-label{justify-self:center;color:#fff;font-size:11px;font-weight:800;text-transform:uppercase;text-shadow:0 1px 5px rgba(0,0,0,.8)}.match-node,.final-card{position:relative;width:100%;min-height:74px;display:grid;gap:5px;padding:8px;border:1px solid rgba(255,255,255,.22);border-radius:8px;background:rgba(255,255,255,.09);color:#fff;text-align:left;box-shadow:0 8px 18px #0003;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.match-node:before{content:"";position:absolute;top:50%;width:14px;height:1px;background:rgba(255,255,255,.55)}.match-node.left:before{right:-15px}.match-node.right:before{left:-15px}.match-node:hover,.match-node.active,.final-card:hover,.final-card.active{border-color:var(--gold);background:rgba(31,80,255,.32)}.match-node.locked{border-color:#ffffff24;background:rgba(255,255,255,.05)}.team-line{display:flex;align-items:center;gap:7px;min-width:0}.team-line strong{min-width:0;overflow:hidden;color:#fff;font-size:12px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.team-line.compact strong{font-size:11px}.flag{width:24px;height:18px;border-radius:2px;object-fit:cover;box-shadow:0 0 0 1px #ffffff47;flex:none}.flag-empty{width:24px;height:18px;border-radius:3px;background:#d9dde5;box-shadow:inset 0 0 0 1px #ffffff6b;flex:none}.node-footer{display:flex;align-items:center;justify-content:space-between;gap:8px}.node-footer small,.final-card small{color:#ffffffad;font-size:10px}.pick-dot{width:20px;height:20px;border-radius:999px;display:inline-grid;place-items:center;background:var(--blue);color:#fff;font-size:10px;font-weight:800}.lock-dot{min-width:50px;min-height:20px;border-radius:999px;display:inline-grid;place-items:center;padding:0 7px;background:rgba(214,51,47,.92);color:#fff;font-size:9px;font-weight:800;text-transform:uppercase}.result{justify-content:center;gap:4px;min-height:24px;border-radius:999px;font-size:11px;font-weight:700}.result.pending{background:rgba(255,244,229,.95);color:#9a5a00}.result.done{background:rgba(230,245,238,.95);color:#1e8e5a}.final-stage{display:grid;justify-items:center;align-content:center;gap:12px;min-height:565px}.final-label{color:var(--gold);font-size:40px;font-weight:800;text-transform:uppercase;text-shadow:0 2px 12px rgba(0,0,0,.7)}.final-card{min-height:108px;padding:14px}.cup-image{width:132px;height:170px;object-fit:contain;filter:drop-shadow(0 18px 24px rgba(0,0,0,.48))}.match-drawer{position:sticky;top:22px;display:grid;gap:14px;padding:18px;border:1px solid var(--border);border-radius:12px;background:white;box-shadow:0 12px 34px #0213441a}.round-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none}.round-tabs::-webkit-scrollbar{display:none}.round-tabs button{flex:none;min-height:36px;padding:0 13px;border:1px solid var(--border);border-radius:999px;background:white;color:var(--muted);font-size:13px;font-weight:800}.round-tabs button.active{border-color:var(--blue);background:#eef2ff;color:var(--blue)}.mobile-match-list{display:grid;gap:10px}.mobile-match-card{display:grid;gap:12px;width:100%;padding:13px;border:1px solid var(--border);border-radius:12px;background:white;color:var(--text);text-align:left;box-shadow:0 4px 14px #0213440a}.mobile-match-card.active{border-color:var(--blue);box-shadow:0 0 0 3px #1f50ff1f}.mobile-match-card__top,.mobile-match-card__bottom{display:flex;align-items:center;justify-content:space-between;gap:10px}.mobile-match-card__top>span,.mobile-match-card__bottom>span{color:var(--muted);font-size:12px;font-weight:600}.mobile-teams{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px;align-items:center}.mobile-team-row{display:flex;align-items:center;gap:8px;min-width:0}.mobile-team-row strong{min-width:0;color:var(--navy);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.versus{color:var(--muted);font-size:11px;font-weight:900;text-transform:uppercase}.mobile-status{display:inline-flex;align-items:center;gap:4px;color:var(--blue);font-size:12px;font-weight:800}.mobile-status.picked{color:var(--success)}.mobile-status.locked{color:var(--danger)}.drawer-close{position:absolute;top:12px;right:12px;width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:8px;background:#f4f6fa;color:var(--muted)}.drawer-teams{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;padding:14px;border-radius:10px;background:#f8f9fc}.drawer-teams>span{color:var(--muted);font-size:12px;font-weight:800}.drawer-team{display:grid;gap:8px;justify-items:center;min-width:0;text-align:center}.drawer-team .flag,.drawer-team .flag-empty{width:42px;height:29px}.drawer-team strong{color:var(--navy);font-size:13px}.drawer-meta{display:grid;gap:8px;color:var(--muted);font-size:13px}.pick-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.pick-group button{min-height:38px;border:1px solid var(--border);border-radius:8px;background:white;color:var(--text);font-size:12px;font-weight:700;overflow-wrap:anywhere}.pick-group button:hover,.pick-group button.selected{border-color:var(--blue);background:#eef2ff;color:var(--blue)}.pick-group button:disabled{opacity:.55;cursor:not-allowed}.floating-score{position:absolute;right:360px;bottom:16px;z-index:2;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:999px;background:white;border:1px solid var(--border);box-shadow:0 10px 28px #02134429}.floating-score span{color:var(--muted);font-size:12px;font-weight:700}.floating-score strong{width:32px;height:32px;border-radius:999px;display:grid;place-items:center;background:var(--blue);color:#fff}.content-grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:16px}.admin-page{display:grid;gap:16px}.panel{background:white;border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 16px #0213440a;padding:16px;min-width:0}.panel-heading{justify-content:space-between;gap:14px;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:14px}.profile-page{display:grid;gap:16px}.profile-hero{display:flex;align-items:center;gap:16px}.profile-hero span:not(.avatar){display:block;margin-top:4px;color:var(--muted);font-size:14px}.profile-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.profile-metric-card{display:grid;gap:8px}.profile-metric-card svg{color:var(--blue)}.profile-metric-card span{color:var(--muted);font-size:12px;font-weight:700}.profile-metric-card strong{color:var(--navy);font-size:24px}.my-picks-page{display:grid;gap:16px}.picks-summary{display:flex;align-items:center;justify-content:space-between;gap:16px}.progress-ring{--progress: 0%;width:82px;height:82px;border-radius:999px;display:grid;place-items:center;background:conic-gradient(var(--blue) var(--progress),#e9edf5 0);flex:none}.progress-ring:before{content:"";position:absolute}.progress-ring strong{width:60px;height:60px;border-radius:999px;display:grid;place-items:center;background:white;color:var(--navy);font-size:17px}.picks-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.pick-kpi{display:grid;gap:6px}.pick-kpi svg{color:var(--blue)}.pick-kpi span{color:var(--muted);font-size:12px;font-weight:700}.pick-kpi strong{color:var(--navy);font-size:24px}.pick-filter-tabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}.pick-filter-tabs::-webkit-scrollbar{display:none}.pick-filter-tabs button{flex:none;min-height:36px;padding:0 13px;border:1px solid var(--border);border-radius:999px;background:white;color:var(--muted);font-size:13px;font-weight:800}.pick-filter-tabs button.active{border-color:var(--blue);background:#eef2ff;color:var(--blue)}.my-picks-list{display:grid;gap:12px}.pick-card{display:grid;gap:12px;padding:14px;border:1px solid var(--border);border-radius:12px;background:white;box-shadow:0 4px 14px #0213440a}.pick-card__header,.pick-card__teams,.pick-card__footer{display:flex;align-items:center}.pick-card__header{justify-content:space-between;gap:10px}.pick-card__header>div{display:flex;align-items:center;gap:8px}.pick-card__header strong{color:var(--navy);font-size:13px}.pick-card__teams{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:10px}.pick-card__teams>span:not(.pick-team-name){color:var(--muted);font-size:11px;font-weight:900}.pick-team-name{display:flex;align-items:center;gap:8px;min-width:0}.pick-team-name strong{min-width:0;color:var(--navy);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pick-card__venue{color:var(--muted);font-size:12px;font-weight:600}.pick-card__footer{justify-content:flex-end}.badge{display:inline-flex;width:max-content;align-items:center;min-height:26px;padding:0 9px;border-radius:999px;background:#eef2ff;color:var(--blue);font-size:12px;font-weight:700}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{padding:13px 12px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}th{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:0}td{color:var(--text);font-size:14px}td:nth-child(2){display:flex;align-items:center;gap:10px}td strong{color:var(--navy)}.empty-cell{padding:28px 12px;color:var(--muted);text-align:center}.admin-form{align-self:start}.participants-panel{overflow:hidden}.admin-list{display:grid;gap:10px}.admin-match{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:14px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:10px}.admin-match>div{display:grid;gap:6px}.admin-match strong{display:flex;align-items:center;gap:6px;color:var(--navy);flex-wrap:wrap}.admin-match small{color:var(--muted);font-size:12px}.select-inline{margin:0;color:var(--muted)}.select-inline select{margin-top:6px}@media (max-width: 1280px){.betting-layout{grid-template-columns:1fr}.match-drawer{position:relative;top:auto}.floating-score{right:16px}}@media (max-width: 1050px){.app-shell{grid-template-columns:1fr;grid-template-rows:auto auto minmax(0,1fr)}.app-header{grid-row:1;padding:10px 14px}.sidebar{grid-column:1;grid-row:2;position:sticky;top:72px;z-index:10;padding:10px 14px;background:var(--navy)}.nav-list{display:flex;gap:8px;overflow-x:auto}.nav-list button{flex:none;min-width:120px}.main-panel{grid-column:1;grid-row:3}.betting-layout{grid-template-columns:1fr;overflow:visible}.desktop-fixture{display:none}.mobile-fixture{display:grid}.content-grid,.profile-metrics,.picks-kpis{grid-template-columns:1fr}}@media (max-width: 680px){.app-header{align-items:flex-start}.header-brand h1{font-size:16px}.brand-logo{width:82px;height:38px}.header-brand .eyebrow,.header-mascot,.profile-trigger-copy{display:none}.profile-dropdown{right:-2px;width:min(280px,calc(100vw - 28px))}.main-panel{padding:14px}.match-drawer{position:fixed;left:10px;right:10px;bottom:10px;top:auto;z-index:40;max-height:min(78vh,620px);overflow-y:auto;border-radius:16px;box-shadow:0 24px 70px #02134447}.match-drawer:before{content:"";width:42px;height:4px;justify-self:center;border-radius:999px;background:#d6dbe5}.floating-score{position:sticky;right:auto;bottom:auto;margin-top:10px;justify-content:space-between;border-radius:12px}.topbar{align-items:stretch;flex-direction:column}.summary-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.metric{min-width:0}.pick-group,.admin-match{grid-template-columns:1fr}}
