.mb-page{max-width:1440px;margin:auto;padding:60px 5% 85px}.mb-page .lead{max-width:760px}.mb-page h1{max-width:950px}.mb-top-links{display:flex;flex-wrap:wrap;gap:22px;font-size:14px;margin:28px 0 50px}.mb-top-links a{color:var(--blue)}.mb-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:36px 0 24px}.mb-tabs button{border:1px solid #b8cce0;background:white;border-radius:5px;padding:13px 20px;cursor:pointer;color:var(--ink);font-weight:600}.mb-tabs button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:white}.mb-lab-title{font-size:clamp(25px,2.6vw,36px);margin-bottom:12px}.mb-lab-intro{color:var(--muted);max-width:850px}.mb-lab{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:20px;margin-top:25px;align-items:stretch}.mb-panel{border:1px solid var(--line);border-radius:12px;padding:25px;background:white;min-width:0}.mb-panel h3{font-size:22px;margin:12px 0 24px}.mb-panel .eyebrow{margin-top:0}.mb-matrix-wrap{display:grid;grid-template-columns:18px 1fr;grid-template-rows:18px 1fr;gap:9px}.mb-columns{display:flex;justify-content:space-around;grid-column:2;font:12px Consolas,monospace}.mb-rows{display:flex;flex-direction:column;justify-content:space-around;font:12px Consolas,monospace;text-align:center}.mb-matrix{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(5,minmax(0,1fr));gap:5px;aspect-ratio:1}.mb-matrix button{min-width:0;min-height:0;padding:0;border:1px solid #c8d9eb;background:#edf4fc;color:var(--ink);border-radius:5px;font:clamp(15px,1.8vw,23px) Consolas,monospace;cursor:pointer}.mb-matrix button.changed{border:2px solid var(--blue);background:#daeaff}.mb-matrix button.selected{outline:3px solid #bb8500;outline-offset:1px;z-index:1}.mb-coordinate{font:14px/1.5 Consolas,monospace;margin:22px 0 8px}.mb-panel .muted{font-size:12px}.mb-controls{display:flex;flex-direction:column;gap:10px;margin:22px 0}.mb-controls .button{justify-content:center;min-height:48px}.mb-controls [hidden]{display:none}.mb-rule{display:block;font:14px/1.8 Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;background:#eef4fc;padding:16px;border-radius:5px}.mb-last-rule{display:block;font:13px/1.7 Consolas,monospace;overflow-wrap:anywhere;color:var(--blue);margin-top:24px}.mb-board{background:#132337;border-radius:17px;padding:20px;aspect-ratio:1;display:flex;flex-direction:column;border:2px solid #29415b;box-shadow:0 7px 0 #0a1929}.mb-board-label{color:#a9bbc9;letter-spacing:.14em;font-size:9px;font-weight:700;text-align:center;margin:0 0 16px}.mb-leds{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(5,minmax(0,1fr));gap:12%;flex:1}.mb-leds span{position:relative;background:#273343;border-radius:3px;min-height:0;min-width:0}.mb-leds span:after{content:"";position:absolute;inset:0;background:#ffd343;border-radius:3px;opacity:var(--glow,0);box-shadow:0 0 10px #ffd34380}.mb-preview-note{margin:23px 0 0;color:var(--muted);font-size:12px}.mb-status{font-size:14px;min-height:50px;margin:20px 0}.mb-trace{display:flex;align-items:center;gap:20px;flex-wrap:wrap;border:1px solid var(--line);padding:20px 25px;border-radius:8px;background:#edf4fc}.mb-trace p{margin:0;font-size:12px}.mb-trace code{font:17px/1.6 Consolas,monospace;white-space:pre}.mb-trace b{color:var(--blue)}.mb-note{margin:24px 0 50px;padding:22px 25px;background:#fff8df;border-left:3px solid #bc8b0c;font-size:14px}.mb-note[hidden]{display:none}.mb-idea{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;border-top:1px solid var(--line);padding:40px 0}.mb-idea p:not(.eyebrow){color:var(--muted)}.mb-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.mb-steps article{border-top:2px solid var(--blue);padding:15px 5px}.mb-steps h3{font-size:18px}.mb-steps p{font-size:14px}.mb-lessons{padding:35px 0}.mb-lesson-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:25px}.mb-lesson{border:1px solid var(--line);padding:28px;border-radius:10px;background:white;min-width:0}.mb-lesson>p:not(.eyebrow){color:var(--muted);font-size:14px}.mb-lesson ol{font-size:14px;padding-left:20px}.mb-lesson li{margin:8px 0}.mb-lesson .actions{gap:12px;margin:20px 0}.mb-lesson .button{font-size:13px;padding:12px 15px}.mb-links{display:flex;gap:15px;flex-wrap:wrap;font-size:13px;color:var(--blue);margin:15px 0}.mb-lesson details{font-size:14px;margin-top:20px}.mb-lesson pre{background:#eef4fc;font:13px/1.65 Consolas,monospace;padding:17px;overflow-x:auto;tab-size:4;white-space:pre}.mb-lesson pre code{overflow-wrap:normal}.mb-ready{border-top:1px solid var(--line);padding-top:35px}.mb-ready p,.mb-ready li{font-size:14px;max-width:900px}.mb-page a:hover{text-decoration:underline}.mb-page .button:hover{text-decoration:none}header nav a[aria-current=page]{color:var(--blue);font-weight:700}@media(max-width:1050px){.mb-lab{grid-template-columns:1fr 1fr}.mb-transform{grid-row:2;grid-column:1/-1}.mb-controls{flex-direction:row;flex-wrap:wrap}.mb-controls .button{flex:1}.mb-idea{gap:25px;grid-template-columns:1fr}.mb-board{max-width:310px;margin:auto}.mb-trace{gap:15px}}@media(max-width:650px){.mb-page{padding:35px 5% 55px}.mb-page h1{font-size:43px}.mb-panel{padding:17px}.mb-lab{gap:12px}.mb-panel h3{font-size:18px}.mb-panel .eyebrow{font-size:9px;letter-spacing:.07em}.mb-board{padding:14px;border-radius:12px}.mb-board-label{font-size:7px;margin-bottom:12px}.mb-preview-note{font-size:11px}.mb-matrix-wrap{grid-template-columns:11px 1fr;grid-template-rows:14px 1fr;gap:5px}.mb-matrix{gap:4px}.mb-matrix button{font-size:16px;border-radius:3px}.mb-columns,.mb-rows{font-size:10px}.mb-coordinate{font-size:12px}.mb-trace{padding:16px}.mb-trace>p{width:100%}.mb-trace code{font-size:15px}.mb-lesson-cards,.mb-steps{grid-template-columns:1fr}.mb-lesson{padding:21px}.mb-top-links{margin-bottom:30px}.mb-controls .button{flex:auto}.mb-status{min-height:70px}.mb-note{margin-bottom:30px}}@media(max-width:380px){.mb-lab{grid-template-columns:1fr}.mb-transform{grid-column:auto;grid-row:auto}.mb-board{width:100%;max-width:260px}.mb-matrix{max-width:260px}.mb-page h1{font-size:38px}}
.mb-controls[hidden]{display:none}.mb-controls .mb-coordinate{flex-basis:100%;margin:0}
#mb-tilt-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#mb-tilt-controls[hidden]{display:none}#mb-tilt-controls .button{font-size:13px;white-space:normal;padding:12px 8px;min-width:0}#mb-tilt-reading{grid-column:1/-1}
