/* IP OS · Generation section · frame styles (core only; each screen has its own CSS).
   Design brief: shell tokens only, white full-width page, no boxes, text tabs,
   type 11/13/15/17/22, spacing ladder 10/20/30/40/60/80. */
.gen{display:block;color:var(--mf-ink);font-family:var(--mf-font-sans)}
/* MindFold OS 0.5.0: every value here is a --mf-* name (src/shell/mindfold, pinned at fd2b864) */
.gen *{box-sizing:border-box}
.gen-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--mf-space-10) var(--mf-space-30);padding-block:0 var(--mf-space-20)}
.gen-tabs{display:flex;flex-wrap:wrap;gap:var(--mf-space-10) var(--mf-space-20)}
.gen-tab{position:relative;background:none;border:0;padding:4px 0;cursor:pointer;color:var(--mf-ink-muted);font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);min-height:var(--mf-target-web)}
.gen-tab[aria-pressed="true"]{color:var(--mf-ink)}
.gen-tab[aria-pressed="true"]::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:var(--mf-underline-tab);border-radius:1px;background:var(--mf-ink)}
.gen-tab .gen-n{margin-left:5px;font:400 var(--mf-text-caption)/1 var(--mf-font-mono);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mf-form-label);font-size:var(--mf-text-emphasis)}
.gen-filters:empty,.gen-summary:empty{display:none}
.gen-filters{padding-block:0 var(--mf-space-20)}
.gen-summary{padding-block:0 var(--mf-space-20)}
.gen-state{color:var(--mf-ink-muted);margin:0 0 var(--mf-space-20)}
.gen-panel[hidden]{display:none}
.gen button:focus-visible,.gen select:focus-visible,.gen input:focus-visible,.gen textarea:focus-visible,.gen a:focus-visible{outline:var(--mf-focus-width-web) solid var(--mf-focus);outline-offset:var(--mf-focus-gap)}
/* toast: MindFold's own strip (the strip itself is styled with the shell's .toast-strip, see src/shell/index.html); the pill inside (Choice 5, revised 2026-11-06) */
.gen-toast{display:flex;align-items:center;gap:8px;background:var(--mf-action);color:var(--mf-on-action);border-radius:var(--mf-radius-pill);padding:4px 16px;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);max-width:100%}
.gen-toast[hidden]{display:none}
.gen-toast-u{background:none;border:0;color:inherit;font:600 var(--mf-text-body)/1 var(--mf-font-sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:4px 0;min-height:var(--mf-pill-tall)}
/* phone header (2026-11-06): under 600 px the section tabs become one picker and the actions fold behind More,
   so the header is the picker row plus the status row. Above 600 px nothing changes. */
.gen-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.gen-secpick,.gen-more{display:none}
.gen-more{background:none;border:0;padding:4px 0;min-height:var(--mf-target-web);cursor:pointer;color:var(--mf-ink-muted);font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans)}
.gen-more[aria-expanded="true"]{color:var(--mf-ink)}
.gen-secpick select{appearance:none;-webkit-appearance:none;border:0;border-bottom:var(--mf-underline-tab) solid var(--mf-ink);border-radius:0;background-color:transparent;color:var(--mf-ink);font:500 var(--mf-text-input-web)/22px var(--mf-font-sans);padding:8px 24px 6px 0;min-height:var(--mf-target-web);cursor:pointer;max-width:100%;
  background-image:linear-gradient(45deg,transparent 50%,var(--mf-ink-muted) 50%),linear-gradient(135deg,var(--mf-ink-muted) 50%,transparent 50%);background-position:calc(100% - 10px) 55%,calc(100% - 5px) 55%;background-size:5px 5px;background-repeat:no-repeat}
@media (max-width:599px){
  .gen-head{gap:0 var(--mf-space-20);padding-block:0 var(--mf-space-10)}
  .gen-tabs{flex:1 1 auto;flex-wrap:nowrap;align-items:center;justify-content:space-between;min-width:0}
  .gen-tab{display:none}
  .gen-secpick{display:block;min-width:0}
  .gen-more{display:inline-block}
  /* folded: the parts' buttons hide, but their dialogs stay in the tree, so a dialog opened from a key still shows */
  .gen-actions{flex-basis:100%}
  .gen-head:not(.gen-more-open) .gen-actions .gen-part > :not(dialog){display:none}
  .gen-head.gen-more-open .gen-actions{padding-block:var(--mf-space-10);border-top:1px solid var(--mf-line)}
}

/* ---- screens/filters.css ---- */
/* IP OS · Generation · filters part. Moodboard filter row (.pill, .menu, .mopt, .switch) with shell tokens only.
   Type 11/13/15/17/22 (inputs and pills 16); spacing 10/20/30/40. */
.gen .g-filters{display:flex;flex-direction:column;gap:var(--mf-space-10);position:relative}
.gen .g-filters[hidden]{display:none}
.gen .g-filters-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mf-space-10) var(--mf-space-20)}
.gen .g-filters-panel{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mf-form-label)}
.gen .g-filters-meta{display:flex;align-items:center;gap:var(--mf-space-20);justify-content:flex-end}
.gen .g-filters-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.gen .g-filters-search{display:flex;align-items:center;flex:1 1 240px;max-width:420px;min-width:0;background:var(--mf-surface-1);border:0;border-radius:var(--mf-radius-pill);padding:9px 16px}
.gen .g-filters-search input{border:0;background:transparent;outline:none;width:100%;min-width:0;color:var(--mf-ink);font:400 var(--mf-text-input-web)/22px var(--mf-font-sans)}
.gen .g-filters-search:focus-within{box-shadow:0 0 0 var(--mf-focus-width-web) var(--mf-focus)}
.gen .g-filters-fl{position:relative;max-width:100%}
.gen .g-filters-fl[hidden]{display:none}
.gen .g-filters-pill{appearance:none;-webkit-appearance:none;border:0;background-color:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 34px 0 var(--mf-space-20);cursor:pointer;font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);max-width:100%;min-height:var(--mf-pill-tall);text-align:left;position:relative;
  background-image:linear-gradient(45deg,transparent 50%,var(--mf-ink-muted) 50%),linear-gradient(135deg,var(--mf-ink-muted) 50%,transparent 50%);background-position:calc(100% - 16px) 50%,calc(100% - 11px) 50%;background-size:5px 5px;background-repeat:no-repeat}
