:root{color-scheme:light;font-family:"Noto Serif SC","Songti SC",serif;color:#38352f;background:#e8e5df}*{box-sizing:border-box}body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 50% 44%,#f8f7f3 0,#e9e7e1 54%,#dedbd3 100%)}button,a{font:inherit}button{cursor:pointer}#gallery-main{min-height:100svh;display:flex;flex-direction:column;transition:opacity .3s,transform .4s}.site-header{height:90px;padding:24px clamp(22px,5vw,76px);display:flex;align-items:center;justify-content:space-between}.brand{display:grid;gap:3px;color:inherit;text-decoration:none}.brand span{font:600 9px/1.2 Arial,sans-serif;letter-spacing:.24em;color:#9b8b70}.brand strong{font-size:16px;font-weight:600;letter-spacing:.13em}.motion-toggle{border:0;background:transparent;font-size:12px;letter-spacing:.1em;color:#6e675b;padding:10px}.motion-toggle span{color:#ae9255;font-size:8px;margin-left:4px}.motion-toggle[aria-pressed=false] span{color:#b9b4aa}.viewer{flex:1;min-height:0;display:grid;place-items:center;padding:20px 0;perspective:1600px}.card-atropos{width:min(1100px,90vw,calc((100svh - 210px)*1.55));aspect-ratio:5/3;overflow:visible}.card-atropos .atropos-scale,.card-atropos .atropos-rotate,.card-atropos .atropos-inner{width:100%;height:100%;overflow:visible;transform-style:preserve-3d}.card-rig{width:100%;height:100%;position:relative;transform-style:preserve-3d;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}.card-rig.is-dragging{cursor:grabbing}.card-spin{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--pitch,0deg)) rotateY(var(--yaw,0deg));will-change:transform}.card-spin.is-snapping{transition:transform .6s cubic-bezier(.2,.7,.2,1)}.card-face{position:absolute;inset:0;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#eee5d7;box-shadow:0 20px 42px rgba(62,49,35,.27),0 3px 8px rgba(62,49,35,.2);border-radius:2px}.card-front{transform:translateZ(1px)}.card-back{transform:rotateY(180deg) translateZ(1px)}.card-face>img{width:100%;height:100%;display:block;object-fit:fill;pointer-events:none}.hit{position:absolute;border:0;padding:0;background:transparent;border-radius:3px;touch-action:none}.hit:hover{background:rgba(255,255,255,.1)}.hit:focus-visible{outline:3px solid #fff8d9;outline-offset:-3px;background:rgba(255,255,255,.12)}.poster{left:3%;top:7%;width:49%;height:88%;z-index:1}.bag{left:52%;top:36%;width:14%;height:64%;z-index:2}.coin{left:89%;top:54%;width:11%;height:19%;z-index:3}.receipt{left:65%;top:8%;width:26%;height:91%;z-index:4}.clip{left:56%;top:10%;width:17%;height:18%;z-index:5;clip-path:polygon(8% 0,100% 66%,100% 100%,0 90%)}.bow{left:86%;top:0;width:14%;height:33%;z-index:6}.school{left:36%;top:22%;width:28%;height:44%}.game{left:34%;top:68%;width:32%;height:18%}.nunu1{left:9%;top:35%;width:12%;height:32%}.nunu2{left:22%;top:35%;width:12%;height:32%}.nunu3{left:66%;top:35%;width:12%;height:32%}.nunu4{left:79%;top:35%;width:12%;height:32%}.ornaments{left:37%;top:8%;width:26%;height:12%}.viewer-footer{min-height:95px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:13px;padding:0 20px 20px}.viewer-footer p{margin:0;font:11px/1.3 sans-serif;letter-spacing:.12em;color:#969085}.face-controls{display:flex;gap:4px;background:rgba(255,255,255,.37);padding:4px;border:1px solid rgba(125,113,94,.14);border-radius:30px}.face-controls button{border:0;background:transparent;border-radius:20px;padding:7px 17px;font-size:12px;color:#8b8377}.face-controls button[aria-pressed=true]{color:#514435;background:#fffdf8;box-shadow:0 1px 5px #8a7a6326}.object-dialog{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;padding:0;border:0;background:transparent;overflow:hidden;color:inherit}.object-dialog::backdrop{background:transparent}.dialog-open #gallery-main{opacity:0;transform:scale(.96);pointer-events:none}.detail-arrival{position:absolute;inset:8vh 8vw 12vh;display:grid;place-items:center}.focus-atropos{width:min(760px,80vw);height:min(76vh,720px);overflow:visible}.focus-atropos .atropos-scale,.focus-atropos .atropos-rotate,.focus-atropos .atropos-inner{height:100%;overflow:visible;display:grid;place-items:center}.focus-atropos img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 18px 18px rgba(62,49,35,.25));user-select:none;-webkit-user-drag:none}.dialog-close{position:absolute;right:clamp(22px,5vw,76px);top:25px;border:0;background:transparent;color:#665e52;font:300 36px/1 sans-serif;z-index:3}.detail-controls{position:absolute;bottom:30px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:24px}.detail-controls button{width:42px;height:42px;border:1px solid #c9c1b4;border-radius:50%;background:#fff9;color:#655e53;font-size:19px}.detail-controls span{font:10px sans-serif;letter-spacing:.2em;color:#888075}button:focus-visible{outline:2px solid #8b7139;outline-offset:3px}@media(max-width:600px){.site-header{height:76px}.card-atropos{width:92vw}.viewer-footer{min-height:100px}.detail-arrival{inset:10vh 5vw 14vh}.focus-atropos{width:90vw;height:70vh}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:0s!important;animation-duration:0s!important}}
:where(.hit:hover,.hit:focus-visible){background:transparent}
.hit:hover{background:transparent}
.hit:focus-visible{background:transparent}
.focus-atropos[data-kind="receipt"] img{max-height:min(58vh,520px)}
.parallax-cut{position:absolute;inset:0;display:block;pointer-events:none;will-change:transform;transition:transform .22s ease-out}
.parallax-cut img{display:block;position:absolute;object-fit:fill;pointer-events:none;user-select:none;-webkit-user-drag:none}
.art-poster{left:3.5%;top:7%;width:57.2%;height:86%;transform:rotate(-2deg);filter:drop-shadow(2px 4px 3px #3c2d244d)}
.bag-paper{left:51%;top:31%;width:61%;height:128%;transform:rotate(-9deg);filter:drop-shadow(2px 4px 4px #3c2d2450)}
.bag-sale{left:51%;top:48%;width:13.3%;height:12%;transform:rotate(-5deg)}
.bag-nunu{left:55.5%;top:69%;width:9%;height:19%;opacity:.75}
.bag-signature{left:89%;top:84%;width:8.5%;height:10%;opacity:.7;transform:rotate(5deg)}
.bag-note{position:absolute;left:56%;top:91%;font:clamp(4px,.8vw,11px) serif;color:#5d3e27;opacity:.8;transform:rotate(-9deg)}
.art-coin{left:88.9%;top:53.5%;width:11%;height:19%;transform:rotate(-12deg);filter:drop-shadow(2px 3px 3px #35261470)}
.art-receipt{left:64%;top:7.4%;width:26%;height:91%;transform:rotate(3.5deg);filter:drop-shadow(3px 5px 4px #33251660)}
.art-clip{left:55.3%;top:10%;width:17%;height:18%;transform:rotate(16deg);filter:drop-shadow(2px 3px 3px #30241490)}
.art-bow{left:83%;top:-4%;width:21%;height:35%;transform:rotate(44deg);filter:drop-shadow(2px 3px 3px #221b1990)}
.brand strong{font-family:"Noto Serif JP","Noto Serif SC","Songti SC",serif;font-weight:700;color:#282722}
.mobile-controls{display:none;align-items:center;gap:6px}.mobile-controls button{border:1px solid #c9c1b4;border-radius:20px;padding:8px 12px;background:#ffffff80;color:#645d52;font:12px sans-serif}.sensor-status{position:absolute;top:76px;left:20px;right:20px;z-index:5;margin:0;text-align:center;color:#70695e;font:12px/1.5 sans-serif;pointer-events:none}.sensor-status:empty{display:none}
@media(max-width:760px) and (pointer:coarse){.mobile-controls{display:flex}.site-header{padding:10px 12px;height:60px;flex-shrink:0}.motion-toggle{padding:8px}.viewer{overflow:hidden;padding:4px 0}.viewer-footer{min-height:75px;padding:0 12px 10px;gap:6px;flex-shrink:0}.mobile-portrait .card-atropos{width:min(calc(98vw * 1.66667),calc(100svh - 143px));transform:rotate(90deg)}.mobile-portrait .viewer-footer p{font-size:11px}.sensor-status{top:60px}}

/* Keep controls above the artwork without taking space from the centered card. */
.site-header{position:fixed;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));height:auto;padding:0;z-index:20;display:block}
.settings-menu{position:relative}.settings-menu summary{list-style:none;cursor:pointer;border:1px solid #c9c1b4;border-radius:22px;background:#f9f7f2e8;color:#645d52;padding:9px 15px;font:12px sans-serif;box-shadow:0 2px 10px #51443518}.settings-menu summary::-webkit-details-marker{display:none}.settings-menu summary:focus-visible{outline:2px solid #8b7139;outline-offset:3px}
.settings-panel{position:absolute;right:0;top:calc(100% + 8px);min-width:180px;padding:12px;display:grid;gap:10px;justify-items:stretch;border:1px solid #d3ccbf;border-radius:14px;background:#f9f7f2f5;box-shadow:0 8px 24px #51443524}.settings-panel .mobile-controls{flex-wrap:wrap}.settings-panel .motion-toggle{text-align:left}.settings-panel .face-controls{justify-self:start}
#gallery-main{height:100svh;min-height:100svh}.viewer{position:relative;flex:1;width:100%;padding:0;overflow:hidden}.card-atropos{width:min(1100px,90vw,calc(90svh * 1.66667))}
@media(max-width:760px) and (pointer:coarse){.site-header{height:auto;padding:0}.viewer{padding:0}.mobile-portrait .card-atropos{position:absolute;left:50%;top:50%;width:min(calc(90vw * 1.66667),90svh);transform:translate(-50%,-50%) rotate(90deg)}.sensor-status{top:58px}}