/* Real local AI Guide UI. Tokens: workbench.css warm painting surface system;
 * z order: original nonmodal panels 200, no dark canvas veil or focus trap. */
.painting-guide-entry-host { display: flex; align-items: center; flex: 0 0 auto; position: sticky; inset-inline-end: 0; z-index: 2; min-width: 0; max-width: 100%; gap: 8px; padding: 4px; background: var(--painting-surface-raised); border-inline-start: 1px solid var(--painting-line); color: var(--painting-text-muted); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.painting-guide-entry-host > button { min-height: 44px; flex: 0 0 auto; }
.jtc-guide-entry, .jtc-guide-workspace { box-sizing: border-box; color: var(--painting-text-strong); font-family: inherit; font-size: var(--painting-font-body, 13px); }
.jtc-guide-workspace { font-size: max(var(--painting-font-body, 13px), .875rem); }
.jtc-guide-safe-probe { position: fixed; inset: 0; padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px); visibility: hidden; pointer-events: none; contain: strict; }
.jtc-guide-entry { display: inline-flex; align-items: stretch; gap: 0; max-width: 100%; }
.jtc-guide-entry > button { min-height: 44px; border-radius: 0; }
.jtc-guide-entry > button:first-child { border-start-start-radius: var(--radius-md, 10px); border-end-start-radius: var(--radius-md, 10px); }
.jtc-guide-entry > button:last-child { border-start-end-radius: var(--radius-md, 10px); border-end-end-radius: var(--radius-md, 10px); min-width: 44px; }
.painting-guide-entry-host .jtc-guide-entry > button:first-child { min-width: 148px; flex: 0 0 auto; }
.jtc-guide-entry-state { font-size: 12px; color: var(--painting-text-muted); white-space: normal; }
.jtc-guide-dot { width: 6px; height: 6px; border-radius: 50%; border: 1px solid var(--painting-line-strong); background: var(--painting-surface); flex: 0 0 auto; }
.jtc-guide-dot[data-state='on'] { background: var(--painting-accent); border-color: var(--painting-accent); }
.jtc-guide-dot[data-state='error'] { background: var(--color-error, #a33c32); }
.jtc-guide-workspace { position: fixed; z-index: 200; display: flex; flex-direction: column; overflow: auto; overscroll-behavior: contain; max-width: calc(100vw - 16px); border: 1px solid var(--painting-line-strong); border-radius: var(--radius-md, 10px); background: var(--painting-surface-raised); box-shadow: var(--shadow-popover, 0 10px 30px #0002); container: jtc-guide / inline-size; padding: 0; }
.jtc-guide-workspace[hidden], .jtc-guide-workspace [hidden] { display: none; }
.jtc-guide-workspace *, .jtc-guide-entry * { box-sizing: border-box; min-width: 0; }
.jtc-guide-workspace :is(p, small, strong, span, output) { overflow-wrap: anywhere; white-space: normal; }
.jtc-guide-workspace :is(p, h2) { margin: 0; }
.jtc-guide-workspace small, .jtc-guide-setup small { font-size: max(var(--painting-font-support, 12px), .75rem); line-height: 1.5; color: var(--painting-text-muted); }
.jtc-guide-head { position: sticky; top: 0; display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; padding: 12px; background: var(--painting-surface-raised); border-bottom: 1px solid var(--painting-line); z-index: 1; }
.jtc-guide-head > div { display: grid; gap: 4px; flex: 1; }
.jtc-guide-head strong { font-size: max(15px, .9375rem); line-height: 1.4; font-weight: 650; }
.jtc-guide-sheet-levels { display: flex; align-items: center; gap: 8px; padding: 8px 12px; }
.jtc-guide-sheet-levels > button { flex: 1; }
.jtc-guide-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 8px 10px; max-width: 100%; border: 1px solid var(--painting-line); border-radius: var(--radius-sm, 6px); color: var(--painting-text-strong); background: var(--painting-surface); font: inherit; font-weight: 500; line-height: 1.4; white-space: normal; overflow-wrap: anywhere; cursor: pointer; touch-action: manipulation; transition: background 80ms ease-out, color 80ms ease-out; }
.jtc-guide-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; flex: 0 0 auto; }
.jtc-guide-button:focus-visible, .jtc-guide-workspace :is(input, select, summary):focus-visible { outline: 2px solid var(--painting-accent); outline-offset: 2px; }
.jtc-guide-button:active:not(:disabled) { background: var(--painting-accent-soft); }
.jtc-guide-button:is([aria-checked='true'], [aria-pressed='true']) { color: var(--painting-accent-deep); background: var(--painting-accent-soft); border-color: var(--painting-accent); }
.jtc-guide-button:disabled { cursor: not-allowed; color: var(--painting-text-muted); border-style: dashed; }
.jtc-guide-button:has(.jtc-guide-disabled-reason) { flex-wrap: wrap; }
.jtc-guide-disabled-reason { width: 100%; text-align: start; font-weight: 400; }
.jtc-guide-list { padding: 8px; display: grid; gap: 8px; }
.jtc-guide-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 4px; border: 1px solid var(--painting-line); border-radius: var(--radius-sm, 6px); }
.jtc-guide-row > button:first-child { justify-content: flex-start; border-color: transparent; background: transparent; text-align: start; }
.jtc-guide-row-text { display: grid; gap: 3px; }
.jtc-guide-row-text strong { font-size: max(14px, .875rem); font-weight: 600; line-height: 1.4; }
.jtc-guide-row-text .jtc-guide-purpose { font-weight: 400; color: var(--painting-text-muted); }
.jtc-guide-message { margin: 8px 12px; padding: 10px; border-inline-start: 3px solid var(--painting-accent); background: var(--painting-accent-pale); line-height: 1.5; }
.jtc-guide-message[data-tone='error'] { color: var(--color-error, #8f3129); border-color: currentColor; background: var(--painting-surface); }
.jtc-guide-detail-status[data-tone='error'] { color: var(--color-error); }
.jtc-guide-detail { display: grid; gap: 12px; padding: 12px; }
.jtc-guide-detail-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.jtc-guide-detail-head strong { flex: 1 1 110px; font-size: max(14px, .875rem); }
.jtc-guide-detail-status { font-size: max(13px, .8125rem); font-weight: 600; line-height: 1.5; color: var(--painting-text-body); }
.jtc-guide-scope, .jtc-guide-help { color: var(--painting-text-muted); font-size: max(12px, .75rem); line-height: 1.6; }
.jtc-guide-fields { display: grid; gap: 12px; }
.jtc-guide-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 8px; align-items: center; font-size: max(13px, .8125rem); line-height: 1.5; }
.jtc-guide-inputs { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.jtc-guide-field .jtc-guide-number { font-variant-numeric: tabular-nums; width: 7ch; text-align: end; grid-column: 2; grid-row: 1; }
.jtc-guide-field-reason, .jtc-guide-field-help { grid-column: 1 / -1; }
.jtc-guide-field-reason:empty { display: none; }
.jtc-guide-field:has([aria-invalid='true']) .jtc-guide-field-reason { color: var(--color-error); }
.jtc-guide-workspace :is(input[type='number'], select) { border: 1px solid var(--painting-line-strong); border-radius: var(--radius-sm, 6px); background: var(--painting-surface); color: var(--painting-text-strong); font: inherit; min-height: 36px; padding: 6px 8px; }
.jtc-guide-workspace input[type='number'] { width: 7ch; max-width: 100%; flex: 0 1 7ch; font-variant-numeric: tabular-nums; }
.jtc-guide-workspace select { width: 100%; white-space: normal; }
.jtc-guide-workspace input[type='range'] { min-width: 0; flex: 1 1 120px; max-width: 100%; min-height: 36px; margin: 0; accent-color: var(--painting-accent); }
.jtc-guide-workspace input[type='checkbox'] { width: 20px; height: 20px; accent-color: var(--painting-accent); }
.jtc-guide-workspace [aria-invalid='true'] { border-color: var(--color-error, #a33c32); outline: 1px solid var(--color-error, #a33c32); }
.jtc-guide-advanced { border-top: 1px solid var(--painting-line); padding-top: 8px; }
.jtc-guide-advanced summary { min-height: 36px; display: flex; align-items: center; cursor: pointer; font-weight: 600; }
.jtc-guide-advanced > div { padding-top: 8px; }
.jtc-guide-support { border-top: 1px solid var(--painting-line); padding-top: 8px; font-size: inherit; }
.jtc-guide-support > summary { min-height: 36px; line-height: 1.5; cursor: pointer; color: var(--painting-text-muted); overflow-wrap: anywhere; }
.jtc-guide-support > p { padding-block-start: 8px; }
.jtc-guide-secondary-actions, .jtc-guide-special { display: flex; flex-wrap: wrap; gap: 8px; }
.jtc-guide-secondary-actions .jtc-guide-button { flex: 1 1 120px; }
.jtc-guide-footer { display: grid; gap: 8px; padding: 12px; border-top: 1px solid var(--painting-line); }
@media (hover: hover) { .jtc-guide-button:hover:not(:disabled) { background: var(--painting-accent-pale); border-color: var(--painting-accent); } }
@media (pointer: coarse), (max-width: 980px) { .jtc-guide-workspace :is(button, input:not([type='checkbox']), select, summary) { min-height: 44px; } .jtc-guide-workspace :is(input[type='number'], select) { font-size: max(16px, 1rem); } .jtc-guide-field { font-size: max(14px, .875rem); } .jtc-guide-workspace input[type='checkbox'] { width: 24px; height: 24px; } .jtc-guide-field:has(input[type='checkbox']) { min-height: 44px; } }
@container jtc-guide (max-width: 280px) { .jtc-guide-row { grid-template-columns: minmax(0, 1fr); } .jtc-guide-row > button:last-child { width: 100%; } .jtc-guide-inputs { flex-wrap: wrap; } .jtc-guide-workspace input[type='number'] { flex: 1 1 7ch; } }
@media (prefers-reduced-motion: reduce) { .jtc-guide-button { transition: none; } }
.jtc-guide-setup { overscroll-behavior: contain; scroll-padding-block: 76px; font-family: inherit; }
.jtc-guide-setup *, .jtc-guide-setup-backdrop { box-sizing: border-box; min-width: 0; max-width: 100%; }
.jtc-guide-setup [hidden] { display: none; }
.jtc-guide-setup :is(p, small, strong, span, label, summary, button) { overflow-wrap: anywhere; white-space: normal; line-height: 1.5; }
.jtc-guide-setup :is(button, input, select, summary):focus-visible { outline: 2px solid var(--painting-accent); outline-offset: 2px; }
.jtc-guide-setup [aria-invalid='true'] { border-color: var(--color-error) !important; outline: 1px solid var(--color-error); }
.jtc-guide-setup-head { position: sticky; top: -16px; z-index: 1; padding-block: 12px; margin-block-start: -16px; background: var(--painting-surface); border-bottom: 1px solid var(--painting-line); }
.jtc-guide-setup-head > strong { flex: 1; min-width: 0; }
.jtc-guide-setup-head > button { flex: 0 0 auto; }
.jtc-guide-setup-status { border-inline-start: 3px solid var(--painting-accent); padding: 8px 10px; background: var(--painting-accent-pale); }
.jtc-guide-setup-status[data-tone='error'] { border-color: var(--color-error); color: var(--color-error); background: var(--painting-surface-raised); }
.jtc-guide-setup-source { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.jtc-guide-setup-source > small { flex: 1 1 160px; }
.jtc-guide-setup-source > button { flex: 0 1 auto; }
.jtc-guide-setup-section-title { font-size: max(14px, .875rem); font-weight: 600; line-height: 1.5; }
.jtc-guide-setup-check > input { justify-self: end; accent-color: var(--painting-accent); }
.jtc-guide-setup-field > .jtc-guide-field-reason { color: var(--color-error); }
.jtc-guide-setup-footer { position: sticky; bottom: -16px; z-index: 1; display: grid; gap: 8px; padding-block: 12px; margin-block-end: -16px; background: var(--painting-surface); border-top: 1px solid var(--painting-line); }
.jtc-guide-setup-footer > button { width: 100%; }
.jtc-guide-setup [data-guide-emphasis='primary'] { background: var(--painting-accent-soft); border-color: var(--painting-accent); color: var(--painting-accent-deep); font-weight: 600; }
@media (pointer: coarse), (max-width: 980px) { .jtc-guide-support > summary { min-height: 44px; padding-block: 8px; } }
.painting-guide-manual-status { position: absolute; z-index: 190; inset-inline: 12px; bottom: 12px; width: max-content; max-width: calc(100% - 24px); margin-inline: auto; display: grid; gap: 6px; padding: 12px; border: 1px solid var(--painting-line-strong); border-radius: var(--radius-md, 10px); background: var(--painting-surface-raised); color: var(--painting-text-strong); box-shadow: var(--shadow-popover, 0 10px 30px #0002); }
.painting-guide-manual-status strong { font-size: 14px; font-weight: 650; line-height: 1.4; }
.painting-guide-manual-status p { margin: 0; font-size: 12px; line-height: 1.6; color: var(--painting-text-muted); overflow-wrap: anywhere; }
.painting-guide-manual-status > div { display: flex; flex-wrap: wrap; gap: 8px; }
.painting-guide-manual-status button { min-height: 44px; padding: 8px 12px; border: 1px solid var(--painting-line); border-radius: var(--radius-sm, 6px); background: var(--painting-surface); color: var(--painting-text-strong); font: inherit; font-size: 13px; line-height: 1.4; touch-action: manipulation; }
.painting-guide-manual-status button[hidden] { display: none; }
.painting-guide-manual-status button:focus-visible { outline: 2px solid var(--painting-accent); outline-offset: 2px; }
.painting-guide-manual-status[data-phase='error'] p { color: var(--color-error); }
@media (max-width: 980px) { .painting-guide-manual-status { bottom: 76px; } }