.store{height:calc(100dvh - 84px);min-height:350px;position:relative;background:#29342d;overflow:hidden;color:#f7f4eb;outline:none!important}#scene-container,#scene-container canvas{width:100%;height:100%;position:absolute;inset:0}#scene-container canvas{touch-action:none;max-width:none}.store-top{position:absolute;top:20px;left:18px;right:18px;display:flex;justify-content:space-between;align-items:start;pointer-events:none;gap:10px}.store-top>div{padding:10px 14px;border-left:2px solid #d5b779;background:#18342acc;border-radius:0 4px 4px 0}.store-top .open-label{font-size:9px;color:#d8dfcc}.store-top p{font-family:var(--serif);font-size:14px;margin-top:4px}.store-top button{pointer-events:auto}.glass-button{background:#17362cde;border:1px solid #bdc4a45c;color:#f7f4eb;border-radius:5px;padding:11px 14px;min-height:46px;font-size:12px;backdrop-filter:blur(8px)}.reticle{position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;border:1px solid #fffcdf;background:#fffcdf55;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 0 3px #183b2d44}.hover-label{position:absolute;top:calc(50% + 25px);left:50%;transform:translateX(-50%);font-size:12px;text-align:center;max-width:260px;width:max-content;background:#18342aeb;padding:9px 15px;border-radius:4px;pointer-events:none}.store-bottom{position:absolute;left:24px;right:20px;bottom:calc(30px + env(safe-area-inset-bottom));display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none;gap:14px}.store-bottom button{pointer-events:auto}.joystick-wrap{display:flex;align-items:center;flex-direction:column;gap:8px;color:#e7e6d6;font-size:10px;pointer-events:auto;user-select:none}.joystick-wrap>span{pointer-events:none}#joystick{width:104px;height:104px;border:1px solid #e3e3c16b;border-radius:50%;position:relative;background:#1631275e;backdrop-filter:blur(2px);touch-action:none}#joystick:before,#joystick:after{content:"";position:absolute;background:#e3e3c129}#joystick:before{left:50%;top:8px;bottom:8px;width:1px}#joystick:after{top:50%;left:8px;right:8px;height:1px}#joystick-knob{position:absolute;left:29px;top:29px;width:44px;height:44px;border-radius:50%;background:#d7dabe77;border:1px solid #eef0da99;pointer-events:none}.desktop-hint{display:none;font-size:11px;color:#ebeada;background:#18342ac7;padding:12px 16px;border-radius:5px;pointer-events:none}.desktop-hint kbd{border:1px solid #ebedc948;border-radius:3px;padding:3px 5px;margin:0 2px;font:10px var(--sans)}.desktop-hint>span{margin:0 8px;color:#bac2a0}.look-hint{position:absolute;bottom:calc(100px + env(safe-area-inset-bottom));right:20px;font-size:9px;color:#ecead6;pointer-events:none;text-shadow:0 1px 4px #000}.tutorial{position:absolute;inset:0;z-index:10;background:#102c2480;display:flex;justify-content:center;align-items:center;padding:24px;backdrop-filter:blur(5px)}.tutorial>div{background:var(--paper);color:var(--ink);padding:28px 25px;border-radius:8px;text-align:center;max-width:400px;width:100%;box-shadow:0 20px 80px #0b1c384d}.tutorial h2{font-size:27px;margin:15px 0 22px}.tutorial p{font-size:12px;line-height:2.1}.tutorial .eyebrow{font-size:10px}.tutorial button{margin-top:22px;width:100%}.tutorial small{display:block;color:var(--muted);font-size:10px;margin-top:12px}.desktop-tutorial{display:none;margin-top:14px}
@media(min-width:680px){.store{height:calc(100dvh - 96px)}.store-top{left:32px;right:32px;top:28px}.store-top p{font-size:17px}.store-top>div{padding:14px 18px}.store-top .open-label{font-size:10px}.store-bottom{left:32px;right:32px}.glass-button{font-size:13px;padding:12px 18px}.desktop-tutorial{display:block}}
@media(min-width:1000px){.desktop-hint{display:block}.store-bottom{align-items:center}.joystick-wrap{order:-1}.store-bottom #pick-button{min-width:136px}.look-hint{right:32px;bottom:110px}}

/* 行き先を決める操作を、指の届く下部にまとめます。 */
#scene-container canvas{cursor:grab}
#scene-container canvas:active{cursor:grabbing}
.store-bottom{bottom:calc(108px + env(safe-area-inset-bottom));left:18px;right:18px;align-items:flex-end}
.joystick-wrap{font-size:9px;gap:5px}
#joystick{width:100px;height:100px;background:#163127b8}
#joystick-knob{left:28px;top:28px;width:42px;height:42px;background:#d7dabeaa}
.stick-up,.stick-left,.stick-right{position:absolute;font-size:17px;line-height:1;pointer-events:none;color:#f7f4eb}
.stick-up{top:6px;left:43px}.stick-left{left:7px;top:41px}.stick-right{right:7px;top:41px}
.look-controls{display:grid;gap:8px;pointer-events:auto}.look-controls>div{display:flex;justify-content:space-between;gap:8px}
.look-controls>div button{font-size:24px;line-height:1;padding:8px 18px;flex:1}
.look-controls #pick-button{font-size:11px;padding:9px 12px}
.travel-feedback{position:absolute;left:18px;right:18px;top:106px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;pointer-events:none}
.travel-feedback p{background:#17362ce6;border:1px solid #bdc4a43d;padding:7px 11px;border-radius:5px;font-size:11px;max-width:100%}
.travel-feedback button{pointer-events:auto;background:#f7f4eb;color:#244e43;font-size:12px}
.shelf-navigation{position:absolute;left:18px;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 8px;background:#17362cf2;border:1px solid #bdc4a473;border-radius:8px;padding:10px 12px}
.shelf-navigation label{grid-column:1/-1;font-size:10px;color:#e7e6d6;line-height:1.2}
.shelf-navigation select{width:100%;min-width:0;min-height:44px;background:#f7f4eb;color:#244e43;border:0;border-radius:4px;padding:8px;font-size:12px}
.shelf-navigation button{background:#dedab8;color:#244e43;border-radius:4px;padding:8px 15px;font-size:12px}
.tutorial h2{font-size:24px}
@media(min-width:680px){.shelf-navigation{max-width:440px;left:50%;right:auto;transform:translateX(-50%);width:calc(100% - 48px)}.store-bottom{left:32px;right:32px;bottom:28px}.desktop-hint{align-self:flex-start;text-align:center;margin-bottom:100px}.travel-feedback{left:32px;right:32px;top:128px;justify-content:center}.look-controls #pick-button{font-size:13px}.joystick-wrap{font-size:10px}}
/* 画面の高さは min-width では表現できないため、ここだけ高さ条件を使います。
   横向きなど縦に狭いとき、スティック・案内・棚の選択が重ならないように詰めます。 */
@media(max-height:600px){.store-bottom{bottom:100px}.travel-feedback{top:92px;left:16px;right:16px}.travel-feedback p{font-size:10px}.joystick-wrap{transform:scale(.8);transform-origin:bottom left}.tutorial{padding:12px}.tutorial>div{padding:14px;max-height:100%;overflow:auto}.tutorial h2{margin:8px 0}.tutorial p{line-height:1.6}.tutorial button{margin-top:10px}.desktop-tutorial{display:none}}

/* 撮影時だけ操作物を画面外へ出し、縦長でも3D面を横へ広げません。 */
body[data-capture-ui]{overflow-x:hidden}
body[data-capture-ui="hidden"] .site-header,body[data-capture-ui="hidden"] .store-more,body[data-capture-ui="hidden"] .room-links,body[data-capture-ui="hidden"] .store-top,body[data-capture-ui="hidden"] .store-bottom,body[data-capture-ui="hidden"] .look-hint,body[data-capture-ui="hidden"] .reticle,body[data-capture-ui="hidden"] .hover-label,body[data-capture-ui="hidden"] .travel-feedback,body[data-capture-ui="hidden"] .shelf-navigation,body[data-capture-ui="hidden"] #tutorial{display:none!important}
body[data-capture-ui="hidden"] .store{height:100dvh}
body[data-capture-ui="minimal"] .site-header,body[data-capture-ui="minimal"] .store-more,body[data-capture-ui="minimal"] .room-links,body[data-capture-ui="minimal"] .store-top button,body[data-capture-ui="minimal"] .store-bottom,body[data-capture-ui="minimal"] .look-hint,body[data-capture-ui="minimal"] .reticle,body[data-capture-ui="minimal"] .hover-label,body[data-capture-ui="minimal"] .travel-feedback,body[data-capture-ui="minimal"] .shelf-navigation,body[data-capture-ui="minimal"] #tutorial{display:none!important}
body[data-capture-ui="minimal"] .store{height:100dvh}
body[data-capture-ui] #scene-container canvas{max-width:100%;cursor:default}
.travel-feedback{display:none}.travel-feedback:has(#stop-walking:not([hidden])){display:flex}.store-bottom{bottom:calc(68px + env(safe-area-inset-bottom))}.store-more{position:absolute;z-index:3;left:50%;bottom:calc(12px + env(safe-area-inset-bottom));width:min(250px,calc(100% - 132px));transform:translateX(-50%)}.store-more>summary{display:flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;border:1px solid #bdc4a473;border-radius:5px;background:#17362ce6;color:#f7f4eb;font-size:11px;cursor:pointer;list-style:none;backdrop-filter:blur(8px)}.store-more>summary::-webkit-details-marker{display:none}.store-more-panel{position:absolute;left:50%;bottom:50px;width:min(340px,calc(100vw - 36px));transform:translateX(-50%);padding:10px;background:#17362cf2;border:1px solid #bdc4a473;border-radius:8px}.store-more .shelf-navigation,.store-more .room-links{position:static;transform:none;max-width:none;width:100%}.store-more .shelf-navigation{display:grid;padding:0;border:0;background:none}.store-more .room-links{display:grid;grid-template-columns:1fr 1fr;margin-top:8px}.store-more .room-links a,.store-more .room-links button{justify-content:center;text-align:center}.tutorial>div{padding:22px 20px}.tutorial h2{margin:10px 0 14px}.tutorial p{line-height:1.8}
@media(min-width:680px){.store-bottom{bottom:28px}.store-more{bottom:28px;width:220px}.store-more-panel{bottom:52px}.travel-feedback:has(#stop-walking:not([hidden])){display:flex}}
@media(min-width:1000px){.store-more{left:50%;bottom:28px}.desktop-hint{margin-bottom:0}.store-more-panel{width:440px}.store-more .room-links{grid-template-columns:1fr 1fr}}