/* 3D fabrication sheets (/3d/*): the studio palette, laid out as a workshop sheet.
   No inline styles or scripts on these pages: the CSP allows only same-origin files. */
@font-face{font-family:'Manrope';font-style:normal;font-weight:400 800;font-display:swap;src:url('/assets/fonts/manrope-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20A0-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400 800;font-display:swap;src:url('/assets/fonts/manrope-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url('/assets/fonts/instrument-serif-italic.woff2') format('woff2')}

:root{
  color-scheme:dark;
  --void:#05080f;--panel:#0b1424;--panel-2:#111e34;--line:rgba(214,226,243,.12);--line-strong:rgba(214,226,243,.26);
  --ink:#eef2f8;--dim:#a5b1c4;--dimmer:#6f7c93;--ice:#9cc0f0;--accent:#e0a46a;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --serif:'Instrument Serif',Georgia,serif;
  --mono:ui-monospace,'Cascadia Mono','Consolas',monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--void);color:var(--ink);font:400 16px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
a{color:var(--ice);text-underline-offset:3px}
:focus-visible{outline:2px solid var(--ice);outline-offset:3px;border-radius:6px}
em{font-family:var(--serif);font-style:italic;font-weight:400}
.wrap{max-width:1040px;margin:0 auto;padding:24px 16px 56px;display:flex;flex-direction:column;gap:28px}
@media (min-width:700px){.wrap{padding:32px 32px 72px}}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.back{display:inline-flex;align-items:center;gap:8px;color:var(--dim);text-decoration:none;font-weight:700;font-size:14px;min-height:44px}
.back:hover{color:var(--ink)}
.kicker{font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--dim);margin:0 0 10px}
h1{margin:0;font-weight:800;font-size:clamp(30px,5.4vw,52px);line-height:1;letter-spacing:-.035em;text-wrap:balance}
h1 em{color:var(--accent)}
h2{margin:0;font-size:20px;font-weight:800;letter-spacing:-.01em;display:flex;align-items:baseline;gap:10px}
h2 .tag{font:700 12px var(--mono);color:var(--accent);letter-spacing:.06em}
.lead{color:var(--dim);margin:12px 0 0;max-width:66ch}
.en{color:var(--dimmer);font-size:14px;margin:8px 0 0;max-width:66ch}
.viewer{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:18px;overflow:hidden}
.bar{display:flex;flex-wrap:wrap;gap:6px;padding:10px;border-bottom:1px solid var(--line)}
.bar .sep{flex-basis:100%;height:0}
.bar button{font:600 14px var(--sans);color:var(--ink);background:transparent;border:1px solid var(--line-strong);border-radius:999px;padding:8px 14px;min-height:40px;cursor:pointer}
.bar button[aria-pressed="true"]{background:var(--ink);color:var(--void);border-color:var(--ink)}
.stage{width:100%;height:min(64vh,560px);min-height:320px;touch-action:none}
.hint{font-size:13px;color:var(--dimmer);padding:10px 14px;border-top:1px solid var(--line);margin:0}
.legend{display:flex;flex-wrap:wrap;gap:16px;font-size:13px;color:var(--dim);padding:10px 14px;border-top:1px solid var(--line)}
.legend span::before{content:"";display:inline-block;width:14px;height:3px;margin-right:6px;vertical-align:middle}
.legend .lg-floor::before{background:#e8794a}
.legend .lg-open::before{background:#6fa3e0}
.legend .lg-slab::before{background:#a5b1c4}
.legend-sq span::before{width:12px;height:12px;border-radius:2px;vertical-align:-1px}
.legend .lg-wood::before{background:#c9a06b}
.legend .lg-steel::before{background:#5d626b}
.legend .lg-rail::before{background:#b37a42}
.legend .lg-wire::before{background:#c3c7cd}
.alert{margin:0;max-width:72ch;padding:12px 16px;border-left:3px solid #f08b70;background:rgba(240,139,112,.1);color:var(--ink)}
.alert strong{color:#f4a58f}
.keys{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.keys div{background:var(--panel);padding:12px 14px;min-width:0}
.keys span{display:block;font-size:11px;color:var(--dim);letter-spacing:.08em;text-transform:uppercase}
.keys b{font:600 18px var(--mono);font-variant-numeric:tabular-nums}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:28px}
section{display:flex;flex-direction:column;gap:10px;min-width:0}
dl{margin:0;display:grid;grid-template-columns:auto 1fr;border-top:1px solid var(--line-strong)}
dt,dd{margin:0;padding:8px 0;border-bottom:1px solid var(--line)}
dt{color:var(--dim);padding-right:16px;font-size:15px}
dd{font:500 14px var(--mono);font-variant-numeric:tabular-nums;text-align:right}
.tbl{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:15px}
th,td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--line)}
th{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
th.n,td.n{font:500 14px var(--mono);text-align:right;white-space:nowrap}
.note{font-size:14px;color:var(--dim);border-left:3px solid var(--accent);padding:2px 0 2px 12px;margin:0}
.notes{margin:0;padding-left:20px;max-width:66ch;color:var(--dim)}
.notes li{margin-bottom:6px}
footer{font-size:13px;color:var(--dimmer);border-top:1px solid var(--line);padding-top:18px}