/* Tactile charcoal controls, clear glass around the work. Loaded last so the
   phone layout retains the same materials as desktop. Artwork stays unfiltered. */
:root{--soft-face:linear-gradient(145deg,#34373c,#23252a 60%,#1c1e22);--soft-raised:6px 7px 14px #0009,-3px -3px 9px #ffffff0c,inset 1px 1px 2px #ffffff2b,inset -2px -2px 4px #0007;--soft-pressed:inset 4px 4px 9px #000b,inset -2px -2px 6px #ffffff13,0 1px 0 #ffffff13;--clear-face:linear-gradient(135deg,#ffffff23,#ffffff05 45%,#11182030);--clear-edge:inset 0 1px 1px #ffffff70,inset 1px 0 1px #ffffff2b,inset 0 -1px 1px #ffffff22,0 16px 45px #0005}
:is(header nav a,.media-links a,.glass-link,.all-work,.back,.menu-button,.pager button,.filters button,[id=flow-open],.video-caption>a,.photo-index>summary,footer small a,.menu-panel button,.hero-select button,[id=lightbox] .controls button,[id=lightbox] .controls a,[id=lightbox-close],.glass-video .gv-button){border:1px solid #ffffff0d;background:var(--soft-face);box-shadow:var(--soft-raised);color:#f2f1ef;border-radius:16px;min-height:44px;backdrop-filter:none;-webkit-backdrop-filter:none;transition:box-shadow .2s,background .2s,transform .2s var(--ease-out);text-shadow:0 1px 2px #0008}
header nav{gap:8px;padding:8px;border-radius:24px;background:#111215;box-shadow:var(--soft-pressed);border-color:#ffffff08}
header nav a{padding:10px 16px;color:#c9cbd1;border-radius:17px}
header nav a.active,.filters button.active,.filters .chip.active,.hero-select button.selected,.photo-index[open]>summary,#lightbox-zoom[aria-pressed=true]{background:linear-gradient(145deg,#16181c,#24262b);box-shadow:var(--soft-pressed);border-color:#ffffff12;color:#f4dab3}
.media-links a,.media-links .brand-link,.glass-link{border-radius:22px;overflow:visible;background:var(--soft-face);box-shadow:var(--soft-raised);border-color:#ffffff0d}
.glass-link::after{display:none}.link-mark{background:#1b1d21;box-shadow:var(--soft-pressed);border:1px solid #ffffff08;color:#f0dfc5}.brand-mark img{filter:none!important;transform:none!important}.brand-link .link-label small,.link-label small{color:#cacbd0}
.media-links .brand-youtube,.media-links .brand-twitch{background:var(--soft-face);border-color:#ffffff0d}
.hero-select{gap:9px;padding:9px;border-radius:24px;background:#111215;box-shadow:var(--soft-pressed);border:1px solid #ffffff08}.hero-select button{border-radius:15px;min-width:44px}
.filters{padding-top:12px;padding-bottom:18px;gap:13px}.filters .chip,.filters .view-toggle{background:var(--soft-face);box-shadow:var(--soft-raised);border-color:#ffffff0d;border-radius:15px}
.menu-button{padding:10px 14px;border-radius:15px}.all-work,.back,.pager button,#flow-open,.video-caption>a,.photo-index>summary,footer small a{border-radius:17px}.all-work{box-shadow:var(--soft-raised)}
#lightbox .controls button,#lightbox .controls a,#lightbox-close{border-radius:15px;box-shadow:var(--soft-raised);background:var(--soft-face);border-color:#ffffff18}.glass-video .gv-button{border-radius:12px;box-shadow:3px 4px 8px #0006,inset 1px 1px 1px #ffffff2b,inset -1px -1px 2px #0007}
@media(hover:hover) and (pointer:fine){:is(header nav a,.media-links a,.glass-link,.all-work,.back,.menu-button,.pager button,.filters button,[id=flow-open],.video-caption>a,.photo-index>summary,footer small a,.menu-panel button,.hero-select button,[id=lightbox] .controls button,[id=lightbox] .controls a,[id=lightbox-close],.glass-video .gv-button):hover{background:linear-gradient(145deg,#41444a,#292c31);box-shadow:7px 9px 18px #0009,-3px -3px 10px #ffffff10,inset 1px 1px 2px #ffffff36,inset -2px -2px 4px #0006;border-color:#ffffff20;color:#fff;transform:translateY(-1px)}}
:is(header nav a,.media-links a,.glass-link,.all-work,.back,.menu-button,.pager button,.filters button,[id=flow-open],.video-caption>a,.photo-index>summary,footer small a,.menu-panel button,.hero-select button,[id=lightbox] .controls button,[id=lightbox] .controls a,[id=lightbox-close],.glass-video .gv-button):active{background:linear-gradient(145deg,#17191d,#25272c);box-shadow:var(--soft-pressed);transform:translateY(1px) scale(.985)}
/* Real backdrop translucency, plus restrained reflected artwork at frame edges.
   Decorative image reflections never sit on top of the photograph. */
header,.home header,.home header.scrolled{background:linear-gradient(125deg,#15181b99,#080b0e6b);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border-bottom:1px solid #ffffff25;box-shadow:inset 0 1px 0 #ffffff20,0 8px 24px #0002}
.viewer-veil{background:#03050755}.viewer-surface,.glass-morph{background:var(--clear-face);border-color:#ffffff52;box-shadow:var(--clear-edge);backdrop-filter:blur(18px) saturate(1.45);-webkit-backdrop-filter:blur(18px) saturate(1.45)}
.viewer-surface::before{content:'';position:absolute;inset:-45px;z-index:-1;pointer-events:none;background-image:var(--artwork,none);background-size:cover;background-position:center;filter:blur(40px) saturate(1.2);opacity:.24}.viewer-surface::after,.glass-morph::after{box-shadow:inset 0 1px 1px #ffffff77,inset 1px 0 1px #ffffff30,inset 0 -1px 1px #ffffff30;background:linear-gradient(125deg,#ffffff0a,transparent 30%,transparent 75%,#ffffff08)}
#lightbox .lightbox-bar,#lightbox-count{color:#f4f5f6;text-shadow:0 1px 4px #000,0 0 12px #000}#lightbox .lightbox-stage{position:relative;z-index:1}
.flow-art,.glass-gallery button{position:relative;isolation:isolate;overflow:hidden;background:var(--clear-face);border-color:#ffffff55;box-shadow:var(--clear-edge);backdrop-filter:blur(12px) saturate(1.5);-webkit-backdrop-filter:blur(12px) saturate(1.5);padding:11px;border-radius:16px}
.flow-art::before,.glass-gallery button::before{content:'';position:absolute;inset:-20px;z-index:-1;background-image:var(--artwork,none);background-size:cover;background-position:center;filter:blur(18px);opacity:.4;pointer-events:none}.flow-art img,.glass-gallery img{position:relative;filter:none;opacity:1!important;border-radius:7px}.glass-gallery button::after{background:none;inset:0;opacity:1;transform:none;box-shadow:inset 0 1px 1px #ffffff66,inset 1px 0 1px #ffffff25;border-radius:inherit}.flow-art::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 1px 1px #ffffff66,inset 1px 0 1px #ffffff25}
.glass-video .gv-controls{background:linear-gradient(135deg,#ffffff22,#0a101c55);border:1px solid #ffffff55;box-shadow:var(--clear-edge);backdrop-filter:blur(12px) saturate(1.6);-webkit-backdrop-filter:blur(12px) saturate(1.6)}
.glass-video .gv-time{color:#fff;text-shadow:0 1px 3px #000,0 0 8px #000}.glass-video .gv-progress::before{box-shadow:inset 0 1px 3px #0009,0 1px 0 #ffffff35;background-color:#0a0d1277}
.glass-video .gv-center,.glass-video .gv-center:hover{background:linear-gradient(135deg,#ffffff30,#15192350);border-color:#ffffff77;box-shadow:var(--clear-edge);backdrop-filter:blur(10px) saturate(1.5);-webkit-backdrop-filter:blur(10px) saturate(1.5);text-shadow:0 1px 4px #000}.glass-video .gv-center:active{box-shadow:inset 2px 3px 8px #0007,inset -1px -1px 3px #ffffff50}
.menu-panel,.menu-panel.open{background:#0c1019b3!important;backdrop-filter:blur(20px) saturate(1.35);-webkit-backdrop-filter:blur(20px) saturate(1.35)}
@media(max-width:1100px) and (min-width:801px){header nav{gap:5px;padding:6px}header nav a{padding-inline:10px}}
@media(max-width:600px){
 header,.home header{background:linear-gradient(125deg,#15181b99,#080b0e80)}
 .menu-button{min-width:74px;padding:10px 12px}.hero-select{gap:9px;padding:9px;border-radius:23px}.hero-select button{width:44px;height:44px;border-radius:14px}.hero-select button.selected{background:linear-gradient(145deg,#16181c,#24262b);color:#f4dab3;border-color:#ffffff12;box-shadow:var(--soft-pressed)}
 .media-links,.stream-links{gap:18px}.media-links a,.media-links .brand-link,.glass-link{border-radius:20px;box-shadow:var(--soft-raised)}.filters{padding-top:12px;padding-bottom:18px;gap:12px}.filters .chip.active{background:linear-gradient(145deg,#16181c,#24262b);box-shadow:var(--soft-pressed);color:#f4dab3;border-color:#ffffff12}
 .project-head .back,.pager button,.flow-status button,.photo-index>summary,.video-caption>a,footer small a{box-shadow:var(--soft-raised)}footer small a{padding-inline:15px}
 .flow-art{padding:9px;border-radius:14px}.photo-index .gallery button{padding:7px;border-radius:12px}.photo-index .gallery img{border-radius:5px}
 /* Preserve the full film on phones; the floating glass shelf reflects its poster. */
 .glass-video{background:#0b0d10;box-shadow:0 15px 35px #0004}.glass-video .gv-controls{margin:7px;width:calc(100% - 14px);padding:5px;gap:3px;border:1px solid #ffffff4a;border-radius:15px;background:linear-gradient(135deg,#ffffff22,#10152077);isolation:isolate;overflow:hidden;min-height:56px}
 .glass-video .gv-controls::before{content:'';position:absolute;inset:-25px;z-index:-1;pointer-events:none;background-image:var(--artwork,none);background-size:cover;background-position:center 75%;filter:blur(16px);opacity:.42}
 .glass-video .gv-button{box-shadow:2px 3px 6px #0006,inset 1px 1px 1px #ffffff2b}.glass-video .gv-time{font-size:8px;margin-inline:1px}.glass-video .gv-progress{min-width:15px}.glass-video .gv-center{top:calc(50% - 35px)}
 .glass-video.is-fullscreen .gv-controls{margin:0;width:auto}.viewer-surface{border-color:#ffffff50}.menu-panel .mobile-menu-links{background:none;box-shadow:none}.menu-panel .mobile-menu-links a{background:none;box-shadow:none;border-radius:0;text-shadow:0 1px 4px #000}
}
@media(max-width:350px){.glass-video .gv-controls{margin:5px;width:calc(100% - 10px);padding:4px;gap:2px}}
@media(prefers-reduced-transparency:reduce){header,.home header,.home header.scrolled,.viewer-surface,.glass-morph,.glass-video .gv-controls,.glass-video .gv-center,.menu-panel,.menu-panel.open,.flow-art,.glass-gallery button{background:#1b1e23!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.viewer-veil{background:#050709ee}.viewer-surface::before,.flow-art::before,.glass-gallery button::before,.glass-video .gv-controls::before{display:none}}
@media(prefers-contrast:more){:is(header nav a,.media-links a,.glass-link,.all-work,.back,.menu-button,.pager button,.filters button,[id=flow-open],.video-caption>a,.photo-index>summary,footer small a,.menu-panel button,.hero-select button,[id=lightbox] .controls button,[id=lightbox] .controls a,[id=lightbox-close],.glass-video .gv-button){border-color:#d9dde2;color:#fff}.viewer-surface,.glass-video .gv-controls,.glass-video .gv-center{background:#15181cee;border-color:#fff}.viewer-surface::before,.glass-video .gv-controls::before{display:none}.link-label small{color:#fff}}
@media(forced-colors:active){:is(header nav a,.media-links a,.glass-link,.all-work,.back,.menu-button,.pager button,.filters button,[id=flow-open],.video-caption>a,.photo-index>summary,footer small a,.menu-panel button,.hero-select button,[id=lightbox] .controls button,[id=lightbox] .controls a,[id=lightbox-close],.glass-video .gv-button){background:ButtonFace;color:ButtonText;border:1px solid ButtonText;box-shadow:none;text-shadow:none}.viewer-surface::before,.flow-art::before,.glass-gallery button::before,.glass-video .gv-controls::before{display:none}}
@media(prefers-reduced-motion:reduce){:is(header nav a,.media-links a,.glass-link,.all-work,.back,.menu-button,.pager button,.filters button,[id=flow-open],.video-caption>a,.photo-index>summary,footer small a,.menu-panel button,.hero-select button,[id=lightbox] .controls button,[id=lightbox] .controls a,[id=lightbox-close],.glass-video .gv-button){transition:none!important;transform:none!important}}
/* ID-scoped legacy viewer controls and selected navigation retain the same face. */
:root header nav a.active{background:linear-gradient(145deg,#16181c,#24262b);box-shadow:var(--soft-pressed);color:#f4dab3;border-color:#ffffff12}
:root .media-links a,:root .media-links .brand-link{border-radius:22px}
#flow-open{background:var(--soft-face);box-shadow:var(--soft-raised);border:1px solid #ffffff0d;color:#f2f1ef}
#flow-open:active,#lightbox .controls button:active,#lightbox .controls a:active,#lightbox-close:active{background:linear-gradient(145deg,#17191d,#25272c);box-shadow:var(--soft-pressed);transform:translateY(1px) scale(.985)}
@media(prefers-contrast:more){#flow-open{border-color:#ddd;color:#fff}}
@media(forced-colors:active){#flow-open{background:ButtonFace;color:ButtonText;border-color:ButtonText;box-shadow:none}}
@media(prefers-reduced-motion:reduce){#flow-open:active,#lightbox .controls button:active,#lightbox .controls a:active,#lightbox-close:active{transform:none!important}}
