@font-face{font-family:"EB Garamond";src:url("../assets/fonts/EBGaramond-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
:root{
 --accent-orange:#b34b24;
 --brand-green:#0b4b3d;
 --paper-warm:#f4f0e7;
 --ink:#302b24;
 --on-accent:#ffffff;
 --ink-muted:color-mix(in srgb,var(--ink) 68%,var(--paper-warm));
 --line:color-mix(in srgb,var(--brand-green) 27%,var(--paper-warm));
 --surface:color-mix(in srgb,var(--paper-warm) 55%,white);
 --surface-recess:color-mix(in srgb,var(--paper-warm) 92%,var(--ink));
 --accent-soft:color-mix(in srgb,var(--accent-orange) 9%,var(--paper-warm));
}
body,body[data-page=designer]{background:var(--paper-warm);color:var(--ink)}
a{color:var(--accent-orange)}
h1,h2,h3,legend,.eyebrow{color:var(--brand-green)}
.header{background:var(--paper-warm);border-color:var(--line);gap:20px}
.wordmark{display:inline-flex;align-items:center;flex-shrink:0;color:var(--accent-orange);line-height:1}
.wordmark :is(svg,img){display:block;width:245px;height:56px;overflow:visible}
.brand-emblem{fill:var(--brand-green)}
.brand-small-outline{stroke:var(--brand-green)}
.brand-wordmark{fill:var(--accent-orange)}
.footer .wordmark :is(svg,img){width:210px;height:48px}
.header nav{margin-left:auto}
.header nav a,.header nav a[aria-current=page],.header a:hover,.text-link{color:var(--accent-orange)}
.header nav a[aria-current=page]{text-decoration:underline;text-underline-offset:7px}
.button.solid,.file-actions button.primary,.export-button.primary,.preflight button:not(:last-child),.dialog-actions button:not(:last-child){background:var(--accent-orange);border-color:var(--accent-orange);color:var(--on-accent)}
.button.solid:hover,.file-actions button.primary:hover,.export-button.primary:hover{background:color-mix(in srgb,var(--accent-orange) 85%,black)}
.side-buttons button[aria-pressed=true],.view-options button[aria-pressed=true],.film-steps button[aria-current=step]{background:var(--accent-orange);border-color:var(--accent-orange);color:var(--on-accent)}
.stock-grid button[aria-pressed=true]{border-color:var(--accent-orange);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-orange)}
.editor-tabs button[aria-selected=true],.filters button.active{color:var(--accent-orange);border-color:var(--accent-orange)}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent-orange);outline-offset:3px}
input[type=checkbox],input[type=range],.view-options input,.control-panel input[type=checkbox],.control-panel input[type=range]{accent-color:var(--accent-orange)}
.template-mark{border-color:var(--brand-green);color:var(--ink)}
.studio{background:var(--surface-recess);color:var(--ink)}
.studio h2{color:var(--brand-green)}
.studio-bottom{border-color:var(--line)}
.studio .button.outline{color:var(--accent-orange)}
.print-colour-actions{display:flex;gap:8px;margin:-8px 0 22px;flex-wrap:wrap}
.print-colour-actions button{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:9px 12px;font-size:11px}
.print-colour-actions i{width:14px;height:14px;border-radius:50%;background:var(--brand-green);display:block}
.print-colour-actions button:last-child i{background:var(--ink)}
@media(max-width:1000px){.wordmark :is(svg,img){width:213px;height:52px}.header{gap:12px}}
@media(max-width:650px){.wordmark :is(svg,img){width:187px;height:46px}.header{gap:10px}.header nav{background:var(--paper-warm)}.footer .wordmark :is(svg,img){width:210px}}
@media(max-width:370px){.wordmark :is(svg,img){width:157px;height:42px}.header{padding-inline:4%;gap:6px}#language{width:59px}}

/* H: the formal, outlined logo. No CSS typesetting. */
.wordmark img.brand-logo{object-fit:contain;height:44px}.footer .wordmark img.brand-logo{height:42px}