/* These variables belong to app chrome. Never redefine --book-paper/--book-ink or a stored book theme. */
:root{--ui-bg:#f7f8f7;--ui-surface:#fff;--ui-panel:#eff2f0;--ui-selected:#e2e9e5;--ui-ink:#293b31;--ui-muted:#53665b;--ui-line:#d4dfd8;--ui-accent:#405f4c}
:root[data-ui-theme=green]{--ui-bg:#f3f5ef;--ui-surface:#fffef9;--ui-panel:#edf0e7;--ui-selected:#dbe5d5;--ui-ink:#2e4030;--ui-muted:#52634c;--ui-line:#d5dfcc;--ui-accent:#46644f}
:root[data-ui-theme=yellow]{--ui-bg:#fbf7e9;--ui-surface:#fffdf5;--ui-panel:#f5edd3;--ui-selected:#eee1b7;--ui-ink:#443d28;--ui-muted:#6b6042;--ui-line:#ddd0a6;--ui-accent:#756025}
:root[data-ui-theme=blue]{--ui-bg:#f1f6fa;--ui-surface:#fff;--ui-panel:#e9f1f8;--ui-selected:#dceaf5;--ui-ink:#293e4d;--ui-muted:#526779;--ui-line:#c9dce9;--ui-accent:#3c647e}
@media screen{
  html[data-ui-theme] body.memory-shell{background:var(--ui-bg)}
  html[data-ui-theme] .memory-shell .site-header{background:var(--ui-surface);border-color:var(--ui-line)}
  html[data-ui-theme] .memory-shell .sidebar{background:var(--ui-panel);border-color:var(--ui-line)}
  html[data-ui-theme] .memory-shell :is(.brand,.brand-mark,.step,.workbench-editor-head h2,.shelf-hero h1,.shelf-section-heading h2){color:var(--ui-ink)}
  html[data-ui-theme] .memory-shell .step.active{background:var(--ui-selected);color:var(--ui-ink);box-shadow:inset 3px 0 var(--ui-accent)}
  html[data-ui-theme] .memory-shell .step:hover{background:var(--ui-selected)}
  html[data-ui-theme] .memory-shell :is(.shelf-hero,.shelf-empty,.shelf-book-settings,.journal-controls){background:var(--ui-panel);border-color:var(--ui-line)}
  html[data-ui-theme] .memory-shell :is(.shelf-hero p,.shelf-section-heading p,.shelf-guide small,.header-middle,.local-label){color:var(--ui-muted)}
  html[data-ui-theme] .memory-shell :is(.shelf-guide-number,.shelf-add-page-card){background:var(--ui-selected);color:var(--ui-ink);border-color:var(--ui-line)}
  html[data-ui-theme] .memory-shell :is(.writing-paper,.writing-dateline,.diary-tools,.shelf-template,.journal-entry,.language-switcher){background:var(--ui-surface);border-color:var(--ui-line)}
  html[data-ui-theme] .memory-shell .book-stage{background-color:var(--ui-panel);border-color:var(--ui-line)}
  html[data-ui-theme] .memory-shell :is(.new-diary,.shelf-primary,.button-accent,.button-dark,#save-diary,#workbench-editor-start){background:var(--ui-accent);border-color:var(--ui-accent);color:#fff}
  html[data-ui-theme] .memory-shell :is(.shelf-button:not(.shelf-primary),.shelf-order-button,.shelf-theme){background:var(--ui-surface);border-color:var(--ui-line);color:var(--ui-ink)}
  html[data-ui-theme] .memory-shell .editor :is(input,textarea,select){border-color:var(--ui-line)}
  html[data-ui-theme] .memory-shell :is(.text-button,.membership-trigger){color:var(--ui-muted)}
  html[data-ui-theme] .memory-shell :is(button,a,summary,input,textarea,select):focus-visible{outline-color:var(--ui-accent)}
}
.ui-color-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:0;margin:23px 0;border:0;min-inline-size:0}
.ui-color-option{display:flex;position:relative;align-items:center;flex-direction:column;gap:12px;padding:16px 10px;border:1px solid var(--ui-line);border-radius:12px;cursor:pointer;color:var(--ui-ink);background:var(--ui-surface);font-size:14px}
.ui-color-option:has(input:checked){border:2px solid var(--ui-accent);padding:15px 9px;background:var(--ui-panel)}
.ui-color-option input{position:absolute;inset-inline-end:8px;top:8px;accent-color:var(--ui-accent);width:16px;height:16px;margin:0;min-height:0!important}
.ui-color-option:focus-within{outline:3px solid var(--ui-accent);outline-offset:3px}
.ui-color-swatch{display:block;width:100%;height:66px;border-radius:7px;border:1px solid #00000018;background:linear-gradient(90deg,#eff2f0 25%,#fff 25%)}
.ui-color-swatch-green{background:linear-gradient(90deg,#dbe5d5 25%,#f3f5ef 25%)}.ui-color-swatch-yellow{background:linear-gradient(90deg,#eee1b7 25%,#fbf7e9 25%)}.ui-color-swatch-blue{background:linear-gradient(90deg,#dceaf5 25%,#f1f6fa 25%)}
@media(max-width:540px){.ui-color-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ui-color-swatch{height:52px}}