/* ==========================================================================
   Folio authoring surfaces — theme tokens
   --------------------------------------------------------------------------
   Light mode was built for Folio's front door (StudioDashboard, NewBookWizard)
   and stopped at the door of the app itself. BookWorkspace, BookReader,
   ChapterEditor, OutlinePanel and the export/publish dialogs each carried
   40-70 hardcoded dark colours and zero CSS variables, so turning on light mode
   lit up the dashboard and left the screen an author actually works in as dark
   navy — with dialogs to match.

   These tokens are that missing layer. The DARK values are byte-identical to
   the colours those files already hardcoded, including the cyan accent: this is
   a theming fix, not a rebrand. (Folio's brand primary is indigo #6366f1 and
   the workspace's cyan predates the product themes — worth reconciling, but not
   inside a change whose job is to make light mode work.)

   Declared on :root so every Folio surface reads the same names. NewBookWizard
   and StudioDashboard keep their own --folio-studio-* block scoped to
   .gixo-studio; the names and values agree, so the more specific one simply
   wins inside the wizard.
   ========================================================================== */

:root {
  /* Surfaces */
  --folio-ws-panel: #111827;
  --folio-ws-panel-soft: rgba(17, 24, 39, 0.6);
  --folio-ws-panel-raised: rgba(17, 24, 39, 0.8);
  --folio-ws-overlay: rgba(15, 15, 30, 0.9);

  /* Text */
  --folio-ws-heading: #f9fafb;
  --folio-ws-text: #e5e7eb;
  --folio-ws-muted: #9ca3af;
  --folio-ws-subtle: #6b7280;

  /* Accent — the workspace's long-standing cyan */
  --folio-ws-accent: #00d9ff;
  --folio-ws-border: rgba(0, 217, 255, 0.15);
  --folio-ws-border-strong: rgba(0, 217, 255, 0.3);
  --folio-ws-tint: rgba(0, 217, 255, 0.1);
  --folio-ws-tint-strong: rgba(0, 217, 255, 0.2);

  /* Status */
  --folio-ws-success: #10b981;
  --folio-ws-warning: #fbbf24;
  --folio-reader-bg: #0a0a14;
  --folio-reader-text: #e5e7eb;
  --folio-reader-heading: #f9fafb;
  --folio-reader-rule: rgba(0, 217, 255, 0.1);
}

html[data-theme="light"] {
  --folio-ws-panel: #ffffff;
  --folio-ws-panel-soft: rgba(255, 255, 255, 0.92);
  --folio-ws-panel-raised: #ffffff;
  --folio-ws-overlay: rgba(248, 250, 252, 0.92);

  --folio-ws-heading: #0f172a;
  --folio-ws-text: #1e293b;
  --folio-ws-muted: #475569;   /* slate-600, AA on white */
  --folio-ws-subtle: #64748b;

  /* Cyan at #00d9ff is 1.6:1 on white — unreadable. The light accent is the
     same hue taken to a tone that passes AA for text and borders. */
  --folio-ws-accent: #0e7490;  /* cyan-700, 5.36:1 on white */
  --folio-ws-border: rgba(15, 23, 42, 0.12);
  --folio-ws-border-strong: rgba(14, 116, 144, 0.45);
  --folio-ws-tint: rgba(14, 116, 144, 0.08);
  --folio-ws-tint-strong: rgba(14, 116, 144, 0.16);

  --folio-ws-success: #047857;
  --folio-ws-warning: #b45309;
  --folio-reader-bg: #f8fafc;
  --folio-reader-text: #1f2937;
  --folio-reader-heading: #0f172a;
  --folio-reader-rule: rgba(15, 23, 42, 0.12);
}

/* ==========================================================================
   Reader modes. The reader is where an author proofreads tens of thousands of
   words, and it offered font-bigger/font-smaller and nothing else — no light,
   no sepia, no serif — on a hardcoded #0a0a14 with cyan chapter numbers.

   These are set per reader via data-reading-mode, independent of the app theme:
   someone who works in dark mode may still want to proofread on paper.
   ========================================================================== */

