@charset "UTF-8";
:root{--ink:#163c40;--teal:#174d50;--gold:#c5a264;--paper:#f5f1e8;--muted:#647878;--line:rgba(32,66,67,.17);--serif:"Songti SC","STSong","Noto Serif CJK SC","SimSun",serif;--sans:"PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:var(--sans);color:var(--ink);background:#163c40}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button,a,input{outline-offset:5px}button:focus-visible,a:focus-visible,input:focus-visible,[role=button]:focus-visible{outline:2px solid #dfb760}button:disabled{opacity:.35;cursor:default}[hidden]{display:none!important}#world{position:fixed;inset:0}#world canvas{display:block;width:100%;height:100%;touch-action:none}.topbar{position:fixed;z-index:10;top:0;left:0;width:100%;height:92px;padding:0 44px;display:flex;align-items:center;justify-content:space-between;gap:25px;color:#f5efde;background:linear-gradient(#0a3037e6,#0a30374d,transparent)}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-family:var(--serif);font-size:23px;letter-spacing:3px}.brand-mark{display:grid;place-items:center;width:44px;height:44px;border:1px solid #c7ab74;color:#dcc390;font-size:25px}.brand small{display:block;font-family:var(--sans);font-size:10px;letter-spacing:3px;margin-top:5px;color:#d8ded3}.topbar nav{display:flex;align-items:center;gap:38px}.nav-button{border:0;border-bottom:1px solid transparent;background:transparent;color:#d7dfd8;padding:16px 0;font-size:11px;letter-spacing:1px}.nav-button span{font-size:14px;margin-left:8px}.nav-button.active{color:#f4d6a2;border-color:#d3b67c}.utilities{display:flex;gap:12px}.round-button{width:34px;height:34px;border:1px solid #dadfc255;border-radius:50%;color:inherit;background:#153d4633;font-size:18px}.cover{position:fixed;top:0;left:0;height:100%;width:56%;padding:155px 0 40px 7vw;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;background:linear-gradient(90deg,#0c343bf5 10%,#0c343bbc 65%,transparent);color:#f2efdf}.eyebrow{font-size:11px;letter-spacing:2px;line-height:1.7;display:block;color:var(--gold)}.cover .eyebrow{display:flex;align-items:center;gap:12px}.eyebrow>span{height:1px;width:28px;background:var(--gold)}h1{font-family:var(--serif);font-weight:500;font-size:clamp(56px,6.2vw,94px);line-height:1.23;letter-spacing:9px;margin:26px 0 22px}h1 span{color:#d7b477}.cover-copy{font-size:14px;line-height:2.1;color:#d9dfd5;margin:0 0 35px;letter-spacing:1px}.primary{display:flex;align-items:center;justify-content:space-between;gap:45px;background:#ddc18d;color:#183a3d;border:1px solid #e7cca0;min-height:50px;padding:0 24px;font-size:14px;letter-spacing:1px}.primary:hover{background:#eed6aa}.primary span{font-size:23px}.cover-foot{display:flex;align-items:center;gap:18px;margin-top:52px;font-size:11px;letter-spacing:2px;color:#c2cec4}.cover-foot i{height:3px;width:3px;border-radius:50%;background:#be9b65}.model-caption{position:fixed;right:55px;bottom:33px;color:#d7dfd7;font-size:10px;letter-spacing:2px;background:#123e4244;padding:8px 12px}.gallery-intro{position:fixed;left:38px;top:125px;background:#123d4288;backdrop-filter:blur(12px);border-left:1px solid #c4a66c;padding:22px 25px;color:#eee9db;pointer-events:none}.gallery-intro h2{font-family:var(--serif);font-weight:400;font-size:34px;line-height:1.4;letter-spacing:4px;margin:15px 0}.gallery-intro p{font-size:12px;color:#d1d9d4;line-height:1.9}.movement-hint{position:fixed;bottom:112px;left:50%;transform:translateX(-50%);color:#e6e9df;font-size:11px;letter-spacing:1px;background:#123b4288;padding:8px 15px;white-space:nowrap}.lesson-dock{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);display:flex;background:#f6f1e8f5;box-shadow:0 12px 40px #001b2833;border:1px solid #e5d5b5;padding:0 8px;max-width:calc(100% - 40px)}.lesson-dock button{display:flex;align-items:center;gap:14px;background:none;border:0;min-height:58px;padding:0 23px;white-space:nowrap;color:var(--ink)}.lesson-dock button+button{border-left:1px solid var(--line)}.lesson-dock button:hover{background:#dcd4be66}.lesson-dock small{font-family:Georgia,serif;color:#aa8850;font-size:14px}.lesson-dock span{font-size:14px}.lesson-dock b{font-size:17px;font-weight:400;color:#b59662}.lesson-dock .dock-next{font-size:12px;color:#6e734e}.movement{position:fixed;bottom:130px;left:38px;display:flex;align-items:center;flex-direction:column;gap:5px}.movement div{display:flex;gap:5px}.movement button{touch-action:none;user-select:none;background:#f4eedbcc;border:1px solid #c2bca9;color:#244e50;width:36px;height:34px;font-size:19px;border-radius:3px}.studio{position:fixed;inset:0;background:var(--paper);overflow:auto;padding:118px 5vw 30px}.studio-heading .eyebrow{font-size:10px}.studio-heading h2{font-family:var(--serif);font-size:30px;font-weight:500;letter-spacing:2px;margin:9px 0}.studio-heading em{font-weight:400;font-style:normal;color:#63817b}.studio-heading p{font-size:12px;color:var(--muted);margin:9px 0 23px}.studio-grid{display:grid;grid-template-columns:210px minmax(340px,1fr) 205px;gap:30px;max-width:1500px;margin:auto}.studio-tools h3{font-size:12px;font-weight:500;margin:8px 0 16px}.studio-tools h3 small{font-family:Georgia;color:#a88b55;margin-right:7px}.pattern-buttons{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:25px}.pattern-buttons button{padding:11px 4px;font-size:11px;border:1px solid var(--line);background:transparent;color:#506763}.pattern-buttons button.active{background:var(--teal);color:#f4e9d2;border-color:var(--teal)}.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:13px 10px}.palette button{width:35px;height:35px;border:3px solid var(--paper);box-shadow:0 0 0 1px #77857b44;border-radius:50%;position:relative}.palette button.active{box-shadow:0 0 0 2px var(--gold)}.palette button.active:after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:white;text-shadow:0 1px 3px #000;font-size:17px}.selected-colour{font-size:10px;color:#73817a;margin-top:15px}.selected-colour strong{font-weight:500;color:#264c49}.colour-note{margin-top:25px;border-top:1px solid var(--line);padding-top:16px;font-size:11px;line-height:1.85;color:#6b7971}.colour-note span{color:#9d804f}.artboard{background:#e8e5db;border:1px solid #d7d2c1;padding:18px 23px 14px;min-width:0;background-image:radial-gradient(ellipse at 50% 46%,#fcf8eb,#e4e1d8)}.artboard-top{display:flex;justify-content:space-between;font-size:11px;letter-spacing:1px;color:#778577}.tray-host{width:100%;max-width:520px;margin:auto;padding:8px 0}.tray-host svg{display:block;max-height:calc(100vh - 355px);width:100%;min-height:245px;filter:drop-shadow(0 12px 10px #1f3a3633)}.tray-host [data-region]{cursor:pointer;transition:fill .16s;stroke-linejoin:round}.tray-host [data-region]:hover{filter:brightness(1.13)}.artboard-actions{display:flex;align-items:center;gap:15px;border-top:1px solid #6e7b6226;padding-top:13px;justify-content:flex-end}.text-button{background:none;border:0;padding:8px 0;font-size:12px;color:#688078}.primary.small{min-height:37px;font-size:11px;letter-spacing:0;padding:0 16px;gap:10px}.studio-notes{display:flex;gap:18px;padding:8px 0}.vertical-label{writing-mode:vertical-rl;font-family:var(--serif);font-size:15px;letter-spacing:6px;color:#b28e56;padding-right:10px;border-right:1px solid var(--line);height:190px}.studio-notes h3{font-family:var(--serif);font-size:19px;line-height:1.7;font-weight:500;margin:1px 0 17px}.studio-notes ol{padding-left:17px;font-size:11px;line-height:2;color:#5f746c}.studio-notes li{margin-bottom:13px}.outline{background:none;border:1px solid var(--line);color:var(--ink);font-size:12px;padding:10px 14px}.outline:hover{background:#d5d9c933}.simulation-note{font-size:10px;line-height:1.9;color:#859088;margin-top:24px}.studio-open .topbar{background:#123e42;height:84px}.studio-open .model-caption{display:none}dialog{border:0;padding:0;color:var(--ink);background:var(--paper);box-shadow:0 25px 120px #001c3266;max-height:90vh;max-width:94vw}dialog::backdrop{background:#04272acc;backdrop-filter:blur(7px)}.close-button{position:absolute;right:18px;top:16px;z-index:2;width:34px;height:34px;font-size:26px;background:#f5f1e8dd;border:1px solid var(--line);border-radius:50%;color:#3e5a54}.exhibit-dialog{width:1120px}.exhibit-layout{display:grid;grid-template-columns:53% 47%;min-height:610px}.image-panel{background:#dfded6;padding:28px;display:flex;flex-direction:column;min-height:0}.image-view{overflow:hidden;display:flex;align-items:center;justify-content:center;height:470px;flex:1;position:relative;touch-action:none;cursor:grab;background:#e6e5df}.image-view:active{cursor:grabbing}.image-view img{width:100%;height:100%;object-fit:contain;max-height:490px;user-select:none;-webkit-user-drag:none;transform-origin:center;will-change:transform}.zoom-controls{display:flex;align-items:center;gap:9px;margin-top:18px;color:#6a746b;font-size:11px}.zoom-controls button{border:0;background:none;color:#315957;font-size:20px;padding:0 7px}.zoom-controls input{min-width:40px;flex:1;accent-color:#37695e}.zoom-controls output{min-width:35px}.image-tip{font-size:10px;color:#7d867c;text-align:center;margin-top:7px}.exhibit-copy{padding:45px 36px 24px;display:flex;flex-direction:column}.exhibit-copy h2{font-family:var(--serif);font-size:29px;font-weight:500;letter-spacing:1px;margin:13px 0 8px;line-height:1.45}.exhibit-meta{font-size:11px;line-height:1.8;color:#7e887a;margin:0 0 23px}.beauty-tabs{display:flex;gap:17px;border-bottom:1px solid var(--line)}.beauty-tabs button{padding:10px 0;background:none;border:0;border-bottom:2px solid transparent;color:#7d887d;font-size:12px}.beauty-tabs button.active{color:#28584e;border-bottom-color:#af8e53}.observation{margin:22px 0 15px}.observation>span,.question>span{font-size:10px;letter-spacing:2px;color:#a88954}.observation p{font-size:14px;line-height:1.95;margin:8px 0}.question{padding:15px 17px;background:#e6e9df}.question p{font-size:12px;line-height:1.8;margin:6px 0}.question .text-button{font-size:10px}.source{margin-top:auto;padding-top:18px;font-size:10px;color:#7d8478}.source p{line-height:1.8;margin:0 0 4px}.source a{color:#697b6c;font-size:10px}.exhibit-footer{display:flex;justify-content:space-between;margin-top:17px}.info-dialog{width:670px;padding:42px 44px}.info-dialog h2{font-family:var(--serif);font-size:28px;font-weight:500;margin:13px 0 22px}.info-dialog li{font-size:13px;line-height:1.9;margin:8px 0}.info-dialog ul{padding-left:20px}.fine-print{font-size:10px;line-height:1.9;color:#7c887b;margin-top:23px}.process-dialog{width:850px}.process-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px}.process-columns section{padding:18px;background:#e6e9df}.process-columns h3{font-family:var(--serif);font-size:20px;font-weight:500;margin:0 0 12px}.process-columns p{font-size:12px;line-height:1.9}.process-columns .process-line{color:#977641;font-size:13px}.process-dialog>.question{background:transparent;border-top:1px solid var(--line);margin-top:20px;padding-left:0}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);padding:12px 22px;color:#f8f2e0;background:#123e42ee;font-size:12px;border:1px solid #cfb77766;z-index:100;opacity:0;pointer-events:none;transition:.2s}.toast.visible{opacity:1;transform:translate(-50%,0)}.fallback{position:fixed;right:5%;top:40%;width:350px;padding:25px;background:#f2eedee6}.fallback h2{font-size:20px}.fallback p{font-size:12px;line-height:1.8}
@media(min-width:1600px){.studio{padding-top:135px}.studio-heading{max-width:1500px;margin:auto}.studio-heading h2{font-size:38px}.studio-grid{margin-top:30px;grid-template-columns:250px minmax(450px,1fr) 250px;gap:45px}.tray-host{max-width:650px}.tray-host svg{max-height:calc(100vh - 380px)}.studio-tools h3{font-size:15px}.pattern-buttons button{font-size:13px;padding:13px 4px}.studio-notes h3{font-size:24px}.studio-notes ol{font-size:13px}.simulation-note{font-size:12px}}
@media(max-width:1050px){.topbar{padding:0 24px;gap:12px}.topbar nav{gap:22px}.studio{padding:110px 25px 25px}.studio-grid{grid-template-columns:180px minmax(280px,1fr);gap:22px}.studio-notes{grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px}.studio-notes>div{display:flex;gap:20px;align-items:flex-start}.studio-notes h3{font-size:17px;max-width:140px}.studio-notes ol{margin:0;min-width:190px}.studio-notes .simulation-note{margin:0;max-width:240px}.vertical-label{display:none}.lesson-dock button{padding:0 16px;gap:9px}.exhibit-layout{min-height:550px}.exhibit-copy{padding:42px 24px 22px}.image-panel{padding:20px}.exhibit-copy h2{font-size:25px}.image-view{height:430px}.observation p{font-size:13px}.cover{width:65%}}
@media(max-width:700px){.topbar{height:78px;padding:0 16px}.brand{font-size:18px;gap:7px;letter-spacing:2px}.brand-mark{width:34px;height:36px;font-size:22px}.brand small{font-size:8px;letter-spacing:1px}.topbar nav{gap:12px}.nav-button{font-size:0;padding:13px 0}.nav-button span{font-size:11px;margin-left:0}.utilities{gap:6px}.round-button{width:28px;height:28px;font-size:15px}#fullscreen{display:none}.cover{width:100%;padding:100px 28px 35px;background:linear-gradient(90deg,#0b343beb,#0d393cc4 55%,#0d393c33);justify-content:center}h1{font-size:64px;letter-spacing:5px}.cover-copy{font-size:12px;line-height:2}.cover-foot{margin-top:30px;font-size:10px;gap:12px}.model-caption{right:15px;bottom:12px;font-size:8px}.gallery-intro{left:17px;top:100px;padding:12px 16px}.gallery-intro h2{font-size:24px;margin:8px 0}.gallery-intro p{font-size:10px;margin:5px 0}.gallery-intro .eyebrow{font-size:8px}.lesson-dock{bottom:18px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);width:calc(100% - 30px);max-width:none}.lesson-dock button{min-height:48px;gap:7px;justify-content:center;padding:0 8px}.lesson-dock span{font-size:11px}.lesson-dock small{font-size:11px}.lesson-dock b{display:none}.lesson-dock .dock-next{grid-column:1/-1;border:0;border-top:1px solid var(--line);min-height:33px}.movement{left:20px;bottom:128px}.movement-hint{display:none}.studio{padding:103px 18px 24px}.studio-heading h2{font-size:25px;line-height:1.5}.studio-heading em{display:block}.studio-heading p{font-size:11px}.studio-grid{display:flex;flex-direction:column;gap:18px}.studio-tools{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.studio-tools h3{grid-row:1;margin-bottom:12px}.pattern-buttons{grid-column:1;margin-bottom:0;grid-row:2/4;gap:5px}.palette{grid-column:2;grid-row:2;gap:10px 6px}.palette button{width:29px;height:29px}.selected-colour{grid-column:2;font-size:9px}.colour-note{display:none}.pattern-buttons button{font-size:10px;padding:9px 2px}.artboard{padding:14px}.tray-host svg{max-height:none;min-height:240px}.artboard-actions{gap:12px}.text-button{font-size:11px}.primary.small{font-size:10px;padding:0 11px}.studio-notes>div{display:block}.studio-notes h3{max-width:none}.studio-notes ol{margin:10px 0}.studio-notes li{margin-bottom:3px}.studio-notes .simulation-note{max-width:none;margin-top:14px}.exhibit-dialog{width:96vw;max-width:96vw;max-height:94vh}.exhibit-layout{display:block}.image-panel{height:320px;padding:12px 15px}.image-view{height:240px}.image-view img{max-height:250px}.zoom-controls{margin-top:8px}.image-tip{margin-top:1px}.exhibit-copy{padding:22px}.exhibit-copy h2{font-size:24px}.exhibit-meta{margin-bottom:14px}.observation{margin:14px 0}.observation p{font-size:13px}.source{padding-top:14px}.info-dialog{padding:38px 25px 25px}.info-dialog h2{font-size:23px}.info-dialog li{font-size:12px}.process-columns{grid-template-columns:1fr;gap:12px}.fallback{right:5%;top:auto;bottom:150px;width:90%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* v1.1: image panorama and fixed hotspots */
#world canvas{cursor:grab}#world canvas.dragging{cursor:grabbing}.panorama-hotspots{position:absolute;inset:0;pointer-events:none;overflow:hidden}.panorama-hotspot{position:absolute;display:flex;align-items:center;flex-direction:column;transform:translate(-50%,-50%);border:0;background:transparent;color:#f5edd9;padding:10px;pointer-events:auto;white-space:nowrap;filter:drop-shadow(0 3px 9px #002b35aa)}.hotspot-dot{display:grid;place-items:center;width:38px;height:38px;border:1px solid #f0d6a1;outline:1px solid #dec49577;outline-offset:5px;border-radius:50%;background:#16494cdf;color:#f6dfb4;font:15px Georgia,serif}.hotspot-label{margin-top:13px;padding:7px 13px;border:1px solid #c3a46788;background:#143d40ed;font-size:12px;letter-spacing:2px}.panorama-hotspot:hover .hotspot-dot,.panorama-hotspot:focus-visible .hotspot-dot{background:#dfc38f;color:#123c40}.panorama-tools{position:fixed;left:50%;bottom:110px;transform:translateX(-50%);display:flex;align-items:center;background:#153f43dc;border:1px solid #cfb78255;padding:2px 6px;color:#eae4d1;backdrop-filter:blur(8px)}.panorama-tools button{color:inherit;background:none;border:0;padding:8px 13px;font-size:16px;min-height:34px}.panorama-tools #panoReset{font-size:11px;letter-spacing:1px}.panorama-tools i{height:16px;width:1px;background:#d3c8a144;margin:0 7px}.panorama-tools button:hover{background:#ead7ad22}.movement-hint{top:110px;right:32px;bottom:auto;left:auto;transform:none;background:#173c4477;font-size:10px}.gallery-intro{top:126px;background:#123d4299}.gallery-intro h2{font-size:30px;line-height:1.3;margin:12px 0}.gallery-intro p{font-size:11px}.panorama-status{position:absolute;left:50%;top:53%;transform:translate(-50%,-50%);color:#eadbb8;background:#153f43e8;border:1px solid #c9ab7255;padding:18px 25px;font-size:13px;z-index:2;max-width:80%;text-align:center;line-height:1.8}.cover{background:linear-gradient(90deg,#0c343bf0 5%,#0c343bb8 58%,transparent);width:55%}.model-caption{background:#153f43b0}
@media(max-width:700px){.panorama-tools{bottom:112px;width:max-content}.panorama-tools button{padding:8px 11px}.gallery-intro{left:16px;top:99px;padding:10px 13px}.gallery-intro h2{font-size:22px;margin:7px 0}.gallery-intro p{display:none}.gallery-intro .eyebrow{font-size:7px}.hotspot-dot{width:34px;height:34px;font-size:13px}.hotspot-label{font-size:10px;padding:6px 10px;margin-top:11px}.cover{width:100%;background:linear-gradient(90deg,#0c343bf0,#0c343ba0 70%,#0c343b33)}.panorama-status{font-size:11px;padding:15px 20px;top:82%}}

/* v1.3: rotatable artifact models */
.viewer-tabs{display:flex;gap:8px;align-items:center;margin-bottom:12px;flex-shrink:0;padding-right:24px}.viewer-tabs button{border:1px solid #a4b1a388;background:transparent;color:#536e66;padding:8px 12px;font-size:11px}.viewer-tabs button.active{background:#24575a;color:#f8ead0;border-color:#24575a}.viewer-tabs #resetModel{margin-left:auto;border:0;font-size:11px;white-space:nowrap}.model-view{position:relative;flex:1;min-height:260px;height:430px;overflow:hidden;background:radial-gradient(ellipse at 48% 38%,#f9f6ed,#d3d8cf);touch-action:none}.model-view canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none}.model-view canvas:active{cursor:grabbing}.model-loading{position:absolute;left:10%;right:10%;top:45%;text-align:center;font-size:12px;color:#63796d;line-height:1.8;pointer-events:none}.model-disclaimer{text-align:center;color:#7d867c;font-size:9px;margin-top:5px;flex-shrink:0}.zoom-controls,.image-tip{flex-shrink:0}
@media(max-width:700px){.image-panel{height:405px;padding:12px 15px}.model-view{height:280px;min-height:200px}.viewer-tabs{gap:5px;margin-bottom:7px;padding-right:30px}.viewer-tabs button{padding:7px 9px;font-size:10px}.viewer-tabs #resetModel{padding:7px 3px;font-size:10px}.model-disclaimer{font-size:8px}}

/* v1.4: teacher's three appreciation themes */
.observation>span{font-size:13px;letter-spacing:.5px;line-height:1.8}.observation p{font-size:13px;line-height:1.95}.exhibit-copy h2{font-size:27px}.exhibit-meta{margin-bottom:16px}.brand{font-size:21px;letter-spacing:2px}.cover h1{font-size:clamp(56px,6.2vw,94px)}
@media(max-width:700px){.brand{font-size:17px;letter-spacing:1px}.brand small{font-size:8px;letter-spacing:1px}.exhibit-copy h2{font-size:23px}.observation>span{font-size:12px}.observation p{font-size:13px}.cover h1{font-size:64px}}

/* Keep the introduction above the central exhibit, clear of the left vase. */
.gallery-intro{left:50%;transform:translateX(-50%);top:110px;padding:12px 22px;text-align:center;border-left:0;border-top:1px solid #c4a66c}.gallery-intro h2{font-size:24px;margin:6px 0}.gallery-intro h2 br{display:none}.gallery-intro p{margin:5px 0;font-size:10px}.gallery-intro p br{display:none}
@media(max-width:700px){.gallery-intro{left:50%;top:92px;padding:8px 13px;white-space:nowrap}.gallery-intro h2{font-size:21px;margin:5px 0}.gallery-intro p{display:none}}