:root{font-family:system-ui,-apple-system,'Noto Sans KR',sans-serif;color:#192a49;background:#edf2f9}*{box-sizing:border-box}body{margin:0}button,select{font:inherit}button{cursor:pointer}header{height:68px;background:#10203b;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 22px;gap:14px}.brand{display:flex;gap:12px;align-items:center}.mark{font-size:28px;color:#8db8ff}.brand strong{font-size:16px;display:block}.brand small{display:block;color:#9cb3d4;font-size:12px;margin-top:2px}.headright{display:flex;align-items:center;gap:8px}.project{color:#9fb5d7;font-size:13px;margin-right:14px}button{background:white;border:1px solid #cbd8ea;border-radius:8px;padding:8px 11px;color:#274469}button:hover{border-color:#5b83cf}header button{background:#21395f;border-color:#3b537b;color:white}.layout{display:grid;grid-template-columns:192px minmax(0,1fr);min-height:calc(100vh - 68px)}aside{background:#182d4f;padding:20px 12px;color:#cfddf1}.asideTitle{font-size:11px;font-weight:700;letter-spacing:.14em;color:#86a6d1;margin:5px 10px 14px}.asideTitle.spaced{margin-top:35px}.nav{width:100%;text-align:left;background:transparent;border:0;color:inherit;padding:12px;border-radius:9px;margin-bottom:5px}.nav.active,.nav:hover{background:#324d77;color:white}aside select{margin:0 8px;width:calc(100% - 16px);background:#263e63;border:1px solid #4f6990;color:white;border-radius:8px;padding:9px}.asideNote{margin:30px 9px;font-size:12px;line-height:1.65;color:#a9bedb}main{min-width:0;padding:18px}.tab{display:none}.tab.active{display:block}.titleRow{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:13px}.titleRow h1,.info h1{font-size:23px;letter-spacing:-.03em;margin:0 0 5px}.titleRow p{margin:0;color:#667b98;font-size:13px}.viewToggle{display:flex;border:1px solid #c7d7eb;background:white;border-radius:9px;padding:3px;flex:none}.viewToggle button{border:0;background:none;padding:8px 12px}.viewToggle button.active{background:#2f61ca;color:white}.studioGrid{display:grid;grid-template-columns:minmax(620px,1.72fr) minmax(310px,.75fr);gap:13px;align-items:start}.left,.right{display:grid;gap:12px;min-width:0}.panel{background:white;border:1px solid #d4dfed;border-radius:12px;overflow:hidden;box-shadow:0 2px 11px #283b5d0a}.panelLabel{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:11px 14px;border-bottom:1px solid #e5ebf4;font-weight:700;font-size:14px}.panelLabel span{font-weight:400;font-size:12px;color:#7387a5}.parts{display:flex;gap:8px;padding:9px 11px}.parts button{min-width:116px;flex:1;display:flex;align-items:center;gap:7px;text-align:left;padding:7px;border-color:#e1e8f3}.parts b{font-size:12px}.parts small{font-size:11px;color:#8494ad}.partGlyph{width:28px;height:28px;display:grid;place-items:center;background:#e7eaff;border-radius:6px;font-size:17px;color:#6651a0}.ledGlyph{background:#fff2cc;color:#df9a0c}.lightGlyph{background:#fcebd6;color:#bc8117}.resistorGlyph{background:#e6f0fc;color:#5073aa}.benchBar{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px;border-bottom:1px solid #e5ebf4}.modeButtons,.cameraButtons{display:flex;gap:4px;align-items:center;flex-wrap:wrap}.benchBar button{font-size:12px;padding:6px 8px}.modeButtons button.active{background:#e2edff;color:#245bbd;border-color:#92b2e9}.cameraButtons span{font-size:12px;min-width:38px;text-align:center;color:#587194}.viewport{height:610px;overflow:auto;background:#e7edf7;position:relative;perspective:1100px;touch-action:pan-x pan-y}.perspective{position:relative;width:1100px;height:620px;transform-origin:top left}.world{width:1100px;height:620px;position:absolute;left:0;top:0;transform-style:preserve-3d;transform-origin:550px 310px;background:#eaf0fa;box-shadow:0 1px 10px #24395716}.gridSurface{position:absolute;inset:0;background-image:linear-gradient(#a9bed327 1px,transparent 1px),linear-gradient(90deg,#a9bed327 1px,transparent 1px);background-size:25px 25px}.world.three{box-shadow:0 30px 50px #1c335b55;border:1px solid #bed0e8}.world.three .gridSurface{background-color:#dce6f5}.wires{position:absolute;inset:0;width:1100px;height:620px;z-index:5;overflow:visible;pointer-events:none}.wires path{fill:none;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(2px 3px 2px #1a253871)}.object{position:absolute;z-index:3;transform-style:preserve-3d;cursor:grab;user-select:none}.object.dragging{cursor:grabbing;z-index:8}.object .face{position:relative;width:100%;height:100%;border-radius:10px;box-shadow:0 9px 18px #1d325343;border:2px solid #bbc8d8;overflow:hidden;transform:translateZ(15px)}.object .depth{position:absolute;inset:0;border-radius:10px;background:#263a57;transform:translateZ(-8px);box-shadow:12px 13px 0 #192b4566}.world.three .object .face{box-shadow:9px 14px 19px #142c4b5c}.boardObj{width:235px;height:365px}.boardObj .face{background:linear-gradient(125deg,#155d76,#0a425e);border-color:#286d81}.deviceHeader{color:#e2f4f9;text-align:center;padding-top:15px}.deviceHeader b{display:block;font-size:16px;letter-spacing:.04em}.deviceHeader small{font-size:9px;display:block;color:#9ed1d6}.usb{border:3px solid #adc3cc;background:#1a2b38;width:43px;height:16px;border-radius:4px;display:block;margin:0 auto 9px;font-size:0}.chip{position:absolute;left:78px;top:112px;width:93px;height:127px;border:3px solid #748a8f;border-radius:5px;background:#c2cfd0;display:grid;place-items:center;color:#2d4048;font:bold 15px/1.35 ui-monospace,monospace;text-align:center;box-shadow:3px 5px 0 #092e43}.pinStrip{position:absolute;left:6px;top:85px;display:grid;gap:7px}.socket{width:61px;height:38px;border:0;background:#174660;color:#e5f5ff;border-radius:3px;display:flex;align-items:center;gap:5px;padding:4px;font:bold 11px ui-monospace,monospace}.socket i{width:17px;height:17px;background:#1d2935;border:3px solid #c9b77e;border-radius:50%;flex:none}.socket:hover,.socket.selected,.railSocket:hover,.railSocket.selected,.tap:hover,.tap.selected,.componentPin:hover,.componentPin.selected{outline:3px solid #ffb844;outline-offset:1px}.socket.connected,.railSocket.connected,.tap.connected,.componentPin.connected{filter:drop-shadow(0 0 4px #7add92)}.boardCaption{position:absolute;right:11px;bottom:15px;color:#a5d2de;font-size:11px}.breadObj{width:420px;height:414px}.breadObj .face{background:#f8f9f9;border-color:#d0d6df}.breadTitle{padding:11px 15px;color:#60728c;font:bold 13px ui-monospace,monospace;display:flex;justify-content:space-between}.breadTitle span{font:11px system-ui}.railLine{margin:9px 15px;height:27px;display:flex;align-items:center;gap:5px;border-top:3px solid #d7736f;border-bottom:1px solid #e2e6ec}.railLine.blue{border-top-color:#5486c8;margin-top:16px}.railLine span{color:#dc7370;font-weight:bold}.railLine.blue span{color:#5287c9}.railSocket{border:2px solid #c1c9d0;color:#413e38;background:#e7e8e8;padding:0;border-radius:50%;width:18px;height:18px;font-size:8px}.dots{flex:1;background:radial-gradient(circle,#647286 2px,transparent 3px) 0 0/23px 14px;height:15px}.holeGrid{margin:12px 20px;display:grid;grid-template-columns:repeat(16,1fr);gap:10px 5px}.hole{width:8px;height:8px;border-radius:50%;background:#535e6b;box-shadow:inset 1px 1px #1d2532;opacity:.78}.channel{height:18px;border-block:1px solid #d7dce0;background:#e8ebee}.signalTerminals{display:flex;justify-content:space-around;padding:5px 10px}.tap{font-size:10px;padding:4px;color:#5d6891;background:#e8edf5}.component{width:128px;height:132px}.component .face{background:linear-gradient(145deg,#f5f0ff,#d9cef3);border-color:#7f6aa2;padding:9px}.component.light .face{background:linear-gradient(145deg,#fff8e6,#e9bf77);border-color:#aa8251}.component.led .face{background:linear-gradient(145deg,#fff8dc,#ffe29a);border-color:#ca9b3a}.component.resistor .face{background:linear-gradient(145deg,#e5f0ff,#afc9e7);border-color:#6288b2}.component b{display:block;font-size:14px;margin:4px 0}.component small{font-size:10px;color:#606b87}.component .sensorIcon{height:31px;width:31px;border:2px solid currentColor;border-radius:5px;display:grid;place-items:center;font-size:20px;color:#795bab}.component.light .sensorIcon{color:#b47a28}.component.led .sensorIcon{color:#db9b19}.component.resistor .sensorIcon{color:#5378ac}.componentPins{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:10px}.componentPin{font:bold 10px ui-monospace,monospace;padding:4px 1px;text-align:center;background:#fff;color:#3c506d;border-color:#b5bed0}.component.led .componentPins,.component.resistor .componentPins{grid-template-columns:repeat(2,1fr)}.benchFooter{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-top:1px solid #e1e9f3;background:#f9fbff}.benchFooter span{font-size:12px;color:#526c8c;line-height:1.5}.benchFooter div{display:flex;gap:5px;flex:none}.benchFooter button{font-size:12px}.storyboard .flowSteps{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;padding:12px}.flowStep{border:1px solid #dae4f0;background:#f5f8fd;border-radius:8px;padding:10px;font-size:12px;line-height:1.45;color:#5d7292}.flowStep.done{background:#e6f6ed;border-color:#bde3cb;color:#247852}.flowStep b{display:block;margin-bottom:4px}.checks{padding:10px 13px 0}.check{display:flex;gap:8px;align-items:start;font-size:12px;line-height:1.45;padding:6px 0}.check i{font-style:normal;color:#b87b30}.check.good i{color:#218561}.explanation{font-size:12px;line-height:1.6;color:#5c7190;background:#f3f7fd;padding:10px 13px;margin:10px 13px 13px;border-radius:8px}.fileTab{background:#182943;color:#dbe9ff;padding:9px 12px;font:12px ui-monospace,monospace}.fileTab span{color:#7f9bbd;margin-left:7px;font:11px system-ui}pre{margin:0;background:#112139;color:#d2e7ff;padding:13px;font:11px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;overflow:auto;max-height:315px;min-height:280px}.codeActions{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 11px}.codeActions button{font-size:11px}.codeActions span{font-size:10px;color:#788aa5}.display{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 12px 0}.readout{background:#e9f0fb;border-radius:9px;padding:11px}.readout small{display:block;color:#5f779a}.readout strong{font-size:24px;color:#204c9b;display:block;margin-top:5px}#chart{height:94px;width:calc(100% - 24px);margin:10px 12px 0;background:#f7faff;border:1px solid #e5eaf2;border-radius:6px}.serial{margin:8px 12px;background:#152642;color:#aad6c8;font:10px/1.5 ui-monospace,monospace;padding:8px;min-height:50px;max-height:68px;overflow:auto;white-space:pre-wrap}.runbar{display:flex;align-items:center;gap:8px;padding:0 12px 12px}.runbar small{color:#7186a1;font-size:11px}.run{background:#3271da;border-color:#3271da;color:white}.run.stop{background:#b84853;border-color:#b84853}.scope{font-size:12px;color:#667c99;padding:10px 4px;line-height:1.5}.info{background:#fff;border:1px solid #d8e2ee;border-radius:12px;padding:25px}.infoGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:20px 0}.infoGrid article{background:#f4f7fc;border:1px solid #e0e8f2;border-radius:10px;padding:18px}.infoGrid p{line-height:1.7;color:#59708e}.world.three{transition:transform .15s}.only3d{display:none}.is3d .only3d{display:inline-block}.is3d .viewport{cursor:grab}.is3d .viewport.orbiting{cursor:grabbing}@media(max-width:1450px){.studioGrid{grid-template-columns:minmax(550px,1.5fr) minmax(300px,.9fr)}.viewport{height:550px}}@media(max-width:1100px){.layout{grid-template-columns:1fr}aside{display:flex;gap:5px;align-items:center;padding:8px;overflow:auto}aside .asideTitle,aside select,aside .asideNote{display:none}.nav{width:auto;white-space:nowrap;margin:0}.studioGrid{grid-template-columns:1fr}.right{grid-template-columns:repeat(2,1fr)}.dashboard{grid-column:1/-1}.viewport{height:580px}}@media(max-width:700px){header{height:auto;min-height:62px;padding:10px}.headright .project{display:none}.headright button{font-size:11px;padding:5px}.brand strong{font-size:13px}main{padding:10px}.titleRow{align-items:start;flex-direction:column}.right,.infoGrid{grid-template-columns:1fr}.parts{overflow:auto}.parts button{flex:none}.benchBar{flex-wrap:wrap}.benchFooter{flex-wrap:wrap}.storyboard .flowSteps{grid-template-columns:repeat(2,1fr)}}
.importLabel{background:#21395f;border:1px solid #3b537b;color:white;border-radius:8px;padding:8px 11px;font-size:13px;cursor:pointer}.noteBody,.promptBody{padding:12px;display:grid;gap:8px}.noteBody label{font-size:12px;color:#526987}.noteBody textarea,.promptBody textarea{display:block;width:100%;min-height:60px;margin-top:5px;resize:vertical;border:1px solid #ced9e9;border-radius:7px;padding:8px;font:13px/1.45 system-ui}.noteBody button,.promptBody button{justify-self:start;font-size:12px}.suggestion{font-size:12px;line-height:1.55;color:#526985;background:#f2f6fc;border-radius:7px;padding:9px;white-space:pre-wrap}.widgetControls{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:11px;font-size:12px}.widgetControls label{display:flex;gap:4px;align-items:center}.widgetHidden{display:none}.toolIntro{color:#5d728e;line-height:1.6}.calcTabs{display:flex;gap:6px;flex-wrap:wrap;margin:20px 0}.calcTabs button.active{background:#2f61ca;color:#fff}.calcInputs{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:11px}.calcInputs label,.plannerForm label{display:grid;gap:5px;color:#405979;font-size:13px}.calcInputs input,.plannerForm input,.plannerForm select{border:1px solid #c9d6e7;border-radius:7px;padding:9px;background:white;min-width:0}.calcOutput{margin-top:15px;padding:18px;background:#f4f7fc;border:1px solid #dce6f2;border-radius:10px}.calcOutput #calcFormula{font:14px ui-monospace,monospace;color:#3b5380}.calcOutput #calcResults{font-weight:700;color:#214d99;font-size:21px;margin:12px 0}.calcOutput svg{width:100%;height:150px;background:white;border:1px solid #e1e9f3;border-radius:8px}.calcOutput p{color:#667c99;line-height:1.5;font-size:13px}.lessonQuiz{margin-top:16px;padding:17px;border:1px solid #d8e3f1;border-radius:10px}.lessonQuiz #quizChoices{display:flex;gap:7px;flex-wrap:wrap}.lessonQuiz #quizFeedback{color:#235698}.plannerGrid{display:grid;grid-template-columns:minmax(260px,1fr) minmax(300px,1fr);gap:18px;margin:19px 0}.plannerForm{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;padding:18px;background:#f5f8fc;border-radius:10px}.plannerForm button{align-self:end}.plannerResult{border:1px solid #d9e4f2;border-radius:10px;padding:19px;line-height:1.7;background:#f8faff}.plannerResult h2{font-size:17px;margin:0 0 10px}.plannerResult .good{color:#168058}.plannerResult .warn{color:#a65e25}.plannerResult .bad{color:#b23348}.plannerResult ul{padding-left:20px}.learningStrip{background:#e7effc;padding:13px;border-radius:8px;color:#335a95;line-height:1.6;font-size:13px}@media(max-width:900px){.calcInputs,.plannerGrid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.calcInputs,.plannerGrid,.plannerForm{grid-template-columns:1fr}}

.ledStatus{margin:0 12px 8px;padding:7px 9px;background:#fff8de;border:1px solid #f0d993;border-radius:6px;color:#876322;font-size:11px}

.dcLab{margin-top:20px;border:1px solid #d5e1f0;border-radius:11px;padding:0 17px 17px;background:#fafcff}.dcLab .panelLabel{margin:0 -17px 12px}.dcLab p{font-size:13px;line-height:1.5}.dcLab code{background:#e9eff7;padding:2px 4px;border-radius:4px}.dcExamples{display:flex;gap:7px;margin:10px 0}.dcLab textarea{display:block;width:100%;min-height:116px;background:#14233b;color:#d9eeff;border:1px solid #385374;border-radius:8px;padding:12px;font:14px/1.55 ui-monospace,monospace;resize:vertical;margin:10px 0}.dcLab .run{margin-bottom:10px}#dcResults{overflow:auto}#dcResults table{border-collapse:collapse;width:100%;font-size:13px;margin:8px 0}#dcResults th,#dcResults td{border:1px solid #d5e1ef;padding:7px;text-align:left}#dcResults th{background:#e9f0fb}#dcResults .error{color:#a73749;background:#fff1f3;padding:9px;border-radius:6px}

.returnLink{color:#d7e8ff;border:1px solid #52698c;border-radius:7px;padding:6px 8px;font-size:12px;text-decoration:none}.returnLink:hover{background:#2e4c78}

#assembly3d{position:absolute;inset:0;display:none;z-index:12;overflow:hidden;background:#e9f1fa;touch-action:none}#assembly3d canvas{display:block;width:100%;height:100%;cursor:grab}#assembly3d canvas:active{cursor:grabbing}.assembly3dHelp{position:absolute;left:14px;bottom:14px;z-index:1;background:#102e48df;color:white;border-radius:10px;padding:9px 12px;font-size:13px;line-height:1.5;pointer-events:none}.is3d .viewport{overflow:hidden}.is3d .perspective{display:none}@media(max-width:760px){.assembly3dHelp{font-size:12px;right:12px}}