:root{--paper:#f4ecdc;--paper2:#fbf5e6;--ink:#2b2420;--muted:#7a6f62;--gold:#f2b630;--gold-soft:#f7d977;--denim:#3f6fb4;--brick:#b2503f;--hand:"Patrick Hand", "Comic Sans MS", cursive;--marker:"Caveat", "Patrick Hand", cursive;--ui:"Nunito", "Quicksand", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0}body{background:var(--paper);color:var(--ink);font-family:var(--ui);min-height:100vh;position:relative}body:before{content:"";pointer-events:none;z-index:0;opacity:.35;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' seed='3'/><feColorMatrix values='0 0 0 0 .45  0 0 0 0 .35  0 0 0 0 .22  0 0 0 .22 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");position:fixed;inset:0}button{font:inherit;color:inherit;cursor:pointer}h1,h2{font-family:var(--hand);margin:0;font-weight:400}@keyframes boil{0%{filter:url(#b1)}33%{filter:url(#b2)}66%{filter:url(#b3)}to{filter:url(#b1)}}.boil{animation:.6s step-end infinite boil}.card:before,.card-btn:before,.pill:before,.seg:before,.sw-card:before,.transport:before{content:"";border-radius:inherit;pointer-events:none;border:2px solid #8a7d6b;animation:.6s step-end infinite boil;position:absolute;inset:0}.page{z-index:1;grid-template-columns:330px minmax(0,1fr) 340px;gap:22px;max-width:1700px;min-height:100vh;margin:0 auto;padding:26px 30px;display:grid;position:relative}.col{flex-direction:column;gap:16px;min-width:0;display:flex}.card{background:var(--paper2);border-radius:22px 26px 20px 24px;padding:16px 18px;position:relative;box-shadow:3px 4px #785f3c1f}.card:before{border-radius:22px 26px 20px 24px}.hl2{z-index:0;padding:0 8px;position:relative}.hl2:before{content:"";background:var(--gold-soft);z-index:-1;border-radius:10px 4px 12px 5px;animation:.6s step-end infinite boil;position:absolute;inset:18% 0 0;transform:rotate(-1deg)}.card h2{font-family:var(--marker);align-items:center;gap:8px;margin-bottom:10px;font-size:30px;font-weight:700;line-height:1.1;display:flex}.bulb{font-size:22px;font-style:normal}.hero{position:relative}.badge{font-family:var(--hand);background:var(--gold-soft);border-radius:6px 14px 8px;padding:3px 12px 3px 8px;font-size:17px;display:inline-block;transform:rotate(-1.5deg)}.badge i{margin-right:4px;font-style:normal}h1{font-family:var(--hand);letter-spacing:.5px;margin:16px 0 14px;font-size:64px;line-height:1}.hl{z-index:0;white-space:nowrap;padding:0 6px;position:relative}.hl:before{content:"";background:var(--gold-soft);z-index:-1;border-radius:12px 6px 16px 8px;animation:.6s step-end infinite boil;position:absolute;inset:22% -6px 0 -4px;transform:rotate(-1.2deg)skew(-4deg)}.sparkle{width:38px;position:absolute;top:40px;right:20px}.sub{font-family:var(--hand);color:#3d352e;margin:0;font-size:19px;line-height:1.3}.tabs{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.card-btn{background:var(--paper2);font-family:var(--hand);border:0;border-radius:18px 20px 16px 22px;flex-direction:column;align-items:center;gap:4px;padding:10px 6px 8px;font-size:17px;transition:transform .15s;display:flex;position:relative}.card-btn:before{border-radius:inherit}.card-btn:hover{transform:translateY(-2px)rotate(-1deg)}.card-btn.active{background:var(--gold-soft)}.card-btn.active:before{border-color:#d9a21c}.card-btn svg{width:46px;height:30px}.diagrams h2{margin-bottom:6px}.xsec{align-items:center;gap:8px;display:flex}#xsec{flex:62%}.doodle{width:100%;height:auto;display:block;overflow:visible}.pole{font-family:var(--marker);font-size:22px;font-weight:700}.legend{font-family:var(--hand);color:#4a4036;flex-direction:column;flex:38%;gap:7px;margin:0;padding:0;font-size:13px;line-height:1.15;list-style:none;display:flex}.legend li{align-items:center;gap:6px;display:flex}.lg{background:#fbf3df;border:2px solid #a85a2c;border-radius:50%;flex:none;width:14px;height:14px;position:relative}.lg.dot:after{content:"";background:#a85a2c;border-radius:50%;position:absolute;inset:3px}.lg.cross:after{content:"×";text-align:center;color:#a85a2c;font-size:15px;font-style:normal;font-weight:700;position:absolute;inset:-5px 0 0}.lg.arrow{background:var(--brick);border:0;border-radius:2px;width:4px;height:14px;margin:0 5px}.lg.field{background:var(--denim);border:0;border-radius:1px;width:14px;height:2px}.graph-head{font-family:var(--hand);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;margin:10px 0 2px;font-size:14px;display:flex}.badge-note{background:var(--gold-soft);font-size:12px;font-family:var(--hand);border-radius:10px;padding:1px 9px}.badge-note.warn{background:#f1b9a8}.gt{font-family:var(--hand);fill:#4a4036;font-size:10px}.center{align-items:stretch}.showbar{font-family:var(--hand);flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;font-size:15px;display:flex}.show-label{color:var(--muted);margin-right:2px}.pill{background:var(--paper2);font-family:var(--hand);border:0;border-radius:999px;align-items:center;gap:6px;padding:4px 13px 4px 10px;font-size:15px;display:flex;position:relative}.pill.on{background:var(--gold-soft)}.pill.on:before{border-color:#d9a21c}.sw{background:#c9bfae;border-radius:4px;width:14px;height:7px;display:inline-block}.sw.line{height:4px}.pill.on .sw.line{background:var(--denim)}.sw.dots{background:radial-gradient(circle,#e0a020 38%,#0000 42%) 0 0/5px 7px}.pill.on .sw.dots{background:radial-gradient(circle,#e0a020 40%,#0000 44%) 0 0/5px 7px}.sw.plain{border-radius:50%;width:8px;height:8px}.pill.on .sw.plain{background:var(--brick)}.viewport{flex:auto;min-height:460px;position:relative}.viewport canvas{touch-action:none;cursor:grab}.viewport canvas:active{cursor:grabbing}.spin-hint{pointer-events:none;opacity:.9;width:120px;position:absolute;top:4%;left:50%;transform:translate(-50%)}.drag-hint{font-family:var(--marker);color:var(--muted);pointer-events:none;font-size:18px;position:absolute;bottom:6px;right:8px}.label-lines{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.lline{fill:none;stroke:var(--ink);stroke-width:1.6px;stroke-linecap:round}.plabel{font-family:var(--marker);background:var(--paper2);border:1.8px solid var(--ink);white-space:nowrap;pointer-events:none;border-radius:10px 6px 12px 7px;padding:0 9px;font-size:22px;font-weight:700;position:absolute;top:0;left:0}body[data-tab=parts] .plabel{background:var(--gold-soft)}.transport{border-radius:999px;align-self:center;align-items:center;gap:26px;padding:8px 26px;display:flex}.transport:before{border-radius:999px}.round{background:0 0;border:0;border-radius:50%;place-items:center;width:46px;height:46px;font-size:26px;transition:transform .12s;display:grid}.round:hover{transform:scale(1.12)rotate(-6deg)}.round.big{background:var(--gold);width:62px;height:62px;box-shadow:inset 0 0 0 2px #d39a12,2px 3px #785f3c4d}.round.big svg{width:26px;height:26px}.bottom{grid-template-columns:1.1fr 1fr;gap:14px;display:grid}.ro{font-size:13px;font-family:var(--hand);grid-template-columns:105px 1fr 76px;align-items:center;gap:8px;padding:4px 0;font-size:15px;display:grid}.ro em{text-align:right;font-size:14px;font-style:normal}.bar{background:#e6dcc8;border-radius:6px;height:8px;overflow:hidden}.bar b{border-radius:6px;height:100%;transition:width .12s;display:block}.c-gold{background:var(--gold)}.c-orange{background:#e8892c}.c-red{background:#c23a2b}.hold-row{justify-content:space-between;align-items:center;display:flex}.hold-title{font-family:var(--hand);font-size:17px}.hold-title i{font-style:normal}.angle-row{font-family:var(--hand);color:var(--muted);justify-content:space-between;margin:4px 0 0;font-size:15px;display:flex}.angle-row em{font-style:normal}.hold-copy{font-family:var(--hand);color:#4a4036;min-height:2.4em;margin:4px 0 0;font-size:14px}.toggle{background:#d8cdb8;border:1.8px solid #8a7d6b;border-radius:12px;flex:none;width:38px;height:20px;padding:0;transition:background .15s;display:inline-block;position:relative}.toggle b{background:#fbf5e6;border:1.6px solid #6a5e50;border-radius:50%;width:13px;height:13px;transition:left .15s;position:absolute;top:2px;left:2px}.toggle.on{background:var(--gold)}.toggle.on b{left:20px}.sec-label{font-family:var(--hand);color:var(--muted);border-top:1.5px dashed #d8cdb8;margin:8px 0 4px;padding-top:6px;font-size:14px}.sec-label:first-of-type{border-top:0}.switches{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.sw-card{background:var(--paper2);font-family:var(--hand);text-align:center;border:0;border-radius:16px 18px 15px 19px;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;font-size:15px;line-height:1.05;display:flex;position:relative}.sw-card:before{border-radius:inherit}.sw-card i{font-size:19px;font-style:normal}.sw-card.on{background:var(--gold-soft)}.sw-card:active{transform:scale(.96)rotate(-1deg)}.slider{font-family:var(--hand);grid-template-columns:1fr auto;gap:2px 8px;margin:10px 0;font-size:17px;display:grid}.slider span i{opacity:.8;margin-right:8px;font-style:normal}.slider em{font-size:16px;font-style:normal}.slider input{grid-column:1/-1}input[type=range]{appearance:none;--p:50%;background:0 0;width:100%;height:22px;margin:0}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--gold) var(--p), #ddd3bf var(--p));border-radius:6px;height:8px}input[type=range]::-moz-range-track{background:linear-gradient(to right, var(--gold) var(--p), #ddd3bf var(--p));border-radius:6px;height:8px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;border:2px solid var(--ink);background:#fbf5e6;border-radius:50%;width:22px;height:22px;margin-top:-7px;box-shadow:1px 2px #0003}input[type=range]::-moz-range-thumb{border:2px solid var(--ink);background:#fbf5e6;border-radius:50%;width:18px;height:18px}input[type=range]:disabled{opacity:.55}input[type=range]:disabled::-webkit-slider-thumb{background:var(--gold)}.seg{background:var(--paper2);border-radius:14px;grid-template-columns:1fr 1fr;display:grid;position:relative;overflow:hidden}.seg:before{z-index:2}.seg button{font-family:var(--hand);background:0 0;border:0;padding:8px 4px;font-size:17px}.seg button.active{background:var(--gold-soft)}.helper{font-family:var(--hand);color:#4a4036;min-height:2.6em;margin:8px 0 0;font-size:15px}.idea-body{align-items:center;gap:8px;display:flex}.idea-body p{font-family:var(--hand);flex:50%;margin:0;font-size:19px;line-height:1.3}.hand{flex:50%;width:50%}@media (width<=1100px){.page{grid-template-columns:300px 1fr}.col.right{grid-column:1/-1;grid-template-columns:1fr 1fr;align-items:start;display:grid}}@media (width<=760px){.page{flex-direction:column;gap:14px;padding:14px 12px 30px;display:flex}.col.left,.col.center,.col.right{display:contents}.hero{order:1}.tabs{order:2}.showbar{order:3}.viewport{flex:none;order:4;height:380px;min-height:0}.transport{order:5}.bottom{order:6;grid-template-columns:1fr}.diagrams{order:7}.controls{order:8}.idea{order:9}h1{font-size:46px}.sparkle{top:20px;right:0}.ro{grid-template-columns:100px 1fr 70px}}