/* Shared brand tokens. Football owns its green; the network uses blue. */
:root{--ks-primary:#2856c6;--ks-primary-hover:#2046a6;--ks-primary-soft:#edf2ff;--ks-primary-text:#2856c6;--ks-input-border:#7d8ba3;--ks-background:#f4f6fa;--ks-surface:#fff;--ks-surface-elevated:#fff;--ks-border:#dce3ef;--ks-text:#172a48;--ks-muted:#586780;--ks-football-primary:#187349;--ks-football:var(--ks-football-primary);--ks-football-soft:#eaf6ed;--ks-brand-navy:#193867;--ks-danger:#a43232;--ks-danger-soft:#fff0ef;--ks-focus-ring:var(--ks-primary);--ks-backdrop:#07152b80;--green:var(--ks-primary);--ink:var(--ks-text);--bright:#c7d9ff;--bg:var(--ks-background);--white:var(--ks-surface);--line:var(--ks-border);--muted:var(--ks-muted);--red:var(--ks-danger);color-scheme:light}
:root[data-theme="dark"]{color-scheme:dark;--ks-primary:#3c69cf;--ks-primary-hover:#315cc0;--ks-primary-soft:#223657;--ks-primary-text:#a9c5ff;--ks-input-border:#7086a6;--ks-background:#101827;--ks-surface:#192438;--ks-surface-elevated:#202e45;--ks-border:#384b66;--ks-text:#e8eef9;--ks-muted:#b4c1d7;--ks-football-primary:#71cd95;--ks-football:var(--ks-football-primary);--ks-football-soft:#183c2b;--ks-danger:#ffb1ac;--ks-danger-soft:#432522;--ks-focus-ring:#7c9ee7;--ks-backdrop:#030812b3}
:is(.card,.topbar,dialog,.secondary,.post-menu>div,.post-menu button,.saved-actions,.skip){color:var(--ks-text);border-color:var(--ks-border)}:is(.card,.topbar,dialog,.secondary,.saved-actions,.skip){background:var(--ks-surface)}
:is(input,textarea,select){background:var(--ks-surface);color:var(--ks-text);border-color:var(--ks-input-border)}
label,.sidebar nav a,.sidebar-foot,.section-label,.rightbar footer{color:var(--ks-muted)}
:is(.avatar,.chip,.document,.comment-content,.composer-teaser button,.empty-symbol,.welcome-hero,.file-label,.intent-badge){background:var(--ks-primary-soft);color:var(--ks-text)}
.sidebar nav a.active,.sidebar nav a:hover{background:var(--ks-primary-soft);color:var(--ks-text)}
.field-card,.profile-cover,#toast{background:var(--ks-brand-navy);color:#fff}.field-card p{color:#d2def2}.field-card .eyebrow{color:var(--bright)}.network-orbit{font-size:72px;line-height:1;margin-bottom:28px;color:#c7d9ff}.field-card{padding:var(--ks-spacing-card);border-radius:var(--ks-radius-card)}.post-body{line-height:1.8}
:focus-visible{outline:3px solid var(--ks-focus-ring);outline-offset:3px}:not(.rightbar)>.field-card :focus-visible{outline-color:#fff}input:focus,textarea:focus,select:focus{box-shadow:0 0 0 3px var(--ks-primary-soft)}
.intent-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;margin-bottom:18px;border-bottom:1px solid var(--ks-border)}[hidden],.intent-picker[hidden],.intent-summary[hidden]{display:none!important}.intent-choice:has(input:checked){border-color:var(--ks-primary);box-shadow:inset 0 0 0 1px var(--ks-primary)}
.nav-more{margin-top:10px}.nav-more summary{display:flex;justify-content:space-between;padding:14px;font-size:14px;color:var(--ks-muted)}.nav-more[open]{padding-bottom:8px}.nav-more a{font-size:13px}.sidebar nav>button{margin-top:12px;min-height:44px}.sidebar-foot{margin-top:25px}
[data-sport="football"]{--ks-sport-primary:var(--ks-football);--ks-sport-soft:var(--ks-football-soft)}
@media(max-width:700px){.topbar{height:auto;min-height:72px;flex-wrap:wrap;gap:10px;padding:14px 18px}.topbar .platform-link{font-size:11px;margin-left:0}.topbar .top-actions{margin-left:auto}.sidebar nav>button{margin:0}.intent-grid{grid-template-columns:1fr}}

.page-heading[data-sport="football"]{background:var(--ks-football-soft);border:1px solid color-mix(in srgb,var(--ks-football) 30%,var(--ks-border));padding:var(--ks-spacing-card);border-radius:var(--ks-radius-card)}.page-heading[data-sport="football"] .eyebrow{color:var(--ks-football)}

.notice:not(.error){background:var(--ks-primary-soft);color:var(--ks-text)}.post-actions .liked{background:var(--ks-primary-soft);color:var(--ks-primary-text)}.page-heading .eyebrow{color:var(--ks-primary-text)}
@media(max-width:760px){.intent-picker legend{line-height:1.4}}

.compose-options{margin:20px 0}.compose-options>summary{font-size:13px;padding:12px 0;font-weight:600}#intent-compose-fields>label:not(:first-child){margin-top:14px}

.sidebar nav .nav-more .nav-spaces{display:flex;align-items:center;gap:8px;font-weight:650}.sidebar nav .nav-more .nav-spaces .ks-icon{width:18px;height:18px}

#post-form details>summary{font-size:13px;line-height:1.5;padding:12px 0}#post-form details{margin:14px 0}

.ks-icon{width:1.25rem;height:1.25rem;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.intent-choice .ks-icon{width:1.5rem;height:1.5rem}.analytics-table{overflow-x:auto;max-width:100%}.analytics-table th,.analytics-table td{padding:.7rem;text-align:left}.analytics-table th{white-space:normal}button:disabled{cursor:wait;opacity:.65}button[aria-pressed="true"]{box-shadow:inset 0 0 0 1px currentColor}@media(prefers-reduced-motion:no-preference){button,.button,a{transition:background-color .15s,color .15s,box-shadow .15s}button:active,.button:active{transform:translateY(1px)}:is(.offer-card,.hub-card,.workspace-card,.tool-card,.featured-tile){transition:box-shadow .15s,border-color .15s}}

/* Shared surface scale (spec §46). Radius: card, section (large surfaces), inner (inside a card or
   a menu), pill. Spacing: card, section. Shadow: card at rest, raised (hover, menu), overlay (dialog,
   sheet); never an opaque colour. An exception states its functional difference next to its rule. */
:root{--ks-radius-sm:8px;--ks-radius-md:12px;--ks-radius-lg:18px;--ks-radius-inner:var(--ks-radius-md);--ks-radius-card:var(--ks-radius-lg);--ks-radius-section:28px;--ks-radius-pill:999px;--ks-spacing-card:24px;--ks-spacing-section:clamp(24px,3.4vw,44px);--ks-font-kicker:11px;--ks-font-card-title:18px;--ks-font-card-subtitle:14px;--ks-shadow-card:0 1px 2px rgb(20 43 75 / .04),0 18px 40px -34px rgb(20 43 75 / .35);--ks-shadow-raised:0 14px 34px -14px rgb(20 43 75 / .3);--ks-shadow-overlay:0 24px 64px -20px rgb(20 43 75 / .42);--ks-shadow-soft:var(--ks-shadow-card)}
:root[data-theme="dark"]{--ks-shadow-card:0 1px 2px rgb(0 0 0 / .3);--ks-shadow-raised:0 14px 34px -14px rgb(0 0 0 / .7);--ks-shadow-overlay:0 28px 72px -24px rgb(0 0 0 / .8)}
.card,.side-note,.feed-controls{border:1px solid var(--ks-border);border-radius:var(--ks-radius-card);padding:var(--ks-spacing-card);box-shadow:var(--ks-shadow-soft);background:var(--ks-surface);color:var(--ks-text)}
.feed-controls h2{font-size:18px;margin:0 0 16px}.feed-controls .tabs{margin:16px 0 8px}.feed-controls [data-feed="reset"]{color:var(--ks-muted);text-align:left;font-size:12px;padding-left:0}.feed-controls .help{margin-bottom:0}
.side-note h3{margin-top:0}.side-note p{font-size:13px;line-height:1.7}.rightbar{display:flex;flex-direction:column;gap:24px}.rightbar .field-card{padding:24px}.rightbar .network-orbit{font-size:40px;margin-bottom:16px}.rightbar .field-card h2{font-size:24px}.rightbar .field-card p{font-size:13px}.rightbar .side-note{margin:0}
.app-layout{max-width:1440px;grid-template-columns:210px minmax(0,1fr) 280px;gap:28px}main,#page,.card,.platform-section{min-width:0}.page-head,.page-heading{margin-bottom:24px}.page-head h1,.page-heading h1{line-height:1.17}.page-head .subtitle,.page-heading>p{max-width:65ch}
/* §45: the heading of a page is a surface, like .workspaces-header and .adv-surface; the Football
   page keeps its sport surface (rule above). */
.page-head,.page-heading:not([data-sport="football"]){background:var(--ks-surface);color:var(--ks-text);border:1px solid var(--ks-border);border-radius:var(--ks-radius-card);padding:var(--ks-spacing-card);box-shadow:var(--ks-shadow-card)}.page-head{flex-wrap:wrap;gap:12px 16px}.page-head>div>:last-child,.page-heading>:last-child{margin-bottom:0}
.nav-group-title{padding:16px 14px 4px;margin:0;font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--ks-muted)}
.top-actions{gap:18px}.top-actions a{display:inline-flex;align-items:center;gap:6px}.topbar{gap:20px;--ks-brand-space-color:var(--ks-muted)}.top-actions .workspace-link{font-size:12px}
.compose-media-actions{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.compose-advanced{border-top:1px solid var(--ks-border);padding-top:8px}.compose-advanced>summary{color:var(--ks-muted);font-weight:600}.compose-advanced>.actions{margin-top:18px}.compose-poll:not([open]){display:none}.compose-poll[open]{border:1px solid var(--ks-border);border-radius:12px;padding:16px}.compose-audience-summary{font-size:12px;text-align:right;margin:16px 0 0}.profile-media-filter{margin-bottom:20px}.profile-media-filter summary{font-size:13px;color:var(--ks-muted);padding:12px 0}
#profile-activity>.section-head{margin-top:24px}.intent-filter{gap:12px}.purpose-grid article{min-width:0}a,p,h1,h2,h3{overflow-wrap:anywhere}button,.button,summary{touch-action:manipulation}dialog{max-width:min(640px,calc(100vw - 24px));max-height:calc(100dvh - 32px)}
@media(min-width:761px) and (max-width:1150px){.app-layout{grid-template-columns:190px minmax(0,1fr)}.rightbar{display:none}.topbar{padding-inline:24px}.top-actions{gap:12px}}
@media(max-width:760px){
 :root{--ks-spacing-card:18px;--ks-radius-card:16px;--ks-radius-section:22px;--ks-bar-bottom:max(8px,env(safe-area-inset-bottom));--ks-bar-height:calc(61px + var(--ks-bar-bottom))}
 .app-layout{display:block;padding-top:24px}.rightbar{display:none}.topbar{position:relative;height:auto;padding:14px 16px;gap:10px;flex-wrap:wrap;min-height:80px}.top-actions{width:100%;justify-content:space-between;gap:12px;font-size:11px}.top-actions .workspace-link{font-size:11px}.top-action-label{display:none}
 /* Phone bar: six cells in the document order (the order Tab walks), « Plus » being the last one.
    Its menu is a sheet anchored to the bar; its toggle stays in its cell, open or not. */
 .sidebar nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:center;gap:0;padding:5px 4px var(--ks-bar-bottom);background:var(--ks-surface);overflow:visible;z-index:22}
 .sidebar nav>a,.sidebar nav>button{min-height:56px;font-size:11px;display:flex;justify-content:center;flex-direction:column;gap:4px;min-width:0;max-width:none;margin:0;padding:7px 0;text-align:center}
 .sidebar nav>.nav-more{position:static;min-width:0;margin:0}
 .sidebar nav>.nav-more>summary{flex-direction:column-reverse;align-items:center;justify-content:center;gap:4px;min-height:56px;padding:7px 0;font-size:11px;font-weight:550;color:var(--ks-muted)}
 .sidebar nav>.nav-more[open]{position:fixed;left:14px;right:14px;bottom:calc(var(--ks-bar-height) + 8px);max-height:65dvh;overflow:auto;padding:10px;background:var(--ks-surface-elevated);border:1px solid var(--ks-border);border-radius:var(--ks-radius-card);box-shadow:var(--ks-shadow-overlay)}
 .sidebar nav>.nav-more[open]>summary{position:fixed;right:4px;bottom:var(--ks-bar-bottom);width:calc((100vw - 8px)/6);color:var(--ks-primary-text)}
 .sidebar nav .nav-more a{display:block;max-width:none;min-height:44px;padding:12px;font-size:13px;text-align:left}.nav-group-title{padding-top:18px}
 .page-head h1,.page-heading h1{font-size:28px}.page-head,.page-heading{margin-bottom:20px}.form-actions{flex-wrap:wrap}#main{padding-bottom:160px}.feed-controls .tabs{gap:6px}.feed-controls .tabs button{padding:9px 8px;font-size:12px}.intent-filter{display:flex;align-items:flex-start;flex-direction:column}.intent-filter select{width:100%}.side-note{margin-top:0}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* §46: one hover for the cards that are a destination (a raised shadow, never a movement). */
:is(.offer-card,.hub-card,.workspace-card,.tool-card,.featured-tile):hover{border-color:color-mix(in srgb,var(--ks-primary) 38%,var(--ks-border));box-shadow:var(--ks-shadow-raised)}
/* Filter sets wrap at every width; no off-screen controls on Explore or Football. */
.tabs{flex-wrap:wrap;gap:10px 18px;max-width:100%}.tabs button{min-height:44px;padding:10px 4px;overflow-wrap:anywhere}.search-form{padding:18px;background:var(--ks-surface);border:1px solid var(--ks-border);border-radius:var(--ks-radius-card);margin-block:20px}.search-form input{min-width:0}.search-types{padding:12px 18px;background:var(--ks-surface);border:1px solid var(--ks-border);border-radius:var(--ks-radius-card)}
.topbar .ks-brand{flex-shrink:0}

/* Functional side widgets share a contained surface; navigation stays light. */
.rightbar .side-note,.rightbar .field-card{background:var(--ks-surface);border:1px solid var(--ks-border);border-radius:var(--ks-radius-card);padding:var(--ks-spacing-card);box-shadow:var(--ks-shadow-soft);color:var(--ks-text)}
.rightbar .field-card p{color:var(--ks-muted)}.rightbar .field-card :is(.eyebrow,.network-orbit,a){color:var(--ks-primary-text)}
.sidebar-foot{display:none}.feed-preferences summary{font-size:13px;color:var(--ks-muted);min-height:44px;padding-block:12px}.network-launch-card{max-width:780px}.workspace-grid>.card{display:flex;flex-direction:column;align-items:flex-start}.workspace-grid>.card .button{margin-top:auto}
@media(max-width:760px){.top-actions{flex-wrap:wrap}.top-actions .workspace-link{display:none}}
/* §46: the action of a card sits at its foot, on the left, and takes the whole width on a phone. */
@media(max-width:430px){:is(.workspace-card,.tool-card,.sport-card,.hub-card,.offer-card-actions,.workspace-grid>.card) .button,:is(.workspace-card,.tool-card)>.button{width:100%;justify-content:center;text-align:center}}


/* Shared translation widgets follow the network tokens, never their historical green. KS Translate
   stays untouched: interface.css is injected at the end of the page, hence `body`. */
:root{--kst-link:var(--ks-primary-text);--kst-muted:var(--ks-muted)}
.kst-error{color:var(--ks-danger)}body .ksl summary{background:var(--ks-primary);color:#fff}body .ksl form{background:var(--ks-surface);color:var(--ks-text);border-color:var(--ks-border)}body .ksl form p{color:var(--ks-muted)}body .ksl a{color:var(--ks-primary-text)}body .ksl button:hover,body .ksl button:focus-visible,body .ksl button[aria-current=true]{background:var(--ks-primary-soft)}
/* §48: the errors of a form and of an action. They stay until the member acts (a toast lasts 5 s). */
.field-error{margin:6px 0 0;font-size:12px;font-weight:600;line-height:1.5;color:var(--ks-danger)}[aria-invalid="true"]{border-color:var(--ks-danger)}
#page-alert{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:21;display:flex;align-items:center;gap:8px;width:min(560px,calc(100vw - 32px));padding:6px 6px 6px 16px;border:1px solid color-mix(in srgb,var(--ks-danger) 35%,var(--ks-surface));border-radius:var(--ks-radius-inner);background:var(--ks-danger-soft);color:var(--ks-danger);box-shadow:var(--ks-shadow-raised);font-size:13px}#page-alert:empty{display:none}#page-alert p{flex:1;margin:0;min-width:0}#page-alert button{flex:none;min-width:44px;min-height:44px;color:inherit}
@media(max-width:760px){#page-alert{bottom:calc(var(--ks-bar-height) + 76px)}}
/* The final call of the landing in its white theme (platform.css colours the blue one). */
.landing-surface.landing-final h2{color:var(--ks-text)}.landing-surface.landing-final .hero-secondary{color:var(--ks-primary-text)}
/* Functional control groups placed directly on the page get the card surface. */
#page>.tabs,#page>.page-media-tabs,#page>#sport-level-label{background:var(--ks-surface);color:var(--ks-text);border:1px solid var(--ks-border);border-radius:var(--ks-radius-card);padding:12px 18px;box-shadow:var(--ks-shadow-soft)}#page>#sport-level-label{display:block;margin-bottom:20px}
#page>:is(.actions,.member-entry-links,.intent-filter,#video-search,.watch-controls,.explore-links,.sport-links){background:var(--ks-surface);color:var(--ks-text);border:1px solid var(--ks-border);border-radius:var(--ks-radius-card);padding:12px 18px;box-shadow:var(--ks-shadow-card);margin-block:0 20px}
.intent-summary .intent-type{text-transform:uppercase;letter-spacing:.06em;font-size:13px}
/* On the dark cover surface the blue ring would vanish (1.8:1); white stays visible. */
.profile-cover .profile-cover-edit:focus-visible{outline-color:#fff}
.profile-filters{margin-bottom:20px}.profile-filters .tabs{margin:0 0 4px}.profile-filters .profile-media-filter{margin:0}.purpose-empty .help{margin:6px 0 12px}.sport-links{margin-top:16px;gap:8px 18px}