/* Photographic cast-bronze relief matched to the actual mirror.
   Nine-slice framing preserves the acanthus ends on differently sized controls. */
.languages,.menu-toggle,.hero-caption summary,.carousel-controls{
 isolation:isolate;background:none;border:0;box-shadow:none;border-radius:4px;
 filter:drop-shadow(1px 2px 2px #1a100b66);color:#e2cfad;text-shadow:0 1px 2px #110a05;
}
.languages::before,.menu-toggle::before,.hero-caption summary::before,.carousel-controls::before{
 content:'';display:block;position:absolute;inset:0;width:auto;height:auto;
 border-style:solid;border-color:transparent;border-width:8px 18px;
 border-image: url('./assets/ui-mirror-bronze-v9.webp') 24% 14% fill / clamp(6px,.9cqw,10px) clamp(12px,2cqw,22px) / 0 stretch;
 border-radius:0;background:none;box-shadow:none;transform:none;opacity:1;pointer-events:none;z-index:-1;
}
.languages{position:relative;padding:5px 18px;gap:5px}
.languages span{color:#ab926b}.languages button{color:#e2cfad}
.menu-toggle{position:relative;width:38px;height:38px;padding:12px;gap:4px}
.menu-toggle::before{border-image-width:8px 10px}
.menu-toggle span{background:#d4bc94;box-shadow:0 1px #140c07}
.hero-caption summary{padding:9px 30px;min-height:39px;border-radius:0}
.hero-caption summary::after{color:#ccb28a;font-size:11px}
.hero-caption h1{font-size:clamp(11px,1.7cqw,19px);color:#e4cfaa;letter-spacing:.12em}
.carousel-controls{padding:7px 23px;min-height:42px;border-radius:0}
.carousel-controls::after{display:none}
.carousel-controls button{color:#d6bc94;height:28px;min-width:25px}
.dots button::after{background:#927650;box-shadow:0 1px #1b1008}
.dots button[aria-current=true]::after{background:#ead2a7;box-shadow:0 0 0 1px #725438}
.languages:hover,.menu-toggle:hover,.hero-caption summary:hover{filter:drop-shadow(1px 2px 2px #1a100b66) brightness(1.06)}
.carousel-controls button:hover{color:#fff1d5}
@media(max-width:480px){
 .languages{padding:3px 14px;gap:3px}.languages button{font-size:9px;min-width:18px}
 .menu-toggle{width:33px;height:33px;padding:10px}
 .hero-caption summary{padding:7px 23px;min-height:31px}
 .hero-caption h1{font-size:10px}.hero-caption summary::after{font-size:9px}
 .carousel-controls{padding:4px 17px;min-height:32px}
 .carousel-controls button{height:24px;min-width:20px;font-size:12px}
 .dots button{min-width:8px}
}
@media(max-width:360px){.carousel-controls{top:78.2cqw;min-height:27px;padding-top:3px;padding-bottom:3px}.carousel-controls button{height:20px}}