/* FOBA interface refinements. Rules text, iconic status and print layouts keep
   their own styling. This layer follows system-pages-v2.css. */
@media screen {
  /* Chrome headings use one neutral ink; cyan identifies navigation and state. */
  body.site-design[data-site-system="foba"] :is(
    .helper-header h1,.foba-module-header h1,.rb-header h1,.foba-hub-heading h1,
    .gen-header h1,.ds-tool-hero h1,.fg-header h1,.generator-header h1,.fm-heading h1,
    .foba-detail-title,.foba-section-title,.foba-hub-group > h2,
    .foba-sheets > h2,.materials-previous-title,.module-card > h2,
    .rules-content > h2,.scenario-content > h2,.world-gen-card > h2
  ) {
    color:#edf3f6!important;
    -webkit-text-fill-color:currentColor;
    background-image:none;
    text-shadow:none;
  }
  body.site-design[data-site-system="foba"] :is(.foba-hub-group > h2,.foba-sheets > h2,.materials-previous-title) {
    font-size:1.2rem;
    line-height:1.4;
    font-weight:650;
    letter-spacing:0;
    text-transform:none;
  }
  body.site-design[data-site-system="foba"] :is(.helper-header,.foba-module-header,.rb-header,.foba-hub-heading,.ds-tool-hero) {
    border-top-color:#73dce6;
  }
  body.site-design[data-site-system="foba"] :is(.back-link,.foba-btn-back,.rb-back-btn,.ds-tool-back,.ds-tool-topline > a,.ds-tool-eyebrow) {
    color:#73dce6;
  }

  /* Enhanced toolbars own a single column. Native robot/scenario controls were
     originally grid/centred rows, before the enhancer adds its search wrapper. */
  body.site-design[data-site-system="foba"] .foba-enhanced .filter-controls {
    display:flex;
    flex-flow:column nowrap;
    align-items:stretch;
    align-content:start;
    justify-content:flex-start;
    height:auto;
    min-height:0;
    padding:20px;
    gap:12px;
  }
  body.site-design[data-site-system="foba"] .foba-enhanced .filter-primary-row {
    flex:0 0 auto;
    flex-flow:row wrap;
    align-content:start;
    align-items:end;
    justify-content:flex-start;
    min-width:0;
    min-height:0;
    height:auto;
    margin:0;
    padding:0;
  }
  body.site-design[data-site-system="foba"] :is(.rb-container,.foba-list).foba-enhanced .filter-primary-row {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(220px,280px);
    grid-auto-rows:auto;
    gap:12px;
  }
  body.site-design[data-site-system="foba"] .foba-enhanced .filter-primary-row > :is(.search-container,.foba-ui-sort) {
    min-width:0;
    min-height:0;
    max-height:none;
    height:auto;
    margin:0;
    padding:0;
  }
  body.site-design[data-site-system="foba"] .foba-enhanced .foba-ui-sort {
    align-content:start;
    justify-content:flex-start;
    gap:6px;
    color:var(--ds-muted);
    line-height:1.4;
  }
  body.site-design[data-site-system="foba"] .foba-enhanced .filter-controls > .foba-ui-summary {
    margin:0;
    padding:12px 14px;
  }
  body.site-design[data-site-system="foba"] .foba-enhanced .filter-primary-row :is(input,select) {
    box-sizing:border-box;
    min-width:0;
    width:100%;
    max-width:100%;
    min-height:46px;
    margin:0;
    font:400 1rem/1.5 var(--ds-font);
    border:1px solid var(--ds-line);
    border-radius:8px;
    background-color:var(--ds-inset);
    color:var(--ds-text);
  }
  body.site-design[data-site-system="foba"] .foba-enhanced .filter-primary-row > select {
    padding:10px 34px 10px 12px;
  }
  body.site-design[data-site-system="foba"] .foba-enhanced .foba-facet-choice.active:not([data-facet-value="iconic"]) {
    color:#73dce6;
    border-color:#73dce6;
    background:#18383e;
  }
  body.site-design[data-site-system="foba"] .foba-enhanced :is(.foba-facet-check,.foba-ui-chip) {color:#73dce6;}

  /* An actual page introduction for both tools, rather than scattered links. */
  body.site-design[data-site-system="foba"] .ds-tool-hero {
    display:block;
    min-width:0;
    margin:0 0 24px;
    padding:24px;
    border:1px solid var(--ds-line);
    border-top:3px solid #73dce6;
    border-radius:14px;
    background:var(--ds-panel);
    text-align:left;
  }
  body.site-design[data-site-system="foba"] .ds-tool-topline {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:8px 20px;
    margin:0 0 16px;
    padding:0 0 14px;
    border-bottom:1px solid var(--ds-line);
    font-size:.875rem;
    line-height:1.5;
  }
  body.site-design[data-site-system="foba"] .ds-tool-topline > a {
    display:inline-flex;
    align-items:center;
    min-height:36px;
    text-decoration:underline;
    text-underline-offset:4px;
    text-decoration-color:color-mix(in srgb,#73dce6 45%,transparent);
  }
  body.site-design[data-site-system="foba"] .ds-tool-topline > a:hover {text-decoration-color:currentColor;}
  body.site-design[data-site-system="foba"] .ds-tool-hero > .ds-tool-eyebrow {
    margin:0 0 10px;
    font-size:.75rem;
    font-weight:600;
    line-height:1.5;
    letter-spacing:.06em;
    text-transform:uppercase;
  }
  body.site-design[data-site-system="foba"] .ds-tool-hero > h1 {
    margin:0;
    padding:0;
    border:0;
    background:none;
    text-align:left;
    font:700 clamp(1.65rem,3vw,2.35rem)/1.25 var(--ds-font);
  }
  body.site-design[data-site-system="foba"] .ds-tool-hero > :is(.ds-tool-intro,.world-gen-intro) {
    max-width:78ch;
    margin:14px 0 0;
    color:var(--ds-muted);
    font-size:1rem;
    line-height:1.7;
  }

  /* World generation uses the FOBA palette, without changing its result data. */
  body.site-design[data-site-system="foba"] .world-gen {
    width:100%;
    max-width:none;
    min-width:0;
    margin:0;
    padding:0;
    color:var(--ds-text);
    font-family:var(--ds-font);
  }
  body.site-design[data-site-system="foba"] .world-gen-controls {
    margin:0 0 20px;
    padding:20px;
    border:1px solid var(--ds-line);
    border-radius:12px;
    background:var(--ds-panel);
    gap:12px;
  }
  body.site-design[data-site-system="foba"] .world-gen button {
    border-color:var(--ds-line);
    background:var(--ds-inset);
    color:var(--ds-text);
    line-height:1.5;
    white-space:normal;
  }
  body.site-design[data-site-system="foba"] .world-gen button:hover:not(:disabled) {
    border-color:#73dce6;
    background:var(--ds-raised);
  }
  body.site-design[data-site-system="foba"] .world-gen .world-gen-primary {
    background:#ffa3a3;
    border-color:#ffa3a3;
    color:#101419;
  }
  body.site-design[data-site-system="foba"] .world-gen .world-gen-primary:hover:not(:disabled) {
    background:#ffb6b6;
    border-color:#ffb6b6;
  }
  body.site-design[data-site-system="foba"] .world-gen-option {flex:1 1 260px;}
  body.site-design[data-site-system="foba"] .world-gen-option input {accent-color:#73dce6;}
  body.site-design[data-site-system="foba"] .world-gen-grid {gap:20px;}
  body.site-design[data-site-system="foba"] .world-gen-card {
    padding:22px;
    border-color:var(--ds-line);
    border-radius:12px;
    background:var(--ds-panel);
  }
  body.site-design[data-site-system="foba"] .world-gen-card-head {
    padding-bottom:14px;
    border-bottom:1px solid var(--ds-line);
    gap:12px;
  }
  body.site-design[data-site-system="foba"] .world-gen-label {color:var(--ds-muted);letter-spacing:0;}
  body.site-design[data-site-system="foba"] .world-gen-die {
    flex:none;
    color:#73dce6;
    background:var(--ds-inset);
    border-color:var(--ds-line);
    font-variant-numeric:tabular-nums;
  }
  body.site-design[data-site-system="foba"] .world-gen-card > h2 {margin:18px 0 12px;font-size:1.2rem;line-height:1.4;}
  body.site-design[data-site-system="foba"] .world-gen-card > p {margin:0 0 20px;color:var(--ds-muted);line-height:1.7;}
  body.site-design[data-site-system="foba"] .world-gen-note {
    padding:18px 20px;
    margin:20px 0 0;
    background:var(--ds-inset);
    border:1px solid var(--ds-line);
    border-radius:10px;
    color:var(--ds-muted);
    line-height:1.7;
  }
  body.site-design[data-site-system="foba"] .world-gen-status {color:#73dce6;}
  body.site-design[data-site-system="foba"] .world-gen-copybox textarea {border-color:var(--ds-line);background:var(--ds-inset);color:var(--ds-text);}
  body.site-design[data-site-system="foba"] .world-gen :is(button,a,input,textarea):focus-visible {outline:2px solid #73dce6;outline-offset:4px;}

  body.site-design[data-site-system="foba"] .foba-list .scenario-content > h2 {font-size:1.3rem;line-height:1.4;text-transform:none;}
  body.site-design[data-site-system="foba"] .foba-list .tag {color:#73dce6;border-color:#385d64;background:#173138;}
  body.site-design[data-site-system="foba"] .foba-list .scenario-btn {background:#ffa3a3;color:#101419;letter-spacing:0;text-transform:none;}
}

@media screen and (max-width:768px) {
  body.site-design[data-site-system="foba"] .foba-enhanced .filter-controls {padding:16px;}
  body.site-design[data-site-system="foba"] :is(.rb-container,.foba-list).foba-enhanced .filter-primary-row {grid-template-columns:minmax(0,1fr);}
  body.site-design[data-site-system="foba"] .foba-enhanced .filter-primary-row > :is(.search-container,.foba-ui-sort) {flex-basis:auto;width:100%;}
  body.site-design[data-site-system="foba"] .ds-tool-hero {padding:20px 18px;margin-bottom:20px;}
  body.site-design[data-site-system="foba"] .ds-tool-hero > :is(.ds-tool-intro,.world-gen-intro) {font-size:.9375rem;}
  body.site-design[data-site-system="foba"] .world-gen-controls {padding:16px;gap:10px;}
  body.site-design[data-site-system="foba"] .world-gen-grid {grid-template-columns:minmax(0,1fr);gap:16px;}
  body.site-design[data-site-system="foba"] .world-gen-card {padding:18px;}
  body.site-design[data-site-system="foba"] .world-gen-controls .world-gen-primary {flex:1 1 100%;}
  body.site-design[data-site-system="foba"] .world-gen-option {flex:1 1 100%;}
  body.site-design[data-site-system="foba"] .world-gen-controls > button:not(.world-gen-primary) {flex:1 1 120px;}
  body.site-design[data-site-system="foba"] .world-gen-note {padding:16px;}
}