:root{--bg:#f6f8fb;--panel:#fff;--text:#1f2937;--muted:#6b7280;--blue:#1d4ed8;--green:#166534;--orange:#c2410c;--purple:#6d28d9;--red:#b91c1c;--border:#dbe3ef;--shadow:0 8px 24px rgba(31,41,55,.08)}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}header{padding:1rem;background:linear-gradient(135deg,#e0f2fe,#fef3c7);border-bottom:1px solid var(--border)}header h1{margin:0 0 .25rem;font-size:clamp(1.4rem,3vw,2.2rem)}header p{margin:0;color:var(--muted);font-size:1rem}main{display:grid;grid-template-columns:260px minmax(280px,1fr) 390px;gap:1rem;padding:1rem}section{background:var(--panel);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);padding:1rem;min-height:420px}h2{margin:0 0 .75rem;font-size:1.15rem}h3{margin:1rem 0 .5rem;font-size:1rem}.palette{display:grid;gap:.75rem}.block,.program-block{border:0;border-radius:14px;padding:.9rem 1rem;color:#fff;font-weight:700;font-size:1rem;cursor:grab;box-shadow:0 4px #00000029;text-align:left;width:100%}.block:active,.program-block:active{cursor:grabbing;transform:translateY(2px);box-shadow:0 2px #00000029}.move{background:var(--blue)}.turn{background:var(--green)}.sound{background:var(--orange)}.wait{background:var(--purple)}.stop{background:var(--red)}.workspace{display:flex;flex-direction:column;gap:.75rem;min-height:260px;padding:.75rem;border:2px dashed #b6c4d8;border-radius:16px;background:#f8fafc}.workspace.empty:before{content:"Drag blocks here or click blocks to add them";color:var(--muted);font-weight:600;text-align:center;padding:2rem 1rem}.program-block{position:relative;padding-right:3rem}.remove-block{position:absolute;right:.6rem;top:50%;transform:translateY(-50%);width:1.8rem;height:1.8rem;border:0;border-radius:50%;background:#ffffff4d;color:#fff;font-size:1rem;font-weight:900;cursor:pointer}.controls{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.control-button{border:0;border-radius:12px;padding:.75rem 1rem;font-weight:800;cursor:pointer;background:#111827;color:#fff}.control-button.secondary{background:#e5e7eb;color:#111827}.control-button.usb{background:#1d4ed8}.control-button.bluetooth{background:#6d28d9}.control-button.danger{background:#b91c1c}.control-button.warning{background:#c2410c}.control-button:disabled{opacity:.55;cursor:not-allowed}.robot-stage{height:220px;border-radius:18px;background:linear-gradient(#dbeafe,#f0fdf4);border:1px solid var(--border);display:grid;place-items:center;overflow:hidden;position:relative;margin-bottom:1rem}.robot{width:88px;height:88px;border-radius:28px;background:#fff;border:5px solid #111827;position:absolute;display:grid;place-items:center;font-size:2rem;transition:transform .45s ease}.robot:before,.robot:after{content:"";position:absolute;width:20px;height:32px;border-radius:12px;background:#111827;bottom:-20px}.robot:before{left:12px}.robot:after{right:12px}.status,.connection-panel,.diagnostic-panel{padding:.75rem;border-radius:12px;background:#f8fafc;border:1px solid var(--border);color:var(--muted);font-weight:600}.status{min-height:48px}.connection-panel strong,.diagnostic-panel strong{color:var(--text)}pre,.log-output{white-space:pre-wrap;background:#111827;color:#e5e7eb;padding:1rem;border-radius:14px;overflow:auto;font-size:.9rem}pre{min-height:130px}.log-output{height:260px;margin-top:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}label{display:block;margin:.5rem 0 .25rem;color:var(--text);font-weight:700;font-size:.9rem}input,select,textarea{width:100%;border:1px solid var(--border);border-radius:10px;padding:.65rem;font:inherit;background:#fff}textarea{min-height:84px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.small-note{margin-top:.5rem;color:var(--muted);font-size:.85rem;line-height:1.35}.two-column{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}details{margin-top:1rem;border:1px solid var(--border);border-radius:14px;padding:.75rem;background:#fff}summary{cursor:pointer;font-weight:900;color:var(--text)}.device-info{display:grid;gap:.35rem;margin-top:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.85rem;color:var(--text)}@media (max-width:980px){main{grid-template-columns:1fr}section{min-height:auto}}.program-block{list-style-position:inside}.block-main{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.block-label{font-weight:800}.step-controls{margin-top:.75rem;padding:.75rem;border-radius:12px;background:#ffffff2e}.step-controls label{color:#fff;margin:0 0 .4rem;font-size:.95rem}.step-input-row{display:flex;align-items:center;gap:.5rem}.step-input-row input{max-width:8rem;color:#111827}.step-unit{color:#fff;font-weight:800}.step-list-label{display:block;margin:.75rem 0 .35rem;color:#fff;font-size:.9rem;font-weight:800}.step-list{display:flex;gap:.35rem;overflow-x:auto;max-width:100%;padding:.25rem .15rem .45rem;scrollbar-width:thin}.step-option{flex:0 0 auto;min-width:2.75rem;border:2px solid rgba(255,255,255,.75);border-radius:999px;background:#fff;color:#111827;font-weight:900;padding:.45rem .65rem;cursor:pointer}.step-option[aria-pressed=true]{outline:3px solid #fff;outline-offset:2px;background:#111827;color:#fff}.step-option:focus-visible,.block:focus-visible,.control-button:focus-visible,.remove-block:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #111827;outline-offset:3px}.skip-link{position:absolute;left:.5rem;top:.5rem;transform:translateY(-200%);background:#111827;color:#fff;padding:.75rem 1rem;border-radius:.5rem;z-index:1000}.skip-link:focus{transform:translateY(0)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}.step-controls{overflow:visible}.step-picker{position:relative;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.step-picker input{width:7rem;max-width:7rem;background:#fff;color:#111827;border:2px solid rgba(255,255,255,.9);border-radius:999px;text-align:center;font-weight:900}.step-picker-toggle{border:2px solid rgba(255,255,255,.85);border-radius:999px;padding:.55rem .8rem;background:#fff;color:#111827;font-weight:900;cursor:pointer}.step-picker-toggle:hover,.step-picker-toggle:focus-visible{background:#111827;color:#fff}.step-help{margin:.5rem 0 0;color:#fff;font-size:.85rem;font-weight:700}.step-list{position:absolute;z-index:20;top:calc(100% + .45rem);left:0;width:min(14rem,100%);max-height:13.5rem;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:0;padding:.35rem;border:2px solid rgba(17,24,39,.35);border-radius:.25rem;background:#1d4ed8;box-shadow:0 10px 24px #11182759;scrollbar-width:thin}.step-list[hidden]{display:none}.step-option{width:100%;min-width:0;border:0;border-radius:.2rem;background:transparent;color:#fff;font-weight:900;font-size:1.05rem;text-align:center;padding:.75rem .5rem;cursor:pointer}.step-option:hover,.step-option:focus-visible,.step-option[aria-pressed=true]{outline:3px solid #ffffff;outline-offset:-3px;background:#111827;color:#fff}.step-picker-toggle:focus-visible,.step-option:focus-visible{outline:3px solid #ffffff;outline-offset:2px}main{grid-template-columns:minmax(420px,2fr) minmax(300px,1fr)}.blockly-area{height:560px;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#fff}.editor-section{min-height:640px}@media (max-width:980px){main{grid-template-columns:1fr}.blockly-area{height:420px}}html,body.app-body{height:100%;overflow:hidden}body.app-body{display:flex;flex-direction:column;background:#fff}header.topbar{display:flex;align-items:center;gap:1rem;padding:.6rem 1.25rem;background:#fff;border-bottom:1px solid var(--border)}.app-title{margin:0;font-size:1.35rem;font-weight:800}.status-pill{flex:1;min-width:0;background:#f6f8fb;border:1px solid var(--border);border-radius:999px;padding:.45rem .9rem;font-size:.85rem;font-weight:600;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:0}.topbar-actions{display:flex;align-items:center;gap:.55rem}.topbar-divider{width:1px;height:28px;background:var(--border)}.icon-button{width:44px;height:44px;border-radius:50%;border:1px solid var(--border);background:#fff;font-size:1.05rem;font-weight:800;cursor:pointer;display:grid;place-items:center;color:#374151;box-shadow:0 1px 2px #1f293714;padding:0}.icon-button:hover{background:#f3f4f6}.icon-button:focus-visible{outline:3px solid #2563eb;outline-offset:2px}.icon-button.run{background:#16a34a;border-color:#15803d;color:#fff;font-size:1.15rem}.icon-button.run:hover{background:#15803d}.icon-button.stop{background:#fee2e2;border-color:#fca5a5;color:#b91c1c}.icon-button.help{background:#2563eb;border-color:#1d4ed8;color:#fff}.icon-button:disabled{opacity:.5;cursor:not-allowed}main.app-layout{display:flex;flex:1;min-height:0;padding:0;gap:0}.category-rail{display:flex;flex-direction:column;gap:.4rem;padding:.75rem .5rem;width:96px;overflow-y:auto;background:#fff;border-right:1px solid var(--border);flex:none}.category-button{display:flex;flex-direction:column;align-items:center;gap:.18rem;border:2px solid transparent;background:#fff;border-radius:14px;padding:.5rem .25rem;cursor:pointer;width:100%}.category-button .category-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:1.25rem;background:#fff;border:2px solid var(--cat-colour);box-shadow:inset 0 0 0 100px color-mix(in srgb,var(--cat-colour) 14%,#fff)}.category-button .category-label{font-size:.62rem;font-weight:800;color:#374151;text-align:center;line-height:1.1}.category-button.active{border-color:var(--cat-colour)}.category-button:hover{background:#f8fafc}.category-button:focus-visible{outline:3px solid var(--cat-colour,#2563eb);outline-offset:2px}.blockly-area{flex:1;min-width:0;height:auto;border:0;border-radius:0;min-height:0}.drawer{position:fixed;top:70px;right:12px;bottom:12px;width:min(430px,calc(100vw - 24px));overflow-y:auto;background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 50px #1f293740;padding:1rem;z-index:60}.drawer-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.drawer-header h2{margin:0;font-size:1.1rem}.drawer-close{width:34px;height:34px;border-radius:50%;border:1px solid var(--border);background:#f3f4f6;font-size:1.1rem;font-weight:900;cursor:pointer;line-height:1}.drawer-close:focus-visible{outline:3px solid #2563eb;outline-offset:2px}.help-dialog{border:0;border-radius:18px;box-shadow:0 18px 50px #1f29374d;padding:1.25rem;max-width:480px}.help-dialog::backdrop{background:#11182759}.help-steps{padding-left:1.2rem;line-height:1.55}.choice-group{border:1px solid var(--border);border-radius:12px;padding:.5rem .75rem;margin:.5rem 0}.choice-group label{display:inline-flex;align-items:center;gap:.3rem;margin:.25rem .6rem .25rem 0;font-weight:600}.choice-group input{width:auto}@media (max-width:760px){.category-rail{width:72px}.category-button .category-label{font-size:.55rem}.app-title{font-size:1.05rem}.status-pill{display:none}.icon-button{width:40px;height:40px}}@media (max-width:520px){.topbar-actions{gap:.3rem}.topbar-divider{display:none}.icon-button{width:36px;height:36px;font-size:.95rem}.tile-button{width:38px;height:38px}.app-title{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}}.tile-button{width:54px;height:54px;border-radius:16px;border:1px solid var(--border);background:#fff;cursor:pointer;display:grid;place-items:center;box-shadow:0 1px 2px #1f293714;padding:0}.tile-button:hover{background:#f8fafc}.tile-button:focus-visible{outline:3px solid #2563eb;outline-offset:2px}.help-badge{width:32px;height:32px;border-radius:50%;background:#2f80ed;color:#fff;font-weight:900;font-size:1.05rem;display:grid;place-items:center;line-height:1}.avatar-icon{width:30px;height:30px}@media (max-width:760px){.tile-button{width:46px;height:46px}.help-badge{width:28px;height:28px}.avatar-icon{width:26px;height:26px}}main.app-layout.sim-active .blockly-area{flex:0 0 46%}.sim-stage{flex:1;min-width:0;display:flex;flex-direction:column;background:#f6f8fb;border-left:1px solid var(--border);position:relative}.sim-stage[hidden],.sim-close{display:none}.sim-field{flex:1;position:relative;overflow:hidden;background-image:linear-gradient(#e7ecf3 1px,transparent 1px),linear-gradient(90deg,#e7ecf3 1px,transparent 1px);background-size:40px 40px}.sim-robot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:72px;height:72px;border-radius:50%;border:3px solid #1d4ed8;background:#fff;color:#1d4ed8;cursor:pointer;display:grid;place-items:center;box-shadow:0 6px 18px #1d4ed840;padding:0}.sim-robot svg{width:40px;height:40px}.sim-robot.waiting{animation:sim-pulse 1.4s ease-in-out infinite}.sim-robot.running{cursor:default;animation:none}@keyframes sim-pulse{0%,to{box-shadow:0 0 #1d4ed859}50%{box-shadow:0 0 0 16px #1d4ed800}}.sim-bubble{position:absolute;left:50%;top:50%;transform:translate(-50%,-110px);background:#111827;color:#fff;border-radius:999px;padding:.4rem .8rem;font-weight:800;font-size:1rem;white-space:nowrap;z-index:4;pointer-events:none}.sim-bubble.sim-face-bubble{font-size:3.75rem;line-height:1;padding:.25rem .5rem;border-radius:22px;background:#fff;color:#111827;border:3px solid #111827;box-shadow:0 8px 22px #11182747}.sim-hint{margin:0;padding:.6rem 1rem;font-size:.85rem;color:var(--muted);font-weight:600;border-top:1px solid var(--border);background:#fff}.run-choice .run-choices{display:flex;gap:1rem;margin:.75rem 0 .25rem}.run-choice-button{flex:1;display:flex;flex-direction:column;align-items:center;gap:.3rem;border:2px solid var(--border);border-radius:18px;background:#fff;padding:1.1rem .75rem;cursor:pointer;min-width:140px}.run-choice-button:hover{border-color:#2563eb;background:#eff6ff}.run-choice-button:focus-visible{outline:3px solid #2563eb;outline-offset:2px}.run-choice-icon{font-size:2.4rem;line-height:1}.run-choice-label{font-weight:900;font-size:1.05rem}.run-choice-sub{font-size:.78rem;color:var(--muted);font-weight:600}.sim-ink{position:absolute;pointer-events:none;visibility:hidden}.sim-tools{height:96px;flex:none;background:#fff;border-top:1px solid var(--border);display:grid;place-items:center}.sim-pen{width:56px;height:56px;border-radius:16px;border:2px solid #111827;background:#111827;color:#fff;cursor:pointer;display:grid;place-items:center;padding:0;box-shadow:0 2px 6px #11182740;transition:background .15s,color .15s}.sim-pen svg{width:28px;height:28px}.sim-pen.active{background:#fff;color:#111827}.sim-pen:focus-visible{outline:3px solid #2563eb;outline-offset:3px}.sim-tools{display:flex;justify-content:center;align-items:center;gap:.75rem}.sim-toggle{width:56px;height:56px;border-radius:16px;border:2px solid #111827;background:#fff;color:#111827;cursor:pointer;display:grid;place-items:center;padding:0;box-shadow:0 2px 6px #11182740;transition:background .15s,color .15s}.sim-toggle svg{width:30px;height:30px}.sim-toggle .slash{display:none}.sim-toggle.hidden-state{background:#111827;color:#fff}.sim-toggle.hidden-state .slash{display:block}.sim-toggle:focus-visible{outline:3px solid #2563eb;outline-offset:3px}.sim-robot.ghost{opacity:0;pointer-events:none}.sim-robot .robot-skin-pubbo{display:none;width:56px;height:50px}.sim-robot.pubbo-skin .robot-skin-pubbo{display:block}.sim-robot.pubbo-skin .robot-skin-triangle{display:none}.sim-robot.pubbo-skin{border-color:#6b7280;box-shadow:0 6px 18px #11182740}#simPubboLeftRing,#simPubboRightRing{transition:stroke .2s ease}#simPubboBody{transition:fill .2s ease}.sim-toggle .icon-pubbo{display:none}.sim-toggle.pubbo-state .icon-pubbo{display:block}.sim-toggle.pubbo-state .icon-triangle,.sim-toggle.hidden-state .icon-pubbo{display:none}.sim-toggle.hidden-state .icon-triangle{display:block}.sim-sensors.active{background:#16a34a;border-color:#15803d;color:#fff}.sim-sensor-view{position:absolute;top:.6rem;left:.6rem;z-index:5;width:110px;border-radius:12px;overflow:hidden;background:#111827;box-shadow:0 4px 12px #11182759}.sim-sensor-view video{display:block;width:110px;height:82px;object-fit:cover}.sim-sensor-readout{display:flex;align-items:center;gap:.35rem;padding:.25rem .4rem;background:#111827;color:#fff;font-size:.72rem;font-weight:800}.sensor-chip{width:14px;height:14px;border-radius:4px;background:#9ca3af;box-shadow:inset 0 0 0 1px #ffffff59;flex:0 0 auto}.sim-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none;opacity:.92}.sim-toggle.active{background:#1d4ed8;border-color:#1e3a8a;color:#fff}.sim-toggle.active:hover{background:#1e3a8a}.sim-field.backdrop-dragover{outline:3px dashed #2563eb;outline-offset:-3px}.sim-field.backdrop-dragover:after{content:"Drop SVG to use as backdrop";position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:#2563eb12;color:#2563eb;font-weight:900;font-size:1.1rem;pointer-events:none}.sim-viewport{position:absolute;inset:0;will-change:transform;transform-origin:center center}.sim-zoom-group{display:flex;align-items:center;gap:2px;background:#f3f4f6;border:2px solid #111827;border-radius:14px;padding:3px;box-shadow:0 2px 6px #1118272e}.sim-zoom-btn{width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:#111827;font-size:1.2rem;font-weight:900;cursor:pointer;display:grid;place-items:center;padding:0;line-height:1;transition:background .12s,color .12s}.sim-zoom-btn:hover{background:#111827;color:#fff}.sim-zoom-btn:focus-visible{outline:3px solid #2563eb;outline-offset:2px}.sim-zoom-reset{font-size:.8rem}.sim-zoom-level{min-width:38px;text-align:center;font-size:.8rem;font-weight:900;color:#374151;padding:0 2px;user-select:none;pointer-events:none}.cal-details{margin-top:1rem;border:1px solid var(--border);border-radius:14px;padding:.75rem;background:#fff}.cal-details summary{cursor:pointer;font-weight:900;color:var(--text);padding:.25rem 0}.cal-content{margin-top:.75rem;display:flex;flex-direction:column;gap:.75rem}.cal-intro{margin:0;color:var(--muted);font-size:.9rem}.cal-current{display:flex;gap:1rem;flex-wrap:wrap;font-size:.9rem;padding:.5rem;background:#f6f8fb;border-radius:8px;border:1px solid var(--border)}.cal-section{display:flex;flex-direction:column;gap:.5rem}.cal-section h4{margin:0;font-size:.95rem}.cal-section p{margin:0;font-size:.85rem;color:var(--muted)}.cal-input-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.cal-input-row label{margin:0;font-size:.9rem}.cal-input-row input{width:7rem}.cal-unit{font-weight:700;color:var(--text)}.cal-status{margin:0;font-size:.85rem;font-weight:600;color:var(--text);min-height:1.2em}.cal-angle-btn{background:var(--purple)}.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}#simPubboFaceText{display:none}.code-view-switch{display:flex;flex-wrap:wrap;gap:0;margin:.25rem 1rem .5rem;border:2px solid var(--border);border-radius:999px;width:fit-content;max-width:calc(100% - 2rem)}.code-view-switch button{border:0;background:#fff;color:#111827;font-weight:800;font-size:.85rem;padding:.4rem .9rem;cursor:pointer;min-height:36px}.code-view-switch button:first-child{border-radius:999px 0 0 999px}.code-view-switch button:last-child{border-radius:0 999px 999px 0}.code-view-switch button[aria-pressed=true]{background:#111827;color:#fff}.code-view-switch button:focus-visible{outline:3px solid #2563eb;outline-offset:2px;position:relative;z-index:1}

//# sourceMappingURL=styles.css.map