/* a filter in use stays grey and shows its count, in ink 600 (Choice 4); black is kept for the one main action */
.gen .g-filters-pill.on{font-weight:600;background-image:linear-gradient(45deg,transparent 50%,var(--mf-ink) 50%),linear-gradient(135deg,var(--mf-ink) 50%,transparent 50%)}
.gen .g-filters-pill:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-filters-pill::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-filters-meta .g-filters-pill{background-image:none;padding-right:var(--mf-space-20);text-align:center}
/* the Summary toggle: pressed shows as a chosen chip (Choice 2) */
.gen .g-filters-meta .g-filters-pill.on{background-color:var(--mf-action);color:var(--mf-on-action);font-weight:500;display:inline-flex;align-items:center;gap:6px}
.gen .g-filters-meta .g-filters-pill.on::before{content:"";width:9px;height:5px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translateY(-1px);flex:none}
.gen .g-filters-menu{position:absolute;top:calc(100% + 8px);left:0;z-index:25;min-width:270px;max-width:calc(100vw - 20px);max-height:min(440px,60dvh);overflow:auto;background:var(--mf-surface-3);border:0;border-radius:var(--mf-radius-panel);box-shadow:var(--mf-elevation-1),inset 0 0 0 1px var(--mf-line);padding:var(--mf-list-inset)}
.gen .g-filters-menu[hidden]{display:none}
.gen .g-filters-opt{display:flex;align-items:center;gap:var(--mf-space-10);padding:8px 10px;border-radius:var(--mf-radius-field);cursor:pointer;min-height:var(--mf-target-web)}
.gen .g-filters-opt:hover{background:var(--mf-surface-1)}
.gen .g-filters-opt input{width:var(--mf-check-web);height:var(--mf-check-web);margin:0;accent-color:var(--mf-action);flex:none}
.gen .g-filters-opt:focus-within{outline:var(--mf-focus-width-web) solid var(--mf-focus);outline-offset:-2px}
.gen .g-filters-ol{min-width:0;overflow-wrap:anywhere}
.gen .g-filters-mn{margin-left:auto;padding-left:var(--mf-space-10);color:var(--mf-ink-muted);font-size:var(--mf-text-body);font-variant-numeric:tabular-nums;min-width:40px;text-align:right}
.gen .g-filters-mn b{color:var(--mf-ink);font-weight:600}
.gen .g-filters-mfoot{display:flex;justify-content:space-between;align-items:center;gap:var(--mf-space-10);padding:8px 6px 4px;margin-top:4px;border-top:1px solid var(--mf-line);font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted)}
.gen .g-filters-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-filters-link::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-filters-link:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-filters-clear{font-size:var(--mf-text-caption)}
.gen .g-filters-count{font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-filters-count b{color:var(--mf-ink);font-weight:600}
.gen .g-filters-switch{display:flex;align-items:center;gap:var(--mf-form-label);background:none;border:0;border-radius:var(--mf-radius-pill);padding:0;min-height:var(--mf-target-web);cursor:pointer;color:var(--mf-ink);font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);text-align:left}
.gen .g-filters-switch[hidden]{display:none}
.gen .g-filters-knob{width:30px;height:18px;border-radius:999px;background:var(--mf-line);position:relative;flex:none}
.gen .g-filters-knob::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--mf-surface-0)}
.gen .g-filters-switch[aria-checked="true"] .g-filters-knob{background:var(--mf-action)}
.gen .g-filters-switch[aria-checked="true"] .g-filters-knob::after{left:14px}
.gen .g-filters-toggle{display:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-filters-toggle::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-filters-toggle[aria-expanded="true"]{background:var(--mf-action);color:var(--mf-on-action)}
.gen .g-filters-pill:focus-visible,.gen .g-filters-switch:focus-visible,.gen .g-filters-link:focus-visible,.gen .g-filters-toggle:focus-visible{outline:var(--mf-focus-width-web) solid var(--mf-focus);outline-offset:var(--mf-focus-gap)}
@media (max-width:599px){
  .gen .g-filters-search{flex-basis:100%;max-width:none}
  .gen .g-filters-toggle{display:inline-flex}
  .gen .g-filters-panel{display:none}
  .gen .g-filters-open .g-filters-panel{display:flex}
  .gen .g-filters-fl{position:static}
  .gen .g-filters-menu{left:0;right:0;min-width:0;max-width:none}
  .gen .g-filters-meta{justify-content:space-between}
}

/* ---- screens/grid.css ---- */
/* IP OS · Generation · Review tab. Moodboard tiles and tabs; shell tokens only; classes prefixed g-grid-. */
.gen .g-grid-top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--mf-space-10) var(--mf-space-30);padding-block:0 var(--mf-space-20)}
.gen .g-grid-tabs{display:flex;flex-wrap:wrap;gap:10px 20px}
.gen .g-grid-tab{position:relative;background:none;border:0;padding:4px 0;min-height:var(--mf-target-web);cursor:pointer;color:var(--mf-ink-muted);font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans)}
.gen .g-grid-tab[aria-pressed="true"]{color:var(--mf-ink)}
.gen .g-grid-tab[aria-pressed="true"]::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:var(--mf-underline-tab);border-radius:1px;background:var(--mf-ink)}
.gen .g-grid-tab .g-grid-tn{margin-left:5px;font:400 var(--mf-text-caption)/1 var(--mf-font-mono);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-grid-side{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mf-space-10) var(--mf-space-20)}
.gen .g-grid-sum{font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-grid-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-grid-link::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-grid-link:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-grid-board{display:flex;gap:var(--mf-space-20);align-items:flex-start}
.gen .g-grid-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:var(--mf-space-20)}
.gen .g-grid-card{position:relative;width:100%;min-width:0}
.gen .g-grid-tile{display:block;width:100%}
/* tile: copy of the Moodboard .ph */
.gen .g-grid-pic{position:relative;display:block;width:100%;aspect-ratio:var(--g-ar,.6667);border:0;padding:0;background:var(--mf-surface-1);border-radius:var(--mf-radius-tile);overflow:hidden;cursor:pointer;color:inherit;text-align:left;box-shadow:var(--mf-elevation-1);transition:box-shadow .18s,transform .18s}
.gen .g-grid-pic:hover{box-shadow:var(--mf-elevation-2)}
.gen .g-grid-pic img,.gen .g-grid-pic video{display:block;width:100%;height:100%;object-fit:cover}
.gen .g-grid-miss{display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:var(--mf-space-10);text-align:center;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-grid-tag{position:absolute;left:8px;top:8px;max-width:calc(100% - 36px);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);background:var(--mf-surface-0);color:var(--mf-ink);padding:2px 8px;border-radius:var(--mf-radius-pill);opacity:0;transition:opacity .15s;overflow-wrap:anywhere}
.gen .g-grid-pic:hover .g-grid-tag,.gen .g-grid-pic:focus-visible .g-grid-tag{opacity:1}
/* status marks (Signal): To review = attention, On hold = waiting; Approved stays quiet */
.gen .g-grid-dot{position:absolute;top:8px;right:8px;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 2px var(--mf-surface-0)}
.gen .g-grid-need{background:var(--mf-status-attention-dot)}
.gen .g-grid-hold{background:var(--mf-status-waiting-dot)}
.gen .g-grid-marks{position:absolute;left:8px;bottom:8px;display:flex;gap:4px;color:var(--mf-ink)}
.gen .g-grid-marks > span{display:flex;padding:4px;border-radius:var(--mf-radius-pill);background:var(--mf-surface-0);line-height:0}
.gen .g-grid-glyph{display:block}
.gen .g-grid-kind{position:absolute;right:8px;bottom:8px;font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.06em;color:var(--mf-ink);background:var(--mf-surface-0);border-radius:var(--mf-radius-pill);padding:2px 8px}
.gen .g-grid-st-rejected .g-grid-pic img,.gen .g-grid-st-rejected .g-grid-pic video{opacity:.35;filter:grayscale(1)}
/* decisions: on hover or focus over the tile; in the caption when Show tags is on */
.gen .g-grid-decs{position:absolute;right:8px;bottom:8px;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px;opacity:0;pointer-events:none;transition:opacity .15s}
.gen .g-grid-card:hover .g-grid-decs,.gen .g-grid-card:focus-within .g-grid-decs{opacity:1;pointer-events:auto}
/* decisions on the tile: small pills on surface-0 (MindFold .mf-on-soft); the current one is a chosen chip (Choice 2) */
.gen .g-grid-dec{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-0);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-grid-dec[aria-pressed="true"]{background:var(--mf-action);color:var(--mf-on-action)}
.gen .g-grid-dec[aria-pressed="true"]::before{content:"";width:9px;height:5px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translateY(-1px);flex:none}
/* caption: hidden until Show tags is on */
.gen .g-grid-cap{display:none;padding:var(--mf-space-10) 2px 0;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-grid-ttl{font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);color:var(--mf-ink)}
.gen .g-grid-meta{display:flex;flex-wrap:wrap;gap:0 var(--mf-space-10);margin-top:4px}
.gen .g-grid-code{font:400 var(--mf-text-caption)/var(--mf-leading-body) var(--mf-font-mono);color:var(--mf-ink-muted);white-space:nowrap}
.gen .g-grid-cost{font-variant-numeric:tabular-nums}
.gen .g-grid-note{margin:var(--mf-space-10) 0 0;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted)}
body.tags .gen .g-grid-cap{display:block}
body.tags .gen .g-grid-decs{position:static;opacity:1;pointer-events:auto;justify-content:flex-start;gap:var(--mf-form-label);padding:0 2px;margin-top:var(--mf-form-label)}
body.tags .gen .g-grid-dec{background:var(--mf-surface-2)}
.gen .g-grid-dec::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-grid-dec:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
body.tags .gen .g-grid-dec[aria-pressed="true"]{background:var(--mf-action);color:var(--mf-on-action)}
body.tags .gen .g-grid-tag{display:none}
.gen .g-grid-st-rejected .g-grid-ttl{color:var(--mf-ink-muted)}
.gen .g-grid-group{margin:0 0 var(--mf-space-40)}
.gen .g-grid-gh{margin:0 0 var(--mf-space-20);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted);display:flex;flex-wrap:wrap;gap:0 10px;align-items:baseline}
.gen .g-grid-gh small{font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:0;text-transform:none;font-variant-numeric:tabular-nums}
.gen .g-grid-empty{max-width:60ch;padding:var(--mf-space-40) 0}
.gen .g-grid-empty h2{margin:0;font:600 var(--mf-text-display)/var(--mf-leading-display) var(--mf-font-sans)}
.gen .g-grid-empty p,.gen .g-grid-none p{margin:var(--mf-space-10) 0 0;color:var(--mf-ink-muted)}
.gen .g-grid-none{padding:var(--mf-space-20) 0}
.gen .g-grid-none p{margin:0}
@media (max-width:600px){
  .gen .g-grid-board,.gen .g-grid-col{gap:var(--mf-space-10)}
  .gen .g-grid-empty p,.gen .g-grid-none p{font-size:var(--mf-text-heading);line-height:var(--mf-leading-heading)}
  .gen .g-grid-tabs{gap:var(--mf-space-10) var(--mf-space-20)}
}
@media (prefers-reduced-motion:reduce){ .gen .g-grid-pic,.gen .g-grid-tag,.gen .g-grid-decs{transition:none} }
/* phone status picker (2026-11-06): one control instead of five wrapping tabs */
.gen .g-grid-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.gen .g-grid-vpick{display:none;min-width:0}
.gen .g-grid-vpick select{appearance:none;-webkit-appearance:none;border:0;border-radius:var(--mf-radius-pill);background-color:var(--mf-surface-2);color:var(--mf-ink);font:400 var(--mf-text-input-web)/20px var(--mf-font-sans);padding:0 34px 0 var(--mf-space-20);min-height:var(--mf-pill-tall);max-width:100%;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--mf-ink-muted) 50%),linear-gradient(135deg,var(--mf-ink-muted) 50%,transparent 50%);background-position:calc(100% - 16px) 50%,calc(100% - 11px) 50%;background-size:5px 5px;background-repeat:no-repeat}
@media (max-width:599px){
  .gen .g-grid-top{flex-wrap:wrap;align-items:center;gap:var(--mf-space-10) var(--mf-space-20);padding-block:0 var(--mf-space-10)}
  .gen .g-grid-tabs{display:none}
  .gen .g-grid-vpick{display:block}
  .gen .g-grid-side{flex-wrap:wrap;align-items:center;gap:var(--mf-space-10) var(--mf-space-20)}
}

/* ---- screens/refs.css ---- */
/* IP OS · Generation · References tab (2026-11-06). Moodboard board, pills and viewer (artifact 1aGLWCppQkpzHzsmmCD6wp);
   shell tokens only; type 11/13/15/17/22 (inputs and pills 16); spacing 10/20/30/40/60/80. Classes prefixed g-refs-. */
.gen .g-refs-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.gen .g-refs [hidden],.gen .g-refs-vhost [hidden]{display:none}

