:root{color-scheme:dark;--bg:#0c1114;--ink:#e3e1d8;--mist:#a9b0af;--dim:#829093;--line:#dde0d820;--gold:#c0b58e;--serif:"Yu Mincho","Hiragino Mincho ProN",serif;--wrap-max:1110px}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;-webkit-font-smoothing:antialiased}
a:focus-visible,button:focus-visible{outline:1px solid var(--gold);outline-offset:6px}
.skip{position:absolute;top:-70px;left:15px;z-index:20;background:var(--ink);color:var(--bg);padding:15px}
.skip:focus{top:15px}
h1{font:400 43px/1.8 var(--serif);letter-spacing:.12em;margin:24px 0 19px}
.return{padding:18px 0;font:11px/1.8 Arial,sans-serif;letter-spacing:.12em;color:var(--mist);display:inline-block}
.return span{margin-right:18px;color:var(--gold)}
.footer{padding:40px 0 25px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:25px}
.footer-name{font:23px Georgia,serif}
.footer-links{display:flex;gap:23px;font:9px Arial;letter-spacing:.12em;color:var(--mist)}
.copyright{font:8px Arial;color:var(--dim);padding:0 0 25px;letter-spacing:.08em}
@media(max-width:700px){
h1{font-size:33px;margin:21px 0 12px}
.footer{padding:30px 0 25px}
.footer-name{font-size:21px}
.footer-links{gap:15px;font-size:8px}
}
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
}
.entrance{position:relative;isolation:isolate;margin-top:-100px;padding:205px 0 62px;overflow:hidden}
.entrance>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 38%;opacity:.18;z-index:-2;filter:saturate(.5)}
.entrance:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg),transparent 90%);z-index:-1}
.entrance h1{font:400 32px/1.5 Georgia,serif;letter-spacing:.04em;margin:0;display:flex;align-items:center;gap:14px}
.entrance h1 svg{width:22px;height:22px;color:var(--mist)}
.collection{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding:20px 0 100px}
.piece{scroll-margin-top:30px}
.piece figure{position:relative;margin:0;aspect-ratio:16/9;overflow:hidden;background:#111a1f}
.piece img{display:block;width:100%;height:100%;object-fit:cover;filter:brightness(.7) saturate(.85);transition:filter .45s}
.piece:hover img,.piece:focus-visible img{filter:brightness(1.12) saturate(1)}
.piece h2{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;margin:0;padding:0 16px;text-align:center;font:700 16px/1.6 Lato,"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;letter-spacing:.08em;color:#fff;text-shadow:0 1px 3px #000a,0 0 12px #0008}
.island-return{padding-bottom:44px}
.footer{border-top:1px solid var(--line)}
@media(max-width:1000px){
.collection{gap:20px 16px}
.piece h2{font-size:15px}
}
@media(max-width:700px){
.entrance{margin-top:-82px;padding:151px 0 45px}
.entrance h1{font-size:28px}
.collection{grid-template-columns:1fr;gap:20px;padding:10px 0 58px}
.piece figure{aspect-ratio:16/9}
.piece h2{font-size:18px}
.island-return{padding-bottom:32px}
}
@media(prefers-reduced-motion:reduce){
.piece img{transition:none}
}
@media(min-width:701px){
.entrance{padding:150px 0 46px}
}