.crt-control{position:fixed;bottom:18px;right:20px;z-index:100;display:flex;align-items:center;gap:12px;padding:10px 14px;color:var(--ink);background:rgba(var(--paper-rgb),.84);border:1px solid var(--ink-25);backdrop-filter:blur(24px);box-shadow:inset 0 1px 0 var(--ink-10);max-width:calc(100vw - 40px)}
.crt-control button{appearance:none;border:1px solid var(--ink-25);background:transparent;color:var(--ink);padding:8px 12px;font:500 12px CafeHelvetica,Arial,sans-serif;cursor:pointer;white-space:nowrap}
.crt-control button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.crt-control button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
#glTrialState{display:none}
.hero-art.static-crt:before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(var(--ink-rgb),.16) 2px 3px);border-radius:5%;opacity:.65}
@media(max-width:700px){.crt-control{display:none}}
.crt-panel{position:fixed;right:20px;top:90px;z-index:101;width:280px;max-width:calc(100vw - 40px);color:var(--ink);background:var(--bg);border:1px solid var(--ink-25);font:12px CafeHelvetica,Arial,sans-serif;box-shadow:0 5px 22px rgba(var(--ink-rgb),.1)}
.crt-panel summary{padding:12px;cursor:pointer;list-style-position:inside;border-bottom:1px solid var(--ink-10)}
.crt-panel-body{padding:10px;max-height:calc(100vh - 175px);overflow:auto;overscroll-behavior:contain}
.crt-panel-body details{border:1px solid var(--ink-10);margin:8px 0}
.crt-panel label{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8px;padding:7px 10px}
.crt-panel input,.crt-panel select{min-width:0;width:100%;accent-color:var(--ink);color:var(--ink);background:var(--bg)}
.crt-panel input[type=checkbox]{width:16px;justify-self:end}
.crt-panel output{grid-column:2;font-size:10px;text-align:right}
.crt-panel button{border:1px solid var(--ink-25);background:var(--bg);color:var(--ink);padding:8px;cursor:pointer}
.crt-note{font-size:10px;line-height:1.5}
.crt-panel :focus-visible{outline:2px solid var(--ink);outline-offset:2px}
#background-crt{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;image-rendering:pixelated}
.live-fx-source,.live-fx-output{position:fixed!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover;pointer-events:none!important;z-index:0!important}
.final-pixel-grid{image-rendering:auto}
.work-cell .dither-wrap,.client .dither-wrap,.t8-pic .dither-wrap,.shop-card .dither-wrap{border:1px solid var(--ink-25);box-shadow:inset 0 1px 0 rgba(var(--ink-rgb),.18),0 5px 16px rgba(var(--ink-rgb),.08);isolation:isolate}
.work-cell .dither-wrap:after,.client .dither-wrap:after,.t8-pic .dither-wrap:after,.shop-card .dither-wrap:after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.16),transparent 28%,transparent 67%,rgba(var(--ink-rgb),.07)),linear-gradient(0deg,transparent 88%,rgba(255,255,255,.09))}
.dither-wrap:not(.hero-art .dither-wrap):not(.scene-accent .dither-wrap){border:1px solid var(--ink-25);box-shadow:inset 0 1px 0 rgba(var(--ink-rgb),.18),0 5px 16px rgba(var(--ink-rgb),.08);isolation:isolate}
.dither-wrap:not(.hero-art .dither-wrap):not(.scene-accent .dither-wrap):after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.16),transparent 28%,transparent 67%,rgba(var(--ink-rgb),.07)),linear-gradient(0deg,transparent 88%,rgba(255,255,255,.09))}
.static-background-crt:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(var(--ink-rgb),.12) 2px 3px)}
@media(max-width:700px){.crt-panel{top:auto;bottom:12px;right:12px;width:265px}.crt-panel-body{max-height:55vh}}
@media(max-width:700px){.crt-panel{width:265px}}

