/* VF-APP-01 1.1: one Field Command finish for the shipped interface.
   Workspace layouts, authored images, data and handlers remain authoritative. */
html.vf-interface[data-vf-theme-scope=interface],
html.vf-interface[data-vf-theme-scope=interface] body {
  --vf-bg:#080f18; --vf-rail:#0c1722; --vf-surface:#122330;
  --vf-surface-raised:#192e3d; --vf-line:#385266; --vf-text:#eaf3f7;
  --vf-muted:#afc3d0; --vf-gold:#89e6dc; --vf-teal:#89e6dc;
  --vf-danger:#ffc0b4; --vf-radius:12px; --vf-shadow:0 10px 28px #0003;
  --vf-body-font:system-ui,'Segoe UI',sans-serif;
  --vf-display-font:var(--vf-body-font);
  color-scheme:dark; background:var(--vf-bg);
}
html.vf-interface[data-vf-theme-scope=interface] body {
  --bg:var(--vf-bg); --rail:var(--vf-rail); --panel:var(--vf-surface);
  --surface:var(--vf-surface); --surface-raised:var(--vf-surface-raised);
  --line:var(--vf-line); --border:var(--vf-line); --text:var(--vf-text);
  --ink:var(--vf-text); --muted:var(--vf-muted); --accent:var(--vf-teal);
  --orange:var(--vf-teal); --gold:var(--vf-teal); --cyan:var(--vf-teal);
  --mint:#b8f3ec;
  background:var(--vf-bg); color:var(--vf-text);
  font:15px/1.55 var(--vf-body-font); accent-color:var(--vf-teal);
}
html.vf-interface[data-vf-theme-scope=interface] body * { box-sizing:border-box; }
html.vf-interface[data-vf-theme-scope=interface] body :is(h1,h2,h3,h4,h5) {
  color:var(--vf-text); font-family:var(--vf-body-font); font-weight:650;
  line-height:1.2; letter-spacing:-.025em; text-wrap:balance;
}
html.vf-interface[data-vf-theme-scope=interface] body h1 { font-size:clamp(28px,3vw,42px); }
html.vf-interface[data-vf-theme-scope=interface] body :is(p,li,dd) { line-height:1.6; }
html.vf-interface[data-vf-theme-scope=interface] body :is(small,.muted,.hint,.lede,.section-help,.quiet,.save-state) { color:var(--vf-muted); }
html.vf-interface[data-vf-theme-scope=interface] body :is(a,summary) { color:var(--mint); }
html.vf-interface[data-vf-theme-scope=interface] body :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible {
  outline:3px solid var(--vf-teal); outline-offset:3px;
}
html.vf-interface[data-vf-theme-scope=interface] body :is(button,.button,.button-link,.play-link,.import,a.create) {
  font:600 14px/1.4 var(--vf-body-font); min-height:42px; border:1px solid #4c6b80;
  border-radius:8px; background:#173143; color:var(--vf-text);
  box-shadow:none; transition:background-color .14s,border-color .14s;
}
html.vf-interface[data-vf-theme-scope=interface] body :is(button,.button,.button-link,.play-link,.import,a.create):not(:disabled):hover {
  background:#214454; border-color:var(--vf-teal);
}
html.vf-interface[data-vf-theme-scope=interface] body :is(button.primary,a.primary,.primary-button,.button-link.primary,button.save,a.create,.empty button,.approve) {
  background:var(--vf-teal); color:#09262b; border-color:var(--vf-teal); font-weight:700;
}
html.vf-interface[data-vf-theme-scope=interface] body :is(button.primary,a.primary,.primary-button,.button-link.primary,button.save,a.create,.empty button,.approve):not(:disabled):hover {
  background:#b8f3ec; color:#09262b;
}
html.vf-interface[data-vf-theme-scope=interface] body :is(button.selected,button.active,button[aria-pressed=true],a[aria-current=page]) {
  background:#1b3d49; border-color:var(--vf-teal); color:#effefb; box-shadow:inset 3px 0 var(--vf-teal);
}
html.vf-interface[data-vf-theme-scope=interface] body :is(button.primary,button.active,button.selected,button[aria-pressed=true],a.primary) :is(span,small,strong,b) { color:inherit; }
html.vf-interface[data-vf-theme-scope=interface] body :is(button,input,select,textarea):disabled {
  opacity:.62; cursor:not-allowed; box-shadow:none;
}
html.vf-interface[data-vf-theme-scope=interface] body :is(input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=range]):not([type=file]),select,textarea) {
  background:#0b1c29; color:var(--vf-text); border:1px solid #52748a;
  border-radius:8px; font:inherit; line-height:1.45; min-height:42px;
  max-width:100%; min-width:0;
}
html.vf-interface[data-vf-theme-scope=interface] body textarea { resize:vertical; }
html.vf-interface[data-vf-theme-scope=interface] body ::placeholder { color:#a7bac8; opacity:1; }
html.vf-interface[data-vf-theme-scope=interface] body :is(input[type=checkbox],input[type=radio],input[type=range]) { accent-color:var(--vf-teal); }
html.vf-interface[data-vf-theme-scope=interface] body :is(label,legend) { color:var(--vf-text); }
html.vf-interface[data-vf-theme-scope=interface] body fieldset { border-color:var(--vf-line); border-radius:10px; min-width:0; }
html.vf-interface[data-vf-theme-scope=interface] body :is(input,select,textarea)[aria-invalid=true] { border-color:#ffc0b4; box-shadow:0 0 0 1px #ffc0b4; }
html.vf-interface[data-vf-theme-scope=interface] body>header,
html.vf-interface[data-vf-theme-scope=interface] body :is(.topbar,.app-bar,.top,.workbench-top,.catalog-header) {
  background:var(--vf-rail); color:var(--vf-text); border-color:var(--vf-line);
}
html.vf-interface[data-vf-theme-scope=interface] body :is(.rail,.sidebar,.layout>aside,.workbench-modes,.article-list) {
  background:var(--vf-rail); border-color:var(--vf-line);
}
html.vf-interface[data-vf-theme-scope=interface] body :is(.card,.panel,.record-link,.article-reader,.library-tools,.step,.setup,.context-card,.assistant,.editor-panel,.preview-panel,.export-panel,.catalog-panel,.blueprint-panel,.connection-panel,.guided-intake,.opening-package,.foundation-choice-workspace,.mission-group-panel,.team-dashboard>section,.team-activity,.campaign-content,.campaign-choice,.equipment-card,.library-empty,.library-group,.quick-reference-panel,.table-alert,.mapping-workflow,.mapping-file,.customization-section,.character-banner,.glance-body) {
  background:var(--vf-surface); color:var(--vf-text); border-color:var(--vf-line); border-radius:var(--vf-radius);
}
html.vf-interface[data-vf-theme-scope=interface] body :is(.card,.equipment-card,.campaign-choice,.record-link,.home-launch,.home-feature) { box-shadow:var(--vf-shadow); }
html.vf-interface[data-vf-theme-scope=interface] body :is(.toolbar,.subnav,.workspace-tabs,.section-head,.panel-head,.panel-tools,.catalog-controls,.category-tabs,.stack-tabs,.record-tabs,.savebar,.readiness,.rule-notes,.item-facts,.power-card-facts,.power-card-fact-strip,.mission-status,.hotkeys) { border-color:var(--vf-line); }
html.vf-interface[data-vf-theme-scope=interface] body :is(.eyebrow,.brand,.mark,.section-head>p,.catalog-stat,.catalog-header small,.status-pill,.readiness-pill) { color:var(--vf-teal); }
html.vf-interface[data-vf-theme-scope=interface] body :is(.empty,.empty-state,.home-empty,.notice,.status-card,.foundry-card,.no-library,.library-empty) {
  background:#102534; border-color:#466779; border-radius:12px; color:#d4e5ed;
}
html.vf-interface[data-vf-theme-scope=interface] body :is(.error,.danger,button.danger,button[data-action=delete],[role=alert]) {
  color:var(--vf-danger); border-color:#bc8179;
}
html.vf-interface[data-vf-theme-scope=interface] body :is(button.danger,button[data-action=delete]):not(:disabled):hover { background:#452b30; border-color:#ffc0b4; }
html.vf-interface[data-vf-theme-scope=interface] body :is(.warning,.issues,.home-attention,.source-warning,.safety-note) { background:#30252b; color:#f7d8cb; border-color:#b78a79; border-radius:10px; }
html.vf-interface[data-vf-theme-scope=interface] body :is(.ok,.safe,.status-pill.approved,.validation.ok) { color:#a4edca; border-color:#588a78; }
html.vf-interface[data-vf-theme-scope=interface] body :is(dialog,.character-sheet-dialog,.equipment-catalog-dialog,.vehicle-catalog-dialog) {
  background:#10202d; color:var(--vf-text); border:1px solid #64879b; border-radius:16px;
  box-shadow:0 24px 80px #0009; max-width:calc(100vw - 32px); max-height:90dvh;
}
html.vf-interface[data-vf-theme-scope=interface] body dialog::backdrop { background:#030b14cf; backdrop-filter:blur(4px); }
html.vf-interface[data-vf-theme-scope=interface] body :is(th,td) { border-color:var(--vf-line); }
html.vf-interface[data-vf-theme-scope=interface] body th { background:#1a3040; color:var(--vf-text); text-align:left; }
html.vf-interface[data-vf-theme-scope=interface] body :is(code,pre,kbd) { overflow-wrap:anywhere; }
html.vf-interface[data-vf-theme-scope=interface] body kbd { border-color:#52748a; color:#c9dde7; background:#0c1a27; border-radius:4px; }
html.vf-interface[data-vf-theme-scope=interface] body #toast { background:#193848; border-color:#6ba8ae; color:#e4fff9; border-radius:10px; }
/* Editorial workspace panels, using their existing structures. */
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=adventure] :is(.mission-question,.guided-options,.opening,.blueprint,.truth-grid,.choice-row,.pressure-note-card,.briefing-block) { border-color:var(--vf-line); }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=adventure] :is(.guided-wizard-head,.guided-stage-track,.mission-header,.creature-toolbar,.scene-nav,.regeneration-bar) { background:var(--vf-rail); border-color:var(--vf-line); }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=adventure-matrix] :is(.card,.workbench-heading,.scene-meta,.scene-editor,.moment-card,.moment-editor,.details,.session-review,.handout-card,.media-card) { border-color:var(--vf-line); border-radius:12px; }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=adventure-matrix] :is(.workbench-heading,.scene-meta,.moment-editor,.session-review,.details) { background:var(--vf-surface); }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=content-workbench] :is(.power-card,.ability-workspace-card,.power-card-content,.power-card-description,.power-card-player-effect,.acquisition-forms,.augmentation-option) { background:var(--vf-surface); color:var(--vf-text); border-color:var(--vf-line); }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=content-workbench] :is(.power-card h2,.power-card h3,.power-card small,.power-card strong) { color:var(--vf-text); }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=equipment] :is(.weapon-facts,.armor-facts,.kit-components,.attachment-fit,.standard-facts,.fact-stack) { background:#10202d; border-color:var(--vf-line); }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=party-journal] :is(.team-channel,.team-vehicles,.team-roster,.team-activity,.truth) { background:var(--vf-surface); border-color:var(--vf-line); border-radius:12px; }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=characters] :is(.choice-detail,.creation-story,.lineage-nutshell,.lineage-card,.training-card,.review-section,.resource-card,.choice-card) { background:var(--vf-surface); border-color:var(--vf-line); }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=characters] .lineage-card.selected { background:#193b47; border-color:var(--vf-teal); }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=characters] .lineage-player-intro { background:#0c1e2c; border-color:#6eabae; }
html.vf-interface[data-vf-theme-scope=interface] body[data-veilfall-page=characters] .lineage-player-intro small { color:var(--vf-teal); }
/* Glitch's approved conversations stay a distinct quiet guidance surface. */
html.vf-interface[data-vf-theme-scope=interface] body :is(.glitch-stage-guide,.glitch-discovery,.creation-guide,.guided-coach) { border-color:#4c7483; border-radius:12px; }
html.vf-interface[data-vf-theme-scope=interface] body :is(.home-launch,.home-feature,.portrait-link):hover { transform:none; }
/* Tool chrome on customizable sheets. No color, portrait, meter or theme overrides. */
html.vf-interface[data-vf-theme-scope=sheet] body { font-family:system-ui,'Segoe UI',sans-serif; }
html.vf-interface[data-vf-theme-scope=sheet] body>header { background:#0c1722; border-color:#385266; padding:12px 24px; }
html.vf-interface[data-vf-theme-scope=sheet] body>header button { border-radius:8px; min-height:44px; }
html.vf-interface[data-vf-theme-scope=sheet] #device :is(button,input,select,textarea,h1,h2,h3) { font-family:system-ui,'Segoe UI',sans-serif; }
html.vf-interface[data-vf-theme-scope=sheet] #device :is(.glass,#panel) { border-radius:12px; }
html.vf-interface[data-vf-theme-scope=sheet] #device :is(.panel-head,.hotkeys,.theme-preview-controls) { gap:12px; }
html.vf-interface[data-vf-theme-scope=sheet] #device :is(button,input,select):focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
/* Narrow layouts retain every action; local workspace breakpoints own grids. */
@media(max-width:760px) {
  html.vf-interface[data-vf-theme-scope=interface] body { font-size:14px; }
  html.vf-interface[data-vf-theme-scope=interface] body>main { padding-inline:16px; }
  html.vf-interface[data-vf-theme-scope=interface] body>header { padding-inline:16px; gap:12px; }
  html.vf-interface[data-vf-theme-scope=interface] body :is(.toolbar,.top-actions,.actions,.dialog-actions,.savebar,.campaign-toolbar,.theme-transfer-actions,.catalog-controls) { flex-wrap:wrap; gap:10px; }
  html.vf-interface[data-vf-theme-scope=interface] body :is(.layout,.workspace,.grid,.record-grid,.library-layout)>* { min-width:0; }
  html.vf-interface[data-vf-theme-scope=interface] body :is(button,.button,.button-link,.play-link,.import,a.create,summary) { min-height:44px; }
  html.vf-interface[data-vf-theme-scope=interface] body dialog { max-height:88dvh; padding:20px; }
  html.vf-interface[data-vf-theme-scope=sheet] body>header { padding-inline:12px; gap:8px; flex-wrap:wrap; height:auto; }
}
@media(prefers-reduced-motion:reduce) {
  html.vf-interface body :is(button,a,summary,.card,.panel,.home-launch,.home-feature,dialog) { transition:none!important; animation:none!important; }
  html.vf-interface body dialog::backdrop { backdrop-filter:none; }
  html.vf-interface body { scroll-behavior:auto; }
}
@media(forced-colors:active) {
  html.vf-interface body :is(button,a,input,select,textarea,summary):focus-visible { outline:3px solid Highlight; }
  html.vf-interface body :is(button.selected,button[aria-pressed=true],a[aria-current=page]) { outline:2px solid Highlight; }
}

/* Native sheets inside the existing runtime host retain parent theme variables. */
html.vf-interface[data-vf-theme-scope=sheet] body[data-vf-sheet-workspace] :is(button,input,select,textarea,h1,h2,h3){font-family:system-ui,'Segoe UI',sans-serif}
html.vf-interface[data-vf-theme-scope=sheet] body[data-vf-sheet-workspace] :is(button,input,select,textarea){min-height:44px;border-radius:8px}
html.vf-interface[data-vf-theme-scope=sheet] body[data-vf-sheet-workspace] :is(button,input,select,textarea):focus-visible{outline:3px solid var(--runtime-accent,#89e6dc);outline-offset:3px}

/* Keep secondary steps readable and make file upload actions keyboard reachable. */
html.vf-interface[data-vf-theme-scope=interface] body{--faint:#9bb3c3;--panel2:var(--vf-surface-raised)}
html.vf-interface[data-vf-theme-scope=interface] body>header>strong{text-transform:none;letter-spacing:-.02em;font:650 20px/1.3 var(--vf-body-font)}
html.vf-interface[data-vf-theme-scope=interface] body :is(.grid>figure,.grid>article,body>article,main>article){background-color:var(--vf-surface);border-color:var(--vf-line);border-radius:12px}
html.vf-interface[data-vf-theme-scope=interface] body label.file{position:relative;background:var(--vf-teal);color:#09262b;border-color:var(--vf-teal);border-radius:8px;min-height:44px}
html.vf-interface[data-vf-theme-scope=interface] body :is(label.file,label.import)>input[type=file]{display:block;position:absolute;width:1px;height:1px;padding:0;border:0;clip-path:inset(50%);overflow:hidden}
html.vf-interface[data-vf-theme-scope=interface] body :is(label.file,label.import):focus-within{outline:3px solid var(--vf-teal);outline-offset:3px}