/* filter row */
.gen .g-refs-filters{display:flex;flex-direction:column;gap:var(--mf-space-10);padding-block:0 var(--mf-space-20)}
.gen .g-refs-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mf-space-10) var(--mf-space-20)}
.gen .g-refs-panel{display:flex;flex-direction:column;gap:var(--mf-space-10)}
.gen .g-refs-cats{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--mf-space-20)}
.gen .g-refs-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mf-form-label)}
.gen .g-refs-search{display:flex;align-items:center;flex:1 1 240px;max-width:420px;min-width:0;background:var(--mf-surface-1);border:0;border-radius:var(--mf-radius-pill);padding:9px 16px}
.gen .g-refs-search input{border:0;background:transparent;outline:none;width:100%;min-width:0;color:var(--mf-ink);font:400 var(--mf-text-input-web)/22px var(--mf-font-sans)}
.gen .g-refs-search:focus-within{box-shadow:0 0 0 var(--mf-focus-width-web) var(--mf-focus)}
/* categories are one choice at a time: text tabs (MindFold decision 7). Use and Relevance stay grey pill menus. */
.gen .g-refs-pill{appearance:none;-webkit-appearance:none;position:relative;border:0;background:none;color:var(--mf-ink-muted);border-radius:0;padding:4px 0;cursor:pointer;font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);max-width:100%;min-height:var(--mf-target-web);text-align:left}
.gen .g-refs-pill.on{color:var(--mf-ink)}
.gen .g-refs-pill.on:not(.g-refs-select)::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:var(--mf-underline-tab);border-radius:1px;background:var(--mf-ink)}
.gen .g-refs-pill .g-refs-n{margin-left:5px;font:400 var(--mf-text-caption)/1 var(--mf-font-mono);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-refs-pill.g-refs-select{background-color:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 34px 0 var(--mf-space-20);min-height:var(--mf-pill-tall);font:400 var(--mf-text-input-web)/20px var(--mf-font-sans);background-image:linear-gradient(45deg,transparent 50%,var(--mf-ink-muted) 50%),linear-gradient(135deg,var(--mf-ink-muted) 50%,transparent 50%);background-position:calc(100% - 16px) 50%,calc(100% - 11px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.gen .g-refs-pill.g-refs-select.on{font-weight:600;background-image:linear-gradient(45deg,transparent 50%,var(--mf-ink) 50%),linear-gradient(135deg,var(--mf-ink) 50%,transparent 50%)}
.gen .g-refs-sel{display:block;max-width:100%}
.gen .g-refs-switch{display:flex;align-items:center;gap:var(--mf-form-label);background:none;border:0;border-radius:var(--mf-radius-pill);padding:0;min-height:var(--mf-target-web);cursor:pointer;color:var(--mf-ink);font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);text-align:left}
.gen .g-refs-knob{width:30px;height:18px;border-radius:999px;background:var(--mf-line);position:relative;flex:none}
.gen .g-refs-knob::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--mf-surface-0)}
.gen .g-refs-switch[aria-checked="true"] .g-refs-knob{background:var(--mf-action)}
.gen .g-refs-switch[aria-checked="true"] .g-refs-knob::after{left:14px}
.gen .g-refs-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-refs-link::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-refs-link:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-refs-toggle{display:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-refs-toggle::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-refs-toggle[aria-expanded="true"]{background:var(--mf-action);color:var(--mf-on-action)}
.gen .g-refs-count{font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-refs-count b{color:var(--mf-ink);font-weight:600}

/* board: the Moodboard .ph tile, masonry with shortest-column fill */
.gen .g-refs-board{display:flex;gap:var(--mf-space-20);align-items:flex-start}
.gen .g-refs-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:var(--mf-space-20)}
.gen .g-refs-card{position:relative;width:100%;min-width:0}
.gen .g-refs-pic{position:relative;display:block;width:100%;aspect-ratio:var(--g-ar,.8);border:0;padding:0;background:var(--mf-surface-1);border-radius:var(--mf-radius-tile);overflow:hidden;cursor:zoom-in;color:inherit;text-align:left;box-shadow:var(--mf-elevation-1);transition:box-shadow .18s}
.gen .g-refs-pic:hover{box-shadow:var(--mf-elevation-2)}
.gen .g-refs-pic img{display:block;width:100%;height:100%;object-fit:cover}
.gen .g-refs-miss{display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:var(--mf-space-10);text-align:center;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-refs-tag{position:absolute;left:8px;top:8px;max-width:calc(100% - 36px);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);background:var(--mf-surface-0);color:var(--mf-ink);padding:2px 8px;border-radius:var(--mf-radius-pill);opacity:0;transition:opacity .15s;overflow-wrap:anywhere}
.gen .g-refs-pic:hover .g-refs-tag,.gen .g-refs-pic:focus-visible .g-refs-tag{opacity:1}
/* Not reviewed is the default and stays quiet: no mark (Choice 3). Use it keeps its tick; Skip fades. */
.gen .g-refs-mk{position:absolute;top:8px;right:8px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--mf-action);color:var(--mf-on-action);font:600 var(--mf-text-body)/1 var(--mf-font-sans);box-shadow:var(--mf-elevation-1)}
.gen .g-refs-eyes{position:absolute;left:8px;bottom:8px;font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);color:var(--mf-ink);background:var(--mf-surface-0);border-radius:var(--mf-radius-pill);padding:4px 8px;font-variant-numeric:tabular-nums}
.gen .g-refs-skip .g-refs-pic img{opacity:.35;filter:grayscale(1)}
.gen .g-refs-cap{display:none;padding:var(--mf-space-10) 2px 0;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-refs-ttl{font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);color:var(--mf-ink)}
.gen .g-refs-src{font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);margin-top:2px}
.gen .g-refs-flags{display:flex;flex-wrap:wrap;align-items:center;gap:4px var(--mf-space-10);margin-top:4px}
.gen .g-refs-flag{font-size:var(--mf-text-body);line-height:var(--mf-leading-body)}
.gen .g-refs-dots{font:500 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-mono);letter-spacing:1px;color:var(--mf-ink);white-space:nowrap}
.gen .g-refs-dots i{font-style:normal;color:var(--mf-line)}
.gen .g-refs-sw{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.gen .g-refs-sw i{display:block;width:16px;height:16px;border-radius:var(--mf-radius-check-mac);box-shadow:inset 0 0 0 1px var(--mf-line)}
body.tags .gen .g-refs-cap{display:block}
body.tags .gen .g-refs-tag{display:none}
.gen .g-refs-empty{max-width:60ch;padding:var(--mf-space-40) 0}
.gen .g-refs-empty h2{margin:0;font:600 var(--mf-text-display)/var(--mf-leading-display) var(--mf-font-sans)}
.gen .g-refs-empty p,.gen .g-refs-empty li{color:var(--mf-ink-muted)}
.gen .g-refs-empty p{margin:var(--mf-space-10) 0 0}
.gen .g-refs-empty ol{margin:var(--mf-space-20) 0 0;padding-left:var(--mf-space-20);display:flex;flex-direction:column;gap:var(--mf-space-10)}
.gen .g-refs-empty b{color:var(--mf-ink)}
.gen .g-refs-none{padding:var(--mf-space-20) 0}
.gen .g-refs-none p{margin:0;color:var(--mf-ink-muted)}

/* viewer: image left at full height, panel right with a pinned header; floating pills over the image */
.gen .g-refs-dlg{border:0;padding:0;background:var(--mf-surface-0);color:var(--mf-ink);font-family:var(--mf-font-sans);width:min(1240px,calc(100vw - 32px));max-width:none;height:calc(100dvh - 32px);max-height:calc(100dvh - 32px);border-radius:var(--mf-radius-panel-lg);overflow:hidden}
.gen .g-refs-dlg::backdrop{background:var(--mf-scrim)}
.gen .g-refs-view{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,1fr);height:100%}
.gen .g-refs-view *{box-sizing:border-box}
.gen .g-refs-stage{background:var(--mf-surface-1);position:relative;min-height:0;min-width:0}
.gen .g-refs-media{position:absolute;inset:0;overflow:hidden}
.gen .g-refs-media img{width:100%;height:100%;object-fit:contain;display:block}
.gen .g-refs-nofile{margin:0;padding:var(--mf-space-30);color:var(--mf-ink-muted)}
.gen .g-refs-navs,.gen .g-refs-unav{position:absolute;left:50%;transform:translateX(-50%);z-index:2;display:flex;align-items:center;gap:4px;background:var(--mf-surface-3);border-radius:var(--mf-radius-pill);padding:4px;box-shadow:var(--mf-elevation-1),inset 0 0 0 1px var(--mf-line);max-width:calc(100% - 20px)}
.gen .g-refs-navs{bottom:var(--mf-space-20)}
.gen .g-refs-unav{top:var(--mf-space-20)}
.gen .g-refs-nav{border:0;background:none;color:var(--mf-ink);width:44px;height:44px;border-radius:var(--mf-radius-pill);cursor:pointer;font-size:var(--mf-text-display);line-height:1;display:inline-flex;align-items:center;justify-content:center;padding:0;flex:none}
.gen .g-refs-nav:hover{background:var(--mf-surface-1)}
.gen .g-refs-pos,.gen .g-refs-ulbl{font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-mono);padding:0 6px;white-space:nowrap;text-align:center;color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-refs-side{overflow:auto;padding:0 var(--mf-space-20) var(--mf-space-40);display:flex;flex-direction:column;gap:var(--mf-space-20);min-width:0;background:var(--mf-surface-0)}
.gen .g-refs-side>*{flex:none}
.gen .g-refs-head{position:sticky;top:0;z-index:3;background:var(--mf-surface-0);padding:var(--mf-space-20) 0 var(--mf-space-10);display:flex;justify-content:space-between;align-items:flex-start;gap:var(--mf-space-10)}
.gen .g-refs-headtxt{min-width:0}
.gen .g-refs-title{margin:4px 0 0;font:600 var(--mf-text-display)/var(--mf-leading-display) var(--mf-font-sans);overflow-wrap:anywhere}
.gen .g-refs-grp{margin:0 0 var(--mf-form-label);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-refs-grp .g-refs-dots{letter-spacing:1px;margin-left:6px}
.gen .g-refs-grp .g-refs-n{margin-left:5px;letter-spacing:0;font-variant-numeric:tabular-nums}
.gen .g-refs-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-20);min-height:var(--mf-pill-tall);font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);cursor:pointer;text-align:center;position:relative}
.gen .g-refs-btn::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-refs-btn:hover:not(:disabled){box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
/* the current choice is a chosen chip: black with a tick (Choice 2) */
.gen .g-refs-btn[aria-pressed="true"]{background:var(--mf-action);color:var(--mf-on-action);font-weight:500}
.gen .g-refs-btn[aria-pressed="true"]::before{content:"";width:9px;height:5px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translateY(-1px);flex:none}
.gen .g-refs-btn:disabled{opacity:.45;cursor:default}
.gen .g-refs-closebtn{flex:none}
.gen .g-refs-key{font:400 var(--mf-text-caption)/1 var(--mf-font-mono);color:var(--mf-ink-muted);margin-left:4px;white-space:nowrap}
.gen .g-refs-ki{margin:0;font:500 var(--mf-text-heading)/var(--mf-leading-heading) var(--mf-font-sans);color:var(--mf-ink)}
.gen .g-refs-p{margin:0;font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);overflow-wrap:anywhere}
.gen .g-refs-p+.g-refs-p{margin-top:6px}
.gen .g-refs-mute{margin:0;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-refs-mute code,.gen .g-refs-empty code{font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-mono);overflow-wrap:anywhere}
.gen .g-refs-sec{display:flex;flex-direction:column;gap:6px;min-width:0}
.gen .g-refs-list{margin:0;padding-left:var(--mf-space-20);display:flex;flex-direction:column;gap:6px;font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);overflow-wrap:anywhere}
.gen .g-refs-decide{display:flex;flex-wrap:wrap;gap:var(--mf-form-label)}
.gen .g-refs-dstate{margin:4px 0 0;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-refs-dstate b{color:var(--mf-ink);font-weight:600}
.gen .g-refs-ext{align-self:flex-start;color:var(--mf-ink);font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);text-decoration:underline;text-underline-offset:3px;padding:var(--mf-space-10) 0;min-height:var(--mf-target-web)}
.gen .g-refs-pal{display:flex;flex-wrap:wrap;gap:var(--mf-space-10)}
.gen .g-refs-swatch{display:flex;flex-direction:column;gap:4px;font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);color:var(--mf-ink-muted)}
.gen .g-refs-swatch i{display:block;width:64px;height:40px;border-radius:var(--mf-radius-tile);box-shadow:inset 0 0 0 1px var(--mf-line)}
.gen .g-refs-tags{display:flex;flex-wrap:wrap;gap:var(--mf-form-label)}
.gen .g-refs-tagc{cursor:default}
.gen .g-refs-used{display:flex;flex-direction:column;gap:6px}
.gen .g-refs-go{display:flex;align-items:center;gap:var(--mf-space-10);background:none;border:0;padding:0;min-height:var(--mf-target-web);cursor:pointer;color:var(--mf-ink);font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);text-align:left}
.gen .g-refs-go:hover span{text-decoration:underline}
.gen .g-refs-go img,.gen .g-refs-go .g-refs-ph{width:40px;height:40px;object-fit:cover;border-radius:var(--mf-radius-tile);flex:none;box-shadow:var(--mf-elevation-1);background:var(--mf-surface-1);display:block}
.gen .g-refs-field{display:flex;flex-direction:column;gap:var(--mf-form-hint)}
.gen .g-refs-input{width:100%;border:1px solid var(--mf-line);border-radius:var(--mf-radius-field);background:var(--mf-surface-0);color:var(--mf-ink);font:400 var(--mf-text-input-web)/22px var(--mf-font-sans);padding:8px 10px;min-height:var(--mf-target-web);resize:vertical}
.gen .g-refs-pnote{min-height:88px}
.gen .g-refs-saved{margin:0;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-refs-saved:empty{display:none}
.gen .g-refs-legend{display:flex;flex-wrap:wrap;gap:4px var(--mf-space-20);margin:0 0 4px;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-refs-legend span{display:inline-flex;align-items:center;gap:6px}
.gen .g-refs-legend i{display:inline-block;width:20px;height:11px;border-radius:6px}
.gen .g-refs-lg-on{background:var(--mf-action)}
.gen .g-refs-lg-off{background:var(--mf-surface-2)}

/* parts: thin rules between them, no boxes */
.gen .g-refs-units{display:flex;flex-direction:column}
.gen .g-refs-unit{scroll-margin-top:120px;display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--mf-space-10) var(--mf-space-20);padding:var(--mf-space-20) 0;border-top:1px solid var(--mf-line)}
.gen .g-refs-unit.g-refs-nothumb{grid-template-columns:minmax(0,1fr)}
.gen .g-refs-uthumb{display:block;width:96px;border:0;padding:0;background:var(--mf-surface-1);border-radius:var(--mf-radius-tile);overflow:hidden;cursor:pointer;box-shadow:var(--mf-elevation-1);align-self:start}
.gen .g-refs-uthumb img{display:block;width:100%;height:auto}
.gen .g-refs-uthumb[aria-current="true"]{box-shadow:0 0 0 2px var(--mf-ink),var(--mf-elevation-1)}
.gen .g-refs-withheld{display:flex;align-items:center;justify-content:center;aspect-ratio:4/5;padding:6px;font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);color:var(--mf-ink-muted);text-align:center}
.gen .g-refs-ubody{min-width:0;display:flex;flex-direction:column;gap:4px}
.gen .g-refs-ucode{margin:0;font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.04em;color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-refs-uval{margin:2px 0 4px;font:600 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans)}
.gen .g-refs-lbl{margin:6px 0 0;font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted)}
.gen .g-refs-quote{margin:0;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-mono);background:var(--mf-surface-1);border-radius:var(--mf-radius-tile);padding:6px 8px;white-space:pre-wrap;overflow-wrap:anywhere}
.gen .g-refs-marks{display:flex;flex-direction:column;gap:var(--mf-space-10);margin-top:var(--mf-space-10)}
.gen .g-refs-eye{align-self:flex-start}
.gen .g-refs-qs{margin:0;padding-left:var(--mf-space-20);font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted);display:flex;flex-direction:column;gap:4px}
/* part choices are MindFold chips: grey = not chosen, data-state="chosen" = saved (black with a tick) */
.gen .g-refs-chips{display:flex;flex-wrap:wrap;gap:var(--mf-form-label)}
.gen .g-refs-ai{background:var(--mf-surface-1);border-radius:var(--mf-radius-field);padding:var(--mf-space-10) 12px;display:flex;flex-direction:column;gap:2px}
.gen .g-refs-ai .g-refs-lbl:first-child{margin-top:0}
.gen .g-refs-ai .g-refs-quote{background:var(--mf-surface-0)}
.gen .g-refs-help{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px var(--mf-space-10);margin:0;cursor:not-allowed;user-select:none;color:var(--mf-ink-muted);opacity:.6}
.gen .g-refs-helpl{font:500 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans)}
.gen .g-refs-helph{font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.04em}
.gen .g-refs-btn:focus-visible,.gen .g-refs-chip:focus-visible,.gen .g-refs-nav:focus-visible,.gen .g-refs-pic:focus-visible,.gen .g-refs-uthumb:focus-visible,.gen .g-refs-go:focus-visible,.gen .g-refs-pill:focus-visible,.gen .g-refs-switch:focus-visible,.gen .g-refs-link:focus-visible,.gen .g-refs-toggle:focus-visible{outline:var(--mf-focus-width-web) solid var(--mf-focus);outline-offset:var(--mf-focus-gap)}

