/* Geometric Enlightenment: shared stylesheet for the design-document pages.
   Extracted from nine identical inline copies (v1.10.0); edit here, not in the pages. */
:root{--bronze:#b86e3a;--bronze-dim:#857f75;--cream:#f3e6c6;--ink:#d8d3ca;--dim:#9a9488;--line:#1c1c22;--panel:rgba(10,10,14,0.55);--glow:#ff9a3c;}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100%;background:radial-gradient(ellipse at 50% -10%,#0c0c14 0%,#000 70%) fixed;color:var(--ink);font-family:'Inter',system-ui,sans-serif;line-height:1.7;font-size:15.5px;-webkit-font-smoothing:antialiased}
a{color:var(--bronze);text-decoration:none}a:hover{color:var(--cream)}
.mono{font-family:'DM Mono',monospace}
.wrap{max-width:860px;margin:0 auto;padding:0 24px}
.hero{padding:92px 0 26px;text-align:center;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(184,110,58,0.05),transparent 55%)}
.eyebrow{font-family:'DM Mono',monospace;font-size:9.5px;letter-spacing:.42em;text-transform:uppercase;color:var(--bronze);opacity:.9}
h1.title{font-family:'DM Mono',monospace;font-weight:300;font-size:clamp(26px,5.4vw,40px);letter-spacing:.12em;text-transform:uppercase;color:var(--cream);margin:.5em 0 .35em;line-height:1.18}
.sub{color:var(--dim);font-size:14px;max-width:600px;margin:0 auto 24px;line-height:1.66}
.herofig{max-width:540px;margin:8px auto 26px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:radial-gradient(ellipse at 50% 42%,#0d0d15,#050507)}
.herofig svg{width:100%;height:auto;display:block}
.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 auto 22px;max-width:660px}
.chip{font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);background:rgba(184,110,58,.06);border:1px solid var(--line);border-radius:20px;padding:6px 13px}
.btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.btn{font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#0c0c10;background:var(--bronze);border:1px solid var(--bronze);border-radius:3px;padding:11px 18px;transition:.15s;cursor:pointer;display:inline-block}
.btn:hover{filter:brightness(1.12);color:#0c0c10;text-decoration:none}
.btn.ghost{background:transparent;color:var(--bronze)}
.btn.ghost:hover{background:rgba(184,110,58,.1);color:var(--cream)}
.toc{background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:18px 22px;margin:34px 0}
.toc .lbl{font-family:'DM Mono',monospace;font-size:8.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--bronze);opacity:.85;margin-bottom:12px}
.toc ul{list-style:none;margin:0;padding:0;columns:2;column-gap:34px}
.toc li{break-inside:avoid;margin:5px 0;font-size:12.5px;font-family:'DM Mono',monospace;letter-spacing:.02em}
.toc a{color:var(--dim)}.toc a:hover{color:var(--cream)}
.doc{padding-bottom:10px}
.doc h2{font-family:'DM Mono',monospace;font-weight:400;font-size:14px;letter-spacing:.17em;text-transform:uppercase;color:var(--bronze);margin:56px 0 15px;padding-top:17px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;scroll-margin-top:70px}
.doc h2::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--glow);box-shadow:0 0 6px 1px rgba(255,140,50,.85);flex-shrink:0}
.doc h3{font-family:'DM Mono',monospace;font-weight:400;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--cream);margin:30px 0 7px}
.doc h4{font-family:'DM Mono',monospace;font-weight:400;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin:22px 0 7px}
.doc p{margin:11px 0;color:var(--ink)}
.doc b,.doc strong{color:var(--cream);font-weight:600}
.doc ul,.doc ol{color:var(--ink);padding-left:20px}.doc li{margin:5px 0}
figure{margin:26px 0}
figure img{max-width:100%;border:1px solid var(--line);border-radius:8px;background:#0a0a0a;display:block}
.cap{font-size:11.5px;color:var(--dim);font-style:italic;margin-top:8px;font-family:'DM Mono',monospace;letter-spacing:.02em}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:24px 0}
.card{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:15px 17px}
.card h4{font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze);margin:0 0 7px}
.card p{margin:0;font-size:13.5px;color:var(--ink)}
table{border-collapse:collapse;width:100%;margin:16px 0;font-size:13px}
th,td{border:1px solid var(--line);padding:8px 11px;text-align:left;vertical-align:top}
thead th{background:rgba(184,110,58,.1);color:var(--cream);font-family:'DM Mono',monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;font-weight:400}
tbody tr:nth-child(even){background:rgba(255,255,255,.02)}
.viewer{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:26px;margin:34px 0;text-align:center}
.viewer h3{font-family:'DM Mono',monospace;color:var(--cream);margin:.2em 0 .5em;font-weight:400;letter-spacing:.1em;text-transform:uppercase;font-size:12px}
.note{background:rgba(184,110,58,.06);border-left:2px solid var(--bronze);border-radius:0 4px 4px 0;padding:11px 15px;font-size:13.5px;margin:18px 0}
.heroimg{margin-top:24px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#0a0a0a}.heroimg img{width:100%;display:block}
footer{border-top:1px solid var(--line);color:var(--bronze-dim);font-size:10px;padding:28px 0 50px;font-family:'DM Mono',monospace;letter-spacing:.06em;margin-top:46px;text-align:center;line-height:1.7}
.viewnav{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:30;display:flex;background:rgba(12,12,16,0.86);border:1px solid rgba(184,110,58,0.4);border-radius:20px;backdrop-filter:blur(16px);overflow:visible;font-family:'DM Mono',monospace}
.viewnav .vn{padding:7px 15px;font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;color:#857f75;transition:.16s;white-space:nowrap;cursor:pointer;text-decoration:none}
.viewnav .vn:hover{color:#ede8de}
.viewnav .vn.on{color:#b86e3a;background:rgba(184,110,58,0.12)}
@media(max-width:640px){.viewnav{top:10px}.viewnav .vn{padding:6px 11px;font-size:8px;letter-spacing:.12em}.toc ul{columns:1}}

/* spec stats (Illuminate-style periwinkle numbers + grey labels) */
.specs{display:flex;flex-wrap:wrap;justify-content:center;gap:24px 36px;margin:6px auto 12px;max-width:680px}
.spec{display:flex;flex-direction:column;align-items:center;gap:3px;cursor:default;animation:specrise .5s ease both;animation-delay:calc(var(--i,0)*.08s + .12s)}
.spec .sv{font-family:'DM Mono',monospace;font-size:27px;font-weight:400;color:#6a8aaf;font-variant-numeric:tabular-nums;line-height:1;transition:.2s}
.spec .sv small{font-size:13px;opacity:.65;margin-left:1px}
.spec .sl{font-family:'DM Mono',monospace;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:#9a9488}
.spec:hover .sv{color:#a6bce2;text-shadow:0 0 14px rgba(130,150,225,.75)}
@keyframes specrise{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.revline{font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--bronze-dim);margin:0 0 22px;animation:specrise .5s ease both;animation-delay:.66s}
/* button micro-interactions */
.btn-illum:hover{animation:ledglow 2.2s linear infinite}
@keyframes ledglow{0%{box-shadow:0 0 16px 1px rgba(184,110,58,.75)}20%{box-shadow:0 0 18px 2px rgba(150,110,210,.85)}40%{box-shadow:0 0 18px 2px rgba(90,150,215,.85)}60%{box-shadow:0 0 18px 2px rgba(110,200,150,.8)}80%{box-shadow:0 0 18px 2px rgba(220,170,90,.8)}100%{box-shadow:0 0 16px 1px rgba(184,110,58,.75)}}
.btn-construct .ct,.btn-construct .ct span{display:inline-block}
.btn-construct:hover{box-shadow:0 0 15px rgba(184,110,58,.45)}
.btn-construct:hover .ct span{animation:buildin .55s ease both;animation-delay:calc(var(--i,0)*.05s)}
@keyframes buildin{0%{opacity:0;transform:translateY(8px) scaleY(.55)}60%{opacity:1;transform:translateY(-2px)}100%{transform:none}}
/* floating action buttons */
.fab{position:fixed;bottom:20px;width:42px;height:42px;border-radius:50%;z-index:40;background:rgba(12,12,16,0.82);border:1px solid rgba(184,110,58,0.5);color:var(--bronze);font-family:'DM Mono',monospace;font-size:17px;cursor:pointer;backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;transition:.18s;box-shadow:0 4px 18px rgba(0,0,0,.45)}
.fab:hover{background:rgba(184,110,58,0.16);color:var(--cream);transform:translateY(-2px)}
.fab-top{right:20px;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
.fab-top.show{opacity:1;visibility:visible}
.fab-wrap{position:fixed;left:20px;bottom:20px;z-index:40}
.fab-toc{position:relative}
.toc-pop{position:absolute;left:0;bottom:52px;min-width:215px;max-height:62vh;overflow:auto;background:rgba(10,10,14,0.94);border:1px solid var(--line);border-radius:9px;padding:8px;backdrop-filter:blur(14px);box-shadow:0 12px 32px rgba(0,0,0,.55);opacity:0;transform:translateY(8px) scale(.98);pointer-events:none;transition:.18s}
.toc-pop.open{opacity:1;transform:none;pointer-events:auto}
.toc-pop .lbl{font-size:8px;letter-spacing:.26em;text-transform:uppercase;color:var(--bronze);opacity:.8;padding:4px 10px 7px}
.toc-pop a{display:block;font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.03em;color:var(--dim);padding:7px 10px;border-radius:5px;text-transform:uppercase}
.toc-pop a:hover{color:var(--cream);background:rgba(184,110,58,0.1)}
@media(max-width:640px){.fab{width:46px;height:46px}.toc-pop{min-width:66vw}}

/* footer: three-part */
footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;padding:24px 0 72px;text-align:left}
footer span:nth-child(2){text-align:center;color:var(--dim);text-transform:uppercase;letter-spacing:.16em}
footer span:last-child{text-align:right}
@media(max-width:560px){footer{grid-template-columns:1fr;text-align:center;gap:5px}footer span:last-child{text-align:center}}
/* Illuminate button: LED-strip letters travelling colour */
.btn-illum .il,.btn-illum .il span{display:inline-block}
.btn-illum .il span{animation:ledletters 3s linear infinite;animation-delay:calc(var(--i,0)*-0.26s)}
@keyframes ledletters{0%{color:#fff;text-shadow:0 0 6px rgba(255,255,255,.55)}20%{color:#c8a6ff;text-shadow:0 0 7px rgba(170,120,255,.7)}40%{color:#8fd0ff;text-shadow:0 0 7px rgba(110,180,255,.7)}60%{color:#9cf0c0;text-shadow:0 0 7px rgba(110,230,160,.6)}80%{color:#ffd28a;text-shadow:0 0 7px rgba(255,180,90,.7)}100%{color:#fff;text-shadow:0 0 6px rgba(255,255,255,.55)}}

.viewnav .vn.disabled{color:#39342c;pointer-events:none}
.viewnav .vn-select{appearance:none;-webkit-appearance:none;background:transparent;border:none;outline:none;font-family:'DM Mono',monospace;font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;color:#857f75;padding:7px 15px;cursor:pointer;transition:.16s;white-space:nowrap}
.viewnav .vn-select:hover{color:#ede8de}
.viewnav .vn-select option{background:#0c0c10;color:#d8d3ca;letter-spacing:.04em;text-transform:none;font-size:12px}
.buildsw{display:inline-flex;margin:14px auto 0;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.bs{font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);padding:8px 16px;transition:.15s;border-right:1px solid var(--line)}
.bs:last-child{border-right:none}
.bs:hover{color:var(--cream);background:rgba(184,110,58,.08)}
.bs.on{color:#0c0c10;background:var(--bronze)}

/* collapsible design sidebar (shape selector + live TOC) */
#ui{position:fixed;top:0;left:0;height:100%;width:286px;z-index:25;background:rgba(7,7,11,0.93);border-right:1px solid var(--line);backdrop-filter:blur(20px);padding:22px 18px 26px;overflow-y:auto;display:flex;flex-direction:column;font-family:'DM Mono',monospace;transition:transform .24s ease}
body.panel-collapsed #ui{transform:translateX(-100%)}
#ui .eyebrow{font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--bronze);opacity:.9;text-align:center;margin-bottom:13px}
.solid-select{width:100%;background:#0c0c10;border:1px solid #2a2a2a;color:#b86e3a;font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.09em;text-transform:uppercase;padding:8px 10px;border-radius:2px;cursor:pointer;outline:none;margin:0 0 6px;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23b86e3a'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:calc(100% - 12px) center}
.solid-select:hover{border-color:var(--bronze)}
.solid-select option{background:#0c0c10;color:#d8d3ca;text-transform:none}
#ui .sec{font-size:7.5px;letter-spacing:.24em;text-transform:uppercase;color:#9a9488;border-top:1px solid var(--line);padding-top:13px;margin:12px 0 9px;display:flex;align-items:center;gap:6px}
#ui .sec::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--glow);box-shadow:0 0 5px 1px rgba(255,140,50,.85);flex-shrink:0}
.side-toc{display:flex;flex-direction:column;gap:1px}
.side-toc a{font-size:10px;letter-spacing:.02em;color:var(--dim);padding:6px 9px;border-radius:4px;border-left:2px solid transparent;line-height:1.35;transition:.14s;text-transform:uppercase}
.side-toc a:hover{color:var(--cream);background:rgba(184,110,58,.07)}
.side-toc a.active{color:var(--bronze);border-left-color:var(--bronze);background:rgba(184,110,58,.08)}
.controls-toggle{position:fixed;top:14px;left:14px;z-index:26;background:rgba(12,12,16,0.86);color:var(--bronze);border:1px solid rgba(184,110,58,0.55);border-radius:3px;font-family:'DM Mono',monospace;font-size:8px;letter-spacing:.12em;text-transform:uppercase;padding:8px 11px;cursor:pointer;backdrop-filter:blur(16px);transition:.2s}
.controls-toggle:hover{background:rgba(184,110,58,0.12);color:var(--cream)}
body:not(.panel-collapsed) .controls-toggle{left:296px}
@media(max-width:720px){#ui{width:100%;height:42vh;bottom:0;top:auto;left:0;border-right:none;border-top:1px solid var(--line)}body.panel-collapsed #ui{transform:translateY(100%)}.controls-toggle{top:auto;left:16px;bottom:calc(42vh + 10px)}body:not(.panel-collapsed) .controls-toggle{left:16px}body.panel-collapsed .controls-toggle{left:16px;bottom:12px}}
  .viewnav>.vn:first-child,.viewnav>.vn-wrap:first-child>.vn{border-radius:20px 0 0 20px}
  .viewnav>.vn:last-child,.viewnav>.vn-wrap:last-child>.vn{border-radius:0 20px 20px 0}
  .viewnav .vn-wrap{position:relative;display:flex}
  .viewnav .vn-menu{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);display:none;flex-direction:column;min-width:128px;background:rgba(12,12,16,0.96);border:1px solid rgba(184,110,58,0.4);border-radius:10px;backdrop-filter:blur(16px);overflow:hidden;box-shadow:0 12px 30px rgba(0,0,0,.55);z-index:31}
  .viewnav .vn-menu::before{content:'';position:absolute;left:0;right:0;top:-12px;height:12px}
  .viewnav .vn-wrap.has-menu:hover .vn-menu,.viewnav .vn-wrap.has-menu.open .vn-menu{display:flex}
  .viewnav .vn-menu a{padding:9px 16px;font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:#9a9488;white-space:nowrap;text-align:center;text-decoration:none;transition:.14s}
  .viewnav .vn-menu a:hover{color:#ede8de;background:rgba(184,110,58,0.14)}

/* nav-std v1.9.34 — identical viewnav on every page (desktop + mobile) */
.viewnav{top:14px}
.viewnav .vn,.viewnav .vn-select{padding:7px 15px;font-size:8.5px;letter-spacing:.18em;line-height:normal}
@media(max-width:640px){.viewnav{top:10px}.viewnav .vn,.viewnav .vn-select{padding:6px 11px;font-size:8px;letter-spacing:.12em}}
/* Wide tables scroll inside their own box on narrow screens instead of widening the page (v1.10.0). */
.tbl-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
/* Long file names break instead of widening the page on phones (v1.10.0). */
.doc{overflow-wrap:break-word}