*{box-sizing:border-box} :root{--blue:#343198;--gold:#d3b368;--ink:#24243b;--muted:#797889;--paper:#f9f8f5}body{margin:0;background:#f2f1ed;color:var(--ink);font-family:Arial,"Noto Sans SC","Microsoft YaHei",sans-serif}button,a,input{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}header{height:90px;margin:0 5vw;border-bottom:1px solid #d9d6cb;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:13px;font-size:21px;font-weight:700}.brand small{display:block;letter-spacing:1.5px;font-size:8px;color:var(--muted);margin-top:7px}.mark{border:1px solid var(--gold);color:var(--blue);font-family:serif;font-size:28px;width:43px;height:43px;display:grid;place-items:center}nav{display:flex;align-items:center;gap:30px;font-size:12px}nav .current{color:var(--blue);border-bottom:2px solid var(--blue);padding:15px 0}nav a{background:var(--blue);color:white;padding:13px 19px}nav a span{margin-left:20px}main{max-width:1500px;margin:auto;display:grid;grid-template-columns:320px 1fr;gap:50px;padding:44px 5vw 20px}aside{padding-top:25px;z-index:2}.eyebrow{color:var(--blue);font-size:11px;font-weight:600;letter-spacing:1px}.eyebrow span{display:inline-block;background:var(--gold);height:6px;width:6px;border-radius:50%;margin-right:6px}h1{font-size:48px;letter-spacing:-2px;line-height:1.3;margin:22px 0 18px;font-weight:700}h1>span{color:var(--gold)}.intro{font-size:13px;color:var(--muted);line-height:1.9;max-width:290px}.steps{margin:27px 0 30px;position:relative}.step{width:100%;display:flex;text-align:left;border:0;border-bottom:1px solid #dfdcd3;background:transparent;padding:12px 0;align-items:center;gap:17px;color:var(--muted)}.step .num{font-size:11px;letter-spacing:1px;color:var(--gold);width:24px}.step strong{font-size:13px;font-weight:500}.step small{margin-left:auto;font-size:10px}.step.active{color:var(--blue)}.step.active strong{font-weight:700}.step.active .num{color:var(--blue)}.primary{background:var(--blue);color:white;padding:16px;display:flex;justify-content:space-between;gap:10px;font-size:12px}.download{display:block;margin-top:15px;font-size:10px;border-bottom:1px solid #c7c3b8;padding-bottom:8px;line-height:1.7}.smallnote{color:var(--muted);font-size:10px;line-height:1.8;margin-top:16px}.exhibition{position:relative;min-width:0;background:radial-gradient(ellipse at 65% 35%,#e4e2f4 0,transparent 55%),radial-gradient(ellipse at 20% 80%,#ece2c8 0,transparent 50%);border:1px solid #dedbd0}.exhibit-top{display:flex;justify-content:space-between;padding:18px 22px;font-size:9px;letter-spacing:1.5px;color:var(--muted)}.live{color:var(--blue);display:flex;align-items:center;gap:5px}.live i{width:5px;height:5px;background:var(--blue);border-radius:50%}.scene{height:min(72vh,780px);min-height:490px;display:grid;place-items:center;perspective:1500px;overflow:hidden;touch-action:pan-y;cursor:grab}.scene.dragging{cursor:grabbing;touch-action:none}.paper{height:88%;aspect-ratio:3508/4961;position:relative;transform-style:preserve-3d;transform:rotateX(10deg) rotateY(-13deg);transition:transform .7s;box-shadow:15px 25px 40px #30286023;background:#f9f9f9;will-change:transform}.base{width:100%;height:100%;display:block}.floating{position:absolute;object-fit:fill;transform:translateZ(calc(var(--z)*var(--depth,1)));opacity:0;transition:transform 1s,filter .5s;animation:reveal 1.2s both;animation-delay:var(--delay)}.floating.stage{cursor:pointer;border:0;background:transparent;padding:0;filter:drop-shadow(2px 4px 2px #23205818)}.floating.stage img{width:100%;height:100%;display:block;pointer-events:none}.floating.stage:hover,.floating.stage.selected{filter:drop-shadow(0 0 9px #b7a1ff) drop-shadow(0 5px 6px #24207135);transform:translateZ(calc(var(--z)*var(--depth,1) + 12px))}.floating.ribbon{filter:drop-shadow(2px 5px 4px #2b24651c)}@keyframes reveal{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}.paused .floating{animation-play-state:paused}.hint{text-align:center;font-size:10px;letter-spacing:1px;color:var(--muted);padding:6px}.hint span{margin:0 9px}.controls{border-top:1px solid #dcd8ce;display:flex;gap:12px;align-items:center;justify-content:center;padding:15px 12px;font-size:10px;flex-wrap:wrap}.controls button{border:0;background:transparent;color:var(--blue);padding:6px}.controls button:hover{background:#e5e3f1}.controls label{display:flex;align-items:center;gap:10px;color:var(--muted);border-left:1px solid #d9d3c7;padding-left:18px}.controls input{width:95px;accent-color:var(--blue)}footer{max-width:1500px;padding:18px 5vw 25px;margin:auto;display:flex;justify-content:space-between;font-size:9px;color:var(--muted);letter-spacing:1px}dialog{border:1px solid var(--gold);padding:40px;width:min(450px,90vw);background:#f9f8f5;color:var(--ink);box-shadow:0 20px 90px #1d184844}dialog::backdrop{background:#201b4855;backdrop-filter:blur(4px)}.close{position:absolute;right:12px;top:10px;border:0;background:none;font-size:25px;color:var(--blue)}dialog h2{color:var(--blue);font-size:28px;margin-bottom:14px}.detail-year{font-size:38px;color:var(--gold);font-weight:700}dialog p{line-height:1.9;font-size:14px}dialog small{display:block;border-top:1px solid #ded8ca;margin-top:25px;padding-top:15px;color:var(--muted);font-size:10px;line-height:1.8}@media(max-width:850px){header{height:72px;margin:0 5vw}.brand{font-size:17px}.brand small{font-size:6px}nav{gap:12px;font-size:10px}nav a{padding:11px}nav a span{display:none}main{display:flex;flex-direction:column;gap:22px;padding-top:12px}aside{padding-top:8px}h1{font-size:30px;margin:12px 0 8px}h1 br{display:none}.intro{max-width:none;font-size:11px}.steps{display:flex;gap:8px;overflow:auto;margin:15px 0}.step{min-width:115px;flex-wrap:wrap;gap:5px;padding:8px 0}.step strong{font-size:11px}.step small{width:100%;margin-left:28px;font-size:9px}.primary{padding:13px;font-size:11px}.download{font-size:10px;margin-top:10px}.smallnote{display:none}.scene{height:68vh;min-height:450px}.exhibit-top{padding:13px;font-size:8px}footer{font-size:8px;gap:20px}.controls{gap:7px}}@media(prefers-reduced-motion:reduce){.floating{animation-duration:.01s;animation-delay:0s!important}.paper,.floating{transition:none}}
.paper{height:min(61vh,670px);width:calc(min(61vh,670px)*.7071155);min-width:0;min-height:0}.floating.stage img{animation:gentle 4.5s ease-in-out infinite alternate;animation-delay:var(--delay)}@keyframes gentle{to{transform:translateY(-3px)}}.paused .floating.stage img{animation-play-state:paused}@media(max-width:850px){.paper{height:min(58vh,600px);width:calc(min(58vh,600px)*.7071155)}}@media(prefers-reduced-motion:reduce){.floating.stage img{animation:none}}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

.paper{transform:rotateX(20deg) rotateY(-22deg);}.floating.stage{filter:drop-shadow(3px 7px 3px #23205825)}.scene{perspective:1200px}.exhibition{overflow:visible}

#layers{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}.floating.stage{pointer-events:auto}
