@font-face{font-family:PhylloSerif;src:local('Georgia')}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f1f1e9;color:#1d342a;font-family:'Microsoft YaHei UI','Microsoft YaHei',sans-serif;font-size:14px}button,input,select{font:inherit}button,a,select,input{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}header{height:86px;margin:0 5vw;display:flex;align-items:center;border-bottom:1px solid #cdd4c9;gap:48px}.brand{display:flex;align-items:center;font:700 23px PhylloSerif,Georgia,serif;letter-spacing:3px}.brand-icon{font-size:38px;margin-right:12px}.wordmark{font:11px 'Microsoft YaHei',sans-serif;letter-spacing:2px;margin-left:22px;padding-left:22px;border-left:1px solid #c9d1c7}nav{display:flex;gap:28px;font-size:12px;margin-left:auto}nav a:hover{color:#708850}.project-tag{font-size:10px;border:1px solid #a8b7a2;border-radius:30px;padding:8px 12px;color:#66765f}main{max-width:1400px;margin:auto;padding:0 5vw}.intro{display:flex;justify-content:space-between;align-items:center;padding:54px 0 38px}.eyebrow{font-size:10px;letter-spacing:2.5px;font-weight:bold;color:#71836d;margin:0 0 18px}h1{font-size:clamp(34px,4vw,58px);letter-spacing:-2px;margin:0 0 22px;line-height:1.3;font-weight:500}h1 em{font-style:normal;color:#718855}.lede{font-size:13px;line-height:1.95;color:#6c7968;margin:0}.intro-note{border-left:1px solid #cdd4c9;padding:5px 0 5px 32px}.intro-note span{font-size:9px;letter-spacing:2px}.intro-note strong{font:italic 44px PhylloSerif,Georgia,serif;display:block;margin:12px 0;color:#5f7750}.intro-note p{font-size:10px;color:#758171}.studio{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(290px,1fr);border-radius:5px;overflow:hidden;border:1px solid #ccd3c7;background:#f8f8f0;scroll-margin-top:20px}.visual-panel{background:#0c1915;color:#bacdc0;min-width:0;display:flex;flex-direction:column}.panel-head{height:52px;display:flex;gap:9px;align-items:center;padding:0 25px;font-size:10px;letter-spacing:1px;border-bottom:1px solid #25342c}.live-dot,.status-strip i{width:6px;height:6px;background:#9bc980;display:inline-block;border-radius:100%}.candidate{margin-left:auto;color:#728c7c;font-size:9px}.canvas-wrap{position:relative;flex:1;min-height:470px;overflow:hidden;background:radial-gradient(ellipse at center,#162d23 0%,#0b1713 65%)}canvas{display:block;width:100%;height:100%;position:absolute;inset:0}.diagram-label{position:absolute;pointer-events:none;left:26px;right:26px;font-family:Consolas,monospace;font-size:9px;letter-spacing:1.5px;color:#526e5e}.label-top{top:22px}.label-bottom{bottom:18px;display:flex;justify-content:space-between}.visual-footer{display:flex;gap:16px;align-items:center;min-height:60px;padding:10px 23px;border-top:1px solid #25342c;font-size:10px}.visual-footer button{font-size:10px}.outline{background:transparent;color:#cee1cc;border:1px solid #48604d;border-radius:3px;padding:8px 12px}.toggle{display:flex;gap:5px;align-items:center;color:#89a18d}.toggle input{accent-color:#a5c488}#fps{margin-left:auto;color:#68866f;white-space:nowrap}.icon-button{background:none;color:#9aba9e;border:0;white-space:nowrap}.controls{padding:28px 27px}.controls .eyebrow{font-size:8px;letter-spacing:1.7px;margin-bottom:12px}h2{font-weight:500;font-size:24px;line-height:1.5;margin:0 0 25px}.controls h2{font-size:21px;margin-bottom:25px}.control-group{margin-bottom:23px}.control-label{display:flex;align-items:center;gap:12px;font-size:9px;color:#9cac92;margin-bottom:12px}.control-label span{font-size:11px;color:#50634d}.source-buttons{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #ccd6c7;border-radius:4px;overflow:hidden}.source-buttons button{border:0;background:transparent;color:#6e7d64;font-size:10px;padding:10px 2px}.source-buttons .selected{background:#284532;color:#f4f6df}.status{font-size:10px;line-height:1.65;color:#7b8973;margin:10px 0 0;min-height:16px}.status.error{color:#a14026}audio{width:100%;height:32px;margin-top:10px}.mode-buttons{display:flex;gap:7px}.mode-buttons button{background:#f1f3e9;border:1px solid #d1d8c8;border-radius:4px;flex:1;font-size:10px;color:#77856b;padding:10px 3px}.mode-buttons span{display:block;font-size:21px;margin-bottom:7px}.mode-buttons .selected{border-color:#8d9f73;background:#e5ead8;color:#3c5c36}.range-group label{display:flex;justify-content:space-between;font-size:11px;color:#54664b;margin:14px 0 9px}.range-group output{font-family:Consolas,monospace;color:#788e67}input[type=range]{width:100%;accent-color:#688153;height:4px;margin:6px 0 12px}.twin{display:grid;grid-template-columns:1fr 1fr;gap:15px}.twin label{font-size:10px;color:#77866e}.twin select{display:block;background:transparent;border:0;border-bottom:1px solid #cbd4c3;padding:10px 0;font-size:11px;color:#314b2d;width:100%;border-radius:0}.meter{padding-top:14px;border-top:1px solid #dce0d2}.meter>div:first-child{display:flex;justify-content:space-between;font-size:10px;color:#7a8a6d}.meter strong{font-family:Consolas,monospace;font-weight:400}.bars{height:32px;display:flex;gap:7px;align-items:flex-end;margin-top:10px}.bars i{flex:1;background:#9dae7c;min-height:2px;border-radius:1px}.meter-scale{display:flex;justify-content:space-between;font-size:8px;color:#9aa78e;margin-top:7px}.status-strip{display:flex;justify-content:space-between;font-size:9px;gap:12px;color:#8a9680;padding:17px 2px}.status-strip b{font-weight:400;color:#5c7050;margin-left:7px}.status-strip small{font-size:8px;margin-left:6px}.status-strip i{margin-right:7px;background:#799767}.principle{padding:75px 0;display:grid;grid-template-columns:1.25fr 1.2fr .7fr;gap:50px;border-bottom:1px solid #cdd4c9;scroll-margin-top:30px}.principle p{font-size:12px;line-height:1.95;color:#7b8874}.principle h2{font-size:31px;margin-bottom:19px}.formula,.signal-flow{padding-top:5px}.formula>span,.signal-flow>span{font:9px Consolas,monospace;letter-spacing:2px;color:#9baa8b}.formula p{font:italic 24px Georgia,serif;color:#496442;margin:27px 0}.formula small{font-size:9px;color:#8b9780}.signal-flow>div{display:flex;flex-direction:column;font-size:11px;line-height:2.1;margin-top:26px;color:#607b56}.signal-flow b{font-size:14px;color:#b1bba1;font-weight:400}.build{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:65px 0}.build h2{font-size:30px;margin-bottom:20px}.build p{font-size:12px;color:#7b8874;line-height:2}.build p.muted{font-size:10px;color:#9aa38e}.build-stamp{border:1px solid #9eb08a;border-radius:50%;width:160px;height:160px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-10deg);color:#7c9566;gap:10px}.build-stamp span{font-size:8px;letter-spacing:1px}.build-stamp strong{font:38px Georgia,serif}footer{display:flex;justify-content:space-between;border-top:1px solid #cdd4c9;margin:0 5vw;padding:25px 0;font-size:9px;color:#99a38d}button:hover{filter:brightness(1.07)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #b89c51;outline-offset:4px}@media(max-width:950px){header{gap:20px}.wordmark,.project-tag{display:none}.studio{grid-template-columns:minmax(0,1.25fr) minmax(280px,1fr)}.visual-footer{gap:8px;padding:10px}.icon-button{display:none}.principle{gap:25px}.canvas-wrap{min-height:440px}}@media(max-width:680px){header{height:70px}nav{gap:17px;font-size:10px}.brand{font-size:19px}.brand-icon{font-size:30px}.intro{padding:32px 0}.intro-note{display:none}h1{font-size:36px}.lede{font-size:11px}.studio{grid-template-columns:1fr}.canvas-wrap{min-height:380px}.controls{padding:25px}.status-strip{flex-wrap:wrap;justify-content:flex-start;gap:10px 25px}.principle{grid-template-columns:1fr;padding:45px 0;gap:25px}.principle h2 br{display:none}.signal-flow{display:none}.formula p{font-size:25px}.build{padding:40px 0}.build-stamp{width:95px;height:95px}.build-stamp strong{font-size:25px}.build-stamp span{font-size:6px}.build h2{font-size:23px}footer{gap:20px;font-size:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