[data-reading-mode="light"] {
  --folio-reader-bg: #f3f4f6;
  --folio-reader-text: #1f2937;
  --folio-reader-heading: #0f172a;
  --folio-reader-rule: rgba(15, 23, 42, 0.12);
}

[data-reading-mode="sepia"] {
  --folio-reader-bg: #efe6d5;
  --folio-reader-text: #43382a;
  --folio-reader-heading: #2d251a;
  --folio-reader-rule: rgba(67, 56, 42, 0.18);
}

[data-reading-mode="dark"] {
  --folio-reader-bg: #0a0a14;
  --folio-reader-text: #e5e7eb;
  --folio-reader-heading: #f9fafb;
  --folio-reader-rule: rgba(0, 217, 255, 0.1);
}

/* Chapter prose has always been Georgia, and stays that way by default — this is a
   theming change, not a typography one. The toggle offers the other direction for
   authors who prefer to proofread in a sans face. */
[data-reading-face="sans"] .chapter-body {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* Author studio dialogs use the Folio route stylesheet; the app does not load the
   global Razor isolation bundle. Keep all rules within this product surface. */
.folio-author-studio { max-width: 72rem; overflow-wrap: anywhere; }
.folio-author-studio .folio-studio-modes, .folio-author-studio .folio-studio-actions { display: flex; gap: .6rem; flex-wrap: wrap; margin: .8rem 0; }
.folio-author-studio .folio-structure-grid { display: grid; grid-template-columns: minmax(15rem, 1fr) minmax(18rem, 1.5fr); gap: 1.5rem; }
.folio-author-studio label { display: block; margin: .85rem 0; }
.folio-author-studio input:not([type=checkbox]):not(.mud-input-slot), .folio-author-studio select, .folio-author-studio textarea { display: block; width: 100%; min-width: 0; border: 1px solid var(--mud-palette-divider); background: var(--mud-palette-surface); color: var(--mud-palette-text-primary); padding: .65rem; border-radius: .35rem; }
.folio-author-studio textarea { min-height: 6rem; resize: vertical; }
.folio-author-studio input[type=checkbox] { margin-right: .5rem; }
.folio-author-studio button:where(:not(.mud-button-root):not(.mud-icon-button)) { border: 1px solid var(--mud-palette-divider); margin: .25rem 0; padding: .65rem .85rem; border-radius: .35rem; background: var(--mud-palette-surface); color: var(--mud-palette-text-primary); cursor: pointer; min-height: 44px; }
.folio-author-studio button[aria-pressed=true] { border-color: var(--mud-palette-primary); background: var(--mud-palette-primary-hover); font-weight: 700; }
.folio-author-studio button:disabled { opacity: .5; cursor: wait; }
.folio-author-studio :is(button, summary, input, textarea, select):focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 2px; }
.folio-author-studio details { border-bottom: 1px solid var(--mud-palette-divider); padding: .7rem 0; }
.folio-author-studio summary { cursor: pointer; padding: .3rem 0; }
.folio-author-studio fieldset { padding: .5rem; margin: .6rem 0; max-height: 16rem; overflow: auto; }
.folio-author-studio blockquote { border-left: 3px solid var(--mud-palette-primary); margin: .6rem 0; padding: .6rem; white-space: pre-wrap; }
.folio-author-studio .folio-blocks { max-height: 20rem; overflow: auto; border: 1px solid var(--mud-palette-divider); padding: .5rem; }
.folio-author-studio .folio-source-text { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 28rem; overflow: auto; }
.folio-author-studio img { max-width: 100%; height: auto; }
.folio-author-studio h3 { font-size: 1.1rem; margin: 1.2rem 0 .65rem; }
.folio-author-studio ul { padding-left: 1.4rem; }
.folio-author-studio p { margin: .6rem 0; }
@media (max-width: 700px) { .folio-author-studio .folio-structure-grid { grid-template-columns: minmax(0, 1fr); } }