#sub,#subov,.live-fx-source,.live-fx-output{image-rendering:auto}
.static-background-crt #sub,.static-background-crt #subov{image-rendering:pixelated}
.dither-wrap[data-hologram="true"]>canvas{opacity:var(--holo-opacity,.58);transition:opacity .22s ease}
.dither-wrap[data-hologram="true"][data-interacting="true"]>canvas,#gallery .dither-wrap>canvas{opacity:1}
.dither-wrap[data-color-state="full"]:after,#gallery .dither-wrap:after{opacity:0}
.work-cell,.client,.shop-card{background:color-mix(in srgb,var(--bg) 28%,transparent)}
.dither-wrap[data-hologram="true"]{background:transparent}
@media(prefers-reduced-motion:reduce){.dither-wrap[data-hologram="true"]>canvas{transition:none}}

/* Discreet closed settings entry; native details preserves keyboard/touch behavior. */
.crt-panel:not([open]){width:44px;max-width:44px;border-color:transparent;background:transparent;box-shadow:none}
.crt-panel>summary{display:grid;place-items:center;width:44px;height:44px;box-sizing:border-box;padding:0;border-bottom:0;list-style:none;font-size:18px;opacity:.45}
.crt-panel>summary::-webkit-details-marker{display:none}
.crt-panel>summary:hover,.crt-panel>summary:focus-visible,.crt-panel[open]>summary{opacity:1}
.crt-panel>summary:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.crt-panel[open]>summary{margin-left:auto}
.crt-panel-body>button{font:inherit;color:var(--ink);background:transparent;border:1px solid var(--ink-25);padding:8px;margin:4px;cursor:pointer}

.static-background-crt:after{background:linear-gradient(0deg,rgba(var(--ink-rgb),.24) 0 35%,transparent 35%);background-size:100% calc(100vh / var(--background-scanline-count,720));opacity:var(--background-scanline-intensity,.5)}

.hero-inlay-active .type-layer{opacity:0}
.liquid-glyph-row{position:absolute;left:0;width:100%;max-width:none;pointer-events:none;z-index:2;image-rendering:auto}

/* Keep the semantic dock controls above the decorative hero overlap. */
.hero-live{position:relative;z-index:5}

.hero-bottom .hero-live{pointer-events:auto!important}

/* Drawn UI icons: no emoji fonts or variation-selector rendering. */
.ui-icon{display:inline-block;width:1em;height:1em;vertical-align:-.12em;flex:none;pointer-events:none;overflow:visible}.ui-icon path{vector-effect:non-scaling-stroke}.ch-arrow .ui-icon{width:1em;height:1em}.comm-open .dot .ui-icon{vertical-align:-.1em}.crt-panel>summary .ui-icon{width:15px;height:15px;vertical-align:middle}

/* Mobile retains the selected chrome sculpture and Central Core tribal divider. */
@media(max-width:700px){
 .layered-hero .hero-art{display:block;position:relative;top:auto;right:auto;width:min(100%,300px);height:auto;aspect-ratio:1;margin:-16px auto 24px;opacity:.9;clip-path:none;pointer-events:none}
 .hero-art img,.hero-art .dither-wrap,.hero-art .dither-wrap canvas{width:100%;height:auto;aspect-ratio:1;object-fit:contain}
 .wire-break{height:170px;width:100%;margin:0 auto;mask:none!important;-webkit-mask:none!important;overflow:visible;background:transparent}
 .wire-break:after{inset:0;mask:url('assets/sigil-pack/central-core-original.png') center/270px 270px no-repeat;-webkit-mask:url('assets/sigil-pack/central-core-original.png') center/270px 270px no-repeat;background:var(--ink)}
 .wire-break:before{background:none}
}

/* Static native hero type on mobile; sculpture shares the heading composition. */
@media(max-width:700px),(pointer:coarse){.layered-title,.layered-title .title-row,.layered-title .type-layer{filter:none!important;animation:none!important;transition:none!important;opacity:1}}
@media(max-width:700px){
 .layered-hero .hero-art{position:absolute;top:105px;right:24px;left:auto;width:calc(100% - 48px);max-width:330px;height:auto;aspect-ratio:1;margin:0;z-index:1;opacity:.48;clip-path:none;pointer-events:none}
 .layered-hero .layered-title{position:relative;z-index:2}
 .layered-hero .hero-bottom{position:relative;z-index:3}
}
