/* Shelterscape dark theme, matching shadow-studio.html.
   Activated by <body class="ss-dark">. The homepage does not use it.
   Colours: bg #090909, surface #111, raised #171717, text #f5f5f3, muted #b3b3b3, border #333.
   Images and canvases are never filtered or inverted. */
/* Match canvas to footer so overscroll / short-page gaps stay dark, not white. */
html{background:#090909}
body.ss-dark{
  --dk-bg:#090909;--dk-surface:#111;--dk-raised:#171717;--dk-text:#f5f5f3;--dk-muted:#b3b3b3;
  --dk-soft:#a3a3a3;--dk-accent:#8f8f8f;--dk-border:#333;--dk-line:#555;--dk-rule:#686868;
  color-scheme:dark;background:var(--dk-bg)!important;color:var(--dk-text)!important;font-weight:400}
body.ss-dark ::selection{background:#f5f5f3;color:#090909}
body.ss-dark a:focus-visible,body.ss-dark button:focus-visible,body.ss-dark summary:focus-visible,
body.ss-dark input:focus-visible,body.ss-dark select:focus-visible,body.ss-dark textarea:focus-visible,
body.ss-dark canvas:focus-visible{outline:2px solid #fff!important;outline-offset:5px}
body.ss-dark .skip-link{background:var(--dk-text);color:var(--dk-bg)}

/* Shared header: same tokens as .ss-site-dark on shadow-studio.html */
body.ss-dark .ss-site-header{--ss-nav-bg:#090909;--ss-nav-ink:#f5f5f3;--ss-nav-line:#333;--ss-nav-accent:#fff}
body.ss-dark .ss-site-header .ss-site-resources>div{box-shadow:0 8px 20px #0008}
body.ss-dark .ss-site-header .ss-site-links>a:not(.ss-site-contact),body.ss-dark .ss-site-header summary{color:var(--dk-muted)}
body.ss-dark .ss-site-header .ss-site-links>a:hover,body.ss-dark .ss-site-header summary:hover,
body.ss-dark .ss-site-header [aria-current=page]{color:#fff}
body.ss-dark .ss-site-header .ss-site-resources>div>a{color:var(--dk-text)}
body.ss-dark .ss-site-header .ss-site-resources>div>a:hover{background:var(--dk-raised)}
body.ss-dark .ss-site-header .ss-site-contact{border-color:#777;color:var(--dk-text)}
body.ss-dark .ss-site-header .ss-site-contact:hover{background:var(--dk-text);color:var(--dk-bg)}
body.ss-dark .ss-site-header .ss-site-professional{color:#aaa}
body.ss-dark .ss-site-header .ss-site-toggle{color:var(--dk-text);border-color:#555}

/* Generic type, links, buttons */
body.ss-dark h1,body.ss-dark h2,body.ss-dark h3,body.ss-dark h4{color:var(--dk-text)}
body.ss-dark h1 span,body.ss-dark h2 span{color:var(--dk-accent)}
body.ss-dark .eyebrow,body.ss-dark .ss-kicker{color:var(--dk-muted)!important;font-weight:700}
body.ss-dark hr{border-color:var(--dk-border)}
body.ss-dark .text-link{color:var(--dk-text)}
body.ss-dark .text-link:hover{color:#fff;text-decoration-thickness:2px}

/* Forms and tables (generic, for any page that has them) */
body.ss-dark input,body.ss-dark select,body.ss-dark textarea{background:var(--dk-surface);color:var(--dk-text);border:1px solid var(--dk-line)}
body.ss-dark input::placeholder,body.ss-dark textarea::placeholder{color:#8a8a8a}
body.ss-dark input[type=checkbox],body.ss-dark input[type=radio]{accent-color:#fff}
body.ss-dark table{border-color:var(--dk-border);color:var(--dk-text)}
body.ss-dark th,body.ss-dark td{border-color:var(--dk-border)}
body.ss-dark thead th{background:var(--dk-raised);color:var(--dk-text)}
body.ss-dark tbody tr:nth-child(even){background:var(--dk-surface)}

/* Footer (site-footer: same as shadow-studio.html) */
body.ss-dark .site-footer{background:var(--dk-bg);border-top:1px solid var(--dk-border)}
body.ss-dark .site-footer .mid{color:var(--dk-muted)}
body.ss-dark .site-footer .mid strong{color:var(--dk-text)}
body.ss-dark .site-footer .right{color:#aaa}
body.ss-dark .site-footer a:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- Template pages: da-process, about, urban-design, DA drawings, design consultancy ---------- */
body.ss-dark .hero{background:var(--dk-bg)!important;border-bottom:1px solid var(--dk-border)}
body.ss-dark .hero h1{font-weight:700;letter-spacing:-.02em;line-height:1.02;text-transform:uppercase}
body.ss-dark .hero:not(.signature-hero) h1{font-size:clamp(42px,4.4vw,64px)}
body.ss-dark .hero p{color:var(--dk-muted)}
body.ss-dark .eyebrow{letter-spacing:.19em;font-size:11px}
body.ss-dark .process-overview,body.ss-dark .overview-stage,body.ss-dark .jurisdictions,body.ss-dark .process-faq{background:var(--dk-bg);border-color:var(--dk-border)}
body.ss-dark .process-overview{border-bottom:1px solid var(--dk-border)}
body.ss-dark .steps{background:var(--dk-surface);border-bottom:1px solid var(--dk-border)}
body.ss-dark .overview-title,body.ss-dark .section-title,body.ss-dark .cta-bar h2{font-weight:700;letter-spacing:-.01em;line-height:1.08;font-size:clamp(30px,3vw,42px)}
body.ss-dark .overview-stage h3,body.ss-dark .step h3,body.ss-dark .jurisdiction-card h3{font-weight:700;font-size:22px;line-height:1.2;letter-spacing:0}
body.ss-dark .overview-intro,body.ss-dark .overview-stage p,body.ss-dark .stage-meta,body.ss-dark .step p,
body.ss-dark .jurisdiction-card p,body.ss-dark .process-faq details p,body.ss-dark .about-text{color:var(--dk-muted)}
body.ss-dark .stage-meta strong{color:var(--dk-text)}
body.ss-dark .overview-note,body.ss-dark .jurisdiction-card .process-source{color:var(--dk-soft)}
body.ss-dark .overview-track{border-top-color:var(--dk-rule);border-bottom-color:var(--dk-border)}
body.ss-dark .overview-stage{border-color:var(--dk-border)!important}
body.ss-dark .overview-stage:before{background:var(--dk-text)}
body.ss-dark .stage-no,body.ss-dark .step-n{color:var(--dk-muted);font-weight:700}
body.ss-dark .steps .step,body.ss-dark .jurisdiction-card{background:var(--dk-bg);border:1px solid #494949;border-top:1px solid var(--dk-rule)}
body.ss-dark .process-faq details{border-color:var(--dk-line)!important}
body.ss-dark .process-faq summary{color:var(--dk-text);font-weight:700}
body.ss-dark .process-faq summary:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
body.ss-dark .process-source a,body.ss-dark .process-faq details p a{color:var(--dk-text)}
body.ss-dark .cta-bar{background:var(--dk-surface);border-top:1px solid var(--dk-border);border-bottom:1px solid var(--dk-border)}
body.ss-dark .cta-bar p{color:var(--dk-muted)}
body.ss-dark .cta-bar>a{background:var(--dk-text);color:var(--dk-bg);border:1px solid var(--dk-text);border-radius:0;font-weight:700;letter-spacing:.07em}
body.ss-dark .cta-bar>a:hover{background:#d4d4d4;border-color:#d4d4d4}
body.ss-dark .cta-bar p a{color:var(--dk-text)}

/* ---------- collaborate.html ---------- */
body.ss-dark .hero:before{background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:64px 64px}
body.ss-dark .hero .eyebrow{border-color:#555}
body.ss-dark .hero .button{background:var(--dk-text);color:var(--dk-bg);border-radius:0}
body.ss-dark .collab-email-invite{color:var(--dk-muted)!important}
body.ss-dark .collab-email-invite a{color:var(--dk-text);border-bottom-color:#777}

/* ---------- 404.html ---------- */
body.ss-dark .subnav{background:var(--dk-bg);border-bottom-color:var(--dk-border)}
body.ss-dark .nf h1{color:var(--dk-text);font-weight:700}
body.ss-dark .nf h2{color:var(--dk-muted);font-weight:700}
body.ss-dark .nf p{color:var(--dk-muted)}
body.ss-dark .nf a{background:var(--dk-text);color:var(--dk-bg);font-weight:700}
body.ss-dark .nf a:hover{background:#d4d4d4}

/* ---------- shadow-diagrams.html ---------- */
body.ss-dark .breadcrumbs{color:var(--dk-soft)}
body.ss-dark .breadcrumbs a{color:var(--dk-text)}
body.ss-dark .hero-copy h1 span{color:var(--dk-text)}
body.ss-dark .hero-copy h1 .h1-subtitle{color:var(--dk-text)}
body.ss-dark .hero-description,body.ss-dark .hero-fee,body.ss-dark .section-head>p,body.ss-dark .deliverable p,
body.ss-dark .process-list p,body.ss-dark .quote-grid .intro,body.ss-dark .price-note,body.ss-dark .checklist-note,
body.ss-dark .faq details p,body.ss-dark .studio-invite p:last-child,body.ss-dark .audience span:first-child{color:var(--dk-muted)}
body.ss-dark .hero-fee strong{color:var(--dk-text)}
body.ss-dark .button{background:var(--dk-text);color:var(--dk-bg);border-color:var(--dk-text)}
body.ss-dark .button:hover{background:#d4d4d4;border-color:#d4d4d4;color:var(--dk-bg)}
body.ss-dark .button.light{background:transparent;color:var(--dk-text);border-color:#777}
body.ss-dark figure.study{background:var(--dk-bg);border:1px solid var(--dk-border)}
body.ss-dark .study-art{background:#0a0a0a}
body.ss-dark .study figcaption{background:var(--dk-bg);border-top-color:var(--dk-border);color:var(--dk-muted)}
body.ss-dark .study figcaption strong{color:var(--dk-text)}
body.ss-dark .study-state,body.ss-dark .legend{color:var(--dk-muted)}
body.ss-dark .times{background:transparent;border-color:#555}
body.ss-dark .times button{color:var(--dk-text)}
body.ss-dark .times button[aria-pressed=true]{background:var(--dk-text);color:var(--dk-bg)}
body.ss-dark .proposal-toggle input{accent-color:#fff}
body.ss-dark .audience,body.ss-dark .studio-invite,body.ss-dark .related{border-color:var(--dk-border)}
body.ss-dark .item-no,body.ss-dark .process-list .step,body.ss-dark .checklist li::before{color:var(--dk-muted)}
body.ss-dark .deliverable{border-top-color:var(--dk-rule)}
body.ss-dark .deliverable li{border-top-color:var(--dk-border)}
body.ss-dark .requirements{background:var(--dk-surface);color:var(--dk-text);border-top:1px solid var(--dk-border);border-bottom:1px solid var(--dk-border)}
body.ss-dark .requirements .eyebrow,body.ss-dark .requirements-list span{color:var(--dk-muted)!important}
body.ss-dark .requirements p{color:var(--dk-muted)}
body.ss-dark .requirements-note{border-left-color:var(--dk-rule)}
body.ss-dark .process-list li,body.ss-dark .faq details,body.ss-dark .checklist li{border-color:var(--dk-border)!important}
body.ss-dark .quote-section{background:var(--dk-surface);border-top:1px solid var(--dk-border);border-bottom:1px solid var(--dk-border)}
body.ss-dark .faq summary{color:var(--dk-text)}
body.ss-dark .faq summary::after{color:var(--dk-text)}
body.ss-dark .footer-v30{background:var(--dk-bg);border-top:1px solid var(--dk-border)}
body.ss-dark .footer-v30 .footer-focus{color:var(--dk-text)}
body.ss-dark .footer-v30 .footer-regional,body.ss-dark .footer-v30 .footer-contact-mini,
body.ss-dark .footer-v30-address,body.ss-dark .footer-v30-numbers,body.ss-dark .footer-v30-copy{color:var(--dk-muted)}

/* ---------- urban-notes.html and urban-notes/responsive-pavilion.html ---------- */
body.ss-dark .ss-breadcrumb{color:var(--dk-soft)}
body.ss-dark .ss-breadcrumb a{color:var(--dk-text)}
body.ss-dark .ss-breadcrumb a:hover{color:#fff;text-decoration:underline}
body.ss-dark .ss-index-heading h1,body.ss-dark .ss-entry-copy h2,body.ss-dark .study h1{font-weight:700;letter-spacing:-.02em;line-height:1.02}
body.ss-dark .ss-index-heading h1{font-size:clamp(46px,5.5vw,76px)}
body.ss-dark .ss-entry-copy h2{font-size:clamp(34px,3.4vw,52px)}
body.ss-dark .ss-index-heading h1 span{color:var(--dk-accent)}
body.ss-dark .ss-index-heading>p:last-child,body.ss-dark .ss-entry-copy p,body.ss-dark .ss-deck,
body.ss-dark .ss-notes-guides span,body.ss-dark .ss-notes-guides p{color:var(--dk-muted)!important}
body.ss-dark .ss-entry{border-color:var(--dk-border)}
body.ss-dark .ss-entry-meta{color:var(--dk-soft)}
body.ss-dark .ss-entry-meta span:first-child,body.ss-dark .ss-entry-action>span{color:var(--dk-text)}
body.ss-dark .ss-entry:hover .ss-entry-copy h2{color:#fff;text-decoration:underline;text-underline-offset:6px}
body.ss-dark .ss-entry:focus-visible{outline-color:#fff}
/* The 3D previews are rendered on white by their scripts. They stay light, framed like the Shadow Studio preview. */
body.ss-dark .ss-entry-visual{background:#fff;border-right:1px solid var(--dk-border)}
body.ss-dark .ss-entry-type{background:#fff;color:#4d554e;border-color:#c9cfc8}
body.ss-dark .ss-notes-guides{border-top-color:var(--dk-border)}
body.ss-dark .ss-notes-guides a{border-color:var(--dk-border);background:var(--dk-bg)}
body.ss-dark .ss-notes-guides a:hover{border-color:#ccc;background:var(--dk-raised)}
body.ss-dark .ss-footer{background:var(--dk-bg);color:var(--dk-muted);border-top:1px solid var(--dk-border)}
body.ss-dark .ss-footer>a{color:var(--dk-text)}
/* pavilion study */
body.ss-dark .study .eyebrow,body.ss-dark .section-heading .eyebrow{color:var(--dk-muted)!important}
body.ss-dark .intro>p,body.ss-dark .section-heading>p:last-child,body.ss-dark .details p,body.ss-dark .process-top>p,
body.ss-dark figcaption,body.ss-dark .reference,body.ss-dark .concept-note{color:var(--dk-muted)}
body.ss-dark .details article>span{color:var(--dk-soft)}
body.ss-dark .details article,body.ss-dark .concept-note,body.ss-dark .process{border-color:var(--dk-border)}
body.ss-dark .process{background:var(--dk-surface)}
body.ss-dark figcaption a,body.ss-dark .reference a{color:var(--dk-text)}
body.ss-dark .link-button{color:var(--dk-text);background:none}
body.ss-dark .link-button:hover{color:#fff;background:none}
body.ss-dark .viewer{background:#fff;border-top:1px solid var(--dk-border);border-bottom:1px solid var(--dk-border)}
body.ss-dark .process figure img{border-color:var(--dk-border)}
/* shadow-diagrams: keep the H1 subtitle on its own line on mobile (the live mobile rule
   ".hero-copy h1 span{display:inline}" otherwise wins and runs it into "diagrams.") */
body.ss-dark .hero-copy h1 .h1-subtitle{display:block;margin-top:18px;line-height:1.25}
/* pavilion section headings: Shadow Studio weight */
body.ss-dark .assembly h2,body.ss-dark .process-top h2{font-weight:700;letter-spacing:-.01em}