/* golo. — futsal AFSA */
:root{
  --bg:#F4F4F6; --card:#FFFFFF; --soft:#EBEBF0; --ink:#111114; --ink2:#5B5B66; --ink3:#9A9AA6; --hair:#E4E4EA;
  --l1:#FF3D2E; --l2:#2F5BFF; --vet:#8A4DFF; --cup:#FF2E8A;
  --c:var(--l1); --on-c:#fff;
  --ok:#11A86B; --mid:#F0A100; --ko:#F0443A;
  --yellow:#FFCC1A; --red:#F0443A;
  --disp:"Unbounded",system-ui,sans-serif;
  --txt:"Manrope",system-ui,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--bg:#0B0B0E;--card:#16161B;--soft:#202027;--ink:#F3F3F6;--ink2:#A9A9B6;--ink3:#6C6C79;--hair:#24242C;color-scheme:dark}
}
:root[data-theme="dark"]{--bg:#0B0B0E;--card:#16161B;--soft:#202027;--ink:#F3F3F6;--ink2:#A9A9B6;--ink3:#6C6C79;--hair:#24242C;color-scheme:dark}
[data-c="1divisao"]{--c:var(--l1)} [data-c="2divisao"]{--c:var(--l2)} [data-c="veteranos"]{--c:var(--vet)} [data-c="cup"]{--c:var(--cup)}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font:600 15px/1.45 var(--txt);-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
a{color:inherit;text-decoration:none}
.app{max-width:520px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 18px) 0 calc(110px + env(safe-area-inset-bottom))}
#app{outline:none}
.d{font-family:var(--disp)}
.px{padding-left:20px;padding-right:20px}

/* ---------- dock ---------- */
.dock{position:fixed;z-index:40;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;gap:4px;padding:6px;border-radius:24px;background:color-mix(in srgb,var(--ink) 92%,transparent);backdrop-filter:blur(14px);box-shadow:0 14px 40px -12px rgba(0,0,0,.45)}
.dock a{display:flex;align-items:center;gap:8px;height:48px;min-width:48px;padding:0 13px;border-radius:18px;color:color-mix(in srgb,var(--bg) 60%,transparent);transition:background .2s,color .2s}
.dock svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.dock span{display:none;font:800 13.5px var(--txt)}
.dock a.on{background:var(--bg);color:var(--ink)}
.dock a.on span{display:inline}
@media (max-width:360px){.dock a{padding:0 11px}.dock a.on span{display:none}}

/* ---------- top ---------- */
.top{display:flex;align-items:center;gap:10px;padding:0 20px;margin-bottom:18px}
.word{font:900 24px/1 var(--disp);letter-spacing:-.04em;margin-right:auto}
.word i{font-style:normal;color:var(--l1)}
.round{width:42px;height:42px;border-radius:50%;background:var(--card);display:grid;place-items:center;flex:none;box-shadow:0 0 0 1px var(--hair)}
.round svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2}
.round .crest{width:28px;height:28px}
.back{display:inline-flex;align-items:center;gap:6px;font:800 14px var(--txt);color:var(--ink2)}
.back svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4}

