@charset "UTF-8";

/* Original three-room exhibition: photographed empty rooms, HTML exhibits, no simulated artifacts. */
.museum-world{padding:60px 0 0;background:#f3f0e8;color:#19342b}
.museum-world-intro{display:flex;align-items:end;justify-content:space-between;gap:40px;padding-bottom:29px}
.museum-world-intro h2{margin:13px 0 11px;font:500 clamp(49px,5.2vw,75px)/1.2 var(--serif);letter-spacing:.04em}
.museum-world-intro p{max-width:620px;margin:0;color:#647668;font-size:15px;line-height:1.9}
.museum-world-count{color:#8e7956;font-size:11px;letter-spacing:.08em;white-space:nowrap}
.museum-world-count i{display:inline-block;width:3px;height:3px;margin:0 10px 3px;border-radius:50%;background:#aa9064}
.museum-world-entry{display:flex;align-items:flex-end;flex-direction:column;gap:16px}
.museum-world-entry>a{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;min-width:220px;padding:13px 15px;border:1px solid #1f4534;background:#1f4534;color:#f8f0dc;font-size:13px;text-decoration:none;transition:background .2s}
.museum-world-entry>a:hover{background:#3d6949}
.hall-bottom p a{display:inline-block;margin-left:8px;color:#335f41;text-decoration:none;border-bottom:1px solid #8ba58a}
.hall-navigation{position:relative;z-index:3;display:flex;justify-content:flex-end;margin-bottom:-53px;pointer-events:none}
.hall-navigation button{min-height:53px;padding:0 24px;border:1px solid #c9c9b8;border-right:0;background:rgba(244,241,232,.96);color:#54705b;cursor:pointer;font-size:12px;letter-spacing:.08em;pointer-events:auto;transition:background .2s,color .2s}
.hall-navigation button:last-child{border-right:1px solid #c9c9b8}
.hall-navigation button span{margin-right:10px;color:#9a7c50;font:500 13px Georgia,serif}
.hall-navigation button[aria-selected="true"]{background:#1c4233;border-color:#1c4233;color:#f6ecd8}
.hall-navigation button[aria-selected="true"]+button{border-left-color:#1c4233}
.hall-navigation button[aria-selected="true"] span{color:#e0bd7e}
.hall-navigation button:not([aria-selected="true"]):hover{background:#e1e8da;color:#163728}
.hall-stage{background:#172e27;color:#f5efe2}
.hall-scene{position:relative;min-height:650px;isolation:isolate;overflow:hidden;background-color:#243c30;background-position:center center;background-size:cover}
.hall-scene[hidden]{display:none!important}
.hall-north{background-image:url("assets/gallery-hall-north.jpg")}
.hall-pingcheng{background-image:url("assets/gallery-hall-pingcheng.jpg")}
.hall-luoyang{background-image:url("assets/gallery-hall-luoyang.jpg")}
.hall-scene::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,rgba(9,27,21,.1) 0%,rgba(9,27,21,.1) 38%,rgba(8,25,19,.45) 100%),linear-gradient(90deg,rgba(9,27,21,.25),transparent 28%,transparent 75%,rgba(9,27,21,.3))}
.hall-scene-inner{position:relative;display:grid;grid-template-columns:minmax(170px,215px) minmax(0,1fr) minmax(190px,220px);gap:clamp(14px,2vw,31px);align-items:center;min-height:650px;padding-top:80px;padding-bottom:70px}
.hall-board{align-self:center;min-height:331px;padding:25px 22px;background:rgba(12,43,33,.89);border:1px solid rgba(220,193,145,.58);box-shadow:0 18px 36px rgba(3,15,12,.23)}
.hall-board>span,.hall-screen>span{color:#e0bd7f;font-size:10px;font-weight:700;letter-spacing:.13em}
.hall-board h3{margin:29px 0 18px;font:500 clamp(28px,2.7vw,39px)/1.42 var(--serif);letter-spacing:.06em}
.hall-board p{margin:0;color:#d5dfcf;font-size:12px;line-height:1.82}
.hall-board small{display:block;margin-top:27px;padding-top:14px;border-top:1px solid rgba(215,196,160,.35);color:#aabeaa;font-size:10px;line-height:1.5}
.hall-cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;min-width:0}
.hall-case{display:flex;flex-direction:column;min-width:0;min-height:331px;background:rgba(13,41,31,.93);border:1px solid rgba(213,187,138,.73);box-shadow:0 18px 36px rgba(3,15,12,.25)}
.hall-case-visual{position:relative;display:flex;align-items:center;justify-content:center;height:150px;margin:7px;border:1px solid rgba(210,184,139,.45);background:radial-gradient(circle at 50% 25%,rgba(145,172,139,.2),rgba(22,56,42,.92) 70%)}
.hall-case-visual::before,.hall-case-visual::after{content:"";position:absolute;left:14%;right:14%;height:1px;background:rgba(217,194,152,.25)}
.hall-case-visual::before{top:25%}.hall-case-visual::after{bottom:25%}
.hall-case-visual span{color:#c9b68b;font:400 53px/1 Georgia,serif;letter-spacing:-.06em}
.hall-case-visual small{position:absolute;right:9px;bottom:8px;color:#bacbbb;font-size:9px}
.hall-case-caption{display:flex;flex:1;flex-direction:column;align-items:flex-start;padding:13px 15px 17px}
.hall-case-caption>small{color:#c5aa78;font-size:9px;letter-spacing:.08em}
.hall-case-caption h4{margin:10px 0 8px;font:500 clamp(17px,1.5vw,23px)/1.38 var(--serif);overflow-wrap:anywhere}
.hall-case-caption p{margin:0;color:#a9bcae;font-size:10px;line-height:1.6}
.hall-case-caption button{margin-top:auto;padding:7px 0 3px;border:0;border-bottom:1px solid #a8b8a1;background:none;color:#e1c48d;cursor:pointer;font-size:11px;text-align:left}
.hall-case-caption button:hover{color:#fff0d0;border-color:#fff0d0}
.hall-screen{display:flex;flex-direction:column;min-height:331px;padding:16px;background:rgba(12,39,31,.93);border:1px solid rgba(213,187,138,.73);box-shadow:0 18px 36px rgba(3,15,12,.25)}
.hall-screen-face{display:grid;place-items:center;min-height:137px;margin:15px 0 15px;border:1px solid #738372;background:linear-gradient(145deg,#081e19,#1e4334)}
.hall-screen-face b{display:grid;place-items:center;width:48px;height:48px;border:1px solid #d2b47c;border-radius:50%;color:#d2b47c;font-size:16px;font-weight:400;text-indent:3px}
.hall-screen strong{font:500 clamp(18px,1.55vw,23px)/1.35 var(--serif)}
.hall-screen p{margin:6px 0 0;color:#aebfaf;font-size:10px}
.hall-screen button{align-self:flex-start;margin-top:auto;padding:8px 0 3px;border:0;border-bottom:1px solid #a8b8a1;background:none;color:#e1c48d;cursor:pointer;font-size:11px}
.hall-screen button:hover{color:#fff0d0;border-color:#fff0d0}
.hall-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:19px;padding-bottom:20px;border-bottom:1px solid #c2cbbd}
.hall-bottom p{max-width:750px;margin:0;color:#718272;font-size:11px;line-height:1.7}
.hall-bottom>div{display:flex;flex:0 0 auto;gap:10px}
.hall-bottom button{min-height:33px;padding:0 10px;border:1px solid #b8c4b2;background:none;color:#2d523c;cursor:pointer;font-size:11px}
.hall-bottom button:hover{background:#dce6d8}
.hall-bottom button:disabled{opacity:.4;cursor:default}
.hall-film-index{display:flex;align-items:center;justify-content:space-between;gap:50px;padding-top:70px;padding-bottom:80px}
.hall-film-index h3{margin:14px 0 15px;font:500 clamp(38px,4vw,55px)/1.2 var(--serif)}
.hall-film-index p{max-width:480px;margin:0;color:#6a7b6b;font-size:13px;line-height:1.8}
.hall-film-jumps{display:grid;min-width:390px;border-top:1px solid #aab9a9}
.hall-film-jumps button{display:flex;gap:21px;align-items:center;min-height:54px;padding:0 4px;border:0;border-bottom:1px solid #c4cfc0;background:none;color:#274334;cursor:pointer;font:500 17px/1.3 var(--serif);text-align:left;transition:padding .2s,background .2s}
.hall-film-jumps button span{color:#a28558;font:500 14px Georgia,serif}
.hall-film-jumps button:hover{padding-left:13px;background:#e7ebe2}

.film-dialog{width:min(720px,calc(100% - 28px));max-height:min(90vh,840px);padding:0;border:1px solid #9d855c;background:#102b23;color:#f2ead8;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.film-dialog::backdrop{background:rgba(3,18,14,.79);backdrop-filter:blur(5px)}
.film-dialog-inner{position:relative;padding:24px}
.film-dialog-inner>button{position:absolute;top:14px;right:18px;width:32px;height:32px;border:1px solid #849983;background:none;color:#f2ead8;cursor:pointer;font-size:23px}
.film-dialog-inner>span{display:block;margin:6px 45px 19px 4px;color:#e0bd7f;font-size:10px;letter-spacing:.15em}
.film-dialog-screen{display:grid;place-items:center;aspect-ratio:16/9;background:radial-gradient(circle at 50% 42%,#28523e,#071b16 77%);border:1px solid #738670}
.film-dialog-screen>div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:100%;height:100%}
.film-dialog-screen b{display:grid;place-items:center;width:65px;height:65px;border:1px solid #d8b777;border-radius:50%;color:#d8b777;font-size:22px;font-weight:400;text-indent:4px}
.film-dialog-screen strong{font:500 clamp(26px,4vw,40px)/1.3 var(--serif)}
.film-dialog-screen small{color:#a9bcaa;font-size:11px}
.film-dialog-screen video{width:100%;height:100%;object-fit:contain}
.film-dialog-inner>p{margin:20px 0 8px;color:#d1dfd0;font-size:14px}
.film-dialog-inner>small{display:block;color:#a8bda9;font-size:11px;line-height:1.5}

@media(max-width:1100px){
  .museum-world-count{display:none}
  .hall-scene-inner{grid-template-columns:160px minmax(0,1fr) 180px;gap:12px}
  .hall-board,.hall-case,.hall-screen{min-height:320px}
  .hall-board{padding:19px 15px}
  .hall-board h3{font-size:28px}
  .hall-case-visual{height:139px}
  .hall-case-caption{padding:10px 10px 13px}
  .hall-case-caption h4{font-size:17px}
  .hall-screen{padding:12px}
}
@media(max-width:850px){
  .hall-navigation{margin-bottom:0;justify-content:stretch;width:100%;padding:0 17px;background:#e5e8dc;overflow-x:auto}
  .hall-navigation button{flex:1;min-width:136px;padding:0 12px;font-size:11px}
  .hall-scene{background-position:center top}
  .hall-scene::before{background:linear-gradient(180deg,rgba(10,33,25,.08) 0%,rgba(10,33,25,.23) 25%,#102b22 49%)}
  .hall-scene-inner{display:block;min-height:0;padding-top:255px;padding-bottom:40px}
  .hall-board{min-height:0;padding:20px 22px;margin-bottom:15px}
  .hall-board h3{margin:12px 0 8px;font-size:30px}
  .hall-board h3 br{display:none}
  .hall-board small{margin-top:13px;padding-top:10px}
  .hall-cases{gap:10px}
  .hall-case{min-height:280px}
  .hall-screen{min-height:0;margin-top:15px}
  .hall-screen-face{min-height:120px}
  .hall-screen button{margin-top:17px}
  .hall-film-index{gap:30px}
  .hall-film-jumps{min-width:290px}
}
@media(max-width:740px){
  .museum-world{padding-top:68px}
  .museum-world-intro{display:block}
  .museum-world-entry{align-items:flex-start;margin-top:22px}
  .museum-world-entry>a{min-width:0}
  .museum-world-intro{padding-bottom:31px}
  .museum-world-intro h2{font-size:51px}
  .museum-world-intro p{font-size:13px}
  .hall-navigation{padding:0 17px}
  .hall-navigation button{min-height:49px}
  .hall-scene-inner{padding-top:225px;padding-bottom:28px}
  .hall-cases{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hall-case:nth-child(3){grid-column:1/-1;display:grid;grid-template-columns:33% 1fr;min-height:0}
  .hall-case:nth-child(3) .hall-case-visual{height:112px}
  .hall-case:nth-child(3) .hall-case-caption{justify-content:center}
  .hall-case:nth-child(3) .hall-case-caption h4{margin:6px 0 2px}
  .hall-case-visual{height:128px}
  .hall-case{min-height:260px}
  .hall-case-caption h4{font-size:18px}
  .hall-screen{display:grid;grid-template-columns:1fr 1.3fr;gap:5px 16px;align-items:center;padding:14px}
  .hall-screen>span{grid-column:1/-1}
  .hall-screen-face{grid-row:2/5;min-height:117px;margin:0}
  .hall-screen strong{font-size:21px}
  .hall-screen button{margin-top:0}
  .hall-bottom{display:block;padding-top:17px;padding-bottom:17px}
  .hall-bottom p{font-size:10px}
  .hall-bottom>div{margin-top:14px}
  .hall-film-index{display:block;padding-top:59px;padding-bottom:67px}
  .hall-film-index h3{font-size:43px}
  .hall-film-index p{font-size:12px}
  .hall-film-jumps{margin-top:28px;min-width:0}
  .film-dialog-inner{padding:15px}
  .film-dialog-inner>span{margin-bottom:13px}
}
@media(max-width:400px){
  .hall-scene-inner{padding-top:185px}
  .hall-board h3{font-size:27px}
  .hall-case{min-height:250px}
  .hall-case-visual{height:110px}
  .hall-case-visual span{font-size:43px}
  .hall-case-caption h4{font-size:16px}
  .hall-case-caption p{font-size:9px}
  .hall-screen{grid-template-columns:1fr 1.3fr}
}