@import url("/forge.css");
:root {
  --site-nav-width: 208px;
  --sidebar: #181e20;
  --hover: #303d3f;
  --selected-bg: #39372d;
  --selected-ink: #f2d695;
  --selected-border: #88764e;
  --card-border: #2c3638;
  --card-hover: #263032;
  --card-selected: #2c302b;
  --badge-bg: #303c3e;
  --badge-ink: #d4dedb;
  --soft-ink: #85918f;
  --scrollbar: #526263;
  --error: #ffb8ab;
  --download-bg: #d6bc7c;
  --download-hover: #e4cb91;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f6f6f1;
  --panel: #ffffff;
  --sidebar: #eeefe9;
  --line: #c9ceca;
  --ink: #202c2d;
  --muted: #536364;
  --accent: #795910;
  --hover: #e6eae5;
  --selected-bg: #f0e4c7;
  --selected-ink: #624405;
  --selected-border: #967427;
  --card-border: #c9ceca;
  --card-hover: #f0f2ed;
  --card-selected: #faf0d9;
  --badge-bg: #e1e8e1;
  --badge-ink: #314d3c;
  --soft-ink: #596767;
  --scrollbar: #94a29e;
  --error: #a52a1b;
  --download-bg: #e5c777;
  --download-hover: #edd492;
}

.site-page { padding-left:var(--site-nav-width); }
.site-nav { position:fixed; inset:0 auto 0 0; width:var(--site-nav-width); padding:0 12px 12px; display:flex; flex-direction:column; background:var(--sidebar); border-right:1px solid var(--line); z-index:30; }
.site-brand { height:68px; flex-shrink:0; display:flex; align-items:center; gap:10px; padding-inline:8px; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); }
.site-nav-links { display:flex; flex:1; flex-direction:column; gap:6px; padding-top:24px; }
.site-nav-footer { display:grid; gap:4px; padding:12px 0; border-top:1px solid var(--line); }
.site-nav-link,.site-nav-collapse { position:relative; display:flex; align-items:center; gap:12px; min-height:46px; padding:10px 12px; border:1px solid transparent; border-radius:6px; font-size:13px; color:var(--muted); text-decoration:none; background:transparent; }
.site-nav-link svg,.site-nav-collapse svg { width:20px; height:20px; flex-shrink:0; stroke-width:1.6; }
.site-nav-label { min-width:0; white-space:nowrap; }
.site-nav-link:hover,.site-nav-collapse:hover { background:var(--hover); color:var(--ink); }
.site-nav-link[aria-current="page"] { background:var(--selected-bg); color:var(--selected-ink); border-color:var(--selected-border); font-weight:600; }
.site-nav-link:focus-visible,.site-nav-collapse:focus-visible,.site-brand:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.site-nav-collapse { width:100%; min-height:40px; font-size:12px; text-align:left; }
.site-page .site-header { justify-content:start; gap:18px; padding-inline:24px; background:var(--bg); }
.site-page-heading { min-width:0; flex:1; }
.site-page-heading strong { font-size:16px; font-weight:600; letter-spacing:-.015em; }
.site-page-heading p { color:var(--muted); font-size:12px; margin-top:3px; }
.site-header #browse-toggle { margin-left:0; }
.site-nav-toggle { display:none; }
.site-nav-dialog { color:var(--ink); background:var(--sidebar); width:min(296px,85vw); max-width:none; height:100dvh; max-height:none; margin:0; padding:12px; border:0; border-right:1px solid var(--line); }
.site-nav-dialog::backdrop { background:rgba(0,0,0,.48); }
.site-nav-dialog .site-nav { position:static; width:auto; min-height:calc(100% - 48px); padding-inline:0; border:0; }
.site-nav-close { width:100%; min-height:40px; }
.settings-content { min-height:calc(100dvh - 68px); }
/* Preview pixels stay identical between themes; only the surrounding tools change. */
.stage-hint,.stage-message,#loading { color:#edf0e9; }
.card .placeholder,.part-card-empty { color:#aab7b5; }
@media(min-width:761px) {
  :root[data-nav-collapsed="true"] { --site-nav-width:64px; }
  [data-nav-collapsed="true"] .site-nav { padding-inline:8px; }
  [data-nav-collapsed="true"] .site-brand { justify-content:center; padding-inline:0; }
  [data-nav-collapsed="true"] .site-brand > span,
  [data-nav-collapsed="true"] .site-nav-label { display:none; }
  [data-nav-collapsed="true"] .site-nav-link,
  [data-nav-collapsed="true"] .site-nav-collapse { justify-content:center; padding-inline:0; }
  [data-nav-collapsed="true"] .site-nav-collapse svg { transform:rotate(180deg); }
  [data-nav-collapsed="true"] :is(.site-nav-link,.site-nav-collapse):is(:hover,:focus-visible)::after {
    content:attr(aria-label); position:absolute; left:calc(100% + 12px); top:50%; transform:translateY(-50%);
    padding:7px 10px; background:var(--panel); color:var(--ink); border:1px solid var(--line); border-radius:4px;
    font-size:12px; font-weight:400; white-space:nowrap; pointer-events:none; z-index:1;
  }
}
@media(min-width:761px) and (max-width:1199px) {
  .site-page .workbench { grid-template-columns:210px minmax(0,1fr); }
  .site-page .workshop-layout { grid-template-columns:260px minmax(0,1fr); }
  .site-page .seed-row { flex-wrap:wrap; }
}
@media(max-width:760px) {
  .site-page { padding-left:0; }
  .site-page .site-header { gap:6px; padding-inline:8px; height:68px; }
  .site-nav-toggle { display:block; }
  .site-header .site-nav-toggle,.site-header #browse-toggle { padding:8px; min-width:36px; min-height:36px; }
  .site-page-heading p { display:none; }
  .site-page-heading strong { font-size:14px; }
  .site-nav-links { padding-top:16px; }
  .site-nav-collapse { display:none; }
}
.site-nav-toggle svg,.site-header #browse-toggle svg { width:20px; height:20px; display:block; }
@media(max-width:600px) { .site-page-heading { display:none; } }
@media(prefers-reduced-motion:no-preference) {
  .site-nav-link,.site-nav-collapse { transition:background-color 140ms ease-out,color 140ms ease-out,border-color 140ms ease-out; }
}
