/* ===================================================================
   Quest authoring canvas-first IA -- Phase 60.1 Plan 04.1
   QModal shell, QSection, RewardFields, QuestDetail layout, quest-editor chrome.
   =================================================================== */

/* ------------------------------------------------------------------
   Quest editor page layout (canvas-first, full-bleed)

   QuestDetail.razor uses `@layout QuestEditorLayout` -- the dedicated
   layout enforces `.quest-editor-main { height: calc(100vh - 64px) }`
   on MudMainContent, so child `height: 100%` resolves to the full
   viewport-minus-AppBar height. No MudContainer, no muni-community
   footer, no page-shell padding eating space below the canvas.
   ------------------------------------------------------------------ */

/* MudMainContent inside QuestEditorLayout: enforce a concrete height so
   the `.quest-detail { height: 100% }` child can claim it cleanly.
   64px = MudAppBar default height; padding-top of the same amount is
   inherited from .mud-main-content so total = 100vh. */
.quest-editor-main {
    height: 100vh;
    padding: 64px 0 0 !important;
    overflow: hidden;
}

.quest-detail {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

/* Breadcrumb strip above masthead */
.quest-breadcrumb {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 26px;
    background: var(--muni-paper);
    border-bottom: 1px solid color-mix(in srgb, var(--muni-ink) 15%, transparent);
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9.5px;
    color: var(--muni-ink-mute);
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

/* Masthead: title + state pill + dialog buttons + archive/publish */
.quest-masthead {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    row-gap: 14px;
    padding: 20px 26px 16px;
    background: var(--muni-paper);
    border-bottom: 1px solid var(--muni-ink);
    flex-wrap: wrap;
}

.quest-masthead__left {
    flex: 1 1 360px;
    min-width: 280px;
}

.quest-masthead__eyebrow {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
}

.quest-masthead__title {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-size: 30px;
    font-weight: 600;
    letter-spacing: -0.6px;
    color: var(--muni-ink);
    margin-top: 3px;
    display: flex;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
}

.quest-masthead__blurb {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 13.5px;
    color: var(--muni-ink-soft);
    margin-top: 5px;
    max-width: 560px;
}

.quest-masthead__right {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
    align-items: center;
    flex-wrap: wrap;
}

.quest-masthead__sep {
    width: 1px;
    height: 22px;
    background: var(--muni-ink);
    margin: 0 2px;
    align-self: center;
}

.quest-masthead__chip {
    margin-left: 7px;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 10%, transparent);
    border: 1px solid var(--mud-palette-primary);
    border-radius: 2px;
    padding: 0 5px;
    vertical-align: middle;
    display: inline-block;
}

/* Canvas toolbar strip */
.quest-toolbar {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 26px;
    background: var(--muni-paper-soft);
    border-bottom: 1px solid color-mix(in srgb, var(--muni-ink) 18%, transparent);
    flex-wrap: wrap;
}

.quest-toolbar__zoom-group {
    display: flex;
    align-items: center;
    gap: 6px;
}

.quest-toolbar__zoom-pct {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 11px;
    color: var(--muni-ink-soft);
    width: 44px;
    text-align: center;
}

.quest-toolbar__spacer { flex: 1; }

/* Read-only marker shown in place of "+ Add task" on a Published quest
   (rules + graph locked; narrative still editable via double-click). */
.quest-toolbar__readonly-note {
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--muni-ink-mute);
    white-space: nowrap;
}

/* Draft toolbar hint -- serif italic nudge that the per-task drawer opens on
   double-click and shapes itself to the task's trigger. Sits beside "+ New task". */
.quest-toolbar__hint {
    font-family: "Libre Caslon Text", Georgia, "Times New Roman", serif;
    font-style: italic;
    font-size: 12px;
    color: var(--muni-ink-mute);
    white-space: nowrap;
}

/* Focus toggle -- a labeled mono pill matching the toolbar vocabulary. Padding
   is symmetric (the F5 polish fix); the active state inverts to ink. */
.quest-toolbar__focus {
    cursor: pointer;
    height: 28px;
    padding: 0 14px;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--muni-ink) 22%, transparent);
    border-radius: 2px;
    color: var(--muni-ink-soft);
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    line-height: 1;
    white-space: nowrap;
}

.quest-toolbar__focus:hover { border-color: var(--muni-ink); background: color-mix(in srgb, var(--muni-ink) 5%, transparent); }
.quest-toolbar__focus--on { background: var(--muni-ink); border-color: var(--muni-ink); color: var(--muni-paper); }

.quest-toolbar__legend {
    display: flex;
    gap: 14px;
    align-items: center;
}

.quest-toolbar__legend-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
}

/* Canvas container: fills remaining vertical space. With the dedicated
   QuestEditorLayout enforcing parent height, flex-1 propagates cleanly
   without needing a min-height backstop. */
.quest-canvas-wrap {
    flex: 1 1 auto;
    min-height: 0;
    position: relative;
}

.quest-canvas-wrap .muni-canvas {
    height: 100%;
}

/* Footer status bar */
.quest-footer {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 26px;
    background: var(--muni-paper);
    border-top: 1px solid color-mix(in srgb, var(--muni-ink) 18%, transparent);
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9.5px;
    color: var(--muni-ink-mute);
    letter-spacing: 1px;
}

/* Focus mode: hide breadcrumb + masthead + toolbar + footer */
.quest-detail--focus .quest-breadcrumb,
.quest-detail--focus .quest-masthead,
.quest-detail--focus .quest-toolbar,
.quest-detail--focus .quest-footer {
    display: none !important;
}

/* Focus mode UAT 2026-05-30 round 3: AppBar STAYS visible (Nika: "focus
   appears on top of the header, which it should still show the
   'munibase' top bar"). Just hide the page chrome inside .quest-detail
   (already handled by the rules above) and the global MudDrawer
   (sidebar). The AppBar's 64px top stays via QuestEditorLayout's
   .quest-editor-main { padding: 64px 0 0 } default; .quest-detail lives
   in its normal flow below the AppBar and fills the rest of the
   viewport via flex. No position:fixed needed -- the canvas is already
   bounded correctly by the layout chain. */
body:has(.quest-detail--focus) .mud-drawer {
    display: none !important;
}

/* ------------------------------------------------------------------
   QModal shell (fixed overlay over canvas)
   ------------------------------------------------------------------ */

.qmodal__backdrop {
    position: fixed;
    inset: 0;
    background: rgba(20, 18, 12, 0.45);
    /* Above MudAppBar (1100) and MudDrawer (1200) so the modal + backdrop
       cover the global app chrome -- focused-task convention. UAT 2026-05-29:
       the bar paints over the modal title with z-index 200. 1400 matches
       MudDialog's default z-index. */
    z-index: 1400;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 44px 20px;
    overflow: auto;
}

.qmodal__panel {
    background: var(--muni-paper);
    border: 1px solid var(--muni-ink);
    box-shadow: 0 30px 80px -30px rgba(0, 0, 0, 0.6);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 88px);
    max-width: 100%;
}

.qmodal__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--muni-ink);
    flex-shrink: 0;
}

.qmodal__header-left { flex: 1; }

.qmodal__eyebrow {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
}

.qmodal__title {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    color: var(--muni-ink);
    margin-top: 2px;
}

/* Editable title in the header -- looks like .qmodal__title but is an input.
   Transparent, no chrome; a subtle ink underline appears on focus. */
.qmodal__title-input {
    width: 100%;
    margin-top: 2px;
    background: transparent;
    border: none;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    padding: 0 0 2px;
    font-family: "Libre Caslon Text", Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    color: var(--muni-ink);
    outline: none;
}