@media (max-width:599px){
  .gen .g-refs-board,.gen .g-refs-col{gap:var(--mf-space-10)}
  .gen .g-refs-search{flex-basis:100%;max-width:none}
  .gen .g-refs-toggle{display:inline-flex}
  .gen .g-refs-panel{display:none}
  .gen .g-refs-fopen .g-refs-panel{display:flex}
  .gen .g-refs-empty p,.gen .g-refs-empty li,.gen .g-refs-none p{font-size:var(--mf-text-heading);line-height:var(--mf-leading-heading)}
  /* the viewer stacks: the image on top at about half the screen, the panel below */
  .gen .g-refs-dlg{width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .gen .g-refs-view{display:flex;flex-direction:column;overflow:auto}
  .gen .g-refs-stage{flex:none;height:50dvh}
  .gen .g-refs-navs{bottom:10px}
  .gen .g-refs-unav{top:10px}
  .gen .g-refs-side{overflow:visible;flex:none;padding:0 var(--mf-space-20) var(--mf-space-40)}
  .gen .g-refs-p,.gen .g-refs-list,.gen .g-refs-quote,.gen .g-refs-qs,.gen .g-refs-uval{font-size:var(--mf-text-heading);line-height:var(--mf-leading-heading)}
  .gen .g-refs-helpl,.gen .g-refs-mute,.gen .g-refs-dstate,.gen .g-refs-go,.gen .g-refs-legend,.gen .g-refs-saved{font-size:var(--mf-text-emphasis);line-height:var(--mf-leading-emphasis)}
  .gen .g-refs-unit{grid-template-columns:72px minmax(0,1fr)}
  .gen .g-refs-uthumb{width:72px}
}
@media (prefers-reduced-motion:reduce){ .gen .g-refs-pic,.gen .g-refs-tag{transition:none} }
@media (prefers-reduced-motion:no-preference){ .gen .g-refs-dlg[open]{animation:g-refs-fade .14s ease-out} }
@keyframes g-refs-fade{from{opacity:0}to{opacity:1}}
/* everyone else's marks, read-only (access 2026-11) */
.gen .g-refs-others{list-style:none;margin:0;padding:0;display:grid;gap:4px;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-refs-others b{color:var(--mf-ink);font-weight:600}
.gen .g-refs-others q{color:var(--mf-ink)}

/* ---- screens/picks.css ---- */
/* IP OS · Generation · My picks (2026-11-06). Moodboard tiles with the shell's caption (.cap) under each:
   a pick is about the words as much as the image. Shell tokens only; type 11/13/15/17/22. Classes prefixed g-picks-. */
.gen .g-picks-group{margin:0 0 var(--mf-space-60)}
.gen .g-picks-gh{margin:0 0 var(--mf-space-20);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted);display:flex;flex-wrap:wrap;gap:0 10px;align-items:baseline;overflow-wrap:anywhere}
.gen .g-picks-gh small{font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:0;text-transform:none;font-variant-numeric:tabular-nums}
.gen .g-picks-board{display:flex;gap:var(--mf-space-20);align-items:flex-start}
.gen .g-picks-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:var(--mf-space-30)}
.gen .g-picks-card{min-width:0}
.gen .g-picks-pic{display:block;width:100%;aspect-ratio:var(--g-ar,.8);border:0;padding:0;background:var(--mf-surface-1);border-radius:var(--mf-radius-tile);overflow:hidden;cursor:zoom-in;box-shadow:var(--mf-elevation-1);transition:box-shadow .18s}
.gen .g-picks-pic:hover{box-shadow:var(--mf-elevation-2)}
.gen .g-picks-pic:focus-visible{outline:var(--mf-focus-width-web) solid var(--mf-focus);outline-offset:var(--mf-focus-gap)}
.gen .g-picks-pic img{display:block;width:100%;height:100%;object-fit:cover}
.gen .g-picks-miss{display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:var(--mf-space-10);font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted);text-align:center}
.gen .g-picks-cap{cursor:pointer;display:flex;flex-direction:column;gap:4px;padding-top:var(--mf-space-10);font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-picks-ttl{font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);color:var(--mf-ink)}
/* saved choices: MindFold chips, data-state="chosen" */
.gen .g-picks-chips{display:flex;flex-wrap:wrap;gap:4px}
.gen .g-picks-chip{cursor:inherit}
.gen .g-picks-note{margin:0;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink)}
.gen .g-picks-src{margin:0;font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);color:var(--mf-ink-muted)}
.gen .g-picks-loading{margin:0;padding:var(--mf-space-20) 0;color:var(--mf-ink-muted)}
.gen .g-picks-empty{max-width:60ch;padding:var(--mf-space-40) 0}
.gen .g-picks-empty h2{margin:0;font:600 var(--mf-text-display)/var(--mf-leading-display) var(--mf-font-sans)}
.gen .g-picks-empty p{margin:var(--mf-space-10) 0 0;color:var(--mf-ink-muted)}
.gen .g-picks-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative;margin-top:var(--mf-space-20)}
.gen .g-picks-link::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-picks-link:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
@media (max-width:599px){
  .gen .g-picks-board{gap:var(--mf-space-10)}
  .gen .g-picks-col{gap:var(--mf-space-20)}
  .gen .g-picks-cap,.gen .g-picks-note,.gen .g-picks-miss{font-size:var(--mf-text-emphasis);line-height:var(--mf-leading-emphasis)}
  .gen .g-picks-ttl{font-size:var(--mf-text-heading);line-height:var(--mf-leading-heading)}
  .gen .g-picks-empty p{font-size:var(--mf-text-heading);line-height:var(--mf-leading-heading)}
}
@media (prefers-reduced-motion:reduce){ .gen .g-picks-pic{transition:none} }

