:root{color-scheme:dark;--navy:#081321;--ink:#f8f7f4;--lime:#e2fdaf;--blue:#aec5f5;--line:#ffffff26;font-family:Arial,Helvetica,sans-serif;background:var(--navy);color:var(--ink)}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}a:hover,button:hover{color:var(--lime)}button{background:none;border:0}button:disabled{opacity:.25;cursor:default}button:focus-visible,a:focus-visible,main:focus-visible{outline:2px solid var(--lime);outline-offset:5px}button,a{touch-action:manipulation}.skip{position:fixed;top:-100px;left:20px;z-index:20;background:var(--navy);padding:14px}.skip:focus{top:12px}
main{height:100vh;height:100dvh;overflow-y:auto;scroll-snap-type:y mandatory;scroll-behavior:smooth;overscroll-behavior-y:contain;scrollbar-width:none}main::-webkit-scrollbar{display:none}.slide{height:100vh;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center;padding:62px 30px 60px;position:relative}.slide-inner{width:min(100%,calc((100dvh - 122px)*16/9));position:relative}.slide-image{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}.site-hotspot{position:absolute;right:4.7%;top:6.3%;width:11%;height:5%;border-radius:2px}.site-hotspot:hover{box-shadow:0 1px var(--lime)}.mobile-caption{display:none}.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}
.toolbar,.controls{position:fixed;left:30px;right:30px;display:flex;align-items:center;justify-content:space-between;z-index:5;font-size:12px;letter-spacing:.035em;pointer-events:none}.toolbar>* , .controls>*{pointer-events:auto}.toolbar{top:0;height:56px;background:var(--navy)}.toolbar button{padding:12px 0}.toolbar-right{display:flex;gap:28px}.toolbar-right a{padding:10px 0}.toolbar span{color:var(--lime)}.controls{bottom:0;height:54px;background:var(--navy);border-top:1px solid var(--line)}#current-title{color:var(--blue)}.paging{display:flex;align-items:center;gap:12px}.paging button{font-size:21px;width:36px;height:40px}#counter{font-variant-numeric:tabular-nums;min-width:58px;text-align:center;color:var(--ink)}
#project-index{position:fixed;z-index:8;top:55px;left:30px;width:min(380px,calc(100vw - 60px));background:#122033;border:1px solid var(--line);box-shadow:0 16px 50px #0006;padding:12px;max-height:calc(100dvh - 120px);overflow:auto}#project-index a{display:flex;gap:20px;align-items:center;padding:15px 12px;border-bottom:1px solid var(--line);font-size:14px}#project-index a:last-child{border-bottom:0}#project-index a span{font-size:11px;color:var(--blue);font-variant-numeric:tabular-nums}#project-index a[aria-current=true]{background:#e2fdaf12;color:var(--lime)}
dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border:0;padding:0;background:var(--navy);color:var(--ink)}dialog::backdrop{background:#000c}.detail-bar{height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid var(--line);font-size:14px}.detail-bar button{padding:14px}.detail-scroll{height:calc(100dvh - 60px);overflow:auto;display:grid;align-items:start}#detail-image{display:block;width:max(100%,1400px);max-width:none;height:auto}.no-js{position:absolute;top:30vh;left:10%;font-size:24px}.no-js a{text-decoration:underline}
@media(max-width:700px) and (orientation:portrait){.toolbar,.controls{left:18px;right:18px}.toolbar-right{gap:16px;font-size:10px}.slide{padding:66px 0 76px;flex-direction:column}.slide-inner{width:100%}.mobile-caption{display:block;padding:28px 24px 0;width:100%;max-width:540px}.mobile-caption h2{font-size:25px;line-height:1.15;font-weight:400;margin:0 0 12px;color:var(--lime)}.mobile-caption p{font-size:15px;line-height:1.6;color:#d4deed;margin:0}.mobile-caption button{font-size:12px;border-bottom:1px solid var(--line);padding:14px 0 7px;margin-top:8px}.controls{font-size:10px}#current-title{max-width:43%;line-height:1.4}.paging{gap:2px}.paging button{width:30px}#project-index{left:18px;width:calc(100vw - 36px)}}
@media(max-height:500px) and (orientation:landscape){.toolbar{height:38px}.controls{height:38px}.slide{padding:40px 12px}.slide-inner{width:min(100%,calc((100dvh - 80px)*16/9))}}
@media(prefers-reduced-motion:reduce){main{scroll-behavior:auto}}
@media print{body,main{height:auto;overflow:visible;background:white}.toolbar,.controls,#project-index,.mobile-caption,dialog,.skip{display:none!important}.slide{height:auto;padding:0;break-after:page}.slide-inner{width:100%}.site-hotspot{display:none}@page{size:landscape;margin:0}}
/* Full-bleed presentation: navigation floats above the slide. */
@media(min-width:701px),(orientation:landscape){
 .slide{padding:0;background:#081321}
 .slide-inner{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
 .slide-image{width:100%;height:100%;object-fit:contain}
 .site-hotspot{display:none}
 .toolbar{top:10px;left:18px;right:18px;height:36px;background:transparent;opacity:0;transition:opacity .2s}
 .toolbar:focus-within,body:hover .toolbar{opacity:1}
 .toolbar button,.toolbar-right a{padding:9px 12px;border-radius:30px;background:#081321b8;backdrop-filter:blur(12px)}
 .toolbar-right{gap:8px}
 .controls{left:auto;right:18px;bottom:12px;height:38px;border:0;border-radius:30px;background:#081321b8;padding:0 8px;backdrop-filter:blur(12px)}
 #current-title{display:none}.paging{gap:5px}.paging button{height:36px}
 #project-index{top:54px;left:18px}
}
@media(prefers-reduced-motion:reduce){.toolbar{transition:none}}
