/* Deckwright workspace. Root rules are scoped to .uwapp-root.uwapp-deckwright (the body carries .uwapp-deckwright too).
   Own light/dark tokens (html[data-theme] / prefers-color-scheme). The preview desk stays neutral so slides of every
   theme read as slides. Transitions only under prefers-reduced-motion: no-preference. */
@font-face { font-family: 'Noto Sans'; src: url('../threadsmith/fonts/NotoSans-Regular.ttf') format('truetype'); font-display: swap; }
@font-face { font-family: 'Noto Sans Arabic'; src: url('../threadsmith/fonts/NotoSansArabic-Regular.ttf') format('truetype'); unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF; font-display: swap; }
@font-face { font-family: 'Noto Sans Devanagari'; src: url('../threadsmith/fonts/NotoSansDevanagari-Regular.ttf') format('truetype'); unicode-range: U+0900-097F, U+A8E0-A8FF; font-display: swap; }
@font-face { font-family: 'Noto Sans SC'; src: url('fonts/NotoSansSC-Deckwright.ttf') format('truetype'); unicode-range: U+2E80-2FFF, U+3000-303F, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF, U+FF00-FFEF; font-display: swap; }
@font-face { font-family: 'Noto Sans JP'; src: url('fonts/NotoSansJP-Deckwright.ttf') format('truetype'); unicode-range: U+3040-30FF; font-display: swap; }
@font-face { font-family: 'Noto Sans KR'; src: url('fonts/NotoSansKR-Deckwright.ttf') format('truetype'); unicode-range: U+1100-11FF, U+3130-318F, U+AC00-D7AF; font-display: swap; }

.uwapp-root.uwapp-deckwright {
  --dw-bg: #f4f3f6; --dw-surface: #ffffff; --dw-surface-2: #ece9f0; --dw-ink: #1f1a24; --dw-muted: #554d5d;
  --dw-line: #d8d3de; --dw-control: #75697f; --dw-accent: #9d2f5c; --dw-accent-ink: #7f2249; --dw-on-accent: #ffffff;
  --dw-blue: #1f4e79; --dw-warn: #9a3412; --dw-warn-bg: #fff4e5; --dw-ok: #166534; --dw-ok-bg: #ecfdf3; --dw-bad: #b42318; --dw-bad-bg: #fef3f2;
  --dw-focus: #b45309; --dw-desk: #d4d0d9; --dw-desk-2: #c9c4cf;
  background: var(--dw-bg); color: var(--dw-ink); color-scheme: light;
}
:root[data-theme="dark"] .uwapp-root.uwapp-deckwright {
  --dw-bg: #151219; --dw-surface: #1e1a23; --dw-surface-2: #2a2430; --dw-ink: #eee9f2; --dw-muted: #b9afc2;
  --dw-line: #3a3242; --dw-control: #8c8197; --dw-accent: #f08cb5; --dw-accent-ink: #f6b3cf; --dw-on-accent: #2a0b18;
  --dw-blue: #9cc7f0; --dw-warn: #fdba74; --dw-warn-bg: #2b1f12; --dw-ok: #86efac; --dw-ok-bg: #10261a; --dw-bad: #fda29b; --dw-bad-bg: #2e1513;
  --dw-focus: #fbbf24; --dw-desk: #29242e; --dw-desk-2: #231f28;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .uwapp-root.uwapp-deckwright {
    --dw-bg: #151219; --dw-surface: #1e1a23; --dw-surface-2: #2a2430; --dw-ink: #eee9f2; --dw-muted: #b9afc2;
    --dw-line: #3a3242; --dw-control: #8c8197; --dw-accent: #f08cb5; --dw-accent-ink: #f6b3cf; --dw-on-accent: #2a0b18;
    --dw-blue: #9cc7f0; --dw-warn: #fdba74; --dw-warn-bg: #2b1f12; --dw-ok: #86efac; --dw-ok-bg: #10261a; --dw-bad: #fda29b; --dw-bad-bg: #2e1513;
    --dw-focus: #fbbf24; --dw-desk: #29242e; --dw-desk-2: #231f28;
    color-scheme: dark;
  }
}

