:root{--ap-bg:#0a1628;--ap-panel:#0e2039;--ap-panel-2:#102a49;--ap-text:#eaf8ff;--ap-muted:#94b4c9;--ap-cyan:#00d4ff;--ap-line:#244966;--ap-green:#5bffae;--ap-danger:#ff6b81}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 15% 0,#123b60 0,transparent 26%),var(--ap-bg);color:var(--ap-text);font-family:Inter,Arial,sans-serif}.ap-shell{width:min(1320px,calc(100% - 2rem));margin:auto;padding:1rem 0 3rem}.ap-header{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;padding:1rem 0 1.5rem}.ap-brand{display:flex;align-items:center;gap:.7rem;color:var(--ap-text);text-decoration:none;font-weight:800}.ap-brand img{width:44px;height:44px;border-radius:10px}.ap-brand b{color:var(--ap-cyan);font-weight:700}.ap-header p{margin:0;color:var(--ap-muted);text-align:center}.ap-home{color:var(--ap-cyan);font-weight:700;text-decoration:none}.ap-toolbar,.ap-mission-bar,.ap-workbench,.ap-guide,.ap-certificate{border:1px solid var(--ap-line);border-radius:18px;background:rgba(14,32,57,.94)}.ap-toolbar{display:flex;align-items:center;gap:1rem;justify-content:space-between;padding:.85rem 1rem}.ap-run-controls{display:flex;gap:.6rem}.ap-button{min-height:42px;padding:.65rem 1rem;border:1px solid #3d6682;border-radius:10px;background:#173654;color:var(--ap-text);font:700 .9rem Inter,Arial,sans-serif;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.ap-button:hover{border-color:var(--ap-cyan);transform:translateY(-1px)}.ap-button-primary{border-color:var(--ap-cyan);background:linear-gradient(135deg,#009dc2,#00d4ff);color:#03101f}.ap-examples{font-size:.85rem;color:var(--ap-muted)}select{margin-left:.4rem;padding:.5rem;border:1px solid var(--ap-line);border-radius:8px;background:#0b1a2f;color:var(--ap-text)}.ap-status{margin:0;font-size:.86rem;font-weight:700}.ap-status.running{color:var(--ap-green)}.ap-status.error{color:var(--ap-danger)}.ap-status.stopped{color:var(--ap-muted)}.ap-mission-bar{display:flex;justify-content:space-between;gap:1.5rem;padding:1.25rem;margin-top:1rem}.ap-eyebrow{color:var(--ap-cyan);font-size:.75rem;letter-spacing:.13em;text-transform:uppercase;font-weight:800}.ap-mission-bar h1{margin:.3rem 0;font-size:1.6rem}.ap-mission-bar p{margin:0;color:var(--ap-muted)}.ap-mission-actions{display:flex;align-items:center;gap:1rem}.ap-mission-actions label{font-size:.82rem;color:var(--ap-muted)}#progressBadge{padding:.55rem .75rem;border:1px solid rgba(0,212,255,.4);border-radius:999px;color:var(--ap-cyan);white-space:nowrap;font-size:.82rem}.ap-workbench{display:grid;grid-template-columns:minmax(320px,1fr) minmax(340px,1fr);overflow:hidden;margin-top:1rem}.ap-code-panel{min-height:580px;border-right:1px solid var(--ap-line);background:#081526}.ap-panel-title{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem 1rem;border-bottom:1px solid var(--ap-line)}.ap-panel-title h2,.ap-serial h2{font-size:.95rem;margin:0}.ap-panel-title span{font-size:.77rem;color:var(--ap-muted)}.ap-editor-wrap{display:grid;grid-template-columns:50px 1fr;height:490px}.ap-editor-wrap pre{margin:0;padding:1rem .8rem;text-align:right;overflow:hidden;background:#06101e;color:#4b718f;font:14px/1.55 Consolas,monospace;user-select:none}.ap-editor-wrap textarea{width:100%;resize:none;border:0;outline:0;padding:1rem;background:#081526;color:#dff7ff;font:14px/1.55 Consolas,monospace;tab-size:2}.ap-editor-hint{padding:0 1rem;color:var(--ap-muted);font-size:.78rem;line-height:1.5}.ap-hardware-panel{padding:0}.ap-board{position:relative;margin:1.25rem;min-height:270px;padding:1rem;border:2px solid #057da0;border-radius:15px;background:linear-gradient(135deg,#075779,#093455);box-shadow:inset 0 0 36px rgba(0,212,255,.18),0 12px 25px rgba(0,0,0,.25);overflow:hidden}.ap-board:before{content:"";position:absolute;inset:8px;border:1px dashed rgba(133,234,255,.25);border-radius:10px}.ap-board-name{position:relative;z-index:1;color:#c6f6ff;font-size:1.35rem;font-weight:900;letter-spacing:.12em}.ap-board-name b{font-size:2rem;color:white}.ap-board-name small{display:block;margin-top:.25rem;color:#80cfe3;font-size:.65rem;letter-spacing:.05em}.ap-pin-row{position:absolute;right:1rem;top:1rem;display:flex;gap:.25rem}.ap-pin-row span{padding:.35rem .27rem;background:#091825;border:1px solid #45677c;color:#b9e5f1;font:700 .62rem Consolas,monospace}.ap-board-components{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem;margin-top:1.25rem;align-items:end}.ap-led,.ap-board-button{border:0;background:transparent;color:#d7f8ff;cursor:pointer;font:700 .7rem Inter,Arial,sans-serif;display:grid;justify-items:center;gap:.35rem}.ap-led i{width:32px;height:32px;border-radius:50%;background:#5c1726;border:3px solid #b1495a;box-shadow:0 0 0 transparent;transition:.15s}.ap-led.on i{background:#ff4967;box-shadow:0 0 10px #ff4967,0 0 28px #ff4967}.ap-servo{grid-column:1/2;position:relative;display:grid;justify-items:center;gap:.35rem;color:#d7f8ff;font-size:.73rem}.ap-servo:before{content:"";width:82px;height:55px;border-radius:8px;background:#d8e2e8;border:4px solid #83939c}.ap-servo-arm{position:absolute;top:17px;width:68px;height:7px;border-radius:9px;background:#ffb14b;transform-origin:12px center;transform:rotate(0deg);transition:transform .28s ease}.ap-servo span,.ap-buzzer span{color:#a0cbd7;font-size:.68rem}.ap-board-button{grid-column:2/3;align-self:center}.ap-board-button span{display:grid;place-items:center;width:62px;height:62px;border-radius:50%;border:5px solid #728b9c;background:#e8f3f7;color:#173047;box-shadow:0 5px 0 #425967}.ap-board-button:active span,.ap-board-button.pressed span{transform:translateY(5px);box-shadow:0 0 0 #425967}.ap-buzzer{grid-column:3/4;display:grid;justify-items:center;gap:.35rem;color:#d7f8ff;font-size:.73rem}.ap-buzzer i{width:55px;height:55px;border-radius:50%;border:14px solid #182630;background:radial-gradient(circle,#00d4ff 0 10%,#091017 12%);transition:.1s}.ap-buzzer.active i{border-color:#00d4ff;box-shadow:0 0 22px #00d4ff}.ap-serial{margin:0 1.25rem 1.25rem;border:1px solid var(--ap-line);border-radius:10px;overflow:hidden;background:#050d18}.ap-serial>div{display:flex;justify-content:space-between;padding:.65rem .75rem;border-bottom:1px solid var(--ap-line)}.ap-serial button{border:0;background:transparent;color:var(--ap-cyan);font-weight:700;cursor:pointer}.ap-serial output{display:block;min-height:88px;max-height:120px;padding:.75rem;overflow:auto;color:#a7e9be;font:12px/1.55 Consolas,monospace;white-space:pre-wrap}.ap-guide,.ap-certificate{margin-top:1rem;padding:1.5rem}.ap-guide h2,.ap-certificate h2{margin:.2rem 0 .6rem}.ap-guide ol{color:var(--ap-muted);line-height:1.8;margin:0 0 1rem;padding-left:1.25rem}.ap-certificate{text-align:center;border-color:var(--ap-cyan);background:linear-gradient(135deg,#0d3150,#102040)}.ap-certificate span{color:var(--ap-cyan);font-weight:800}.ap-certificate p{color:var(--ap-muted)}.ap-overlay,.ap-celebration{position:fixed;inset:0;z-index:10;display:grid;place-items:center;padding:1rem;background:rgba(1,7,16,.8);backdrop-filter:blur(8px)}.ap-overlay>div,.ap-celebration>div{width:min(520px,100%);padding:2rem;border:1px solid var(--ap-cyan);border-radius:18px;background:#0e2039;text-align:center;box-shadow:0 0 55px rgba(0,212,255,.25)}.ap-overlay span,.ap-celebration h2{color:var(--ap-cyan)}.ap-overlay h2{margin:.6rem 0}.ap-overlay p,.ap-celebration p{color:var(--ap-muted);line-height:1.6}.ap-celebration>div{animation:ap-pop .35s ease}@keyframes ap-pop{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}@media(max-width:850px){.ap-header{grid-template-columns:1fr auto}.ap-header p{grid-column:1/-1;grid-row:2;text-align:left}.ap-workbench{grid-template-columns:1fr}.ap-code-panel{border-right:0;border-bottom:1px solid var(--ap-line);min-height:500px}.ap-editor-wrap{height:410px}.ap-mission-bar{display:grid}.ap-mission-actions{justify-content:space-between}}@media(max-width:540px){.ap-shell{width:min(100% - 1rem,1320px)}.ap-toolbar{align-items:stretch;flex-direction:column}.ap-run-controls{display:grid;grid-template-columns:repeat(3,1fr)}.ap-examples{display:flex;justify-content:space-between;align-items:center}.ap-mission-actions{align-items:stretch;flex-direction:column}.ap-board{margin:.75rem;min-height:300px}.ap-board-components{gap:.35rem}.ap-pin-row{position:relative;top:auto;right:auto;margin-top:.8rem;flex-wrap:wrap}.ap-servo:before{width:68px}.ap-servo-arm{width:56px}.ap-serial{margin:.75rem}.ap-header{gap:.5rem}.ap-brand span{font-size:.8rem}.ap-home{font-size:.8rem}}
