/* ========================================================================== exp33 . THE WORDMARK AND HDR Loads after themes.css. No JS of its own, no markup. Companion: assets/hdr-event.css + the HDR module in assets/herograph.js. WHAT CHANGED, AND WHY This file used to paint the wordmark from PQ rasters at rest: the WHOLE mark from assets/hdr/wordmark-.png on the bright themes (terminal, night, acid, brutal) with `color:transparent !important` over the live text, and an enlarged .34em PQ period on the light themes. Under the founder's rule -- HDR is an event, nothing is HDR at rest -- a wordmark sitting in a header is at rest, so both were rule violations: a permanently emitting logo is the neon-signage failure applied to a brand mark. They were also broken as raster work. Measured on exp33 at 1440 and 390: terminal the raster is STALE. wordmark-manifest.json records the box it was cut for as 73.75 x 20.48 CSS px; the live element is now 68.23 x 20.48. background-size:contain therefore fits it by width and paints it ~8% short vertically, and its ink stops 9 device px inside the live text. Its colour is wrong too: it renders saturated #2BFF6F where this theme's wordmark ink is the pale phosphor #D2FFE2, because the raster was captured from exp28 / exp30, not from exp33. brutal ink 5 device px narrower than the live text. riso the period rendered BLUE. hdr-logo.css painted logo-dot-blue.png on every theme and riso had no override, so a theme whose period is hot pink (#FF3D9A) shipped a blue dot. paper riso olo verified the .34em period (6.95 CSS px) is wider than the period's own inline box (5.27 px) and sits lower, so the mark's ink box grew by ~200 device px and ran 3-5 px right and 4-5 px below the live text. No layout shift, but not the designed silhouette either. all bright themes `color:transparent !important` made the logo a single point of failure -- one 404 and the site has no wordmark -- and a bitmap is softer than live type at any dpr the raster was not cut for. At 200% page zoom the terminal mark went soft and dim. THE FIX IS A RETIREMENT, NOT A RE-CUT. Re-rasterising would have reproduced a permanently-HDR mark, so the resting mark is now the LIVE TEXT in every one of the eight themes: crisp at every dpr and zoom, correct in every theme's own ink by construction, impossible to go stale, and with no single point of failure. assets/hdr/wordmark-*.png and assets/hdr/logo-dot-*.png are left in the tree unreferenced. WHAT THE MARK DOES INSTEAD The period -- the one place the product signs its own claim -- flares once per loop of the hero graph, on the beat the graph resolves: ~150 ms at peak, then a phosphor decay. It is painted from a per-theme PQ disc, so on an HDR display the signature emits and on SDR it flares brighter. On a page with no hero graph nothing drives it and the mark simply rests. ONE THEME NOW SIGNS PERMANENTLY, AND NOT WITH A RASTER OVERLAY Founder's ruling: on the tube the period is HDR by default. assets/hdr-event.css section 7.3 does that for html[data-theme="terminal"] ONLY, and deliberately NOT by re-cutting anything this file retired -- there is no new overlay, no new box and no new em-positioned dot. It paints the period's own live GLYPH from a flat 8x8 PQ tile through background-clip:text, so the emitting pixels are the outline of the character: correct at every size, dpr and zoom by construction, unable to overflow the period's box, unable to go stale, and with a partial green fill underneath so the glyph survives a missing raster. Everything this file retired stays retired -- the wordmark's LETTERS are live text in all eight themes, and the period in the other seven rests dark. ========================================================================== */ /* ---------- the resting mark: live text, in the theme's own ink ---------- Nothing here paints. These declarations exist to UNDO the previous resting raster explicitly, so the retirement survives a stylesheet being reordered. */ .wordmark{background-image:none;} .wordmark, html[data-theme="terminal"] .wordmark, html[data-theme="night"] .wordmark, html[data-theme="acid"] .wordmark, html[data-theme="brutal"] .wordmark{ color:var(--ink); -webkit-text-fill-color:currentColor; } html[data-theme="brutal"] .wordmark, html[data-theme="acid"] .wordmark{color:#fff;} /* -webkit-text-fill-color INHERITS as a resolved colour, so the currentColor above would reach the period and repaint it in the wordmark's ink. The period keeps whatever colour its theme gives it (site.css --signal, with riso and brutal overriding); re-resolving currentColor here is what preserves that. */ .wordmark .dot{-webkit-text-fill-color:currentColor;} /* ---------- the flare layer ------------------------------------------- A positioned ::after over the period's own optical centre. Zero opacity and no background-image at rest, so the computed background-image of this LAYER is `none` between heartbeats in every theme -- that is the assertion the HDR-as-an-event rule is checked against, and it is unaffected by terminal's persistently emissive glyph, which is a fill on .dot and not this overlay. assets/hdr-event.css turns the flare on for the length of one heartbeat, and retunes its size and offset onto the measured ink for terminal. The glyph underneath is never hidden, so the mark is complete with or without the flare, with CSS off, or with the assets missing. */ .wordmark .dot{position:relative;} .wordmark .dot::after{ content:""; position:absolute; left:50%; bottom:.185em; /* image centre = period ink centre */ width:.34em; height:.34em; margin-left:.01em; transform:translateX(-50%) scale(.72); background:no-repeat center/contain; pointer-events:none; opacity:0; }