.qmodal__title-input::placeholder { color: var(--muni-ink-mute); }

.qmodal__title-input:focus { border-bottom-color: var(--muni-ink); }

.qmodal__header-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.qmodal__key-chip {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.8px;
    color: var(--muni-ink-soft);
    border: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    background: var(--muni-paper-soft);
    border-radius: 2px;
    padding: 4px 8px;
    cursor: help;
}

.qmodal__close {
    cursor: pointer;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    border-radius: 2px;
    color: var(--muni-ink-soft);
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 12px;
    padding: 5px 9px;
    line-height: 1;
}

.qmodal__close:hover {
    border-color: var(--muni-ink);
    background: color-mix(in srgb, var(--muni-ink) 6%, transparent);
}

/* ==================================================================
   Quest modal sections -- FAITHFUL port of the design handoff prototype's
   MSection / Seg / microLabel (handoff-design-v2/quest-editor.jsx lines
   4-45). The app's generic MuniSection renders flat hairline-rule
   sections; the prototype uses BORDERED CARDS with a paper-soft header
   band. This family reproduces the prototype structure verbatim for the
   per-task editor. Tokens: rule var(--muni-hair), paper var(--muni-paper), paperSoft var(--muni-paper-soft),
   ink var(--muni-ink), inkSoft var(--muni-ink-soft), inkMute var(--muni-ink-mute).
   ================================================================== */

.qmsection {
    border: 1px solid var(--muni-hair);
    background: var(--muni-paper);
    margin-bottom: 14px;
}

.qmsection__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 14px;
    background: var(--muni-paper-soft);
    border-bottom: 1px solid var(--muni-hair);
}

.qmsection__legend {
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--muni-ink);
}

.qmsection__legend-num {
    color: var(--muni-ink-mute);
    margin-right: 8px;
}

.qmsection__body {
    padding: 16px;
}

/* microLabel -- the small mono caps field label the prototype uses above
   each control (NOT the underline civic label). */
.qmicro {
    display: block;
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
    margin-bottom: 7px;
}

/* Segmented control -- prototype Seg: tight bordered inline group, mono
   caps, ink-fill active. Replaces the big civic buttons in the §A picker. */
.qseg {
    display: inline-flex;
    border: 1px solid var(--muni-hair);
    border-radius: 2px;
    overflow: hidden;
}

.qseg__btn {
    cursor: pointer;
    border: none;
    border-left: 1px solid var(--muni-hair);
    background: transparent;
    color: var(--muni-ink-soft);
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    padding: 6px 11px;
    line-height: 1.2;
}

.qseg__btn:first-child { border-left: none; }

.qseg__btn--on {
    background: var(--muni-ink);
    color: var(--muni-paper);
}

/* Fired-status badge -- prototype §A header right slot: dot + mono caption. */
.qfired {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    color: var(--muni-ink-mute);
    white-space: nowrap;
}

.qfired__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--muni-ink-mute);
    flex-shrink: 0;
}

.qfired--live .qfired__dot { background: var(--mud-palette-primary); }
.qfired--error .qfired__dot { background: var(--muni-stamp); }

/* LSL preview head -- microLabel left + COPY button right, on one row. */
.qlsl__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}

.qlsl__head .qmicro { margin-bottom: 0; }

.qlsl__copy {
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--muni-hair);
    border-radius: 2px;
    color: var(--muni-ink);
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 4px 9px;
    line-height: 1;
}

.qlsl__copy:hover { background: color-mix(in srgb, var(--muni-ink) 5%, transparent); }

/* LSL code block -- dark pre, prototype metrics. */
pre.qlsl__pre {
    margin: 0;
    background: #1a1a14;
    color: #e8e3d0;
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10.5px;
    line-height: 1.5;
    padding: 12px 14px;
    border-radius: 3px;
    overflow: auto;
    max-height: 200px;
    white-space: pre;
}

/* §B story description -- boxed serif textarea (prototype: bordered box,
   not the underline civic input). Hint stays underline civic. */
.qstory-text {
    width: 100%;
    min-height: 80px;
    resize: vertical;
    background: var(--muni-paper);
    border: 1px solid var(--muni-hair);
    border-radius: 2px;
    font-family: "Libre Caslon Text", Georgia, "Times New Roman", serif;
    font-size: 14px;
    line-height: 1.5;
    color: var(--muni-ink);
    padding: 8px 10px;
    outline: none;
    box-sizing: border-box;
}

.qstory-text:focus { border-color: var(--muni-ink); }

/* ------------------------------------------------------------------
   NodeRewardEditor -- compact per-task reward rows (amount + kind).
   Prototype row UX, NOT the full master-detail. Underline-civic inputs.
   ------------------------------------------------------------------ */
.noderwd {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.noderwd__row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.noderwd__amount {
    width: 90px;
    flex: 0 0 auto;
    background: transparent;
    border: none;
    border-bottom: 1.5px solid var(--muni-ink);
    border-radius: 0;
    padding: 4px 0;
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 14px;
    color: var(--muni-ink);
    outline: none;
    text-align: right;
}

.noderwd__kind {
    flex: 1 1 auto;
    min-width: 0;
    background: transparent;
    border: none;
    border-bottom: 1.5px solid var(--muni-ink);
    border-radius: 0;
    padding: 4px 0;
    font-family: "Libre Caslon Text", Georgia, "Times New Roman", serif;
    font-size: 15px;
    color: var(--muni-ink);
    outline: none;
}

/* Phase 60.2 Plan 07: status reward row -- match the civic underline vocabulary
   of .noderwd__amount / .noderwd__kind so the status pick + chance read as one
   row, not app-generic boxed inputs. */
.noderwd__statuspick {
    flex: 1 1 auto;
    min-width: 0;
    background: transparent;
    border: none;
    border-bottom: 1.5px solid var(--muni-ink);
    border-radius: 0;
    padding: 4px 0;
    font-family: "Libre Caslon Text", Georgia, "Times New Roman", serif;
    font-size: 15px;
    color: var(--muni-ink);
    outline: none;
}

.noderwd__chance {
    width: 56px;
    flex: 0 0 auto;
    background: transparent;
    border: none;
    border-bottom: 1.5px solid var(--muni-ink);
    border-radius: 0;
    padding: 4px 0;
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 14px;
    color: var(--muni-ink);
    outline: none;
    text-align: right;
    -moz-appearance: textfield;
    appearance: textfield;
}

.noderwd__chance::-webkit-outer-spin-button,
.noderwd__chance::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.noderwd__chance-label {
    flex: 0 0 auto;
    margin-left: -4px;
    font-family: "Libre Caslon Text", Georgia, "Times New Roman", serif;
    font-size: 14px;
    color: var(--muni-ink-mute);
}

/* Phase 60.2 Plan 07: section-A StatusChanged trigger picker selects. The raw
   <select> elements carried muni-input--civic, which only styles MudBlazor
   descendants and is a no-op on a plain select -- so they rendered app-generic.
   Apply the same civic underline vocabulary as the reward row + section-D pick. */
.qtrigselect {
    width: 100%;
    max-width: 340px;
    box-sizing: border-box;
    margin-top: 6px;
    background: transparent;
    border: none;
    border-bottom: 1.5px solid var(--muni-ink);
    border-radius: 0;
    padding: 4px 0;
    font-family: "Libre Caslon Text", Georgia, "Times New Roman", serif;
    font-size: 15px;
    color: var(--muni-ink);
    outline: none;
}

.qtrigselect:focus { border-bottom-color: var(--muni-ink); }

.noderwd__del {
    flex: 0 0 auto;
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--muni-stamp);
    border-radius: 2px;
    color: var(--muni-stamp);
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    padding: 5px 8px;
}

