/* The atlas is one open exhibition space. Record pages keep their existing styles. */
.portal-page { --atlas-ink:#334f69; --atlas-muted:#6b7f8e; background:#faf9f5; color:var(--atlas-ink); }
.portal-page main { animation:none; }
.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; }
.portal-page .masthead { width:90%; height:96px; border:0; position:relative; z-index:2; }
.floating-atlas { position:relative; isolation:isolate; overflow:hidden; background:radial-gradient(ellipse at 30% 70%,#acc5c940,transparent 60%),linear-gradient(125deg,#f6f0df,#f8f6eb 60%,#eaf0eb); }
.floating-atlas::before { content:""; position:absolute; inset:0; background:url('../assets/paper-fiber.svg') repeat; opacity:.24; pointer-events:none; z-index:-1; }
.atlas-heading { padding:40px 5% 0; align-items:center; position:relative; z-index:1; }
.atlas-heading h1 { font-size:clamp(40px,4.6vw,72px); letter-spacing:-.045em; }
.atlas-heading h1 span { display:block; margin:16px 0 0; font-size:12px; letter-spacing:.16em; }
.atlas-heading .kicker { color:var(--atlas-muted); margin-bottom:16px; }
.atlas-lead { font-size:12px; color:var(--atlas-muted); line-height:2; }
.atlas-experience { position:relative; min-height:610px; height:calc(100svh - 320px); max-height:900px; }
.atlas-scene { position:absolute; inset:0 32% 90px 2%; touch-action:pan-y; outline-offset:-5px; }
.atlas-sea { position:absolute; inset:3% 1%; z-index:-1; opacity:.32; background:repeating-radial-gradient(ellipse at 15% 45%,transparent 0 23px,#708f971d 24px 25px,transparent 26px 44px); mask-image:radial-gradient(ellipse,#0008,transparent 72%); pointer-events:none; }
.atlas-scene canvas { width:100%; height:100%; display:block; cursor:grab; touch-action:pan-y; }
.atlas-scene[data-selection]:not([data-selection=""]) canvas { mask-image:linear-gradient(to right,#000 80%,transparent 100%); }
.atlas-scene.is-dragging canvas { cursor:grabbing; }
.atlas-scene.is-pointing canvas { cursor:pointer; }
.atlas-fallback { position:absolute; width:82%; height:75%; top:10%; left:9%; object-fit:contain; opacity:.7; }
.atlas-scene[data-ready="true"] .atlas-fallback { display:none; }
.atlas-loading { position:absolute; top:70%; left:0; right:0; text-align:center; font-size:12px; color:var(--atlas-muted); pointer-events:none; }
.atlas-labels { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.atlas-pin { position:absolute; left:0; top:0; transform:translate(-50%,-50%); white-space:nowrap; border:0; background:transparent; color:#263e48; min-height:18px; padding:2px; font:600 11px/1.3 "Yu Mincho","Hiragino Mincho ProN",serif; border-radius:2px; pointer-events:auto; transition:background .2s,color .2s; text-shadow:0 0 3px #fff9e6,0 0 2px #fff9e6; }
.atlas-pin::after { content:""; position:absolute; inset:-3px; }
.atlas-pin:hover,.atlas-pin:focus-visible,.atlas-pin[aria-pressed="true"] { background:#365771; color:white; }
.atlas-pin.is-route { color:#355361; background:#f5f0deee; border:1px solid #9a94735e; letter-spacing:.08em; font-size:13px; font-weight:500; padding:5px 8px; }
.atlas-pin.is-route::after { display:none; }
.atlas-pin.is-owari { background:#984f38; color:#fffdf0; border:1px solid #fff7e5; border-radius:2px; padding:3px 5px; min-height:22px; font-size:12px; text-shadow:none; z-index:3; }
.atlas-labels[data-level="detail"] .atlas-pin { font-size:14px; min-height:28px; padding:4px; }
.atlas-labels[data-level="detail"] .atlas-pin::after { inset:-5px; }
.atlas-readout { position:absolute; bottom:100px; left:6.8%; pointer-events:none; display:flex; flex-direction:column; gap:9px; color:#607e92; }
.atlas-readout b { font-family:"Raleway",sans-serif; font-size:12px; letter-spacing:.22em; font-weight:500; }
.atlas-readout span { font-size:10px; letter-spacing:.09em; }
.atlas-info { position:absolute; right:5%; top:45%; transform:translateY(-50%); width:25%; max-width:380px; padding:20px 0; }
.atlas-info .kicker { color:var(--atlas-muted); font-size:9px; letter-spacing:.16em; margin-bottom:24px; }
.atlas-info h2 { font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-weight:500; font-size:clamp(24px,2.2vw,35px); line-height:1.65; letter-spacing:.05em; }
.atlas-info-copy { font-size:12px; line-height:2.2; color:var(--atlas-muted); margin:22px 0 30px; }
.atlas-enter { display:flex; align-items:center; justify-content:space-between; gap:20px; border:0; padding:18px 22px; width:100%; min-height:56px; background:var(--atlas-ink); color:#fff; font-size:12px; text-decoration:none; transition:background .2s,transform .2s; }
.atlas-enter:hover { background:#487796; transform:translateY(-2px); }
.atlas-enter span { font-size:20px; font-weight:400; }
.atlas-info-note { font-size:10px; color:var(--atlas-muted); line-height:1.9; margin-top:14px; }
.atlas-back { border:0; background:transparent; color:var(--atlas-muted); font-size:10px; min-height:44px; padding:0; margin:0 0 6px; }
.atlas-back:hover { color:var(--atlas-ink); text-decoration:underline; }
.atlas-info { scroll-margin-top:25px; }
.atlas-info [hidden],.atlas-pin[hidden],.atlas-loading[hidden] { display:none!important; }
.atlas-region-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.atlas-region-top h2 { font-size:44px; }
.atlas-region-top span { font-size:10px; letter-spacing:.13em; }
.atlas-preview { height:265px; position:relative; margin:0 -20px; }
.atlas-preview model-viewer { position:absolute; inset:0; width:100%; height:100%; min-height:0; background:transparent; --poster-color:transparent; --progress-bar-color:#446e8e; outline-offset:-6px; }
.atlas-preview model-viewer:not(:defined) { background:url('../assets/posters/yayoi-pottery.png') center/contain no-repeat; }
.atlas-preview-tools { display:flex; justify-content:flex-end; align-items:center; gap:7px; margin-top:-10px; position:relative; }
.atlas-preview-tools button { width:38px; height:38px; border:1px solid #829aaa66; border-radius:50%; background:#ffffffa6; color:var(--atlas-ink); }
.atlas-preview-tools button[aria-pressed=true] { background:#e0e9ca; }
.atlas-model-status { min-height:18px; margin-right:auto; max-width:200px; font-size:10px; line-height:1.7; color:#667e8c; }
.atlas-model-caption { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:14px 0 20px; font-size:13px; }
.atlas-model-caption a { font-size:10px; padding:8px 0; border-bottom:1px solid #69869c60; }
.atlas-bottom { position:absolute; bottom:10px; left:5%; right:5%; display:flex; justify-content:space-between; align-items:end; gap:20px; }
.atlas-controls { display:flex; gap:7px; align-items:center; }
.atlas-controls button { min-width:44px; min-height:44px; border:1px solid #7c99aa44; color:var(--atlas-ink); background:#ffffffa3; border-radius:50%; font-size:19px; }
.atlas-controls #atlas-reset,.atlas-controls #atlas-angle { font-size:10px; border-radius:24px; padding:0 17px; }
.atlas-controls button:hover { background:#fff; border-color:#6f8d9f; }
.atlas-controls button:disabled { opacity:.45; cursor:default; }
.atlas-control-help { font-size:9px; color:#708698; margin-top:12px; }
.atlas-search { display:flex; gap:16px; align-items:center; }
.atlas-search label { font-size:10px; color:var(--atlas-muted); }
.atlas-search select { min-height:44px; width:188px; background:#ffffffa0; color:var(--atlas-ink); border:0; border-bottom:1px solid #7e9ca555; padding:10px 13px; font-size:12px; border-radius:0; }
.atlas-footnote { margin:0; padding:23px 5%; display:flex; justify-content:space-between; gap:20px; color:#708391; font-size:9px; line-height:1.8; }
.atlas-footnote a { border-bottom:1px solid #a5b7bd; white-space:nowrap; }
.portal-records { padding:76px 5%; background:#faf9f5; }
.portal-records-heading h2 { font-weight:500; font-size:28px; }
.portal-record>div { background:#ecf0ef; }
.portal-record h3 { font-weight:500; }
.portal-footer { margin-inline:5%; }
.atlas-info.is-updating { animation:atlas-info-in .5s ease both; }
@keyframes atlas-info-in { from { opacity:0; translate:0 12px; } to { opacity:1; translate:0 0; } }
.atlas-route-nav { margin:24px 5% 0; padding:14px 0; border-top:1px solid #8f907a4d; display:flex; gap:20px; align-items:center; }
.atlas-route-nav>span { font:12px "Yu Mincho",serif; white-space:nowrap; color:#716b56; }
#atlas-routes { display:flex; flex-wrap:wrap; gap:3px 9px; }
#atlas-routes button { position:relative; display:flex; align-items:center; gap:7px; background:transparent; color:#344d58; border:0; border-bottom:1px solid transparent; padding:8px 4px; min-height:40px; font:13px "Yu Mincho",serif; }
#atlas-routes button::before { content:""; width:9px; height:9px; background:var(--route-color); border:1px solid #486a6c36; border-radius:1px; }
#atlas-routes button[aria-pressed=true],#atlas-routes button:hover { border-color:#926f4b; color:#88462f; }
.atlas-country-directory { margin:0; padding:18px 0; display:flex; flex-wrap:wrap; gap:12px 20px; align-items:center; }
.atlas-country-directory[hidden] { display:none; }
.atlas-country-directory h2 { font:32px "Yu Mincho",serif; width:100%; margin-bottom:10px; }
.atlas-country-directory .kicker { margin:0; }
#atlas-country-buttons { display:flex; gap:5px; flex-wrap:wrap; }
#atlas-country-buttons button { min-height:44px; min-width:44px; padding:8px 12px; background:#fffdf28c; border:1px solid #819a8f45; color:#304e5f; font:14px "Yu Mincho",serif; }
#atlas-country-buttons button:hover,#atlas-country-buttons .is-published { border-color:#965638; color:#965638; }
.atlas-country-directory p { width:100%; font-size:10px; color:#71848a; line-height:2; }
.atlas-time-path { margin-top:24px; display:flex; flex-wrap:wrap; gap:4px 0; }
.atlas-time-path>span { width:100%; font:11px "Yu Mincho",serif; margin-bottom:6px; letter-spacing:.08em; color:#8c6347; }
.atlas-time-path a { font:12px "Yu Mincho",serif; min-height:34px; padding:8px 10px; border-right:1px solid #8b9c9844; }
.atlas-time-path a:first-of-type { padding-left:0; }.atlas-time-path a:last-child { border:0; }.atlas-time-path a:hover { color:#934e37; text-decoration:underline; }
.atlas-mist { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:5; background:#f4efdf55; }
.atlas-mist[hidden] { display:none; }
.mist-layer { position:absolute; width:160%; max-width:none; height:120%; object-fit:fill; left:-30%; top:-10%; }
.mist-back { transform:rotate(180deg); opacity:.85; }
.atlas-mist.is-revealing { animation:mist-clear 2.3s ease-out both; }
.is-revealing .mist-front { animation:mist-west 2.2s cubic-bezier(.22,.61,.36,1) both; }
.is-revealing .mist-back { animation:mist-east 2.3s cubic-bezier(.22,.61,.36,1) both; }
@keyframes mist-west { 0%,12%{translate:0 0;opacity:1;} 100%{translate:-65% 6%;opacity:0;} }
@keyframes mist-east { 0%,5%{translate:0 0;opacity:.9;} 100%{translate:65% -8%;opacity:0;} }
@keyframes mist-clear { 0%,15%{background:#f4efdfb3;} 100%{background:transparent;} }
@media(min-width:1101px) { .atlas-heading { padding-top:24px; } }
@media(min-width:761px) and (max-height:820px) {
  .portal-page .masthead { height:80px; }
  .atlas-heading { padding-top:12px; }
  .atlas-heading h1 { font-size:42px; }
  .atlas-heading .kicker { margin-bottom:10px; }
  .atlas-heading h1 span { margin-top:8px; }
  .atlas-route-nav { margin-top:16px; padding:6px 0; }
  .atlas-experience { min-height:450px; height:calc(100svh - 250px); }
  .atlas-scene { bottom:76px; }
  .atlas-info { top:43%; padding:0; }
  .atlas-info .kicker { margin-bottom:12px; }
  .atlas-info h2 { font-size:25px; line-height:1.55; }
  .atlas-info-copy { margin:12px 0 16px; font-size:11px; line-height:1.9; }
  .atlas-time-path { margin-top:14px; }
  .atlas-info-note { margin-top:8px; }
  .atlas-readout { bottom:88px; }
}
@media(max-width:1100px) and (min-width:761px) { .atlas-heading h1 { font-size:44px; } .atlas-lead { max-width:230px; } .atlas-scene { right:30%; } .atlas-info { width:28%; right:4%; } .atlas-preview { height:225px; } .atlas-controls #atlas-angle { display:none; } }
@media(max-width:760px) {
  .portal-page .masthead { height:80px; width:90%; }
  .atlas-heading { padding:27px 6% 0; }
  .atlas-heading h1 { font-size:clamp(34px,8.4vw,50px); }
  .atlas-heading h1 span { margin-top:13px; font-size:11px; }
  .atlas-heading .kicker { font-size:8px; margin-bottom:14px; }
  .atlas-route-nav { margin:21px 6% 0; display:block; padding:10px 0; }
  .atlas-route-nav>span { display:block; margin-bottom:8px; font-size:10px; }
  #atlas-routes { display:grid; grid-template-columns:repeat(5,1fr); gap:2px; }
  #atlas-routes button { min-height:44px; font-size:11px; gap:4px; justify-content:center; padding:5px 1px; }
  #atlas-routes button::before { width:6px; height:6px; }
  .atlas-lead { display:none; }
  .atlas-experience { height:auto; min-height:0; max-height:none; display:flex; flex-direction:column; }
  .atlas-scene { position:relative; inset:auto; width:100%; height:390px; flex:none; }
  .atlas-scene[data-selection]:not([data-selection=""]) canvas { mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent); }
  .atlas-readout { left:6%; bottom:auto; top:345px; }
  .atlas-readout b { font-size:9px; }.atlas-readout span { font-size:9px; }
  .atlas-bottom { position:relative; inset:auto; margin:0 6%; flex-wrap:wrap; gap:20px; order:2; }
  .atlas-controls { gap:5px; }.atlas-controls #atlas-angle { padding:0 13px; }
  .atlas-control-help { font-size:9px; margin-top:9px; }
  .atlas-search { width:100%; justify-content:space-between; }
  .atlas-search select { width:64%; }
  .atlas-info { position:relative; width:auto; max-width:none; inset:auto; transform:none; margin:27px 6% 20px; padding:24px 0 0; border-top:1px solid #8ea4af40; order:3; }
  .atlas-info .kicker { margin-bottom:14px; }
  .atlas-info h2 { font-size:27px; }
  .atlas-info-copy { margin:13px 0 20px; font-size:12px; }
  .atlas-info-note { margin-top:11px; }
  .atlas-region-top h2 { font-size:40px; }
  .atlas-preview { height:280px; margin:0; }
  .atlas-preview-tools button { width:44px; height:44px; }
  .atlas-pin { min-height:18px; padding:2px; font-size:10px; }
  .atlas-pin.is-route { font-size:11px; padding:3px 5px; }
  .atlas-pin.is-owari { padding:3px 5px; font-size:11px; }
  .atlas-time-path a { min-height:44px; padding-top:12px; }
  .atlas-footnote { padding:7px 6% 26px; display:block; font-size:9px; }
  .atlas-footnote a { display:inline-block; margin-top:10px; }
  .portal-records { padding:42px 6%; }
  .portal-records-heading h2 { font-size:23px; line-height:1.5; }
}
@media(prefers-reduced-motion:reduce) { .atlas-info.is-updating { animation:none; } .atlas-enter,.atlas-pin { transition:none; } .atlas-mist { display:none!important; } }
