:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:#e6edf7;background:#070d1a;font-synthesis:none;--muted:#94a5bf;--line:#22324c;--accent:#2dd4bf;--panel:#101b2eef}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(900px 600px at 90% -10%,#12474366,transparent 70%),radial-gradient(700px 700px at -20% 60%,#123b5866,transparent 75%),#070d1a;background-attachment:fixed}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #5eead4;outline-offset:3px}button{transition:background .15s,border-color .15s,transform .15s}button:hover{filter:brightness(1.13)}a{color:#5ed8e8}.app{max-width:1510px;padding:22px 30px 30px;margin:auto}header{display:flex;align-items:center;gap:20px;padding-bottom:22px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:#e6edf7}.logo{width:51px;height:51px;display:grid;place-items:center;background:linear-gradient(135deg,#2dd4bf33,#38bdf810);border:1px solid #2dd4bf88;border-radius:13px;font-size:42px;line-height:1;color:#5eead4;box-shadow:0 0 25px #2dd4bf16}.brand strong{font-size:25px;letter-spacing:.08em}.labword{font-size:11px;color:#94a5bf;letter-spacing:.04em;font-weight:500}.brand small{display:block;font-size:12px;color:#94a5bf;margin-top:3px}.levelgroup{display:flex;background:#ffffff04;border:1px solid #2b3b53;border-radius:30px;padding:4px;margin-left:auto}.levelgroup button{border:0;background:transparent;color:#94a5bf;padding:9px 17px;border-radius:25px;font-size:12px;font-weight:600;text-transform:capitalize}.levelgroup .on{background:linear-gradient(110deg,#2dd4bf,#38bdf8);color:#062326;box-shadow:0 2px 16px #2dd4bf22}.preview{font-size:9px;letter-spacing:.1em;color:#7f92b0;border:1px solid #23354d;padding:6px 8px;border-radius:5px}.intro{display:flex;align-items:center;justify-content:space-between;padding:30px 0 26px;gap:20px}.eyebrow{font-size:9px;letter-spacing:.17em;color:#2dd4bf;font-weight:700}.intro h1{font-size:35px;letter-spacing:-.035em;margin:7px 0 8px;line-height:1.1}.intro p{font-size:13px;color:#9bacc4;margin:0}.safety-pill{display:flex;align-items:center;gap:10px;border:1px solid #2dd4bf30;border-radius:30px;padding:10px 14px;background:#2dd4bf07;color:#a2c2c2;font-size:11px;white-space:nowrap}.safety-pill span{color:#2dd4bf;font-size:18px}.safety-pill b{color:#5eead4;font-size:10px;border-left:1px solid #365152;padding-left:10px}.layout{display:grid;grid-template-columns:315px minmax(0,1fr);gap:20px;align-items:start}.card{border:1px solid #26334a;background:linear-gradient(135deg,#121e32ef,#0e1829f5);border-radius:16px;box-shadow:0 10px 40px #0002}.shelf{padding:18px;position:sticky;top:16px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.section-heading h2{font-size:17px;letter-spacing:-.02em;margin:3px 0 0}.section-heading>span{font-size:10px;color:#8ca0bd}.section-heading h3{font-size:13px}.muted{color:var(--muted)}.small{font-size:11px;line-height:1.6}.shelf p{margin:7px 0 14px}input{padding:11px 12px;border:1px solid #2c3b52;background:#060d1b99;border-radius:8px;width:100%;font-size:11px}input::placeholder{color:#8193b0}.cats{display:flex;flex-wrap:wrap;gap:5px;margin:12px 0 16px}.chip{border:1px solid #2c3c53;background:#ffffff03;color:#9cadc6;border-radius:20px;padding:6px 10px;font-size:10px;text-transform:capitalize;white-space:nowrap}.chip.on{color:#5eead4;background:#2dd4bf15;border-color:#2dd4bf70}.chip.caution{color:#f4b482}.tiles{display:grid;grid-template-columns:1fr 1fr;gap:9px;max-height:645px;overflow:auto;padding:1px}.tile{--color:#2dd4bf;min-width:0;border:1px solid color-mix(in srgb,var(--color) 32%,transparent);border-radius:10px;background:linear-gradient(155deg,color-mix(in srgb,var(--color) 12%,transparent),#ffffff02);overflow:hidden}.tile-main{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:11px 10px 9px;width:100%;background:none;border:0;min-height:112px}.part-symbol{font-family:ui-monospace,monospace;color:var(--color);font-size:22px;font-weight:700;line-height:1.3;margin-bottom:8px}.tile strong{font-size:11px;font-weight:600;line-height:1.3}.tile small{font-size:9px;line-height:1.45;color:#a1adc1;margin-top:5px}.tile-foot{display:flex;justify-content:space-between;align-items:center;padding:4px 8px;border-top:1px solid #ffffff07;font-size:8px;color:#8494ae;min-height:26px}.tile-foot span{max-width:85px}.tile-foot button{background:none;border:0;padding:0 2px;color:var(--color);font-size:14px}.library-note{border-top:1px solid #26354a;margin-top:15px;padding-top:13px;color:#8395b0;font-size:10px;line-height:1.8}.library-note span{color:#2dd4bf}main{min-width:0;display:flex;flex-direction:column;gap:18px}.bench,.results{padding:21px}.view-tabs{display:inline-flex;align-items:center;gap:3px;padding:3px;background:#060e1c;border:1px solid #23344b;border-radius:8px}.view-tabs button{background:none;border:0;color:#91a2ba;border-radius:5px;font-size:10px;padding:7px 12px}.view-tabs .on{color:#5eead4;background:#2dd4bf16}.examples{display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid #23344b;padding:16px 0}.examples .chip{font-size:10px}.schematic-top{display:flex;align-items:center;justify-content:space-between;padding:18px 0 0;gap:12px}.schematic-top h3{font-size:15px;margin:0 0 4px}.schematic-top span:not(.badge){font-size:11px;color:#8fa0b9}.badge{font-size:9px!important;color:#62d7c9!important;background:#2dd4bf0c;border:1px solid #2dd4bf35;border-radius:5px;padding:5px 8px;white-space:nowrap;letter-spacing:.05em}.badge.danger{color:#fda4af!important;border-color:#f43f5e66;background:#f43f5e0d}.circuit{display:block;width:100%;height:auto;max-height:315px;overflow:visible;margin:7px 0 8px}.schematic-part{cursor:pointer}.schematic-part:hover rect{stroke:#fff}.editor-heading{display:flex;align-items:center;justify-content:space-between;margin:13px 0 10px;gap:10px}.editor-heading h3{font-size:11px;font-weight:600;margin:0}.editor-heading span{color:#8193b0;font-size:9px}.connection-list{display:grid;grid-template-columns:1fr 1fr;gap:7px}.connection{background:#060e1c55;border:1px solid #25344c;border-radius:9px;display:flex;align-items:center;gap:8px;padding:8px;min-height:58px;min-width:0;flex-wrap:wrap}.connection.selected{border-color:#3c6675;background:#142b3a44}.part-id{background:none;border:0;min-width:40px;font:700 12px ui-monospace,monospace;padding:0;text-align:left}.part-id small{display:block;color:#91a3bd;font:9px ui-sans-serif,system-ui;margin-top:4px}.connection label{display:flex;align-items:center;gap:4px;color:#a3b2c8;font-size:9px}select{border:1px solid #33435c;border-radius:5px;background:#101d30;padding:5px 6px;font-size:10px;max-width:120px}option{background:#101d30}.remove{margin-left:auto;background:none;border:0;color:#8293ac;font-size:20px;padding:0 4px}.toggle{border:1px solid #34445b;background:#0b1424;border-radius:5px;font-size:9px;padding:6px;color:#9cabc1}.toggle.on{color:#5eead4;border-color:#2dd4bf55;background:#2dd4bf0a}.editor-tip{font-size:10px;color:#8396b2;line-height:1.7;margin:10px 0 16px}.controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:16px;border-top:1px solid #23344b}.controls label{font-size:10px;color:#90a2bc}.primary{border:0;border-radius:8px;background:linear-gradient(120deg,#2dd4bf,#38bdf8);color:#062325;font-size:11px;font-weight:700;padding:12px 20px;box-shadow:0 5px 16px #2dd4bf16}.controls .primary{margin-left:auto}.ghost{border:1px solid #2d3e57;color:#91a2be;font-size:10px;background:none;border-radius:6px;padding:9px 10px}.notice{font-size:11px;color:#5eead4;line-height:1.6;margin-bottom:0}.results{scroll-margin-top:20px}.metrics{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin:21px 0 16px}.metrics>div{min-width:0;background:#08111f88;border:1px solid #26364f;padding:15px 13px;border-radius:10px}.metrics span{font-size:8px;letter-spacing:.055em;color:#8e9fba;display:block;min-height:12px}.metrics strong{font-size:27px;font-family:ui-monospace,monospace;letter-spacing:-.055em;font-weight:500;display:block;margin:8px 0;color:#e1eff8}.metrics>div:first-child strong{color:#5eead4}.metrics small{display:block;color:#7f93b0;font-size:9px;line-height:1.6}.observation,.warning{display:flex;align-items:flex-start;gap:9px;padding:10px 12px;border:1px solid #2dd4bf33;border-radius:8px;background:#2dd4bf08;font-size:11px;line-height:1.6;margin:7px 0;color:#c0d5de}.observation>span{color:#2dd4bf}.warning{background:#f43f5e0a;border-color:#f43f5e40;color:#f4b7bf}.warning.subtle{color:#c2ac87;background:#f59e0b08;border-color:#f59e0b33}.lesson{display:flex;gap:13px;background:#38bdf809;border:1px solid #38bdf82b;padding:15px;border-radius:10px;margin-top:18px}.lesson>span{color:#52c9f0;font-size:23px}.lesson h3{font-size:12px;margin:0 0 6px}.lesson p{font-size:11px;line-height:1.85;color:#a9bad1;margin:0}.safety{border-top:1px solid #304057;margin-top:20px;padding-top:16px}.safety strong{font-size:10px;color:#f4bd79}.safety p{font-size:10px;line-height:1.8;color:#899bb7;margin:6px 0 0}.table-wrap{overflow:auto;margin:18px 0}.table-wrap table{width:100%;border-collapse:collapse;font-size:10px;min-width:420px;text-align:left}.table-wrap caption{color:#8193af;text-align:left;font-size:9px;margin-bottom:10px}.table-wrap th,.table-wrap td{border-bottom:1px solid #26354b;padding:11px 9px;white-space:nowrap}.table-wrap thead{font-size:9px;color:#8ca1c1}.table-wrap tbody td{font-family:ui-monospace,monospace}.table-wrap small{display:block;font-size:8px;font-weight:400;color:#879bb9;margin-top:4px}.bad{color:#fca5b0}.advanced{border-left:2px solid #38bdf8;padding:0 13px;margin:18px 0;font-size:10px;line-height:1.8;color:#a0b5d0}.advanced h3{font-size:11px;color:#c4ddf1;margin:0}.advanced p{margin:7px 0}.node-values{display:flex;gap:6px;flex-wrap:wrap}.node-values span{font-family:ui-monospace,monospace;padding:3px 6px;border:1px solid #2c425f;border-radius:4px;color:#7dd3fc}.textbtn{background:none;border:0;padding:0;color:#5eead4;font-size:10px}.chart-wrap{margin-top:18px;border:1px solid #26374d;border-radius:10px;padding:12px;background:#07101c66}.chart{width:100%;max-height:240px;display:block}.chart-wrap p{margin:0 5px}.lesson-large{padding:22px 0;font-size:13px;line-height:1.9;color:#b2c2d8}.lesson-large h3{color:#e6edf7}footer{display:flex;justify-content:space-between;gap:10px;padding:28px 0 0;color:#6e83a2;font-size:9px;line-height:1.6}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#030913d9;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:30;display:grid;place-items:center;padding:20px}.modal{position:relative;width:min(600px,100%);padding:30px;max-height:90vh;overflow:auto}.modal h2{font-size:25px;letter-spacing:-.02em;margin:12px 0 5px}.modal .part-number{color:#5eead4;font-family:ui-monospace,monospace;font-size:12px;margin-bottom:24px}.modal h3{font-size:12px;margin-top:23px}.modal li,.modal p{font-size:12px;line-height:1.9;color:#adbed3}.modal ul{padding-left:18px}.close{position:absolute;right:15px;top:10px;background:none;border:0;font-size:25px;color:#91a3bf}.source-link{font-size:12px}.modal .primary{margin-top:10px}.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:1500px){.layout{grid-template-columns:345px 1fr}.tiles{max-height:750px}.tile-main{min-height:120px}.circuit{max-height:350px}}@media(max-width:1150px){.app{padding:18px}.layout{grid-template-columns:270px minmax(0,1fr);gap:15px}.labword,.preview{display:none}.connection-list{grid-template-columns:1fr}.metrics strong{font-size:23px}.safety-pill{font-size:9px}.bench,.results{padding:17px}.controls .primary{margin-left:0}.metrics{gap:6px}.metrics>div{padding:12px 9px}}@media(max-width:800px){header{flex-wrap:wrap;justify-content:space-between;padding-bottom:15px;gap:12px}.brand strong{font-size:21px}.brand small{font-size:10px}.logo{width:42px;height:42px;font-size:34px}.levelgroup{margin-left:0}.levelgroup button{font-size:10px;padding:7px 11px}.intro{padding:24px 0 20px;align-items:flex-start;flex-direction:column;gap:16px}.intro h1{font-size:30px}.intro p{font-size:12px}.safety-pill{padding:7px 10px}.layout{display:flex;flex-direction:column}.shelf{width:100%;position:static;padding:15px}.tiles{grid-template-columns:repeat(4,minmax(0,1fr));max-height:220px}.tile-main{min-height:110px}.tile-foot{font-size:7px}.library-note{display:none}.cats{margin-bottom:12px}.shelf .small{margin:5px 0 10px}.section-heading h2{font-size:16px}main{width:100%}.circuit{max-height:none}.connection-list{grid-template-columns:1fr 1fr}.metrics strong{font-size:24px}.bench,.results{padding:16px}.intro .eyebrow,.section-heading .eyebrow{font-size:8px}footer{flex-direction:column}}@media(max-width:480px){.app{padding:15px 12px 23px}.brand{gap:10px}.levelgroup{width:100%;justify-content:center}.levelgroup button{flex:1}.intro h1{font-size:30px}.tiles{grid-template-columns:repeat(3,minmax(0,1fr));max-height:186px}.tile-main{padding:9px;min-height:104px}.part-symbol{font-size:18px;margin-bottom:6px}.tile strong{font-size:10px}.tile small{font-size:8px}.tile-foot{padding:3px 6px}.cats{gap:4px}.chip{padding:5px 8px;font-size:9px}.shelf .cats{max-height:63px;overflow:auto}.connection-list{grid-template-columns:1fr}.connection{min-height:51px}.editor-heading{align-items:flex-start;flex-direction:column;gap:4px}.metrics{grid-template-columns:1fr 1fr;gap:7px}.metrics>div:last-child{grid-column:1/-1}.metrics>div:last-child strong{display:inline-block;margin-right:15px}.metrics>div:last-child small{display:inline}.metrics strong{font-size:25px}.metrics span{font-size:7px}.section-heading h2{font-size:15px}.badge{font-size:7px!important;padding:4px 6px}.view-tabs button{padding:7px 9px;font-size:9px}.schematic-top{padding-top:14px}.schematic-top h3{font-size:13px}.schematic-top span:not(.badge){font-size:9px}.schematic-top .badge{font-size:7px!important}.controls{gap:6px}.controls .primary{font-size:10px;padding:11px 14px;margin-left:auto}.ghost{padding:8px;font-size:9px}.results .section-heading{gap:6px}.lesson{padding:12px;gap:9px}.lesson p{font-size:10px}.modal{padding:23px}.modal h2{font-size:22px}.circuit{margin:13px -6px 8px;width:calc(100% + 12px)}.chart-wrap .section-heading{flex-direction:column;align-items:flex-start;gap:2px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
