@font-face{font-family:Oswald;src:url('/assets/oswald.ttf') format('truetype');font-style:normal;font-weight:200 700;font-display:swap}
@font-face{font-family:Roboto;src:url('/assets/roboto.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
:root{color-scheme:dark;font-family:Roboto,Arial,sans-serif;background:#081b2b;color:#e8f1f6;font-synthesis:none}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}
button{font:500 14px Oswald,Arial,sans-serif;min-height:44px;min-width:44px;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button:focus-visible{outline:2px solid #fff2bb;outline-offset:2px}
button:active{filter:brightness(1.18)}
button:disabled{cursor:default;opacity:.5}
[hidden]{display:none!important}
.gallery{width:min(100%,1200px);height:100dvh;margin:0 auto;display:flex;flex-direction:column;min-width:0;min-height:0;padding:0 max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));background:radial-gradient(ellipse at 80% 0,#25465566,transparent 62%),linear-gradient(150deg,#102b3d,#061421 80%)}
.gallery-header{display:flex;align-items:center;justify-content:space-between;gap:14px;flex:none;padding:14px 0 12px;border-bottom:1px solid #526a7866}
.brand{margin:0 0 3px;color:#edcc7e;font:500 9px/1.2 Oswald,sans-serif;letter-spacing:2px}
h1{margin:0;font:500 28px/1.1 Oswald,sans-serif;letter-spacing:.6px;text-transform:uppercase}
.outline-button{border:1px solid #82929a;border-radius:4px;background:#163348;color:#e6d49e;padding:8px 12px;font-size:13px;line-height:1.15}
.gallery-controls{flex:none;padding:13px 0 10px}
.section-label{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
.section-label h2{margin:0;font:500 10px/1.2 Oswald,sans-serif;letter-spacing:1.1px;color:#d9c18d}
.section-label span{font:10px/1.2 Roboto,sans-serif;color:#a3bac8}
.set-controls{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.set-controls button{display:flex;flex-direction:column;justify-content:center;gap:2px;align-items:center;min-width:0;min-height:54px;padding:5px 3px;border:1px solid #496778;border-radius:4px;color:#bcd1df;background:linear-gradient(145deg,#193b50,#102b3d)}
.set-controls small{font:400 8px/1.1 Oswald,sans-serif;letter-spacing:.7px}
.set-controls span{font:500 23px/1.1 Oswald,sans-serif}
.set-controls button[aria-pressed=true]{color:#ffe6a4;border-color:#e0bc68;box-shadow:inset 0 -2px #e0bc68;background:linear-gradient(135deg,#4d5149,#223b48)}
.part-controls{display:grid;grid-template-columns:1fr 1.25fr 1.15fr;gap:5px;margin-top:9px}
.part-controls button{min-width:0;padding:6px 4px;border:1px solid #426176;border-radius:4px;background:#0d273a;color:#a9c2d3;font-size:15px}
.part-controls button[aria-pressed=true]{color:#fce0a0;border-color:#c9ae73;background:#2b4554}
.viewer{min-width:0;min-height:0;display:flex;flex-direction:column;flex:1;border:1px solid #486574;border-radius:6px;background:#04132088;box-shadow:0 8px 25px #0003;overflow:hidden}
.viewer-toolbar,.expanded-toolbar{flex:none;min-height:54px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 9px;border-bottom:1px solid #3c586755}
.viewer-toolbar h2,.expanded-toolbar p{font:400 12px/1.2 Oswald,sans-serif;letter-spacing:.3px;color:#bcd1de;margin:0;min-width:0}
.viewer-toolbar .outline-button{flex:none;padding:7px 9px;font-size:12px}
.expanded-toolbar{display:none}
.viewer-stage{position:relative;display:grid;place-items:center;flex:1;min-height:0;min-width:0;padding:8px;overflow:hidden}
.artwork-frame{position:relative;flex:none;margin:0;overflow:hidden;background:#071724;box-shadow:0 5px 24px #0009;isolation:isolate}
.artwork-frame img{display:block;width:300%;height:auto;max-width:none;transform:translateX(var(--shift,0%));transform-origin:top left;pointer-events:none;user-select:none}
.artwork-frame.is-whole img{width:100%;transform:none}
.viewer-message{position:absolute;inset:0;display:grid;place-content:center;max-width:100%;padding:20px;text-align:center;color:#b1c6d3;font:13px/1.5 Roboto,sans-serif;margin:0}
.gallery-footer{flex:none;padding:10px 0 max(10px,env(safe-area-inset-bottom));text-align:center;color:#8fa8b8;font:10px/1.35 Roboto,sans-serif}
.gallery-footer a{display:flex;align-items:center;justify-content:center;min-height:44px;margin-top:6px;padding:7px 5px;border-radius:4px;background:#ffd15c;color:#081625;font:500 14px/1.2 Oswald,sans-serif;text-decoration:none;touch-action:manipulation}.gallery-footer a:focus-visible{outline:2px solid white;outline-offset:2px}
.gallery.is-expanded{padding:0;width:100%;max-width:none}
.is-expanded .gallery-header,.is-expanded .gallery-controls,.is-expanded .gallery-footer,.is-expanded .viewer-toolbar{display:none}
.is-expanded .viewer{border:0;border-radius:0;background:#030a10}
.is-expanded .expanded-toolbar{display:flex;padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right));padding-top:max(5px,env(safe-area-inset-top));min-height:54px}
.is-expanded .viewer-stage{padding:4px 4px max(4px,env(safe-area-inset-bottom))}
@media(max-height:650px){
 .gallery-header{padding:9px 0 8px}
 h1{font-size:24px}
 .gallery-controls{padding:9px 0 8px}
 .section-label{margin-bottom:6px}
 .set-controls button{min-height:46px;gap:1px}
 .set-controls span{font-size:20px}
 .part-controls{margin-top:7px}
 .viewer-toolbar{min-height:50px;padding:3px 7px}
 .gallery-footer{font-size:9px;padding-top:7px;padding-bottom:max(7px,env(safe-area-inset-bottom))}
}
@media(min-width:700px){
 .gallery{padding-left:24px;padding-right:24px}
 .gallery-controls{display:grid;grid-template-columns:minmax(320px,1.1fr) minmax(300px,1fr);column-gap:20px;align-items:end}
 .section-label{grid-column:1/-1}
 .part-controls{margin:0}
 .part-controls button{min-height:54px}
 .set-controls button{min-height:54px}
}