:root{--ink:#102a2b;--paper:#f1eee5;--deep:#dfdbcf;--lime:#c8f24b;--orange:#ff5c35;--muted:#617071;--line:rgba(16,42,43,.18)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"Noto Sans TC",sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}.shell{width:min(1240px,calc(100% - 64px));margin:auto}.nav{height:84px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:9px;font:800 15px monospace}.brand i{width:13px;height:13px;border-radius:50%;background:var(--orange);box-shadow:inset 0 0 0 4px var(--ink)}.brand small{color:var(--muted);font-size:9px}.nav-links{display:flex;gap:30px;font:700 11px monospace}.nav-cta,.primary{background:var(--ink);color:white;padding:14px 18px;font:700 11px monospace}.hero{min-height:680px;display:grid;grid-template-columns:1fr 1.05fr;border-bottom:1px solid var(--line)}.hero-copy{padding:70px 55px 65px 0;border-right:1px solid var(--line);display:flex;flex-direction:column}.eyebrow{display:flex;justify-content:space-between;font:700 9px monospace;color:var(--muted)}.hero h1{margin:58px 0 30px;font-size:clamp(68px,7.5vw,112px);line-height:.85;letter-spacing:-.08em}.hero h1 span{color:var(--orange)}.hero-copy>p{max-width:500px;color:#405657;font-size:17px;line-height:1.75}.primary{margin-top:auto;width:190px;display:flex;justify-content:space-between}.primary b{color:var(--lime)}.hero-rig{position:relative;overflow:hidden;background:#dedacd}.grid,.stage-grid{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:44px 44px}.hero-coil{position:absolute;z-index:3;left:50%;top:19%;width:150px;height:120px;transform:translateX(-50%);border:7px solid var(--ink);background:var(--orange);display:flex;align-items:center;justify-content:center;gap:7px}.hero-coil span{position:absolute;bottom:6px;right:8px;color:white;font:700 8px monospace}.hero-coil i{width:9px;height:76px;border:3px solid var(--ink);border-radius:50%}.hero-plunger{position:absolute;z-index:2;left:calc(50% - 19px);top:calc(19% + 118px);width:38px;height:132px;background:#aeb3ae;border:6px solid var(--ink)}.hero-key{position:absolute;z-index:4;left:calc(50% - 60px);top:56%;width:120px;height:80px;display:grid;place-items:center;background:var(--paper);border:6px solid var(--ink);box-shadow:0 17px 0 var(--ink);font:800 30px monospace}.hero-base{position:absolute;left:12%;right:12%;top:calc(56% + 105px);height:7px;background:var(--ink)}.hero-callout{position:absolute;display:flex;gap:9px;font:700 9px/1.5 monospace}.hero-callout b{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:var(--lime)}.c1{left:7%;top:21%}.c2{right:5%;top:49%}.principle{background:var(--ink);color:white}.principle-inner{min-height:200px;display:grid;grid-template-columns:180px 1fr 280px;gap:30px;align-items:center}.principle-inner>span,.routes header>span,.dark-head span,.anatomy-head span,.roadmap header>span{font:700 9px monospace;letter-spacing:.12em;text-transform:uppercase}.principle p{margin:0;color:#bdc8c7;line-height:1.7}.principle p b{color:var(--lime)}.principle code{border:1px solid #4c6262;padding:18px;color:var(--lime);font-size:10px}.routes{padding:120px 0}.routes>header{display:grid;grid-template-columns:180px 1fr 300px;align-items:end;margin-bottom:60px}.routes h2,.dark-head h2,.anatomy-head h2,.roadmap h2{margin:0;font-size:clamp(46px,5vw,74px);line-height:.95;letter-spacing:-.06em}.routes header p,.dark-head p,.anatomy-head p{margin:0;color:var(--muted);line-height:1.7}.route-list{border-top:1px solid var(--ink)}.route-list article{min-height:140px;display:grid;grid-template-columns:70px 1fr 230px;align-items:center;border-bottom:1px solid var(--line)}.route-list article>b{color:var(--orange);font:700 10px monospace}.route-list h3{margin:0;font-size:24px}.route-list h3 em{margin-left:10px;border:1px solid;padding:4px 6px;font:700 8px monospace;font-style:normal}.route-list p{color:var(--muted)}.route-list strong{font:700 10px monospace}.lab{padding:120px 0 80px;background:var(--ink);color:white}.dark-head{display:grid;grid-template-columns:1fr 330px;align-items:end;gap:60px;margin-bottom:60px}.dark-head span{display:block;color:var(--lime);margin-bottom:20px}.dark-head p{color:#9cacaa}.lab-grid{display:grid;grid-template-columns:.85fr 1.15fr .85fr;border:1px solid #516464}.controls,.rig-panel,.console{padding:25px}.rig-panel{border-left:1px solid #516464;border-right:1px solid #516464}.controls label{display:block;padding:10px 0 22px;border-bottom:1px solid #314849}.controls label span{display:flex;justify-content:space-between;font:700 9px monospace}.controls output{color:var(--lime)}input[type=range]{width:100%;margin-top:17px;accent-color:var(--lime)}.weight-box{padding:20px 0;border-bottom:1px solid #314849}.weight-box>div:first-child{display:flex;justify-content:space-between;align-items:end;font:700 10px monospace}.weight-box output{font-size:30px;color:var(--lime)}.weight-box output small{font-size:9px}.presets{display:flex;gap:4px;align-items:center;margin-top:12px}.presets span{margin-right:auto;color:#879695;font:700 7px monospace}.presets button{border:1px solid #526666;background:transparent;color:#aebcba;padding:5px;font:700 7px monospace}.presets button.active{background:var(--lime);color:var(--ink)}.force-data{display:grid;grid-template-columns:repeat(3,1fr)}.force-data span{padding:13px 5px;border-right:1px solid #314849;font:700 9px monospace}.force-data span:last-child{border:0}.force-data small{display:block;color:#819190;font-size:6px;margin-bottom:6px}.panel-head{display:flex;justify-content:space-between;color:#a6b4b3;font:700 8px monospace}.panel-head b{color:var(--lime)}.rig-view{position:relative;height:310px;margin-top:18px;background:#163536;overflow:hidden}.rig-view:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff10 1px,transparent 1px),linear-gradient(90deg,#ffffff10 1px,transparent 1px);background-size:25px 25px}.sim-coil{position:absolute;z-index:3;left:calc(50% - 43px);top:43px;width:86px;height:66px;display:grid;place-items:center;background:var(--orange);border:5px solid #081c1d;font:800 9px monospace}.sim-pin{position:absolute;z-index:2;left:calc(50% - 11px);top:104px;width:22px;height:85px;background:#b8beb7;border:4px solid #081c1d}.sim-key{position:absolute;z-index:4;left:calc(50% - 43px);top:180px;width:86px;height:55px;display:grid;place-items:center;background:var(--paper);color:var(--ink);border:5px solid #081c1d;box-shadow:0 11px 0 #081c1d;font:800 20px monospace}.sim-key.down{transform:translateY(8px);box-shadow:0 3px 0 #081c1d}.sim-pin.down{transform:translateY(8px)}.sim-pcb{position:absolute;left:18%;right:18%;top:255px;height:8px;background:var(--lime)}.flux{position:absolute;left:50%;top:35px;transform:translateX(-50%);border:2px solid var(--orange);border-radius:50%}.f1{width:170px;height:170px}.f2{width:230px;height:230px;top:7px;opacity:.5}.meters{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}.meters span{display:flex;justify-content:space-between;color:#9aacab;font:700 7px monospace}.meters i{display:block;height:4px;margin-top:7px;background:#ffffff1c}.meters em{display:block;height:100%;background:var(--lime);transition:width .2s}.console{display:flex;flex-direction:column}.console-text{min-height:90px;margin-top:20px;padding:18px 0;border-top:1px solid #516464;border-bottom:1px solid #516464;color:var(--lime);font:700 18px/1.6 monospace}.console-text i{animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}.mini-keys{display:flex;flex-wrap:wrap;gap:5px;margin:22px 0}.mini-keys span{min-width:28px;height:28px;display:grid;place-items:center;border:1px solid #536565;font:700 7px monospace}.mini-keys span.hit{background:var(--orange)}.console>button,.cutaway>button{margin-top:auto;border:0;background:var(--lime);color:var(--ink);padding:14px;display:flex;justify-content:space-between;font:800 9px monospace}.anatomy{padding:120px 0;background:#d7d3c6}.anatomy-shell{width:min(1420px,calc(100% - 64px));margin:auto}.anatomy-head{display:grid;grid-template-columns:1fr 370px;gap:70px;align-items:end;margin-bottom:50px}.anatomy-head>div>span{display:block;color:var(--orange);margin-bottom:20px}.toolbar{min-height:62px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid;border-bottom:1px solid var(--line)}.toolbar>div{display:flex;align-items:center;gap:5px}.toolbar button{border:1px solid var(--ink);background:transparent;padding:8px 11px;font:700 8px monospace}.toolbar .active{background:var(--ink);color:var(--lime)}.toolbar span{margin-right:6px;color:var(--muted);font:700 7px monospace}#pulseKey{background:var(--lime)}.anatomy-grid{display:grid;grid-template-columns:minmax(0,1fr) 370px;border-bottom:1px solid}.keyboard-stage{position:relative;min-height:820px;overflow:hidden;background:#c9c5b7;perspective:1300px;touch-action:none;cursor:grab}.keyboard-stage:active{cursor:grabbing}.keyboard-assembly{position:absolute;left:50%;top:49%;width:790px;height:286px;transform:translate(-50%,-50%) rotateX(58deg) rotateZ(-24deg);transform-style:preserve-3d;transition:transform .65s}.layer{position:absolute;inset:0;border:5px solid var(--ink);transform-style:preserve-3d;transition:transform .75s}.layer>span{position:absolute;left:12px;top:9px;font:800 7px monospace}.shell-layer{background:#395657;box-shadow:0 7px 0 #284647,0 14px 0 #173435,0 22px 0 #0b2425;transform:translateZ(-18px)}.screws{position:absolute;inset:20px;background:radial-gradient(circle at 0 0,#b3b9b0 0 6px,var(--ink) 7px 9px,transparent 10px),radial-gradient(circle at 100% 0,#b3b9b0 0 6px,var(--ink) 7px 9px,transparent 10px),radial-gradient(circle at 0 100%,#b3b9b0 0 6px,var(--ink) 7px 9px,transparent 10px),radial-gradient(circle at 100% 100%,#b3b9b0 0 6px,var(--ink) 7px 9px,transparent 10px)}.pcb-layer{inset:10px;background:#557357;transform:translateZ(-6px);overflow:hidden;box-shadow:0 6px 0 #2c4933}.traces{position:absolute;inset:45px 50px;background:repeating-linear-gradient(0deg,transparent 0 24px,var(--lime) 25px 27px),repeating-linear-gradient(90deg,transparent 0 50px,#aecf5d 51px 53px)}.pcb-layer i{position:absolute;width:42px;height:28px;background:#153233;border:2px solid var(--lime)}.pcb-layer i:nth-of-type(1){right:60px;top:48px}.pcb-layer i:nth-of-type(2){right:125px;top:48px}.pcb-layer i:nth-of-type(3){left:90px;bottom:45px}.pcb-layer i:nth-of-type(4){left:150px;bottom:45px}.coil-layer{inset:13px;padding:38px 20px 18px;background:var(--orange);transform:translateZ(7px);box-shadow:0 7px 0 #a63820}.coil-layer>div{height:100%;display:grid;grid-template-columns:repeat(10,1fr);gap:8px}.coil-layer i{position:relative;border:3px solid var(--ink);border-radius:50%;background:#ddd9ce;box-shadow:inset 0 0 0 5px var(--orange),inset 0 0 0 8px #763323}.coil-layer i:after{content:"";position:absolute;left:50%;top:-9px;width:4px;height:20px;background:var(--ink)}.plate-layer{inset:8px;background-color:#a6aaa1;background-image:radial-gradient(var(--ink) 1.5px,transparent 1.5px);background-size:17px 17px;transform:translateZ(18px);box-shadow:0 5px 0 #606a64,inset 0 0 0 7px #c8cac4}.keys-layer{padding:17px;border-color:transparent;transform:translateZ(31px);display:flex;flex-direction:column;gap:5px;pointer-events:none}.key-row{display:flex;flex:1;gap:5px}.key-row button{min-width:0;padding:0;border:3px solid var(--ink);background:#f3f0e8;box-shadow:0 3px 0 #c8c3b7,0 6px 0 var(--ink);font:800 7px monospace;pointer-events:auto;transition:.18s}.key-row button:hover{background:var(--lime);transform:translateZ(5px)}.key-row button.selected{background:var(--orange);color:white;box-shadow:0 4px 0 var(--ink),0 0 0 3px var(--lime);transform:translateZ(11px)}.key-row button.pressing{animation:keyPress .55s}@keyframes keyPress{45%,65%{transform:translateZ(-3px);box-shadow:0 1px 0 var(--ink),0 0 0 3px var(--lime)}}.keyboard-assembly.exploded .shell-layer{transform:translateZ(-165px)}.keyboard-assembly.exploded .pcb-layer{transform:translateZ(-90px)}.keyboard-assembly.exploded .coil-layer{transform:translateZ(-14px)}.keyboard-assembly.exploded .plate-layer{transform:translateZ(68px)}.keyboard-assembly.exploded .keys-layer{transform:translateZ(146px)}.dimensions{position:absolute;left:18px;top:34%;display:flex;flex-direction:column;gap:16px;opacity:0;transition:.3s}.dimensions.show{opacity:1}.dimensions span{padding:5px 7px;border-left:2px solid var(--orange);background:#f1eee5d9;font:700 6px monospace}.drag-tip{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);padding:8px 12px;background:var(--ink);color:white;font:700 8px monospace}.detail-panel{padding:22px;background:var(--paper);border-left:1px solid}.target{height:140px;padding:18px;background:var(--ink);color:white}.target small,.target strong,.target span{display:block}.target small{color:var(--lime);font:700 7px monospace}.target strong{margin-top:10px;font:800 54px/.9 monospace}.target span{margin-top:8px;color:#99aaa8;font-size:9px}.cutaway{margin-top:15px;border:1px solid;background:#d9d5c9}.cutaway>header{height:36px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid;font:700 7px monospace}.cutaway>header b{color:var(--orange)}.cut-scene{position:relative;height:310px;overflow:hidden;background-image:linear-gradient(#102a2b17 1px,transparent 1px),linear-gradient(90deg,#102a2b17 1px,transparent 1px);background-size:20px 20px}.cut-scene:before{content:"";position:absolute;left:50%;top:10px;bottom:10px;border-left:1px dashed #102a2b55}.cut-key{position:absolute;z-index:5;left:calc(50% - 39px);top:22px;width:78px;height:47px;display:grid;place-items:center;background:#f5f1e8;border:4px solid;border-radius:7px;box-shadow:inset 0 -7px 0 #cbc6ba,0 5px 0 var(--ink);font:800 14px monospace;transition:.22s}.stem{position:absolute;z-index:4;left:calc(50% - 13px);top:68px;width:26px;height:47px;background:var(--lime);border:4px solid;transition:.22s}.spring{position:absolute;z-index:3;left:calc(50% - 23px);top:104px;width:46px;height:59px;border-left:5px solid;border-right:5px solid;background:repeating-linear-gradient(160deg,transparent 0 8px,#687878 9px 12px,transparent 13px 20px);transition:.22s}.plunger{position:absolute;z-index:4;left:calc(50% - 9px);top:143px;width:18px;height:61px;background:#aeb4ae;border:4px solid;transition:.22s}.coil-detail{position:absolute;z-index:2;left:calc(50% - 42px);top:169px;width:84px;height:77px;padding:9px;display:flex;align-items:center;gap:3px;background:var(--orange);border:5px solid}.coil-detail i{width:7px;height:46px;border:2px solid #5c2b22;border-radius:50%}.coil-detail b{position:absolute;right:4px;bottom:2px;color:white;font:700 6px monospace}.hall{position:absolute;z-index:4;left:calc(50% + 55px);top:205px;background:var(--ink);color:white;padding:7px;font:700 6px monospace}.board-detail{position:absolute;left:28px;right:28px;bottom:22px;height:13px;background:#4c6f51;border:3px solid}.field{position:absolute;left:50%;top:135px;transform:translateX(-50%);border:2px solid var(--orange);border-radius:50%}.fa{width:130px;height:130px}.fb{width:184px;height:156px;top:122px;opacity:.55}.cut-scene label{position:absolute;z-index:7;padding-bottom:3px;border-bottom:1px solid;font:700 6px monospace}.l-key{left:12px;top:40px}.l-spring{right:10px;top:113px}.l-coil{left:12px;top:197px}.l-sensor{right:8px;top:244px}.ruler{position:absolute;right:21px;top:28px;height:104px;padding:43px 6px 0 0;border-right:2px solid var(--orange);font:700 6px monospace}.cutaway.firing .cut-key,.cutaway.firing .stem{transform:translateY(17px)}.cutaway.firing .spring{height:42px;transform:translateY(17px)}.cutaway.firing .plunger{transform:translateY(13px)}.cutaway.firing .coil-detail{filter:drop-shadow(0 0 9px #ff5c35)}.cut-data{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid}.cut-data span{padding:9px 7px;border-right:1px solid var(--line)}.cut-data small,.cut-data b{display:block}.cut-data small{color:var(--muted);font:700 6px monospace;margin-bottom:5px}.cut-data b{font:800 8px monospace}.cutaway>button{width:100%;margin:0}.layers-list{padding:0;margin:20px 0 0;list-style:none}.layers-list li{min-height:63px;display:grid;grid-template-columns:25px 1fr 14px;align-items:center;border-bottom:1px solid var(--line)}.layers-list li>b{color:var(--orange);font:700 8px monospace}.layers-list span{color:var(--muted);font-size:8px}.layers-list strong{display:block;color:var(--ink);font-size:11px;margin-bottom:4px}.layers-list i{width:12px;height:12px;border:2px solid}.layers-list li:nth-child(1) i{background:white}.layers-list li:nth-child(2) i{background:#aaa}.layers-list li:nth-child(3) i{background:var(--orange)}.layers-list li:nth-child(4) i{background:#557357}.layers-list li:nth-child(5) i{background:#395657}.roadmap{padding:120px 0;display:grid;grid-template-columns:1fr 1.25fr;gap:80px}.roadmap header>span{display:block;margin-bottom:20px}.phases{border-top:1px solid}.phases article{min-height:130px;padding:24px 0;display:grid;grid-template-columns:50px 1fr;border-bottom:1px solid var(--line)}.phases article>b{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:var(--ink);color:var(--lime);font:700 9px monospace}.phases small{color:var(--orange);font:700 7px monospace}.phases h3{margin:7px 0;font-size:22px}.phases p{margin:0;color:var(--muted)}footer{padding:55px 0;background:var(--ink);color:white}footer .shell{display:flex;align-items:center;justify-content:space-between}footer p{color:#9aacab;font:700 9px monospace}footer a{color:var(--lime);font:700 9px monospace}
@media(max-width:980px){.shell,.anatomy-shell{width:min(760px,calc(100% - 40px))}.nav-links{display:none}.hero{grid-template-columns:1fr}.hero-copy{min-height:580px;border:0}.hero-rig{min-height:580px}.principle-inner{grid-template-columns:1fr;padding:45px 0}.routes>header,.dark-head,.anatomy-head{grid-template-columns:1fr;gap:25px}.lab-grid{grid-template-columns:1fr 1fr}.console{grid-column:1/-1;min-height:320px}.anatomy-grid{grid-template-columns:1fr}.keyboard-stage{min-height:650px}.keyboard-assembly{width:min(690px,calc(100vw - 70px));height:250px}.detail-panel{border-left:0;border-top:1px solid;display:grid;grid-template-columns:230px 1fr;gap:20px}.target{grid-column:1}.cutaway{grid-column:2;grid-row:1/3;margin:0}.layers-list{grid-column:1;margin:0}.roadmap{grid-template-columns:1fr}}
@media(max-width:650px){.shell,.anatomy-shell{width:calc(100% - 30px)}.nav{height:70px}.nav-cta{display:none}.hero-copy{padding-right:0;min-height:540px}.hero h1{font-size:62px}.principle-inner{gap:18px}.routes,.lab,.anatomy,.roadmap{padding-top:80px;padding-bottom:80px}.route-list article{grid-template-columns:42px 1fr;padding:20px 0}.route-list strong{grid-column:2}.lab-grid{grid-template-columns:1fr}.rig-panel{border:0;border-top:1px solid #516464}.console{grid-column:auto}.toolbar{padding:14px 0;align-items:flex-start;gap:12px;flex-direction:column}.toolbar>div{flex-wrap:wrap}.keyboard-stage{min-height:490px}.keyboard-assembly{width:calc(100vw - 56px);height:180px}.detail-panel{display:block}.cutaway{margin-top:15px}.layers-list{margin-top:20px}.roadmap{gap:40px}footer .shell{align-items:flex-start;gap:20px;flex-direction:column}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}