/* Platform element defaults leak into app workspaces: reset them at zero specificity. */
:where(.dw-app, .dw-dialog, .dw-show) button { font: inherit; font-size: .9rem; font-weight: 600; padding: 0; border: 0; border-radius: 8px; background: none; color: inherit; cursor: pointer; width: auto; min-height: 0; }
:where(.dw-app, .dw-dialog) button:hover { background: none; }
:where(.dw-app, .dw-dialog) :is(input, select, textarea) { font: inherit; font-size: .92rem; color: var(--dw-ink); background: var(--dw-surface); border: 1px solid var(--dw-control); border-radius: 8px; padding: .4rem .55rem; box-sizing: border-box; min-height: 36px; margin: 0; }
:where(.dw-app, .dw-dialog) input[type="checkbox"] { width: 20px; height: 20px; min-height: 0; padding: 0; accent-color: var(--dw-accent); flex: none; }
:where(.dw-app, .dw-dialog) table { border-collapse: collapse; width: 100%; margin: 0; font-size: .9rem; }
:where(.dw-app, .dw-dialog) :is(th, td) { text-align: start; padding: 6px 8px; border-bottom: 1px solid var(--dw-line); vertical-align: top; }
:where(.dw-app, .dw-dialog) thead th { background: var(--dw-surface-2); color: var(--dw-ink); }
:where(.dw-app, .dw-dialog) caption { text-align: start; font-weight: 700; padding: .4rem 0; color: var(--dw-ink); }
:where(.dw-app, .dw-dialog) kbd { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85em; padding: 1px 6px; border: 1px solid var(--dw-control); border-bottom-width: 2px; border-radius: 5px; background: var(--dw-surface-2); color: var(--dw-ink); white-space: nowrap; }
:where(.dw-app, .dw-dialog) code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .88em; background: var(--dw-surface-2); color: var(--dw-ink); padding: 0 .25em; border-radius: 4px; }
:where(.dw-app, .dw-dialog) :is(h2, h3) { color: var(--dw-ink); }
:where(.dw-app, .dw-dialog) a { color: var(--dw-accent-ink); }

.dw-app { display: flex; flex-direction: column; flex: 1; min-height: 0; background: var(--dw-bg); color: var(--dw-ink); }
:is(.dw-app, .dw-dialog, .dw-show) :focus-visible { outline: 3px solid var(--dw-focus); outline-offset: 2px; }
.dw-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.dw-hint { color: var(--dw-muted); font-size: .84rem; margin: .25rem 0 .4rem; }
.dw-warn { color: var(--dw-warn); font-weight: 600; font-size: .9rem; }
.dw-note { font-size: .88rem; color: var(--dw-ink); background: var(--dw-surface-2); border-radius: 8px; padding: .55rem .75rem; }
.dw-wide { width: 100%; }
.dw-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .4rem 0; }
.dw-field { display: flex; flex-direction: column; gap: .25rem; margin: .4rem 0; }
.dw-field > label { font-weight: 600; font-size: .9rem; }
.dw-check-row { display: flex; gap: .5rem; align-items: center; margin: .6rem 0 .2rem; }

/* ---------- buttons */
.dw-btn { display: inline-flex; align-items: center; gap: .4rem; min-height: 36px; padding: .35rem .8rem; border: 1px solid var(--dw-control); border-radius: 8px; background: var(--dw-surface); color: var(--dw-ink); font-size: .88rem; white-space: nowrap; }
.dw-btn:hover:not([disabled]) { background: var(--dw-surface-2); }
.dw-btn[disabled], .dw-icon-btn[disabled] { opacity: .5; cursor: not-allowed; }
.dw-btn-primary, .dw-app button[type=submit].dw-btn-primary { background: var(--dw-accent); border-color: var(--dw-accent); color: var(--dw-on-accent); }
.dw-btn-primary:hover:not([disabled]) { background: var(--dw-accent-ink); border-color: var(--dw-accent-ink); color: var(--dw-on-accent); }
.dw-btn-small { min-height: 30px; padding: .2rem .6rem; font-size: .82rem; }
.dw-icon-btn { display: inline-grid; place-items: center; width: 36px; height: 36px; border: 1px solid transparent; border-radius: 8px; color: var(--dw-ink); flex: none; }
.dw-icon-btn:hover:not([disabled]) { background: var(--dw-surface-2); border-color: var(--dw-line); }

