:root{--bg:#f5f6f1;--paper:#fcfdf9;--ink:#263c36;--muted:#82918a;--line:#dfe6de;--green:#42785f;--green-light:#e5eee4;--blue:#5e85ad;--orange:#d98450;--shadow:0 6px 25px #324b3810;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,a,input{touch-action:manipulation}button{font:inherit;cursor:pointer}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #92ad77;outline-offset:4px}button svg,svg.icon{height:20px;width:20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}button{border:0}button:disabled{opacity:.45;cursor:not-allowed}[hidden]{display:none!important}.sprite{position:absolute;width:0;height:0;overflow:hidden}.app-header{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 44px;background:#f8f9f5}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-size:23px;font-weight:600;letter-spacing:2px}.brand-mark{width:36px;height:36px;color:#577b53}.brand-mark svg{width:100%;height:100%}.brand-dot{padding:0 5px;font-weight:400}.brand-separator{height:20px;width:1px;background:#ccd6cb;margin-left:9px}.brand-caption{font-size:10px;letter-spacing:2px;font-weight:500;color:#839084}.header-right{display:flex;gap:30px;align-items:center}.lab-label{font-size:11px;color:#7c8b7f;letter-spacing:1px;display:flex;gap:9px;align-items:center}.lab-label>span{width:6px;height:6px;border-radius:50%;background:#8da66f}.text-button{display:flex;align-items:center;gap:7px;background:none;font-size:12px;color:#5d6d61;padding:8px 0}.text-button:hover{color:var(--green)}.text-button svg{width:16px;height:16px}main{max-width:1740px;margin:0 auto;padding:30px 44px 0}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.eyebrow{font-size:9px;font-weight:600;letter-spacing:2.1px;color:#8d9b86}.intro h1{font-size:30px;line-height:1.4;letter-spacing:1.5px;font-weight:500;margin:9px 0 8px}.intro h1>span{color:#9db283}.intro p{font-size:12px;color:#819080;margin:0;letter-spacing:.4px}.intro-note{display:flex;align-items:center;gap:22px;color:#9aa68f;font-size:10px;letter-spacing:.8px;line-height:1.9}.intro-note b{color:#74816e;font-weight:400}.mini-diagram{display:flex;align-items:center;gap:12px}.mini-diagram i{width:27px;height:27px;border:1px solid #a5b695;border-radius:50%}.mini-diagram i:last-child{border-radius:40% 60% 66% 34%;transform:rotate(-25deg);height:30px;width:24px}.mini-diagram svg{width:22px;height:22px;stroke:#aab69e;fill:none;stroke-width:1;transform:rotate(45deg)}.workspace{position:relative;isolation:isolate;height:calc(100dvh - 272px);min-height:550px;max-height:950px;background:var(--paper);border:1px solid #dce4d8;border-radius:14px;overflow:hidden;box-shadow:0 8px 35px #4b603a03}.workspace canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;outline:none;cursor:crosshair}.canvas-top{position:absolute;top:25px;left:26px;right:26px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.workspace-title{display:flex;align-items:center;gap:8px;color:#76856f;font-size:10px;letter-spacing:1px}.status-dot{width:5px;height:5px;background:#69906a;border-radius:50%;display:inline-block}.canvas-dimension{border:1px solid #dfe5d9;border-radius:4px;padding:2px 4px;font:8px ui-monospace,monospace;letter-spacing:0;margin-left:3px}.legend{display:flex;align-items:center;gap:20px;font-size:9px;color:#879281;padding-right:85px}.legend span{display:flex;align-items:center;gap:6px}.legend i,.panel-title i{width:6px;height:6px;border-radius:50%;display:inline-block}.green{background:#629176}.blue{background:#789dc1}.orange{background:var(--orange)}.inspector{position:absolute;top:76px;left:26px;width:205px;background:#fcfdf8ed;border:1px solid #e5eadd;border-radius:10px;padding:20px 17px 14px;box-shadow:0 4px 14px #304b2f03;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.inspector-caption{font-size:9px;letter-spacing:1px;color:#99a18c;margin-bottom:15px}.shape-title{display:flex;align-items:center;gap:8px}.shape-title h2{font-size:14px;font-weight:500;margin:0;flex:1}.shape-swatch{width:11px;height:11px;background:#ccdebf;border:1px solid #719664;border-radius:50%}.shape-id{font:10px ui-monospace,monospace;color:#a4ad99}.prior-badge{display:inline-flex;padding:5px 7px;border-radius:4px;background:#eaf0e3;color:#769067;font-size:9px;margin-top:13px}.prior-description{font-size:10px;color:#98a28d;line-height:1.9;margin:10px 0 17px;min-height:38px}.metric-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.metric-pair label{display:block;font-size:9px;color:#8f9b88;margin-bottom:7px}.metric-pair strong{font:400 20px ui-monospace,SFMono-Regular,monospace;color:#4f6750;letter-spacing:-1px}.metric-pair strong span{font-size:10px;letter-spacing:0;margin-left:2px}.inspector-divider{height:1px;background:#e4eadc;margin:20px 0 16px}.range-label{display:flex;justify-content:space-between;align-items:center;font-size:10px}.range-label label{color:#7d8c76}.range-label output{font:10px ui-monospace,monospace;color:#718366}input[type=range]{width:100%;accent-color:#7e9b6b;appearance:none;height:3px;border-radius:8px;background:linear-gradient(to right,#8ba778 var(--pct,50%),#e2e8db var(--pct,50%));margin:15px 0 6px;cursor:pointer;display:block}input[type=range]::-webkit-slider-thumb{appearance:none;height:11px;width:11px;background:#fff;border:2px solid #8ba778;border-radius:50%;box-shadow:0 1px 3px #596e3233}input[type=range]::-moz-range-thumb{height:8px;width:8px;background:#fff;border:2px solid #8ba778;border-radius:50%}.range-ends{display:flex;justify-content:space-between;font-size:8px;color:#a3ad98;margin-top:9px}.switch-row{position:relative;display:flex;align-items:center;justify-content:space-between;margin-top:22px;cursor:pointer;font-size:10px;color:#7b8a72}.switch-row>span:first-child{display:flex;align-items:center;gap:6px}.switch-row svg{fill:none;stroke:currentColor;stroke-width:1.4;width:13px;height:13px}.switch-row input,.force-control input{position:absolute;opacity:0;width:1px;height:1px}.switch{position:relative;width:25px;height:14px;background:#dce4d6;border-radius:10px;transition:background .2s}.switch:after{content:"";position:absolute;width:10px;height:10px;left:2px;top:2px;background:#fff;border-radius:50%;transition:transform .2s}.switch-row input:checked+.switch{background:#89a676}.switch-row input:checked+.switch:after{transform:translate(11px)}.switch-row input:focus-visible+.switch,.force-control input:focus-visible+.small-switch{outline:3px solid #9eb483;outline-offset:3px}.tool-dock{position:absolute;right:24px;top:76px;display:flex;flex-direction:column;gap:6px;padding:7px;background:#fff;border:1px solid #e1e7d9;border-radius:11px;box-shadow:var(--shadow)}.tool{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;width:46px;height:57px;border-radius:7px;background:transparent;color:#909d87;gap:5px;transition:background .2s,color .2s}.tool>svg{height:21px;width:21px;stroke-width:1.6}.tool .tool-label{font-size:8px;letter-spacing:.5px}.tool:hover{background:#f0f4eb;color:#4a6844}.tool.active{background:#eaf1e2;color:#64834f}.tool kbd{position:absolute;font-size:7px;right:4px;top:4px;font-family:inherit;opacity:.65}.reset-tool:hover{background:#fcf0e7;color:#b77657}.dock-divider{height:1px;width:30px;margin:3px auto;background:#edf0e8}.field-panel{position:absolute;right:97px;top:139px;width:224px;padding:13px 17px 15px;background:#fffefbec;border:1px solid #e9e4d8;border-radius:10px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.field-panel:after{content:"";width:8px;height:8px;border:1px solid #e9e4d8;border-bottom:0;border-left:0;background:#fffefb;transform:rotate(45deg);position:absolute;top:24px;right:-5px}.panel-title{display:flex;align-items:center;justify-content:space-between}.panel-title>span{display:flex;gap:7px;align-items:center}.panel-title b{font-size:11px;font-weight:500}.icon-button{display:flex;align-items:center;justify-content:center;width:25px;height:25px;padding:4px;background:none;color:#8d9586;border-radius:5px}.icon-button:hover{background:#f0f3e9}.icon-button svg{width:15px;height:15px}.arrow-preview{padding:3px 7px 10px;color:#d88c59}.arrow-preview svg{width:100%;height:34px}.field-panel input[type=range]{background:linear-gradient(to right,#d69462 var(--pct,50%),#eee8dd var(--pct,50%));accent-color:#d69462}.field-panel input[type=range]::-webkit-slider-thumb{border-color:#d69462}.field-panel input[type=range]::-moz-range-thumb{border-color:#d69462}.radius-label{margin-top:20px}.field-panel-hint{font-size:9px;line-height:1.8;color:#9d9e8e;margin:17px 0 0}.remove-field{padding:8px 0 0;background:none;color:#b47d5b;font-size:10px;border-top:1px solid #eee9df;width:100%;margin-top:12px;text-align:left}.canvas-hint{position:absolute;bottom:88px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;background:#fcfdf6ec;border:1px solid #e4ead8;border-radius:25px;padding:11px 16px;color:#879478;font-size:10px;white-space:nowrap;pointer-events:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.canvas-hint svg{width:15px;height:15px;fill:none;stroke:#819869;stroke-width:1.7}.hint-shortcut{font-size:8px;padding-left:10px;border-left:1px solid #e0e6d6;color:#a6af99}.canvas-bottom{position:absolute;bottom:23px;left:26px;right:26px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.axis-note{font:11px ui-monospace,monospace;color:#819178;display:flex;gap:10px;align-items:center}.axis-note>span{font:9px Inter,PingFang SC,sans-serif;color:#a3ad97}.playback-controls{display:flex;align-items:center;gap:15px;pointer-events:auto;background:#fffefbf2;border:1px solid #e4e8dc;box-shadow:0 3px 10px #1f331208;border-radius:8px;padding:8px 13px;position:absolute;left:50%;transform:translate(-50%);height:42px}.play-button{background:none;display:flex;align-items:center;gap:6px;padding:4px 3px;color:#6f8661;font-size:10px;min-width:48px}.play-button>svg{width:15px;height:15px;stroke-width:2}.control-divider{width:1px;height:14px;background:#e5e9df}.force-control{position:relative;display:flex;align-items:center;gap:5px;font-size:9px;color:#86917b;cursor:pointer;white-space:nowrap}.small-switch{width:21px;height:12px;background:#e3e7dc;border-radius:10px;position:relative}.small-switch:after{content:"";position:absolute;width:8px;height:8px;background:#fff;border-radius:50%;top:2px;left:2px;transition:transform .15s}.force-control input:checked+.small-switch{background:#97aa7b}.force-control input:checked+.small-switch:after{transform:translate(9px)}.time-display{color:#9aa38f;font:9px ui-monospace,monospace;display:flex;gap:7px;align-items:baseline;white-space:nowrap}.time-display output{font-size:12px;color:#687d5a;min-width:28px;text-align:right}.time-display small{font-size:8px}.zoom-note{font-size:8px;color:#a6af9d;display:flex;gap:8px}.zoom-note b{font:9px ui-monospace,monospace;color:#7e8e70}.experiment-footer{min-height:46px;display:flex;align-items:center;justify-content:space-between;color:#929e88;font-size:9px}.live-stats{display:flex;gap:24px;align-items:center}.live-stats>span{display:flex;align-items:center;gap:8px}.live-stats b{font-weight:400;color:#7d8e70}.live-stats>span:not(:first-child){position:relative}.live-stats>span:not(:first-child):before{content:"";position:absolute;left:-13px;width:1px;height:9px;background:#dbe2d3}.footer-note{font-size:9px;color:#a0ab94;letter-spacing:.2px}.footer-note i{font-style:normal;padding:0 7px}#toast{position:absolute;z-index:5;bottom:140px;left:50%;transform:translate(-50%,8px);max-width:80%;border-radius:8px;padding:12px 18px;background:#314b3aed;color:#fff;font-size:11px;line-height:1.6;text-align:center;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;box-shadow:0 5px 20px #19352120}#toast.visible{opacity:1;transform:translate(-50%)}dialog{border:1px solid #dbe3d2;border-radius:16px;background:#fcfdf8;color:var(--ink);padding:29px 34px;width:min(590px,calc(100vw - 28px));max-height:88dvh;box-shadow:0 30px 80px #1f3c322c}dialog::backdrop{background:#233d3442;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.dialog-top{display:flex;align-items:center;justify-content:space-between}dialog h2{font-size:24px;font-weight:500;letter-spacing:.5px;margin:15px 0 10px}.dialog-lead{font-size:12px;line-height:1.9;color:#83927d;margin:0 0 28px}.model-block{display:flex;gap:14px;margin:23px 0}.model-index{flex-shrink:0;font:10px ui-monospace,monospace;color:#9cb18a;border:1px solid #e0e8d7;border-radius:50%;width:25px;height:25px;display:grid;place-items:center}.model-block h3{font-size:12px;margin:5px 0 10px;font-weight:500}.model-block p{font-size:11px;line-height:1.9;color:#809077;margin:0}.formula{font:11px/1.9 ui-monospace,monospace;background:#f0f4e9;padding:11px 12px;border-radius:5px;margin:11px 0;color:#788c64;overflow-wrap:anywhere}.model-block .fine-print{font-size:9px;color:#a0ab93}.model-footnote{display:flex;align-items:flex-start;gap:8px;border-top:1px solid #e2e8d9;padding-top:15px}.model-footnote svg{width:15px;height:15px;flex-shrink:0;margin-top:3px;fill:none;stroke:#91a381;stroke-width:1.5}.model-footnote p{margin:0;font-size:10px;line-height:1.9;color:#939f87}.primary-button{margin-top:23px;width:100%;border-radius:7px;background:#678450;padding:12px 16px;color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center;gap:9px}.primary-button:hover{background:#577344}.primary-button svg{width:15px;height:15px}.workspace.brush-mode canvas{cursor:crosshair}.workspace.paused .status-dot{background:#ba9e6e}.workspace.paused .canvas-dimension{color:#b09a71}@media(min-width:1450px){.intro h1{font-size:34px}main{padding-top:35px}.workspace{height:calc(100dvh - 290px)}}@media(max-width:1100px){main{padding:25px 24px 0}.app-header{padding:0 24px}.inspector{width:178px;padding:17px 14px;left:18px}.prior-description{font-size:9px}.tool-dock{right:18px}.field-panel{right:91px}.intro-note{display:none}.legend{gap:12px}.metric-pair strong{font-size:18px}.workspace{min-height:560px}.axis-note>span,.zoom-note{display:none}}@media(max-width:760px){.app-header{height:63px;padding:0 18px}.brand-caption,.brand-separator,.lab-label{display:none}.brand{font-size:21px}.brand-mark{width:31px;height:31px}.header-right{gap:12px}main{padding:22px 12px 0}.intro{margin:0 8px 22px}.intro h1{font-size:26px;margin:7px 0}.intro p{font-size:10px;line-height:1.8;max-width:320px}.eyebrow{font-size:8px}.workspace{height:calc(100dvh - 246px);min-height:650px;border-radius:10px}.canvas-top{top:17px;left:16px;right:15px}.legend{padding:0;gap:10px;font-size:8px}.workspace-title{font-size:9px}.workspace-title .canvas-dimension{display:none}.inspector{top:54px;left:14px;width:155px;padding:14px 12px 10px}.inspector-caption{font-size:8px;margin-bottom:10px}.shape-title h2{font-size:12px}.prior-badge{font-size:8px;margin-top:10px}.prior-description{font-size:8px;margin:8px 0 12px;min-height:30px}.metric-pair{gap:8px}.metric-pair label{font-size:8px}.metric-pair strong{font-size:16px}.inspector-divider{margin:14px 0 12px}.range-label{font-size:9px}.range-label output{font-size:9px}.range-ends{font-size:7px}.switch-row{font-size:9px;margin-top:14px}.tool-dock{top:54px;right:13px;padding:5px;gap:4px}.tool{width:40px;height:49px}.tool svg{width:18px;height:18px}.tool-label{font-size:7px}.field-panel{right:73px;top:100px;width:196px;z-index:3;padding:12px 14px}.canvas-hint{max-width:94%;font-size:8px;gap:6px;padding:9px 11px;bottom:76px}.hint-shortcut{display:none}.canvas-bottom{bottom:26px;left:15px;right:15px}.axis-note{display:none}.playback-controls{height:39px;padding:7px 11px;gap:12px}.time-display{gap:4px}.live-stats{gap:19px;font-size:8px}.live-stats>span{gap:5px}.live-stats>span:not(:first-child):before{left:-10px}.experiment-footer{padding:0 5px;min-height:43px;gap:10px}.footer-note{font-size:8px}.footer-note i{padding:0 3px}}@media(max-width:430px){.footer-note{display:none}.legend{gap:7px}.legend span{gap:4px}.canvas-hint svg{width:12px;height:12px}.grid-control{display:none}dialog{padding:22px}.workspace{min-height:590px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}.inspector-caption{display:flex;align-items:center;justify-content:space-between;gap:6px}.sample-count{font:9px ui-monospace,monospace;letter-spacing:0;color:#a4af99}.brush-panel{top:76px;border-color:#dce6eb;background:#fcfefdf5}.brush-panel:after{border-color:#dce6eb;background:#fcfefd}.resolution-label{margin-top:20px}.brush-panel input[type=range]{background:linear-gradient(to right,#83a6bd var(--pct,50%),#e2eaf0 var(--pct,50%));accent-color:#83a6bd}.brush-panel input[type=range]::-webkit-slider-thumb{border-color:#83a6bd}.brush-panel input[type=range]::-moz-range-thumb{border-color:#83a6bd}.resolution-presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-top:18px}.resolution-presets button{border:1px solid #e1e8eb;border-radius:5px;padding:8px 1px 6px;background:#fcfdfc;color:#8b9fa8;font:10px ui-monospace,monospace}.resolution-presets button span{display:block;font:8px system-ui,sans-serif;margin-top:4px;color:#98a8ad}.resolution-presets button:hover{background:#f1f6f8}.resolution-presets button.active{background:#e9f1f7;border-color:#aec5d6;color:#6d94b0}.resolution-presets button.active span{color:#7d9caf}.resolution-help{font-size:9px;line-height:1.9;color:#94a1a6;margin:14px 0 10px}.resolution-scope{font-size:8px;color:#819aa6;border-top:1px solid #e5ecef;padding-top:10px;letter-spacing:.2px}@media(max-width:760px){.brush-panel{top:54px}.sample-count{font-size:8px}.resolution-presets{gap:4px}.resolution-help{font-size:8px}.resolution-label{margin-top:16px}}.resolution-button{padding:2px 5px;background:#edf2e7;border-radius:4px;color:#80926f;font:9px ui-monospace,monospace;letter-spacing:0;white-space:nowrap}.resolution-button:not(:disabled):after{content:"⌄";margin-left:5px}.resolution-button:not(:disabled):hover{background:#e2ead8;color:#5f7c4c}.resolution-button:disabled{background:none;opacity:1;cursor:default;padding-right:0;color:#a4af99}.surface-panel{left:244px;right:auto;top:76px;border-color:#dfe7d6;background:#fcfef9f5;z-index:3}.surface-panel:after{left:-5px;right:auto;transform:rotate(225deg);border-color:#dfe7d6;background:#fcfef9}.surface-panel input[type=range]{background:linear-gradient(to right,#8ba778 var(--pct,50%),#e2e8db var(--pct,50%));accent-color:#8ba778}.surface-panel input[type=range]::-webkit-slider-thumb{border-color:#8ba778}.surface-panel input[type=range]::-moz-range-thumb{border-color:#8ba778}.field-resolution-help{font-size:8px;line-height:1.8;color:#9da393;margin:10px 0 0}.field-panel{max-height:calc(100% - 155px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#dbe3cf transparent}.surface-panel,.brush-panel{max-height:calc(100% - 95px)}@media(max-width:1100px){.surface-panel{left:210px}}@media(max-width:760px){.surface-panel{left:14px;top:104px;width:205px}.surface-panel:after{display:none}.resolution-button{font-size:8px}.field-panel{max-height:calc(100% - 140px)}.surface-panel,.brush-panel{max-height:calc(100% - 125px)}}