/* Skins decorate the desk without changing the resizable pane geometry. */

/* Original, non-figurative correspondence ornaments; no external images or fonts. */
body {
  --violet-vine: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22280%22%20height%3D%22110%22%20viewBox%3D%220%200%20280%20110%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M4%2011C60%2047%20105-2%20159%2020S233%207%20277%2014M48%2029c-2%2021%209%2032%205%2052m30-56c4%2011%2011%2022%208%2040m42-48c-8%2020-2%2032-6%2045m49-39c-2%2022%207%2035%201%2062m40-63c-3%2010%205%2018%202%2030m31-32c2%2015%208%2020%204%2038%22%20stroke%3D%22%23b4a373%22%20stroke-width%3D%221.3%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.68%22%2F%3E%3Cg%20fill%3D%22%23b6a3d0%22%20opacity%3D%22.77%22%3E%3Cellipse%20cx%3D%2248%22%20cy%3D%2239%22%20rx%3D%224%22%20ry%3D%227%22%20transform%3D%22rotate(-32%2048%2039)%22%2F%3E%3Cellipse%20cx%3D%2257%22%20cy%3D%2244%22%20rx%3D%224%22%20ry%3D%227%22%20transform%3D%22rotate(30%2057%2044)%22%2F%3E%3Cellipse%20cx%3D%2249%22%20cy%3D%2252%22%20rx%3D%224%22%20ry%3D%227%22%20transform%3D%22rotate(-25%2049%2052)%22%2F%3E%3Cellipse%20cx%3D%2257%22%20cy%3D%2258%22%20rx%3D%223.5%22%20ry%3D%226%22%20transform%3D%22rotate(27%2057%2058)%22%2F%3E%3Cellipse%20cx%3D%2252%22%20cy%3D%2270%22%20rx%3D%223%22%20ry%3D%225%22%2F%3E%3Cellipse%20cx%3D%2285%22%20cy%3D%2236%22%20rx%3D%223.5%22%20ry%3D%226%22%20transform%3D%22rotate(-27%2085%2036)%22%2F%3E%3Cellipse%20cx%3D%2294%22%20cy%3D%2244%22%20rx%3D%223.5%22%20ry%3D%226%22%20transform%3D%22rotate(24%2094%2044)%22%2F%3E%3Cellipse%20cx%3D%2290%22%20cy%3D%2257%22%20rx%3D%223%22%20ry%3D%225%22%2F%3E%3Cellipse%20cx%3D%22129%22%20cy%3D%2228%22%20rx%3D%223.5%22%20ry%3D%226%22%20transform%3D%22rotate(-30%20129%2028)%22%2F%3E%3Cellipse%20cx%3D%22136%22%20cy%3D%2236%22%20rx%3D%223.5%22%20ry%3D%226%22%20transform%3D%22rotate(30%20136%2036)%22%2F%3E%3Cellipse%20cx%3D%22127%22%20cy%3D%2245%22%20rx%3D%223.5%22%20ry%3D%226%22%20transform%3D%22rotate(-25%20127%2045)%22%2F%3E%3Cellipse%20cx%3D%22129%22%20cy%3D%2256%22%20rx%3D%222.5%22%20ry%3D%225%22%2F%3E%3Cellipse%20cx%3D%22173%22%20cy%3D%2238%22%20rx%3D%224%22%20ry%3D%227%22%20transform%3D%22rotate(-32%20173%2038)%22%2F%3E%3Cellipse%20cx%3D%22182%22%20cy%3D%2243%22%20rx%3D%224%22%20ry%3D%227%22%20transform%3D%22rotate(30%20182%2043)%22%2F%3E%3Cellipse%20cx%3D%22176%22%20cy%3D%2251%22%20rx%3D%224%22%20ry%3D%227%22%20transform%3D%22rotate(-30%20176%2051)%22%2F%3E%3Cellipse%20cx%3D%22183%22%20cy%3D%2260%22%20rx%3D%223.5%22%20ry%3D%226%22%20transform%3D%22rotate(28%20183%2060)%22%2F%3E%3Cellipse%20cx%3D%22176%22%20cy%3D%2272%22%20rx%3D%223%22%20ry%3D%225%22%2F%3E%3Cellipse%20cx%3D%22217%22%20cy%3D%2234%22%20rx%3D%223%22%20ry%3D%226%22%20transform%3D%22rotate(-27%20217%2034)%22%2F%3E%3Cellipse%20cx%3D%22224%22%20cy%3D%2242%22%20rx%3D%223%22%20ry%3D%225%22%2F%3E%3Cellipse%20cx%3D%22250%22%20cy%3D%2230%22%20rx%3D%223.5%22%20ry%3D%226%22%20transform%3D%22rotate(-28%20250%2030)%22%2F%3E%3Cellipse%20cx%3D%22259%22%20cy%3D%2240%22%20rx%3D%223%22%20ry%3D%226%22%20transform%3D%22rotate(25%20259%2040)%22%2F%3E%3Cellipse%20cx%3D%22255%22%20cy%3D%2251%22%20rx%3D%223%22%20ry%3D%225%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%2393a995%22%20opacity%3D%22.55%22%3E%3Cpath%20d%3D%22M26%2023q-1-13%2014-13-1%2011-14%2013m35%207q2-13%2014-9-3%2011-14%209m85-11q3-13%2016-8-4%2011-16%208m51%207q2-12%2015-9-4%2010-15%209m37-7q2-13%2016-9-4%2011-16%209%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  --violet-rule: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22180%22%20height%3D%2212%22%20viewBox%3D%220%200%20180%2012%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M0%206h61m58%200h61M65%206h10m30%200h10M80%206l5-4%205%204-5%204-5-4Zm10%200%205-4%205%204-5%204-5-4Z%22%20stroke%3D%22%23b49b65%22%20stroke-width%3D%22.8%22%2F%3E%3Ccircle%20cx%3D%2290%22%20cy%3D%226%22%20r%3D%222%22%20fill%3D%22%23538073%22%2F%3E%3C%2Fsvg%3E");
  --violet-letter: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22320%22%20height%3D%22190%22%20viewBox%3D%220%200%20320%20190%22%20fill%3D%22none%22%3E%3Cg%20transform%3D%22rotate(-8%20174%2095)%22%3E%3Crect%20x%3D%2259%22%20y%3D%2240%22%20width%3D%22230%22%20height%3D%22126%22%20rx%3D%223%22%20fill%3D%22%23faf0d5%22%20fill-opacity%3D%22.06%22%20stroke%3D%22%23d8c28f%22%20stroke-opacity%3D%22.66%22%2F%3E%3Crect%20x%3D%2265%22%20y%3D%2246%22%20width%3D%22218%22%20height%3D%22114%22%20rx%3D%222%22%20stroke%3D%22%23d8c28f%22%20stroke-opacity%3D%22.24%22%2F%3E%3Cpath%20d%3D%22m61%2043%20113%2077L287%2043M61%20164l82-66m144%2066-82-66%22%20stroke%3D%22%23d8c28f%22%20stroke-opacity%3D%22.55%22%2F%3E%3Cpath%20d%3D%22M252%2059h18v23h-18z%22%20stroke%3D%22%23cdbf94%22%20stroke-dasharray%3D%222%202%22%20stroke-opacity%3D%22.7%22%2F%3E%3Cpath%20d%3D%22m256%2071%205-5%205%205-5%205-5-5Z%22%20fill%3D%22%23cdbf94%22%20fill-opacity%3D%22.5%22%2F%3E%3Ccircle%20cx%3D%22174%22%20cy%3D%22119%22%20r%3D%2219%22%20fill%3D%22%23244f46%22%20stroke%3D%22%23cfb574%22%2F%3E%3Ccircle%20cx%3D%22174%22%20cy%3D%22119%22%20r%3D%2215%22%20stroke%3D%22%23cfb574%22%20stroke-opacity%3D%22.63%22%2F%3E%3Cpath%20d%3D%22m174%20107%208%2012-8%2012-8-12%208-12Z%22%20fill%3D%22%23467c67%22%20stroke%3D%22%23d2c197%22%2F%3E%3Cpath%20d%3D%22m174%20110%204%209-4%209%22%20stroke%3D%22%23a4c1a1%22%20stroke-opacity%3D%22.65%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M38%20125c-16%202-16%2018%200%2020m-7-10%208%201m-19-11c8-4%2014-4%2021-1M17%20148c9-4%2015-4%2022-1%22%20stroke%3D%22%23cbb584%22%20stroke-opacity%3D%22.38%22%2F%3E%3C%2Fsvg%3E");
  --violet-postmark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22176%22%20height%3D%2292%22%20viewBox%3D%220%200%20176%2092%22%20fill%3D%22none%22%3E%3Cg%20stroke%3D%22%23b59b67%22%20stroke-width%3D%22.9%22%20opacity%3D%22.5%22%3E%3Ccircle%20cx%3D%2247%22%20cy%3D%2246%22%20r%3D%2230%22%2F%3E%3Ccircle%20cx%3D%2247%22%20cy%3D%2246%22%20r%3D%2224%22%2F%3E%3Cpath%20d%3D%22M22%2036h50M22%2056h50m-8-33%203%202m-12-6%201%203m-17-3%201%203m-10%201-3%202m0%2042%203-2m10%207%201-3m14%203%201-3m8-4%203%202M89%2027c15-12%2028%2012%2043%200s28%2012%2043%200M89%2038c15-12%2028%2012%2043%200s28%2012%2043%200M89%2049c15-12%2028%2012%2043%200s28%2012%2043%200M89%2060c15-12%2028%2012%2043%200s28%2012%2043%200%22%2F%3E%3Cpath%20d%3D%22m39%2046%208-5%208%205-8%205-8-5Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
body[data-decoration="off"] {
  --violet-vine: none;
  --violet-rule: none;
  --violet-letter: none;
  --violet-postmark: none;
}

body {
  --skin-accent: #a65348;
  --skin-accent-ink: #fff;
  --skin-ink: #26384b;
  --skin-muted: #687780;
  --skin-surface: #fffdf9;
  --skin-surface-raised: #fff;
  --skin-border: #ded8cd;
  --skin-soft: #f4f0e8;
  --skin-paper: #fffdf8;
  --skin-paper-ink: #303943;
  --skin-focus: #a65348;
  --skin-shadow: #172c401c;
}

body[data-theme="violet"] {
  --skin-accent: #315d6d;
  --skin-accent-ink: #fff;
  --skin-ink: #273e48;
  --skin-muted: #5f6c65;
  --skin-surface: #faf6eb;
  --skin-surface-raised: #fffdf6;
  --skin-border: #dcd2bb;
  --skin-soft: #eee8d9;
  --skin-paper: #fffcf3;
  --skin-paper-ink: #303b3b;
  --skin-focus: #315d6d;
  --skin-shadow: #213c4320;
  --skin-gold: #9b7c44;
  color: var(--skin-ink);
  background: #e9e2d3;
  color-scheme: light;
}

body[data-theme="night"] {
  --skin-accent: #adc4e0;
  --skin-accent-ink: #142333;
  --skin-ink: #dce5ef;
  --skin-muted: #a5b4c7;
  --skin-surface: #192535;
  --skin-surface-raised: #213045;
  --skin-border: #3b4c63;
  --skin-soft: #26374c;
  --skin-paper: #192634;
  --skin-paper-ink: #dce2e8;
  --skin-focus: #b0cbea;
  --skin-shadow: #060c1466;
  --skin-gold: #d8bd84;
  color: var(--skin-ink);
  background: #101a29;
  color-scheme: dark;
}

/* Reading controls also work with the unchanged classic skin. */
body .paper-text,
body.layout-ready .paper-text,
body .editing-pane textarea,
body.layout-ready .editing-pane textarea,
body .snapshot-text,
body .submission-grid #feedbackContent,
body .appearance-sample p {
  font-family: var(--reader-font, "Songti SC", "Noto Serif CJK SC", "SimSun", serif);
  font-size: var(--reader-size, 16px);
  line-height: var(--reader-line, 2);
}
body .paper-text,
body .editing-pane textarea,
body .editing-pane textarea:focus,
body .snapshot-text,
body .submission-grid #feedbackContent,
body .appearance-sample {
  background-color: var(--reader-paper, var(--skin-paper));
  color: var(--reader-ink, var(--skin-paper-ink));
}
body[data-theme="classic"] .paper-text,
body:not([data-theme]) .paper-text {
  background-color: var(--reader-paper, #fcfbf8);
  color: var(--reader-ink, #313b42);
}
body[data-theme="classic"] .editing-pane textarea,
body:not([data-theme]) .editing-pane textarea {
  background-color: var(--reader-paper, #fff);
  color: var(--reader-ink, #263444);
}
body[data-theme="classic"] .button-primary {
  background: var(--theme-accent, #b65f53);
  color: var(--theme-accent-ink, #fff);
}
body[data-theme="classic"] .button-primary:hover:not(:disabled) {
  background: var(--theme-accent, #a45046);
}

/* Shared surface and form treatment for the two complete themes. */
body:is([data-theme="violet"], [data-theme="night"]) :is(.workspace, .shutdown-screen) {
  background: var(--skin-soft);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.chapters-pane, .comments-pane, .original-pane) {
  background: var(--skin-surface);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.chapter-header, .writing-actions, .document-toolbar, .comments-head, .document-pane) {
  background: var(--skin-surface-raised);
  border-color: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.chapter-identity h1, .pane-heading h2, .document-label, .comment-text, .overview-head h1, .overview-card h3) {
  color: var(--skin-ink);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.card-meta, .eyebrow, .sidebar-note, .save-state, .word-count, .document-toolbar small, .comments-head small, .comment-foot, .comment-empty, .muted, .optional, .overview-head p, .card-message, .overview-empty, .modal-copy, .connection-steps, .shutdown-screen p, .empty-state p, .auth-card>p, .file-drop small, .preview-row span, .comment-history .history-hint) {
  color: var(--skin-muted);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.button-primary, .desk-nav #jobCount:not(:empty)) {
  background: var(--theme-accent, var(--skin-accent));
  color: var(--theme-accent-ink, var(--skin-accent-ink));
  border-color: var(--theme-accent, var(--skin-accent));
}
body:is([data-theme="violet"], [data-theme="night"]) .button-primary:hover:not(:disabled) {
  filter: brightness(.94);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.button-light, .icon-button, .document-toolbar select, .revision-summary button) {
  background: var(--skin-surface-raised);
  color: var(--skin-ink);
  border-color: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.button-light, .icon-button):hover:not(:disabled) {
  background: var(--skin-soft);
  border-color: var(--theme-accent, var(--skin-accent));
}
body:is([data-theme="violet"], [data-theme="night"]) .button-outline {
  background: transparent;
  color: var(--skin-accent);
  border-color: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) .button-outline:hover:not(:disabled) {
  background: var(--skin-soft);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.text-button, .comment-foot button) {
  color: var(--skin-accent);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--theme-accent, var(--skin-focus));
  outline-offset: 3px;
}
body:is([data-theme="violet"], [data-theme="night"]) .editing-pane textarea:focus-visible {
  outline-offset: -3px;
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.overview-card, .comment-card, .auth-card, .learning-report) {
  background: var(--skin-surface-raised);
  color: var(--skin-ink);
  border-color: var(--skin-border);
  box-shadow: 0 3px 15px var(--skin-shadow);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.overview-empty, .comment-compose, .comment-history, .account-identity, .account-section, .compact-row, .auth-card .auth-note, .import-preview) {
  border-color: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.selection-preview, .file-drop, .token-reveal, .connection-status, .preview-heading, .empty-icon, .layout-all-hidden) {
  background: var(--skin-soft);
  color: var(--skin-ink);
  border-color: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.file-drop:hover, .preview-row) {
  background: var(--skin-surface-raised);
  border-color: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) .comment-quote {
  color: var(--skin-accent);
  border-color: var(--skin-gold);
}
body:is([data-theme="violet"], [data-theme="night"]) .comment-history summary {
  color: var(--skin-muted);
}
body:is([data-theme="violet"], [data-theme="night"]) .modal {
  background: var(--skin-surface);
  color: var(--skin-ink);
  border-color: var(--skin-border);
  box-shadow: 0 28px 90px #05132070;
}
body:is([data-theme="violet"], [data-theme="night"]) .modal::backdrop {
  background: #081929b5;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.modal input:not([type="file"]), .modal select, .modal textarea, .comment-compose textarea, .auth-card input) {
  background: var(--skin-surface-raised);
  color: var(--skin-ink);
  border-color: var(--skin-border);
  outline-color: var(--skin-focus);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(input, textarea)::placeholder {
  color: var(--skin-muted);
  opacity: .92;
}
body:is([data-theme="violet"], [data-theme="night"]) .modal textarea[readonly] {
  background: var(--skin-soft);
}
body:is([data-theme="violet"], [data-theme="night"]) .token-reveal p,
body:is([data-theme="violet"], [data-theme="night"]) .invitation-code {
  color: var(--skin-muted);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.status-pill, .count-badge, .chapter-number) {
  background: var(--skin-soft);
  color: var(--skin-ink);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.project-card, .chapter-card) {
  color: var(--skin-ink);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.project-card, .chapter-card):hover {
  background: var(--skin-soft);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.project-card, .chapter-card).active {
  background: var(--skin-surface-raised);
  border-color: var(--skin-border);
  box-shadow: 0 2px 10px var(--skin-shadow);
}
body:is([data-theme="violet"], [data-theme="night"]) .chapter-card.active .chapter-number {
  background: var(--theme-accent, var(--skin-accent));
  color: var(--theme-accent-ink, var(--skin-accent-ink));
}

/* Layout furniture: colors only; sizes and pointer behavior remain in layout.css. */
body:is([data-theme="violet"], [data-theme="night"]).layout-ready .layout-toolbar {
  background: var(--skin-surface);
  border-color: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.layout-toolbar-label, .layout-toolbar-tip, .layout-region-button, .layout-reset, .layout-collapse, .layout-expand) {
  color: var(--skin-muted);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.layout-region-button.active, .layout-region-button:hover, .layout-reset:hover, .layout-collapse:hover, .layout-expand:hover) {
  color: var(--skin-ink);
  background: var(--skin-soft);
  border-color: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.layout-pane-bar, .layout-pane-rail) {
  color: var(--skin-muted);
  background: var(--skin-soft);
  border-color: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) .layout-separator {
  background: var(--skin-border);
}
body:is([data-theme="violet"], [data-theme="night"]) .layout-separator.disabled {
  background: var(--skin-soft);
}
body:is([data-theme="violet"], [data-theme="night"]) :is(.layout-separator:hover, .layout-separator.dragging, .layout-separator:focus-visible)::after {
  background: var(--theme-accent, var(--skin-accent));
}

/* Violet Evergarden: dark blue correspondence cabinet and warm manuscript paper. */
body[data-theme="violet"] .topbar {
  background:
    var(--violet-vine) 43% -18px / 280px 110px no-repeat,
    linear-gradient(110deg, #1d3541, #294754 65%, #304b55);
  border-bottom: 1px solid #ae9563;
  box-shadow: 0 2px 10px #182f4024;
}
body[data-theme="violet"] .brand {
  color: #fff8e7;
  letter-spacing: .07em;
}
body[data-theme="violet"] .brand-mark {
  background: radial-gradient(ellipse at 34% 22%, #74a18a 0, #396e63 24%, #18483e 72%);
  color: #f7e9b9;
  border: 1px solid #c4a968;
  border-radius: 50%;
  box-shadow: inset 0 0 0 2px #244d48, 0 2px 8px #091e263d;
}
body[data-theme="violet"] .topbar :is(.button-quiet, .button-dark) {
  color: #f2eddd;
  border-color: #6f807f;
  background: #ffffff08;
}
body[data-theme="violet"] .topbar :is(.button-quiet, .button-dark):hover {
  background: #fff1ce16;
  border-color: #c0aa7b;
}
body[data-theme="violet"] .projects-pane {
  background:
    var(--violet-postmark) right 12px bottom 72px / 125px 66px no-repeat,
    linear-gradient(170deg, #243d48 0%, #1c333f 100%);
  color: #efe9dc;
}
body[data-theme="violet"] .projects-pane .pane-heading {
  background: var(--violet-rule) center bottom 2px / 142px 8px no-repeat;
}
body[data-theme="violet"] .projects-pane :is(.pane-heading h2, .project-card, .desk-nav button) {
  color: #e8e8df;
}
body[data-theme="violet"] .projects-pane :is(.eyebrow, .card-meta, .sidebar-note) {
  color: #b9c8c9;
}
body[data-theme="violet"] .projects-pane .icon-button {
  color: #e8dbc0;
  background: #304b56;
  border-color: #60716e;
}
body[data-theme="violet"] .projects-pane .desk-nav button:hover,
body[data-theme="violet"] .projects-pane .project-card:hover {
  background: #e9dcc814;
}
body[data-theme="violet"] .projects-pane .desk-nav button.active {
  background: #e6d2a621;
  color: #f9e3b3;
  box-shadow: inset 2px 0 #c5a765;
}
body[data-theme="violet"] .project-card.active {
  background: #f9f3e8;
  border-color: #d2bd8c;
  color: #293f48;
  box-shadow: 0 3px 12px #071f2933;
}
body[data-theme="violet"] .projects-pane .project-card.active .card-meta {
  color: #687570;
}
body[data-theme="violet"] .project-initial {
  background: #37565a;
  color: #f5e6c1;
  border: 1px solid #7b887b;
  border-radius: 5px;
}
body[data-theme="violet"] .projects-pane .layout-pane-bar {
  background: #243c47;
  color: #c3cdc7;
  border-color: #4d615f;
}
body[data-theme="violet"] .projects-pane .layout-pane-bar .layout-collapse {
  color: #cfdbd4;
}
body[data-theme="violet"] .projects-pane .layout-pane-rail {
  background: #243d48;
  border-color: #5e7168;
}
body[data-theme="violet"] .projects-pane .layout-expand {
  color: #e7d5ad;
}
body[data-theme="violet"] .projects-pane .layout-expand:hover {
  background: #35515b;
  color: #fff4d7;
}
body[data-theme="violet"] .chapter-identity h1,
body[data-theme="violet"] .overview-head h1 {
  font-family: "Songti SC", "Noto Serif CJK SC", "SimSun", serif;
  letter-spacing: .035em;
}
body[data-theme="violet"] .chapter-header {
  background:
    var(--violet-vine) right -18px top -38px / 214px 84px no-repeat,
    var(--violet-rule) 46% calc(100% - 5px) / 148px 10px no-repeat,
    linear-gradient(100deg, #fffdf7, #f8f2e3);
  border-bottom-color: #d8caa8;
}
body[data-theme="violet"] .chapter-identity .eyebrow,
body[data-theme="violet"] .chapters-pane .eyebrow {
  color: #8b734a;
}
body[data-theme="violet"] .review-info {
  color: #716346;
  background: #f3eddd;
  border-color: #e2d7bd;
}
body[data-theme="violet"] .button-learn {
  background: #315f53;
  border-color: #315f53;
  color: #fffdf1;
}
body[data-theme="violet"] .button-learn:hover {
  background: #264c42;
}
body[data-theme="violet"] :is(.manual-learning-guide, .learning-guide) {
  background: #eaf0e5;
  color: #48604d;
  border-color: #cddbc8;
}
body[data-theme="violet"] .learning-details summary {
  color: #315f53;
}
body[data-theme="violet"] .auth-screen {
  background:
    var(--violet-vine) right 6% top 4% / 430px 169px no-repeat,
    var(--violet-postmark) left 8% bottom 7% / 235px 123px no-repeat,
    linear-gradient(140deg, #e8dfcb, #f4edde);
}
body[data-theme="violet"] .auth-card {
  background: #fffaf0f5;
  border-color: #ccb88c;
  box-shadow: 0 25px 80px #102d4059;
}

/* All ornaments are background layers or paint-only accents, never layout items. */
body[data-theme="violet"] .document-toolbar,
body[data-theme="violet"] .comments-head {
  background-image: var(--violet-rule);
  background-repeat: no-repeat;
  background-position: center bottom 3px;
  background-size: 112px 8px;
}
body[data-theme="violet"] .chapter-number {
  border-radius: 2px;
  box-shadow: inset 0 0 0 1px #b59b6759;
}
body[data-theme="violet"] .chapters-pane {
  background-image: var(--violet-rule);
  background-repeat: no-repeat;
  background-position: center bottom 54px;
  background-size: 128px 9px;
}
body[data-theme="violet"] .project-card.active {
  box-shadow: inset 3px 0 #b89d65, 0 3px 12px #071f2933;
}

/* Night reading keeps status colors and annotations distinct from the dark paper. */
body[data-theme="night"] .topbar {
  background: #101b2b;
  border-bottom-color: #51637e;
}
body[data-theme="night"] .brand-mark {
  color: #eddfb8;
  background: #324960;
  border: 1px solid #7a8e9e;
}
body[data-theme="night"] .topbar :is(.button-quiet, .button-dark) {
  color: #dde6f3;
  border-color: #52637c;
  background: #223047;
}
body[data-theme="night"] .topbar :is(.button-quiet, .button-dark):hover {
  background: #344961;
}
body[data-theme="night"] .projects-pane,
body[data-theme="night"] .auth-screen {
  background: #142132;
}
body[data-theme="night"] .project-initial {
  background: #3d5875;
  color: #f2e6c9;
}
body[data-theme="night"] .desk-nav button {
  color: #bbc8da;
}
body[data-theme="night"] .desk-nav button:hover {
  background: #263a52;
}
body[data-theme="night"] .desk-nav button.active {
  color: #f0dfb8;
  background: #2d4056;
  box-shadow: inset 2px 0 #d2b87e;
}
body[data-theme="night"] .review-info {
  color: #d5c7a8;
  background: #303331;
  border-color: #56564b;
}
body[data-theme="night"] :is(.manual-learning-guide, .learning-guide, .new-version-notice) {
  background: #223c36;
  color: #c0ddcc;
  border-color: #466558;
}
body[data-theme="night"] .new-version-notice .text-button,
body[data-theme="night"] .learning-details summary {
  color: #b9e2cb;
}
body[data-theme="night"] .button-learn {
  color: #132b25;
  background: #a6d4bd;
  border-color: #a6d4bd;
}
body[data-theme="night"] .button-learn:hover {
  background: #baddc9;
}
body[data-theme="night"] .task-running {
  background: #2c4666;
  color: #d3e7ff;
}
body[data-theme="night"] .task-completed {
  background: #2b473b;
  color: #c1e4c9;
}
body[data-theme="night"] :is(.task-failed, .task-needs_attention) {
  background: #593f40;
  color: #ffdbcb;
}
body[data-theme="night"] .task-cancelled {
  background: #394351;
  color: #ced4df;
}
body[data-theme="night"] .save-state.warning {
  color: #ffc1aa;
}
body[data-theme="night"] .revision-summary {
  background: #253f34;
  border-color: #4a6a55;
  color: #c6e4cb;
}
body[data-theme="night"] .revision-added {
  background: #244b39;
  color: #c1f1d1;
}
body[data-theme="night"] :is(.paper-text, .snapshot-text) .source-annotation-highlight {
  background: #ead494;
  color: #303125;
}
body[data-theme="night"] .revision-added.source-annotation-highlight {
  background: #ead494;
  color: #164e32;
  box-shadow: inset 0 -2px #5b815b;
}
/* When a light reading paper is explicitly chosen, the green marks stay light too. */
body[data-theme="night"][data-reader-paper="white"] .revision-added,
body[data-theme="night"][data-reader-paper="warm"] .revision-added {
  color: #195c3e;
  background: #dff1e3;
}
body[data-theme="night"] .modal-status {
  background: #294332;
  color: #d1e8ce;
  border-color: #526b4f;
}
body[data-theme="night"] .modal-status.error {
  background: #523936;
  color: #ffd8c8;
  border-color: #91665b;
}

/* Appearance settings are a visual sampler, not another application workspace. */
.appearance-modal {
  width: min(850px, calc(100vw - 32px));
  padding: 26px;
  background: var(--skin-surface);
  color: var(--skin-ink);
}
.appearance-modal .modal-head { margin-bottom: 18px; }
.theme-intro {
  position: relative;
  isolation: isolate;
  min-height: 174px;
  overflow: hidden;
  border: 1px solid #9f956f;
  border-radius: 10px;
  padding: 28px 30px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  background:
    var(--violet-letter) right 15px center / 285px 169px no-repeat,
    var(--violet-vine) right -18px top -29px / 280px 110px no-repeat,
    linear-gradient(110deg, #203b47, #36545c);
  color: #fff7e8;
}
.theme-intro::before {
  content: "";
  position: absolute;
  inset: 8px;
  z-index: -1;
  border: 1px solid #ccb78145;
  border-radius: 5px;
  pointer-events: none;
}
.theme-intro h3 {
  font: 600 27px/1.4 "Songti SC", "Noto Serif CJK SC", "SimSun", serif;
  letter-spacing: .12em;
  margin: 0 0 8px;
  max-width: 60%;
}
.theme-intro p {
  max-width: 53%;
  color: #ece4cf;
  margin: 0;
  font-size: 12px;
  line-height: 1.85;
}
body .appearance-modal .theme-intro .eyebrow { color: #ead4a1; }
.theme-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 19px 0 21px;
}
.theme-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 6px;
  padding: 10px;
  text-align: left;
  border: 1px solid var(--skin-border);
  border-radius: 9px;
  background: var(--skin-surface-raised);
  color: var(--skin-ink);
  transition: border-color .16s, box-shadow .16s, transform .16s;
}
.theme-card:hover { transform: translateY(-2px); }
.theme-card[aria-pressed="true"] {
  border-color: var(--theme-accent, var(--skin-accent));
  box-shadow: 0 0 0 2px var(--theme-accent, var(--skin-accent));
}
.theme-card[aria-pressed="true"]::after {
  content: "✓";
  position: absolute;
  top: 16px;
  right: 16px;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  font: 700 13px/1 system-ui, sans-serif;
  background: var(--theme-accent, var(--skin-accent));
  color: var(--theme-accent-ink, var(--skin-accent-ink));
  border: 1px solid #ffffff91;
}
.theme-card strong { font-size: 13px; margin: 3px 2px 0; }
.theme-card small { color: var(--skin-muted); font-size: 11px; line-height: 1.6; margin: 0 2px 2px; }
.theme-swatch {
  display: block;
  width: 100%;
  height: 74px;
  overflow: hidden;
  border-radius: 5px;
  border: 1px solid #26384b24;
  background: linear-gradient(180deg, #18283b 0 13px, transparent 13px), linear-gradient(90deg, #e9e6df 0 25%, #f7f5f0 25% 43%, #fffdf8 43% 78%, #efece4 78%);
}
.theme-card[data-choice="violet"] .theme-swatch {
  background-color: #fffaf0;
  background-image:
    var(--violet-vine),
    var(--violet-rule),
    linear-gradient(180deg, #294754 0 12px, transparent 12px),
    linear-gradient(90deg, #203d49 0 27%, #bba16d 27% 29%, #efe6d1 29% 44%, #fffaf0 44% 78%, #eee7d5 78%);
  background-position: right -18px top -8px, 72% calc(100% - 6px), 0 0, 0 0;
  background-size: 142px 56px, 80px 6px, 100% 100%, 100% 100%;
  background-repeat: no-repeat;
  border-color: #bca879;
}
.theme-card[data-choice="night"] .theme-swatch {
  background: linear-gradient(180deg, #101b2b 0 13px, transparent 13px), linear-gradient(90deg, #142132 0 25%, #25364c 25% 43%, #192634 43% 78%, #23354a 78%);
  border-color: #536980;
}
.appearance-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 24px;
  row-gap: 2px;
  margin: 0;
  border: 0;
  padding: 3px 0 0;
  border-top: 1px solid var(--skin-border);
}
.appearance-modal .appearance-controls label {
  margin: 13px 0 3px;
  min-width: 0;
  color: var(--skin-ink);
  font-size: 12px;
  line-height: 1.6;
}
.appearance-controls label :is(output, .setting-value) {
  float: right;
  color: var(--skin-muted);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}
.appearance-modal .appearance-controls :is(select, input[type="range"], input[type="color"]) {
  margin-top: 6px;
  min-width: 0;
  background: var(--skin-surface-raised);
  color: var(--skin-ink);
  border-color: var(--skin-border);
}
.appearance-modal .appearance-controls input[type="range"] {
  display: block;
  width: 100%;
  border: 0;
  padding: 10px 0;
  min-height: 38px;
  accent-color: var(--theme-accent, var(--skin-accent));
  background: transparent;
}
.appearance-modal .appearance-controls input[type="color"] {
  width: 100%;
  height: 40px;
  padding: 5px;
  cursor: pointer;
}
.appearance-modal .appearance-controls input[type="checkbox"] {
  display: inline-block;
  width: 17px;
  height: 17px;
  margin: 0 8px 0 0;
  vertical-align: -4px;
  accent-color: var(--theme-accent, var(--skin-accent));
}
.appearance-controls > .appearance-check { align-self: center; padding: 10px 0; }
.appearance-sample {
  position: relative;
  border: 1px solid var(--skin-border);
  border-radius: 8px;
  padding: 17px 22px;
  margin-top: 21px;
  box-shadow: 0 2px 8px var(--skin-shadow);
}
.appearance-sample h3 {
  margin: 0 0 9px;
  font: 600 11px/1.5 -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif;
  color: inherit;
  opacity: .75;
  letter-spacing: .08em;
}
.appearance-sample p { margin: 0; overflow-wrap: anywhere; }
.appearance-modal .modal-actions { flex-wrap: wrap; }
#themeStatus {
  font-size: 12px;
  line-height: 1.7;
  color: var(--skin-muted);
  margin: 12px 0 0;
}
body[data-decoration="off"] .theme-intro {
  background-image: linear-gradient(110deg, #203b47, #36545c);
}
body[data-decoration="off"] .theme-intro::before { display: none; }

@media (max-height: 850px) {
  .theme-intro { min-height: 138px; padding: 22px 26px; }
  .theme-intro h3 { font-size: 24px; }
  .theme-swatch { height: 60px; }
}
@media (max-width: 600px) {
  .appearance-modal { padding: 19px; }
  .theme-intro { min-height: 148px; padding: 20px; background-position: right -51px center, right -39px top -36px, center; background-size: 230px 137px, 220px 86px, auto; }
  .theme-intro h3 { max-width: 72%; font-size: 23px; letter-spacing: .04em; }
  .theme-intro p { max-width: 65%; font-size: 11px; }
  .theme-cards { gap: 8px; margin: 16px 0; }
  .theme-card { padding: 7px; gap: 4px; }
  .theme-card strong { font-size: 12px; }
  .theme-card small { font-size: 10px; }
  .theme-swatch { height: 56px; }
  .theme-card[aria-pressed="true"]::after { top: 11px; right: 11px; width: 19px; height: 19px; }
  .appearance-controls { column-gap: 15px; }
  .appearance-sample { padding: 15px 17px; }
}
@media (max-width: 400px) {
  .appearance-controls { grid-template-columns: 1fr; }
  .theme-cards { gap: 6px; }
  .theme-card small { display: none; }
  .theme-intro h3 { max-width: 80%; font-size: 21px; }
  .theme-intro p { max-width: 80%; }
}
@media (prefers-reduced-motion: reduce) {
  .theme-card, .button { transition: none; }
  .theme-card:hover, .button:hover:not(:disabled) { transform: none; }
}

.appearance-controls legend { font-size: 12px; color: var(--skin-muted); padding: 0 8px 0 0; }

.appearance-accent { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.appearance-modal .appearance-accent input[type="color"] { width: 54px; flex: 0 0 54px; }
.appearance-modal > .modal-actions { position: sticky; bottom: -26px; background: var(--skin-surface); border-top: 1px solid var(--skin-border); padding: 14px 0; z-index: 2; }

body[data-theme="violet"] .projects-pane .project-card.active .card-title { color: #293f48; }
body[data-theme="violet"] .projects-pane .project-card.active:hover { background: #f9f3e8; }

.companion-settings { margin-top: 22px; }
.companion-settings-note { display: flex; align-items: center; gap: 18px; margin: 8px 0; }
.companion-settings-note p { flex: 1; margin: 0; }
.companion-settings-note button { flex: none; font-size: 12px; }