*{box-sizing:border-box}body{margin:0;background:#f5f2e8;color:#113e37;font-family:system-ui,sans-serif}header{padding:18px 5vw;display:flex;justify-content:space-between;align-items:center;gap:18px;background:#093d36;color:white}a{color:inherit}header a{text-decoration:none}.brand{font-weight:800;letter-spacing:1px}.brand small{display:block;font-size:10px;color:#e7c484;margin-top:5px}nav{display:flex;gap:20px;font-size:14px}nav [aria-current]{color:#f0ce90;border-bottom:2px solid;padding-bottom:6px}main{max-width:1500px;margin:auto}.intro{padding:38px 4vw 18px}.intro span{color:#8c6b32;font-size:12px;letter-spacing:2px}h1{font-size:clamp(28px,4vw,48px);margin:12px 0}.intro p{color:#526c61;line-height:1.6}.viewer{padding:20px 3vw;background:#0b3b34;color:white;border-radius:20px;margin:0 2vw}.toolbar{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.toolbar>div{display:flex;align-items:center;gap:8px}button{font:inherit;cursor:pointer;min-height:42px;border:0;border-radius:22px;padding:8px 16px;background:#e9d5a8;color:#123d35}button:focus-visible,a:focus-visible{outline:3px solid #e29b3d;outline-offset:3px}#count{min-width:65px;text-align:center;font-size:14px}#caption{font-size:clamp(19px,2.3vw,27px);margin:18px 0 8px}#hint{font-size:13px;color:#c7d9d0;line-height:1.5;margin:0 0 14px}#viewport{height:75svh;min-height:300px;overflow:auto;background:#062b25;border-radius:10px;overscroll-behavior:contain;touch-action:pan-x pan-y;position:relative}#photo{display:block;max-width:none;height:auto;margin:auto;user-select:none}#original{display:inline-block;margin:15px 0 0;font-size:13px;color:#e9d5a8}.grid-heading{padding:20px 4vw 0}#grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;padding:0 4vw 25px}.card{background:white;padding:8px;text-align:left;border-radius:12px;overflow:hidden}.card img{width:100%;height:145px;object-fit:cover;border-radius:7px}.card span{display:block;padding:10px 5px;font-size:14px;line-height:1.4}.card[aria-pressed=true]{outline:3px solid #a8782d}footer{padding:25px 4vw 40px;color:#66776f;max-width:950px;font-size:13px;line-height:1.6}@media(max-width:600px){header{padding:15px;align-items:flex-start}.brand{font-size:12px}nav{gap:12px;font-size:12px}.intro{padding:26px 5vw 12px}.viewer{margin:0;border-radius:0;padding:16px}.toolbar{gap:10px}button{padding:8px 13px}#viewport{height:70svh}#grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card img{height:110px}.card span{font-size:12px}}

[hidden]{display:none!important}.album-stage{position:relative}.window-arrow{display:none}.viewer.album-expanded{position:fixed;inset:0;z-index:9999;width:100%;height:100vh;height:100dvh;max-width:none;margin:0;border-radius:0;padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#071d19;display:flex;flex-direction:column;gap:8px}.album-expanded .toolbar{flex:none;gap:8px}.album-expanded .toolbar button{min-height:44px;padding:8px 12px;background:#28473d;color:#fff}.album-expanded .toolbar>div{flex-wrap:wrap;gap:6px}.album-expanded .album-stage{flex:1;min-height:0;order:2}.album-expanded #viewport{height:100%;min-height:0;background:#071d19;border-radius:0}.album-expanded #caption{font-size:16px;line-height:1.3;margin:4px 0 0;order:3}.album-expanded #hint{font-size:12px;margin:0;order:4}.album-expanded #original{display:none}.album-expanded .window-arrow{display:grid;place-items:center;position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:48px;height:48px;min-height:48px;padding:0;border-radius:50%;font-size:32px;background:#163b30d9;color:#fff;border:1px solid #ffffff40;touch-action:manipulation}.window-arrow.previous{left:6px}.window-arrow.next{right:6px}.album-expanded #album-expand,.album-expanded #large{display:none}.album-expanded #photo{cursor:default}#album-expand{background:#ffca58;font-weight:650}@media(max-width:600px){.album-expanded #caption{font-size:14px}.album-expanded .toolbar{flex-wrap:nowrap;align-items:flex-start}.album-expanded .toolbar>div:last-child{justify-content:flex-end}.album-expanded .toolbar button{padding:7px 10px}.album-expanded #count{min-width:48px;font-size:12px}.album-expanded .window-arrow{width:44px;height:44px;min-height:44px}}