.noderwd__del:hover { background: color-mix(in srgb, var(--muni-stamp) 8%, transparent); }

.noderwd__foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 2px;
}

.noderwd__foot .qvoice { margin-top: 0; }

.noderwd__save {
    display: flex;
    justify-content: flex-end;
    margin-top: 6px;
}

/* §A trigger voice -- serif italic helper under the Seg. */
.qvoice {
    display: block;
    font-family: "Libre Caslon Text", Georgia, "Times New Roman", serif;
    font-style: italic;
    font-size: 12.5px;
    color: var(--muni-ink-soft);
    margin-top: 8px;
}

/* §C header-right "+ Add path" pill (matches prototype's right-slot button). */
.qaddpath {
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--mud-palette-primary);
    border-radius: 2px;
    color: var(--mud-palette-primary);
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 4px 9px;
    line-height: 1;
}

.qaddpath:hover { background: color-mix(in srgb, var(--mud-palette-primary) 7%, transparent); }

/* Footer -- left actions (Delete) + right actions (Cancel / Save). */
.qmodal__footer-split {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.qmodal__footer-left,
.qmodal__footer-right {
    display: flex;
    gap: 8px;
    align-items: center;
}

/* Task title input -- the prominent human display name at the top of the
   per-task editor body, above §A. Larger serif weight than ordinary civic
   inputs to read as the task's name (echoes the prototype NodeModal's big
   editable title). */
.qfield--title {
    margin-bottom: 14px;
}

.muni-task-title-input {
    font-family: "Libre Caslon Text", Georgia, "Times New Roman", serif !important;
    font-size: 19px !important;
    font-weight: 600 !important;
}

.qmodal__body {
    /* Horizontal + bottom padding so content (including the section
       legend dividers underneath) is inset from the QModal panel edges.
       Plan 06 UAT 2026-05-30: dialogs using <MuniSection> ran edge-to-edge
       because .muni-section has no padding of its own. .qsection-family
       rules earlier in this file don't apply here -- MuniSection renders
       a different class hierarchy (.muni-section / .muni-section__legend /
       .muni-section__body). Scope-overrides below handle that family
       inside this body, not globally. Tightened 2026-05-30 final pass
       to match the prototype's compact rhythm -- Nika: "I still feel the
       prototype's margin/spacing of elements in the modal are tighter". */
    padding: 16px 22px 18px;
    overflow: auto;
    flex: 1 1 auto;
    /* Flex children default to min-height: auto (content size) which prevents
       overflow:auto from engaging -- the body grows past the panel's max-height
       instead of scrolling. min-height: 0 lets the flex item shrink so the
       body honors the parent's max-height and scrolls internally.
       UAT 2026-05-29: Settings dialog overflowed viewport without this. */
    min-height: 0;
}

/* ------------------------------------------------------------------
   MuniSection inside QModal -- scope-overrides only; doesn't touch
   other MuniSection consumers (settings pages, dossier, etc.).
   Adds visible section separator (top hairline + padding-top), bumps
   head->body gap, and gives child fields breathing room.
   ------------------------------------------------------------------ */

.qmodal__body .muni-section {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid color-mix(in srgb, var(--muni-ink) 12%, transparent);
}

.qmodal__body .muni-section:first-of-type {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.qmodal__body .muni-section__legend {
    margin-bottom: 12px;
}

/* Stacked fields inside a MuniSection body get a compact 10px rhythm
   matching the prototype's tighter feel. */
.qmodal__body .muni-section__body > .qfield {
    margin-bottom: 10px;
}

.qmodal__body .muni-section__body > .qfield:last-child {
    margin-bottom: 0;
}

/* ------------------------------------------------------------------
   §C path row -- glyph-only seg + arrow + dropdown + small delete.
   Matches handoff-design-v2/quest-editor.jsx NodeModal paths (line
   209-224). Single horizontal row, compact.
   ------------------------------------------------------------------ */

.muni-task-edge-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
}

.muni-task-edge-row + .muni-task-edge-row {
    border-top: 1px solid color-mix(in srgb, var(--muni-ink) 6%, transparent);
}

.muni-task-edge-row__seg {
    display: inline-flex;
    border: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    border-radius: 2px;
    overflow: hidden;
    flex: 0 0 auto;
}

.muni-task-edge-row__seg-btn {
    cursor: pointer;
    border: none;
    border-left: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    background: transparent;
    color: var(--muni-ink-soft);
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    padding: 6px 9px;
    min-width: 26px;
    text-align: center;
}

.muni-task-edge-row__seg-btn:first-child {
    border-left: none;
}

.muni-task-edge-row__seg-btn:hover {
    background: color-mix(in srgb, var(--muni-ink) 4%, transparent);
}

.muni-task-edge-row__seg-btn--on {
    background: var(--muni-ink);
    color: var(--muni-paper);
}

.muni-task-edge-row__seg-btn--on:hover {
    background: var(--muni-ink);
}

.muni-task-edge-row__arrow {
    flex: 0 0 auto;
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 12px;
    color: var(--muni-ink-mute);
    line-height: 1;
}

.muni-task-edge-row__select {
    flex: 1 1 auto;
    background: var(--muni-paper);
    border: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    border-radius: 2px;
    color: var(--muni-ink);
    font-family: "Public Sans", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12px;
    padding: 6px 8px;
    min-width: 0;
}

.muni-task-edge-row__del {
    flex: 0 0 auto;
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--muni-stamp);
    border-radius: 2px;
    color: var(--muni-stamp);
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    padding: 5px 8px;
}

.muni-task-edge-row__del:hover {
    background: color-mix(in srgb, var(--muni-stamp) 8%, transparent);
}

.muni-task-edge-add {
    margin-top: 8px;
}

/* ------------------------------------------------------------------
   ConditionPredicateBuilder inline mini-row.
   Matches handoff-design-v2/quest-editor.jsx CondBuilder (line 66):
   indented under the path row, accent left-border, "IF" eyebrow +
   subject dropdown + value on one line. NOT a stacked qrow layout.
   ------------------------------------------------------------------ */

.cpb {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 4px 0 6px 22px;
    padding: 4px 0 4px 10px;
    border-left: 2px solid var(--mud-palette-primary);
}

.cpb__if {
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--mud-palette-primary);
    line-height: 1;
}

.cpb__op {
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 12px;
    color: var(--muni-ink-soft);
    line-height: 1;
}

.cpb__select {
    background: var(--muni-paper);
    border: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    border-radius: 2px;
    color: var(--muni-ink);
    font-family: "Public Sans", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12px;
    padding: 4px 6px;
    line-height: 1.3;
}

.cpb__input {
    background: var(--muni-paper);
    border: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    border-radius: 2px;
    color: var(--muni-ink);
    font-family: "Public Sans", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12px;
    padding: 4px 6px;
    line-height: 1.3;
    min-width: 180px;
}

.cpb__input--mono {
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
}

.cpb__input--num {
    min-width: 72px;
    max-width: 90px;
    text-align: right;
}

.qmodal__footer {
    flex-shrink: 0;
    border-top: 1px solid var(--muni-ink);
    background: var(--muni-paper-soft);
    padding: 12px 20px;
}

.qmodal__footer-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
}

.qmodal__footer-note {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
}

.qmodal__footer-actions {
    display: flex;
    gap: 8px;
}

.qmodal__discard-strip {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    gap: 12px;
}

.qmodal__discard-label {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 13px;
    color: var(--muni-stamp);
}

.qmodal__discard-actions { display: flex; gap: 8px; }

/* ------------------------------------------------------------------
   QSection
   ------------------------------------------------------------------ */

