:root{font-family:"Segoe UI",system-ui,sans-serif;color:#f4f6fc;background:#080d0c;font-synthesis:none;color-scheme:dark}
*{box-sizing:border-box}body{margin:0}button,select,a{-webkit-tap-highlight-color:transparent}button,select{font:inherit}a{color:inherit;text-decoration:none}button,a,select{touch-action:manipulation}button:focus-visible,a:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid #b8d7bb;outline-offset:5px}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}[hidden]{display:none!important}
.header{max-width:1440px;margin:auto;padding:30px 48px;display:flex;align-items:center;gap:32px;color:#b4c0d3;font-size:15px}.brand{font-size:31px;font-weight:700;letter-spacing:-1.7px;color:#f4f6fc}.brand span{color:#b8d7bb}.header>a:last-child{margin-left:auto}.header>a:last-child:hover{text-decoration:underline}
main{max-width:1440px;margin:auto}.hero{display:grid;grid-template-columns:38% 62%;padding:22px 28px 30px 48px;align-items:center;min-height:760px}.intro{padding:0 10px 120px 0;position:relative;z-index:3;pointer-events:none}.intro>*{pointer-events:auto}h1{font-size:clamp(42px,4.3vw,62px);font-weight:650;line-height:1.09;letter-spacing:-2.8px;margin:0 0 28px;white-space:nowrap}.lede{max-width:340px;color:#b4c0d3;font-size:19px;line-height:1.6;margin:0 0 30px}.primary{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border-radius:7px;background:#e6f7f3;color:#08221b;font-weight:650}.primary:hover{background:white}.intro-note{font-size:15px;line-height:1.6;color:#8392a5;margin-top:26px}
.board-area{min-width:0}.viewport{position:relative;height:490px;isolation:isolate}.viewport canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:pan-y pinch-zoom}.loading{position:absolute;left:12%;right:12%;top:45%;text-align:center;color:#b4c0d3;line-height:1.6;pointer-events:none}.caption{font-size:13px;line-height:1.6;color:#8d9aab;text-align:center;margin:4px 10px 20px}.controls,.part-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.controls{justify-content:center}.controls button,.part-row button,select{min-height:44px;border:1px solid #263748;border-radius:6px;color:#b4c0d3;background:#08121e;padding:8px 13px;font-size:14px}.controls button:hover,.part-row button:hover{border-color:#687d8e;color:#f4f6fc}.controls button[aria-pressed=true]{border-color:#608b89;color:#e0f9f4;background:#102121}.part-row{justify-content:center;margin-top:12px}.part-row label{font-size:14px;color:#b4c0d3}select{max-width:270px;flex:1;min-width:170px}.inspector{max-width:570px;min-height:110px;margin:24px auto 0;padding:0 10px}.inspector h2{font-size:18px;font-weight:600;margin:0 0 7px}.inspector p{color:#b4c0d3;line-height:1.6;font-size:15px;margin:0}.review-note{border-top:1px solid #1a2938;padding:34px 0 54px;margin:0 48px;color:#b4c0d3;line-height:1.6}.review-note h2{font-size:20px;color:#f4f6fc;font-weight:550;margin:0 0 12px}.review-note p{max-width:760px}.review-note summary{cursor:pointer;min-height:44px;padding:8px 0}.review-note details div{max-width:840px;font-size:14px;overflow-wrap:anywhere}.review-note>a{display:inline-block;padding:12px 0;text-decoration:underline;color:#a3d8ce}.no-script{padding:24px;color:#b4c0d3}
@media(min-width:1500px){.viewport{height:550px}}
@media(max-width:1080px){.hero{grid-template-columns:40% 60%;padding-left:30px}h1{font-size:44px;letter-spacing:-2px}.lede{font-size:17px;max-width:280px}.viewport{height:420px}.intro{padding-bottom:170px}.header{padding:26px 30px}}
@media(max-width:760px){.header{padding:22px 24px;font-size:13px;gap:16px}.header>span{display:none}.hero{display:block;padding:28px 18px 12px;min-height:0}.intro{padding:0 6px}h1{font-size:clamp(37px,8vw,54px);letter-spacing:-1.7px;white-space:normal;margin-bottom:20px}.lede{font-size:18px;max-width:470px;margin-bottom:23px}.intro-note{margin:19px 0 8px;font-size:14px}.viewport{height:360px;margin-top:18px}.caption{font-size:13px;text-align:left;margin:0 6px 18px}.controls{justify-content:flex-start;padding:0 6px}.part-row{justify-content:flex-start;padding:0 6px}.controls button,.part-row button,select{font-size:14px}.inspector{min-height:0;margin:22px 0 26px;padding:0 6px}.review-note{margin:0 24px;padding:28px 0 40px}}
@media(max-width:390px){.viewport{height:295px}.header{padding:18px 24px}.part-row select{max-width:calc(100% - 43px)}.part-row{gap:8px}h1{font-size:37px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.poster{position:absolute;inset:0;pointer-events:none;z-index:1}.poster img{width:100%;height:100%;object-fit:contain}.loading{z-index:3;top:auto;bottom:0;background:#080d0ce8;padding:10px;border-radius:5px}
.controls button,.part-row button,.part-row select,.part-row label,.inspector p{font-size:16px}

/* The board, its materials and its routing carry the composition. */
.hero{grid-template-columns:32% 68%;padding-left:48px;min-height:760px}
.intro{padding-bottom:140px}.lede{max-width:300px}h1{font-size:clamp(40px,4vw,58px)}
.viewport{height:540px}.intro-note{color:#a4b2a9}.controls button,.part-row button,select{background:#0e1914;border-color:#31443a}
.controls button[aria-pressed=true]{background:#1b3022;border-color:#82a78b}
.embed-open,.embed-label,.embed-view{display:none}.embedded{overflow:hidden;background:#080d0c}.embedded .header,.embedded .intro,.embedded .review-note,.embedded .caption,.embedded .controls,.embedded #focus-part{display:none}
.embedded .inspector,.embedded .part-row>label{position:absolute;width:1px;height:1px;min-height:0;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.embedded .embed-label{display:block;position:absolute;top:12px;left:16px;color:#a9baad;font-size:12px;z-index:3;pointer-events:none}.embedded .embed-view{display:inline-block}
.embedded main,.embedded .hero,.embedded .board-area{width:100%;height:100vh;max-width:none;margin:0;padding:0;min-height:0;display:block}
.embedded .viewport{height:calc(100vh - 54px);margin:0}.embedded .part-row{position:absolute;left:14px;right:130px;bottom:8px;justify-content:flex-start;margin:0;gap:8px}
.embedded select{min-width:0;width:150px;max-width:210px;flex:1}.embedded .part-row button,.embedded select{min-height:40px;font-size:13px;padding:7px 10px}
.embedded .embed-open{display:inline-flex;position:absolute;right:14px;bottom:9px;align-items:center;min-height:40px;font-size:13px;text-decoration:underline;color:#c9d7cb}
@media(min-width:1500px){.viewport{height:600px}}
@media(max-width:1080px){.hero{grid-template-columns:34% 66%;padding-left:28px}.intro{padding-bottom:140px}.viewport{height:470px}}
@media(max-width:760px){.hero{display:block;padding:20px 18px 12px}.intro{padding:0 6px}.lede{max-width:470px}.viewport{height:380px}.intro-note{margin-bottom:4px}.embedded .viewport{height:calc(100vh - 54px)}.embedded .part-row{left:10px;right:108px}.embedded .embed-open{right:10px;font-size:12px}}
@media(max-width:390px){.viewport{height:310px}.embedded #motion{padding:6px}.embedded .part-row{gap:5px}.embedded select{font-size:12px}}
@media(max-width:480px){.embedded #embed-view{display:none}}
