/* Extra controls and the photo/source reader only. Hall styling lives in style.css. */
.exhibit-card.show { pointer-events:auto; }
#exhibit-more { margin-top:13px; }
.exhibit { outline:none; }
.exhibit:focus-visible .vase { filter:drop-shadow(0 0 16px #ffdc78); }
/* Native dialog keeps keyboard focus inside the exhibit and closes with Escape. */
#museum-dialog { padding:0; border:1px solid #aa8a64; border-radius:22px; width:min(1080px,calc(94 * var(--vw))); max-width:none; max-height:calc(92 * var(--vh)); color:#44392e; background:#fcf8ef; box-shadow:0 26px 100px #221b2566; overflow:hidden; }
#museum-dialog::backdrop { background:#30291fd1; backdrop-filter:blur(7px); }
.museum-detail-top { display:flex; align-items:center; justify-content:space-between; padding:13px 23px; border-bottom:1px solid #e0d2bc; font-size:11px; color:#81664b; letter-spacing:.08em; }
.museum-detail-top > div { display:flex; gap:14px; align-items:center; }
#museum-detail-number { color:#a25734; font-size:13px; font-weight:700; }
#museum-detail-close { width:34px; height:34px; background:#f0e7d6; color:#604e3b; border:1px solid #cbbb9f; border-radius:50%; font-size:22px; line-height:1; }
.museum-detail-grid { display:grid; grid-template-columns:1fr 1fr; min-height:0; height:min(640px,calc(calc(92 * var(--vh)) - 125px)); }
.museum-picture-panel { display:flex; flex-direction:column; align-items:center; min-height:0; padding:24px 26px 20px; background:radial-gradient(ellipse at 40% 30%,#fffaea,#e8dcc5); border-right:1px solid #dfceb3; }
.museum-image-switch { display:flex; gap:3px; flex:none; padding:4px; background:#e5d7bf; border:1px solid #cdb897; border-radius:24px; }
.museum-image-switch button { border:0; border-radius:20px; background:none; color:#79644d; padding:7px 13px; font-size:12px; }
.museum-image-switch button[aria-pressed="true"] { background:#fff9ec; color:#7b482b; box-shadow:0 2px 5px #7460401c; }
.museum-picture { position:relative; flex:1; width:100%; min-height:160px; margin:12px 0; display:flex; align-items:center; justify-content:center; }
.museum-picture::before { content:""; position:absolute; width:85%; aspect-ratio:1; border:1px solid #c6b18d80; border-radius:50%; pointer-events:none; }
.museum-picture[data-mode="reference"]::before,.museum-picture[data-mode="original"]::before { display:none; }
#museum-detail-image { position:absolute; width:100%; height:100%; object-fit:contain; border-radius:5px; }
.museum-picture:not([data-load-state="ready"]) #museum-detail-image { visibility:hidden; }
.museum-image-status { position:relative; z-index:1; max-width:90%; padding:15px 18px; border:1px solid #cdb897; border-radius:14px; background:#fff9ecf5; color:#795338; text-align:center; font-size:13px; }
.museum-image-status[hidden] { display:none; }
#museum-image-retry { display:block; margin:10px auto 0; padding:7px 15px; border:1px solid #bd9472; border-radius:20px; background:#f3e4ce; color:#7b482b; }
#museum-image-retry[hidden] { display:none; }
.museum-reader-guide { position:absolute; left:0; bottom:0; display:flex; flex-direction:column; align-items:center; pointer-events:none; }
#museum-reader-avatar { width:70px; }
#museum-guide-status { font-size:10px; color:#6d5138; background:#fff7e6e8; border:1px solid #c8b28f; border-radius:10px; padding:3px 7px; }
#museum-image-note { font-size:11px; color:#85715a; line-height:1.7; text-align:center; margin:0; max-width:360px; }
#museum-other-photo { border:0; border-bottom:1px solid #957555; background:transparent; color:#795338; font-size:12px; padding:6px; margin:3px 0; }
.museum-reading { padding:28px 30px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#cebea3 transparent; }
#museum-detail-tagline { color:#9a694b; font-size:13px; margin:0 0 9px; letter-spacing:.04em; }
#museum-detail-title { font-family:"Noto Sans SC",sans-serif; font-size:24px; font-weight:700; line-height:1.55; letter-spacing:.02em; }
.museum-detail-tags { display:flex; flex-wrap:wrap; gap:7px; margin:13px 0 19px; }
.museum-detail-tags span { padding:5px 9px; border:1px solid #d9cbb4; border-radius:5px; color:#7d6448; font-size:10px; }
#museum-detail-description { margin:0; font-size:15px; line-height:1.95; color:#655340; }
#museum-voice { margin:15px 0 20px; padding:8px 13px; border:1px solid #bd9472; border-radius:20px; color:#8d5537; background:#f3e4ce; font-size:12px; }
#museum-voice:disabled { opacity:.65; cursor:default; }
.museum-question { position:relative; background:#eaf0df; border:1px solid #c7d1b6; border-radius:11px; padding:14px 17px; }
.museum-question span { font-size:10px; color:#61794f; letter-spacing:.1em; font-weight:700; }
.museum-question p { margin:6px 0 0; font-size:14px; color:#4f6244; line-height:1.7; }
.museum-feature-title { margin:22px 0 9px; font-size:13px; font-weight:700; }
#museum-features { display:flex; flex-direction:column; gap:6px; margin:0; padding-left:18px; color:#887256; font-size:12px; line-height:1.7; }
#museum-source-details { margin-top:22px; padding-top:15px; border-top:1px solid #e2d4bd; }
#museum-source-details summary { cursor:pointer; font-size:12px; color:#816040; font-weight:700; }
#museum-detail-knowledge { font-size:12px; line-height:1.9; color:#74614c; }
#museum-source-links { list-style:none; padding:0; display:grid; gap:7px; }
#museum-source-links a { color:#96603e; font-size:11px; line-height:1.7; text-decoration:underline; text-underline-offset:3px; }
#museum-source-note { color:#8a7a66; font-size:10px; line-height:1.9; }
.museum-detail-bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 23px; border-top:1px solid #e0d2bc; background:#f7f0e1; }
.museum-detail-bottom > span { font-size:10px; color:#9a8366; }
.museum-detail-bottom button { border:1px solid #c4a885; background:#fbf5e9; border-radius:7px; padding:8px 15px; color:#7c5538; font-size:12px; }
.museum-detail-bottom button:disabled { opacity:.3; cursor:default; }

#museum-dialog button:focus-visible, #museum-dialog summary:focus-visible, #museum-dialog a:focus-visible { outline:3px solid #a75d33; outline-offset:3px; }
@media(max-width:860px) {
  .museum-detail-grid { grid-template-columns:45% 55%; }
  .museum-reading { padding:22px; }
  .museum-picture-panel { padding:18px 14px; }
  .museum-image-switch button { font-size:10px; padding:7px 10px; }
}
@media(max-width:600px) {
  #museum-dialog { width:calc(96 * var(--vw)); max-height:calc(94 * var(--vh)); border-radius:15px; }
  .museum-detail-top { padding:10px 15px; font-size:9px; }
  .museum-detail-grid { display:block; height:calc(calc(94 * var(--vh)) - 118px); overflow-y:auto; overscroll-behavior:contain; }
  .museum-picture-panel { height:330px; padding:15px; border-right:0; border-bottom:1px solid #dcc9a9; }
  .museum-picture { min-height:190px; margin:5px 0; }
  .museum-picture::before { width:230px; }
  #museum-reader-avatar { width:52px; }
  #museum-guide-status { font-size:8px; padding:3px 5px; }
  .museum-image-switch button { font-size:11px; padding:6px 13px; }
  #museum-image-note { font-size:9px; }
  .museum-reading { padding:22px 23px; overflow:visible; }
  #museum-detail-title { font-size:21px; }
  #museum-detail-description { font-size:14px; }
  .museum-detail-bottom { padding:11px 14px; gap:8px; }
  .museum-detail-bottom > span { font-size:9px; max-width:100px; text-align:center; }
  .museum-detail-bottom button { padding:8px 12px; font-size:11px; }
}