:root{
 --ink:#203a32;--muted:#476059;--accent-ink:#24554b;
 --stage:#dce3df;--paper:#f7f6f1;--rule:#9cb6ad85;
 --glass-cyan:#b6fbff;
 font-family:"Yu Gothic UI","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
 color:var(--ink);background:var(--stage);font-synthesis:none
}
*{box-sizing:border-box}
body{margin:0;height:100dvh;display:grid;grid-template-rows:64px minmax(0,1fr);overflow:hidden}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit}
:focus-visible{outline:3px solid #357a73;outline-offset:3px}
[hidden]{display:none!important}
.coad-header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 clamp(20px,3.3vw,55px);background:var(--paper);color:var(--ink)}
.coad-wordmark strong{font-size:clamp(16px,1.5vw,22px);letter-spacing:.02em}
.back-town{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:13px;text-decoration:none;white-space:nowrap}
.back-town span{font-size:18px}
.back-town:hover{text-decoration:underline;text-underline-offset:4px}

main{display:flex;position:relative;min-height:0;background:radial-gradient(ellipse at 34% 43%,#e7ece8,var(--stage) 78%)}
.space{flex:1;position:relative;min-width:0;min-height:0;overflow:hidden}
#coad-stage{position:absolute;inset:0;touch-action:none}
canvas{display:block;outline-offset:-4px;cursor:grab}
canvas:active{cursor:grabbing}
.space-foot{position:absolute;left:clamp(20px,3vw,46px);bottom:18px;color:var(--muted);font-size:11px;pointer-events:none}
#space-loading{position:absolute;inset:0;z-index:5;display:grid;place-content:center;background:var(--stage);font-size:13px}
.wall-photos,.hotspot,.reopen{
 border:1px solid #9eb7ad;background:#f5f8f4ed;color:var(--ink);
 box-shadow:0 3px 10px #203a321a;font-size:12px;font-weight:600;min-height:44px;border-radius:5px;padding:0 12px;white-space:nowrap
}
.wall-photos,.hotspot{position:absolute;z-index:2}
.wall-photos{transform:translate(-50%,-50%)}
.hotspot{transform:translate(-50%,-100%)}
.hotspot::before{content:"+";margin-right:6px;color:var(--accent-ink)}
.wall-photos:hover,.hotspot:hover{background:white}
.hotspot[aria-current=true]{background:#dcece4;border-color:#819c90}
.reopen{position:absolute;right:clamp(16px,3vw,40px);bottom:17px;z-index:3;border-color:var(--ink);background:var(--ink);color:white}
.reopen:hover{background:#365448}
.reopen span{margin-left:7px;color:var(--glass-cyan)}

.business-info{
 --guide-ink:#262b43;--guide-accent:#464775;--guide-line:#56598446;
 --cut:30px;--inner-cut:31px;--inset:clamp(19px,2.15vw,36px);
 display:grid;grid-template-columns:minmax(0,1fr) 68px;gap:14px;position:relative;
 flex:0 0 clamp(400px,37vw,620px);min-height:0;min-width:0;margin:18px 18px 20px 0;
 color:var(--guide-ink);z-index:4
}
.guide-sheet{
 display:flex;flex-direction:column;min-height:0;min-width:0;position:relative;
 padding-bottom:10px;isolation:isolate
}
.guide-sheet::before,.guide-sheet::after{
 content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;
 clip-path:polygon(0 var(--cut),var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%)
}
.guide-sheet::before{
 z-index:0;
 background:linear-gradient(132deg,#797bd2 0%,#a3a6e0 9%,#4b5077 22%,#5a5f82 74%,#9997d3 91%,#6b6db4 100%);
 clip-path:polygon(evenodd,0 var(--cut),var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut),1px var(--inner-cut),1px calc(100% - 1px),calc(100% - var(--inner-cut)) calc(100% - 1px),calc(100% - 1px) calc(100% - var(--inner-cut)),calc(100% - 1px) 1px,var(--inner-cut) 1px,1px var(--inner-cut))
}
.guide-sheet::after{
 background:linear-gradient(152deg,#f3f1fce8,#eae9f6d9 52%,#d7d8efcc);
 backdrop-filter:blur(10px)
}
.dialog-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:57px;flex:none;margin:0 var(--inset);padding-left:11px;border-bottom:1px solid var(--guide-line)}
#info-title{font-size:14px;font-weight:700;letter-spacing:.13em}
#info-title::before{content:"";display:inline-block;width:6px;height:6px;margin-right:10px;vertical-align:2px;background:var(--guide-accent);transform:rotate(45deg)}
#info-close{width:44px;height:44px;margin-right:-9px;border:0;background:none;font-size:25px;line-height:1;font-weight:400}
#info-close:hover{background:#65669818}
.panel-scroll{
 flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;
 margin-right:10px;padding:0 calc(var(--inset) - 16px) 0 var(--inset);scrollbar-color:#777a9d transparent;scrollbar-width:thin
}
.panel-scroll:focus-visible{outline-offset:-3px}
.info-section{padding:26px 0 32px;border-bottom:1px solid var(--guide-line)}
.info-section:last-child{border:0}
.info-section .kicker{display:inline-block;color:var(--guide-accent);font-size:11px;font-weight:700;letter-spacing:.11em;margin:0 0 9px}
.info-section h1,.info-section>h2{font:600 clamp(23px,2.35vw,36px)/1.4 "Yu Mincho","Hiragino Mincho ProN",serif;letter-spacing:.035em;margin:0 0 14px}
.info-section>h2{font-size:clamp(23px,2vw,29px)}
.info-copy p,.info-copy ul{font-size:15px;line-height:1.8;margin:0 0 13px;color:var(--guide-ink)}
.info-copy h3{font-size:15px;line-height:1.7;margin:22px 0 7px}
.info-copy ul{padding-left:21px}
.info-copy p:last-child{margin-bottom:0}
#info-story{padding-top:18px}
.portrait{margin:0 0 clamp(18px,3vh,30px)}
.portrait img{display:block;width:100%;height:auto;aspect-ratio:1.76 / 1;max-height:27vh;object-fit:cover;object-position:50% 23%;background:#e2e9e4}
.portrait figcaption{display:flex;align-items:center;gap:9px;margin-top:9px;color:var(--guide-accent);font-size:11px;letter-spacing:.05em}
.portrait figcaption strong{font-size:14px;color:var(--guide-ink)}
.portrait figcaption::after{content:"";flex:1;margin-left:6px;border-top:1px solid var(--guide-line)}
.info-copy .story-lead{margin:0}
.interview-jump{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;margin-top:14px;border-bottom:1px solid var(--guide-accent);font-size:14px;font-weight:700;color:var(--guide-accent);text-decoration:none}
.interview-jump:hover{text-decoration:underline;text-underline-offset:3px}
.interview{margin-top:24px;scroll-margin-top:14px}
.exchange{padding:19px 0 21px;border-top:1px solid var(--guide-line)}
.speaker{display:inline-block;padding:2px 7px;background:#dcdcf1;color:var(--guide-accent);font-size:11px;font-weight:700;letter-spacing:.08em}
.exchange h2{margin:7px 0 10px;font-size:17px;line-height:1.6;color:var(--guide-ink)}
.info-copy .story-close{padding-left:15px;border-left:3px solid #8385ac;margin:12px 0 0}

.exhibit-nav{display:grid;align-self:center;gap:4px;border-left:1px solid var(--guide-line)}
.exhibit-nav button{
 display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;min-height:54px;
 border:0;border-left:2px solid transparent;margin-left:-1px;background:none;
 color:#385361;font-size:11px;padding:4px 0 4px 9px;white-space:nowrap
}
.exhibit-nav button span{font:600 11px/1 Consolas,monospace;letter-spacing:.1em}
.exhibit-nav button:hover{background:#f0eff980;color:var(--guide-ink)}
.exhibit-nav button[aria-current=true]{background:linear-gradient(90deg,#eeecf9d4,transparent);color:var(--guide-ink);border-left-color:var(--guide-accent);font-weight:700}
.exhibit-nav button[aria-current=true] span{color:var(--guide-accent)}
.exhibit-nav button:focus-visible{outline-offset:-4px}
.info-links{display:grid;gap:8px;margin:20px 0 0}
.info-links:empty{display:none}
.info-links a{border:1px solid var(--rule);text-decoration:none;font-size:13px;font-weight:600;padding:12px}
.info-links a:hover{background:#e0eee7}
.info-links a.primary{background:var(--ink);border-color:var(--ink);color:white}
.info-links a.primary:hover{background:#365448}
.photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:19px}
.photo-grid button{border:1px solid var(--rule);padding:0;background:white;text-align:left}
.photo-grid button:hover{background:#e0eee7}
.photo-grid img{display:block;width:100%;height:auto;aspect-ratio:4 / 3;object-fit:cover}
.photo-grid span{display:block;font-size:11px;line-height:1.5;padding:9px}
.access-address{font-style:normal;font-size:15px;line-height:1.8}
#photo-viewer{position:fixed;margin:auto;padding:52px 16px 14px;max-height:calc(100dvh - 28px);max-width:calc(100vw - 28px);border:0;border-radius:6px;background:var(--ink);color:white}
#photo-viewer::backdrop{background:#122521dd}
#photo-viewer>button{position:absolute;right:6px;top:4px;width:44px;height:44px;border:0;background:none;font-size:25px}
#photo-viewer>button:hover{background:#365448}
#photo-viewer>button:focus-visible{outline-color:var(--glass-cyan);outline-offset:-3px}
#photo-viewer>img{display:block;max-width:100%;max-height:calc(100dvh - 140px);width:auto;height:auto;margin:auto}
#photo-viewer>p{font-size:12px;line-height:1.7;margin:12px 0 0}

@media(max-width:760px){
 body{grid-template-rows:55px minmax(0,1fr)}
 .coad-header{padding:0 13px}
 .coad-wordmark strong{font-size:15px}
 .back-town{font-size:11px;gap:4px}
 main{flex-direction:column}
 .info-open .space{flex:0 0 clamp(176px,35%,310px)}
 .business-info{--cut:18px;--inner-cut:19px;--inset:18px;flex:1;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:3px;margin:0 9px 8px}
 .guide-sheet{padding-bottom:6px}
 .dialog-toolbar{min-height:44px;padding-left:3px}
 .panel-scroll{margin-right:7px;padding:0 11px 0 18px}
 .space-foot{display:none}
 .hotspot,.wall-photos{font-size:11px}
 .info-open .hotspot{display:none}
 .exhibit-nav{grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border-left:0;border-top:1px solid var(--guide-line)}
 .exhibit-nav button{min-height:44px;align-items:center;border-left:0;border-bottom:2px solid transparent;margin-left:0;padding:3px 0;font-size:10px}
 .exhibit-nav button[aria-current=true]{background:#eeecf9d4;border-bottom-color:var(--guide-accent)}
 .info-copy p,.info-copy ul{font-size:14px}
 .portrait img{max-height:180px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}