/* ===== Blueprint Neon — custom icon + visual theme ===== */
html[data-theme="light"]{--warnBg:#fde8e6}  /* only token no later layer defines; the rest live in premium.css / skins.css / ds.css */
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:-4px;--ic2:#22d3ee;flex-shrink:0;}
button:active .ic{--ic2:#fff;}
html[data-theme="light"] .ic{--ic2:#0891b2;}
html[data-theme="light"] #toolsWrap::before{background:linear-gradient(90deg,#fff,transparent);} html[data-theme="light"] #toolsWrap::after{background:linear-gradient(270deg,#fff,transparent);}
html[data-theme="light"] .tool{background:linear-gradient(180deg,#fff,#edf3fb);border-color:#cdd8e8;color:#44566f;}
html[data-theme="light"] .tool .ic{color:#23364f;}
html[data-theme="light"] .tool.active{background:linear-gradient(180deg,#fff4de,#ffe4b5);border-color:var(--accent);color:#9a5a00;box-shadow:0 0 0 1px var(--accent) inset,0 4px 14px #e0820a33;}
html[data-theme="light"] .tool.active .ic{color:#b86a00;--ic2:#0891b2;}
html[data-theme="light"] .pcard,html[data-theme="light"] .lcard,html[data-theme="light"] .libNote{background:#fff;border-color:#d6e0ee;}
html[data-theme="light"] #modal,html[data-theme="light"] #libSheet{background:#f6f9fd;border-top:1px solid #0891b244;}
html[data-theme="light"] .pcard button{background:#eaf1fb;color:#14202f;}
html[data-theme="light"] .hrow.cur{background:#dff4fa;} html[data-theme="light"] #logicPanel tr.lp-current td{background:#fff3c4;}
html[data-theme="light"] .plastic{stroke:#b9b29c;}
html[data-theme="light"] #bbGrad stop:nth-child(1){stop-color:#f6f2e8;} html[data-theme="light"] #bbGrad stop:nth-child(2){stop-color:#ddd6c4;}
html[data-theme="light"] .hole{fill:#1b2433;} html[data-theme="light"] .holeRing{stroke:#a69668;}
html[data-theme="light"] .label,html[data-theme="light"] .labelRow{fill:#6a7b95;} html[data-theme="light"] .leadline{stroke:#7b8697;}
html[data-theme="light"] .inBtn.on.active{background:#d9f5e5;} html[data-theme="light"] .inBtn.off.active{background:#fde3e0;}
html[data-theme="light"] #runBtn .ic{fill:#1a1005;}
#themeBtn .ic{width:19px;height:19px;}

/* logic panel: input toggles + compact tables for multi-output labs */
#logicPanel{max-height:48%;overflow-y:auto;}
#logicPanel table td,#logicPanel table th{padding:3px 6px;font-size:11px;}
.lpSw{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0;}
.lpSw button{flex:1;min-width:52px;padding:7px 6px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);color:var(--text);font-weight:700;font-size:12px;}
.lpSw button.on{background:#14402a;border-color:#3ecb7e;color:#7ff0b0;} .lpSw button b{margin-left:4px;}
html[data-theme="light"] .lpSw button.on{background:#d9f5e5;color:#0f6a3a;}

#resFlag{display:block !important;line-height:1.45;}
#results{max-width:calc(100% - 20px);}

/* ===== app icon logo, inspector, menu & panels ===== */
img.logo{width:30px;height:30px;border-radius:8px;box-shadow:0 0 14px #22d3ee44;background:none;object-fit:cover;}
#installBtn{display:none !important;}
#inspector{position:absolute;left:50%;transform:translateX(-50%);bottom:10px;width:min(94%,440px);display:none;z-index:27;padding:12px;border-radius:16px;background:rgba(14,22,36,.95);backdrop-filter:blur(10px);border:1px solid #22d3ee44;box-shadow:0 10px 30px #000a;color:var(--text);}
#inspector.show{display:block;}
.insHead{display:flex;align-items:center;gap:10px;} .insHead>.ic{width:30px;height:30px;color:var(--accent2);} .insHead div{flex:1;min-width:0;} .insHead b{display:block;font-size:14px;} .insHead small{color:var(--sub);font-size:11px;}
.insHead button,.insAct button{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--panel3);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:8px 12px;font-size:12px;font-weight:700;}
.insHead button{padding:6px;border:none;background:none;color:var(--sub);}
#inspector label{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:10px 0;font-size:12px;color:var(--sub);}
#inspector select{background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:9px;padding:7px 10px;font-size:13px;}
.insRead{display:flex;gap:8px;margin:8px 0;} .insRead div{flex:1;background:var(--panel2);border-radius:10px;padding:6px 8px;} .insRead span{display:block;font-size:10px;color:var(--sub);} .insRead b{color:var(--accent2);font-size:14px;}
.insHint{font-size:11.5px;color:var(--sub);margin:8px 0;} .insAct{display:flex;gap:8px;} .insAct button{flex:1;} .insAct .dng{color:var(--warn);}
html[data-theme="light"] #inspector{background:rgba(255,255,255,.96);box-shadow:0 10px 26px #28467030;}
#xWrap{position:fixed;inset:0;z-index:80;background:rgba(5,8,14,.66);backdrop-filter:blur(3px);display:none;align-items:flex-end;justify-content:center;}
#xWrap.show{display:flex;}
#xSheet{background:var(--panel);color:var(--text);width:min(100%,560px);max-height:90vh;display:flex;flex-direction:column;border-radius:20px 20px 0 0;border:1px solid var(--line);border-bottom:none;box-shadow:0 -10px 40px #000a;padding-bottom:env(safe-area-inset-bottom);}
#xHead{display:flex;align-items:center;gap:6px;padding:12px 14px 8px;border-bottom:1px solid var(--line);} #xHead h2{flex:1;margin:0;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#xHead button{background:none;border:none;color:var(--sub);padding:4px;} #xHead button[hidden]{display:none;}
#xBody{overflow-y:auto;padding:12px 14px 18px;touch-action:pan-y;-webkit-overflow-scrolling:touch;}
#xBody input,#xBody textarea,#xBody select{width:100%;box-sizing:border-box;background:var(--panel2);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:10px 12px;font-size:14px;margin:6px 0;font-family:inherit;}
#xBody textarea{resize:vertical;} #xBody input[type=checkbox]{width:auto;margin:0 8px 0 0;} #xBody input[type=color]{width:56px;height:40px;padding:2px;}
#xBody button{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--panel3);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:9px 12px;font-size:13px;font-weight:600;}
#xBody button:active,.mItem:active{transform:scale(.97);} #xBody button .ic{width:17px;height:17px;}
#xBody .pri{background:linear-gradient(180deg,#ffb020,#ff8a3d);color:#1a1005;border:none;} #xBody .dng{color:var(--warn);} #xBody .xFull{width:100%;margin-top:12px;}
#xBody .linkBtn{background:none;border:none;color:var(--accent2);padding:4px 6px;font-size:12px;}
.mList{display:flex;flex-direction:column;gap:8px;margin-bottom:10px;} .grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.mItem{display:flex !important;align-items:center;justify-content:flex-start !important;gap:12px;width:100%;box-sizing:border-box;padding:12px 14px !important;border-radius:14px !important;border:1px solid var(--line) !important;background:linear-gradient(180deg,var(--panel2),var(--panel)) !important;color:var(--text) !important;text-align:left;text-decoration:none;font-size:14px;}
.mItem .ic{width:24px !important;height:24px !important;color:var(--accent2);} .mItem span{flex:1;min-width:0;} .mItem small{display:block;color:var(--sub);font-size:11px;font-weight:500;margin-top:2px;}
.xRow{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0;} .xRow>button{flex:1;min-width:84px;}
.xMuted{color:var(--sub);font-size:12px;line-height:1.5;margin:6px 0;} .xH{font-size:13px;margin:16px 0 4px;color:var(--accent2);} .xLbl{display:block;font-size:12px;color:var(--sub);} .xChk{display:flex;align-items:center;font-size:13px;margin:8px 0;}
.xDet{border:1px solid var(--line);border-radius:12px;background:var(--panel2);margin:8px 0;padding:0 12px;} .xDet summary{padding:11px 0;font-weight:700;font-size:14px;cursor:pointer;} .xDet>div{padding:0 0 12px;font-size:13px;line-height:1.55;color:var(--text);} .xDet ul,.xDet ol{padding-left:18px;margin:6px 0;}
.xSearch{display:flex;align-items:center;gap:8px;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:0 10px;} .xSearch input{border:none !important;background:none !important;margin:0 !important;} .xSearch .ic{width:18px;height:18px;color:var(--sub);}
.xCard{text-align:center;padding:10px 4px;} .xCard>.ic{width:34px;height:34px;color:var(--accent2);} .aboutLogo{width:84px;height:84px;border-radius:20px;box-shadow:0 8px 24px #0006;}
.shPrev{position:relative;} .shPrev img{width:100%;border-radius:12px;border:1px solid var(--line);display:block;min-height:120px;background:var(--panel2);} #shBusy{position:absolute;inset:0;display:grid;place-items:center;} #shBusy[hidden]{display:none;}
.crumbs{display:flex;flex-wrap:wrap;gap:2px;align-items:center;margin-bottom:6px;font-size:12px;color:var(--sub);} .crumbs button{background:none !important;border:none !important;padding:4px 6px !important;color:var(--accent2) !important;font-size:12px !important;}
.nRow{display:flex;gap:6px;margin:6px 0;} .nRow>button{flex:0 0 auto;} .nRow>.nOpen{flex:1;justify-content:flex-start;text-align:left;gap:10px;} .nOpen span{flex:1;min-width:0;} .nOpen small{display:block;color:var(--sub);font-size:11px;font-weight:500;}
.aGrid{display:flex;flex-direction:column;gap:6px;padding-bottom:10px;} .aGrid label{font-size:12px;color:var(--sub);display:block;} .aColor{display:flex;align-items:center;gap:8px;}
#xBanner{display:flex;align-items:center;gap:8px;background:linear-gradient(90deg,var(--accent),var(--accent2));color:#10131a;padding:6px 12px;font-size:12px;font-weight:700;} #xBanner span{flex:1;} #xBanner button{background:none;border:none;color:inherit;padding:0;} #xBanner .ic{width:16px;height:16px;}
/* breadboard styles chosen in Admin */
html[data-board="graphite"] #bbGrad stop:nth-child(1){stop-color:#1d293c;} html[data-board="graphite"] #bbGrad stop:nth-child(2){stop-color:#0f1622;}
html[data-board="graphite"] .plastic{stroke:#2c3d5a;} html[data-board="graphite"] .hole{fill:#03060a;} html[data-board="graphite"] .holeRing{stroke:#7a6a45;} html[data-board="graphite"] .label,html[data-board="graphite"] .labelRow{fill:#7f93b2;} html[data-board="graphite"] .leadline{stroke:#d3dbe8;}
html[data-board="cream"] #bbGrad stop:nth-child(1){stop-color:#f6f2e8;} html[data-board="cream"] #bbGrad stop:nth-child(2){stop-color:#ddd6c4;}
html[data-board="cream"] .plastic{stroke:#b9b29c;} html[data-board="cream"] .hole{fill:#1b2433;} html[data-board="cream"] .holeRing{stroke:#a69668;} html[data-board="cream"] .label,html[data-board="cream"] .labelRow{fill:#6a7b95;} html[data-board="cream"] .leadline{stroke:#7b8697;}
html[data-board="blueprint"] #bbGrad stop:nth-child(1){stop-color:#1c4a8a;} html[data-board="blueprint"] #bbGrad stop:nth-child(2){stop-color:#0f2f5e;}
html[data-board="blueprint"] .plastic{stroke:#3b78c9;} html[data-board="blueprint"] .hole{fill:#061426;} html[data-board="blueprint"] .holeRing{stroke:#6fb1ff;} html[data-board="blueprint"] .label,html[data-board="blueprint"] .labelRow{fill:#a9cbff;} html[data-board="blueprint"] .leadline{stroke:#dbe8ff;}
html[data-board="pcb"] #bbGrad stop:nth-child(1){stop-color:#1f7a46;} html[data-board="pcb"] #bbGrad stop:nth-child(2){stop-color:#14522f;}
html[data-board="pcb"] .plastic{stroke:#0d3b22;} html[data-board="pcb"] .hole{fill:#06140c;} html[data-board="pcb"] .holeRing{stroke:#d6b25e;} html[data-board="pcb"] .label,html[data-board="pcb"] .labelRow{fill:#bfe3cc;} html[data-board="pcb"] .leadline{stroke:#e8e2cf;}

/* visitor design picker (Settings) */
.dsPick{margin:0 0 14px}.dsH{display:block;margin:0 0 8px;font-size:13px}
.dsPick [role=radiogroup]{display:flex;flex-direction:column;gap:6px}
.dsOpt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:44px;width:100%;text-align:left;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--panel2);color:var(--text);font:inherit;font-weight:700;font-size:13px}
.dsOpt small{color:var(--sub);font-weight:500;font-size:11px;line-height:1.35}
.dsOpt.on{border-color:var(--accent2);box-shadow:0 0 0 1px var(--accent2) inset}
.dsOpt:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}