.qsection {
    padding: 14px 18px 16px;
    border-top: 1px solid color-mix(in srgb, var(--muni-ink) 12%, transparent);
}

.qsection--first { border-top: none; }

.qsection__head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 12px;
}

.qsection__head-left { flex: 1; }

.qsection__tag {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--muni-ink);
}

.qsection__tag-num { color: var(--muni-ink-mute); margin-right: 8px; }

.qsection__desc {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 12px;
    color: var(--muni-ink-mute);
    margin-top: 3px;
}

.qsection__head-right { flex-shrink: 0; }

/* ------------------------------------------------------------------
   QField / QRow
   ------------------------------------------------------------------ */

.qfield {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1 1 100%;
    margin-bottom: 10px;
}

/* The italic hint that follows an input gets extra top-margin so it
   reads as a paired explanation, not a stacked element. Matches the
   prototype's marginTop:8 between input and hint serif. */
.qfield > .qfield__hint {
    margin-top: 2px;
}

/* No trailing margin on the last field in a section -- the section's own
   padding-bottom (24px) handles the breathing room before the next section. */
.qsection > .qfield:last-child,
.qsection > .qrow:last-child,
.qsection > .qrow:last-child .qfield {
    margin-bottom: 0;
}

/* MuniNoticeBanner as a direct child of a section needs its own margin
   from the head (qsection__head has margin-bottom:20px but doesn't extend
   below if the section's first child isn't a qfield -- e.g. a Reward
   section that renders <MuniNoticeBanner> directly after the head). */
.qsection > .muni-notice-banner,
.qsection > div > .muni-notice-banner:first-child {
    margin-top: 4px;
}

/* LSL preview "drop this in a prim" pane -- when the textarea has the
   .qfield__lsl-preview marker class, render it as the dark code-block
   per the design prototype rather than the paper-tone civic textarea
   default. Matches quest-editor.jsx pre styling: #1a1a14 ground,
   #e8e3d0 ink, mono 10.5px, generous padding. The textarea remains
   editable-shaped (resize:vertical) so authors can pull it taller
   without overflowing the modal. */
.qfield__lsl-preview,
textarea.qfield__lsl-preview {
    background: #1a1a14 !important;
    color: #e8e3d0 !important;
    border: 1px solid #0f0f0a !important;
    border-radius: 3px !important;
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace !important;
    font-size: 10.5px !important;
    line-height: 1.5 !important;
    padding: 12px 14px !important;
    resize: vertical;
    max-height: 220px;
    overflow: auto;
    width: 100%;
    box-sizing: border-box;
}

.qfield__lsl-preview:focus,
textarea.qfield__lsl-preview:focus {
    outline: 1px solid rgba(232,227,208,.30);
    outline-offset: -1px;
}

.qfield--half {
    flex: 1 1 0;
    min-width: 180px;
}

.qfield__label {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
    margin-bottom: 3px;
}

.qfield__hint {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 11.5px;
    color: var(--muni-ink-mute);
    line-height: 1.4;
}

.qfield__hint--error { color: var(--muni-stamp) !important; }

.qfield__select {
    background: var(--muni-paper);
    border: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    border-radius: 2px;
    color: var(--muni-ink);
    font-family: "Public Sans", -apple-system, sans-serif;
    font-size: 13px;
    padding: 7px 9px;
    width: 100%;
    box-sizing: border-box;
}

.qfield__select--error { border-color: var(--muni-stamp) !important; }

.qrow {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

/* QToggleRow */
.qtoggle-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 8px 0;
}

.qtoggle {
    flex-shrink: 0;
    margin-top: 1px;
    width: 42px;
    height: 22px;
    border-radius: 12px;
    position: relative;
    padding: 0;
    cursor: pointer;
    border: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    background: var(--muni-hair);
    transition: background 0.12s, border-color 0.12s;
}

.qtoggle--on { background: var(--mud-palette-primary); border-color: var(--mud-palette-primary); }

.qtoggle__thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--muni-ink);
    transition: left 0.12s, background 0.12s;
}

.qtoggle--on .qtoggle__thumb { left: 22px; background: var(--muni-paper); }

.qtoggle-row__text { flex: 1; }
.qtoggle-row__label { font-family: "Public Sans", -apple-system, sans-serif; font-size: 13px; font-weight: 600; color: var(--muni-ink); }
.qtoggle-row__hint { font-family: "Libre Caslon Text", Georgia, serif; font-style: italic; font-size: 12px; color: var(--muni-ink-mute); margin-top: 1px; }

/* ------------------------------------------------------------------
   RewardFields
   ------------------------------------------------------------------ */

.reward-fields { display: grid; gap: 14px; }

.token-kv { display: grid; gap: 6px; margin-top: 6px; }
.token-kv__empty { font-family: "Libre Caslon Text", Georgia, serif; font-style: italic; font-size: 12px; color: var(--muni-ink-mute); }
.token-kv__row { display: flex; gap: 6px; align-items: center; }
.token-kv__eq { font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace; color: var(--muni-ink-mute); font-size: 12px; }
.token-kv__del {
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--muni-stamp);
    color: var(--muni-stamp);
    border-radius: 2px;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10px;
    padding: 5px 7px;
    line-height: 1;
}
.token-kv__add { margin-top: 6px; font-size: 9px !important; padding: 4px 9px !important; }

/* ------------------------------------------------------------------
   Master-detail scaffold
   ------------------------------------------------------------------ */

.mdetail { display: flex; min-height: 360px; height: 100%; }

.mdetail__rail {
    flex: 0 0 248px;
    border-right: 1px solid color-mix(in srgb, var(--muni-ink) 18%, transparent);
    background: var(--muni-paper-soft);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.mdetail__rail-list { flex: 1; overflow: auto; }

.mdetail__rail-empty {
    padding: 18px 14px;
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 12.5px;
    color: var(--muni-ink-mute);
}

.mdetail__row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    cursor: pointer;
    border-bottom: 1px dashed color-mix(in srgb, var(--muni-ink) 18%, transparent);
    background: transparent;
    border-left: 3px solid transparent;
    transition: background 0.08s;
}

.mdetail__row--selected { background: var(--muni-paper); border-left-color: var(--mud-palette-primary); }
.mdetail__row:hover:not(.mdetail__row--selected) { background: color-mix(in srgb, var(--muni-ink) 4%, transparent); }

.mdetail__row-text { flex: 1; min-width: 0; }

.mdetail__row-title {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--muni-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mdetail__row-summary {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9.5px;
    color: var(--muni-ink-mute);
    margin-top: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mdetail__row-arrows { display: flex; flex-direction: column; gap: 1px; }

.mdetail__arrow {
    cursor: pointer;
    border: 1px solid color-mix(in srgb, var(--muni-ink) 25%, transparent);
    background: var(--muni-paper);
    color: var(--muni-ink-soft);
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 8px;
    line-height: 1;
    padding: 2px 4px;
    border-radius: 2px;
}

.mdetail__arrow:disabled { opacity: 0.3; cursor: default; }

.mdetail__add {
    flex-shrink: 0;
    cursor: pointer;
    border: none;
    border-top: 1px solid color-mix(in srgb, var(--muni-ink) 18%, transparent);
    background: var(--muni-paper);
    color: var(--mud-palette-primary);
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 11px;
    width: 100%;
    text-align: center;
}

.mdetail__add:hover { background: color-mix(in srgb, var(--mud-palette-primary) 6%, transparent); }
.mdetail__detail { flex: 1; overflow: auto; padding: 18px; }

/* ------------------------------------------------------------------
   Inline delete confirm strip
   ------------------------------------------------------------------ */

.delete-confirm {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--muni-stamp);
    background: color-mix(in srgb, var(--muni-stamp) 8%, transparent);
    padding: 10px 14px;
    border-radius: 2px;
    margin-bottom: 14px;
}

.delete-confirm__label {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 13px;
    color: var(--muni-stamp);
}

.delete-confirm__actions { display: flex; gap: 8px; }

/* ------------------------------------------------------------------
   Condition + Clearance blocks inside failure detail
   ------------------------------------------------------------------ */

.cond-block {
    border: 1px solid color-mix(in srgb, var(--muni-ink) 18%, transparent);
    border-radius: 2px;
    padding: 14px;
    background: var(--muni-paper-soft);
    display: grid;
    gap: 10px;
}

.cond-block__title {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--muni-ink);
}