/* Writing workspace: one manuscript, with persistent contextual tools. */
.gixo-studio.studio-workspace-container { padding-top: var(--gixo-shell-appbar-height, 72px); background: var(--folio-ws-panel); }
.studio-workspace-container .workspace-header { gap: 1rem; padding: .6rem 1rem; }
.studio-workspace-container .workspace-title { flex: 1; gap: .4rem; }
.studio-workspace-container .workspace-title h1 { max-width: none; font-size: 1.08rem; }
.studio-workspace-container .workspace-actions { flex: 0 0 auto; gap: .35rem; flex-wrap: nowrap; }
.folio-save-state { color: var(--folio-ws-muted); font-size: .8rem; white-space: nowrap; }
.studio-workspace-container .workspace-mobile-strip { padding: .15rem .75rem; }
.studio-workspace-container .workspace-mobile-strip .mud-button-root { flex-basis: auto; min-height: 44px; }
.studio-workspace-container .chapter-panel { background: var(--folio-ws-panel); }
.studio-workspace-container .chapter-header.folio-chapter-context { padding: .5rem 1.25rem; border-bottom: 1px solid var(--folio-ws-border); }
.folio-chapter-context > summary { cursor: pointer; color: var(--folio-ws-muted); font-size: .82rem; }
.folio-chapter-context > summary span { margin-left: .7rem; }
.studio-workspace-container .chapter-editor-content { padding: .5rem 1rem 1rem; }
.studio-workspace-container .chapter-editor-header { padding: .7rem 1rem; }
.studio-workspace-container .outline-panel { width: 17rem; flex-shrink: 0; align-self: flex-start; top: 8rem; }
.studio-workspace-container .outline-panel.collapsed { width: 60px; }
.folio-with-tools .outline-panel { display: none; }
/* FOL-U5: Parts and scenes works on the chapter open in the manuscript, chosen in the outline rail, so the
   rail stays beside Publisher tools on a desktop. Check my book keeps the wider manuscript. */