/* ---- screens/selects.css ---- */
/* IP OS · Generation · Selects. Shell tokens only; type 11/13/15/17/22; spacing 10/20/30/40/60/80. */
.gen .g-selects-host{display:block}
.gen .g-selects-prods{display:flex;flex-wrap:wrap;gap:0 var(--mf-space-20);padding-block:0 var(--mf-space-20)}
.gen .g-selects-prod{position:relative;background:none;border:0;padding:4px 0;min-height:var(--mf-target-web);cursor:pointer;color:var(--mf-ink-muted);font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);text-align:left}
.gen .g-selects-prod[aria-pressed="true"]{color:var(--mf-ink)}
.gen .g-selects-prod[aria-pressed="true"]::after,.gen .g-selects-showb[aria-pressed="true"]::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:var(--mf-underline-tab);border-radius:1px;background:var(--mf-ink)}
.gen .g-selects-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--mf-space-10) var(--mf-space-30);padding-block:0 var(--mf-space-20)}
.gen .g-selects-sum{margin:0;max-width:70ch;color:var(--mf-ink-muted);flex:1 1 320px}
.gen .g-selects-show{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px var(--mf-space-20)}
.gen .g-selects-lbl{font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted)}
.gen .g-selects-showb{position:relative;background:none;border:0;padding:4px 0;min-height:var(--mf-target-web);cursor:pointer;color:var(--mf-ink-muted);font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);text-align:left}
.gen .g-selects-showb[aria-pressed="true"]{color:var(--mf-ink)}
.gen .g-selects-n{margin-left:6px;font:400 var(--mf-text-caption)/1 var(--mf-font-mono);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-selects-nav{display:flex;flex-wrap:wrap;gap:0 var(--mf-space-30);padding-block:0 var(--mf-space-40)}
.gen .g-selects-jump{background:none;border:0;padding:4px 0;min-height:var(--mf-target-web);cursor:pointer;text-align:left;display:flex;flex-direction:column;color:var(--mf-ink);font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans)}
.gen .g-selects-jump b{font-weight:500}
.gen .g-selects-jump span{font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-selects-jump.g-selects-none{color:var(--mf-ink-muted)}
.gen .g-selects-group{margin:0 0 var(--mf-space-60);scroll-margin-top:var(--mf-space-20)}
.gen .g-selects-group h2{margin:0 0 var(--mf-space-20);font:600 var(--mf-text-heading)/var(--mf-leading-heading) var(--mf-font-sans)}
.gen .g-selects-group h2 small{margin-left:var(--mf-space-10);font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-selects-missing{margin-bottom:var(--mf-space-30)}
.gen .g-selects-missing h2{color:var(--mf-ink-muted);font-weight:500;margin-bottom:var(--mf-space-10)}
.gen .g-selects-gap{margin:0;color:var(--mf-ink-muted)}
.gen .g-selects-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--mf-space-30) var(--mf-space-20);align-items:start}
.gen .g-selects-tile{min-width:0;display:flex;flex-direction:column;gap:var(--mf-form-label)}
.gen .g-selects-open{position:relative;display:block;width:100%;padding:0;border:0;border-radius:var(--mf-radius-tile);overflow:hidden;background:var(--mf-surface-1);cursor:zoom-in;box-shadow:var(--mf-elevation-1);transition:box-shadow .18s}
.gen .g-selects-open:hover{box-shadow:var(--mf-elevation-2)}
.gen .g-selects-open img{display:block;width:100%;height:100%;object-fit:cover}
.gen .g-selects-on .g-selects-open{box-shadow:0 0 0 3px var(--mf-ink),var(--mf-elevation-1)}
.gen .g-selects-miss{display:flex;align-items:center;justify-content:center;height:100%;padding:var(--mf-space-10);font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted)}
.gen .g-selects-badge{position:absolute;left:8px;top:8px;font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.06em;text-transform:uppercase;background:var(--mf-action);color:var(--mf-on-action);padding:4px 8px;border-radius:var(--mf-radius-pill)}
.gen .g-selects-hmark{position:absolute;right:8px;top:8px;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink);background:var(--mf-surface-0);padding:0 8px;border-radius:var(--mf-radius-pill)}
.gen .g-selects-meta{display:flex;flex-wrap:wrap;gap:0 var(--mf-space-10);font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-selects-note{font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-selects-acts{display:flex;flex-wrap:wrap;gap:var(--mf-form-label);align-items:center}
/* heart and select are toggles: small grey pills; pressed shows as a chosen chip (Choices 1 and 2) */
.gen .g-selects-heart,.gen .g-selects-pick{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-selects-heart::after,.gen .g-selects-pick::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-selects-heart:hover,.gen .g-selects-pick:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-selects-pick[aria-pressed="true"],.gen .g-selects-heart[aria-pressed="true"]{background:var(--mf-action);color:var(--mf-on-action)}
.gen .g-selects-pick[aria-pressed="true"]::before{content:"";width:9px;height:5px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translateY(-1px);flex:none}
@media (max-width:600px){ .gen .g-selects-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--mf-space-30) var(--mf-space-10)} }

/* ---- screens/hearts.css ---- */
/* IP OS · Generation · Hearts tab. Shell tokens only; type 11/13/15/17/22; spacing 10/20/30/40/60/80. */
.gen .g-hearts-panel{display:block}
.gen .g-hearts-lede{margin:0 0 var(--mf-space-30);color:var(--mf-ink-muted);max-width:70ch}
.gen .g-hearts-grp{margin:0 0 var(--mf-space-60)}
.gen .g-hearts-gh{display:flex;gap:var(--mf-space-10);align-items:baseline;margin:0 0 var(--mf-space-20);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted)}
.gen .g-hearts-gn{font-weight:400;letter-spacing:0;font-variant-numeric:tabular-nums}
.gen .g-hearts-board{display:flex;gap:var(--mf-space-20);align-items:flex-start}
.gen .g-hearts-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:var(--mf-space-30)}
.gen .g-hearts-tile{display:block;min-width:0}
.gen .g-hearts-pic{position:relative;display:block;width:100%;border:0;padding:0;background:var(--mf-surface-1);border-radius:var(--mf-radius-tile);overflow:hidden;cursor:zoom-in;box-shadow:var(--mf-elevation-1);transition:box-shadow .18s}
.gen .g-hearts-pic:hover{box-shadow:var(--mf-elevation-2)}
.gen .g-hearts-pic img{display:block;width:100%;height:100%;object-fit:cover}
.gen .g-hearts-miss{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:120px;padding:var(--mf-space-10);text-align:center;color:var(--mf-ink-muted);font-size:var(--mf-text-body);line-height:var(--mf-leading-body)}
/* status marks (Signal): To review = attention, On hold = waiting */
.gen .g-hearts-dot{position:absolute;top:10px;right:10px;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 2px var(--mf-surface-0)}
.gen .g-hearts-dot[data-s="review"]{background:var(--mf-status-attention-dot)}
.gen .g-hearts-dot[data-s="hold"]{background:var(--mf-status-waiting-dot)}
.gen .g-hearts-dim .g-hearts-pic img,.gen .g-hearts-dim .g-hearts-miss{opacity:.45}
.gen .g-hearts-cap{display:flex;flex-direction:column;gap:2px;padding:var(--mf-space-10) 2px 0;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);overflow-wrap:anywhere}
.gen .g-hearts-top{display:flex;align-items:center;justify-content:space-between;gap:var(--mf-space-10)}
.gen .g-hearts-code{font:400 var(--mf-text-caption)/var(--mf-leading-body) var(--mf-font-mono);color:var(--mf-ink-muted);white-space:nowrap}
.gen .g-hearts-heart{display:inline-grid;place-items:center;min-width:44px;min-height:44px;margin:-13px -11px -13px 0;background:none;border:0;padding:0;cursor:pointer;color:var(--mf-ink)}
.gen .g-hearts-heart:hover{opacity:.6}
.gen .g-hearts-title{font-size:var(--mf-text-emphasis);line-height:var(--mf-leading-emphasis);color:var(--mf-ink)}
.gen .g-hearts-sub{color:var(--mf-ink-muted)}
.gen .g-hearts-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px var(--mf-space-10);margin-top:6px;color:var(--mf-ink-muted)}
/* To review and On hold are MindFold status chips (.mf-status[data-status]); Approved and Rejected stay plain text */
.gen .g-hearts-st{display:inline-flex;align-items:center}
.gen .g-hearts-sel{display:inline-flex;align-items:center;gap:4px;color:var(--mf-ink);font-weight:500}
.gen .g-hearts-date{font-variant-numeric:tabular-nums}
.gen .g-hearts-empty{max-width:60ch;padding:var(--mf-space-40) 0 var(--mf-space-60)}
.gen .g-hearts-h{margin:0;font:600 var(--mf-text-heading)/var(--mf-leading-heading) var(--mf-font-sans)}
.gen .g-hearts-empty p{margin:var(--mf-space-10) 0 0;color:var(--mf-ink-muted)}
@media (max-width:600px){
  .gen .g-hearts-board{gap:var(--mf-space-10)}
  .gen .g-hearts-col{gap:var(--mf-space-20)}
}
@media (prefers-reduced-motion:reduce){.gen .g-hearts-pic{transition:none}}