/* ---------- toolbar */
.dw-toolbar { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .9rem; padding: .45rem .9rem; background: var(--dw-surface); border-bottom: 1px solid var(--dw-line); }
.dw-tb-group { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; min-width: 0; }
.dw-grow { flex: 1 1 10rem; }
.dw-name { width: 100%; max-width: 24rem; font-weight: 600; }
.dw-toolbar select { width: auto; max-width: 11rem; }
.dw-savestate { color: var(--dw-muted); font-size: .82rem; }
.dw-menu-wrap { position: relative; }
.dw-menu-btn { display: inline-flex; align-items: center; gap: .2rem; min-height: 36px; padding: .3rem .6rem; border-radius: 8px; color: var(--dw-ink); }
.dw-menu-btn:hover, .dw-menu-btn[aria-expanded="true"] { background: var(--dw-surface-2); }
.dw-menu { position: absolute; inset-inline-start: 0; top: calc(100% + 4px); z-index: 30; min-width: 16rem; max-width: min(24rem, 92vw); padding: .3rem; background: var(--dw-surface); border: 1px solid var(--dw-line); border-radius: 10px; box-shadow: 0 10px 30px rgb(0 0 0 / .18); }
.dw-menu[hidden] { display: none; }
.dw-menu-item { display: flex; justify-content: space-between; gap: 1rem; width: 100%; text-align: start; padding: .45rem .65rem; border-radius: 6px; font-weight: 500; }
.dw-menu-item:is(:hover, :focus) { background: var(--dw-surface-2); }
.dw-menu-item[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.dw-menu-key { color: var(--dw-muted); font-size: .8rem; }
.dw-menu-sep { height: 1px; margin: .3rem .2rem; background: var(--dw-line); }

/* ---------- main layout */
.dw-main { flex: 1; min-height: 0; display: grid; grid-template-columns: 5.6rem 1fr; }
.dw-views { display: flex; flex-direction: column; gap: .25rem; padding: .5rem .35rem; background: var(--dw-surface); border-inline-end: 1px solid var(--dw-line); overflow-y: auto; }
.dw-view { position: relative; display: flex; flex-direction: column; align-items: center; gap: .2rem; padding: .5rem .2rem; border-radius: 10px; color: var(--dw-muted); font-size: .76rem; font-weight: 600; text-align: center; line-height: 1.15; border: 1px solid transparent; }
.dw-view:hover { background: var(--dw-surface-2); color: var(--dw-ink); }
.dw-view[aria-pressed="true"] { background: var(--dw-accent); color: var(--dw-on-accent); }
.dw-count { position: absolute; top: 2px; inset-inline-end: 4px; min-width: 1.2rem; padding: 0 .25rem; border-radius: 999px; background: var(--dw-warn-bg); color: var(--dw-warn); font-size: .7rem; line-height: 1.2rem; }
.dw-count:empty { display: none; }
.dw-content { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.dw-content > [hidden] { display: none; }
.dw-pane-h { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--dw-muted); margin: 0; font-weight: 700; }
.dw-pane-h label { color: inherit; }
.dw-write { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(18rem, 2fr) 3fr; }
.dw-editor-pane { min-height: 0; display: flex; flex-direction: column; gap: .3rem; padding: .6rem .8rem .4rem; background: var(--dw-surface); border-inline-end: 1px solid var(--dw-line); }
.dw-editor { flex: 1; min-height: 12rem; width: 100%; resize: none; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Noto Sans Mono', monospace; font-size: .9rem; line-height: 1.5; tab-size: 2; white-space: pre-wrap; }
.dw-editor-pane .dw-hint { margin: 0; }
.dw-preview-pane { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.dw-previewbar { flex: none; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .3rem; padding: .35rem .7rem; background: var(--dw-surface); border-bottom: 1px solid var(--dw-line); }
.dw-slideno { min-width: 7.5rem; text-align: center; font-size: .86rem; font-variant-numeric: tabular-nums; }
.dw-stage { flex: 1 1 0; min-height: 12rem; overflow: auto; display: grid; place-items: center; padding: 12px; background: repeating-linear-gradient(45deg, var(--dw-desk) 0 12px, var(--dw-desk-2) 12px 24px); }
.dw-slide { display: block; box-shadow: 0 2px 4px rgb(0 0 0 / .15), 0 12px 32px rgb(0 0 0 / .2); max-width: none; }
.dw-error { max-width: 30rem; padding: 1rem 1.2rem; border-radius: 10px; background: var(--dw-surface); color: var(--dw-ink); border: 2px solid var(--dw-warn); }
.dw-below { flex: none; max-height: 34%; overflow-y: auto; padding: .4rem .9rem .6rem; background: var(--dw-surface); border-top: 1px solid var(--dw-line); font-size: .88rem; }
.dw-notes h3 { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--dw-muted); margin: .2rem 0; }
.dw-notes-text { white-space: pre-wrap; margin: .2rem 0; }
.dw-warnings { margin: .2rem 0 .4rem; padding: .45rem .7rem; padding-inline-start: 1.6rem; background: var(--dw-warn-bg); color: var(--dw-warn); border-radius: 8px; font-weight: 600; }
.dw-warnings[hidden] { display: none; }
.dw-status { flex: none; min-height: 1.6rem; padding: .2rem .9rem; font-size: .84rem; color: var(--dw-muted); background: var(--dw-surface); border-top: 1px solid var(--dw-line); }

/* ---------- slides grid */
.dw-slides-view, .dw-check-view { flex: 1; min-height: 0; overflow-y: auto; padding: .8rem 1rem 2rem; }
.dw-grid { list-style: none; margin: .6rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1rem; }
.dw-thumb-btn { display: flex; flex-direction: column; gap: .35rem; width: 100%; padding: .4rem; border-radius: 10px; border: 2px solid transparent; text-align: start; color: var(--dw-ink); }
.dw-thumb-btn:hover { background: var(--dw-surface-2); }
.dw-thumb-btn.dw-current { border-color: var(--dw-accent); }
.dw-thumb { display: block; width: 100%; height: auto; box-shadow: 0 1px 3px rgb(0 0 0 / .2); }
.dw-thumb-cap { display: flex; gap: .4rem; align-items: baseline; font-size: .86rem; font-weight: 600; min-width: 0; }
.dw-thumb-cap > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dw-thumb-n { flex: none; min-width: 1.5rem; color: var(--dw-muted); font-variant-numeric: tabular-nums; }

/* ---------- check */
.dw-check { max-width: 64rem; }
.dw-check-head { padding: .7rem 1rem; border-radius: 10px; margin-bottom: .6rem; }
.dw-check-head h2 { margin: 0 0 .2rem; font-size: 1.2rem; }
.dw-check-head p { margin: .2rem 0; }
.dw-ok { background: var(--dw-ok-bg); }
.dw-ok h2 { color: var(--dw-ok); }
.dw-bad { background: var(--dw-bad-bg); }
.dw-bad h2 { color: var(--dw-bad); }
.dw-check h3 { font-size: 1rem; margin: 1rem 0 .4rem; }
.dw-findings { list-style: none; margin: 0 0 1rem; padding: 0; }
.dw-findings li { display: flex; flex-wrap: wrap; gap: .3rem .7rem; align-items: center; padding: .5rem 0; border-bottom: 1px solid var(--dw-line); }
.dw-sev { flex: none; min-width: 5.2rem; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.dw-f-error .dw-sev { color: var(--dw-bad); }
.dw-f-warning .dw-sev { color: var(--dw-warn); }
.dw-f-info .dw-sev { color: var(--dw-muted); }
.dw-f-text { flex: 1 1 18rem; min-width: 0; }
.dw-wcag { display: inline-block; margin-inline-start: .4rem; padding: 0 .4rem; border-radius: 999px; background: var(--dw-surface-2); font-size: .76rem; color: var(--dw-muted); }
.dw-tablewrap { overflow: auto; margin: .6rem 0 1rem; border: 1px solid var(--dw-line); border-radius: 8px; background: var(--dw-surface); }
.dw-tablewrap table { min-width: 34rem; }
.dw-tablewrap caption { padding: .5rem .6rem; }
.dw-swatches { display: inline-flex; gap: 2px; margin-inline-end: .4rem; vertical-align: middle; }
.dw-swatch { display: inline-block; width: 14px; height: 14px; border-radius: 3px; border: 1px solid var(--dw-control); }
.dw-pass { color: var(--dw-ok); font-weight: 700; }
.dw-fail { color: var(--dw-bad); font-weight: 700; }

/* ---------- dialogs */
.dw-dialog { width: min(34rem, 94vw); max-height: 88vh; padding: 0; border: 1px solid var(--dw-line); border-radius: 14px; background: var(--dw-surface); color: var(--dw-ink); box-shadow: 0 24px 60px rgb(0 0 0 / .3); }
.dw-dialog-wide { width: min(52rem, 94vw); }
.dw-dialog::backdrop { background: rgb(20 10 25 / .55); }
.dw-dialog-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .75rem 1rem .4rem; }
.dw-dialog-head h2 { font-size: 1.15rem; margin: 0; }
.dw-dialog-lede { margin: 0 1rem .4rem; color: var(--dw-muted); font-size: .9rem; }
.dw-dialog-body { padding: .3rem 1rem 1rem; overflow-y: auto; }
.dw-dialog-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.dw-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: .7rem; }
.dw-card { display: flex; flex-direction: column; gap: .3rem; padding: .7rem .8rem; border: 1px solid var(--dw-line); border-radius: 10px; background: var(--dw-bg); }
.dw-card h3 { margin: 0; font-size: 1rem; }
.dw-card p { margin: 0 0 .3rem; flex: 1; font-size: .88rem; color: var(--dw-muted); }
.dw-card .dw-btn { align-self: flex-start; }
.dw-recent { list-style: none; margin: 0; padding: 0; }
.dw-recent li { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .5rem 0; border-bottom: 1px solid var(--dw-line); }
.dw-recent-text { flex: 1 1 14rem; display: flex; flex-direction: column; min-width: 0; }
.dw-badge { align-self: flex-start; font-size: .75rem; padding: 0 .4rem; border-radius: 999px; background: var(--dw-surface-2); }

/* ---------- presenter view */
.dw-presenter-dlg { width: min(96rem, 98vw); max-height: 96vh; }
.dw-presenter { display: grid; grid-template-columns: minmax(0, 3fr) minmax(14rem, 1.3fr); gap: 1rem; }
.dw-p-main, .dw-p-side { min-width: 0; display: flex; flex-direction: column; gap: .4rem; }
.dw-p-current, .dw-p-next { background: repeating-linear-gradient(45deg, var(--dw-desk) 0 12px, var(--dw-desk-2) 12px 24px); padding: 8px; border-radius: 8px; }
.dw-p-svg { display: block; width: 100%; height: auto; }
.dw-p-pos { margin: 0; font-weight: 600; }
.dw-p-nav { display: flex; flex-wrap: wrap; gap: .5rem; }
.dw-p-notes-head { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.dw-p-notes-head h3 { margin: .3rem auto .3rem 0; font-size: 1rem; }
.dw-p-notes { min-height: 6rem; max-height: 30vh; overflow-y: auto; padding: .5rem .7rem; border: 1px solid var(--dw-line); border-radius: 8px; white-space: pre-wrap; line-height: 1.45; }
.dw-p-notes p { margin: 0; }
.dw-p-side h3 { margin: .4rem 0 0; font-size: 1rem; }
.dw-p-time { padding: .5rem .8rem; border-radius: 10px; background: var(--dw-surface-2); }
.dw-p-clock { margin: 0; font-size: 2.6rem; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.1; }
.dw-p-remain { margin: .2rem 0 0; color: var(--dw-muted); font-variant-numeric: tabular-nums; }
.dw-p-remain.dw-over { color: var(--dw-bad); font-weight: 700; }

/* ---------- slide show (this window and the audience window) */
.dw-show { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; background: #000000; color: #ffffff; }
.dw-show-slide { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.dw-show-svg { display: block; max-width: 100%; max-height: 100%; width: 100%; height: 100%; }
.dw-show-exit { position: absolute; top: .6rem; inset-inline-end: .6rem; padding: .35rem .7rem; border-radius: 8px; background: rgb(0 0 0 / .75); color: #ffffff; border: 1px solid #8a8a8a; font-size: .85rem; opacity: .85; }
.dw-show-exit:hover, .dw-show-exit:focus-visible { opacity: 1; }
.dw-show :focus-visible { outline-color: #fbbf24; }
.dw-aud-msg { position: absolute; margin: 0; font-size: 1.3rem; color: #e5e5e5; }
.dw-aud-msg[hidden] { display: none; }
html.dw-audience-mode .uwapp-bar { display: none; }

/* ---------- narrow screens: views on top, preview above the editor */
@media (max-width: 900px) {
  .dw-main { display: flex; flex-direction: column; min-height: 0; }
  .dw-views { flex-direction: row; overflow-x: auto; border-inline-end: 0; border-bottom: 1px solid var(--dw-line); padding: .3rem; }
  .dw-view { flex: 1 0 auto; flex-direction: row; justify-content: center; min-width: 5.5rem; font-size: .82rem; padding: .45rem .5rem; }
  .dw-content { flex: 1; overflow-y: auto; }
  .dw-write { display: flex; flex-direction: column; }
  .dw-preview-pane { order: 1; flex: none; }
  .dw-editor-pane { order: 2; flex: none; border-inline-end: 0; border-top: 1px solid var(--dw-line); }
  .dw-stage { flex: none; height: min(58vw, 22rem); min-height: 0; }
  .dw-editor { min-height: 22rem; flex: none; }
  .dw-below { max-height: none; }
  .dw-name { max-width: none; }
  .dw-presenter { grid-template-columns: 1fr; }
}
@media (max-width: 420px) {
  .dw-toolbar { padding: .4rem .5rem; gap: .35rem .5rem; }
  .dw-toolbar select { max-width: 9rem; }
  .dw-grid { grid-template-columns: 1fr; }
  .dw-view { min-width: 0; flex: 1 1 0; padding: .45rem .25rem; font-size: .78rem; gap: .25rem; }
}
@media (prefers-reduced-motion: no-preference) {
  .dw-view, .dw-btn, .dw-menu-item, .dw-thumb-btn { transition: background-color .12s ease, color .12s ease, border-color .12s ease; }
}