:root{--gold-accent:#c9ad73;--panel-border:#c9ad7330;--text-muted:#b5becb;--text-primary:#ece3d0;color-scheme:dark}
html{scroll-padding-top:100px}body{line-height:1.6}a,button,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a,input,select,textarea{touch-action:manipulation}button:disabled{opacity:.55;cursor:wait}
:focus-visible{outline:2px solid #c9ad73!important;outline-offset:4px;box-shadow:none!important}button{min-height:40px}input,select,textarea{max-width:100%;min-width:0;font:inherit}textarea{resize:vertical}a[aria-disabled=true]{opacity:.6;cursor:default}
[hidden]{display:none!important}.small-note{font-size:12px;line-height:1.7;color:#b5becb}.back-link{display:block;margin-bottom:16px;color:#c9ad73;font-size:12px;text-decoration:none}.skip-link{position:fixed;top:-80px;left:16px;padding:12px;z-index:100;background:#090f1b}.skip-link:focus{top:8px}
#mobile-menu{padding:16px 24px;border-top:1px solid #c9ad7330;background:#090f1b}#mobile-menu a{display:block;padding:10px}
.hero-instrument{min-width:0;margin:80px 0 56px}.hero-art-frame{aspect-ratio:1;position:relative;border:1px solid #c9ad7338;background:#090f1b}.hero-art-frame canvas{width:100%;height:100%;display:block}.instrument-caption{display:flex;gap:16px;align-items:center;justify-content:space-between;margin:12px 0;font:10px monospace;letter-spacing:.12em;color:#b5becb}.instrument-caption button{font:inherit;color:#c9ad73;border:1px solid #c9ad7338;padding:8px}
[data-page=archive] h1{font-size:clamp(38px,5.7vw,72px);letter-spacing:-.025em;font-weight:500}[data-page=archive] h2{font-weight:500;font-size:clamp(23px,3vw,30px)}[data-page=archive] .bg-gradient-to-r{background-image:none;background-color:#c9ad73}[data-page=archive] .text-transparent{color:#ece3d0;background:none}[data-page=archive] section{overflow-wrap:break-word}[data-page=archive] nav>div:first-child>a:first-child{font-size:clamp(13px,2vw,19px)}[data-page=archive] #gallery>div>div:first-child{gap:24px;flex-wrap:wrap}[data-page=archive] #stat-chain{font-size:24px}
.archive-card{display:block;border-top:1px solid #c9ad7338;padding-top:12px;min-width:0}.archive-card canvas{width:100%;aspect-ratio:1;display:block;background:#090f1b;border:1px solid #c9ad7320}.archive-card strong{display:block;color:#ece3d0;font:12px monospace;margin:16px 0 5px}.archive-card p{font-size:12px;color:#b5becb;margin-bottom:5px}.archive-card .view-link{font:11px monospace;color:#c9ad73}.family-index{font:12px monospace;color:#c9ad73;margin-bottom:18px}.family-card{border-top:1px solid #c9ad7338;padding:28px 0}.family-card h3{font:20px Georgia,serif;margin:0 0 14px}.family-card p{font-size:13px;color:#b5becb;max-width:34ch}
.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}#wl-status:empty{display:none}#wl-form{border-radius:0;box-shadow:none}#wl-form input,#wl-form textarea,#wl-form select{border:1px solid #c9ad7330;border-radius:0;background:#101827;color:#ece3d0}#wl-form [aria-invalid=true]{border-color:#de9b91}#wl-form button[type=submit]{background:#c9ad73;color:#090f1b}
.collection-kicker{font:10px/1.8 monospace;letter-spacing:.14em;color:#c9ad73}.collection-kicker>span:first-child{margin:0 8px;color:#697482}.edition-facts{display:flex;flex-wrap:wrap;gap:8px 20px;color:#b5becb;font:11px/1.8 monospace;border-top:1px solid #c9ad7330;padding-top:20px}.extension-section{padding:88px 0;border-top:1px solid #c9ad7330;background:#0a101c}.extension-heading{display:flex;justify-content:space-between;gap:24px;align-items:end;flex-wrap:wrap}.extension-heading h2{margin-top:10px}.collection-link{color:#c9ad73;font:11px/1.8 monospace}.extension-intro{max-width:650px;color:#b5becb;font-size:14px;line-height:1.9;margin:22px 0 36px}.extension-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.extension-card{display:block;min-width:0}.extension-card canvas{width:100%;aspect-ratio:1;display:block;border:1px solid #c9ad7330;background:#090f1b}.extension-card strong{display:block;font:12px monospace;color:#ece3d0;margin:18px 0 8px}.extension-card p{font-size:12px;color:#b5becb;margin-bottom:5px}.extension-card .view-link{display:block;font:11px monospace;color:#c9ad73;margin-top:12px}.collection-ledger{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;border-top:1px solid #c9ad7330;margin-top:48px;padding-top:24px}.ledger-label{display:block;font:10px monospace;color:#b5becb;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}.collection-ledger strong{font-size:14px;font-weight:400;color:#ece3d0}.chain-note{display:block;margin-top:10px;font:11px/1.8 monospace;color:#c9ad73}@media(max-width:800px){.extension-grid,.collection-ledger{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:420px){.extension-grid{grid-template-columns:1fr}.extension-section{padding-top:64px}.collection-ledger{gap:22px 12px}}
.app-container{grid-template-columns:340px minmax(0,1fr);align-items:start}.sidebar{border-radius:2px;box-shadow:none;backdrop-filter:none}.viewport{min-width:0;position:sticky;top:24px}#canvas-wrapper{border-radius:0;box-shadow:none;max-width:1000px}.status-overlay{position:static;transform:none;margin:12px 0;border-radius:0;padding:10px 14px;max-width:100%;font-size:10px}.status-text{font-size:10px}.btn,.control-box,.mode-switcher,.token-badge-container{border-radius:2px}.btn-primary{background:#c9ad73!important}.btn:hover{box-shadow:none}.seed-input{min-width:0;width:100%}.trait-item{gap:14px;border:0;padding:5px 0;background:none;align-items:baseline}.trait-val{max-width:62%;font-weight:400}.trait-list{gap:3px}.palette-btn{flex-direction:row!important;justify-content:space-between;color:#b5becb;font-size:11px}.palette-swatches{width:64px;flex-shrink:0;height:10px}.palette-btn[aria-pressed=true]{border-color:#c9ad73}.gallery-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.gallery-card{text-align:left;color:#ece3d0;border-radius:0;min-width:0}.gallery-card canvas{display:block;width:100%;height:auto}.gallery-card strong,.gallery-card span{display:block;font-size:11px;margin-top:8px}.gallery-card span{color:#b5becb}.range-row{display:flex;gap:12px}.range-row label{width:50%}.review-tools{display:flex;flex-direction:column;gap:10px}.review-tools label{font-size:12px;color:#b5becb}.review-tools input:not([type=checkbox]),.review-tools textarea{width:100%;padding:8px;background:#090f1b;border:1px solid #c9ad7338;color:#ece3d0}.pagination{flex-wrap:wrap;font-size:12px}#studio-notice{font-size:12px;color:#e0c397;overflow-wrap:anywhere}#comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-width:1200px;margin:24px auto;gap:20px;padding:24px}#comparison:empty{display:none}#comparison canvas{width:100%}figcaption{font:12px monospace;color:#b5becb}dialog{background:#101827;border:1px solid #c9ad73;padding:28px;color:#ece3d0;margin:auto;max-width:min(650px,calc(100vw - 32px));max-height:85vh;overflow:auto}dialog::backdrop{background:#050811db}dialog h2{font:22px Georgia,serif}dialog pre{white-space:pre-wrap;overflow-wrap:anywhere;font:11px/1.6 monospace;margin:18px 0}dialog p{font-size:13px;margin-top:12px}
.embed .sidebar,.embed .status-overlay,.embed #comparison{display:none}.embed .app-container{display:block;padding:0;margin:0}.embed .viewport{position:static}.embed #canvas-wrapper{width:100vw;max-width:100vw;border:0;aspect-ratio:1}.embed{overflow:hidden;background:#090f1b}
@media(min-width:1025px){.sidebar{max-height:calc(100vh - 48px)}}
@media(max-width:1024px){.app-container{grid-template-columns:1fr;padding:16px;gap:16px}.viewport{position:static;grid-row:1}.sidebar{max-height:none}.gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.sidebar .header h1{font-size:20px}}
@media(max-width:600px){.app-container{padding:10px}.sidebar{padding:16px}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hero-instrument{margin:12px 0 40px}[data-page=archive] .hero-instrument{width:100%}[data-page=archive] section:first-of-type{padding-top:110px;min-height:auto}[data-page=archive] #wl-form{padding:20px}[data-page=archive] section{padding-bottom:64px}[data-page=archive] footer>div{align-items:flex-start}[data-page=archive] footer .flex{flex-wrap:wrap}#comparison{grid-template-columns:1fr}.instrument-caption{letter-spacing:0}.status-overlay{width:100%;padding:8px}.status-dot{flex-shrink:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Featured works open in place without exposing collection navigation. */
button.archive-card,button.extension-card{width:100%;background:transparent;text-align:left;cursor:pointer;color:inherit}
button.extension-card{border:0;padding:0}
button.archive-card{border-right:0;border-bottom:0;border-left:0;padding-right:0;padding-bottom:0;padding-left:0}
#featured-art-dialog{width:min(760px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:94dvh;padding:16px;background:#090d14;border-color:#c9ad7360}
.featured-preview-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
#featured-art-title{font:clamp(14px,3vw,20px)/1.5 Georgia,serif;margin:0}
#featured-art-close,.featured-preview-controls button{flex-shrink:0;padding:8px 12px;border:1px solid #c9ad7370;color:#e1cda3;background:transparent;cursor:pointer}
#featured-art-canvas{display:block;width:min(100%,66vh);height:auto;aspect-ratio:1;margin:0 auto;background:#000}
.featured-preview-controls{display:flex;align-items:center;gap:12px;margin-top:12px}
#featured-art-status{font-size:12px;overflow-wrap:anywhere}
#featured-art-details{color:#b5becb;font-size:12px;line-height:1.6}
.wl-task-card{padding:20px;background:#101522;border:1px solid #c9ad7350}
.wl-step-label{font:10px/1.6 monospace;letter-spacing:.12em;color:#c9ad73}
.wl-task-card h3{font:22px/1.4 Georgia,serif;margin:12px 0 6px;color:#ece3d0}
#wl-x-link{font:12px monospace;color:#c9ad73}
.wl-task-card ol{list-style:decimal;padding-left:20px;margin:18px 0;color:#b5becb;font-size:14px;line-height:1.9}
.wl-post-link{display:block;padding:12px;border:1px solid #c9ad7370;text-align:center;color:#e5cc9d;font:11px/1.7 monospace;letter-spacing:.06em}
.wl-task-confirm{display:flex;align-items:flex-start;gap:10px;font-size:12px;line-height:1.6;color:#d4d5d8;margin-top:18px;cursor:pointer}
.wl-task-confirm input{flex-shrink:0;width:17px;height:17px;margin-top:2px;accent-color:#c9ad73}

/* Final website polish: layout and presentation only. */
.no-script-note{max-width:760px;margin:100px auto 24px;padding:16px 24px;border:1px solid #c9ad7350;color:#ece3d0;background:#101827}
[data-page=archive] nav>div:first-child{gap:20px}
[data-page=archive] nav>div:first-child>a{white-space:nowrap}
#mobile-menu-btn{min-width:44px;min-height:44px;align-items:center;justify-content:center}
[data-page=archive] footer a{display:inline-flex;align-items:center;min-height:44px}
[data-page=archive] footer>div>div:nth-child(2){flex-wrap:wrap;gap:8px 24px}
[data-page=archive] footer>div>div:last-child{color:#9ca8b8}
.archive-card,.extension-card{height:100%;display:flex!important;flex-direction:column}
.archive-card>div,.extension-card>div{display:flex;flex:1;flex-direction:column}
.archive-card .view-link,.extension-card .view-link{margin-top:auto;padding-top:12px}
.archive-card:hover canvas,.extension-card:hover canvas{border-color:#c9ad7390}
.extension-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
#faq-container button{gap:20px;min-height:56px;line-height:1.6}
#faq-container button::after{content:'+';flex-shrink:0;color:#c9ad73;font:22px/1 monospace}
#faq-container button[aria-expanded=true]::after{content:'−'}
#faq-container button[aria-expanded=true]{color:#e5cc9d}
#faq-container button+p{line-height:1.85;max-width:70ch}
.security-note{background:#10182780}
#wl-form input[type=text]{font-size:16px;line-height:1.5}
#wl-form button[type=submit]:disabled{cursor:wait}
#wl-status{padding:12px;border-left:2px solid #c9ad73;background:#101827;overflow-wrap:anywhere}
#wl-status:empty{padding:0;border:0}
.wl-task-card{min-width:0}
.wl-task-confirm{min-height:44px}
#wl-form .wl-task-confirm input{border:initial;background:initial;appearance:auto}
.sidebar,.viewport,#gallery-view{min-width:0}
.sidebar .header h1{font-weight:500;letter-spacing:.08em;-webkit-text-fill-color:#ece3d0;background:none}
.sidebar .header p{line-height:1.7}
.mode-btn,.btn{min-height:44px;line-height:1.5}
button:disabled{cursor:not-allowed}
.trait-val,.gallery-card span,.palette-btn{overflow-wrap:anywhere}
.palette-btn{gap:12px;align-items:center;min-height:44px}
.trait-item{line-height:1.7}
.trait-name{flex-shrink:0}
.seed-row>.btn{flex-shrink:0}
#gallery-family-select{padding:10px 12px;min-height:44px;background:#101827;color:#ece3d0;border:1px solid #c9ad7350;border-radius:2px}
.status-text{line-height:1.8;overflow-wrap:anywhere}
input[type=range]{min-height:24px;background:transparent}
input[type=range]::-webkit-slider-runnable-track{height:4px;background:#ffffff26;border-radius:2px}
input[type=range]::-webkit-slider-thumb{margin-top:-5px}
input[type=range]::-moz-range-track{height:4px;background:#ffffff26;border-radius:2px}
input[type=range]::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#c9ad73}
#featured-art-close,.featured-preview-controls button{min-height:44px}
.featured-preview-controls{flex-wrap:wrap}
@media(min-width:768px) and (max-width:1023px){#mobile-menu-btn{display:inline-flex}}
@media(max-width:767px){#mobile-menu-btn{display:inline-flex}}
@media(min-width:1024px){#mobile-menu{display:none!important}}
@media(max-width:800px){.extension-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){
  [data-page=archive] section#systems,[data-page=archive] section#gallery,[data-page=archive] section#wl-submit,[data-page=archive] section#faq{padding-top:64px}
  [data-page=archive] .collection-ledger{gap:24px 16px}
  [data-page=archive] .collection-ledger strong{font-size:13px}
  .wl-task-card{padding:16px}
  #featured-art-dialog{padding:12px}
  [data-page=studio] input:not([type=range]):not([type=checkbox]),[data-page=studio] select,[data-page=studio] textarea{font-size:16px}
  #gallery-view{grid-row:1}
  .sidebar .header h1{font-size:19px}
}
@media(max-width:420px){.extension-grid{grid-template-columns:1fr}.instrument-caption{gap:8px}.instrument-caption>span{max-width:60%}}
