/* KFT visual system, September 2026.
 * Native CSS, sports editorial aesthetic. Variance 6 / motion 3 / density 5.
 * The important declarations in this named layer deliberately outrank the
 * legacy unlayered !important styles without escalating selector specificity.
 * Keep visibility, positioning of popovers, data colours, and state in the
 * existing components. Shape scale: 6px controls, 12px panels, round badges.
 */

/* Keyboard users can bypass the persistent product navigation on every tool page. */
.kft-skip-link{position:fixed;top:10px;left:10px;z-index:2200;transform:translateY(-160%);padding:10px 14px;background:#f7f3ed;color:#0f1115!important;border-radius:4px;font:750 .84rem Manrope,system-ui,sans-serif;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.28)}
.kft-skip-link:focus{transform:translateY(0);outline:3px solid #d9574f;outline-offset:2px}
@font-face {
  font-family: "Manrope";
  src: url("fonts/manrope-latin-variable.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}


@layer kft-studio {
  :root, body {
    --kft-night: #111313 !important;
    --kft-stand: #191c1c !important;
    --kft-panel: #202323 !important;
    --kft-floodlight: #f0f1ed !important;
    --kft-muted: #adb3af !important;
    --kft-touchline: #e36169 !important;
    --kft-match-line: #313736 !important;
    --kft-match-line-strong: #444c49 !important;
    --kft-body: "Manrope", "Segoe UI", sans-serif !important;
    --kft-display: "Manrope", "Segoe UI", sans-serif !important;
    --kft-data: "Cascadia Mono", Consolas, monospace !important;
    --kft-glass-surface: #202323 !important;
    --kft-glass-surface-soft: #191c1c !important;
    --kft-glass-blur: none !important;
    --bg-paper: #111313 !important;
    --bg-white: #202323 !important;
    --bg-neutral: #191c1c !important;
    --text-ink: #f0f1ed !important;
    --text-muted: #adb3af !important;
    --border: #313736 !important;
    --studio-action: #b82e41;
    --studio-action-hover: #9f2435;
  }

  html, body { background: var(--kft-night) !important; }
  body { font-family: var(--kft-body) !important; line-height: 1.6 !important; }
  body::before, #hero::before, #hero::after, #hero h1::after {
    content: none !important;
  }
  button, input, select, textarea { font-family: var(--kft-body) !important; }
  h1, h2, h3 {
    font-family: var(--kft-display) !important;
    font-weight: 650 !important;
    letter-spacing: -.045em !important;
    text-transform: none !important;
  }
  :where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid var(--kft-touchline) !important;
    outline-offset: 4px !important;
    box-shadow: none !important;
  }
  ::selection { color: #f0f1ed !important; background: #913447 !important; }

  /* Preserve the original fixed header and menu handlers. */
  body > nav, body > nav.is-scrolled {
    min-height: 72px !important;
    height: 72px !important;
    padding-inline: clamp(20px, 3.5vw, 56px) !important;
    background: #111313 !important;
    border-bottom: 1px solid var(--kft-match-line) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  body > nav::after { content: none !important; }
  body > nav .nav-brand {
    gap: 10px !important;
    color: var(--kft-floodlight) !important;
    font-family: var(--kft-body) !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    letter-spacing: -.025em !important;
  }
  body > nav .nav-logo-img { width: 34px !important; height: 34px !important; }
  body > nav .nav-links a {
    font-family: var(--kft-body) !important;
    font-size: 11px !important;
    font-weight: 550 !important;
    letter-spacing: -.01em !important;
    white-space: nowrap !important;
    color: #b8bebb !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  body > nav .nav-links a:is(:hover, .active) { color: #f0f1ed !important; }
  body > nav .nav-links a::after { height: 2px !important; box-shadow: none !important; }
  #clerk-sign-in { background: #202323 !important; border-color: #444c49 !important; color: #f0f1ed !important; border-radius: 6px !important; font-weight: 600 !important; }

  /* Consistent page rhythm. Tool tables retain their independent scroll areas. */
  body > section { padding: 64px clamp(20px, 4vw, 64px) !important; min-height: 0 !important; background: var(--kft-night) !important; }
  body > section > .section-content { width: 100% !important; max-width: 1320px !important; margin-inline: auto !important; padding-inline: 0 !important; }
  body > section + section { border-top: 1px solid var(--kft-match-line) !important; }
  body > section::before { content: none !important; }
  .section-title { display: block !important; text-align: left !important; margin-bottom: 32px !important; }
  .section-title > h2 {
    font-size: clamp(26px, 3vw, 38px) !important;
    line-height: 1.2 !important;
    margin: 0 0 16px !important;
    color: var(--kft-floodlight) !important;
  }
  .section-title > p {
    max-width: 82ch !important;
    margin: 0 !important;
    color: var(--kft-muted) !important;
    font: 400 14px/1.8 var(--kft-body) !important;
    letter-spacing: 0 !important;
    text-align: left !important;
  }
  .section-title::before, .section-title::after { content: none !important; }

  /* An asymmetric introduction with actual product previews. */
  body #hero { padding-top: 96px !important; padding-bottom: 44px !important; }
  #hero .hero-content {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
    min-height: 0 !important;
    align-items: start !important;
    text-align: left !important;
  }
  #hero .hero-text { max-width: 960px !important; padding: 0 !important; margin: 0 !important; }
  #hero .hero-text > br { display: none !important; }
  #hero .hero-text h1 {
    max-width: 25ch !important;
    font-size: clamp(34px, 3.9vw, 54px) !important;
    line-height: 1.12 !important;
    font-weight: 600 !important;
    letter-spacing: -.055em !important;
    margin: 0 !important;
    color: var(--kft-floodlight) !important;
    text-wrap: balance !important;
  }
  #hero .hero-text > p {
    max-width: 62ch !important;
    margin: 24px 0 0 !important;
    font: 400 15px/1.85 var(--kft-body) !important;
    letter-spacing: 0 !important;
    color: var(--kft-muted) !important;
  }
  .kft-page-analytics #hero .hero-content {
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr) !important;
    column-gap: clamp(32px, 6vw, 88px) !important;
  }
  .kft-page-analytics #hero .hero-text { grid-column: 1 !important; grid-row: 1 !important; align-self: center !important; }
  #hero .hero-actions { gap: 10px 18px !important; margin-top: 28px !important; }
  #hero .hero-action {
    min-height: 46px !important;
    padding: 0 18px !important;
    border: 1px solid #444c49 !important;
    border-radius: 6px !important;
    background: transparent !important;
    color: #f0f1ed !important;
    font: 600 12px/1.2 var(--kft-body) !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    transition: background-color 160ms ease, transform 160ms ease !important;
  }
  #hero .hero-action:hover { background: #292e2c !important; transform: translateY(-1px) !important; }
  #hero .hero-action:active { transform: translateY(1px) !important; }
  #hero .hero-action-primary { background: var(--studio-action) !important; border-color: var(--studio-action) !important; }
  #hero .hero-action-primary:hover { background: var(--studio-action-hover) !important; }
  #hero .hero-action[href="profile.html"] { border-color: transparent !important; padding-inline: 0 !important; }
  #hero .hero-explainer-toggle {
    justify-self: start !important;
    align-self: start !important;
    grid-column: 1 !important;
    min-height: 44px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #b8bebb !important;
    box-shadow: none !important;
    font-size: 12px !important;
  }
  #hero .hero-explainer-toggle strong { font-weight: 550 !important; }
  #hero .hero-explainer-toggle-icon { background: #272d2b !important; width: 26px !important; height: 26px !important; flex-basis: 26px !important; }
  #hero .hero-explainer { grid-column: 1 / -1 !important; }
  #hero .hero-snapshot { background: transparent !important; box-shadow: none !important; }
  #hero .hero-board { border: 1px solid #313736 !important; border-radius: 12px !important; padding: 24px !important; background: #191c1c !important; }
  #hero .hero-board h2 { font-size: 25px !important; }
  #hero .hero-board :is(.hero-board-note, .hero-board-foot) { font-size: 12px !important; line-height: 1.7 !important; }

  /* Tool chrome is quiet, while real FDR, club and chart colours stay semantic. */
  :is(.kft-dock-bar, .kft-controls, .control-deck, .graph-toolbar, .league-controls) {
    border-color: #313736 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .kft-page-analytics .kft-dock-bar { justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; }
  .brk-dropdown { max-height: min(420px, calc(100dvh - 168px)) !important; overflow-y: auto !important; }
  :is(.kft-dock-item, .kft-dock-search, .kft-btn, .plan-btn, .gw-input, .graph-select, .gw-nav-btn, .xgi-page-btn, .brk-page-btn, .league-search) {
    border-radius: 6px !important;
    font-weight: 550 !important;
    box-shadow: none !important;
    background-image: none !important;
  }
  :is(input, textarea)::placeholder { color: #9da7a1 !important; opacity: 1 !important; }
  :is(.kft-btn-primary, .btn-primary, .planner-autofill-btn, .path-save, .ask-kiba-btn) {
    background: var(--studio-action) !important;
    border-color: var(--studio-action) !important;
    color: #f0f1ed !important;
  }
  :is(.kft-btn-primary, .btn-primary, .planner-autofill-btn, .path-save, .ask-kiba-btn):not(:disabled):hover {
    background: var(--studio-action-hover) !important;
  }
  :is(.xgi-chart-wrap, .brk-chart-wrap, .proj-table-wrap, .graph-shell, .dashboard-card, .insight-card, .live-card, .sidebar-card, .transfer-panel, .panel-shell) {
    border: 1px solid #313736 !important;
    border-radius: 12px !important;
    background-color: #191c1c !important;
    background-image: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  .kft-watermark::before { opacity: .04 !important; filter: grayscale(1) !important; }
  .kft-watermark :is(.xgi-row, .brk-row)[role="button"] { background: transparent !important; }
  .kft-watermark :is(.xgi-row, .brk-row)[role="button"]:is(:hover, :focus-visible) { background: #272d2b !important; }
  :is(.xgi-chart-head, .brk-chart-head) { background: #202623 !important; color: #adb3af !important; }
  :is(.proj-table, .kft-table, .league-table) thead th { background: #202623 !important; color: #c4cbc6 !important; }
  :is(.proj-table, .kft-table, .league-table) td { font-variant-numeric: tabular-nums !important; }
  :is(.brk-dropdown, .proj-gw-menu, .ticker-gw-menu, .kft-player-edit-menu, .pcard-float-menu, .card-action-panel, .manual-player-picker, .kft-compare-picker, .modal-card, .modal-box, .kfts-modal-box, .kfts-dd, .xgi-edit-panel, .kft-scenario-modal, .kft-dialog, .kft-toast, .kft-fdr-duration-panel) {
    background: #202323 !important;
    border-color: #444c49 !important;
    box-shadow: 0 18px 64px #080a0a70 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  /* Planner entry and profile status remain in their existing DOM order. */
  #hero .planner-entry-panel {
    padding: 28px !important;
    border: 1px solid #444c49 !important;
    border-radius: 12px !important;
    background: #191c1c !important;
    backdrop-filter: none !important;
    gap: 24px !important;
    overflow: visible !important;
  }
  #hero .planner-entry-panel::before, #hero .planner-entry-panel::after,
  .kft-dialog::before, .kft-dialog::after { content: none !important; }
  #hero .planner-entry-copy h2 { font-size: 24px !important; font-weight: 600 !important; }
  #hero .planner-entry-copy p { font: 400 14px/1.7 var(--kft-body) !important; }
  #hero .planner-entry-method { border: 0 !important; background: transparent !important; padding: 0 !important; box-shadow: none !important; backdrop-filter: none !important; }
  #hero .planner-entry-kicker { color: var(--kft-muted) !important; font-weight: 500 !important; }
  #hero .status-bar { gap: 12px !important; margin: 0 !important; }
  #hero .status-chip { padding: 10px 16px !important; border: 1px solid #313736 !important; border-radius: 6px !important; font: 500 12px/1.5 var(--kft-body) !important; }

  /* Supporting pages share the same type, surfaces and restrained hierarchy. */
  .page-shell { max-width: 1040px !important; padding-top: 112px !important; }
  .page-shell .hero-card { padding: 32px 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
  .page-shell .hero-card::before { content: none !important; }
  .page-shell .hero-card h1 { font-size: clamp(36px, 5vw, 58px) !important; max-width: 22ch !important; line-height: 1.12 !important; }
  .page-shell .content-card { padding: 28px !important; border-radius: 12px !important; background: #191c1c !important; border: 1px solid #313736 !important; box-shadow: none !important; }
  .page-shell :is(p, li) { color: #bac1bc !important; line-height: 1.85 !important; }
  .page-shell h2 { font-size: 25px !important; }
  #newsletter :is(.newsletter-card, .card) { background: #191c1c !important; border: 1px solid #313736 !important; border-radius: 12px !important; box-shadow: none !important; }
  body > footer { background: #111313 !important; border-top: 1px solid #313736 !important; padding: 32px 24px !important; font: 400 12px/1.8 var(--kft-body) !important; color: #adb3af !important; }

  @media (min-width: 1440px) {
    .kft-page-analytics > nav .nav-links { max-width: calc(100% - 320px) !important; gap: 6px !important; }
  }
  @media (max-width: 1439px) {
    .kft-page-analytics > nav .hamburger { display: flex !important; width: 44px !important; height: 44px !important; align-items: center !important; justify-content: center !important; margin-left: auto !important; }
    .kft-page-analytics > nav .nav-links {
      display: none !important;
      position: fixed !important;
      top: 72px !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
      width: 100% !important; max-width: none !important;
      height: calc(100dvh - 72px) !important; min-height: 0 !important;
      padding: 24px !important; margin: 0 !important;
      transform: none !important; border: 0 !important;
      background: #191c1c !important;
      flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important;
      gap: 0 !important; overflow-y: auto !important;
    }
    .kft-page-analytics > nav .nav-links.active { display: flex !important; }
    .kft-page-analytics > nav .nav-links li { width: 100% !important; margin: 0 !important; }
    .kft-page-analytics > nav .nav-links a { display: block !important; width: 100% !important; padding: 12px 16px !important; font-size: 15px !important; border: 0 !important; border-bottom: 1px solid #313736 !important; }
  }
  @media (max-width: 1180px) {
    #hero .hero-text h1 { font-size: 40px !important; }
    body > nav .nav-links.active { background: #191c1c !important; }
    .kft-page-planner #hero .planner-entry-panel { grid-template-columns: minmax(0, 1fr) !important; }
  }
  @media (max-width: 768px) {
    body > section { padding: 36px 20px !important; }
    body #hero { padding-top: 100px !important; padding-bottom: 32px !important; }
    #hero .hero-content, .kft-page-analytics #hero .hero-content { grid-template-columns: minmax(0, 1fr) !important; gap: 22px !important; }
    #hero .hero-text h1 { font-size: clamp(31px, 7.8vw, 44px) !important; line-height: 1.14 !important; }
    #hero .hero-text > p { font-size: 14px !important; line-height: 1.8 !important; margin-top: 20px !important; }
    #hero .hero-actions { gap: 10px !important; margin-top: 24px !important; }
    #hero .hero-action { padding-inline: 12px !important; font-size: 11px !important; gap: 12px !important; }
    #hero .hero-explainer-toggle { grid-row: auto !important; }
    .section-title > h2 { font-size: 27px !important; }
    .section-title > p { font-size: 13px !important; }
    #hero .planner-entry-panel { padding: 20px !important; }
    #hero .planner-entry-actions { grid-template-columns: minmax(0, 1fr) !important; }
    #hero .planner-entry-input-row { grid-template-columns: minmax(0, 1fr) !important; }
    #hero .planner-entry-divider { text-align: center !important; }
    #hero .status-bar { flex-wrap: wrap !important; }
    #hero .hero-board { padding: 16px !important; }
    .page-shell { padding-top: 88px !important; }
    .page-shell .content-card { padding: 20px !important; }
  }
  @media (prefers-reduced-motion: reduce) {
    #hero .hero-action, #hero .hero-action span { transition: none !important; transform: none !important; }
  }
}

/* Site-wide refinement. Presentation only; existing handlers and state own visibility. */
@layer kft-studio {
  body > nav .nav-links a { font-size: 12px !important; }
  .section-title > p { max-width: 70ch !important; text-wrap: pretty; }
  h4 { font-family: var(--kft-body) !important; letter-spacing: -.02em !important; }
  :is(.kft-btn, .plan-btn, .control-btn, .compare-btn, .graph-select, .modal-input, .gw-input, .league-search) {
    min-height: 42px !important; border-radius: 7px !important; font-size: 13px !important;
    box-shadow: none !important; background-image: none !important;
  }
  :is(.kft-btn, .plan-btn, .control-btn, .compare-btn) {
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease !important;
  }
  :is(.control-btn, .compare-btn) { background-color: #242a28 !important; border: 1px solid #49534e !important; color: #e8ede8 !important; }
  :is(.control-btn.primary, .control-btn.active, .control-btn[aria-pressed="true"]) { background: #a62d40 !important; color: #fff !important; border-color: #bd495b !important; }
  :is(.kft-btn, .plan-btn, .control-btn, .compare-btn):not(:disabled):hover { border-color: #88968c !important; }
  :is(.kft-btn, .plan-btn, .control-btn, .compare-btn):disabled { opacity: .45 !important; cursor: not-allowed !important; }
  :is(.gw-input, .modal-input, .graph-select, .league-search) { background: #111715 !important; color: #e8ede8 !important; border: 1px solid #526059 !important; padding: 10px 12px !important; }
  :is(.kft-dock-ctrl-label, .planner-entry-method-label, .entry-input-group label) { font-size: 11px !important; letter-spacing: .055em !important; color: #b9c4bd !important; font-weight: 600 !important; }
  :is(.empty-state, .loading-wrap, .no-transfers) { font: 400 13px/1.75 var(--kft-body) !important; color: #b7c2ba !important; padding: 28px 20px !important; }
  :is(.live-card, .sidebar-card, .paths-section, .gameweek-intelligence, .intelligence-ledger, .compare-summary, .gw-tile) {
    background: #191f1c !important; border-color: #354139 !important; box-shadow: none !important;
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  }
  :is(.dashboard-card, .insight-card, .graph-shell, .panel-shell) { background: #191f1c !important; border-color: #354139 !important; }
  :is(.live-card, .sidebar-card, .paths-section, .gameweek-intelligence, .intelligence-ledger, .dashboard-card, .insight-card)::before,
  :is(.live-card, .sidebar-card, .paths-section, .gameweek-intelligence, .intelligence-ledger, .dashboard-card, .insight-card)::after { content: none !important; }
  :is(.shell-head, .live-card-head, .sidebar-card-title, .transfer-head-row, .paths-head) {
    background: #1f2722 !important; border-color: #354139 !important; padding: 16px 20px !important;
  }
  :is(.shell-title, .live-card-title, .sidebar-card-title) { font: 600 16px/1.4 var(--kft-body) !important; letter-spacing: -.02em !important; }
  :is(.shell-sub, .live-card-sub, .dashboard-note) { font: 400 12px/1.65 var(--kft-body) !important; color: #aebbb2 !important; }
  .kft-page-profile .dashboard-card { padding: 24px !important; border-radius: 10px !important; }
  .kft-page-profile .dashboard-card h3 { font: 500 12px/1.5 var(--kft-body) !important; color: #b8c5bb !important; text-transform: none !important; letter-spacing: 0 !important; margin-bottom: 16px !important; }
  .kft-page-profile .dashboard-value { font-size: clamp(24px, 2.6vw, 36px) !important; font-weight: 600 !important; font-variant-numeric: tabular-nums; letter-spacing: -.045em !important; }
  .kft-page-profile .insight-card { padding: 20px !important; }
  .kft-page-profile .insight-card h4 { font-size: 13px !important; font-weight: 600 !important; }
  .kft-page-profile .shell-pill { font-weight: 500 !important; border-radius: 5px !important; background: #232d26 !important; }
  .kft-page-profile .graph-toolbar { padding: 12px 20px !important; gap: 8px !important; }
  .kft-page-profile .modal-card { border-radius: 16px !important; width: min(520px, calc(100vw - 32px)) !important; }
  .kft-page-profile .modal-top { padding: 24px !important; gap: 16px !important; }
  .kft-page-profile .modal-top h2 { font-size: 27px !important; line-height: 1.2 !important; }
  .kft-page-profile .modal-top p { font: 400 14px/1.7 var(--kft-body) !important; }
  .kft-page-profile .entry-modal-body { padding: 0 24px 24px !important; background: transparent !important; }
  .kft-page-profile .modal-note { padding: 14px 16px !important; background: #171d19 !important; border: 1px solid rgba(173, 179, 175, .24) !important; border-radius: 8px !important; font: 400 12px/1.7 var(--kft-body) !important; box-shadow: none !important; }
  .kft-page-profile .entry-modal-brand { margin-bottom: 16px !important; }
  .kft-page-profile .modal-actions { padding: 16px 24px !important; border-top: 1px solid #354139 !important; }
  .kft-page-profile .modal-actions .control-btn { width: 100% !important; }
  .kft-page-profile .modal-close { flex-shrink: 0; width: 40px !important; height: 40px !important; border-radius: 8px !important; }
  .kft-page-planner .gameweek-intelligence { margin-top: 24px !important; padding: 28px !important; }
  .kft-page-planner .gameweek-intelligence-head h3 { font-size: 28px !important; line-height: 1.2 !important; }
  .kft-page-planner .gameweek-intelligence-head p { font: 400 13px/1.7 var(--kft-body) !important; max-width: 65ch !important; }
  .kft-page-planner .intelligence-ledger-head h4 { font-size: 20px !important; line-height: 1.3 !important; }
  .kft-page-planner .intelligence-ledger-head p { font: 400 12px/1.7 var(--kft-body) !important; }
  .kft-page-planner #planCard > .chips-row { padding: 14px 18px !important; gap: 8px !important; }
  .kft-page-planner #planCard > .chips-row :is(.budget-pill, .cost-pill) { background: transparent !important; box-shadow: none !important; font-variant-numeric: tabular-nums; }
  .kft-page-planner .planner-entry-panel .api-note { font: 400 12px/1.7 var(--kft-body) !important; color: #aab7ae !important; }
  .kft-page-planner #hero .planner-entry-copy h2 { max-width: 22ch; line-height: 1.25 !important; }
  .page-shell { max-width: 1000px !important; padding-bottom: 64px !important; }
  .page-shell .hero-card { border-bottom: 1px solid #354139 !important; margin-bottom: 32px !important; padding-bottom: 32px !important; }
  .page-shell .content-card { border: 0 !important; background: transparent !important; padding: 0 !important; }
  .page-shell .content-card :is(p, ul, ol) { max-width: 72ch; font-size: 15px !important; }
  .page-shell .content-card h2 { margin: 36px 0 14px !important; font-size: 24px !important; }
  .page-shell .content-card li { padding-left: 4px; margin-bottom: 10px; }
  .page-shell .content-card a { color: #efacb5 !important; text-underline-offset: 4px; }
  .kft-page-dashboard main { background: #191f1c !important; border: 1px solid #354139 !important; border-radius: 16px !important; box-shadow: 0 24px 70px #080e0b50 !important; }
  .kft-page-dashboard main::before, .kft-page-dashboard main::after { content: none !important; }
  .kft-page-dashboard main h1 { font-size: clamp(28px, 5vw, 36px) !important; line-height: 1.2 !important; }
  #newsletter .newsletter-card { padding: 28px !important; }
  body > footer a { color: #c8d1c9 !important; text-underline-offset: 4px; }
  body > footer p + p { margin-top: 12px !important; line-height: 2.4 !important; }
  @media (min-width: 1000px) {
    .kft-page-planner #hero .hero-content { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; column-gap: 48px !important; }
    .kft-page-planner #hero .hero-text { grid-column: 1 !important; grid-row: 1 !important; align-self: center; }
    .kft-page-planner #hero .hero-text h1 { font-size: clamp(34px, 3vw, 46px) !important; }
    .kft-page-planner #hero .planner-entry-panel { grid-column: 2 !important; grid-row: 1 / 3 !important; grid-template-columns: minmax(0, 1fr) !important; gap: 20px !important; }
    .kft-page-planner #hero .planner-entry-actions { grid-template-columns: minmax(0, 1fr) !important; gap: 12px !important; }
    .kft-page-planner #hero .planner-entry-divider { min-height: 20px !important; margin: 0 !important; padding: 0 !important; }
    .kft-page-planner #hero .planner-entry-divider::before, .kft-page-planner #hero .planner-entry-divider::after { content: none !important; }
    .kft-page-planner #hero .page-explainer-toggle { grid-column: 1; }
    .kft-page-planner #hero .page-explainer { grid-column: 1 / -1; }
  }
  @media (max-width: 768px) {
    .kft-page-planner #planCard > .chips-row { display: grid !important; gap: 6px !important; padding: 12px !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .kft-page-planner #planCard > .chips-row .kft-dock-ctrl-block { grid-column: auto !important; min-width: 0 !important; padding: 4px !important; }
    .kft-page-planner #planCard > .chips-row .kft-dock-ctrl-block:first-child { grid-column: span 2 !important; }
    .kft-page-planner #planCard > .chips-row > .kft-dock-ctrl-label { grid-column: 1 / -1 !important; text-align: left !important; padding: 6px 0 0 !important; margin: 0 !important; }
    .kft-page-planner #planCard > .chips-row .chip-badge { max-width: none !important; white-space: nowrap !important; grid-column: auto !important; width: 100% !important; min-width: 0 !important; min-height: 40px !important; }
    .kft-page-planner #planCard > .chips-row .planner-dock-action { width: 100% !important; max-width: none !important; white-space: nowrap !important; grid-column: span 2 !important; min-width: 0 !important; min-height: 40px !important; padding: 8px !important; }
    .kft-page-planner .gameweek-intelligence { padding: 20px !important; }
    .kft-page-planner .gameweek-intelligence-head h3 { font-size: 26px !important; }
    .kft-page-profile .dashboard-grid { gap: 10px !important; }
    .kft-page-profile .dashboard-card { padding: 16px !important; }
    .kft-page-profile .dashboard-note { overflow-wrap: anywhere; }
    .kft-page-profile .shell-head { flex-wrap: wrap; }
    .kft-page-profile .modal-top { padding: 20px !important; }
    .kft-page-profile .entry-modal-body { padding: 0 20px 20px !important; }
    .page-shell { padding-inline: 20px !important; }
    .page-shell .hero-card h1 { font-size: 36px !important; }
    .page-shell .content-card :is(p, ul, ol) { font-size: 14px !important; }
  }
  @media (prefers-reduced-motion: reduce) {
    :is(.kft-btn, .plan-btn, .control-btn, .compare-btn) { transition: none !important; }
  }
}

@layer kft-studio {
  .page-shell :is(.hero-card, .content-card)::before,
  .page-shell :is(.hero-card, .content-card)::after,
  .kft-page-profile :is(.graph-wrap, .modal-card)::before,
  .kft-page-profile :is(.graph-wrap, .modal-card)::after { content: none !important; }
  .kft-page-profile .graph-wrap { background: #191f1c !important; border-radius: 0 !important; box-shadow: none !important; }
  .shell-title { text-transform: none !important; }
  .page-shell .hero-card > p { font-size: 16px !important; max-width: 68ch; }
}