.folio-with-tools.folio-with-publisher-tools .outline-panel { display: flex; }
.folio-with-tools.folio-focus .chapter-panel { max-width: none; }
.folio-author-pane { flex: 0 0 clamp(24rem, 42vw, 38rem); min-width: 0; align-self: flex-start; position: sticky; top: calc(var(--mud-appbar-height, 64px) + 4rem); max-height: calc(100dvh - var(--mud-appbar-height, 64px) - 4rem); border-left: 1px solid var(--folio-ws-border-strong); background: var(--folio-ws-panel); z-index: 105; }
.folio-author-pane[hidden], .folio-tool[hidden], .folio-author-studio [hidden] { display: none !important; }
.folio-author-studio { width: 100%; max-width: none; display: flex; flex-direction: column; max-height: inherit; color: var(--folio-ws-text); font-size: .9rem; }
.folio-tool-header { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .8rem 1rem .4rem; }
.folio-tool-header h2 { font-size: 1.2rem; margin: 0; font-weight: 650; }
.folio-eyebrow { color: var(--folio-ws-muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .07em; }
.folio-author-studio .folio-return { font-size: .75rem; padding: .45rem .55rem; }
.folio-tool-navigation { padding: 0 1rem; border-bottom: 1px solid var(--folio-ws-border); }
.folio-author-studio .folio-studio-modes { flex-wrap: wrap; gap: .3rem; margin: .3rem 0 .6rem; }
.folio-author-studio .folio-studio-modes button { flex: 1; font-size: .75rem; padding: .45rem .5rem; white-space: nowrap; }
.folio-tool-picker { display: flex; align-items: center; gap: .6rem; margin: .5rem 0; font-size: .8rem; }
.folio-tool-picker select { flex: 1; min-height: 40px; }
.folio-tool-body { overflow-y: auto; min-height: 0; padding: .65rem 1rem 1.5rem; overscroll-behavior: contain; }
.folio-author-studio .folio-tool-fields { border: 0; padding: 0; margin: 0; max-height: none; overflow: visible; min-width: 0; }
.folio-author-studio .folio-draft-hint, .folio-author-studio .folio-draft-status { font-size: .75rem; color: var(--folio-ws-muted); }
.folio-author-studio .folio-primary { color: var(--folio-ws-panel); background: var(--folio-ws-accent); border-color: var(--folio-ws-accent); font-weight: 650; }
.folio-author-studio .folio-passage { display: flex; flex-direction: column; text-align: left; width: 100%; gap: .2rem; }
.folio-passage small { font-size: .7rem; color: var(--folio-ws-muted); }
.folio-author-studio .folio-selection-preview { background: var(--folio-ws-panel-soft); padding: .7rem; }
.folio-author-studio .folio-empty-state { border: 1px solid var(--folio-ws-border-strong); border-radius: .6rem; padding: 1rem; background: var(--folio-ws-tint); }
.folio-publish-progress { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); list-style: none; gap: .45rem; padding: 0 !important; counter-reset: publish; }
.folio-publish-progress li { padding: .5rem; border-radius: .4rem; background: var(--folio-ws-panel-soft); font-size: .8rem; border: 1px solid var(--folio-ws-border); }
.folio-publish-progress li::before { counter-increment: publish; content: counter(publish) '. '; color: var(--folio-ws-muted); }
.folio-publish-progress li[data-complete=true] { border-color: var(--folio-ws-success); }
.folio-reference-import { padding: 1rem; border: 1px dashed var(--folio-ws-border-strong); border-radius: .6rem; }
.folio-reference-card { padding: .7rem; border: 1px solid var(--folio-ws-border); border-radius: .5rem; margin: .5rem 0; }
.folio-author-studio .workspace-editions-band { padding: 0; background: transparent; }
.folio-author-studio .workspace-editions-inner { padding: 0; }
.folio-author-studio .workspace-edition-toolbar { flex-wrap: wrap; }
::highlight(folio-evidence) { background: #fde68a; color: #172033; }
@media (max-width: 960px) {
  .studio-workspace-container .workspace-header { position: static; flex-wrap: wrap; padding: .4rem .75rem; gap: .1rem; }
  .studio-workspace-container .workspace-title { flex-basis: 100%; }
  .studio-workspace-container .workspace-title h1 { font-size: 1rem; white-space: normal; line-height: 1.3; overflow: visible; }
  .studio-workspace-container .workspace-actions { margin-left: auto; }
  .folio-author-pane { position: fixed; top: var(--gixo-shell-appbar-height, 56px); bottom: 0; left: 0; right: 0; height: calc(100dvh - var(--gixo-shell-appbar-height, 56px)); max-height: calc(100dvh - var(--gixo-shell-appbar-height, 56px)); width: 100%; z-index: 145; border: 0; }
  .folio-author-studio { height: 100%; max-height: 100%; min-height: 0; }
  .folio-author-studio .folio-studio-modes { display: none; }
  .folio-tool-picker { display: flex !important; align-items: center; gap: .6rem; margin: .5rem 0 !important; font-size: .8rem; }
  .folio-tool-picker select { flex: 1; }
  .folio-tool-header { padding: .6rem 1rem .2rem; }
  .folio-tool-body { padding-top: .4rem; }
  .studio-workspace-container .chapter-editor-content { padding: .35rem .5rem; }
  .studio-workspace-container .chapter-header.folio-chapter-context { padding: .4rem 1rem; }
  .folio-chapter-context > summary span { display: none; }
  .studio-workspace-container .chapter-editor-mobile-actions { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .25rem; }
  .studio-workspace-container .chapter-editor-mobile-actions .mud-button-root { min-width: 0; font-size: .7rem; padding: .35rem .15rem; min-height: 44px; }
  .studio-workspace-container .chapter-editor-mobile-actions .mud-button-icon-start { display: none; }
}
.studio-workspace-container .workspace-header { top: var(--gixo-shell-appbar-height, 72px); }
.folio-author-studio .source-picker-card, .folio-author-studio .source-summary-card, .folio-author-studio .source-recent-item { background: var(--folio-ws-panel-soft); color: var(--folio-ws-text); }
[data-testid=folio-create-wizard] .text-gradient { font-size: 2.1rem !important; line-height: 1.2; }
[data-testid=folio-create-wizard] .studio-stepper-wrapper { padding: .7rem 0; margin: .8rem 0 1rem; }
[data-testid=folio-create-wizard] .studio-custom-stepper { justify-content: flex-start; gap: .5rem; }
[data-testid=folio-create-wizard] .studio-custom-stepper button { min-height: 44px; padding: .65rem 1rem; border: 1px solid var(--folio-ws-border); font: inherit; cursor: pointer; color: var(--folio-studio-text); }
[data-testid=folio-create-wizard] .studio-custom-stepper button:disabled { cursor: default; opacity: .6; }
[data-testid=folio-create-wizard] .studio-custom-stepper button:focus-visible { outline: 2px solid var(--folio-ws-accent); outline-offset: 2px; }
.folio-step-summary, .folio-step-progress { display: none; }
.folio-plan-options > summary { cursor: pointer; color: var(--folio-studio-muted); padding: .65rem 0; }
.folio-planner-note { color: var(--folio-studio-muted); font-size: .8rem; margin-top: .8rem; }
@media(max-width: 700px) {
  [data-testid=folio-create-wizard] > .mud-container { padding: 1rem .5rem !important; }
  [data-testid=folio-create-wizard] .studio-gradient-primary { padding: 1rem !important; }
  [data-testid=folio-create-wizard] .text-gradient { font-size: 1.7rem !important; }
  [data-testid=folio-create-wizard] .studio-custom-stepper { display: none; }
  [data-testid=folio-create-wizard] .folio-step-summary { display: block; color: var(--folio-studio-text); font-size: .85rem; }
  [data-testid=folio-create-wizard] .folio-step-progress { display: block; width: 100%; height: .35rem; margin-top: .65rem; accent-color: var(--folio-ws-accent); }
  [data-testid=folio-create-wizard] .studio-stepper-wrapper { margin: .25rem 0 .7rem; }
}
.folio-author-studio button:disabled { cursor: not-allowed; }
.folio-author-studio :is(input:not([type=checkbox]):not(.mud-input-slot),select) { min-height: 44px; }

.folio-tool-header, .folio-tool-navigation { flex-shrink: 0; }
.folio-author-studio .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Folio routes load this sheet directly; the application scoped bundle is landing-only. */
.folio-book-worklist { min-width: 0; }
.folio-book-worklist .folio-worklist-filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: .75rem; margin-block: 1rem; }
.folio-book-worklist .folio-worklist-filters label { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.folio-book-worklist .folio-worklist-filters input, .folio-book-worklist .folio-worklist-filters select { width: 100%; min-width: 0; }
.folio-book-worklist article { border: 1px solid var(--mud-palette-lines-default, #d1d5db); border-radius: .5rem; padding: 1rem; margin-block: .75rem; overflow-wrap: anywhere; }
.folio-book-worklist article h4 { margin-top: 0; }
.folio-book-worklist article blockquote { margin-inline: 0; padding-inline-start: .75rem; border-inline-start: 3px solid var(--mud-palette-lines-default, #d1d5db); white-space: pre-wrap; }
.folio-book-worklist article button { margin: .25rem .5rem .25rem 0; }

.folio-with-tools .chapter-editor-header-row { flex-wrap: wrap; }
.folio-with-tools .chapter-editor-title-row { flex-wrap: wrap; min-width: 0; }
.folio-with-tools .chapter-editor-header-actions { margin-left: auto; flex-shrink: 0; }
.folio-publish-progress li[data-complete=true]::before { content: "✓ "; color: var(--folio-ws-success); }

.folio-author-studio .folio-passage > * { align-self: stretch; text-align: left; }

/* Separate manuscript completion, editorial review and exact-file proof state. */
.folio-readiness-summary { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem 1rem; padding:.35rem 1rem; font-size:.78rem; background:var(--folio-ws-panel); color:var(--folio-ws-muted); }
.folio-readiness-summary button { padding:.3rem .4rem; min-height:36px; border:0; border-radius:.35rem; background:transparent; color:var(--folio-ws-heading); font:inherit; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.folio-readiness-summary button:focus-visible { outline:2px solid var(--folio-ws-accent); outline-offset:2px; }
.studio-workspace-container .workspace-title h1 { margin:0; font-weight:650; line-height:1.3; }
@media(max-width:700px) { .folio-readiness-summary { gap:.1rem .55rem; padding:.15rem .75rem; } .folio-readiness-summary button { min-height:44px; } }

/* ==========================================================================
   UI review, 2026-10-19 (Folio).
   ========================================================================== */

/* FOL-U3: the one line a primary action shows when a click finds something missing. */
.folio-next-hint, .folio-missing-hint { color: var(--folio-ws-warning); font-size: .875rem; line-height: 1.4; margin: .5rem 0 0; }
.folio-next-hint:focus, .folio-missing-hint:focus, .folio-export-blockers:focus, .folio-export-failure:focus { outline: none; }
.edition-missing-hint { color: var(--mud-palette-warning); font-size: .875rem; margin: 0 0 .75rem; }
.language-selection-section:focus { outline: none; }

/* FOL-U13: a failed export says so inside the dialog, above its settings. */
.folio-export-failure { border: 1px solid var(--mud-palette-error); border-radius: .5rem; padding: .75rem 1rem; color: var(--mud-palette-text-primary); background: var(--mud-palette-surface); }

/* FOL-U16: the audiobook and translation editions as two cards. */
.folio-edition-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: 1rem; }
.folio-edition-card { border: 1px solid var(--folio-ws-border-strong); border-radius: .6rem; padding: 1rem; background: var(--folio-ws-panel-soft); min-width: 0; }
.folio-edition-card-head { display: flex; gap: .75rem; align-items: flex-start; margin-bottom: .75rem; }
.folio-edition-card-icon { color: var(--folio-ws-accent); font-size: 2rem; flex-shrink: 0; }
.folio-edition-card h3.workspace-edition-title { margin: 0 0 .25rem; font-size: 1rem; }
.folio-edition-card-copy { color: var(--folio-ws-muted); font-size: .85rem; margin: 0; }
.folio-edition-card .editions-panel { margin-top: 1rem; }
.folio-edition-card .audiobook-editions-list { margin-top: 1rem; }

/* FOL-U19: the readiness line carries the book's kind and the drafting capacity. */
.folio-readiness-summary .folio-readiness-kind { color: var(--folio-ws-heading); font-weight: 650; }
.folio-readiness-summary .folio-readiness-capacity { margin-left: auto; }

/* FOL-U22: the floating Support tab covered right-edge controls in the workspace and the reader.
   Support stays in the navigation drawer and the account menu there. */
body:has(.studio-workspace-container, [data-testid=folio-reader]) .support-launcher-tab { display: none; }
/* FOL-N17 (UX deep dive, 2026-10-23): on a phone the tab also covered the new-book wizard's text. */
@media (max-width: 600px) {
  body:has([data-testid=folio-create-wizard]) .support-launcher-tab { display: none; }
}

/* FOL-U22: the reader's key hint shows for a few seconds, then fades and stops taking clicks. */
.folio-reader-hint { animation: folio-reader-hint-fade .6s ease 6s forwards; }
@keyframes folio-reader-hint-fade { to { opacity: 0; visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .folio-reader-hint { animation-duration: .01s; } }

/* FOL-U9: the Story Bible dialog is the one editor; an entry's review state and chapters sit in its details. */
.story-bible-entry { margin-bottom: .75rem; }
.story-bible-entry-row { display: flex; gap: 8px; align-items: flex-start; }
.story-bible-review { margin: .25rem 0 0; }
.story-bible-review > summary { cursor: pointer; font-size: .85rem; color: var(--mud-palette-text-secondary); }
.story-bible-review-body { display: grid; gap: .5rem; margin-top: .5rem; padding: .5rem 0 .5rem .75rem; border-left: 2px solid var(--mud-palette-lines-default); }
.story-bible-review-body p { margin: 0; font-size: .85rem; }
.story-bible-review-body blockquote { margin: 0; padding-left: .75rem; border-left: 2px solid var(--mud-palette-primary); font-style: italic; }
.story-bible-review-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: .5rem; }
.story-bible-review-body label { display: grid; gap: .25rem; font-size: .8rem; color: var(--mud-palette-text-secondary); }
.story-bible-review-body :is(select, input, textarea) { font: inherit; font-size: .875rem; color: var(--mud-palette-text-primary); background: var(--mud-palette-surface); border: 1px solid var(--mud-palette-lines-default); border-radius: .375rem; padding: .375rem .5rem; min-width: 0; }
.story-bible-review-body textarea { min-height: 3.5rem; resize: vertical; }
.story-bible-review-body :is(select, input, textarea):focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 1px; }
.story-bible-review-stale { color: var(--mud-palette-warning); }
.story-bible-review-missing { color: var(--mud-palette-error); }
.story-bible-review-status:empty { display: none; }
.story-bible-history ul { margin: .25rem 0 0; padding-left: 1.25rem; font-size: .8rem; color: var(--mud-palette-text-secondary); }

/* FOL-U10: the kind question in the blank-book and import dialogs. */
.folio-kind-picker { display: grid; gap: .5rem; }
.folio-kind-question { margin: 0; font-weight: 600; color: var(--mud-palette-text-primary); }
.folio-kind-optional { margin-left: .35rem; font-weight: 400; font-size: .8rem; color: var(--mud-palette-text-secondary); }
.folio-kind-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.folio-kind-option { display: flex; flex-direction: column; align-items: center; gap: .25rem; min-width: 0; padding: .6rem .4rem; border: 1px solid var(--mud-palette-lines-default); border-radius: .5rem; background: transparent; color: var(--mud-palette-text-primary); font: inherit; text-align: center; cursor: pointer; }
.folio-kind-option:hover { border-color: var(--mud-palette-primary); }
.folio-kind-option[aria-pressed=true] { border-color: var(--mud-palette-primary); box-shadow: inset 0 0 0 1px var(--mud-palette-primary); }
.folio-kind-option:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 2px; }
.folio-kind-page { color: var(--mud-palette-text-secondary); line-height: 0; }
.folio-kind-option[aria-pressed=true] .folio-kind-page { color: var(--mud-palette-primary); }
.folio-kind-page svg { width: 2.5rem; height: 3.25rem; }
.folio-kind-name { font-weight: 600; font-size: .9rem; }
.folio-kind-hint, .folio-kind-note { font-size: .75rem; color: var(--mud-palette-text-secondary); }
.folio-kind-note { margin: 0; }

/* FOL-U22: a workspace menu's items sit in one focus wrapper; it keeps MudMenu's divider spacing and draws no ring itself. */
.folio-menu-focus { outline: none; }
.folio-menu-focus > .mud-divider { margin: 4px 0; }

/* UI review rest: folio (FOL-U5, FOL-U21) */
.folio-tool-navigation { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.folio-tool-navigation .folio-tool-picker { flex: 1 1 14rem; }
.folio-author-studio .folio-back-to-check { font-size: .75rem; padding: .45rem .6rem; }
.folio-author-studio .folio-open-chapter { color: var(--folio-ws-muted); font-size: .8rem; margin: 0 0 .6rem; }
.folio-check-my-book { display: flex; flex-direction: column; gap: .6rem; }
.folio-check-my-book > .folio-primary { align-self: flex-start; min-height: 44px; padding: .55rem 1rem; }
.folio-check-intro, .folio-check-note { color: var(--folio-ws-muted); font-size: .82rem; margin: 0; }
.folio-check-status { margin: 0; font-size: .85rem; }
.folio-check-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .6rem; }
.folio-check-item { padding: .7rem .8rem; border: 1px solid var(--folio-ws-border); border-radius: .5rem; background: var(--folio-ws-panel-soft); display: flex; flex-direction: column; gap: .3rem; }
.folio-check-item p { margin: 0; }
.folio-check-meta { color: var(--folio-ws-muted); font-size: .75rem; }
.folio-check-item blockquote { margin: 0; padding-left: .7rem; border-left: 3px solid var(--folio-ws-border-strong); color: var(--folio-ws-muted); }
.folio-check-item button { align-self: flex-start; }
.folio-book-worklist { margin-top: .6rem; padding-top: .6rem; border-top: 1px solid var(--folio-ws-border); }
.folio-book-worklist h3 { font-size: .95rem; margin: 0 0 .3rem; }
.studio-workspace-container .folio-mobile-bar { flex-wrap: nowrap; align-items: center; gap: .25rem; padding: .15rem .5rem; border-bottom: 1px solid var(--folio-ws-border); background: var(--folio-ws-panel); }
.studio-workspace-container .folio-mobile-bar .mud-button-root { flex: 0 0 auto; min-height: 44px; }
.folio-mobile-progress { margin-right: auto; font-size: .8rem; color: var(--folio-ws-muted); white-space: nowrap; }