@charset "UTF-8";
:root{--paper:#fffdf7;--ink:#193c40;--muted:#5d7374;--teal:#167b75;--yellow:#ffcf39;--line:#dfe5dc;--radius:30px;--max:1240px;font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;scroll-behavior:smooth;scroll-padding-top:100px}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit;text-decoration:none}button{color:inherit;cursor:pointer}img{max-width:100%;height:auto;display:block}figure,p,h1,h2,h3{margin:0}h1,h2,h3{letter-spacing:-.045em}p{line-height:1.85}button,summary,a{touch-action:manipulation}a,button,summary{outline-offset:6px}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #216fd3}button:disabled{cursor:default}[hidden]{display:none!important}.wrap{width:min(var(--max),calc(100% - 112px));margin-inline:auto}.section-space{padding-block:110px}.skip-link{position:fixed;top:12px;left:16px;transform:translateY(-160%);background:var(--ink);color:white;padding:14px;z-index:100}.skip-link:focus{transform:none}.header{position:sticky;top:0;z-index:30;background:rgba(255,253,247,.95);border-bottom:1px solid rgba(25,60,64,.07);backdrop-filter:blur(16px)}.nav-wrap{max-width:1440px;padding:22px 56px;margin:auto;display:flex;justify-content:space-between;align-items:center;gap:25px}.brand{display:flex;align-items:center;gap:10px;font-size:27px;font-weight:800;letter-spacing:.04em;flex-shrink:0}.brand img{border-radius:11px}.brand>span{display:flex;align-items:baseline;gap:11px}.brand-en{font-size:11px;letter-spacing:.12em;font-weight:650}.header nav{display:flex;align-items:center;gap:35px;font-size:14px;font-weight:600}.header nav>a{position:relative;transition:color .2s}.header nav>a:not(.nav-cta):after{content:"";position:absolute;bottom:-7px;left:0;width:100%;height:2px;transform:scaleX(0);transform-origin:left;background:var(--teal);transition:transform .2s}.header nav>a:hover:after{transform:scaleX(1)}.header nav>a:hover{color:var(--teal)}.nav-cta{padding:12px 20px;border:1px solid var(--ink);border-radius:50px;display:flex;gap:23px}.menu-toggle{display:none}.hero{position:relative;min-height:760px;display:grid;grid-template-columns:.98fr 1.16fr;align-items:center;padding-top:50px;padding-bottom:120px;gap:5px}.eyebrow{font-size:13px;font-weight:650;letter-spacing:.05em;display:flex;align-items:center;gap:10px}.tiny-sun{font-size:25px;color:var(--teal)}h1{font-size:clamp(44px,4.5vw,66px);line-height:1.45;font-weight:850;margin:23px 0 24px;white-space:nowrap}.underlined{position:relative;z-index:1;display:inline-block}.underlined:after{content:"";position:absolute;height:.14em;left:0;right:0;bottom:.13em;background:var(--yellow);z-index:-1;transform:rotate(-2deg);border-radius:40%}.hero-lead{font-size:18px;color:var(--muted);line-height:1.9}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:33px}.button{border:0;min-height:56px;padding:16px 25px;border-radius:100px;font-size:16px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:39px;transition:transform .2s,box-shadow .2s}.primary{background:var(--yellow);color:var(--ink);box-shadow:0 3px 0 #ddaf23}.primary:hover{transform:translateY(-3px);box-shadow:0 6px 0 #ddaf23}.text-link{font-weight:650;font-size:14px;display:inline-flex;gap:12px;align-items:center;min-height:46px}.text-link:hover{color:var(--teal)}.play-icon{font-size:25px;line-height:1}.hero-note{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted);margin-top:32px;white-space:nowrap}.dot,.tag-dot,.live-dot{width:7px;height:7px;border-radius:100%;background:var(--teal);display:inline-block;flex-shrink:0}.note-separator{margin:0 2px;color:#9baaa5}.mobile-break,.only-mobile{display:none}.hero-scene{position:relative;min-width:0;align-self:stretch;display:flex;align-items:center;justify-content:center;isolation:isolate}.hero-scene:before{content:"";position:absolute;width:92%;aspect-ratio:1;background:#eaf3eb;border-radius:48% 52% 58% 42%/50% 42% 58% 50%;z-index:-2;transform:rotate(-12deg);top:8%}.crane{width:115%;max-width:none;mix-blend-mode:multiply;transform:rotate(-5deg);position:relative;z-index:1}.scene-orbit{position:absolute;border:1px dashed #a6bbb0;border-radius:50%;z-index:-1;width:105%;height:54%;transform:rotate(-35deg);top:22%;left:-5%}.orbit-two{width:88%;height:90%;transform:rotate(28deg);top:4%;left:7%;opacity:.4}.scene-plus{position:absolute;right:-1%;top:10%;font-size:58px;line-height:1;font-weight:350;transform:rotate(15deg);color:var(--teal)}.scene-tag{position:absolute;left:5%;top:5%;border:1px solid #e0e7df;box-shadow:0 8px 25px #183f4010;border-radius:14px;background:#fffefb;padding:13px 17px;font-size:12px;display:flex;align-items:center;gap:7px;z-index:3;transform:rotate(-6deg)}.scene-tag strong{font-weight:750}.tag-dot{background:var(--yellow);width:9px;height:9px}.hero-scene figcaption{position:absolute;bottom:8%;right:2%;font-size:11px;padding:12px 15px;background:#fffdf7;border-radius:30px;box-shadow:0 6px 20px #173e4010;z-index:3;display:flex;align-items:center;gap:8px}.hero-scene figcaption>span:last-child{margin-left:12px;font-size:18px}.scroll-cue{position:absolute;bottom:32px;left:0;font-size:10px;letter-spacing:.12em;color:var(--muted);display:flex;align-items:center;gap:13px}.scroll-cue span{border:1px solid var(--line);border-radius:50%;height:38px;width:30px;display:grid;place-items:center;font-size:17px}.intro-band{background:#e9f1e7;padding-block:86px}.intro-layout{display:grid;grid-template-columns:.5fr 1.4fr .7fr;gap:45px}.section-index{display:flex;align-items:center;gap:15px;font-size:12px;letter-spacing:.08em;font-weight:700;color:var(--teal);margin-bottom:24px}.section-index>span{font-weight:500;letter-spacing:.04em}.intro-layout .section-index{margin-top:14px}h2{font-size:clamp(30px,3.15vw,44px);font-weight:780;line-height:1.5}.teal-text{color:var(--teal)}.intro-body{font-size:15px;color:var(--muted);margin-top:27px;line-height:2}.idea-note{align-self:center;transform:rotate(5deg);background:#fff8d7;border-radius:4px;padding:28px;box-shadow:3px 9px 0 #d4e0cc;position:relative;text-align:center}.idea-note:before{content:"";position:absolute;top:-11px;left:50%;transform:translateX(-50%) rotate(-4deg);height:23px;width:75px;background:#d0dfc3aa}.idea-note svg{width:44px;height:44px;overflow:visible;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;margin-bottom:12px}.idea-note p{font-size:20px;font-weight:650}.idea-note>span{font-size:10px;color:var(--muted);display:block;margin-top:13px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;margin-bottom:42px}.section-heading>p{font-size:14px;color:var(--muted);line-height:1.9;margin-bottom:9px}.section-heading .section-index{margin-bottom:16px}.mode-switch{border-bottom:1px solid var(--line);display:flex;gap:32px;margin-bottom:40px}.mode-switch button{background:none;border:0;border-bottom:3px solid transparent;padding:15px 0 16px;display:flex;gap:12px;align-items:baseline;font-weight:700;font-size:17px}.mode-switch button span{font-size:11px;font-weight:500}.mode-switch button[aria-selected=true]{border-color:var(--teal);color:var(--teal)}.mode-switch button:hover{color:var(--teal)}.mode-panel{display:grid;grid-template-columns:.8fr 1.4fr;align-items:center;gap:50px;padding:35px 0 10px;animation:panel-in .3s ease-out}.mini-label{font-size:10px;font-weight:650;letter-spacing:.08em;text-transform:uppercase}.mode-description h3{font-size:31px;line-height:1.6;margin:15px 0}.mode-description>p{font-size:14px;color:var(--muted);max-width:300px}.check-list{list-style:none;padding:0;margin:21px 0 25px;display:grid;gap:12px;font-size:12px}.check-list li:before{content:"✓";color:var(--teal);font-weight:800;margin-right:10px}.image-label{color:#6e8280;font-size:10px}.app-device{padding:15px 10px 10px;border:2px solid #204d4e;background:#254c4d;border-radius:24px;box-shadow:0 21px 40px #173e4015;transform:rotate(1deg);position:relative}.app-device .camera-dot{position:absolute;width:4px;height:4px;background:#e3e7da;border-radius:50%;top:5px;left:50%}.app-device img{border-radius:13px}.parts-section{background:#f1f2ec}.parts-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.part-card{min-width:0;border-radius:20px;background:#fffdf7;padding:23px 21px 20px;border:1px solid #e2e6dc;transition:transform .2s}.part-card:hover{transform:translateY(-6px)}.part-number{font-size:10px;letter-spacing:.06em;color:var(--muted)}.part-card img{width:100%;mix-blend-mode:multiply;margin:10px 0 12px;border-radius:10px}.part-bottom h3{font-size:20px;margin-bottom:6px;letter-spacing:-.02em}.part-bottom span{font-size:11px;color:var(--muted)}.asset-caption{font-size:10px;color:#697c77;text-align:right;margin:16px 0 0}.principles{margin-top:58px;display:grid;grid-template-columns:repeat(3,1fr);gap:42px;padding-top:40px;border-top:1px solid #d7dfd4}.principle-icon{width:38px;height:38px;display:grid;place-items:center;font-size:26px;margin-bottom:13px;color:var(--teal)}.principles h3{font-size:19px;letter-spacing:-.01em}.principles p{font-size:13px;color:var(--muted);max-width:260px;margin-top:10px}.experiment{display:grid;grid-template-columns:1fr 1.25fr;gap:80px;align-items:center}.experiment-copy>p:not(.section-index){color:var(--muted);font-size:15px;margin-top:20px}.experiment .button{margin-top:29px}.experiment-copy .demo-note{font-size:10px!important;margin-top:16px!important}.circuit-box{background:#edf3ec;border:1px solid #dfe8db;border-radius:var(--radius);padding:30px;position:relative}.circuit{display:block;width:100%;overflow:visible;margin-top:18px}.circuit-wire{fill:none;stroke:#718a83;stroke-width:7;stroke-linejoin:round}.terminal{fill:var(--yellow);stroke:var(--ink);stroke-width:3}.switch-arm{fill:none;stroke:var(--ink);stroke-width:7;stroke-linecap:round;transform-origin:264px 91px;transition:transform .3s}.battery-body{fill:var(--yellow);stroke:var(--ink);stroke-width:3}.battery-cap{fill:var(--ink)}.diagram-text{fill:var(--ink);font-size:25px;font-weight:650;text-anchor:middle}.diagram-label{font-size:17px;fill:#4c6864;text-anchor:middle}.lamp-bulb{fill:#fffdf7;stroke:#64817b;stroke-width:3;transition:fill .3s}.filament{fill:none;stroke:var(--ink);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.lamp-glow{fill:#ffe377;opacity:0;transition:opacity .3s}.current-flow{fill:none;stroke:#e5b11c;stroke-width:7;stroke-dasharray:10 12;opacity:0}.circuit-box.is-closed .switch-arm{transform:rotate(33.7deg)}.circuit-box.is-closed .lamp-bulb{fill:#ffdb57;stroke:#d5a620}.circuit-box.is-closed .lamp-glow{opacity:.45}.circuit-box.is-closed .current-flow{opacity:1;animation:current 1s linear infinite}.circuit-status{font-size:12px;display:flex;gap:9px;align-items:center;justify-content:center;min-height:32px}.status-dot{width:6px;height:6px;display:block;background:#7f9690;border-radius:50%;flex-shrink:0}.is-closed .status-dot{background:#b4820e}.parents-section{background:#173f41;color:#f9f9eb;position:relative;overflow:hidden}.parents-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:80px}.parents-section .section-index{color:#9ccdc0}.parents-heading>p:not(.section-index){font-size:15px;margin-top:28px;color:#b8cdc7}.parent-doodle{font-size:98px;line-height:1;display:inline-block;color:#ffcf39;margin-top:37px;transform:rotate(12deg)}.faq{border-top:1px solid #456363}.faq details{border-bottom:1px solid #456363}.faq summary{font-size:15px;font-weight:650;min-height:77px;padding:25px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:pointer}.faq summary::-webkit-details-marker{display:none}.faq summary>span{font-weight:300;font-size:23px;transition:transform .2s}.faq details[open] summary>span{transform:rotate(45deg)}.faq details>p{font-size:13px;color:#c4d5cf;line-height:2;padding:0 23px 26px 0}.download{padding-block:112px;text-align:center;position:relative}.download .eyebrow{justify-content:center;margin-bottom:21px;color:var(--teal)}.download h2{font-size:clamp(32px,4.1vw,58px)}.download>p:not(.eyebrow){font-size:14px;color:var(--muted);margin-top:16px}.download-mark{position:absolute;left:7%;top:115px;font-size:70px;line-height:1;color:var(--yellow);transform:rotate(-13deg)}.release-status{display:inline-flex;align-items:center;gap:11px;font-size:14px;font-weight:700;border:1px solid #b9cfc3;background:#ecf3e9;border-radius:50px;padding:15px 25px;margin-top:28px}.download .release-note{font-size:11px!important;margin-top:13px!important}.download .text-link{margin-top:23px}.footer{border-top:1px solid var(--line)}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:32px}.footer-top p{font-size:12px;color:var(--muted)}.footer-top>a:last-child{font-size:12px;min-height:44px;display:flex;gap:17px;align-items:center}.footer .brand{font-size:22px}.footer .brand-en{font-size:9px}.footer-bottom{border-top:1px solid var(--line);padding-block:22px;font-size:10px;display:flex;gap:25px;justify-content:space-between;color:#637a75}@keyframes current{to{stroke-dashoffset:-22}}@keyframes panel-in{from{opacity:.5;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1500px){.hero{min-height:810px}.hero-scene{margin-left:10px}.hero-copy{padding-top:0}}
@media(max-width:1100px){.wrap{width:calc(100% - 72px)}.nav-wrap{padding:20px 36px}.header nav{gap:23px}.hero{min-height:680px;padding-top:35px;padding-bottom:105px;grid-template-columns:1fr 1.1fr}.hero h1{font-size:48px}.hero-lead{font-size:16px}.hero-note{font-size:9px;gap:5px}.hero-actions{gap:20px}.hero-scene .scene-tag{font-size:10px;padding:11px;top:9%}.hero-scene figcaption{font-size:9px;bottom:12%;right:0}.section-space{padding-block:80px}.intro-layout{grid-template-columns:.38fr 1.2fr .7fr;gap:25px}.intro-layout h2{font-size:32px}.idea-note{padding:23px 18px}.idea-note p{font-size:17px}.idea-note>span{font-size:8px}.mode-panel{gap:30px;grid-template-columns:.8fr 1.2fr}.mode-description h3{font-size:28px}.parts-grid{gap:12px}.part-card{padding:18px 14px}.part-number{font-size:8px}.part-bottom span{font-size:10px}.experiment{gap:35px}.parents-layout{gap:50px}.download-mark{left:0;font-size:55px}.download{padding-block:85px}}
@media(max-width:800px){.header nav{gap:17px;font-size:12px}.brand{font-size:24px}.brand-en{display:none}.nav-cta{padding:11px 15px;gap:12px}.hero h1{font-size:41px}.hero-lead{font-size:15px}.hero .button{gap:20px;padding:15px 20px;min-height:53px;font-size:14px}.hero-actions{gap:14px}.text-link{font-size:12px}.hero-note{flex-wrap:wrap;font-size:9px}.hero{min-height:610px;gap:0}.scene-plus{font-size:42px}.hero-scene .scene-tag{top:12%;left:1%;display:block;font-size:9px;line-height:1.8;max-width:115px}.tag-dot{display:none}.hero-scene figcaption{bottom:13%;padding:9px;font-size:8px}.hero-scene figcaption>span:last-child{margin-left:0}.intro-layout{grid-template-columns:1fr .65fr;gap:30px}.intro-layout>.section-index{grid-column:1/-1;margin:0}.intro-layout h2{font-size:32px}.section-heading{gap:25px}.section-heading>p{font-size:12px}.mode-panel{gap:24px;grid-template-columns:.8fr 1.2fr}.mode-description h3{font-size:24px}.mode-description>p{font-size:12px}.check-list{font-size:11px;gap:9px}.image-label{font-size:9px}.app-device{border-radius:17px;padding:12px 7px 7px}.app-device img{border-radius:9px}.parts-grid{grid-template-columns:repeat(2,1fr);gap:20px}.part-card{padding:23px}.part-number{font-size:10px}.part-card img{margin:0}.part-bottom span{font-size:12px}.principles{gap:22px}.principles h3{font-size:17px}.principles p{font-size:12px}.experiment{grid-template-columns:.8fr 1.2fr;gap:25px}.circuit-box{padding:20px}.circuit-status{font-size:10px}.parents-layout{gap:30px}.parents-layout h2{font-size:29px}.faq summary{font-size:13px}.parents-heading>p:not(.section-index){font-size:13px}.footer-top p{max-width:230px;font-size:11px}.footer-bottom{font-size:9px}}
@media(max-width:640px){:root{scroll-padding-top:85px}.wrap{width:calc(100% - 40px)}.header{backdrop-filter:none;background:var(--paper)}.nav-wrap{padding:15px 20px}.brand{font-size:24px;gap:8px}.brand img{width:35px;height:35px;border-radius:9px}.brand-en{display:inline;font-size:9px}.menu-toggle{display:flex;align-items:center;gap:9px;background:transparent;border:1px solid #cbd7cd;border-radius:30px;min-height:44px;padding:10px 13px;font-size:12px}.menu-toggle svg{width:17px;height:17px;fill:none;stroke:var(--ink);stroke-width:1.7;stroke-linecap:round}.header nav{display:none;position:absolute;top:75px;left:12px;right:12px;background:var(--paper);border:1px solid var(--line);border-radius:20px;box-shadow:0 15px 25px #183d4015;padding:20px;align-items:stretch;gap:2px;flex-direction:column;font-size:15px}.header nav.is-open{display:flex}.header nav>a{min-height:49px;display:flex;align-items:center;padding:12px}.header nav>a:not(.nav-cta):after{display:none}.header .nav-cta{margin-top:8px;justify-content:space-between;padding:12px 18px}.hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding-top:38px;padding-bottom:82px;gap:0}.hero-copy{z-index:2}.hero .eyebrow{font-size:11px;gap:8px}.tiny-sun{font-size:22px}.hero h1{font-size:clamp(38px,10.2vw,56px);line-height:1.4;margin:20px 0 22px}.hero-lead{font-size:15px;line-height:1.9}.mobile-break{display:inline}.hero-actions{gap:27px;margin-top:26px}.hero .button{font-size:14px;gap:35px;padding:15px 23px;min-height:54px}.hero .text-link{font-size:13px}.hero-note{font-size:10px;gap:8px;margin-top:25px}.hero-scene{width:100%;height:330px;align-self:center;margin-top:25px;flex-shrink:0}.hero-scene:before{width:82%;top:2%;max-height:310px}.crane{width:107%;max-width:480px;margin-top:5px}.hero-scene .scene-tag{top:2%;left:0;max-width:none;padding:10px 14px;display:flex;font-size:10px}.hero-scene figcaption{bottom:0;right:0;font-size:9px;padding:10px 13px}.scene-plus{top:2%;right:0;font-size:44px}.hero-scene .scene-orbit{height:55%;top:23%;width:95%;left:1%}.hero-scene .orbit-two{height:95%;top:0;width:78%;left:10%}.scroll-cue{bottom:20px;font-size:9px}.scroll-cue span{height:32px;width:25px}.intro-band{padding-block:48px}.intro-layout{grid-template-columns:1fr;gap:22px}.section-index{font-size:11px;margin-bottom:19px;gap:12px}.intro-layout h2{font-size:29px}.intro-body{font-size:14px;line-height:2;margin-top:22px}.idea-note{justify-self:end;margin:5px 8px 0 0;transform:rotate(3deg);width:205px;padding:20px}.idea-note svg{position:absolute;left:15px;top:19px;width:29px;height:29px}.idea-note p{font-size:16px;margin-left:23px}.idea-note>span{font-size:9px}.section-space{padding-block:58px}h2{font-size:30px}.only-mobile{display:inline}.section-heading{display:block;margin-bottom:27px}.section-heading>p{font-size:13px;margin:17px 0 0}.mode-switch{margin-bottom:20px;gap:28px}.mode-switch button{font-size:16px;min-height:52px;padding:12px 0}.mode-panel{grid-template-columns:1fr;gap:29px;padding-top:20px}.mode-description h3{font-size:28px;margin:12px 0}.mode-description>p{font-size:14px;max-width:100%}.check-list{font-size:12px;margin:18px 0 20px;gap:11px}.image-label{font-size:10px}.app-device{transform:rotate(0);padding:12px 7px 7px;border-radius:17px}.parts-grid{gap:12px}.part-card{padding:17px 12px 18px;border-radius:16px}.part-card img{margin:8px 0 12px}.part-number{font-size:8px;letter-spacing:0}.part-bottom h3{font-size:18px}.part-bottom span{font-size:10px;display:block;line-height:1.7}.asset-caption{text-align:left;font-size:9px;margin-top:16px}.principles{grid-template-columns:1fr;margin-top:32px;padding-top:26px;gap:25px}.principles>div{padding-left:58px;position:relative}.principle-icon{position:absolute;left:0;top:0;background:#e5ebe0;border-radius:11px;font-size:24px}.principles h3{font-size:18px}.principles p{max-width:100%;font-size:13px;margin-top:6px}.experiment{grid-template-columns:1fr;gap:32px}.experiment h2{font-size:34px}.experiment-copy>p:not(.section-index){font-size:14px;margin-top:18px}.experiment .button{margin-top:22px;font-size:14px;gap:30px;min-height:54px}.circuit-box{padding:23px 18px;border-radius:22px}.circuit{margin-top:7px}.circuit-status{font-size:11px;line-height:1.8}.parents-layout{grid-template-columns:1fr;gap:34px}.parents-layout h2{font-size:29px}.parents-heading{position:relative}.parents-heading>p:not(.section-index){font-size:14px;margin-top:20px}.parent-doodle{position:absolute;right:5px;bottom:0;font-size:56px;margin:0}.faq summary{font-size:14px;min-height:74px;padding:22px 0}.faq details>p{font-size:13px;padding-right:12px}.download{padding-block:65px}.download h2{font-size:36px;line-height:1.5}.download .eyebrow{font-size:11px;margin-bottom:18px}.download>p:not(.eyebrow){font-size:12px;margin-top:16px}.download-mark{position:static;margin:0 0 24px;font-size:44px}.release-status{font-size:13px;padding:14px 22px;margin-top:24px}.download .release-note{font-size:10px!important}.footer-top{flex-wrap:wrap;gap:22px;padding-block:25px}.footer-top .brand{flex:1}.footer-top p{order:3;flex-basis:100%;max-width:none}.footer-top>a:last-child{font-size:11px}.footer-bottom{flex-direction:column;gap:7px;padding-block:19px;font-size:9px}}
@media(max-width:350px){.hero-actions{gap:17px}.hero .button{gap:22px}.hero-note{gap:5px;font-size:9px}.hero-scene{height:290px}.part-card{padding-inline:9px}.part-number{font-size:7px}.brand-en{display:none}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.primary:hover,.part-card:hover{transform:none}}
/* Keep blended source backgrounds continuous and touch targets comfortably sized. */
.hero-scene{background:var(--paper)}
.header nav>a{min-height:44px;display:flex;align-items:center}
.scroll-cue{min-height:44px}
@media(max-width:640px){.crane{width:100%;transform:rotate(-3deg)}}
/* Decorative orbits stay inside their illustration surface at every breakpoint. */
.hero-scene{overflow:clip}
.hero-scene:before{height:88%;width:90%;top:6%;max-height:none;aspect-ratio:auto}
.brand{min-height:44px}

/* Tactile presentation layer: static highlights and contact shadows, no new assets. */
.hero-scene { background: radial-gradient(ellipse at 52% 72%, #d4e3d945, transparent 63%), var(--paper); }
.hero-scene:before { background: radial-gradient(ellipse at 28% 18%, #f6faf0, #e7f0e8 55%, #d8e7dc); box-shadow: inset 1px 2px 2px #ffffff, inset -5px -8px 18px #75968112; }
.hero-scene figcaption, .scene-tag { border:1px solid #ffffff; background:linear-gradient(160deg,#fffefb,#f4f5eb); box-shadow:0 2px 1px #fff inset,0 6px 16px #294a3c14,0 1px 1px #38584025; }
.part-card { position:relative; background:linear-gradient(155deg,#fffef9 0%,#f5f5eb 68%,#e8ece0 100%); border:1px solid #fefef6; box-shadow:inset 0 -3px 0 #bdcbb930,0 2px 2px #42604714,0 12px 24px -18px #284e3b55; }
.part-card:before { content:""; position:absolute; inset:4px; border:1px solid #ffffff80; border-radius:16px; pointer-events:none; }
.part-card img { border-radius:13px; }
.app-device { background:linear-gradient(135deg,#577b75,#173d40 40%,#285453); box-shadow:inset 0 1px 1px #bbd1c1,0 2px 0 #123437,0 20px 36px -12px #153b4030; }
.primary { background:linear-gradient(165deg,#ffe98b,#ffd348 42%,#f8c323); box-shadow:inset 0 2px 0 #fff2b8,0 3px 0 #cda727,0 6px 12px #b9a33718; }
.primary:active { transform:translateY(2px); box-shadow:inset 0 1px 2px #bd8e2444,0 1px 0 #cda727; }
.circuit-box { background:radial-gradient(ellipse at 25% 5%,#f7faf0,#e6eee2 72%); border:1px solid #f9fbf2; box-shadow:inset 0 2px 1px #ffffff,inset 0 -4px 0 #b1c4ab40,0 2px 1px #abc2aa65,0 18px 36px -22px #244b3c45; padding:25px 20px 22px; }
.demo-topline { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 9px; }
.bench-stamp { font-size:7px;letter-spacing:.12em;color:#779080; }
.demo-loads { display:flex;gap:8px;margin-top:23px;flex-wrap:wrap; }
.demo-loads button { background:linear-gradient(#fffef8,#f0f2e7); border:1px solid #c3d1bd; box-shadow:inset 0 1px 0 white,0 2px 0 #cbd7c3; border-radius:12px;min-height:46px;padding:10px 15px;font-size:13px; }
.demo-loads button[aria-pressed=true] { background:linear-gradient(#2c7770,#185b55);color:#fffef5;border-color:#175950;box-shadow:inset 0 1px 1px #89b6a650,0 2px 0 #113f3b; }
.tactile-circuit { margin-top:17px; }
.tactile-circuit .wire-jacket { stroke:#254d49;stroke-width:10; }
.tactile-circuit .wire-sheen { stroke:#76978c;stroke-width:3;transform:translateY(-2px); }
.tactile-circuit .current-flow { stroke:#e6bb4b;stroke-width:4;stroke-dasharray:4 15;opacity:0; }
.tactile-circuit .terminal { stroke:#997c35;stroke-width:1.5; }
.contact-arm { transform:rotate(-33deg);transform-origin:254px 92px;transition:transform 220ms cubic-bezier(.2,.7,.3,1); }
.contact-closed .contact-arm { transform:rotate(0deg); }
.tactile-circuit .diagram-label { font-size:12px;fill:#456459; }
.tactile-circuit .switch-label { font-size:10px; }
.cell-detail { fill:#9c7a22;font-size:7px;font-weight:700;letter-spacing:.5px;text-anchor:middle; }
.tactile-circuit .filament { stroke:#728f78;stroke-width:2;transition:stroke 120ms,filter 120ms; }
.lamp-halo, .lamp-pool { opacity:0;transition:opacity 140ms ease-out; }
.lamp-glass { transition:fill 140ms,stroke 140ms; }
.motor-load { display:none; }
[data-load=motor] .motor-load { display:block; }
[data-load=motor] .lamp-load { display:none; }
.motor-rotor { transform-box:fill-box;transform-origin:center; }
.motor-power-dot { fill:#8daca0; }
.is-powered .motor-power-dot { fill:#ffd45c; }
.is-powered .lamp-halo { opacity:1; }
.is-powered .lamp-pool { opacity:.25; }
.is-powered .lamp-glass { fill:#ffe59b90;stroke:#c8a94b; }
.is-powered .filament { stroke:#ffad15;filter:drop-shadow(0 0 3px #ffbd36); }
.is-powered .current-flow { opacity:1;animation:demo-current 1.1s linear infinite; }
.causal-steps { display:flex;justify-content:center;gap:17px;margin:0 0 13px;font-size:10px;color:#71887c; }
.causal-steps>span { display:flex;gap:6px;align-items:center; }
.causal-steps b { width:19px;height:19px;border-radius:50%;display:grid;place-items:center;background:#d8e2d2;font-size:9px;font-weight:600; }
.contact-closed .step-contact, .is-powered .step-path, .is-powered .step-output { color:#316d57; }
.is-powered .causal-steps b { background:#e9d68d;box-shadow:inset 0 1px 0 #fff5b6; }
.circuit-status { min-height:43px;background:#fffdf65c;border:1px solid #ffffff80;border-radius:12px;padding:8px 10px;font-size:11px;line-height:1.7;text-align:center; }
.is-powered .status-dot { background:#bd942e; }
[data-state=closing] .status-dot { background:#57937b; }
[data-motion=paused] .current-flow { animation-play-state:paused; }
@keyframes demo-current { to { stroke-dashoffset:-38; } }
@media(max-width:800px) { .bench-stamp { display:none; }.causal-steps{gap:10px;font-size:9px}.circuit-box{padding:22px 15px 17px}.experiment{grid-template-columns:.85fr 1.2fr;gap:25px}.demo-loads button{padding:10px 12px;font-size:12px} }
@media(max-width:640px) { .experiment{grid-template-columns:1fr;gap:28px}.circuit-box{padding:22px 12px 17px}.demo-topline{padding:0 10px}.bench-stamp{display:inline;font-size:6px}.causal-steps{gap:12px;font-size:10px}.circuit-status{font-size:11px;min-height:48px}.demo-loads{gap:10px}.demo-loads button{min-height:46px;font-size:13px;padding-inline:16px}.part-card:before{border-radius:12px}.tactile-circuit{margin-top:10px} }
@media(prefers-reduced-motion:reduce) { .contact-arm,.lamp-halo,.lamp-pool,.lamp-glass,.tactile-circuit .filament{transition:none}.is-powered .current-flow{animation:none;stroke-dasharray:none}.primary:active{transform:none} }
/* Keep functional component labels readable after the SVG scales down on phones. */
.tactile-circuit .diagram-label{font-size:16px}
.tactile-circuit .switch-label{font-size:13px}
@media(max-width:640px){.tactile-circuit .diagram-label{font-size:20px}.tactile-circuit .switch-label{font-size:17px}.causal-steps{font-size:11px}}
/* One control beside its feedback, so phone users can see the result while tapping. */
.demo-controls{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:stretch}
.demo-controls .button{margin:0;font-size:13px;padding:12px 18px;gap:16px;min-height:50px;align-self:center}
.demo-controls .circuit-status{margin:0;min-height:50px}
.experiment-copy .demo-note{max-width:330px}
@media(max-width:640px){.demo-controls{gap:9px}.demo-controls .button{font-size:12px;padding:12px 15px;gap:12px}.demo-controls .circuit-status{font-size:10px;padding:7px 8px}.experiment-copy .demo-note{margin-top:20px!important}}