/* ---- screens/costs.css ---- */
/* costs: no boxes, no cell borders, 1px --line between rows. Type 11/13/15/17/22, spacing 10/20/30/40/60/80. */
.gen .g-costs[hidden]{display:none}
.gen .g-costs-line{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px var(--mf-space-20);font-variant-numeric:tabular-nums}
.gen .g-costs-lead{color:var(--mf-ink-muted);font-weight:400}
.gen .g-costs-fig{color:var(--mf-ink);font-weight:500}
.gen .g-costs-more{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-costs-more::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-costs-more:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-costs-more[aria-expanded="true"]{background:var(--mf-action);color:var(--mf-on-action)}
.gen .g-costs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--mf-space-30) var(--mf-space-40);padding-top:var(--mf-space-20)}
.gen .g-costs-blk{min-width:0}
.gen .g-costs-h{margin:0 0 var(--mf-space-10);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted)}
.gen .g-costs-tab{width:100%;border-collapse:collapse;border:0;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);font-variant-numeric:tabular-nums}
.gen .g-costs-tab td{padding:8px 0;border:0;border-bottom:1px solid var(--mf-line);vertical-align:top;overflow-wrap:break-word}
.gen .g-costs-tab td:last-child{text-align:right;padding-left:var(--mf-space-20);font-weight:500;width:40%;min-width:110px;overflow-wrap:normal}
.gen .g-costs-tab tr:last-child td{border-bottom:0}
.gen .g-costs-note{grid-column:1/-1;margin:0;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted)}

/* ---- screens/viewer.css ---- */
/* IP OS · Generation section · viewer. The Moodboard viewer (artifact 1aGLWCppQkpzHzsmmCD6wp): image left at full height,
   panel right with a pinned header, floating prev/next pill, pill decision buttons. Tokens only; type 11/13/15/17/22; spacing 10/20/30/40/60/80/120. */
.gen .g-viewer-dlg{border:0;padding:0;background:var(--mf-surface-0);color:var(--mf-ink);font-family:var(--mf-font-sans);width:min(1240px,calc(100vw - 32px));max-width:none;height:calc(100dvh - 32px);max-height:calc(100dvh - 32px);border-radius:var(--mf-radius-panel-lg);overflow:hidden}
.gen .g-viewer-dlg::backdrop{background:var(--mf-scrim)}
.gen .g-viewer-view{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,1fr);height:100%}
.gen .g-viewer-view *{box-sizing:border-box}

/* image */
.gen .g-viewer-stage{background:var(--mf-surface-1);position:relative;min-height:0;min-width:0}
.gen .g-viewer-media{position:absolute;inset:0;overflow:hidden}
.gen .g-viewer-media img,.gen .g-viewer-media video{width:100%;height:100%;object-fit:contain;display:block}
.gen .g-viewer-nofile{margin:0;padding:var(--mf-space-30);color:var(--mf-ink-muted)}
.gen .g-viewer-zoomed .g-viewer-media{overflow:auto}
.gen .g-viewer-zoomed .g-viewer-media img{width:auto;height:auto;max-width:none;max-height:none;object-fit:none;cursor:zoom-out}
/* floating prev / next: MindFold's stepper (a pill, mono count), raised on surface-3 */
.gen .g-viewer-navs{position:absolute;left:50%;bottom:var(--mf-space-20);transform:translateX(-50%);z-index:2;display:flex;align-items:center;gap:4px;background:var(--mf-surface-3);border-radius:var(--mf-radius-pill);padding:4px;box-shadow:var(--mf-elevation-1),inset 0 0 0 1px var(--mf-line);max-width:calc(100% - 20px)}
.gen .g-viewer-nav{border:0;background:none;color:var(--mf-ink);width:44px;height:44px;border-radius:var(--mf-radius-pill);cursor:pointer;font-size:var(--mf-text-display);line-height:1;display:inline-flex;align-items:center;justify-content:center;padding:0}
.gen .g-viewer-nav:hover{background:var(--mf-surface-1)}
.gen .g-viewer-zoombtn{width:auto;padding:0 14px;font:500 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-viewer-zoombtn[aria-pressed="true"]{color:var(--mf-ink)}
.gen .g-viewer-zoombtn[hidden]{display:none}
.gen .g-viewer-pos{font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-mono);min-width:72px;padding:0 6px;text-align:center;color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}

/* panel */
.gen .g-viewer-side{overflow:auto;padding:0 var(--mf-space-20) var(--mf-space-30);display:flex;flex-direction:column;gap:var(--mf-space-20);min-width:0;background:var(--mf-surface-0)}
.gen .g-viewer-side>*{flex:none}
.gen .g-viewer-head{position:sticky;top:0;z-index:3;background:var(--mf-surface-0);padding:var(--mf-space-20) 0 var(--mf-space-10);display:flex;justify-content:space-between;align-items:flex-start;gap:var(--mf-space-10)}
/* title first, the code after it in muted mono 11 (MindFold decision 13; Choice 6) */
.gen .g-viewer-headtxt{min-width:0;display:flex;flex-direction:column}
.gen .g-viewer-headtxt .g-viewer-title{order:-1;margin:0 0 4px}
.gen .g-viewer-headtxt .g-viewer-grp{margin:0;font-weight:400;letter-spacing:0;text-transform:none}
.gen .g-viewer-title{margin:4px 0 0;font:600 var(--mf-text-display)/var(--mf-leading-display) var(--mf-font-sans);overflow-wrap:anywhere}
.gen .g-viewer-grp{margin:0 0 var(--mf-form-label);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted)}
.gen .g-viewer-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-20);min-height:var(--mf-pill-tall);font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);cursor:pointer;text-align:center;position:relative}
.gen .g-viewer-btn::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-viewer-btn:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
/* the current choice is a chosen chip: black with a tick (Choice 2) */
.gen .g-viewer-btn[aria-pressed="true"]{background:var(--mf-action);color:var(--mf-on-action);font-weight:500}
.gen .g-viewer-btn[aria-pressed="true"]::before{content:"";width:9px;height:5px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translateY(-1px);flex:none}
.gen .g-viewer-closebtn{flex:none}
.gen .g-viewer-key{font:400 var(--mf-text-caption)/1 var(--mf-font-mono);color:var(--mf-ink-muted);margin-left:4px;white-space:nowrap}
.gen .g-viewer-btn[aria-pressed="true"] .g-viewer-key{color:inherit;opacity:.7}
.gen .g-viewer-decide,.gen .g-viewer-pick{display:flex;flex-wrap:wrap;gap:var(--mf-form-label);align-items:center}
.gen .g-viewer-pick[hidden],.gen .g-viewer-field[hidden]{display:none}
.gen .g-viewer-dstate{flex:1 1 100%;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted)}
.gen .g-viewer-dstate b{color:var(--mf-ink);font-weight:600}
.gen .g-viewer-field{display:flex;flex-direction:column;gap:var(--mf-form-hint)}
.gen .g-viewer-input{width:100%;border:1px solid var(--mf-line);border-radius:var(--mf-radius-field);background:var(--mf-surface-0);color:var(--mf-ink);font:400 var(--mf-text-input-web)/22px var(--mf-font-sans);padding:8px 10px;min-height:var(--mf-target-web)}
.gen .g-viewer-note{resize:vertical;min-height:110px}
.gen .g-viewer-hint{font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-viewer-hint:empty{display:none}
.gen .g-viewer-saved{margin:-10px 0 0;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-viewer-saved:empty{display:none}
.gen .g-viewer-note2{margin:0;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-viewer-refs,.gen .g-viewer-links{display:flex;flex-direction:column;gap:var(--mf-space-10)}
.gen .g-viewer-ref,.gen .g-viewer-link{display:flex;align-items:center;gap:var(--mf-space-10);font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink);text-align:left}
.gen .g-viewer-ref img,.gen .g-viewer-link img,.gen .g-viewer-ref .g-viewer-ph,.gen .g-viewer-link .g-viewer-ph{width:40px;height:40px;object-fit:cover;border-radius:var(--mf-radius-tile);flex:none;box-shadow:var(--mf-elevation-1)}
.gen .g-viewer-ph{display:block;background:var(--mf-surface-1)}
.gen .g-viewer-link{background:none;border:0;padding:0;min-height:44px;cursor:pointer}
.gen .g-viewer-link:hover{text-decoration:underline}
.gen .g-viewer-take{min-height:0;padding:4px 0}
.gen .g-viewer-prompt{margin:0 0 var(--mf-space-10);white-space:pre-wrap;overflow-wrap:anywhere;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-mono);max-height:240px;overflow:auto}
.gen .g-viewer-copy{align-self:flex-start;min-height:var(--mf-pill-short);padding:0 var(--mf-space-10);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans)}
.gen .g-viewer-dl{margin:0}
.gen .g-viewer-row{display:grid;grid-template-columns:120px minmax(0,1fr);gap:var(--mf-space-10);padding:8px 0;border-top:1px solid var(--mf-line)}
.gen .g-viewer-row dt{font:400 var(--mf-text-body)/var(--mf-leading-emphasis) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-viewer-row dd{margin:0;font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);overflow-wrap:anywhere}

