:root { --ink:#000; --paper:#fff; --soft-paper:#f9f9f9; --line:#e7e7e7; --shade:rgba(0,0,0,.68); --max:1160px; }
* { box-sizing:border-box; }
html { height:100%; overflow:hidden; background:var(--soft-paper); color:var(--ink); font-family:Merriweather,Arial,sans-serif; }
body { display:flex; flex-direction:column; height:100vh; height:100dvh; max-height:100dvh; margin:0; overflow:hidden; }
#main { flex:1 1 auto; min-height:0; overflow:hidden; }
a { color:inherit; }
.skip-link { position:fixed; left:1rem; top:-4rem; z-index:10; background:var(--paper); padding:.75rem 1rem; }
.skip-link:focus { top:1rem; }
.page { width:min(100% - 2rem,var(--max)); height:100%; min-height:0; margin:0 auto; padding:5.4rem 0 .45rem; overflow:hidden; display:flex; flex-direction:column; }
.page h1 { flex:0 0 auto; margin:0 0 .45rem; font-size:clamp(1.55rem,3.4vh,2.7rem); }
.page h2 { margin:.6rem 0 .3rem; font-size:clamp(1rem,2vh,1.35rem); }
.page p { max-width:78ch; margin:.2rem 0; font-size:clamp(.78rem,1.7vh,1rem); line-height:1.35; }
.page .lede { font-size:1.2rem; font-weight:700; }
.service-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:.6rem; margin-top:.4rem; }
.service-card { min-height:0; padding:.7rem .9rem; border:1px solid var(--line); background:var(--paper); }
.service-card h2 { margin-top:0; }
.service-card a { font-weight:900; }
.price-grid { display:grid; flex:1 1 auto; min-height:0; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; margin:.4rem 0; }
.price-card { min-height:0; display:flex; flex-direction:column; overflow:hidden; padding:0 0 .6rem; background:var(--ink); color:var(--paper); text-align:center; }
.price-card h2 { margin:0; padding:0 1rem; }
.price-card strong { display:block; margin-top:.7rem; padding:0 1rem; font-size:2rem; }
.gallery-list { display:grid; gap:1rem; padding:0; list-style:none; }
.gallery-list a { display:block; padding:1rem 1.25rem; border-left:5px solid var(--ink); background:var(--paper); font-weight:700; }
.gallery-page { width:100%; background:url("assets/portal-background-template.png") center/cover no-repeat; }
.gallery-carousel { flex:1 1 auto; min-height:0; display:grid; grid-template-columns:minmax(0,1fr); overflow:hidden; padding:.55rem max(1rem,calc((100vw - 1320px)/2)); background:transparent; color:var(--paper); }
.gallery-player iframe,.gallery-player video { width:100%; height:100%; border:0; object-fit:contain; }
.gallery-caption { display:none; }
.gallery-caption h2,.gallery-caption p { margin:0; }
.gallery-caption h2 { font-size:clamp(1rem,2.2vh,1.45rem); }
.gallery-caption .gallery-category { color:#d8d8d8; font-size:.72rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.gallery-controls { display:none; }
.gallery-controls button { border:1px solid var(--paper); background:transparent; color:var(--paper); cursor:pointer; font:inherit; font-weight:900; padding:.3rem .65rem; }
.gallery-controls button:hover,.gallery-controls button:focus-visible { background:var(--paper); color:var(--ink); }
.gallery-strip { display:grid; grid-template-columns:minmax(16rem,32rem); justify-content:end; align-content:start; gap:.6rem; min-height:0; overflow-y:auto; overflow-x:hidden; padding:0 .15rem 0 0; scroll-snap-type:y mandatory; }
.gallery-choice { min-width:0; display:grid; gap:.15rem; padding:0; border:2px solid transparent; background:transparent; color:var(--paper); cursor:pointer; text-align:left; scroll-snap-align:center; }
.gallery-choice-player { width:100%; height:104px; background:#121212; }
.gallery-choice-player iframe,.gallery-choice-player video { display:block; width:100%; height:100%; border:0; object-fit:contain; }
.gallery-choice span { padding:0 .25rem .25rem; overflow:hidden; font:700 .7rem/1.15 Merriweather,Arial,sans-serif; white-space:nowrap; text-overflow:ellipsis; }
.gallery-choice.is-selected { border-color:#f0c95a; box-shadow:0 0 0 2px #f0c95a; }
.gallery-choice:focus-visible { outline:3px solid #f0c95a; outline-offset:2px; }
.callout { margin:2rem 0; padding:1.5rem; border-left:5px solid var(--ink); background:var(--paper); }
.content-image { display:block; flex:0 1 22vh; width:auto; max-width:min(100%,480px); height:22vh; margin:0 0 .4rem; object-fit:contain; object-position:left center; border:1px solid var(--line); }
.price-image { display:block; flex:1 1 auto; width:100%; min-height:0; height:auto; margin:0; object-fit:contain; background:#fff; }
.biography-page h1 { text-align:center; }
.biography-columns { flex:1 1 auto; min-height:0; display:grid; grid-template-columns:minmax(180px,.85fr) minmax(0,1.2fr); gap:1.1rem; align-items:stretch; }
.biography-columns img { width:100%; height:100%; max-height:100%; object-fit:contain; object-position:center top; }
.biography-copy { min-height:0; display:flex; flex-direction:column; justify-content:center; gap:.65rem; color:#0d6a28; }
.biography-copy p { max-width:none; margin:0; color:#0d6a28; font-size:clamp(.72rem,1.55vh,1.02rem); line-height:1.38; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.portal-frame { position:relative; flex:0 1 auto; width:min(100%,calc((100dvh - 7.25rem) * 1680 / 940)); max-height:calc(100dvh - 7.25rem); min-height:0; margin:0 auto; background:#000; }
.portal-topbar { position:absolute; z-index:6; top:2.2%; left:2.4%; min-height:0; padding:0; background:transparent; }
.portal-topbar .portal-menu { position:relative; top:auto; left:auto; color:#fff; text-shadow:0 2px 4px #000; }
.portal-page { position:relative; width:100%; aspect-ratio:1680/940; background:center top/100% 100% no-repeat; }
.portal-page[data-portal="director"][data-mode="login"] { background-image:url("assets/portal/directors-login.png"); }
.portal-page[data-portal="director"][data-mode="create"] { background-image:url("assets/portal/directors-create-account.png"); }
.portal-page[data-portal="tuning"][data-mode="login"] { background-image:url("assets/portal/piano-tuning-login.png"); }
.portal-page[data-portal="tuning"][data-mode="create"] { background-image:url("assets/portal/piano-tuning-create-account.png"); }
.portal-page[data-portal="admin"] { background-image:url("assets/portal/admin-login.png"); }
.portal-menu { position:absolute; z-index:4; top:2%; left:3%; color:var(--paper); }
.portal-menu > summary { cursor:pointer; list-style:none; font-weight:900; text-shadow:0 2px 3px #000; }
.portal-menu > summary::-webkit-details-marker { display:none; }
.portal-menu nav { position:absolute; top:calc(100% + .65rem); left:0; display:grid; min-width:220px; border:1px solid #555; background:rgba(0,0,0,.92); box-shadow:0 10px 24px rgba(0,0,0,.45); }
.portal-menu a { padding:.75rem 1rem; color:var(--paper); font-size:.82rem; font-weight:700; text-decoration:none; }
.portal-menu a:hover,.portal-menu a:focus-visible { background:#333; }
.portal-form,.portal-hit,.portal-input { position:absolute; }
.portal-form { inset:0; }
.portal-hit { z-index:2; border:0; background:transparent; color:transparent; text-decoration:none; cursor:pointer; }
.portal-hit:focus-visible,.portal-input:focus-visible { outline:3px solid #fff; outline-offset:2px; }
.portal-login-switch { left:49.5%; top:33.2%; width:22.5%; height:9.3%; }
.portal-create-switch { left:27.5%; top:33.2%; width:22.5%; height:9.3%; }
.portal-input { z-index:1; left:33.6%; width:32.2%; height:5.8%; border:0; border-radius:2px; background:transparent; color:#fff; color-scheme:dark; caret-color:#fff; -webkit-text-fill-color:#fff; box-shadow:none; font:700 clamp(.7rem,1.5vw,1.2rem)/1 Arial,Helvetica,sans-serif; padding:0 1.2%; }
.portal-input:-webkit-autofill,.portal-input:-webkit-autofill:hover,.portal-input:-webkit-autofill:focus { -webkit-text-fill-color:#fff; caret-color:#fff; box-shadow:0 0 0 1000px #161616 inset; transition:background-color 99999s ease-out; }
.portal-password { top:64.1%; }
.portal-username { top:52.0%; }
.portal-forgot { left:55%; top:70%; width:14%; height:5%; }
.portal-login-submit { left:39%; top:78%; width:22%; height:9%; }
.portal-name { top:44.4%; }.portal-email { top:55%; }.portal-new-password { top:65.5%; }.portal-confirm-password { top:76%; }.portal-create-submit { left:38%; top:84%; width:24%; height:9%; }
.portal-page[data-mode="login"] [data-portal-fields="create"],.portal-page[data-mode="create"] [data-portal-fields="login"] { display:none; }
.portal-page[data-portal="admin"] .portal-login-switch { display:none; }.portal-page[data-portal="admin"] .portal-username { top:47.5%; }.portal-page[data-portal="admin"] .portal-password { top:62.2%; }.portal-page[data-portal="admin"] .portal-forgot { top:69%; }.portal-page[data-portal="admin"] .portal-login-submit { top:78%; }
.portal-preview { width:min(100%,1680px); margin:0 auto; background:var(--ink); }
.portal-preview img { display:block; width:100%; height:auto; }
.portal-preview-controls { display:flex; justify-content:center; gap:.8rem; padding:1rem; background:var(--ink); }
.portal-preview-controls button { border:1px solid var(--paper); border-radius:.35rem; padding:.75rem 1rem; background:transparent; color:var(--paper); cursor:pointer; font:900 .85rem/1 Merriweather,Arial,sans-serif; }
.portal-preview-controls button[aria-pressed="true"],.portal-preview-controls button:hover,.portal-preview-controls button:focus-visible { background:var(--paper); color:var(--ink); }
body.is-portal-route { height:100vh; height:100dvh; max-height:100dvh; overflow:hidden; background:#000; }
body.is-portal-route #main { display:flex; align-items:center; justify-content:center; min-height:0; }
@media (max-width:700px) { .page { padding-top:4.4rem; } .biography-columns { gap:.45rem; } .biography-copy p { font-size:.62rem; line-height:1.25; } .gallery-strip { grid-template-columns:minmax(12rem,72vw); } .gallery-choice-player { height:72px; } .gallery-choice span { display:block; font-size:.55rem; } }
@media (max-width:600px) { .portal-menu { top:1.5%; left:2%; font-size:.72rem; } }
/* Supplied bitmap pages: the PNG is the rendered surface; controls are transparent overlays. */
body.is-bitmap-route { min-height:100vh; overflow:auto; background:#000; }
body.is-bitmap-route #main { display:flex; min-height:100vh; align-items:flex-start; justify-content:flex-start; margin:0; padding:0; }
.bitmap-page { position:relative; width:100vw; height:100dvh; aspect-ratio:auto; margin:0; overflow:hidden; background:#000; }
.bitmap-surface { display:block; width:100%; height:100%; object-fit:fill; user-select:none; }
.bitmap-controls { position:absolute; inset:0; z-index:2; pointer-events:none; }
.bitmap-controls > * { position:absolute; pointer-events:auto; }
.bitmap-menu { z-index:4; left:1.35%; top:3.2%; color:transparent; font:16px/1.1 Arial,sans-serif; }
.bitmap-menu summary { width:85px; height:30px; cursor:pointer; list-style:none; }
.bitmap-menu summary::-webkit-details-marker { display:none; }
.bitmap-menu nav { position:absolute; top:34px; left:0; display:flex; flex-direction:column; gap:8px; width:clamp(280px,34vw,390px); max-height:calc(100dvh - 50px); overflow-y:auto; padding:10px 0; border:1px solid #d3a62e; background:rgba(0,0,0,.97); box-shadow:0 8px 22px #000; }
.bitmap-menu nav a { position:static; display:block; flex:0 0 auto; padding:12px 16px; color:#fff; font:700 18px/1.35 Arial,sans-serif; text-decoration:none; white-space:nowrap; }
.bitmap-menu nav a:hover,.bitmap-menu nav a:focus-visible { color:#fff; }
.bitmap-menu nav details { position:static; }
.bitmap-menu nav details { flex:0 0 auto; }
.bitmap-menu nav details[open] { display:grid; gap:8px; }
.bitmap-menu nav details summary { display:block; padding:12px 16px; color:#fff; cursor:pointer; list-style:none; font:700 18px/1.35 Arial,sans-serif; white-space:nowrap; }
.bitmap-menu nav details > a { padding-left:32px; }
.bitmap-menu nav details summary::-webkit-details-marker { display:none; }
.bitmap-menu nav details summary:hover,.bitmap-menu nav details summary:focus-visible { color:#fff; }
.bitmap-menu nav .menu-accompanying:hover > summary,.bitmap-menu nav .menu-accompanying:focus-within > summary,.bitmap-menu nav .menu-accompanying > a:hover,.bitmap-menu nav .menu-accompanying > a:focus-visible { color:#ff3b30; }
.bitmap-menu nav .menu-biography:hover,.bitmap-menu nav .menu-biography:focus-visible { color:#ff8c00; }
.bitmap-menu nav .menu-piano-tuning:hover > summary,.bitmap-menu nav .menu-piano-tuning:focus-within > summary,.bitmap-menu nav .menu-piano-tuning > a:hover,.bitmap-menu nav .menu-piano-tuning > a:focus-visible { color:#ffd400; }
.bitmap-menu nav .menu-special-ceremonies:hover > summary,.bitmap-menu nav .menu-special-ceremonies:focus-within > summary,.bitmap-menu nav .menu-special-ceremonies > a:hover,.bitmap-menu nav .menu-special-ceremonies > a:focus-visible { color:#19c463; }
.bitmap-menu nav .menu-teachers-directors:hover > summary,.bitmap-menu nav .menu-teachers-directors:focus-within > summary,.bitmap-menu nav .menu-teachers-directors > a:hover,.bitmap-menu nav .menu-teachers-directors > a:focus-visible { color:#3b82f6; }
.bitmap-menu nav .menu-video-gallery:hover,.bitmap-menu nav .menu-video-gallery:focus-visible { color:#a855f7; }
.bitmap-menu nav .menu-administrative-login:hover,.bitmap-menu nav .menu-administrative-login:focus-visible { color:#ff1493; }
.bitmap-menu nav .menu-separator { position:static; height:0; margin:5px 12px; border-top:1px solid #8b6b20; }

.bitmap-email,.bitmap-phone,.bitmap-facebook { z-index:3; top:3%; width:4.5%; height:10%; border:0; background:transparent; cursor:pointer; }
.bitmap-email { right:7.5%; }
.bitmap-phone { right:4.2%; }
.bitmap-facebook { right:.5%; }
.bitmap-phone-flydown { z-index:7; top:13%; right:1.5%; display:grid; gap:.25rem; min-width:210px; padding:.7rem .85rem; border:1px solid #d3a62e; background:rgba(0,0,0,.96); box-shadow:0 8px 22px #000; color:#fff; font:700 16px/1.25 Arial,sans-serif; }
.bitmap-phone-flydown[hidden] { display:none; }
.bitmap-phone-flydown a { position:static; display:block; color:#fff; font:900 20px/1.25 Arial,sans-serif; text-decoration:none; }
.bitmap-phone-flydown a:hover,.bitmap-phone-flydown a:focus-visible { color:#f0c95a; }
.bitmap-footer { z-index:3; left:0; right:0; bottom:0; height:13%; }
.bitmap-footer a { position:absolute; top:0; height:58%; color:transparent; font-size:0; line-height:0; text-indent:-9999px; text-decoration:none; pointer-events:auto; }
.bitmap-footer a:nth-child(1){left:5%;width:12%}.bitmap-footer a:nth-child(2){left:20%;width:15%}.bitmap-footer a:nth-child(3){left:37%;width:10%}.bitmap-footer a:nth-child(4){left:52%;width:17%}.bitmap-footer a:nth-child(5){left:70%;width:17%}.bitmap-footer a:nth-child(6){left:88%;width:9%}
.bitmap-footer a { pointer-events:auto; }
.bitmap-action,.bitmap-card-link { z-index:3; }
.accompanying-action { left:57.4%; top:70.6%; width:19.3%; height:10.4%; }
.funerals-action { left:42.3%; top:72.7%; width:9%; height:7%; }
.weddings-action { left:42.3%; top:72.7%; width:9%; height:7%; }
.pricing-left,.pricing-right { top:37%; width:25%; height:41%; }
.pricing-left{left:14.5%}.pricing-right{left:60.5%}
.gallery-hot { z-index:3; border:0; background:transparent; color:transparent; cursor:pointer; }
.gallery-prev,.gallery-next { top:76%; width:4%; height:9%; }
.gallery-prev{left:8.5%}.gallery-next{right:8.5%}
.gallery-status { z-index:2; left:21.5%; top:61.5%; color:transparent; width:15%; height:5%; }
.gallery-live-player { z-index:3; left:2%; top:32%; width:62%; height:27%; background:#000; border:2px solid #d3a62e; }
.gallery-live-player video,.gallery-live-player iframe { display:block; width:100%; height:100%; border:0; object-fit:contain; }
.gallery-thumbnail-hots { z-index:4; left:12%; right:12%; bottom:14%; height:10%; display:grid; grid-template-columns:repeat(21,minmax(0,1fr)); gap:.6%; }
.gallery-thumbnail-hots button { position:static; min-width:0; border:2px solid transparent; background:transparent; cursor:pointer; }
.gallery-thumbnail-hots button:hover,.gallery-thumbnail-hots button:focus-visible,.gallery-thumbnail-hots button.is-selected { border-color:#f0c95a; }
.bitmap-portal-form { position:absolute; inset:0; z-index:2; }
.portal-hot,.portal-submit-hot,.portal-create-submit-hot,.portal-forgot-hot,.portal-field { position:absolute; z-index:4; box-sizing:border-box; }
.portal-hot { top:29%; width:17%; height:10%; border:0; background:transparent; cursor:pointer; }
.portal-create-switch{left:35%}.portal-login-switch{left:50%}
.portal-field { left:38.2%; width:22.7%; height:5.2%; border:0; border-radius:2px; background:rgba(0,0,0,.55); color:#fff; caret-color:#fff; padding:0 8px; font:700 14px/1 Arial,sans-serif; }
.portal-field:focus-visible,.portal-hot:focus-visible,.portal-submit-hot:focus-visible,.portal-create-submit-hot:focus-visible,.portal-forgot-hot:focus-visible { outline:2px solid #fff; outline-offset:2px; }
.portal-identity{top:45.5%}.portal-password{top:56.2%}.portal-forgot-hot{left:54%;top:62%;width:10%;height:5%;color:transparent}.portal-submit-hot{left:43%;top:69%;width:15%;height:9%;border:0;background:transparent;cursor:pointer}
.portal-create-fields{display:contents}.portal-create-fields .portal-name{top:38.2%}.portal-create-fields .portal-email{top:47.4%}.portal-create-fields .portal-new-password{top:56.6%}.portal-create-fields .portal-confirm-password{top:65.8%}.portal-create-submit-hot{left:42%;top:72%;width:16%;height:9%;border:0;background:transparent;cursor:pointer}
.bitmap-portal[data-mode="create"] .portal-identity,.bitmap-portal[data-mode="create"] .portal-password,.bitmap-portal[data-mode="create"] .portal-forgot-hot,.bitmap-portal[data-mode="create"] .portal-submit-hot { display:none; }
.bitmap-portal[data-mode="create"] .portal-create-fields .portal-field,.bitmap-portal[data-mode="create"] .portal-create-submit-hot { display:block; }
.bitmap-portal[data-bitmap-portal="admin"] .portal-identity{top:41.5%}.bitmap-portal[data-bitmap-portal="admin"] .portal-password{top:54.3%}.bitmap-portal[data-bitmap-portal="admin"] .portal-forgot-hot{top:61%}.bitmap-portal[data-bitmap-portal="admin"] .portal-submit-hot{top:68%}
@media (max-width:700px){.bitmap-page{width:100vw;height:100dvh}.bitmap-menu nav{min-width:200px}.portal-field{font-size:12px}.bitmap-footer a{height:70%}}

.gallery-bitmap-page { background:#000; }
.gallery-background { display:block; width:100%; height:100%; object-fit:fill; user-select:none; }
.gallery-bitmap-content { position:absolute; inset:14% 5% 15%; z-index:3; display:grid; grid-template-columns:minmax(0,1fr) minmax(18rem,30rem); gap:2.5%; min-height:0; color:#fff; }
.gallery-bitmap-content .gallery-feature { min-width:0; display:flex; flex-direction:column; justify-content:center; }
.gallery-bitmap-content .gallery-player { width:100%; aspect-ratio:16 / 9; background:#050505; border:2px solid #d3a62e; }
.gallery-bitmap-content .gallery-player iframe,.gallery-bitmap-content .gallery-player video { display:block; width:100%; height:100%; border:0; object-fit:contain; }
.gallery-bitmap-content .gallery-feature h1 { margin:.6rem 0 0; color:#fff; font:900 clamp(1.1rem,2.4vw,2rem)/1.15 Merriweather,Arial,sans-serif; }
.gallery-bitmap-content .gallery-category { margin:.6rem 0 0; color:#f0c95a; font:900 .8rem/1.2 Merriweather,Arial,sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.gallery-bitmap-content .gallery-composer { margin:.25rem 0 0; color:#d8d8d8; font:700 .85rem/1.25 Merriweather,Arial,sans-serif; }
.gallery-bitmap-content .gallery-list { display:flex; flex-direction:column; gap:.25rem; min-height:0; overflow-y:auto; overflow-x:hidden; padding:.15rem .35rem .15rem 0; }
.gallery-bitmap-content .gallery-choice { display:grid; gap:.15rem; width:100%; padding:.7rem .8rem; border:1px solid rgba(240,201,90,.55); background:rgba(0,0,0,.7); color:#fff; cursor:pointer; text-align:left; }
.gallery-bitmap-content .gallery-choice-heading { font:900 .8rem/1.2 Merriweather,Arial,sans-serif; }
.gallery-bitmap-content .gallery-choice-composer { padding-left:1.3rem; color:#d8d8d8; font:700 .72rem/1.2 Merriweather,Arial,sans-serif; }
.gallery-bitmap-content .gallery-choice.is-selected { border-color:#f0c95a; background:rgba(0,0,0,.95); box-shadow:inset 5px 0 #f0c95a; }
.gallery-bitmap-content .gallery-choice:focus-visible { outline:3px solid #f0c95a; outline-offset:2px; }
@media (max-width:700px){.gallery-bitmap-content{inset:14% 3% 16%;grid-template-columns:1fr;gap:1rem}.gallery-bitmap-content .gallery-list{min-height:30%}.gallery-bitmap-content .gallery-choice{padding:.5rem}.gallery-bitmap-content .gallery-choice-heading{font-size:.68rem}.gallery-bitmap-content .gallery-choice-composer{font-size:.62rem}}

/* The new gallery is a single authoritative bitmap with real controls over its original regions. */
.gallery-bitmap-page .gallery-background { object-fit:fill; }
.gallery-bitmap-page .gallery-bitmap-content { position:absolute; inset:0; z-index:3; display:block; min-height:0; color:#fff; }
.gallery-bitmap-page .gallery-bitmap-content { pointer-events:none; }
.gallery-bitmap-page .gallery-bitmap-content > * { pointer-events:auto; }
.gallery-bitmap-page .bitmap-footer { z-index:20; pointer-events:auto; }
.gallery-bitmap-page .gallery-player { position:absolute; left:1.9%; top:32.1%; width:62.3%; height:39.5%; background:#000; border:0; }
.gallery-bitmap-page .gallery-player video,.gallery-bitmap-page .gallery-player iframe { display:block; width:100%; height:100%; border:0; object-fit:contain; }
.gallery-bitmap-page .gallery-fullscreen { position:absolute; right:1%; bottom:1%; z-index:2; width:7%; height:15%; border:0; background:rgba(0,0,0,.35); color:#fff; cursor:pointer; font:700 1.25rem/1 Arial,sans-serif; }
.gallery-bitmap-page .gallery-fullscreen:focus-visible,.gallery-bitmap-page .gallery-fullscreen:hover { background:#d3a62e; color:#000; }
.gallery-category-panel { position:absolute; left:65.7%; top:32.1%; width:32.5%; height:39.5%; padding:2.2% 1.7%; box-sizing:border-box; background:rgba(0,0,0,.74); border:0; }
.gallery-category-panel h2 { margin:0 0 1.5%; padding-bottom:1.5%; border-bottom:2px solid #d3a62e; font:900 clamp(.7rem,1.6vw,1.15rem)/1.15 Merriweather,Arial,sans-serif; }
.gallery-category-list { display:grid; gap:.25rem; }
.gallery-category-choice { display:flex; justify-content:space-between; gap:.5rem; border:0; background:transparent; color:#9b9b9b; cursor:pointer; padding:.15rem 0; text-align:left; font:700 clamp(.55rem,1.1vw,.83rem)/1.15 Merriweather,Arial,sans-serif; }
.gallery-category-choice span { color:#d3a62e; white-space:nowrap; }
.gallery-category-choice:hover,.gallery-category-choice:focus-visible,.gallery-category-choice.is-selected { color:#fff; outline:0; }
.gallery-category-choice.is-selected { box-shadow:inset 3px 0 #d3a62e; padding-left:.35rem; }
.gallery-total-label { position:absolute; left:5%; right:5%; bottom:7%; padding-top:4%; border-top:1px solid #493716; display:flex; justify-content:space-between; font:900 clamp(.55rem,1vw,.78rem)/1.1 Merriweather,Arial,sans-serif; }
.gallery-total-label span { color:#fff; }
.gallery-now-playing { position:absolute; left:2.6%; top:61.2%; width:60.5%; height:10%; display:flex; align-items:center; gap:1.5%; padding:0 1%; box-sizing:border-box; }
.gallery-now-playing > span:first-child { color:#d3a62e; font:900 clamp(.55rem,1vw,.75rem)/1 Merriweather,Arial,sans-serif; letter-spacing:.14em; }
.gallery-now-playing strong { font:900 clamp(.7rem,1.4vw,1.1rem)/1 Merriweather,Arial,sans-serif; }
.gallery-now-playing em { color:#d3a62e; font:italic 700 clamp(.6rem,1.15vw,.9rem)/1 Merriweather,Arial,sans-serif; }
.gallery-now-playing [data-gallery-position] { margin-left:auto; font:900 clamp(.55rem,1vw,.78rem)/1 Arial,sans-serif; }
.gallery-prev,.gallery-next { position:absolute; bottom:1%; z-index:2; border:1px solid #d3a62e; background:rgba(0,0,0,.8); color:#fff; cursor:pointer; font:900 clamp(.45rem,.9vw,.7rem)/1 Arial,sans-serif; }
.gallery-prev { left:0; width:15%; height:31%; }.gallery-next { right:0; width:15%; height:31%; }
.gallery-thumbnail-strip { position:absolute; left:7.5%; right:7.5%; bottom:1.7%; height:10.8%; display:flex; gap:.8%; overflow-x:auto; overflow-y:hidden; padding:.2%; box-sizing:border-box; }
.gallery-choice { position:relative; flex:0 0 13.5%; min-width:100px; display:grid; grid-template-columns:38% 62%; grid-template-rows:1fr auto; gap:0 .3rem; padding:.2rem; border:1px solid rgba(211,166,46,.4); background:rgba(0,0,0,.82); color:#fff; cursor:pointer; text-align:left; }
.gallery-choice img { grid-row:1 / 3; width:100%; height:100%; object-fit:cover; }.gallery-choice span { overflow:hidden; font:900 clamp(.45rem,.8vw,.65rem)/1.1 Merriweather,Arial,sans-serif; }.gallery-choice small { overflow:hidden; color:#d3a62e; font:600 clamp(.4rem,.7vw,.56rem)/1.1 Merriweather,Arial,sans-serif; }
.gallery-choice:hover,.gallery-choice:focus-visible,.gallery-choice.is-selected { border-color:#f0c95a; outline:0; box-shadow:inset 0 0 0 2px #f0c95a; }
.gallery-category-panel h2,.gallery-category-choice,.gallery-category-choice span,.gallery-total-label,.gallery-total-label span,.gallery-now-playing,.gallery-now-playing strong,.gallery-now-playing em,.gallery-now-playing > span,.gallery-prev,.gallery-next,.gallery-choice span,.gallery-choice small { color:transparent; text-shadow:none; }
.gallery-bitmap-page .gallery-category-panel { background:transparent; }
.gallery-bitmap-page .gallery-category-panel h2,.gallery-bitmap-page .gallery-category-choice,.gallery-bitmap-page .gallery-category-choice span,.gallery-bitmap-page .gallery-total-label,.gallery-bitmap-page .gallery-total-label span,.gallery-bitmap-page .gallery-now-playing,.gallery-bitmap-page .gallery-now-playing strong,.gallery-bitmap-page .gallery-now-playing em,.gallery-bitmap-page .gallery-now-playing > span,.gallery-bitmap-page .gallery-prev,.gallery-bitmap-page .gallery-next,.gallery-bitmap-page .gallery-choice span,.gallery-bitmap-page .gallery-choice small { color:transparent !important; background:transparent !important; border-color:transparent !important; box-shadow:none !important; text-shadow:none !important; }
.gallery-category-choice.is-selected { box-shadow:none; padding-left:0; }
.gallery-category-choice:focus-visible,.gallery-prev:focus-visible,.gallery-next:focus-visible,.gallery-choice:focus-visible { outline:2px solid #f0c95a; outline-offset:1px; }
.gallery-fullscreen { color:transparent; background:transparent; }
.gallery-thumbnail-strip { left:6%; right:6%; }
.gallery-thumbnail-strip { scrollbar-width:none; }
.gallery-thumbnail-strip::-webkit-scrollbar { display:none; }
.gallery-bitmap-page .gallery-choice { border-color:transparent !important; background:transparent !important; box-shadow:none !important; }
.gallery-bitmap-page .gallery-choice img { visibility:hidden; }
.gallery-bitmap-page .gallery-choice:hover,.gallery-bitmap-page .gallery-choice.is-selected { border-color:transparent !important; box-shadow:none !important; }
@media (max-width:700px) { .gallery-category-panel { padding:1.5%; }.gallery-now-playing { gap:.5%; }.gallery-now-playing em { display:none; }.gallery-choice { min-width:130px; } }

/* Bitmap gallery geometry: the rail is the two-card window shown in Gallery.jpg. */
.gallery-bitmap-page .gallery-rail-window { position:absolute; left:7.6%; width:84.8%; bottom:13.8%; height:12.4%; overflow:hidden; z-index:4; }
.gallery-bitmap-page .gallery-rail-track { display:flex; gap:1%; height:100%; transform:translateX(0); transition:transform .18s ease; }
.gallery-bitmap-page .gallery-rail-card { position:relative; flex:0 0 calc((100% - 3%) / 4); height:100%; min-width:0; display:grid; grid-template-columns:31% 69%; grid-template-rows:minmax(0,1fr) auto; align-items:center; gap:0 .35rem; padding:.2rem; box-sizing:border-box; border:0; background:transparent; color:transparent; cursor:pointer; text-align:left; }
.gallery-bitmap-page .gallery-rail-card img { grid-row:1 / 3; width:100%; height:100%; object-fit:cover; visibility:hidden; }
.gallery-bitmap-page .gallery-rail-card span,.gallery-bitmap-page .gallery-rail-card small { overflow:hidden; min-width:0; white-space:nowrap; text-overflow:ellipsis; color:transparent; font:700 clamp(.5rem,.95vw,.8rem)/1.05 Arial,Helvetica,sans-serif; }
.gallery-bitmap-page .gallery-rail-card small { color:transparent; font-size:clamp(.42rem,.75vw,.62rem); font-weight:700; }
.gallery-bitmap-page .gallery-rail-card.is-dynamic { border:0; background:transparent; color:#fff; }
.gallery-bitmap-page .gallery-rail-card.is-dynamic img { visibility:visible; }
.gallery-bitmap-page .gallery-rail-card.is-dynamic span { color:#fff; }.gallery-bitmap-page .gallery-rail-card.is-dynamic small { color:#d3a62e; }
.gallery-bitmap-page .gallery-rail-card:focus-visible { outline:2px solid #f0c95a; outline-offset:1px; }
.gallery-bitmap-page .gallery-rail-arrow { position:absolute; top:76%; z-index:5; width:4%; height:9%; border:0; background:transparent; color:transparent; cursor:pointer; }
.gallery-bitmap-page .gallery-rail-prev { left:2.7%; }.gallery-bitmap-page .gallery-rail-next { right:2.7%; }
.gallery-bitmap-page .gallery-rail-arrow:focus-visible { outline:2px solid #f0c95a; outline-offset:1px; }
.gallery-bitmap-page .gallery-category-choice.is-selected { box-shadow:inset 0 0 0 1px #d3a62e !important; background:rgba(0,0,0,.24) !important; }

/* Blank gallery bitmap: fill only the regions intentionally left empty in the supplied artwork. */
.gallery-bitmap-page .gallery-blank-content .gallery-player { left:2.1%; top:31.9%; width:62.1%; height:29.8%; }
.gallery-bitmap-page .gallery-blank-content .gallery-category-panel { left:65.7%; top:32.1%; width:32.5%; height:39.5%; padding:0; background:transparent; }
.gallery-bitmap-page .gallery-blank-content .gallery-category-list { position:absolute; left:5%; right:8%; top:23%; display:grid; gap:0; }
.gallery-bitmap-page .gallery-blank-content .gallery-category-choice { min-height:16px; padding:1px 0; color:#d8d8d8 !important; background:transparent !important; border:0 !important; box-shadow:none !important; font:400 clamp(.55rem,1.05vw,.85rem)/1.05 Merriweather,Arial,sans-serif; }
.gallery-bitmap-page .gallery-blank-content .gallery-category-label { color:#d8d8d8 !important; }.gallery-bitmap-page .gallery-blank-content .gallery-category-count { color:#d8d8d8 !important; }
.gallery-bitmap-page .gallery-blank-content .gallery-category-choice.is-selected { color:#fff !important; box-shadow:inset 0 1px #d3a62e,inset 0 -1px #d3a62e !important; background:transparent !important; }
.gallery-bitmap-page .gallery-blank-content .gallery-category-choice.is-selected .gallery-category-label,.gallery-bitmap-page .gallery-blank-content .gallery-category-choice.is-selected .gallery-category-count { color:#fff !important; }
.gallery-bitmap-page .gallery-blank-content .gallery-total-label { left:5%; right:8%; bottom:8%; padding-top:3%; color:#fff !important; font:900 clamp(.55rem,1vw,.8rem)/1.1 Merriweather,Arial,sans-serif; }
.gallery-bitmap-page .gallery-blank-content .gallery-total-label span { color:#fff !important; }
.gallery-bitmap-page .gallery-blank-content .gallery-now-playing { left:2.6%; top:61.8%; width:60.5%; height:9%; padding:0; }
.gallery-bitmap-page .gallery-blank-content .gallery-now-playing strong { position:absolute; left:36%; top:28%; color:#fff !important; font:900 clamp(.65rem,1.25vw,1rem)/1 Merriweather,Arial,sans-serif; }
.gallery-bitmap-page .gallery-blank-content .gallery-now-playing em { position:absolute; left:36%; top:58%; color:#d3a62e !important; font:italic 700 clamp(.55rem,1vw,.8rem)/1 Merriweather,Arial,sans-serif; }
.gallery-bitmap-page .gallery-blank-content .gallery-now-playing [data-gallery-position] { position:absolute; left:19%; top:58%; color:#fff !important; font:900 clamp(.55rem,1vw,.76rem)/1 Arial,sans-serif; }
.gallery-bitmap-page .gallery-blank-content .gallery-rail-card { border:0 !important; background:transparent !important; color:#fff !important; }
.gallery-bitmap-page .gallery-blank-content .gallery-rail-card img { visibility:visible; }.gallery-bitmap-page .gallery-blank-content .gallery-rail-card span { color:#fff !important; }.gallery-bitmap-page .gallery-blank-content .gallery-rail-card small { color:#d3a62e !important; }

.about-card { z-index:3; }
.director-requests{left:2.2%;top:27.3%;width:30.8%;height:46.8%}.director-booking{left:34.1%;top:27.3%;width:28.4%;height:46.8%}.director-upload{left:63.5%;top:27.3%;width:34.3%;height:46.8%}.director-invoices{left:2.2%;top:76.3%;width:60.3%;height:14%}
.tuning-booking{left:2.2%;top:23.5%;width:36.3%;height:47.9%}.tuning-history{left:39.1%;top:23.5%;width:23.8%;height:30.2%}.tuning-invoices{left:63.3%;top:23.5%;width:34.4%;height:67.4%}.tuning-information{left:2.2%;top:72.8%;width:36.3%;height:18.2%}

.responsive-content,.responsive-brand,.responsive-label,.responsive-copyright { display:none; }
.bitmap-portal .portal-create-fields[hidden] { display:none; }

/* The original bitmap and hotspots remain authoritative on desktop. At the
   existing portal tablet breakpoint, the same copy and actions use normal flow. */
@media (max-width:900px) {
  html { height:auto; overflow:auto; background:#000; }
  body.is-bitmap-route { display:block; height:auto; max-height:none; overflow:visible; }
  body.is-bitmap-route #main { display:block; }
  .bitmap-page { width:100%; height:auto; min-height:100dvh; overflow:visible; background:#090909 url('assets/portal-background-template.png') center/cover; }
  .bitmap-page > :is(.bitmap-surface,.gallery-background) { display:none; }
  .bitmap-page .bitmap-controls { position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:1rem; padding:1rem; min-height:100dvh; }
  .bitmap-page .bitmap-controls > * { position:static; min-width:0; }
  .bitmap-page .responsive-brand { order:0; display:flex; flex:0 0 100%; justify-content:center; }
  .responsive-brand img { display:block; width:180px; height:auto; }
  .bitmap-page .bitmap-menu { order:1; flex:1; color:#fff; }
  .bitmap-page .bitmap-menu > summary { width:auto; min-height:44px; display:flex; align-items:center; gap:.5rem; }
  .bitmap-page .bitmap-menu nav { top:auto; width:min(390px,calc(100vw - 2rem)); }
  .bitmap-page .bitmap-menu nav :is(a,summary) { white-space:normal; width:auto; height:auto; }
  .bitmap-page :is(.bitmap-email,.bitmap-phone,.bitmap-facebook) { order:1; width:44px; height:44px; flex:0 0 44px; background-position:center; background-repeat:no-repeat; background-size:contain; }
  .bitmap-page .bitmap-email { background-image:url('assets/bitmaps/header-envelope.png'); }
  .bitmap-page .bitmap-phone { background-image:url('assets/bitmaps/header-phone.png'); }
  .bitmap-page .bitmap-facebook { background-image:url('assets/bitmaps/header-facebook.png'); }
  .bitmap-page .bitmap-phone-flydown { order:2; width:100%; }
  .bitmap-page .responsive-content { order:3; display:block; flex:0 0 100%; color:#fff; font:1rem/1.6 Merriweather,Georgia,serif; overflow-wrap:anywhere; }
  .responsive-content h1 { margin:1rem 0; font-size:clamp(1.4rem,5vw,2.2rem); line-height:1.25; }
  .responsive-content h2 { color:#f0c95a; font-size:1.2rem; line-height:1.4; }
  .responsive-content section { margin:1rem 0; padding:1rem; border:1px solid #d3a62e; }
  .responsive-content p { margin:1rem 0; }
  .responsive-photo { display:block; width:100%; height:auto; max-height:320px; object-fit:contain; }
  .responsive-photo[src*="mobile-home-hero"] { max-height:none; }
  .responsive-home-hero { display:block; width:100%; height:auto; max-height:none; object-fit:contain; }
  .responsive-price-link { display:block; border:0; color:inherit; text-decoration:none; }
  .responsive-price-link:focus-visible { outline:3px solid #fff; outline-offset:3px; }
  .responsive-price { background:#07101c; text-align:center; }
  .responsive-price strong { display:block; font-size:2rem; }
  .responsive-example { position:relative; overflow:hidden; }
  .responsive-example img { position:absolute; max-width:none; height:auto; }
  /* Original demonstration panels, measured in the supplied 1366x590 and
     1910x823 images. No example invoice or upload values are reconstructed. */
  .responsive-director-example { aspect-ratio:433/282; }
  .responsive-director-example img { width:calc(1366 / 433 * 100%); left:calc(-886 / 433 * 100%); top:calc(-244 / 282 * 100%); }
  .responsive-tuning-example { aspect-ratio:620/438; }
  .responsive-tuning-example img { width:calc(1910 / 620 * 100%); left:calc(-1230 / 620 * 100%); top:calc(-298 / 438 * 100%); }
  .bitmap-page .bitmap-footer { order:10; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; width:100%; height:auto; border-top:1px solid #d3a62e; padding-top:1rem; }
  .bitmap-page .bitmap-footer a { position:static; display:grid; place-items:center; width:auto; height:auto; min-height:44px; color:#fff; font:700 1rem/1.4 Arial,sans-serif; text-indent:0; text-align:center; }
  .bitmap-page .responsive-copyright { order:11; display:block; width:100%; color:#fff; font:.75rem/1.4 Arial,sans-serif; text-align:center; }
  .bitmap-page :is(.bitmap-action,.bitmap-card-link) { order:4; display:grid; place-items:center; width:100%; height:auto; min-height:44px; padding:.75rem; border:1px solid #d3a62e; background:#07101c; color:#fff; text-decoration:none; }
  .bitmap-page :is(.bitmap-action,.bitmap-card-link)::after { content:attr(aria-label); }
  .bitmap-page .pricing-left,.bitmap-page .pricing-right { display:none !important; }
  .bitmap-portal .portal-hot { order:4; position:static; flex:1; width:auto; height:auto; min-height:44px; border:1px solid #d3a62e; color:#fff; background:#07101c; font:700 1rem Arial,sans-serif; }
  .bitmap-portal .portal-hot::after { content:attr(aria-label); }
  .bitmap-portal .portal-hot[aria-pressed="true"] { border-color:#fff; }
  .bitmap-portal .bitmap-portal-form { order:5; position:static; display:grid; gap:.75rem; width:100%; padding:1rem; border:1px solid #d3a62e; background:#07101c; }
  .bitmap-portal .responsive-label { display:block; color:#fff; font:700 1rem Arial,sans-serif; }
  .bitmap-portal[data-mode="create"] .portal-login-label { display:none; }
  .bitmap-portal .portal-field { position:static; width:100%; height:auto; min-height:44px; padding:.75rem; background:#fff; color:#111; caret-color:#111; font:1rem Arial,sans-serif; }
  .bitmap-portal .portal-create-fields:not([hidden]) { display:grid; gap:.75rem; }
  .bitmap-portal :is(.portal-submit-hot,.portal-create-submit-hot) { position:static; width:100%; height:auto; min-height:44px; padding:.75rem; background:#8e1212; color:#fff; border:1px solid #d3a62e; font:700 1rem Arial,sans-serif; }
  .bitmap-portal :is(.portal-submit-hot,.portal-create-submit-hot)::after { content:attr(aria-label); }
  .bitmap-portal [hidden] { display:none; }
  .gallery-bitmap-page .gallery-bitmap-content { order:4; position:static; display:grid; gap:1rem; width:100%; }
  .gallery-bitmap-page .gallery-blank-content :is(.gallery-player,.gallery-category-panel,.gallery-category-list,.gallery-total-label,.gallery-now-playing,.gallery-rail-window) { position:static; inset:auto; width:100%; height:auto; padding:0; }
  .gallery-bitmap-page .gallery-blank-content .gallery-player { aspect-ratio:16/9; }
  .gallery-bitmap-page .gallery-blank-content .gallery-category-list { display:grid; gap:.75rem; }
  .gallery-bitmap-page .gallery-blank-content .gallery-category-choice { min-height:44px; padding:.75rem; font:1rem/1.4 Arial,sans-serif; }
  .gallery-bitmap-page .gallery-blank-content .gallery-total-label { display:block; margin-top:1rem; font:700 1rem/1.4 Arial,sans-serif; }
  .gallery-bitmap-page .gallery-blank-content .gallery-now-playing { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
  .gallery-bitmap-page .gallery-blank-content .gallery-now-playing :is(strong,em,[data-gallery-position]) { position:static; display:block; width:auto; grid-column:1 / -1; font-size:1rem; line-height:1.4; }
  .gallery-bitmap-page .gallery-blank-content :is(.gallery-prev,.gallery-next) { position:static; width:auto; height:auto; min-height:44px; color:#fff !important; font:700 1rem Arial,sans-serif; border:1px solid #d3a62e; }
  .gallery-bitmap-page .gallery-rail-track { display:grid; gap:.75rem; height:auto; transform:none !important; }
  .gallery-bitmap-page .gallery-blank-content .gallery-rail-card { height:auto; min-height:64px; padding:.75rem; gap:.75rem; }
  .gallery-bitmap-page .gallery-rail-card :is(span,small) { font-size:1rem; line-height:1.4; white-space:normal; }
  .gallery-bitmap-page .gallery-rail-arrow { display:none; }
}
.vmt-install-bar { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 40; display: flex; gap: .75rem; align-items: center; padding: .75rem; background: #000; color: #fff; border: 1px solid #d4af37; }
.vmt-install-bar[hidden] { display: none; }
.vmt-install-bar button { background: #0D2305; color: #fff; border: 0; font: 700 14px/1.2 Arial, sans-serif; padding: .6rem .8rem; }
.vmt-install-bar p { margin: 0; font: 14px/1.4 Arial, sans-serif; }