.cond-block__hint {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 11.5px;
    color: var(--muni-ink-mute);
    margin-top: -4px;
}

.clearance-or {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
    color: var(--muni-brass);
    text-align: center;
    padding: 4px 0;
}

.clearance-method {
    border: 1px solid color-mix(in srgb, var(--muni-ink) 18%, transparent);
    border-radius: 2px;
    padding: 10px;
    background: var(--muni-paper);
    display: grid;
    gap: 8px;
}

.clearance-method__row { display: flex; gap: 8px; align-items: center; }

/* ------------------------------------------------------------------
   Prereq row
   ------------------------------------------------------------------ */

.prereq-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.prereq-row__kind { flex: 0 0 150px; }
.prereq-row__ref { flex: 1; }
.prereq-row__del {
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--muni-stamp);
    color: var(--muni-stamp);
    border-radius: 2px;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10px;
    padding: 6px 8px;
    line-height: 1;
}

/* ------------------------------------------------------------------
   Muni-icon-btn mini -- zoom +/- in toolbar
   ------------------------------------------------------------------ */

.quest-toolbar .muni-icon-btn--civic {
    width: 30px;
    height: 28px;
}

/* ==================================================================
   Gate Builder -- Phase 60.1 Plan 13. Port of gate-builder.jsx onto
   QModal + the existing qfield/qsection civic vocabulary. Reuses the
   palette (ink var(--muni-ink), soft var(--muni-ink-mute), rule var(--muni-hair), paper var(--muni-paper),
   primary var(--mud-palette-primary), accent/stamp var(--muni-stamp)).
   ================================================================== */

/* §B combinator segmented control */
.gate-comb {
    display: inline-flex;
    border: 1px solid var(--muni-hair);
    border-radius: 2px;
    overflow: hidden;
}
.gate-comb__btn {
    padding: 8px 20px;
    cursor: pointer;
    border: none;
    border-right: 1px solid var(--muni-hair);
    background: transparent;
    color: var(--muni-ink-soft);
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}
.gate-comb__btn:last-child { border-right: none; }
.gate-comb__btn--on { background: var(--mud-palette-primary); color: var(--muni-paper); }
.gate-comb__help {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 12.5px;
    color: var(--muni-ink-mute);
    margin-top: 8px;
}

/* §C add-condition button + grouped popover */
.gate-add { position: relative; display: inline-block; }
/* Matches .qaddpath (the "+ Add prerequisite" button) verbatim -- Nika
   2026-06-01 preferred its compact lean over the bulkier original. */
.gate-add__btn {
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--mud-palette-primary);
    color: var(--mud-palette-primary);
    border-radius: 2px;
    font-family: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 4px 9px;
    line-height: 1;
}
.gate-add__btn:hover { background: color-mix(in srgb, var(--mud-palette-primary) 7%, transparent); }
.gate-add__scrim {
    position: fixed;
    inset: 0;
    z-index: 70;
}
.gate-add__pop {
    /* In flow (not absolute) so the QModal body's overflow:auto can scroll to
       it -- an absolute child was clipped by the scroll container, leaving only
       two lines visible. position:relative + z-index keeps it above the fixed
       scrim; margin-left:auto right-aligns the card under the header's
       "+ Add condition" button, preserving the prototype's anchored look. */
    position: relative;
    z-index: 71;
    width: 330px;
    max-width: 100%;
    margin: 0 0 14px auto;
    max-height: 440px;
    overflow: auto;
    background: var(--muni-paper);
    border: 1px solid var(--muni-ink);
    box-shadow: 0 18px 50px -20px rgba(0,0,0,.55);
}
.gate-add__head {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--muni-ink-soft);
    padding: 8px 12px 5px;
    background: var(--muni-paper-soft);
    border-bottom: 1px solid var(--muni-hair);
}
.gate-add__item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    text-align: left;
    padding: 9px 12px;
    cursor: pointer;
    background: transparent;
    border: none;
    border-bottom: 1px dashed var(--muni-paper-soft);
}
.gate-add__item:hover { background: var(--muni-paper-soft); }
.gate-add__item-glyph {
    flex-shrink: 0;
    margin-top: 1px;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: .6px;
    color: var(--muni-ink-soft);
    border: 1px solid var(--muni-hair);
    background: var(--muni-paper);
    border-radius: 2px;
    padding: 3px 5px;
}
.gate-add__item-label {
    display: block;
    font-family: "Public Sans", -apple-system, sans-serif;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--muni-ink);
}
.gate-add__item-blurb {
    display: block;
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 11.5px;
    color: var(--muni-ink-mute);
    margin-top: 1px;
}
/* single-modality guard: the opposite input clause shown disabled-with-reason */
.gate-add__item--disabled {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    padding: 9px 12px;
    cursor: not-allowed;
    opacity: .55;
}
.gate-add__item-label--struck { text-decoration: line-through; color: var(--muni-ink-mute); }
.gate-add__item-blurb--reason { color: var(--muni-stamp); font-style: italic; }

/* §C clause rows + AND/OR dividers */
.gate-clauses { display: grid; gap: 10px; }
.gate-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: -3px 0;
}
.gate-divider__rule { flex: 1; border-bottom: 1px dashed var(--muni-paper-soft); }
.gate-divider__word {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
}
.gate-divider__word--and { color: var(--mud-palette-primary); }
.gate-divider__word--or { color: var(--muni-stamp); }

.gate-clause {
    border: 1px solid var(--muni-hair);
    border-left: 3px solid var(--mud-palette-primary);
    background: var(--muni-paper);
    border-radius: 2px;
    padding: 11px 13px;
}
.gate-clause--invalid { border-left-color: var(--muni-stamp); }
.gate-clause__head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 11px;
}
.gate-clause__glyph {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--muni-ink-soft);
    border: 1px solid var(--muni-hair);
    background: var(--muni-paper-soft);
    border-radius: 2px;
    padding: 3px 6px;
}
.gate-clause__name {
    font-family: "Public Sans", -apple-system, sans-serif;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--muni-ink);
}
.gate-clause__spacer { flex: 1; }
.gate-clause__del {
    cursor: pointer;
    background: transparent;
    border: 1px solid var(--muni-hair);
    color: var(--muni-ink-mute);
    border-radius: 2px;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 11px;
    line-height: 1;
    padding: 4px 7px;
}
.gate-clause__fields {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: flex-start;
}
.gate-clause__err {
    margin-top: 9px;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .5px;
    color: var(--muni-stamp);
}
.gate-field { flex: 1 1 140px; min-width: 130px; }
.gate-field--narrow { flex: 0 1 140px; }
.gate-field--num { flex: 0 1 120px; }
.gate-field--wide { flex: 1.6 1 160px; }
.gate-field__label {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
    margin-bottom: 5px;
}
.gate-field__note {
    flex: 1 1 100%;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
    align-self: flex-end;
}