/* phones: the image on top at about half the screen, the panel below and scrolling */
@media (max-width:600px){
  .gen .g-viewer-dlg{width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .gen .g-viewer-view{display:flex;flex-direction:column;overflow:auto}
  .gen .g-viewer-stage{flex:none;height:50dvh}
  .gen .g-viewer-navs{bottom:var(--mf-space-10)}
  .gen .g-viewer-side{overflow:visible;flex:none;font-size:var(--mf-text-heading);padding:0 var(--mf-space-20) var(--mf-space-40)}
  .gen .g-viewer-head{top:0}
  .gen .g-viewer-dstate{font-size:var(--mf-text-emphasis);line-height:var(--mf-leading-emphasis)}
  .gen .g-viewer-row{grid-template-columns:100px minmax(0,1fr)}
  .gen .g-viewer-row dd{font-size:var(--mf-text-heading);line-height:var(--mf-leading-heading)}
  .gen .g-viewer-note2,.gen .g-viewer-ref,.gen .g-viewer-link,.gen .g-viewer-prompt{font-size:var(--mf-text-emphasis);line-height:var(--mf-leading-emphasis)}
}
@media (prefers-reduced-motion:no-preference){ .gen .g-viewer-dlg[open]{animation:g-viewer-fade .14s ease-out} }
@keyframes g-viewer-fade{from{opacity:0}to{opacity:1}}

/* ---- screens/keys.css ---- */
/* IP OS · Generation · keys. Text buttons in the actions slot and a quiet shortcut list. */
.gen .g-keys{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mf-form-label)}
.gen .g-keys-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-keys-btn::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-keys-btn:disabled{cursor:default;opacity:.45}
.gen .g-keys-btn:not(:disabled):hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-keys-dialog{border:0;padding:0;background:var(--mf-surface-0);color:var(--mf-ink);width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 32px);border-radius:var(--mf-radius-panel-lg);box-shadow:inset 0 0 0 1px var(--mf-line);overflow:auto}
.gen .g-keys-dialog::backdrop{background:var(--mf-scrim)}
.gen .g-keys-sheet{display:flex;flex-direction:column;gap:var(--mf-space-20);padding:var(--mf-space-20) var(--mf-space-30) var(--mf-space-30)}
.gen .g-keys-h{margin:0;font:600 var(--mf-text-display)/var(--mf-leading-display) var(--mf-font-sans)}
.gen .g-keys-note{margin:0;color:var(--mf-ink-muted);font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans)}
.gen .g-keys-list{margin:0;display:flex;flex-direction:column}
.gen .g-keys-row{display:grid;grid-template-columns:80px minmax(0,1fr);gap:var(--mf-space-10) var(--mf-space-20);align-items:baseline;padding:12px 0;border-top:1px solid var(--mf-line)}
.gen .g-keys-row:first-child{border-top:0}
.gen .g-keys-row dt{font:500 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-mono);color:var(--mf-ink)}
.gen .g-keys-row dd{margin:0;font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans)}
.gen .g-keys-close{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-20);min-height:var(--mf-pill-tall);font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);cursor:pointer;text-align:center}
@media (max-width:860px){
  .gen .g-keys-dialog{width:100%;max-width:100%;margin:auto 0 0;border-radius:var(--mf-radius-panel-lg) var(--mf-radius-panel-lg) 0 0;max-height:92dvh}
  .gen .g-keys-sheet{padding:var(--mf-space-20) var(--mf-space-20) calc(var(--mf-space-30) + env(safe-area-inset-bottom,0px))}
}

/* phones have no keyboard: hide the shortcut list there (design brief: keep the phone header short) */
@media (max-width:600px), (hover:none) and (pointer:coarse){.gen .g-keys-open{display:none}}

/* ---- screens/downloads.css ---- */
.gen .g-downloads-row{display:flex;flex-wrap:wrap;gap:var(--mf-form-label);align-items:center}
.gen .g-downloads-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative;white-space:normal}
.gen .g-downloads-btn::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-downloads-btn:hover:not(:disabled){box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-downloads-btn:disabled{cursor:default;opacity:.45}
.gen .g-downloads-st{flex-basis:100%;margin:0;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted);overflow-wrap:anywhere;max-width:100%}
.gen .g-downloads-st[hidden]{display:none}

/* ---- screens/guide.css ---- */
/* IP OS · Generation · How to log (2026-11-06). A sheet dialog like the shell's .sheetp; rows separated by thin rules,
   no boxed table; mono-caps group headings. Shell tokens only; type 11/13/15/17/22. Classes prefixed g-guide-. */
.gen .g-guide-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-guide-btn::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-guide-btn:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-guide-dlg{border:0;padding:0;background:var(--mf-surface-0);color:var(--mf-ink);width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 32px);border-radius:var(--mf-radius-panel-lg);box-shadow:inset 0 0 0 1px var(--mf-line);overflow:hidden}
.gen .g-guide-dlg::backdrop{background:var(--mf-scrim)}
.gen .g-guide-sheet{max-height:calc(100dvh - 32px);overflow:auto;padding:0 var(--mf-space-30) var(--mf-space-30);display:flex;flex-direction:column;gap:var(--mf-space-20)}
.gen .g-guide-head{position:sticky;top:0;z-index:2;background:var(--mf-surface-0);display:flex;justify-content:space-between;align-items:flex-start;gap:var(--mf-space-20);padding:var(--mf-space-20) 0 var(--mf-space-10)}
.gen .g-guide-h{margin:0;font:600 var(--mf-text-display)/var(--mf-leading-display) var(--mf-font-sans)}
.gen .g-guide-close{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-20);min-height:var(--mf-pill-tall);font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);cursor:pointer;text-align:center}
.gen .g-guide-sec{display:flex;flex-direction:column;gap:var(--mf-space-10);padding-top:var(--mf-space-10)}
.gen .g-guide-grp{margin:0;font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted);overflow-wrap:anywhere}
.gen .g-guide-p{margin:0;font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);overflow-wrap:anywhere}
.gen .g-guide-mute{color:var(--mf-ink-muted)}
.gen .g-guide-mute b{color:var(--mf-ink)}
.gen .g-guide-code{font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-mono);background:var(--mf-surface-1);border-radius:var(--mf-radius-tile);padding:1px 4px;overflow-wrap:anywhere}
.gen .g-guide-dl{margin:0}
.gen .g-guide-row{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:4px var(--mf-space-20);padding:12px 0;border-top:1px solid var(--mf-line)}
.gen .g-guide-row dt{font:500 var(--mf-text-body)/var(--mf-leading-emphasis) var(--mf-font-mono);overflow-wrap:anywhere}
.gen .g-guide-row dd{margin:0;font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);overflow-wrap:anywhere}
.gen .g-guide-ex{display:block;margin-top:2px;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted)}
.gen .g-guide-ul{margin:0;padding-left:var(--mf-space-20);display:flex;flex-direction:column;gap:6px;font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);overflow-wrap:anywhere}
.gen .g-guide-btn:focus-visible,.gen .g-guide-close:focus-visible{outline:var(--mf-focus-width-web) solid var(--mf-focus);outline-offset:var(--mf-focus-gap)}
@media (max-width:860px){
  .gen .g-guide-dlg{width:100%;max-width:100%;margin:auto 0 0;border-radius:var(--mf-radius-panel-lg) var(--mf-radius-panel-lg) 0 0;max-height:92dvh}
  .gen .g-guide-sheet{max-height:92dvh;padding:0 var(--mf-space-20) calc(var(--mf-space-30) + env(safe-area-inset-bottom,0px))}
}
@media (max-width:599px){
  .gen .g-guide-row{grid-template-columns:minmax(0,1fr)}
  .gen .g-guide-p,.gen .g-guide-ul,.gen .g-guide-row dd{font-size:var(--mf-text-heading);line-height:var(--mf-leading-heading)}
}

