:root{font-family:PingFang SC,Microsoft YaHei,sans-serif;color:#eeeae1;background:#10120f;font-synthesis:none;--accent:#cee9a0;--muted:#777e72;--line:#2c3028;--surface:#181c16}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,a{color:inherit}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button{border:0;background:none}a{text-decoration:none}svg{width:18px;height:18px;stroke-width:1.5}#app{max-width:1800px;margin:auto;padding:0 48px}.masthead{height:100px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;gap:13px;align-items:center;font-size:19px;letter-spacing:2px;font-weight:500}.brand-mark{border:1px solid #63784d;width:39px;height:44px;display:grid;place-items:center;border-radius:50%}.brand-mark svg{color:var(--accent);width:23px;height:23px}.brand-english{display:block;font:8px monospace;letter-spacing:2.5px;color:#8c9285;margin-top:7px}.edition{font-size:11px;letter-spacing:1px;color:#a1a698}.edition span{display:block;font:9px monospace;letter-spacing:2.3px;margin-top:8px;color:#6f7768}.text-button{display:flex;gap:17px;align-items:center;font-size:12px;padding:12px 0;color:#b3b9ac}.text-button:hover{color:var(--accent)}.experience{display:grid;grid-template-columns:minmax(225px,.93fr) minmax(340px,1.8fr) 250px;gap:26px;min-height:650px;height:calc(100svh - 171px);max-height:1050px;align-items:center}.intro{position:relative;height:100%;padding-top:74px;z-index:1;pointer-events:none}.eyebrow{font:9px monospace;letter-spacing:1.6px;color:#939b89;display:flex;align-items:center;gap:12px;white-space:nowrap}.tiny-cross{font-size:20px;color:var(--accent);font-weight:300}h1{font-family:"Bodoni 72",Didot,Times New Roman,serif;font-size:clamp(72px,7.2vw,114px);font-weight:400;line-height:.98;letter-spacing:-4.5px;margin:38px 0 24px;position:relative;white-space:nowrap}h1 em{font-weight:400;color:var(--accent)}.title-dot{font:60px Times New Roman,serif;color:var(--accent);position:absolute;top:24px;margin-left:5px}.subtitle{font-size:14px;letter-spacing:1px;color:#c0c5b7;line-height:1.8;white-space:nowrap}.intro-rule{width:33px;height:1px;background:#899976;margin:25px 0 20px}.instructions{font-size:12px;line-height:2.2;color:#8d9584}.interaction-hint{display:flex;align-items:center;gap:12px;margin-top:27px;font-size:11px;color:#a9b39d}.interaction-hint>svg{width:31px;height:31px;padding:6px;border:1px solid #333b2b;border-radius:50%}.interaction-hint span span{display:block;font:8px monospace;color:#6e7866;letter-spacing:1.3px;margin-top:6px}.study-label{position:absolute;bottom:49px}.study-label>span{font:8px monospace;letter-spacing:1.5px;color:#838f77}.study-label p{font-size:11px;color:#636f59;margin:10px 0 0}.viewport{height:calc(100% - 44px);position:relative;min-height:580px;isolation:isolate;background:radial-gradient(ellipse at 53% 47%,#28301f45 0%,#17201538 36%,transparent 68%);overflow:hidden}.canvas-host{position:absolute;inset:32px 0 62px;touch-action:none;cursor:grab}.canvas-host:active{cursor:grabbing}.canvas-host canvas{width:100%;height:100%;display:block;outline:none}.scene-topline,.scene-footline{position:absolute;left:21px;right:21px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;z-index:2}.scene-topline{top:17px;font:8px monospace;letter-spacing:1.7px;color:#68765d}.live-indicator{display:flex;align-items:center;gap:7px}.live-indicator>span{width:4px;height:4px;border-radius:50%;background:var(--accent);box-shadow:0 0 7px #c2ed7b40}.live-indicator b{font-size:9px;font-weight:400;letter-spacing:1px;color:#a6b399}.scene-footline{bottom:58px;color:#6d7e5d;font:8px monospace;letter-spacing:1px}.scene-footline>span:nth-child(2){font-family:inherit;font-size:9px;letter-spacing:1.5px}.view-corner{position:absolute;width:12px;height:12px;border-color:#46533a;border-style:solid;opacity:.5}.top-left{left:0;top:0;border-width:1px 0 0 1px}.top-right{right:0;top:0;border-width:1px 1px 0 0}.bottom-left{left:0;bottom:39px;border-width:0 0 1px 1px}.bottom-right{right:0;bottom:39px;border-width:0 1px 1px 0}.viewport-toolbar{display:flex;gap:5px;align-items:center;position:absolute;bottom:0;left:50%;transform:translate(-50%);z-index:2}.viewport-toolbar>span{height:16px;width:1px;background:var(--line);margin:0 5px}.icon-button{display:grid;place-items:center;min-width:34px;height:34px;color:#8d9b7e;border-radius:5px}.icon-button:hover{background:#242b1e;color:var(--accent)}.loading{position:absolute;inset:0;display:flex;gap:12px;align-items:center;justify-content:center;color:#9daa8e;font-size:12px;z-index:3;transition:opacity .5s;pointer-events:none}.loading.hidden{opacity:0}.loading>span{height:7px;width:7px;border-radius:50%;background:var(--accent);animation:breathe 1s infinite alternate}.control-panel{background:linear-gradient(140deg,#20241b88,#181c1666);border:1px solid #303729;border-radius:12px;padding:25px 21px 17px;align-self:center}.panel-heading{display:flex;justify-content:space-between;align-items:center}.panel-heading h2{font-size:14px;font-weight:500;margin:0;letter-spacing:1px}.panel-heading svg{width:16px;color:#8fa07c}.panel-caption{font-size:10px;letter-spacing:.5px;color:#77856a;margin:9px 0 28px}.control-section{margin:0 0 24px}.control-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;font-size:11px;color:#afb7a5}.control-label output{font-family:monospace;font-size:21px;line-height:1;color:#dce5d0}.control-label output span{font-family:sans-serif;font-size:10px;color:#75816a;margin-left:5px}.control-label svg{width:13px;color:#647259}input[type=range]{--fill:36.5%;appearance:none;display:block;width:100%;height:3px;margin:0;background:linear-gradient(to right,var(--accent) var(--fill),#3a4232 var(--fill));border-radius:2px;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px #cee9a012}input[type=range]::-moz-range-thumb{width:10px;height:10px;border:0;border-radius:50%;background:var(--accent)}.range-extents{display:flex;justify-content:space-between;font:8px monospace;color:#69775e;margin-top:11px}.range-extents span{letter-spacing:.4px}.behavior-section{margin-bottom:22px}.segmented{background:#0f130de0;border:1px solid #2a3323;border-radius:6px;display:flex;padding:3px;gap:3px}.segmented button{flex:1;font-size:10px;padding:9px 0;border-radius:4px;color:#7d8b71}.segmented button[aria-pressed=true]{background:#323e25;color:#d9e6c9}.segmented button:hover{color:var(--accent)}#mode-description{font-size:9px;color:#78866c;margin:12px 0 0;line-height:1.5}.toggle-row{border-top:1px solid var(--line);padding:20px 0;display:flex;align-items:center;justify-content:space-between}.toggle-row label{font-size:11px;color:#a1af92;cursor:pointer}.toggle-row label span{display:block;font-size:9px;color:#627055;margin-top:7px}.switch{appearance:none;width:30px;height:17px;border:1px solid #3d4933;background:#1e2619;border-radius:12px;position:relative;cursor:pointer;transition:background .2s}.switch:after{content:"";width:9px;height:9px;border-radius:50%;background:#7c8b6f;position:absolute;left:3px;top:3px;transition:transform .2s}.switch:checked{background:#536738;border-color:#6b814e}.switch:checked:after{transform:translate(13px);background:#e1efce}.playback{display:flex;gap:8px}.primary-button{background:var(--accent);color:#283b13;border-radius:6px;display:flex;align-items:center;gap:8px;flex:1;height:38px;padding:0 12px;font-size:11px}.primary-button:hover{background:#deefc1}.primary-button svg{width:13px;height:13px;stroke-width:2}.primary-button kbd{margin-left:auto;font-size:8px;font-family:inherit;border:1px solid #788f514a;padding:2px 3px;border-radius:3px}.reset-button{height:38px;min-width:37px;border:1px solid #39452e}.reset-button svg{width:15px}.specimen-card{display:flex;gap:10px;align-items:center;border-top:1px solid var(--line);margin-top:24px;padding-top:20px}.specimen-icon{width:31px;height:38px;display:grid;place-items:center}.specimen-icon svg{width:29px;height:29px;transform:rotate(-25deg);color:#a0ac90;stroke-width:1}.specimen-card strong{font-weight:400;font-size:10px;color:#b3bca8;display:block}.specimen-card div>span{font:6px monospace;color:#657658;letter-spacing:.7px;display:block;margin-top:7px}.specimen-no{margin-left:auto;align-self:start;margin-top:7px;font:8px monospace;color:#738365}.panel-note{font-size:8px;color:#617153;margin:19px 0 0;display:flex;align-items:center;gap:6px}.small-dot{width:3px;height:3px;border-radius:50%;background:#637d4c}.footer{border-top:1px solid var(--line);height:71px;display:flex;align-items:center;justify-content:space-between;gap:18px;color:#68765d;font-size:9px}.footer>span{font:7px monospace;letter-spacing:1.25px}.footer>div{display:flex;gap:10px;align-items:center;color:#808d74;font-size:10px}.footer-mark{font-size:25px;color:#8da573}.footer a{display:flex;gap:9px;align-items:center}.footer a svg{width:12px;height:12px}.footer a:hover{color:var(--accent)}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);padding:11px 22px;border:1px solid #536441;border-radius:6px;background:#202819;color:#d5e8c0;font-size:12px;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;z-index:20;white-space:nowrap}#toast.visible{opacity:1;transform:translate(-50%)}dialog{max-width:470px;width:calc(100% - 40px);padding:37px;background:#1b2117;color:#c2cdba;border:1px solid #48553b;border-radius:12px;box-shadow:0 25px 150px #0009}dialog::backdrop{background:#080b07be;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}dialog>.icon-button{position:absolute;right:12px;top:12px}dialog h2{font-size:25px;font-weight:400;color:#e0edcd;margin:26px 0 22px}dialog p{font-size:12px;line-height:1.95;color:#a3af97}dialog a{font-size:11px;color:var(--accent)}dialog .dialog-footnote{border-top:1px solid #343e2c;padding-top:16px;margin-top:22px;font-size:10px;color:#76876b}.viewport:fullscreen{height:100svh;width:100vw;background:#10140d;padding:40px}.viewport:fullscreen .canvas-host{inset:40px 0 75px}.viewport:fullscreen .viewport-toolbar{bottom:22px}@keyframes breathe{to{opacity:.2}}@media(min-width:1500px){.experience{grid-template-columns:minmax(280px,1fr) minmax(600px,1.8fr) 280px;gap:36px}.control-panel{padding:30px 25px 22px}.intro{padding-top:110px}}@media(max-width:1120px){#app{padding:0 28px}.experience{gap:12px;grid-template-columns:210px minmax(280px,1fr) 230px}.control-panel{padding:22px 17px 16px}.intro{padding-top:74px}h1{font-size:78px}.subtitle{font-size:12px}.eyebrow{font-size:7px;letter-spacing:1.1px}.title-dot{font-size:48px}.scene-topline,.scene-footline{left:12px;right:12px}.scene-footline>span:nth-child(2){display:none}}@media(max-width:850px){#app{padding:0 23px}.masthead{height:84px}.edition{display:none}.experience{height:auto;max-height:none;min-height:0;grid-template-columns:minmax(0,1fr) 240px;gap:0 22px;position:relative}.intro{grid-column:1 / -1;padding:30px 0 0;height:auto;display:grid;grid-template-columns:1fr 1fr;align-items:center}.intro .eyebrow{grid-column:1/-1;font-size:8px}.intro h1{font-size:74px;margin:16px 0 20px;line-height:1.03}.intro h1 br{display:none}.intro h1 em{margin-left:14px}.title-dot{top:0}.subtitle{grid-column:2;grid-row:2;align-self:start;margin:26px 0 0;font-size:12px;text-align:right}.instructions{grid-column:2;grid-row:2;margin:53px 0 0;text-align:right;font-size:10px;line-height:1.9}.intro-rule,.interaction-hint,.study-label{display:none}.viewport{grid-column:1;height:610px;min-height:0;margin-bottom:25px}.control-panel{grid-column:2;width:100%;margin-bottom:35px}.footer{height:65px}.footer>span{display:none}}@media(max-width:590px){#app{padding:0 20px}.masthead{height:77px}.brand{font-size:16px;gap:10px}.brand-mark{width:33px;height:37px}.brand-english{font-size:6px}.text-button{font-size:10px;gap:8px}.text-button svg{width:13px}.experience{display:flex;flex-direction:column;gap:0;align-items:stretch}.intro{padding-top:27px;display:block}.intro h1{font-size:clamp(58px,18vw,72px);margin:22px 0 16px;letter-spacing:-3.5px;line-height:.95}.intro .eyebrow{font-size:7px}.title-dot{font-size:45px}.subtitle{font-size:12px;text-align:left;margin:20px 0 9px;letter-spacing:.9px}.instructions{text-align:left;margin:0;font-size:10px;line-height:1.8}.instructions br{display:none}.viewport{height:560px;min-height:0;margin:25px -7px 20px}.canvas-host{inset:25px -12px 65px}.scene-footline>span:nth-child(2){display:inline}.control-panel{margin:0 0 28px;display:grid;grid-template-columns:1fr 1fr;gap:0 24px;padding:23px}.panel-heading,.panel-caption{grid-column:1/-1}.panel-caption{margin-bottom:24px}.control-section{margin-bottom:20px}.behavior-section{grid-column:1/-1}.toggle-row{grid-column:1/-1;padding:16px 0}.playback{grid-column:1/-1}.specimen-card{margin-top:20px;grid-column:1/-1;padding-top:16px}.panel-note{grid-column:1/-1;margin-top:16px}.control-label output{font-size:20px}.footer{height:auto;min-height:68px;gap:8px;flex-wrap:wrap;padding:16px 0}.footer>div{font-size:9px}.footer a{font-size:8px}.footer-mark{font-size:21px}.primary-button,.reset-button{height:41px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(min-width:851px)and (max-height:800px){.masthead{height:84px}.footer{height:56px}.experience{height:calc(100svh - 140px);min-height:540px}.viewport{height:calc(100% - 26px);min-height:0}.intro{padding-top:41px}h1{font-size:86px;margin-top:29px;margin-bottom:20px}.subtitle{font-size:12px}.intro-rule{margin:20px 0 14px}.instructions{font-size:11px}.interaction-hint{margin-top:20px}.study-label{bottom:28px}.control-panel{padding:21px 18px 14px}.panel-caption{margin:8px 0 20px}.control-section{margin-bottom:18px}.control-label{margin-bottom:12px}.range-extents{margin-top:9px}.toggle-row{padding:15px 0}.specimen-card{margin-top:18px;padding-top:14px}.panel-note{margin-top:14px}.behavior-section{margin-bottom:17px}}@media(max-width:590px){.canvas-host{touch-action:pan-y}input[type=range]{height:30px;margin:-13px 0;background-size:100% 3px;background-repeat:no-repeat;background-position:center}input[type=range]::-webkit-slider-thumb{width:14px;height:14px}}