.big{font:900 clamp(38px,11vw,54px)/.92 var(--disp);letter-spacing:-.045em;margin:0}
.big em{font-style:normal;color:var(--c)}
.sub{color:var(--ink2);margin:8px 0 0;font-weight:600}
.lbl{font:800 11.5px var(--txt);letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.sec{margin-top:34px}
.sh{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0 20px;margin-bottom:12px}
.sh h2{margin:0;font:700 19px/1.1 var(--disp);letter-spacing:-.03em}
.sh a,.sh button{font:800 13.5px var(--txt);color:var(--c)}
.muted{color:var(--ink3)}
.empty{margin:0 20px;padding:24px;border-radius:22px;background:var(--card);text-align:center;color:var(--ink3)}
.note{margin:14px 20px 0;font-size:13px;color:var(--ink3);font-weight:500}

/* crest */
.crest{width:26px;height:26px;object-fit:contain;flex:none}
.crest.m{width:40px;height:40px}
.crest.l{width:64px;height:64px}
.crest.xl{width:96px;height:96px}
.mono{display:grid;place-items:center;border-radius:50%;background:var(--soft);color:var(--ink2);font:700 9px var(--disp)}

/* ---------- swipe rails ---------- */
.rail{display:flex;gap:12px;overflow-x:auto;padding:2px 20px 6px;scroll-snap-type:x mandatory;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start;flex:none}

/* competition tiles */
.tile{width:min(78vw,300px);min-height:188px;border-radius:26px;padding:18px;background:var(--c);color:var(--on-c);display:flex;flex-direction:column;position:relative;overflow:hidden}
.tile::after{content:"";position:absolute;right:-50px;bottom:-60px;width:180px;height:180px;border-radius:50%;border:2px solid rgba(255,255,255,.25)}
.tile::before{content:"";position:absolute;right:38px;bottom:28px;width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.4)}
.tile .lbl{color:rgba(255,255,255,.75)}
.tile h3{margin:6px 0 0;font:900 26px/1 var(--disp);letter-spacing:-.04em}
.tile .lead{margin-top:auto;display:flex;align-items:center;gap:10px;position:relative;z-index:1}
.tile .lead .crest{background:#fff;border-radius:50%;padding:3px;width:38px;height:38px}
.tile .lead b{display:block;font:700 15px/1.1 var(--disp);letter-spacing:-.02em}
.tile .lead small{font-size:12.5px;opacity:.8}
.tile .nx{margin-top:14px;font:800 13px var(--txt);opacity:.9}

/* alerts */
.notes{display:flex;flex-direction:column;gap:8px;padding:0 20px}
.notice{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:20px;background:var(--card);font-weight:700;font-size:14px}
.notice .dot{width:10px;height:10px;border-radius:50%;background:var(--ink3);flex:none}
.notice.urgente .dot{background:var(--l1);box-shadow:0 0 0 4px color-mix(in srgb,var(--l1) 20%,transparent)}

/* stat bubbles */
.bubbles{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 20px}
.bub{border-radius:22px;padding:16px;background:var(--card)}
.bub .v{font:900 34px/1 var(--disp);letter-spacing:-.05em;margin-top:6px}
.bub .s{font-size:13px;color:var(--ink2);margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bub.ink{background:var(--ink);color:var(--bg)}
.bub.ink .lbl,.bub.ink .s{color:color-mix(in srgb,var(--bg) 65%,transparent)}

/* ---------- fixtures (scoreboard list) ---------- */
.group{margin:0 20px;border-radius:24px;background:var(--card);overflow:hidden}
.group-h{display:flex;align-items:center;gap:8px;padding:14px 16px 4px;font:800 12px var(--txt);letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.group-h .pip{width:8px;height:8px;border-radius:50%;background:var(--c)}
.group-h span:last-child{margin-left:auto;letter-spacing:.04em}
.fx{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;width:100%;text-align:left;padding:12px 16px;border-top:1px solid var(--hair)}
.group-h+.fx{border-top:0}
.fx:active{background:var(--soft)}
.fx-m{font:700 12.5px/1.25 var(--txt);color:var(--ink3)}
.fx-m b{display:block;color:var(--ink);font:700 14px var(--disp);letter-spacing:-.02em}
.fx-m .live{color:var(--c)}
.fx-ts{display:flex;flex-direction:column;gap:7px;min-width:0;padding-left:12px;border-left:1px solid var(--hair)}
.fx-t{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:10px;align-items:center;font:700 15px var(--txt)}
.fx-t .n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fx-t .g{font:900 19px/1 var(--disp);min-width:22px;text-align:right;letter-spacing:-.03em}
.fx-t.lo{color:var(--ink3)}
.fx-t.lo .g{font-weight:500}
.fx.me{box-shadow:inset 4px 0 0 var(--c)}
.tag{display:inline-block;font:800 10.5px var(--txt);letter-spacing:.1em;text-transform:uppercase;padding:3px 7px;border-radius:7px;background:var(--soft);color:var(--ink2)}
.tag.bad{background:color-mix(in srgb,var(--ko) 15%,transparent);color:var(--ko)}

/* ---------- comp switch & round stepper ---------- */
.switch{display:flex;gap:8px;padding:0 20px;overflow-x:auto;scrollbar-width:none}
.switch::-webkit-scrollbar{display:none}
.sw{flex:none;display:flex;align-items:center;gap:8px;height:42px;padding:0 16px;border-radius:999px;background:var(--card);font:800 14px var(--txt);color:var(--ink2);box-shadow:0 0 0 1px var(--hair)}
.sw i{width:9px;height:9px;border-radius:50%;background:var(--c)}
.sw.on{background:var(--c);color:var(--on-c);box-shadow:none}
.sw.on i{background:#fff}
.stepper{display:grid;grid-template-columns:52px 1fr 52px;align-items:center;gap:8px;margin:18px 20px 0;padding:8px;border-radius:26px;background:var(--c);color:var(--on-c)}
.stepper button,.stepper a{width:52px;height:52px;border-radius:20px;display:grid;place-items:center;background:rgba(255,255,255,.16);color:#fff}
.stepper svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}
.stepper .dis{opacity:.3;pointer-events:none}
.stepper .mid{text-align:center}
.stepper .mid b{display:block;font:900 30px/1 var(--disp);letter-spacing:-.04em}
.stepper .mid small{font:700 13px var(--txt);opacity:.85}
.ticks{display:flex;gap:4px;margin:12px 20px 0;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
.ticks::-webkit-scrollbar{display:none}
.tk{flex:none;width:28px;height:28px;border-radius:9px;background:var(--card);font:700 11px var(--disp);display:grid;place-items:center;color:var(--ink3);box-shadow:0 0 0 1px var(--hair)}
.tk.done{color:var(--ink)}
.tk.on{background:var(--ink);color:var(--bg);box-shadow:none}
.tk.br{width:10px;background:transparent;box-shadow:none;color:var(--ink3)}
.breaknote{margin:12px 20px 0;padding:12px 16px;border-radius:18px;border:1.5px dashed var(--hair);font-size:13.5px;color:var(--ink2)}
.filter{display:flex;align-items:center;gap:10px;margin:16px 20px 12px}
.filter select{flex:1;appearance:none;height:46px;border:0;border-radius:16px;padding:0 40px 0 16px;background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%239A9AA6' stroke-width='2'/%3E%3C/svg%3E") right 16px center no-repeat;font:700 14.5px var(--txt);color:var(--ink);box-shadow:0 0 0 1px var(--hair)}

/* ---------- segmented ---------- */
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;margin:16px 20px 0;padding:4px;border-radius:18px;background:var(--soft)}
.seg a{display:grid;place-items:center;height:40px;border-radius:14px;font:800 13.5px var(--txt);color:var(--ink2)}
.seg a.on{background:var(--card);color:var(--ink);box-shadow:0 2px 8px -4px rgba(0,0,0,.25)}

/* ---------- standings ---------- */
.tbl{margin:16px 20px 0;border-radius:24px;background:var(--card);overflow:hidden}
.st{display:grid;grid-template-columns:34px minmax(0,1fr) 30px 40px 44px;align-items:center;gap:6px;width:100%;text-align:left;padding:11px 14px;border-top:1px solid var(--hair)}
.st:first-child{border-top:0}
.st-h{padding:12px 14px 8px;font:800 11px var(--txt);letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.st-h+.st{border-top:0}
.st>span:nth-child(n+3){text-align:right}
.st .ps{font:900 17px var(--disp);letter-spacing:-.04em;color:var(--ink3)}
.st.top .ps{color:var(--c)}
.st .tm{display:flex;align-items:center;gap:10px;min-width:0}
.st .tm div{min-width:0}
.st .tm b{display:block;font:700 15px/1.15 var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st .tm small{display:block;height:4px;margin-top:6px;border-radius:2px;background:var(--soft);overflow:hidden}
.st .tm small i{display:block;height:100%;background:var(--c);border-radius:2px}
.st .n{font:700 14px var(--txt);color:var(--ink2)}
.st .p{font:900 18px var(--disp);letter-spacing:-.04em}
.st.me{background:color-mix(in srgb,var(--c) 10%,transparent)}
.dots{display:flex;gap:3px;justify-content:flex-end}
.dots i{width:8px;height:8px;border-radius:50%}
.V{background:var(--ok)} .E{background:var(--mid)} .D{background:var(--ko)}

/* ranking lists */
.rank{margin:16px 20px 0;border-radius:24px;background:var(--card);overflow:hidden}
.rk{display:grid;grid-template-columns:30px 36px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 16px;border-top:1px solid var(--hair)}
.rk:first-child{border-top:0}
.rk .i{font:900 15px var(--disp);color:var(--ink3)}
.rk b{display:block;font:700 15px/1.2 var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rk small{font-size:12.5px;color:var(--ink3)}
.rk .v{font:900 22px var(--disp);letter-spacing:-.04em}
.hero-rk{margin:16px 20px 0;border-radius:26px;padding:20px;background:var(--c);color:var(--on-c);display:flex;align-items:center;gap:16px}
.hero-rk .crest{background:#fff;border-radius:50%;padding:6px;width:64px;height:64px}
.hero-rk .v{margin-left:auto;font:900 54px/1 var(--disp);letter-spacing:-.05em}
.hero-rk b{display:block;font:700 19px/1.1 var(--disp);letter-spacing:-.03em}
.hero-rk small{opacity:.8;font-size:13px}
.cards{display:inline-flex;gap:10px;font:900 16px var(--disp)}
.cd{display:inline-block;width:11px;height:15px;border-radius:3px;vertical-align:-2px;margin-right:4px}
.cd.y{background:var(--yellow)} .cd.r{background:var(--red)}

/* ---------- clubs ---------- */
.az{margin:0 20px;border-radius:24px;background:var(--card);overflow:hidden}
.cl{display:grid;grid-template-columns:44px minmax(0,1fr) auto 16px;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid var(--hair)}
.cl:first-child{border-top:0}
.cl b{display:block;font:700 16px/1.15 var(--txt)}
.cl small{font-size:12.5px;color:var(--ink3)}
.cl .pp{font:900 15px var(--disp);color:var(--c);letter-spacing:-.03em}
.cl svg{width:16px;height:16px;fill:none;stroke:var(--ink3);stroke-width:2.4}
.cl.me b::after{content:" ★";color:var(--c)}

.club-top{padding:0 20px}
.club-id{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;margin-top:20px}
.club-id .crest.xl{filter:drop-shadow(0 14px 22px rgba(0,0,0,.18))}
.club-id .big{font-size:clamp(34px,10vw,48px)}
.pills{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.pill{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:999px;background:var(--card);font:800 13px var(--txt);box-shadow:0 0 0 1px var(--hair)}
.pill.c{background:var(--c);color:var(--on-c);box-shadow:none}
.facts{display:grid;grid-template-columns:repeat(4,1fr);margin:22px 20px 0;border-radius:24px;background:var(--ink);color:var(--bg);overflow:hidden}
.facts div{padding:16px 6px;text-align:center}
.facts b{display:block;font:900 22px/1 var(--disp);letter-spacing:-.04em}
.facts small{font:700 11px var(--txt);letter-spacing:.08em;text-transform:uppercase;opacity:.6}
.info{margin:12px 20px 0;display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:20px;background:var(--card);font-size:14px}
.info span{color:var(--ink2)}
.info b{color:var(--ink)}
.squad{margin:0 20px;border-radius:24px;background:var(--card);overflow:hidden}
.pl{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 16px;border-top:1px solid var(--hair)}
.pl:first-child{border-top:0}
.pl .no{width:44px;height:44px;border-radius:14px;background:var(--soft);display:grid;place-items:center;font:900 16px var(--disp);letter-spacing:-.04em}
.pl.gk .no{background:var(--c);color:var(--on-c)}
.pl b{display:block;font:700 15px/1.2 var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl small{font-size:12.5px;color:var(--ink3)}
.pl .sx{display:flex;gap:10px;font:900 14px var(--disp);align-items:center}

/* ---------- cups ---------- */
.cup-top{margin:0 20px;border-radius:28px;padding:22px 20px;background:var(--c);color:var(--on-c);position:relative;overflow:hidden}
.cup-top::after{content:"";position:absolute;right:-30px;top:-30px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.14)}
.cup-top .lbl{color:rgba(255,255,255,.8)}
.cup-top h1{margin:8px 0 0;font:900 32px/1 var(--disp);letter-spacing:-.045em;position:relative}
.cup-top p{margin:8px 0 0;font-size:14px;opacity:.85;position:relative}
.path{display:flex;flex-direction:column;margin:16px 20px 0}
.pt{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 0;position:relative}
.pt::before{content:"";position:absolute;left:10px;top:0;bottom:0;width:2px;background:var(--hair)}
.pt:first-child::before{top:50%} .pt:last-child::before{bottom:50%}
.pt i{position:relative;width:22px;height:22px;border-radius:50%;background:var(--bg);border:2.5px solid var(--hair)}
.pt.past i{background:var(--ink3);border-color:var(--ink3)}
.pt.now i{background:var(--c);border-color:var(--c);box-shadow:0 0 0 5px color-mix(in srgb,var(--c) 20%,transparent)}
.pt b{font:700 15px var(--disp);letter-spacing:-.03em}
.pt small{display:block;font-size:12.5px;color:var(--ink3)}
.pt span:last-child{font:800 13px var(--txt);color:var(--ink2);text-align:right}

/* ---------- match page ---------- */
.mp{margin:14px 20px 0;border-radius:30px;padding:22px 16px 20px;background:var(--c);color:var(--on-c);text-align:center;position:relative;overflow:hidden}
.mp::before{content:"";position:absolute;left:50%;top:50%;width:200px;height:200px;margin:-100px 0 0 -100px;border-radius:50%;border:2px solid rgba(255,255,255,.18)}
.mp::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:rgba(255,255,255,.12)}
.mp .lbl{color:rgba(255,255,255,.8);position:relative;z-index:1}
.mp-row{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;margin-top:18px}
.mp-t{display:flex;flex-direction:column;align-items:center;gap:10px;font:700 15px/1.1 var(--disp);letter-spacing:-.02em}
.mp-t .crest{background:#fff;border-radius:50%;padding:8px;width:76px;height:76px}
.mp-s{font:900 58px/1 var(--disp);letter-spacing:-.06em}
.mp-s.p{font-size:30px}
.mp-s small{display:block;font:800 11px var(--txt);letter-spacing:.14em;opacity:.8;margin-top:6px}
.mp-f{position:relative;z-index:1;margin-top:16px;font-size:13.5px;opacity:.9}
.tl{margin:0 20px;border-radius:24px;background:var(--card);padding:6px 0}
.tl-r{display:grid;grid-template-columns:1fr 34px 1fr;align-items:center;gap:6px;padding:7px 14px;font-size:14px}
.tl-r .c{display:grid;place-items:center}
.tl-r .c svg{width:18px;height:18px}
.tl-r .h{text-align:right}
.tl-r .x{font:900 13px var(--disp);color:var(--c)}
.lineup{display:grid;grid-template-columns:1fr 1fr;margin:0 20px;border-radius:24px;background:var(--card);overflow:hidden}
.lineup ol{list-style:none;margin:0;padding:10px 14px;min-width:0}
.lineup ol+ol{border-left:1px solid var(--hair)}
.lineup li{display:flex;gap:8px;padding:4px 0;font-size:13.5px}
.lineup li span{font:900 12px/1.6 var(--disp);color:var(--ink3);width:22px;flex:none}
.lineup li.s{color:var(--ink3);font-size:12.5px}

/* fav picker */
.picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:0 20px;margin-top:20px}
.pick{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:104px;padding:12px 6px;border-radius:22px;background:var(--card);font:800 12.5px/1.15 var(--txt);text-align:center}
.pick.on{background:var(--ink);color:var(--bg)}