/* soccercareer.app: shared styles for content pages, the home page's crawlable section, the footer and the consent banner */
.sc-page{--bg:#0a1128;--panel:#121e46;--line:#26397a;--fg:#f4f1e8;--muted:#97a4cc;--gold:#f5b42a;--gold2:#ffd97a;
  --display:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;--cond:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;--body:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);font-size:17px;line-height:1.6;color-scheme:dark;
  background-image:radial-gradient(60% 40% at 10% -8%,rgba(255,236,190,.14),transparent 70%),radial-gradient(60% 40% at 90% -8%,rgba(255,236,190,.1),transparent 70%)}
.sc-page *{box-sizing:border-box}
.sc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:880px;margin:0 auto;padding:18px 16px}
.sc-logo{display:flex;align-items:center;gap:10px;color:var(--fg);text-decoration:none;font-family:var(--display);font-weight:900;font-size:24px;letter-spacing:.01em;text-transform:uppercase}
.sc-logo img{width:34px;height:34px;border-radius:8px}
.sc-play{font-family:var(--cond);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:15px;color:#0a1128;background:var(--gold);padding:10px 16px;border-radius:10px;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.sc-play:hover{background:var(--gold2)}
.sc-doc{max-width:880px;margin:0 auto;padding:8px 16px 40px}
.sc-doc .crumbs{font-family:var(--cond);font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:6px 0 4px}
.sc-doc .crumbs a{color:var(--muted)}
.sc-doc h1{font-family:var(--display);font-weight:900;font-size:clamp(40px,8vw,64px);line-height:.95;text-transform:uppercase;margin:8px 0 10px}
.sc-doc .updated{color:var(--muted);font-size:15px;margin:0 0 26px}
.sc-doc h2,.seo h2{font-family:var(--display);font-weight:800;font-size:clamp(26px,4.6vw,34px);line-height:1.05;text-transform:uppercase;margin:34px 0 10px;color:var(--fg)}
.sc-doc h3,.seo h3{font-family:var(--cond);font-weight:700;font-size:21px;margin:22px 0 6px;color:var(--gold2)}
.sc-doc a,.seo a{color:var(--gold2)}
.sc-doc ul,.sc-doc ol,.seo ul,.seo ol{padding-left:22px}
.sc-doc li,.seo li{margin:4px 0}
.sc-doc .card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin:18px 0}
.sc-doc table{width:100%;border-collapse:collapse;font-size:15px;margin:12px 0}
.sc-doc th,.sc-doc td{border-bottom:1px solid var(--line);padding:8px 6px;text-align:left;vertical-align:top}
.sc-doc th{font-family:var(--cond);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700}
.tablewrap{overflow-x:auto}

/* home page: crawlable guide under the game (setup screen only) */
.seo{--muted:#97a4cc;--line:#26397a;--panel:#121e46;--gold2:#ffd97a;max-width:1180px;margin:0 auto;padding:12px 16px 30px;color:#d9dcea;font-size:17px;line-height:1.6}
.seo .seo-in{border-top:1px solid var(--line);padding-top:10px}
.seo .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:14px 0}
.seo .grid>div{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.seo .grid h3{margin-top:0}
.seo details{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin:8px 0;padding:0 16px}
.seo details>summary{cursor:pointer;font-weight:600;color:#f4f1e8;min-height:48px;display:flex;align-items:center}
.seo details>p{margin:0 0 14px}
body[data-screen="play"] .seo,body[data-screen="summary"] .seo{display:none}

/* footer, shared */
.sc-foot{border-top:1px solid #26397a;color:#97a4cc;font-size:14px;line-height:1.5;padding:22px 16px 28px}
.sc-foot .in{max-width:1180px;margin:0 auto;display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;justify-content:space-between}
.sc-foot nav{display:flex;flex-wrap:wrap;gap:4px 6px}
.sc-foot nav a{color:#d9dcea;text-decoration:none;padding:10px 8px;min-height:44px;display:inline-flex;align-items:center}
.sc-foot nav a:hover{color:#ffd97a;text-decoration:underline}
.sc-foot small{display:block;max-width:640px}
body[data-screen="setup"] .sc-foot{padding-bottom:calc(130px + env(safe-area-inset-bottom,0px))}
body[data-screen="play"] .sc-foot,body[data-screen="summary"] .sc-foot{padding-bottom:calc(150px + env(safe-area-inset-bottom,0px))}

/* consent banner */
.consent{position:fixed;z-index:10000;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));max-width:560px;margin:0 auto;background:#121e46;color:#f4f1e8;border:1px solid #34489a;border-radius:16px;padding:16px;box-shadow:0 18px 50px rgba(0,0,0,.55);font-family:"Barlow",system-ui,sans-serif;font-size:15px;line-height:1.45}
.consent p{margin:0 0 12px}
.consent a{color:#ffd97a}
.consent-btns{display:flex;gap:10px;justify-content:flex-end}
.cbtn{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:700;font-size:17px;letter-spacing:.06em;text-transform:uppercase;min-height:46px;padding:0 20px;border-radius:12px;border:0;background:#f5b42a;color:#0a1128;cursor:pointer;flex:1}
.cbtn.ghost{background:transparent;color:#f4f1e8;border:1px solid #34489a}
.cbtn:focus-visible,.sc-play:focus-visible,.sc-foot a:focus-visible{outline:3px solid #ffd97a;outline-offset:2px}
@media (min-width:600px){.cbtn{flex:0 0 auto}}