/* tier multi-select chips (StandingTier op=in) */
.gate-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.gate-chip {
    cursor: pointer;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10.5px;
    letter-spacing: .4px;
    padding: 5px 11px;
    border-radius: 2px;
    border: 1px solid var(--muni-hair);
    background: var(--muni-paper);
    color: var(--muni-ink-soft);
}
.gate-chip--on { border-color: var(--mud-palette-primary); background: var(--mud-palette-primary); color: var(--muni-paper); }

/* editable accepted-button list (DialogChoice clause) */
.gate-labels {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    border: 1px solid var(--muni-hair);
    border-radius: 2px;
    background: var(--muni-paper);
    padding: 6px;
}
.gate-labels--invalid { border-color: var(--muni-stamp); }
.gate-label-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--muni-mono);
    font-size: 10.5px;
    font-weight: 600;
    color: var(--muni-ink);
    background: var(--muni-paper-soft);
    border: 1px solid var(--muni-hair);
    border-radius: 2px;
    padding: 3px 5px 3px 8px;
}
.gate-label-chip__del {
    cursor: pointer;
    border: none;
    background: transparent;
    color: var(--muni-ink-mute);
    font-family: var(--muni-mono);
    font-size: 12px;
    line-height: 1;
    padding: 0;
}
.gate-labels__entry {
    flex: 1 1 70px;
    min-width: 70px;
    border: none;
    outline: none;
    background: transparent;
    font-family: var(--muni-sans);
    font-size: 12.5px;
    color: var(--muni-ink);
    padding: 3px 2px;
}

/* §C empty state */
.gate-empty {
    border: 1px dashed var(--muni-hair);
    background: var(--muni-paper-soft);
    border-radius: 2px;
    padding: 18px 16px;
    text-align: center;
}
.gate-empty__title {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 13.5px;
    color: var(--muni-ink-soft);
}
.gate-empty__hint {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 12px;
    color: var(--muni-ink-mute);
    margin-top: 3px;
}

/* pinned "Reads as" preview band */
.gate-preview {
    border: 1px solid var(--muni-hair);
    border-left: 3px solid var(--muni-ink);
    background: var(--muni-paper-soft);
    padding: 11px 14px;
}
.gate-preview__head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 7px;
}
.gate-preview__label {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
}
.gate-preview__comb {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 1.2px;
    color: var(--muni-paper);
    background: var(--muni-ink);
    padding: 2px 7px;
    border-radius: 2px;
}
.gate-preview__empty {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 13px;
    color: var(--muni-ink-mute);
}

/* the plain-English sentence renderer */
.gate-sentence { font-family: "Libre Caslon Text", Georgia, serif; font-size: 14px; line-height: 1.55; }
.gate-sentence__base { color: var(--muni-ink-soft); }
.gate-sentence__em { font-weight: 600; color: var(--muni-ink); }
.gate-sentence__em--mono { font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px; }
.gate-sentence__conn {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin: 0 6px;
}
.gate-sentence__conn--and { color: var(--mud-palette-primary); }
.gate-sentence__conn--or { color: var(--muni-stamp); }

/* §C header tally + footer issue line + identity key chip/hint */
.gate-tally {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9.5px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
}
.gate-issues {
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 9px;
    letter-spacing: .8px;
    text-transform: uppercase;
}
.gate-issues--ok { color: var(--mud-palette-primary); }
.gate-issues--bad { color: var(--muni-stamp); }
.gate-keychip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
    font-size: 13px;
    color: var(--muni-ink-soft);
    border: 1px solid var(--muni-hair);
    background: var(--muni-paper-soft);
    border-radius: 2px;
    padding: 6px 10px;
}
.gate-confirm {
    font-family: "Libre Caslon Text", Georgia, serif;
    font-style: italic;
    font-size: 13px;
    color: var(--muni-ink-soft);
}
.gate-confirm--danger { color: var(--muni-stamp); }

/* ===================================================================
   Interactable outcome-port editor (mounted in MuniDrawer). Token-only.
   =================================================================== */
