:root{color-scheme:light;--ink:#34372d;--muted:#858477;--gold:#947b45;--line:rgba(93,82,54,.18);font-family:"Noto Serif SC","Songti SC",serif}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#f4f1e8;color:var(--ink);background-image:radial-gradient(ellipse at 50% 34%,rgba(216,208,184,.38),transparent 58%)}button{font:inherit;color:inherit}.experience{min-height:100vh;max-width:1680px;margin:auto;padding:0 6.1%;display:flex;flex-direction:column}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none;font-size:13px;letter-spacing:.12em}.seal{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--gold);color:var(--gold);font-size:17px}.brand-en{display:block;margin-top:3px;font:8px/1.2 Arial,sans-serif;letter-spacing:.19em;color:var(--muted)}.top-note{font-size:11px;color:#777568;letter-spacing:.12em}.top-note i,.eyebrow span{display:inline-block;width:4px;height:4px;background:var(--gold);border-radius:50%;vertical-align:middle;margin:0 10px}.icon-button{border:1px solid var(--line);background:transparent;display:grid;place-items:center;cursor:pointer;transition:background .2s,border-color .2s}.icon-button:hover,.fit-button:hover{background:rgba(148,123,69,.1);border-color:rgba(148,123,69,.5)}.fullscreen{width:36px;height:36px;border-radius:50%}.fullscreen svg{width:16px;fill:none;stroke:currentColor;stroke-width:1.4}.intro{text-align:center;padding:35px 0 25px}.eyebrow{font:9px Arial,sans-serif;letter-spacing:.23em;color:#817a66}.eyebrow span{margin:0 9px 2px 0}.intro h1{font-weight:400;letter-spacing:.33em;font-size:clamp(28px,3.2vw,42px);margin:13px 0 7px;padding-left:.33em}.intro p{margin:0;color:#777363;font-size:12px;letter-spacing:.21em}.viewer{border:1px solid rgba(93,82,54,.2);background:#faf8f1;box-shadow:0 15px 45px rgba(76,66,44,.12)}.viewer-top,.viewer-bottom{height:42px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;color:#777363;font-size:10px;letter-spacing:.08em}.viewer-top{border-bottom:1px solid var(--line)}.live-dot{display:inline-block;width:5px;height:5px;background:#7d9464;border-radius:50%;margin-right:7px;vertical-align:1px;box-shadow:0 0 8px #7d946455}.hint{color:#868476}.hint i{font-style:normal;color:var(--gold);padding:0 4px}.viewport{height:min(39vw,420px);min-height:260px;position:relative;overflow:hidden;cursor:grab;touch-action:none;background:radial-gradient(ellipse at center,#e8e3d5 0,#ded9c9 68%,#d5d0c0 100%);outline:none}.viewport:active{cursor:grabbing}.viewport img{position:absolute;left:50%;top:50%;max-width:none;width:auto;height:auto;transform-origin:center;user-select:none;-webkit-user-drag:none;pointer-events:none;visibility:hidden}.viewport img.ready{visibility:visible}.loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;color:#716c5d;font-size:11px;letter-spacing:.15em}.loader{width:23px;height:23px;border:1px solid #c9c1ab;border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.image-error{position:absolute;inset:0;place-items:center;text-align:center;padding:30px;color:#625c4d;font-size:13px}.drag-label{position:absolute;right:17px;bottom:13px;padding:6px 9px;background:#f8f5e9df;border:1px solid var(--line);font-size:9px;letter-spacing:.1em;color:#635c49;opacity:0;transition:opacity .4s;pointer-events:none}.viewport:hover .drag-label{opacity:1}.viewer-bottom{border-top:1px solid var(--line)}.zoom-controls{display:flex;align-items:center;gap:9px}.zoom-controls .icon-button{width:25px;height:25px;border-radius:50%;font-family:Arial,sans-serif;font-size:15px}.zoom-controls #zoom-value{min-width:74px;text-align:center;font:9px Arial,sans-serif;color:#70694f;letter-spacing:.04em}.control-divider{height:17px;border-left:1px solid var(--line);margin:0 2px}.fit-button{background:none;border:1px solid var(--line);padding:5px 9px;font-size:9px;cursor:pointer;color:#716b59}.pan-hint{color:#858171;font-size:9px;letter-spacing:.12em}.pan-hint span{color:var(--gold);padding:0 6px}.scale-indicator{display:flex;align-items:center;gap:8px;color:#858171;font-size:9px}.scale-line{width:34px;border-top:1px solid var(--gold)}footer{display:flex;justify-content:space-between;gap:15px;padding:19px 1px 24px;color:#817e71;font-size:10px;letter-spacing:.06em}footer span:last-child{color:#77715e}@media(min-height:900px){.intro{padding-top:55px;padding-bottom:35px}.viewport{height:min(39vw,500px)}}@media(max-width:680px){.experience{padding:0 17px}.topbar{height:62px}.top-note{font-size:9px;letter-spacing:.04em}.top-note i{margin:0 4px}.brand{font-size:11px}.intro{padding:34px 0 23px}.intro h1{font-size:31px}.viewport{height:48vw;min-height:230px;max-height:360px}.viewer-top,.viewer-bottom{padding:0 10px}.viewer-top{font-size:9px}.hint{font-size:8px}.pan-hint{display:none}.zoom-controls{gap:6px}.zoom-controls #zoom-value{min-width:63px}.fit-button{font-size:8px;padding:5px 6px}.scale-indicator{font-size:8px}footer{flex-wrap:wrap;justify-content:center;text-align:center;padding:16px 0;font-size:9px}footer span:last-child{width:100%}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
