/* Reference: intentions at http://127.0.0.1:4300/ (Idealics/index.html).
   Its ink, ivory, gold, cinnabar and type hierarchy belong to the tool shell;
   project sketches inside iframes keep their own design. */
:root{color-scheme:dark;--ui-font:"Segoe UI Variable Display","Segoe UI","Noto Sans SC",system-ui,sans-serif;--ui-serif:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif;--ui-bg:#0b0a09;--ui-surface:#13110e;--ui-control:#191611;--ui-hover:#292219;--ui-border:rgba(239,230,210,.14);--ui-input-border:rgba(239,230,210,.28);--ui-text:#efe6d2;--ui-muted:#c4bba9;--ui-subtle:#a69c8a;--ui-accent:#d8c49a;--ui-red:#d0333a;--ui-selected:#352b1e;--ui-success:#b7c6a6;--ui-warning:#dfbd73;--ui-warning-bg:#42341c;--ui-danger:#ed9c98;--ui-danger-bg:#432022;--ui-radius:2px;--ui-control-radius:2px;--ui-backdrop:rgba(0,0,0,.55);--ui-control-h:40px;--ui-control-h-dense:28px}
/* Free mode (decisions 2/3 of the nine-step plan): a finished or existing project works in cold steel-cyan; the warm
   ink-gold above is the creation flow. creator-studio.mjs sets data-mode on <html>, so the canvas page follows too. */
:root[data-mode=free]{--ui-bg:#090c0d;--ui-surface:#0f1417;--ui-control:#141b1f;--ui-hover:#1c262b;--ui-border:rgba(206,226,232,.14);--ui-input-border:rgba(206,226,232,.28);--ui-text:#dde8ea;--ui-muted:#b3c3c7;--ui-subtle:#93a5aa;--ui-accent:#8cc8cf;--ui-selected:#16303a;--ui-success:#a8c9b6}
/* Refactoring UI §3.2 / §4.1: reuse the shell's existing spacing and type steps. */
:root{--ui-space-1:4px;--ui-space-2:8px;--ui-space-3:12px;--ui-space-4:16px;--ui-space-6:24px;--ui-space-8:32px;--ui-space-12:48px;--ui-type-small:12px;--ui-type-body:14px;--ui-type-label:16px;--ui-type-title:20px;--ui-type-heading:32px}
body{font-family:var(--ui-font);color:var(--ui-text);background:var(--ui-bg);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--ui-serif);letter-spacing:.1em;font-weight:600}
button,input,select,textarea{font-family:inherit;accent-color:var(--ui-accent)}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--ui-accent);outline-offset:3px}
button:disabled{cursor:default}
.ui-language{box-sizing:border-box;flex:none;width:auto;max-width:150px;min-height:36px;padding:6px 8px;border:1px solid var(--ui-input-border);border-radius:var(--ui-control-radius);background:var(--ui-control);color:var(--ui-text);font:var(--ui-type-body)/1.5 var(--ui-font)}
dialog{color:var(--ui-text);background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius)}
dialog::backdrop{background:var(--ui-backdrop)}
/* §2.1: closing belongs to the reader's fixed shell, outside the independently scrolling text. */
dialog.reading-dialog{box-sizing:border-box;overflow:hidden}
dialog.reading-dialog[open]{display:flex;flex-direction:column;gap:var(--ui-space-4)}
.reading-dialog>.reading-header{display:flex;flex:0 0 auto;align-items:flex-start;justify-content:flex-end;flex-wrap:nowrap;gap:var(--ui-space-3);min-width:0;margin:0}
.reading-header>h2{flex:1;min-width:0;margin:0;font-size:var(--ui-type-title);overflow-wrap:anywhere}
.reading-body>h2{margin:0 0 var(--ui-space-4);font-size:var(--ui-type-title);overflow-wrap:anywhere}
.reading-dialog>.reading-header>button{flex:0 0 auto;min-height:var(--ui-control-h);padding:var(--ui-space-2) var(--ui-space-3);font:var(--ui-type-body)/1.5 var(--ui-font);white-space:nowrap;color:var(--ui-text);background:var(--ui-control);border:1px solid var(--ui-input-border);border-radius:var(--ui-control-radius);cursor:pointer}
.reading-dialog>.reading-body{flex:1 1 auto;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.reading-dialog>.reading-body:focus-visible{outline:2px solid var(--ui-accent);outline-offset:-2px}
[role=status]:empty{display:none}
/* Hidden error/status targets remain in the DOM for their existing controllers. */
#blueprint-system-version{position:fixed;right:12px;bottom:8px;z-index:1001;padding:3px 8px;border:1px solid var(--ui-border);border-radius:var(--ui-control-radius);background:var(--ui-bg);color:var(--ui-subtle);font:var(--ui-type-small)/1.4 var(--ui-font);white-space:nowrap;pointer-events:none}
@media(max-width:600px){#blueprint-system-version{right:8px;bottom:6px}}