/* ---- screens/lists.css ---- */
/* IP OS · Generation · Lists editor (2026-11-06). A sheet dialog like the shell's .sheetp; 16 px inputs so iPhone
   Safari does not zoom. Shell tokens only; type 11/13/15/17/22. Classes prefixed g-lists-. */
.gen .g-lists-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-lists-btn::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-lists-btn[hidden]{display:none}
.gen .g-lists-btn:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-lists-dlg{border:0;padding:0;background:var(--mf-surface-0);color:var(--mf-ink);width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 32px);border-radius:var(--mf-radius-panel-lg);box-shadow:inset 0 0 0 1px var(--mf-line);overflow:hidden}
.gen .g-lists-dlg::backdrop{background:var(--mf-scrim)}
.gen .g-lists-sheet{max-height:calc(100dvh - 32px);overflow:auto;padding:0 var(--mf-space-30) var(--mf-space-30);display:flex;flex-direction:column;gap:var(--mf-space-20);margin:0}
.gen .g-lists-head{position:sticky;top:0;z-index:2;background:var(--mf-surface-0);display:flex;justify-content:space-between;align-items:flex-start;gap:var(--mf-space-20);padding:var(--mf-space-20) 0 var(--mf-space-10)}
.gen .g-lists-h{margin:0;font:600 var(--mf-text-display)/var(--mf-leading-display) var(--mf-font-sans)}
.gen .g-lists-close{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-20);min-height:var(--mf-pill-tall);font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);cursor:pointer;text-align:center}
.gen .g-lists-p{margin:0;font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-lists-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--mf-space-20)}
.gen .g-lists-field{display:flex;flex-direction:column;gap:var(--mf-form-label);min-width:0}
.gen .g-lists-grp{font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted)}
.gen .g-lists-hint{font:400 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);color:var(--mf-ink-muted)}
.gen .g-lists-input{width:100%;border:1px solid var(--mf-line);border-radius:var(--mf-radius-field);background:var(--mf-surface-0);color:var(--mf-ink);font:400 var(--mf-text-input-web)/22px var(--mf-font-sans);padding:8px 10px;min-height:150px;resize:vertical}
.gen .g-lists-foot{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:var(--mf-form-label) var(--mf-space-20);margin-top:var(--mf-space-10)}
.gen .g-lists-saved{margin:0;font:400 var(--mf-text-body)/var(--mf-leading-body) var(--mf-font-sans);color:var(--mf-ink-muted)}
/* the one black pill in this sheet (MindFold rule 1) */
.gen .g-lists-save{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-action);color:var(--mf-on-action);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-20);min-height:var(--mf-pill-tall);font:600 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);cursor:pointer;text-align:center}
.gen .g-lists-save:disabled{opacity:.45;cursor:default}
.gen .g-lists-btn:focus-visible,.gen .g-lists-close:focus-visible,.gen .g-lists-save:focus-visible,.gen .g-lists-input:focus-visible{outline:var(--mf-focus-width-web) solid var(--mf-focus);outline-offset:var(--mf-focus-gap)}
@media (max-width:860px){
  .gen .g-lists-dlg{width:100%;max-width:100%;margin:auto 0 0;border-radius:var(--mf-radius-panel-lg) var(--mf-radius-panel-lg) 0 0;max-height:92dvh}
  .gen .g-lists-sheet{max-height:92dvh;padding:0 var(--mf-space-20) calc(var(--mf-space-30) + env(safe-area-inset-bottom,0px))}
}
@media (max-width:599px){
  .gen .g-lists-grid{grid-template-columns:minmax(0,1fr)}
  .gen .g-lists-p{font-size:var(--mf-text-heading);line-height:var(--mf-leading-heading)}
  .gen .g-lists-hint,.gen .g-lists-saved{font-size:var(--mf-text-body);line-height:var(--mf-leading-body)}
  .gen .g-lists-input{min-height:120px}
}

/* ---- screens/conflicts.css ---- */
.gen .g-conflicts-lede,.gen .g-conflicts-empty{color:var(--mf-ink-muted);max-width:60em;margin:0 0 var(--mf-space-20)}
.gen .g-conflicts-show{display:flex;flex-wrap:wrap;gap:0 var(--mf-space-20);margin:0 0 var(--mf-space-20)}
.gen .g-conflicts-show button{position:relative;background:none;border:0;padding:4px 0;min-height:var(--mf-target-web);cursor:pointer;color:var(--mf-ink-muted);font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans)}
.gen .g-conflicts-show button[aria-pressed="true"]{color:var(--mf-ink)}
.gen .g-conflicts-show button[aria-pressed="true"]::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:var(--mf-underline-tab);border-radius:1px;background:var(--mf-ink)}
.gen .g-conflicts-show span{margin-left:5px;font:400 var(--mf-text-caption)/1 var(--mf-font-mono);color:var(--mf-ink-muted);font-variant-numeric:tabular-nums}
.gen .g-conflicts-list{list-style:none;margin:0;padding:0}
.gen .g-conflicts-row{border-top:1px solid var(--mf-line)}
.gen .g-conflicts-row:last-child{border-bottom:1px solid var(--mf-line)}
.gen .g-conflicts-head{display:flex;flex-wrap:wrap;gap:4px var(--mf-space-20);align-items:baseline;width:100%;text-align:left;background:none;border:0;padding:12px 0;min-height:var(--mf-target-web);cursor:pointer;color:var(--mf-ink)}
.gen .g-conflicts-what{font:500 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans)}
.gen .g-conflicts-meta{font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted)}
.gen .g-conflicts-table{width:100%;border-collapse:collapse;font-size:var(--mf-text-body);line-height:var(--mf-leading-body);margin:0 0 var(--mf-space-10);table-layout:fixed}
.gen .g-conflicts-table th,.gen .g-conflicts-table td{text-align:left;vertical-align:top;padding:var(--mf-space-10) var(--mf-space-20) var(--mf-space-10) 0;border-top:1px solid var(--mf-line);overflow-wrap:anywhere;white-space:pre-wrap}
.gen .g-conflicts-table thead th{border-top:0;font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted)}
.gen .g-conflicts-table tbody th{font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted);width:20%}
.gen .g-conflicts-table td.live{font-weight:600}
.gen .g-conflicts-none{color:var(--mf-ink-muted);font-style:italic}
.gen .g-conflicts-rule{font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted);margin:0 0 var(--mf-space-10)}
.gen .g-conflicts-open{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-20);min-height:var(--mf-pill-tall);font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);cursor:pointer;text-align:center;margin-bottom:var(--mf-space-20)}
.gen .g-conflicts-open:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
@media (max-width:600px){.gen .g-conflicts-table thead{display:none}.gen .g-conflicts-table tr{display:grid;grid-template-columns:1fr;border-top:1px solid var(--mf-line);padding:var(--mf-space-10) 0}.gen .g-conflicts-table th,.gen .g-conflicts-table td{border:0;padding:4px 0;width:auto}.gen .g-conflicts-table td::before{display:block;color:var(--mf-ink-muted)}.gen .g-conflicts-table td:nth-of-type(1)::before{content:"Generation Desk"}.gen .g-conflicts-table td:nth-of-type(2)::before{content:"IP OS"}.gen .g-conflicts-table td:nth-of-type(3)::before{content:"Live now"}}

/* ---- screens/rules.css ---- */
.gen .g-rules-lede{color:var(--mf-ink-muted);max-width:60em;margin:0 0 var(--mf-space-20)}
.gen .g-rules-group{margin:0 0 var(--mf-space-30)}
.gen .g-rules-group h3{font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mf-ink-muted);margin:0 0 var(--mf-space-10)}
.gen .g-rules-list{margin:0;padding:0 0 0 var(--mf-space-20)}
.gen .g-rules-rule{padding:12px 0;border-top:1px solid var(--mf-line);max-width:60em}
.gen .g-rules-rule.off .g-rules-text{color:var(--mf-ink-muted);text-decoration:line-through}
.gen .g-rules-text{margin:0 0 4px}
.gen .g-rules-meta{font-size:var(--mf-text-body);line-height:var(--mf-leading-body);color:var(--mf-ink-muted);margin:0}
.gen .g-rules-acts{display:flex;flex-wrap:wrap;gap:var(--mf-form-label);margin-top:var(--mf-form-label)}
.gen .g-rules-acts button{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-10);min-height:var(--mf-pill-short);font:500 var(--mf-text-caption)/var(--mf-leading-caption) var(--mf-font-sans);text-decoration:none;cursor:pointer;text-align:left;position:relative}
.gen .g-rules-acts button::after{content:"";position:absolute;left:0;right:0;top:50%;height:var(--mf-target-web);transform:translateY(-50%)}
.gen .g-rules-acts button:hover,.gen .g-rules-add:hover{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--mf-ink) var(--mf-hover-ink),transparent)}
.gen .g-rules-add{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:var(--mf-surface-2);color:var(--mf-ink);border-radius:var(--mf-radius-pill);padding:0 var(--mf-space-20);min-height:var(--mf-pill-tall);font:400 var(--mf-text-emphasis)/var(--mf-leading-emphasis) var(--mf-font-sans);cursor:pointer;text-align:center}
.gen .g-rules-edit,.gen .g-rules-newgroup{display:block;width:100%;font:400 var(--mf-text-input-web)/22px var(--mf-font-sans);color:var(--mf-ink);background:var(--mf-surface-0);border:1px solid var(--mf-line);border-radius:var(--mf-radius-field);padding:8px 10px;margin:0 0 var(--mf-space-10)}