/* White Sand Intelligence chrome and the shared page rules, from the canvas (Site Header.dc.html, Site Footer.dc.html, and the style-hover / style-focus attributes the two partials carry; etags and hashes in LEDGER.md). The drawings set every value inline; the built partials keep those inline values, and this file carries only what an inline style cannot: the container rules, the hover states (with !important, because the drawing's runtime achieved them by swapping the inline style itself), the menu's scripted and unscripted states, and the quality floor (skip link, focus-visible). */ html { -webkit-text-size-adjust: 100%; } body { margin: 0; background: var(--canvas); } [hidden] { display: none !important; } /* ── the header (Site Header.dc.html helmet, verbatim) ───────────────────── */ [data-m="burger"] { display: none; } [data-m="menu"] { display: none; } @container (max-width: 860px) { [data-m="nav"], [data-m="hcta"] { display: none !important; } [data-m="burger"] { display: inline-flex !important; } [data-m="menu"][data-open="true"] { display: flex !important; } } .ws-chrome-header a { color: #f4eee2; } .ws-chrome-header a:hover { color: #ffffff; } /* without scripting the drawn button could do nothing, so it is hidden and the menu panel rests open in the flow below the bar on phones (Savani Social's precedent, 2026-09-21); with scripting the drawing's closed state holds */ @container (max-width: 860px) { html:not(.js) [data-m="burger"] { display: none !important; } html:not(.js) [data-m="menu"] { display: flex !important; position: static !important; height: auto !important; } } /* ── the footer (Site Footer.dc.html helmet, verbatim) ───────────────────── */ .site-footer a { color: #9b8f78; } .site-footer a:hover { color: #06b6d4; } @container (max-width: 860px) { footer { padding-left: 20px !important; padding-right: 20px !important; } [data-m="footgrid"] { grid-template-columns: 1fr 1fr !important; gap: 36px 24px !important; } [data-m="footbrand"] { grid-column: 1 / -1 !important; } } /* ── the drawn hover states of the two partials, as classes (the port's method) ── */ .ws-h1:hover { background: rgba(216,198,162,0.09) !important; color: var(--ink) !important; } .ws-h2:hover { background: rgba(216,198,162,0.07) !important; } .ws-h3:hover { background: #ffffff !important; transform: translateY(-1px) !important; box-shadow: 0 2px 4px rgba(0,0,0,0.34), 0 10px 24px rgba(0,0,0,0.26) !important; } .ws-h4:hover { color: var(--cyan) !important; } .ws-h5:hover { color: var(--dark-active) !important; } .ws-h6:hover { color: var(--dark-active) !important; border-color: rgba(216,198,162,0.3) !important; } /* ── the consent widget (chrome/cookie-banner.html, from Cookie Banner.dc.html) ── Asleep until asked for: chrome/consent.js stamps data-consent on before paint, so nothing flashes; the drawn hover states of its pills. */ [data-cb] { display: none; } [data-consent="open"] [data-cb] { display: block; } [data-cb] [hidden] { display: none !important; } .ws-btn-reset { font-family: var(--font-body); margin: 0; } .ws-cb-accept:hover, .ws-cb-done:hover { background: #423e38 !important; } .ws-cb-reject:hover { background: #f7f5ef !important; border-color: rgba(82,62,38,0.5) !important; } [data-cb] [role="switch"]:focus-visible, [data-cb] button:focus-visible { outline: 2px solid #06b6d4; outline-offset: 3px; } /* ── the quality floor: the skip link (the family's ruled exception), parked off-screen until keyboard focus lands on it, styled as the drawn sand pill ── */ .ws-skip { position: absolute; top: 18px; left: 20px; z-index: 200; transform: translateY(-200px); background: #f4eee2; color: #1c1711; padding: 12px 22px; border-radius: 999px; font: 600 14px var(--font-body); text-decoration: none; box-shadow: 0 1px 2px rgba(0,0,0,0.3), 0 6px 16px rgba(0,0,0,0.22); } .ws-skip:focus-visible { transform: none; outline: 2px solid #06b6d4; outline-offset: 3px; } .ws-chrome-header a:focus-visible, .ws-chrome-header button:focus-visible, .site-footer a:focus-visible { outline: 2px solid #3cc6dc; outline-offset: 3px; }