:root{--paper:#faf7ef;--ink:#233c3c;--teal:#1b6666;--line:#dfdfd4;--gold:#e7bc68;--shadow:0 12px 48px #243b3220;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,select,a{-webkit-tap-highlight-color:transparent}button,select{font:inherit}button{cursor:pointer;border:0}button:disabled{opacity:.4;cursor:default}button:focus-visible,select:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid #dc9f37;outline-offset:4px}button{transition:background .15s,color .15s,transform .15s}button:active{transform:translateY(1px)}[hidden]{display:none!important}.topbar{height:90px;padding:15px 34px;display:flex;align-items:center;gap:38px;background:var(--paper);border-bottom:1px solid var(--line);position:relative;z-index:20}.brand{display:flex;gap:13px;align-items:center;text-decoration:none;color:var(--ink);margin-right:auto;white-space:nowrap}.brand-mark{width:47px;height:47px;display:grid;place-items:center;border-radius:15px;background:var(--teal);color:var(--paper);font-family:Georgia,serif;font-size:39px;font-weight:bold;line-height:1;position:relative}.brand-mark>span{position:absolute;right:2px;top:0;color:var(--gold);font-size:27px}.brand-small{display:block;font-size:11px;letter-spacing:.13em;margin-bottom:3px}.brand strong{font-size:22px;letter-spacing:.08em}.month-control{display:flex;align-items:center;gap:12px}.month-control label{font-size:11px;color:#657975;white-space:nowrap}.month-control select{border:1px solid #d8ded2;border-radius:7px;background:#fffdf6;padding:11px 33px 11px 13px;max-width:230px;color:var(--ink);font-size:14px}.top-actions{display:flex;align-items:center;gap:16px}.plain-button{background:#fffdf5e8;border:1px solid #d9ddd2;border-radius:7px;color:var(--ink);padding:11px 16px;font-size:12px;white-space:nowrap}.plain-button:hover{background:#eff3e7}.icon-button{width:35px;height:35px;background:#f0efe5;border-radius:50%;font-size:19px;color:var(--ink);display:inline-grid;place-items:center}.icon-button:hover{background:#e1e8da}main{height:calc(100dvh - 90px);height:calc(100vh - 90px);position:relative;overflow:hidden;background:#e9ede5}#world{position:absolute;inset:0;touch-action:none;outline-offset:-5px}#world canvas{width:100%;height:100%;display:block;touch-action:none}.intro{position:absolute;z-index:5;left:45px;top:49%;transform:translateY(-50%);width:330px;background:#fffcf2f2;padding:31px 30px 23px;box-shadow:var(--shadow);border:1px solid #ffffffe6;border-radius:2px 22px 22px 22px;backdrop-filter:blur(6px)}.eyebrow{font-size:10px;letter-spacing:.17em;font-weight:700;color:var(--teal);margin:0 0 15px}.intro h1{font-size:30px;line-height:1.65;letter-spacing:.06em;margin:0 0 15px;font-weight:700}.intro>p:not(.eyebrow){font-size:13px;line-height:1.9;color:#627671;margin:0 0 24px}.primary-button{display:flex;justify-content:space-between;align-items:center;gap:28px;background:var(--teal);color:#fffdf3;padding:14px 21px;font-size:13px;letter-spacing:.04em;border-radius:7px;min-height:48px}.primary-button:hover{background:#104e4e}.primary-button span{font-size:21px}.intro-note{display:block;font-size:10px;color:#778780;margin-top:17px;line-height:1.7}.zone-nav{position:absolute;z-index:4;left:50%;top:22px;transform:translateX(-50%);padding:8px 14px;background:#fffdf5ee;border:1px solid #fff;border-radius:12px;box-shadow:0 3px 18px #35533d0c;display:flex;align-items:center;gap:13px;max-width:calc(100% - 32px)}.nav-label{font-size:10px;color:#7a857c;white-space:nowrap}.zone-nav>div{display:flex;gap:7px;overflow:auto}.zone-button{background:transparent;color:#5c6d63;font-size:12px;white-space:nowrap;padding:10px 15px;border-radius:7px}.zone-button[aria-pressed=true]{background:var(--teal);color:white}.zone-button:hover{background:#e2eada}.zone-button[aria-pressed=true]:hover{background:var(--teal)}.visit-status{position:absolute;left:30px;bottom:26px;z-index:4;display:flex;gap:9px;align-items:center;background:#fffcf3e8;border:1px solid #ffffffbf;border-radius:25px;padding:10px 15px;font-size:11px}.status-dot{width:6px;height:6px;background:#489b80;border-radius:50%}.status-secondary{padding-left:9px;border-left:1px solid #d1d9cc;color:#78877c}.movement-hint{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);font-size:10px;color:#63786b;background:#faf7efdb;padding:9px 14px;white-space:nowrap;border-radius:20px;pointer-events:none}.movement-hint span{margin:0 7px;color:#a5afa0}.movement-pad{position:absolute;z-index:6;bottom:84px;left:31px;display:grid;grid-template:40px 40px / 40px 40px 40px;gap:4px}.movement-pad button{border:1px solid #fff;background:#fffdf3d9;color:#496957;border-radius:8px;font-size:20px;touch-action:none;user-select:none}.movement-pad button:hover,.movement-pad button.pressed{background:var(--teal);color:white}.move-forward{grid-column:2;grid-row:1}.move-left{grid-column:1;grid-row:2}.move-back{grid-column:2;grid-row:2}.move-right{grid-column:3;grid-row:2}.room-actions{position:absolute;bottom:25px;right:28px;z-index:5;display:flex;gap:10px;align-items:center}#page-controls{display:flex;align-items:center;gap:8px;font-size:11px}.room-actions>.plain-button{background:#fffcf3e8}.list-panel{position:absolute;inset:0;z-index:10;background:var(--paper);overflow:auto;padding:38px 8vw 80px}.list-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1200px;margin:0 auto 35px}.list-heading h2{font-size:27px;margin:0;letter-spacing:.05em}.list-heading .eyebrow{margin-bottom:8px}.list-zone{max-width:1200px;margin:0 auto 45px}.list-zone h3{font-size:17px;padding-bottom:13px;border-bottom:1px solid var(--line);font-weight:500}.art-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:22px}.art-card{background:transparent;text-align:left;padding:0;color:var(--ink)}.art-card img{width:100%;height:230px;object-fit:contain;background:#efece3;padding:15px}.art-card strong{display:block;margin-top:12px;font-size:14px}.art-card small{display:block;margin-top:5px;color:#748276}.empty-zone{padding:25px 0 30px;color:#7c887a;font-size:14px;line-height:1.9}.empty-zone span{font-size:12px}.art-dialog{border:0;border-radius:15px;background:var(--paper);padding:0;width:min(940px,calc(100vw - 36px));max-height:92dvh;overflow:auto;box-shadow:var(--shadow)}dialog::backdrop{background:#173c3bbf;backdrop-filter:blur(4px)}.dialog-close{position:absolute;right:14px;top:14px;z-index:2;background:#fffdf3ed;font-size:26px}.art-image-wrap{min-height:250px;background:#eeece3;display:grid;place-items:center;padding:26px}.art-image-wrap img{max-width:100%;max-height:62dvh;object-fit:contain}.art-meta{padding:23px 30px 26px}.art-meta .eyebrow{margin-bottom:10px}.art-meta h2{font-size:21px;margin:0 0 7px}.art-meta p:not(.eyebrow){font-size:14px;margin:7px 0}.art-meta .art-month{color:#7d897b;font-size:12px!important}.help-dialog{position:relative;border:0;border-radius:17px;background:var(--paper);width:min(475px,calc(100vw - 32px));padding:36px;box-shadow:var(--shadow);max-height:90dvh;overflow:auto}.help-dialog h2{font-size:25px;margin:0 0 25px}.help-dialog dl{margin:0 0 25px}.help-dialog dt{font-size:13px;color:var(--teal);font-weight:700;margin-top:18px}.help-dialog dd{font-size:13px;line-height:1.9;margin:5px 0 0;color:#627367}.help-dialog>.primary-button{width:100%;justify-content:center}.fallback{position:absolute;z-index:7;inset:100px 25px auto;max-width:450px;margin:auto;background:var(--paper);border-radius:20px;padding:30px}.fallback h2{font-size:23px}.fallback p{font-size:13px;line-height:1.8}.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}#loading{position:absolute;inset:0;background:var(--paper);z-index:15;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:13px;color:#64776a;gap:15px}.loading-flower{display:block;color:var(--teal);font-size:52px;animation:rotate 5s linear infinite}@keyframes rotate{to{transform:rotate(360deg)}}
@media(max-width:1100px){.movement-hint{bottom:88px}.intro{left:26px;width:305px;padding:26px}.zone-nav{left:auto;right:25px;transform:none}.movement-pad{bottom:84px}.topbar{padding:14px 24px;gap:24px}}
@media(max-width:650px){.topbar{height:116px;flex-wrap:wrap;gap:8px 14px;padding:11px 16px}.brand{flex:1;gap:9px}.brand-mark{width:35px;height:35px;font-size:30px;border-radius:11px}.brand-mark>span{font-size:22px}.brand-small{font-size:9px;margin-bottom:2px}.brand strong{font-size:17px}.top-actions{gap:9px;order:1}.top-actions .plain-button{font-size:11px;padding:8px 10px}.icon-button{width:31px;height:31px;font-size:17px}.month-control{width:100%;order:2;gap:12px}.month-control select{font-size:12px;max-width:none;flex:1;padding:7px 12px;height:34px}.month-control label{font-size:10px}main{height:calc(100dvh - 116px)}.zone-nav{top:13px;left:15px;right:15px;max-width:none;padding:6px 9px;justify-content:center;gap:7px;border-radius:10px}.nav-label{font-size:9px}.zone-button{font-size:11px;padding:8px 10px}.intro{left:20px;right:20px;top:auto;bottom:180px;transform:none;width:auto;max-width:330px;padding:23px 24px}.intro h1{font-size:27px;line-height:1.5;margin-bottom:10px}.intro>p:not(.eyebrow){font-size:12px;margin-bottom:17px}.intro .eyebrow{font-size:9px;margin-bottom:11px}.intro .primary-button{min-height:43px;padding:10px 17px;font-size:12px}.intro-note{font-size:9px;margin-top:12px}.movement-hint{font-size:9px;white-space:normal;text-align:center;max-width:220px;bottom:110px;left:auto;right:14px;transform:none;border-radius:10px;padding:8px;line-height:1.8}.movement-hint span{margin:0 2px}.movement-pad{left:17px;bottom:65px;grid-template:39px 39px / 39px 39px 39px}.visit-status{left:15px;bottom:17px;padding:9px 11px;font-size:9px;gap:6px;max-width:calc(100% - 135px)}.status-secondary{padding-left:6px}.room-actions{right:15px;bottom:17px;flex-direction:column;align-items:flex-end}.room-actions>.plain-button{font-size:10px;padding:8px 11px}.list-panel{padding:26px 20px 50px}.list-heading{margin-bottom:25px;align-items:flex-start}.list-heading h2{font-size:21px}.list-heading .plain-button{font-size:10px;padding:9px}.art-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}.art-card img{height:180px;padding:10px}.help-dialog{padding:30px 25px}.art-meta{padding:20px}.art-image-wrap{padding:15px;min-height:200px}.art-image-wrap img{max-height:58dvh}.art-meta h2{font-size:19px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
body.welcome .movement-pad,body.welcome .movement-hint{visibility:hidden}
body.list-mode .zone-nav,body.list-mode .movement-pad,body.list-mode .movement-hint,body.list-mode .visit-status,body.list-mode .room-actions{visibility:hidden}

.sample-notice{max-width:1200px;margin:0 auto 24px;padding:12px 16px;background:#f5e9ba;border-radius:8px;font-size:12px;line-height:1.8;color:#695225}
.brand-small{font-size:14px;font-weight:700;letter-spacing:.06em}.brand strong{font-size:18px}.intro h1{font-size:27px}
@media(max-width:650px){.brand-small{font-size:12px}.brand strong{font-size:14px}.intro h1{font-size:25px}.sample-notice{font-size:11px}}

/* Five separate rooms around a continuous hall. */
.zone-nav{width:max-content;max-width:calc(100% - 40px);gap:10px;top:16px;left:50%;right:auto;transform:translateX(-50%)}
.zone-nav>div{min-width:0;scrollbar-width:thin}.zone-button{padding:9px 12px}
.current-location{position:absolute;top:91px;left:25px;z-index:4;padding:9px 13px;border-radius:8px;background:#fffaf0ed;color:#708078;font-size:10px;box-shadow:0 2px 12px #29493a0a}
.current-location strong{display:block;color:#2a5962;font-size:13px;margin-top:4px}
body.list-mode .current-location{visibility:hidden}
.map-dialog{border:0;border-radius:18px;padding:30px;background:var(--paper);color:var(--ink);width:min(590px,calc(100vw - 30px));max-height:92dvh;overflow:auto}
.map-dialog h2{font-size:24px;margin:0 0 10px}.map-description,.map-note{font-size:12px;line-height:1.8;color:#64776d}.floor-map{display:grid;grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr);grid-template-rows:95px 110px 110px 66px;gap:9px;margin:22px 0}
.map-room{padding:11px 7px;border-radius:9px;text-align:center;color:#234d54;background:#e5eeee;border:2px solid transparent;font-size:11px;line-height:1.7}.map-room strong{display:block;font-size:13px}.map-room small{display:block;font-size:10px;font-weight:400}.map-room[aria-pressed=true]{border-color:#224f5c;box-shadow:0 0 0 2px #fff inset}.map-room:hover{filter:brightness(.96)}
.map-room.producer{grid-column:1/4;grid-row:1;background:#dcebd7}.map-room.radio{grid-column:1;grid-row:2;background:#f5e7c5}.map-room.story{grid-column:3;grid-row:2;background:#e8e1f2}.map-room.hair{grid-column:1;grid-row:3;background:#d6ebef}.map-room.drawing{grid-column:3;grid-row:3;background:#f4dfd5}.map-room.lobby{grid-column:1/4;grid-row:4;background:#e9e4d7}.map-corridor{grid-column:2;grid-row:2/4;display:grid;place-content:center;text-align:center;background:#f1e9d6;color:#9d8f6d;font-size:12px;border-radius:5px}
@media(max-width:1100px){.topbar{gap:15px}.top-actions{gap:8px}.zone-button{font-size:11px;padding:9px 10px}.nav-label{display:none}}
@media(max-width:650px){.top-actions{gap:5px}.top-actions .plain-button{font-size:10px;padding:8px}.brand strong{font-size:12px}.brand-small{font-size:11px}.brand{gap:6px}.brand-mark{width:30px;height:30px}.topbar{padding-left:11px;padding-right:11px}.zone-nav{top:12px;left:10px;right:10px;width:auto;transform:none;max-width:none;justify-content:flex-start;padding:5px}.zone-nav>div{width:100%}.zone-button{font-size:11px;padding:9px 11px}.current-location{top:68px;left:13px;padding:7px 10px;font-size:9px}.current-location strong{font-size:11px}.map-dialog{padding:27px 19px}.map-dialog h2{font-size:21px}.floor-map{grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr);gap:7px;grid-template-rows:90px 100px 100px 65px}.map-room strong{font-size:11px}.map-description,.map-note{font-size:11px}.intro{bottom:130px;max-width:330px}}

@media(max-width:650px){.movement-hint{bottom:155px;max-width:200px}.room-actions{bottom:16px;gap:6px}.room-actions>.plain-button{padding:7px 10px}.visit-status{max-width:calc(100% - 155px)}}