.int-loading { padding: 24px 20px; font-family: var(--muni-serif); font-style: italic; color: var(--muni-ink-mute); }
.int-body { padding: 16px 20px; border-bottom: 1px solid var(--muni-hair); display: grid; gap: 12px; }
.int-body--prompt { gap: 6px; }
.int-muted { color: var(--muni-ink-mute); }
.int-section__tag { font-family: var(--muni-mono); font-size: 10px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; color: var(--muni-ink); }
.int-section__tag span { color: var(--muni-ink-mute); margin-right: 8px; }
.int-section__desc { font-family: var(--muni-serif); font-style: italic; font-size: 12px; color: var(--muni-ink-mute); margin-top: 3px; }
.int-section--row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.int-field__label { font-family: var(--muni-mono); font-size: 9.5px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muni-ink-mute); }
.int-field__label--spaced { margin-top: 6px; }
.int-field__label--ink { color: var(--muni-ink); }
.int-hint { font-family: var(--muni-serif); font-style: italic; font-size: 11px; color: var(--muni-ink-mute); margin-top: 4px; }
.int-branch { margin-top: 6px; border-top: 1px dashed var(--muni-hair); padding-top: 16px; display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.int-branch__copy { font-family: var(--muni-serif); font-style: italic; font-size: 12.5px; color: var(--muni-ink-mute); max-width: 360px; }
.int-branch__btn, .int-add-outcome, .int-edit-gate { cursor: pointer; border-radius: 2px; font-family: var(--muni-mono); font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.int-branch__btn { background: var(--mud-palette-primary); color: var(--muni-paper); border: 1px solid var(--mud-palette-primary); font-size: 11px; padding: 9px 14px; }
.int-add-outcome { background: transparent; border: 1px solid var(--muni-accent); color: var(--muni-accent); font-size: 9px; padding: 5px 10px; }
.int-edit-gate { background: transparent; border: 1px solid var(--mud-palette-primary); color: var(--mud-palette-primary); font-size: 9px; padding: 4px 9px; }
.int-modality { padding: 12px 20px; background: var(--muni-paper-soft); display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--muni-hair); }
.int-modality__sigil { font-family: var(--muni-mono); font-size: 9px; font-weight: 700; letter-spacing: 1px; color: var(--muni-paper); background: var(--muni-ink); border-radius: 2px; padding: 3px 7px; }
.int-modality__banner { font-family: var(--muni-sans); font-size: 12.5px; font-weight: 600; color: var(--muni-ink); }
.int-modality__note { font-family: var(--muni-serif); font-style: italic; font-size: 11.5px; color: var(--muni-ink-mute); }
.int-empty { border: 1px dashed var(--muni-hair); background: var(--muni-paper-soft); border-radius: 2px; padding: 16px; text-align: center; font-family: var(--muni-serif); font-style: italic; font-size: 13px; color: var(--muni-ink-soft); }
.int-port { border: 1px solid var(--muni-hair); border-left: 3px solid var(--muni-accent); background: var(--muni-paper); border-radius: 2px; }
.int-port--catchall { border: 1.5px solid var(--muni-ink); border-left: 3px solid var(--muni-ink); }
.int-port--exhaustion { border: 1.5px solid var(--muni-stamp); border-left: 3px solid var(--muni-stamp); background: var(--muni-stamp-soft); margin-top: 14px; }
.int-port__head { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-bottom: 1px dashed var(--muni-hair); background: var(--muni-paper-soft); }
.int-port__head--catchall, .int-port__head--exhaustion { background: transparent; }
.int-port__badge { font-family: var(--muni-mono); font-size: 10px; font-weight: 700; color: var(--muni-accent); border: 1px solid var(--muni-accent); border-radius: 2px; padding: 2px 7px; }
.int-port__badge--catchall { color: var(--muni-paper); background: var(--muni-ink); border-color: var(--muni-ink); }
.int-port__badge--exhaustion { color: var(--muni-paper); background: var(--muni-stamp); border-color: var(--muni-stamp); }
.int-port__order { font-family: var(--muni-mono); font-size: 8.5px; letter-spacing: 1px; color: var(--muni-ink-mute); text-transform: uppercase; }
.int-port__pinned { font-family: var(--muni-serif); font-style: italic; font-size: 12px; color: var(--muni-ink-mute); }
.int-port__spacer { flex: 1; }
.int-port__reorder { display: flex; flex-direction: column; gap: 1px; }
.int-port__reorder button { cursor: pointer; border: 1px solid var(--muni-hair); background: var(--muni-paper); color: var(--muni-ink-soft); font-family: var(--muni-mono); font-size: 8px; line-height: 1; padding: 2px 5px; border-radius: 2px; }
.int-port__reorder button:disabled { opacity: .3; cursor: default; }
.int-port__del { cursor: pointer; background: transparent; border: 1px solid var(--muni-stamp); color: var(--muni-stamp); border-radius: 2px; font-family: var(--muni-mono); font-size: 11px; line-height: 1; padding: 5px 7px; }
.int-port__body { padding: 12px 14px; display: grid; gap: 14px; }
.int-port__gate-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.int-reads { cursor: pointer; border: 1px solid var(--muni-hair); border-left: 3px solid var(--muni-ink); background: var(--muni-paper-soft); padding: 9px 12px; }
.int-reads--invalid { border-color: var(--muni-stamp); }
.int-reads__text { font-family: var(--muni-serif); font-size: 13.5px; color: var(--muni-ink); margin-left: 8px; }
.int-reads__empty { font-family: var(--muni-serif); font-style: italic; font-size: 13px; color: var(--muni-stamp); margin-left: 8px; }
.int-targets { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.int-targets__empty { font-family: var(--muni-serif); font-style: italic; font-size: 12.5px; color: var(--muni-stamp); }
.int-target-chip { display: inline-flex; align-items: center; gap: 7px; font-family: var(--muni-sans); font-size: 12px; font-weight: 600; color: var(--muni-ink); background: var(--muni-paper); border: 1px solid var(--muni-accent); border-left: 3px solid var(--muni-accent); border-radius: 2px; padding: 4px 6px 4px 9px; }
.int-target-chip--ink { border-color: var(--muni-ink); border-left-color: var(--muni-ink); }
.int-target-chip--stamp { border-color: var(--muni-stamp); border-left-color: var(--muni-stamp); }
/* Terminal outcome: a solid "Ends the quest" pill reads as a final state, distinct from a routing chip. */
.int-target-chip--end { color: var(--muni-paper); background: var(--muni-ink); border-color: var(--muni-ink); border-left-color: var(--muni-ink); }
.int-target-chip--end .int-target-chip__del { color: var(--muni-paper); }
/* Reward-flag chip: a softer border separates a granted flag from a next-task routing chip. */
.int-target-chip--flag { border-color: var(--muni-ink-soft); border-left-color: var(--muni-ink-soft); }
.int-target-chip__num { font-family: var(--muni-mono); font-size: 9px; color: var(--muni-accent); }
.int-target-chip--ink .int-target-chip__num { color: var(--muni-ink); }
.int-target-chip--stamp .int-target-chip__num { color: var(--muni-stamp); }
.int-target-chip__del { cursor: pointer; border: none; background: transparent; color: var(--muni-ink-mute); font-family: var(--muni-mono); font-size: 13px; line-height: 1; padding: 0; }
.int-targets__add { border: 1px dashed var(--muni-hair); border-radius: 2px; background: var(--muni-paper); color: var(--muni-ink-soft); font-family: var(--muni-mono); font-size: 11px; padding: 6px 9px; }
.int-message { width: 100%; background: transparent; border: none; border-bottom: 1.5px solid var(--muni-hair); color: var(--muni-ink); font-family: var(--muni-serif); font-style: italic; font-size: 14px; padding: 6px 0; outline: none; box-sizing: border-box; }
.int-attempts { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.int-seg { display: inline-flex; border: 1px solid var(--muni-hair); border-radius: 2px; overflow: hidden; }
.int-seg__btn { cursor: pointer; border: none; background: transparent; color: var(--muni-ink-soft); font-family: var(--muni-mono); font-size: 10px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; padding: 7px 12px; }
.int-seg__btn + .int-seg__btn { border-left: 1px solid var(--muni-hair); }
.int-seg__btn--on { background: var(--muni-ink); color: var(--muni-paper); }
.int-attempts__num { display: flex; align-items: center; gap: 8px; }
.int-attempts__num input { width: 70px; }
.int-footer { display: flex; justify-content: space-between; align-items: center; padding: 12px 20px; gap: 12px; }
.int-footer__status { font-family: var(--muni-mono); font-size: 9px; letter-spacing: .8px; text-transform: uppercase; }
.int-footer__status--ok { color: var(--mud-palette-primary); }
.int-footer__status--bad { color: var(--muni-stamp); }
.int-footer__actions { display: flex; gap: 8px; }

/* -------------------------------------------------------------------
   Expanded state: master-detail (left rail of selectable rows + right
   detail pane that edits the selected row). The drawer body has no
   padding, so the rail sits flush-left with its own right border and
   scroll while the detail pane owns its own padding and scroll.
   ------------------------------------------------------------------- */
.int-md { flex: 1; min-height: 0; display: flex; }

.int-rail { flex: 0 0 244px; border-right: 1px solid var(--muni-hair); background: var(--muni-paper-soft); display: flex; flex-direction: column; min-height: 0; }
.int-rail__scroll { flex: 1; overflow: auto; }
.int-rail__pinned { flex-shrink: 0; border-top: 1px solid var(--muni-hair); }

.int-rail__group { font-family: var(--muni-mono); font-size: 9.5px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muni-ink-mute); padding: 11px 12px 5px; }
.int-rail__group--row { display: flex; justify-content: space-between; align-items: center; padding-top: 12px; }
.int-rail__add { cursor: pointer; background: transparent; border: 1px solid var(--muni-accent); color: var(--muni-accent); border-radius: 2px; font-family: var(--muni-mono); font-size: 9px; font-weight: 700; padding: 2px 6px; line-height: 1; }
.int-rail__add:hover { background: color-mix(in srgb, var(--muni-accent) 8%, transparent); }
.int-rail__empty { padding: 6px 12px 10px; font-family: var(--muni-serif); font-style: italic; font-size: 11.5px; color: var(--muni-ink-mute); }

.int-railrow { display: flex; align-items: flex-start; gap: 9px; padding: 10px 12px; cursor: pointer; border-bottom: 1px dashed color-mix(in srgb, var(--muni-ink) 12%, transparent); background: transparent; border-left: 3px solid transparent; }
.int-railrow:hover:not(.int-railrow--on) { background: color-mix(in srgb, var(--muni-ink) 4%, transparent); }
.int-railrow--on { background: var(--muni-paper); }
.int-railrow--on-primary { border-left-color: var(--mud-palette-primary); }
.int-railrow--on-accent { border-left-color: var(--muni-accent); }
.int-railrow--on-ink { border-left-color: var(--muni-ink); }
.int-railrow--on-stamp { border-left-color: var(--muni-stamp); }

.int-railrow__badge { flex-shrink: 0; margin-top: 1px; font-family: var(--muni-mono); font-size: 8.5px; font-weight: 700; letter-spacing: .6px; border-radius: 2px; padding: 2px 6px; }
.int-railrow__badge--task { color: var(--muni-ink-soft); background: var(--muni-paper); }
.int-railrow__badge--accent { color: var(--muni-accent); background: var(--muni-paper); }
.int-railrow__badge--ink { color: var(--muni-paper); background: var(--muni-ink); }
.int-railrow__badge--stamp { color: var(--muni-paper); background: var(--muni-stamp); }

.int-railrow__text { flex: 1; min-width: 0; }
.int-railrow__title { font-family: var(--muni-serif); font-size: 13px; font-weight: 600; color: var(--muni-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.int-railrow__sub { font-family: var(--muni-mono); font-size: 9px; color: var(--muni-ink-mute); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.int-railrow__sub--invalid { color: var(--muni-stamp); }

.int-detail { flex: 1; min-width: 0; overflow: auto; padding: 18px 22px; }

/* Detail-pane scaffolding: a vertical stack of blocks at the prototype's
   16px detail-grid rhythm; the port header row and the soft-ruled node
   attempts divider reuse the existing int-port atoms. */
.int-pane { display: grid; gap: 16px; }
.int-pane__block--ruled { border-top: 1px dashed var(--muni-hair); padding-top: 14px; }
/* Inside the detail pane the field label sits 6px above its control, matching
   the prototype's per-block marginBottom (the int-pane grid owns block gaps). */
.int-pane__block > .int-field__label { margin-bottom: 6px; }
.int-pane__block .int-port__gate-head { margin-bottom: 6px; }
.int-pane__porthead { display: flex; align-items: center; gap: 10px; }
.int-pane__reorder { cursor: pointer; border: 1px solid var(--muni-hair); background: var(--muni-paper); color: var(--muni-ink-soft); font-family: var(--muni-mono); font-size: 10px; line-height: 1; padding: 4px 7px; border-radius: 2px; }
.int-pane__reorder:disabled { opacity: .3; cursor: default; }
.int-attempts__hint { font-family: var(--muni-serif); font-style: italic; font-size: 12px; color: var(--muni-ink-mute); }

/* -------------------------------------------------------------------
   Unified task drawer additions. The two-column rail+detail, the int-port
   atoms, the seg control, target wiring, and the message field are all
   shared with the interactable editor above; the rules below cover the
   pieces unique to the unified surface: the wrapping 5-mode trigger
   selector, the inline save-error banner, and the keyed-LSL block (which
   reuses the .qlsl__pre / .qlsl__copy vocabulary already defined for the
   per-task editor's §A script preview).
   ------------------------------------------------------------------- */

/* The trigger selector carries five modes; let it wrap on a narrow drawer
   rather than overflow. Wrapping segments keep their hairline dividers via
   the existing .int-seg__btn + .int-seg__btn rule, plus a top border so a
   wrapped second row reads as part of the same control. */
.int-seg--wrap { flex-wrap: wrap; }
.int-seg--wrap .int-seg__btn { border-top: 1px solid var(--muni-hair); }
.int-seg--wrap .int-seg__btn:first-child { border-top: none; }

/* Inline save-error banner -- stamp-bordered serif note inside the drawer body. */
.int-saveerror {
    margin: 12px 20px;
    border: 1px solid var(--muni-stamp);
    padding: 10px 14px;
    background: color-mix(in srgb, var(--muni-stamp) 8%, transparent);
    font-family: var(--muni-serif);
    font-style: italic;
    font-size: 13px;
    color: var(--muni-stamp);
}

/* ===================================================================
   Discovered affordance card (QuestDrawer > Behavior section).
   A bordered/weighted card composes AutoAccept + silent enrollment.
   =================================================================== */
.disc-card {
    border: 1.5px solid var(--muni-hair);
    background: var(--muni-paper);
    border-radius: 3px;
    padding: 14px 16px;
    margin-bottom: 14px;
    transition: border-color .12s, background .12s;
}
.disc-card--on {
    border-color: var(--mud-palette-primary) !important;
    background: color-mix(in srgb, var(--mud-palette-primary) 6%, var(--muni-paper)) !important;
}
.disc-card__inner {
    display: flex;
    align-items: flex-start;
    gap: 13px;
}
.disc-card__toggle {
    flex-shrink: 0;
    margin-top: 1px;
}
.disc-card__body {
    flex: 1;
}
.disc-card__head {
    display: flex;
    align-items: center;
    gap: 9px;
}
.disc-card__title {
    font-family: var(--muni-serif);
    font-size: 16px;
    font-weight: 600;
    color: var(--muni-ink);
    letter-spacing: -0.2px;
}
.disc-card__badge {
    font-family: var(--muni-mono);
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--muni-ink-mute);
    border: 1px solid var(--muni-hair);
    border-radius: 2px;
    padding: 2px 6px;
}
.disc-card__badge--on {
    color: var(--mud-palette-primary) !important;
    border-color: var(--mud-palette-primary) !important;
}
.disc-card__note {
    font-family: var(--muni-serif);
    font-style: italic;
    font-size: 13px;
    color: var(--muni-ink-soft);
    margin-top: 5px;
    line-height: 1.5;
}
.disc-card__confirms {
    margin-top: 10px;
    border-top: 1px dashed var(--mud-palette-primary);
    padding-top: 10px;
    display: grid;
    gap: 6px;
}
.disc-card__confirm-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--muni-mono);
    font-size: 10px;
    color: var(--muni-ink-soft);
}
.disc-card__check {
    color: var(--mud-palette-primary);
}
.disc-card__code {
    font-family: var(--muni-mono);
}
.disc-card__entry-hint {
    font-family: var(--muni-serif);
    font-style: italic;
    font-size: 12px;
    color: var(--muni-ink-mute);
    margin-top: 2px;
}

/* "SET BY DISCOVERED" inline badge on driven toggles */
.disc-driven-badge {
    display: inline-block;
    font-family: var(--muni-mono);
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--mud-palette-primary);
    border: 1px solid var(--mud-palette-primary);
    border-radius: 2px;
    padding: 1px 5px;
    margin-left: 8px;
    vertical-align: middle;
}

/* Driven toggle row: reduced opacity while a setting is overridden by Discovered */
.qtoggle-row--driven {
    opacity: 0.55;
}

/* ===================================================================
   Parallel-live entry card (UnifiedTaskDrawer > Trigger section).
   Visible only when the quest is Discovered AND the task is interactable.
   =================================================================== */
.parallel-entry-card {
    border: 1px solid var(--muni-hair);
    background: var(--muni-paper);
    border-radius: 3px;
    padding: 12px 14px;
    transition: border-color .12s, background .12s;
}
.parallel-entry-card--on {
    border-color: var(--mud-palette-primary) !important;
    background: color-mix(in srgb, var(--mud-palette-primary) 5%, var(--muni-paper)) !important;
}
.parallel-entry-card__inner {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.parallel-entry-card__toggle {
    flex-shrink: 0;
    margin-top: 1px;
}
.parallel-entry-card__body {
    flex: 1;
}
.parallel-entry-card__head {
    display: flex;
    align-items: center;
    gap: 8px;
}
.parallel-entry-card__title {
    font-family: var(--muni-sans);
    font-size: 13px;
    font-weight: 600;
    color: var(--muni-ink);
}
.parallel-entry-card__badge {
    font-family: var(--muni-mono);
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    color: var(--mud-palette-primary);
    border: 1px solid var(--mud-palette-primary);
    border-radius: 2px;
    padding: 1px 5px;
}
.parallel-entry-card__note {
    font-family: var(--muni-serif);
    font-style: italic;
    font-size: 12px;
    color: var(--muni-ink-mute);
    margin-top: 2px;
    line-height: 1.4;
}