/* ═══════════════════════════════════════════
   CricBun Global Shell — extracted from
   html/cricbun-global-shell-components.html
   ═══════════════════════════════════════════ */

:root{color-scheme:light;--bg:oklch(96% .007 230);--paper:oklch(99.5% .004 230);--paper-2:oklch(98% .008 230);--ink:oklch(22% .025 236);--muted:oklch(52% .018 236);--soft:oklch(72% .012 236);--line:oklch(89% .01 236);--cyan:oklch(63% .13 221);--cyan-d:oklch(47% .115 221);--cyan-p:oklch(94% .035 221);--red:oklch(60% .2 27);--red-p:oklch(96% .025 27);--green:oklch(55% .13 151);--green-p:oklch(95% .025 151);--amber:oklch(70% .13 78);--amber-p:oklch(96% .025 78);--navy:oklch(27% .045 238);--shadow-sm:0 4px 14px oklch(24% .02 235/.07);--shadow-lg:0 18px 55px oklch(20% .025 238/.16);--wrap:min(1180px,calc(100% - 28px));--ease:cubic-bezier(.16,1,.3,1)}
html[data-theme="dark"]{color-scheme:dark;--bg:oklch(16% .018 238);--paper:oklch(20% .022 238);--paper-2:oklch(24% .025 238);--ink:oklch(93% .008 230);--muted:oklch(72% .014 230);--soft:oklch(54% .015 238);--line:oklch(31% .025 238);--cyan:oklch(70% .115 221);--cyan-d:oklch(75% .1 221);--cyan-p:oklch(27% .045 221);--red-p:oklch(25% .045 27);--green-p:oklch(25% .035 151);--amber-p:oklch(26% .035 78);--navy:oklch(12% .02 238);--shadow-sm:none;--shadow-lg:0 20px 60px oklch(7% .015 238/.5)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:500 16px/1.5 Inter,system-ui,sans-serif;font-optical-sizing:auto}
body.locked{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{cursor:pointer}
h1,h2,h3,p{margin:0}
h1,h2,h3{text-wrap:balance}
.wrap{width:var(--wrap);margin:auto}
.skip{position:fixed;left:12px;top:8px;z-index:100;transform:translateY(-150%);background:var(--navy);color:oklch(95% .006 230);padding:10px 14px;border-radius:8px}
.skip:focus{transform:none}
.utility{background:var(--navy);color:oklch(92% .008 230)}
.utilityin{height:34px;display:flex;align-items:center;justify-content:space-between;font-size:.66rem}
.utilitylinks{display:flex;gap:18px;color:oklch(76% .014 230)}
.mast{position:sticky;top:0;z-index:30;background:var(--cyan);color:oklch(99% .003 230);box-shadow:0 2px 9px oklch(30% .05 221/.18)}
.navrow{height:58px;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:8px;font-size:1.27rem;font-weight:800;letter-spacing:-.06em}
.ball{width:27px;height:27px;border:3px solid currentColor;border-radius:50%;position:relative}
.ball:after{content:"";position:absolute;width:16px;border-top:2px dashed currentColor;transform:rotate(48deg);top:10px;left:2px}
.primarynav{display:flex;align-items:center;gap:18px;height:100%;font-size:.76rem;font-weight:700}
.navlink{height:100%;display:flex;align-items:center;border-bottom:3px solid transparent}
.navlink:hover,.navlink.active{border-color:currentColor}
.navmenu{position:relative;height:100%;display:flex;align-items:center}
.navtrigger{height:100%;border:0;border-bottom:3px solid transparent;background:transparent;color:inherit;font-weight:700;padding:0;display:flex;align-items:center;gap:4px}
.mega{position:fixed;top:92px;left:50%;width:min(900px,calc(100% - 28px));transform:translate(-50%,-8px);opacity:0;pointer-events:none;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-lg);padding:18px;transition:opacity 180ms var(--ease),transform 220ms var(--ease)}
.navmenu:hover .mega,.navmenu:focus-within .mega{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.megagrid{display:grid;grid-template-columns:1.25fr repeat(3,1fr);gap:20px}
.livecard{padding:15px;border-radius:10px;background:var(--navy);color:oklch(94% .008 230)}
.livecard small{font-size:.5rem;color:var(--cyan);font-weight:800}
.liveteam{display:flex;justify-content:space-between;font-size:.64rem;font-weight:700;margin-top:8px}
.livecard p{font-size:.49rem;color:oklch(72% .015 230);margin-top:9px}
.megacol h3{font-size:.56rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.megalinks{display:grid;gap:8px;margin-top:10px;font-size:.58rem}
.megalinks a:hover{color:var(--cyan-d)}
.actions{margin-left:auto;display:flex;gap:7px}
.iconbtn{width:40px;height:40px;border:0;border-radius:9px;background:oklch(99% .003 230/.15);color:inherit;display:grid;place-items:center;position:relative}
.notificationdot{position:absolute;right:7px;top:7px;width:7px;height:7px;border:2px solid var(--cyan);border-radius:50%;background:var(--red)}
.mobiletoggle{display:none}
.mobilepanel{position:fixed;inset:0;z-index:60;display:none;background:var(--paper);color:var(--ink);padding:16px;overflow:auto}
.mobilepanel.on{display:block}
.mobilehead{height:48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.mobilehead button{width:40px;height:40px;border:0;background:transparent;color:inherit}
.mobilenav{display:grid;padding:14px 0}
.mobilenav a,.mobileaccordion button{min-height:48px;border:0;border-bottom:1px solid var(--line);background:transparent;color:inherit;padding:0 4px;font-size:.72rem;font-weight:700;text-align:left;display:flex;align-items:center;justify-content:space-between}
.mobilechildren{display:none;padding:8px 12px;background:var(--paper-2)}
.mobilechildren.on{display:grid}
.mobilechildren a{min-height:42px;font-size:.61rem;font-weight:500}
.scores{background:var(--paper);border-bottom:1px solid var(--line)}
.scoretrack{display:flex;overflow:auto;scrollbar-width:none;scroll-snap-type:x proximity}
.score{flex:0 0 280px;padding:12px 15px;border-right:1px solid var(--line);scroll-snap-align:start;position:relative}
.score.active:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--red)}
.meta,.line{display:flex;justify-content:space-between}
.meta{font-size:.59rem;color:var(--muted);text-transform:uppercase}
.meta .live{color:var(--red);font-weight:800}
.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--red);animation:pulse 1.6s infinite}
.line{font-size:.75rem;font-weight:700;margin-top:6px}
.score .status{font-size:.61rem;color:var(--muted);margin-top:5px}
.flashregion{position:fixed;right:16px;top:106px;z-index:50;display:grid;gap:8px;width:min(390px,calc(100% - 32px));pointer-events:none}
.flash{display:grid;grid-template-columns:30px 1fr auto;gap:9px;align-items:start;padding:12px;background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-lg);pointer-events:auto;animation:flashIn 300ms var(--ease) both}
.flash.success{background:var(--green-p);border-color:oklch(84% .04 151)}
.flash.error{background:var(--red-p);border-color:oklch(84% .05 27)}
.flash.warning{background:var(--amber-p);border-color:oklch(84% .05 78)}
.flashicon{width:30px;height:30px;border-radius:8px;background:var(--paper);display:grid;place-items:center;color:var(--cd)}
.flash.success .flashicon{color:var(--green)}
.flash.error .flashicon{color:var(--red)}
.flash.warning .flashicon{color:oklch(50% .11 78)}
.flash h3{font-size:.61rem}
.flash p{font-size:.51rem;color:var(--muted);margin-top:3px}
.flashclose{width:32px;height:32px;border:0;background:transparent;color:var(--muted)}
.searchdialog{width:min(760px,calc(100% - 24px));max-height:min(720px,calc(100vh - 30px));border:0;border-radius:14px;background:var(--paper);color:var(--ink);padding:0;box-shadow:var(--shadow-lg);overflow:hidden}
.searchdialog::backdrop{background:oklch(12% .025 238/.72)}
.searchhead{display:grid;grid-template-columns:44px 1fr auto;align-items:center;border-bottom:1px solid var(--line);padding:8px}
.searchhead input{height:48px;border:0;background:transparent;color:var(--ink);font-size:.82rem;min-width:0}
.searchhead input:focus{outline:0}
.searchhead i{margin:auto;color:var(--muted)}
.esc{border:1px solid var(--line);border-radius:6px;background:var(--paper-2);color:var(--muted);padding:5px 7px;font-size:.47rem}
.searchbody{padding:12px;overflow:auto;max-height:570px}
.searchlabel{font-size:.49rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:800;padding:5px 7px}
.searchresult{width:100%;border:0;border-radius:8px;background:transparent;color:inherit;padding:10px;text-align:left;display:grid;grid-template-columns:38px 1fr auto;gap:9px;align-items:center}
.searchresult:hover,.searchresult.active{background:var(--cyan-p)}
.resulticon{width:38px;height:38px;border-radius:9px;background:var(--paper-2);color:var(--cyan-d);display:grid;place-items:center;font-size:.5rem;font-weight:800}
.searchresult h3{font-size:.59rem}
.searchresult p{font-size:.47rem;color:var(--muted);margin-top:2px}
.searchresult span:last-child{font-size:.47rem;color:var(--muted)}
.searchfoot{min-height:42px;padding:8px 12px;border-top:1px solid var(--line);display:flex;gap:14px;align-items:center;font-size:.46rem;color:var(--muted)}
.searchEmpty{display:none;text-align:center;padding:45px 15px;color:var(--muted);font-size:.57rem}
.cookie{position:fixed;left:16px;bottom:16px;z-index:45;width:min(440px,calc(100% - 32px));background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-lg);padding:17px;transform:translateY(calc(100% + 35px));opacity:0;pointer-events:none;transition:transform 350ms var(--ease),opacity 220ms}
.cookie.on{transform:none;opacity:1;pointer-events:auto}
.cookiehead{display:flex;gap:10px;align-items:start}
.cookieicon{width:38px;height:38px;border-radius:9px;background:var(--cyan-p);color:var(--cyan-d);display:grid;place-items:center;flex:none}
.cookie h2{font-size:.73rem}
.cookie p{font-size:.53rem;color:var(--muted);margin-top:5px}
.cookieactions{display:flex;gap:7px;margin-top:14px}
.cookieactions button{flex:1;height:40px;border-radius:8px;font-size:.53rem;font-weight:700}
.cookieprefs{display:none;margin-top:14px;border-top:1px solid var(--line);padding-top:5px}
.cookieprefs.on{display:block}
.pref{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.pref h3{font-size:.57rem}
.pref p{font-size:.47rem;margin-top:2px}
.toggle{width:38px;height:22px;border:0;border-radius:999px;background:var(--line);padding:3px}
.toggle:after{content:"";display:block;width:16px;height:16px;border-radius:50%;background:var(--paper);transition:transform 160ms var(--ease)}
.toggle.on{background:var(--cyan-d)}
.toggle.on:after{transform:translateX(16px)}
.toggle:disabled{background:var(--green)}
.footermain{background:var(--navy);color:oklch(93% .008 230);padding:46px 0 28px}
.footergrid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:32px}
.footerbrand h2{font-size:1.15rem}
.footerbrand p{font-size:.59rem;color:oklch(72% .015 230);max-width:38ch;margin-top:9px}
.footcol h3{font-size:.54rem;text-transform:uppercase;letter-spacing:.08em}
.footlinks{display:grid;gap:7px;margin-top:11px;font-size:.56rem;color:oklch(72% .015 230)}
.footbottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid oklch(36% .035 238);margin-top:31px;padding-top:20px;font-size:.5rem;color:oklch(65% .015 230)}
.legal{display:flex;gap:14px;flex-wrap:wrap}
.themefloating{position:fixed;right:14px;bottom:14px;z-index:40;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--ink);box-shadow:var(--shadow-sm);display:grid;place-items:center}
.mobilebottom{display:none}
@keyframes flashIn{from{opacity:0;transform:translateX(15px)}to{opacity:1;transform:none}}
@keyframes pulse{70%{box-shadow:0 0 0 7px oklch(60% .2 27/0)}}
:focus-visible{outline:3px solid oklch(76% .11 221);outline-offset:3px}
@media(max-width:960px){.primarynav{display:none}.mobiletoggle{display:grid}.footergrid{grid-template-columns:1.4fr repeat(3,1fr)}.footergrid>div:last-child{display:none}}
@media(max-width:680px){:root{--wrap:min(100% - 16px,1180px)}.utility{display:none}.navrow{height:52px}.brand{font-size:1.08rem}.actions .iconbtn:nth-child(3){display:none}.scoretrack .score{flex-basis:86vw}.flashregion{top:62px;right:8px;width:calc(100% - 16px)}.footergrid{grid-template-columns:1fr 1fr}.footerbrand{grid-column:1/-1}.footergrid>div:nth-child(n+4){display:none}.footbottom{display:grid;gap:10px}.cookie{left:8px;right:8px;bottom:74px;width:auto}.themefloating{bottom:79px;right:12px}.mobilebottom{position:fixed;display:flex;z-index:35;left:8px;right:8px;bottom:8px;height:58px;border-radius:13px;background:var(--navy);align-items:center;justify-content:space-around;color:oklch(72% .015 230);box-shadow:0 15px 40px oklch(12% .025 238/.35)}.mobilebottom a{display:grid;justify-items:center;gap:1px;font-size:.48rem}.mobilebottom .active{color:var(--cyan)}.footermain{padding-bottom:90px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}