:root{color-scheme:dark;--bg:#090f0f;--surface:#101918;--surface2:#14201e;--line:#283633;--text:#ebf6f0;--muted:#859c94;--mint:#b2ff76;--teal:#83dbb7;--warn:#edc37d;--radius:16px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.45;min-width:320px}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}a{color:inherit}::selection{background:#a5fc82;color:#0b150f}
.ambient{position:absolute;pointer-events:none;filter:blur(90px);border-radius:50%;opacity:.12}.ambient1{width:420px;height:360px;background:#527f43;top:-200px;right:12%}.ambient2{width:260px;height:360px;background:#23684d;top:800px;left:-230px}.app-shell{max-width:1510px;margin:auto;padding:0 42px;position:relative}
.nav{min-height:93px;border-bottom:1px solid #26342f;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;text-decoration:none;font-weight:900;font-size:20px;letter-spacing:-1.2px;line-height:1.08;gap:12px;white-space:nowrap}.brand small{display:block;color:#68847a;letter-spacing:2.2px;font-size:8px;font-weight:800;margin-top:5px}.brand-green{color:var(--mint)}.brand-icon{height:39px;width:39px;background:var(--mint);color:#0c1712;border-radius:12px;display:grid;place-items:center;font-size:36px;line-height:1;position:relative}.brand-icon .cross{font-size:11px;position:absolute;right:5px;top:1px}.nav-meta{margin-left:auto;color:var(--muted);display:flex;align-items:center;gap:12px;font-size:12px}.nav-sep{color:#44574e}.live-dot{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 12px #8eef8c}.icon-button{background:#17231f;border:1px solid #334139;border-radius:9px;color:#c5dacd;padding:10px 16px;display:flex;gap:9px;align-items:center}.icon-button:hover,.stepper:hover,.today-btn:hover{border-color:var(--mint);color:var(--mint)}
.hero{display:flex;align-items:center;justify-content:space-between;gap:50px;padding:52px 0 34px;min-height:310px;overflow:hidden}.hero-copy{max-width:750px;z-index:1}.eyebrow,.section-kicker{font-size:10px;color:var(--mint);font-weight:800;letter-spacing:2.8px}.eyebrow{display:flex;align-items:center;gap:13px}.eyebrow-line{width:24px;height:2px;background:var(--mint)}.label-update{color:#69877d;font-size:9px;letter-spacing:1.7px}.hero h1{font-size:clamp(42px,4.7vw,73px);letter-spacing:-3.7px;line-height:1.03;margin:18px 0 17px;font-weight:800}.hero h1 em,.method-section h2 em{font-style:normal;color:var(--mint)}.hero p{color:#95aca1;max-width:625px;font-size:14.4px;line-height:1.8;margin:0}.hero p b{color:#d6ede1;font-weight:600}
.hero-orbit{width:280px;height:245px;flex-shrink:0;position:relative;display:grid;place-items:center;opacity:.95}.circle{border:1px dashed rgba(177,255,118,.24);border-radius:50%;display:grid;place-items:center}.outer{height:280px;width:280px}.middle{height:205px;width:205px;border-style:solid;border-color:#2a4d39;background:radial-gradient(circle,#6be88b12,transparent 70%)}.inner{height:115px;width:115px;border-color:#3b7751;border-style:solid;box-shadow:0 0 45px #5dca6a1b,inset 0 0 25px #79f67314}.inner span{font-size:74px;line-height:1;color:var(--mint)}.orbit-cross{position:absolute;right:0;top:28px;color:var(--mint);font-size:28px}.orbit-a,.orbit-b{position:absolute;color:#5d8670;font-size:8px;font-weight:800;letter-spacing:1.3px}.orbit-a{top:26px;left:-14px}.orbit-b{bottom:17px;right:-11px}
.top-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;background:#14211d;border:1px solid #293e31;border-radius:13px;padding:13px 17px;margin:14px 0 18px}.date-block{display:flex;align-items:center;gap:14px}.stepper{width:34px;height:34px;background:#20332a;border:1px solid #31483b;border-radius:8px;color:#c5dec8;font-size:25px;line-height:0}.date-display{min-width:156px}.date-display span{display:block;letter-spacing:1.5px;color:#8ba299;font-size:9px;font-weight:800}.date-display strong{display:block;font-size:17px;letter-spacing:-.3px}.today-btn{border:1px solid #355243;color:var(--mint);background:#1c3225;border-radius:8px;padding:8px 12px;font-size:11px;font-weight:800}.top-bar input[type=date]{padding:8px;background:#101d17;border:1px solid #344c3d;border-radius:7px;color:#b9d5c6;color-scheme:dark;font-size:11px;max-width:136px}.source-row{display:flex;align-items:center;gap:13px}.source-row label{font-size:9px;font-weight:800;letter-spacing:1.4px;color:#789386}.source-row select,.filters select{background:#111c19;border:1px solid #354940;border-radius:8px;color:#d9ede0;padding:10px 13px;font-size:12px;max-width:245px;outline:none}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat{background:#101a18;border:1px solid #27342f;border-radius:13px;padding:18px 22px;min-height:127px}.stat-top{font-size:10px;font-weight:800;letter-spacing:1.5px;color:#8ba39a;display:flex;justify-content:space-between}.stat-top span{font-size:14px;color:#668276}.stat strong{display:block;font-size:39px;font-weight:800;line-height:1.12;margin:8px 0 3px;letter-spacing:-1.5px}.stat-bottom{display:block;font-size:11px;color:#779186}.stat.accent{background:linear-gradient(120deg,#213a25,#172819 80%);border-color:#446f39}.stat.accent strong{color:var(--mint);font-size:34px}.stat.accent .stat-bottom{color:#a4c9a0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-line{color:#688478;font-size:11px;display:flex;justify-content:space-between;margin:14px 1px 28px;gap:15px}.alert{background:#453423;border:1px solid #6f5536;border-radius:10px;padding:15px 18px;color:#ffe1b4;margin:-8px 0 24px}
.main-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;align-items:start;gap:26px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:21px}.section-head h2,.picks-panel h2{font-size:29px;letter-spacing:-1.1px;margin:8px 0 5px;line-height:1.2}.section-head p,.panel-subtitle{color:#809b90;margin:0;font-size:12px}.tiny-pill{font-size:11px;vertical-align:middle;border:1px solid #395046;border-radius:7px;color:#abc8b6;padding:5px 9px;letter-spacing:0;margin-left:7px}
.filters{display:flex;flex-direction:column;gap:14px;margin-bottom:15px}.filter-tabs{display:flex;gap:7px;flex-wrap:wrap}.filter-tab{background:#14201c;border:1px solid #293b33;color:#819d90;padding:10px 16px;border-radius:8px;font-weight:700;font-size:11px}.filter-tab:hover,.filter-tab.active{background:#a9fa79;color:#162318;border-color:#a9fa79}.filter-row{display:flex;justify-content:space-between;gap:12px}.search-wrap{display:flex;align-items:center;gap:8px;border:1px solid #293b33;background:#121c19;border-radius:8px;padding:0 11px;min-width:0;flex:1}.search-wrap span{color:#809d90;font-size:21px}.search-wrap input{border:0;outline:0;background:transparent;color:#ebf8ee;font-size:12px;width:100%;min-height:39px}.search-wrap input::placeholder{color:#6f867c}
.matches{display:flex;flex-direction:column;gap:11px}.match-card{background:#101a18;border:1px solid #2a3932;border-radius:13px;padding:18px 19px 15px;transition:border-color .2s,background .2s}.match-card:hover{border-color:#4b6e54;background:#121e1a}.match-card.match-open{border-color:#658a5e}.match-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}.league-identity{display:flex;align-items:center;gap:8px;min-width:0;color:#9ab6a6;font-size:10px;font-weight:700}.league-mark{width:19px;height:19px;border-radius:6px;background:#2b4335;color:#a8ef8c;display:grid;place-items:center;font-size:12px}.league-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.match-time{color:#84a294;font-size:10px;white-space:nowrap}.status-tag{border-radius:5px;padding:3px 5px;background:#26382d;color:#aad897;font-size:9px;font-weight:800;letter-spacing:.7px}.status-tag.live{color:#ffe29b;background:#4b3523}.status-tag.ft{color:#879e90;background:#27342f}
.fixture-body{display:grid;grid-template-columns:minmax(0,1fr) 130px;gap:14px;align-items:center}.teams{display:flex;flex-direction:column;gap:10px;min-width:0}.team{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;min-width:0}.team-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.team-logo{width:28px;height:28px;object-fit:contain}.team-placeholder{width:28px;height:28px;border-radius:8px;background:#2a4033;color:var(--mint);font-size:10px;font-weight:800;display:grid;place-items:center;flex-shrink:0}.scoreline{margin-left:auto;color:#b8d5c2;font-size:15px}.vs{position:absolute;left:50%;transform:translateX(-50%);color:#536d5e;font-size:9px}.pick-box{background:#1b2a21;border:1px solid #3b5b37;border-radius:10px;padding:12px;min-width:0}.pick-box .pick-label{display:block;color:#9eb3a2;font-size:9px;font-weight:800;letter-spacing:1.2px}.pick-box strong{display:block;color:var(--mint);font-size:15px;line-height:1.25;overflow-wrap:anywhere;margin:5px 0}.pick-box .pick-prob{display:flex;align-items:center;justify-content:space-between;gap:6px;color:#97b4a3;font-size:10px}.pick-box .pick-prob b{color:#d9f4d9;font-size:13px}.pick-box.no-data{border-color:#36453d;background:#1b2520;color:#869d8a}.pick-box.no-data strong{color:#8ca595;font-size:11px}
.match-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #27362f;padding-top:11px;margin-top:14px;color:#7f9a8e;font-size:11px}.mini-chip{padding:4px 8px;border-radius:5px;font-size:9px;font-weight:700;background:#203328;color:#b2d5ad}.mini-chip.weak{background:#3c3425;color:#eac78b}.details-btn{background:none;border:0;color:#b5ea9c;padding:3px 0;font-size:11px;font-weight:800}.details-btn:hover{text-decoration:underline}.quality-info{display:flex;align-items:center;gap:8px;min-width:0}.analysis-detail{border-top:1px solid #304536;margin-top:16px;padding-top:18px}.analysis-detail h4{margin:0 0 12px;color:#eefbea;font-size:12px}.prob-row{display:flex;flex-wrap:wrap;gap:9px}.prob-group{flex:1 1 200px;background:#14241c;border:1px solid #2b4336;border-radius:9px;padding:12px}.prob-group h5{color:#95b69c;font-size:10px;margin:0 0 11px;letter-spacing:1px}.prob-item{margin:9px 0}.prob-caption{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#b7cbbb}.track{height:5px;background:#2c3b34;border-radius:5px;margin-top:5px;overflow:hidden}.fill{height:100%;background:#9df576;border-radius:5px}.detail-footer{margin-top:14px;color:#789b87;font-size:11px;line-height:1.8}.form-wrap{display:flex;gap:16px;flex-wrap:wrap;margin:12px 0;color:#b3c6b9}.form-wrap label{font-size:11px}.form-bubbles{display:inline-flex;gap:3px;margin-left:8px}.form-bubbles i{font-size:9px;font-style:normal;border-radius:4px;padding:2px 5px;background:#324134;color:#acbbae}.form-bubbles i.W{background:#286942;color:#d7ffcb}.form-bubbles i.L{background:#633a37;color:#f2c1b7}.form-bubbles i.D{background:#5d5237;color:#fae0a1}.model-note{color:#739785;font-size:11px;margin-top:13px}.not-ready{color:#b9aa84;font-size:11px;background:#24261e;border:1px solid #454733;border-radius:8px;padding:11px;margin-top:13px}
.picks-column{position:sticky;top:18px}.picks-panel{background:linear-gradient(165deg,#1d3425,#15241e 46%,#112019);border:1px solid #46663d;border-radius:15px;padding:22px}.picks-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.rank-pill{border:1px solid #446b3d;color:var(--mint);border-radius:5px;padding:5px 7px;font-size:9px;letter-spacing:1px;font-weight:800}.picks-panel h2{font-size:29px;margin:12px 0 8px}.star{color:var(--mint);font-size:24px}.panel-subtitle{line-height:1.65}.picks-legend{display:flex;justify-content:space-between;color:#7f9a84;font-size:9px;letter-spacing:.6px;margin:23px 0 9px;border-bottom:1px solid #3c5140;padding-bottom:10px;font-weight:700}.legend-dot{display:inline-block;height:6px;width:6px;border-radius:50%;margin-right:5px;background:#b8ff84}.top-picks{display:flex;flex-direction:column}.pick-row{display:grid;grid-template-columns:27px minmax(0,1fr) 52px;gap:9px;align-items:center;padding:11px 0;border-bottom:1px solid #354839;cursor:pointer}.pick-row:hover .pick-teams{color:var(--mint)}.pick-rank{width:25px;height:25px;border-radius:7px;border:1px solid #526b47;display:grid;place-items:center;font-size:11px;font-weight:900;color:#a8d9a0}.pick-row:first-child .pick-rank{background:var(--mint);color:#193320;border-color:var(--mint)}.pick-content{min-width:0}.pick-teams{font-size:11px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .2s}.pick-small{color:#93b398;font-size:10px;margin-top:4px;display:flex;gap:7px;align-items:center}.pick-small b{color:#b2ff76}.pick-metric{font-size:16px;letter-spacing:-.6px;color:var(--mint);font-weight:900;text-align:right}.pick-metric small{display:block;font-size:8px;font-weight:600;color:#789b84;letter-spacing:.1px}.rank-empty{padding:30px 10px;color:#a2b7a7;font-size:12px;text-align:center}.panel-footer{display:flex;gap:10px;color:#9bb4a5;margin-top:18px;font-size:11px;line-height:1.65}.panel-footer span{color:var(--mint)}.panel-footer p{margin:0}.panel-footer b{color:#c6e8c3}.info-panel{background:#101b17;border:1px solid #273b2f;border-radius:13px;padding:22px;margin-top:16px}.info-icon{color:var(--mint);background:#213b2a;font-size:20px;height:36px;width:36px;border-radius:9px;display:grid;place-items:center}.info-panel h3{font-size:14px;margin:15px 0 9px}.info-panel p{font-size:11px;color:#8aa698;line-height:1.8;margin:0 0 14px}.info-panel a{color:#b1ef91;font-size:11px;text-decoration:none;font-weight:800}.loading-card,.empty-card{display:grid;place-items:center;gap:12px;padding:50px 15px;background:#111d19;border:1px dashed #344a3a;border-radius:12px;color:#8da899;text-align:center}.spinner{display:inline-block;width:24px;height:24px;border:3px solid #38533b;border-top-color:var(--mint);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.pagination-row{text-align:center;padding:19px}.load-more{border:1px solid #35553d;background:#1b3021;color:#b5ef99;border-radius:9px;font-size:12px;padding:12px 26px;font-weight:800}
.method-section{margin:80px 0 75px;border-top:1px solid #243a2c;padding-top:42px}.method-section h2{font-size:32px;letter-spacing:-1px;margin:8px 0 30px}.method-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.method-grid>div{border:1px solid #2c3e33;background:#111c18;border-radius:12px;padding:20px}.method-number{color:var(--mint);font-weight:900;font-size:11px;letter-spacing:1px}.method-grid h3{margin:15px 0 8px;font-size:14px}.method-grid p{color:#8da99a;font-size:11px;line-height:1.75;margin:0}footer{border-top:1px solid #273b2e;padding:24px 0 30px;display:flex;justify-content:space-between;gap:15px;color:#6e8d7a;font-size:10px}.foot-brand{font-weight:900;color:#ddebdc;letter-spacing:.5px}.foot-brand span{color:var(--mint)}
.api-notice{margin:0 0 15px;background:#233127;border:1px solid #426c42;border-radius:10px;padding:14px;color:#cfefce;font-size:12px}.api-notice button{background:#adf886;color:#1a3021;border:0;border-radius:6px;padding:7px 12px;font-size:11px;font-weight:800;margin-left:10px}.api-progress{font-weight:600;color:var(--mint);margin:7px 0 0}
@media(max-width:1050px){.app-shell{padding:0 24px}.hero-orbit{width:220px;transform:scale(.8)}.main-grid{grid-template-columns:minmax(0,1fr) 300px;gap:15px}.picks-panel{padding:17px}.stat{padding:15px}.stat strong{font-size:32px}}
@media(max-width:760px){.app-shell{padding:0 14px}.nav{min-height:75px}.nav-meta{display:none}.brand{font-size:18px}.brand-icon{height:34px;width:34px}.refresh span{display:none}.hero{min-height:0;padding:35px 0 30px}.hero h1{letter-spacing:-2.2px;font-size:43px}.hero p{font-size:12px}.hero-orbit{display:none}.label-update{display:none}.top-bar{align-items:stretch;flex-direction:column;padding:11px;gap:12px}.date-block{gap:8px}.date-display{min-width:0;flex:1}.date-display strong{font-size:15px}.source-row{justify-content:space-between}.stat-grid{grid-template-columns:repeat(2,1fr);gap:8px}.stat{min-height:105px;padding:13px}.stat strong{font-size:28px}.stat.accent strong{font-size:27px}.stat-top{font-size:9px}.stat-bottom{font-size:10px}.main-grid{display:flex;flex-direction:column;gap:30px}.match-section{width:100%}.picks-column{order:-1;position:static;width:100%}.picks-panel{padding:18px}.top-picks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:13px}.pick-row{grid-template-columns:23px minmax(0,1fr);gap:7px}.pick-metric{grid-column:2;grid-row:2;text-align:left;font-size:14px}.pick-metric small{display:inline;margin-left:5px}.pick-teams{font-size:10px}.info-panel{display:none}.section-head h2{font-size:25px}.method-section{margin-top:48px}.method-grid{grid-template-columns:repeat(2,1fr)}.status-line{flex-direction:column;gap:3px}.source-row select{max-width:215px}footer{flex-wrap:wrap;gap:6px}.fixture-body{grid-template-columns:minmax(0,1fr) 118px}.team{font-size:12px}.pick-box{padding:10px}.pick-box strong{font-size:13px}}
@media(max-width:390px){.date-block{flex-wrap:wrap}.top-bar input[type=date]{max-width:118px}.today-btn{font-size:10px}.team-logo,.team-placeholder{width:22px;height:22px}.match-card{padding:13px}.team{gap:6px}.pick-box .pick-prob{font-size:9px}.filter-tab{padding:8px 10px}.filter-row{flex-wrap:wrap}.filters select{width:100%}.pick-box strong{font-size:12px}}

.copy-picks{border:1px solid #456a44;background:#243b2b;border-radius:8px;color:#bdedac;width:100%;text-align:center;padding:10px;margin:14px 0 0;font-size:11px;font-weight:800}.copy-picks:hover{background:#a5fa78;color:#15271b}

/* Phone-specific usability: sticky pick panel is shown first below the control/stat sections */
@media (max-width: 767px) {
  .app-shell {overflow-x:hidden}
  .main-grid {display:flex;flex-direction:column}
  .picks-column {order:-1;width:100%}
  .picks-panel {position:static;max-height:none}
  button,select,input {touch-action:manipulation}
  .filter-tab {min-height:43px}
  .date-block .stepper {min-width:42px;min-height:44px}
  .picks-panel .pick-row {min-height:55px}
}
