:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#e7edf2;background:#0e1114;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#0e1114}button{font:inherit}.appShell{display:grid;grid-template-columns:360px minmax(0,1fr);min-height:100vh}.sidebar{border-right:1px solid #26313b;background:#12171c;min-height:100vh;overflow:hidden}.sidebarHeader{padding:20px 18px 14px;border-bottom:1px solid #26313b}.sidebarHeader h1{margin:0;font-size:20px;line-height:1.2;font-weight:680;letter-spacing:0}.sidebarHeader p,.titleBlock p{margin:4px 0 0;color:#93a3af;font-size:13px}.sampleList{height:calc(100vh - 83px);overflow:auto;padding:10px}.sampleButton{width:100%;border:1px solid transparent;background:transparent;color:inherit;display:grid;grid-template-columns:108px minmax(0,1fr);gap:10px;align-items:center;padding:8px;margin:0 0 8px;border-radius:8px;cursor:pointer;text-align:left}.sampleButton:hover{background:#192028}.sampleButton.selected{background:#1d2934;border-color:#4b6f8c}.thumb{width:108px;height:68px;overflow:hidden;border:1px solid #2d3843;border-radius:6px;background:#11161b}.thumb svg{width:100%;height:100%;display:block}.thumbPlaceholder{display:grid;place-items:center;color:#6f8290;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.sampleText{min-width:0}.sampleName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:650}.sampleMeta{margin-top:5px;color:#91a1ad;font-size:12px;white-space:nowrap}.workspace{min-width:0;display:flex;flex-direction:column}.loadingState{min-height:100vh;display:grid;place-items:center;color:#93a3af;font-size:14px}.errorState{color:#ff9e9e}.topbar{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 22px;border-bottom:1px solid #26313b;background:#10151a}.eyebrow{color:#79a7c6;font-size:12px;font-weight:700;letter-spacing:0;text-transform:uppercase}.titleBlock h2{margin:3px 0 0;font-size:24px;line-height:1.18;font-weight:700;letter-spacing:0}.controls{display:flex;align-items:center;gap:8px}.segmented{display:flex;padding:3px;border:1px solid #2b3844;border-radius:8px;background:#151b21}.segmented button,.iconButton{border:0;color:#cbd6de;background:transparent;cursor:pointer}.segmented button{min-width:58px;height:30px;padding:0 10px;border-radius:6px;font-size:13px}.segmented button.active{color:#fff;background:#2d5f7b}.iconButton{width:36px;height:36px;border:1px solid #2b3844;border-radius:8px;background:#151b21;font-size:24px;line-height:1}.iconButton:hover,.segmented button:hover{background:#23303a}.stats{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:1px;border-bottom:1px solid #26313b;background:#26313b}.stats div{padding:12px 18px;background:#12181e}.stats span{display:block;color:#8fa0ad;font-size:12px}.stats strong{display:block;margin-top:3px;font-size:18px;letter-spacing:0}.viewerGrid{flex:1;min-height:0;display:grid;gap:14px;padding:14px;background:#0e1114}.viewerGrid.split{grid-template-columns:repeat(2,minmax(0,1fr))}.viewerGrid.pcb,.viewerGrid.srj{grid-template-columns:minmax(0,1fr)}.viewerPane{min-width:0;min-height:0;display:flex;flex-direction:column;border:1px solid #26313b;border-radius:8px;background:#12171c;overflow:hidden}.paneHeader{height:44px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #26313b}.paneHeader h3{margin:0;font-size:14px;font-weight:700}.paneHeader span{color:#8fa0ad;font-size:12px}.pcbViewerBox{flex:1;min-height:420px;overflow:hidden}.pcbViewerBox>*{width:100%;height:100%}.svgBox{flex:1;min-height:420px;overflow:auto}.svgFrame{min-width:100%;min-height:100%;display:grid;place-items:center;padding:12px}.svgFrame svg{max-width:100%;max-height:calc(100vh - 230px);height:auto;display:block}@media (max-width: 1100px){.appShell{grid-template-columns:1fr}.sidebar{min-height:auto;border-right:0;border-bottom:1px solid #26313b}.sampleList{height:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.viewerGrid.split{grid-template-columns:1fr}}@media (max-width: 720px){.topbar{align-items:flex-start;flex-direction:column}.controls,.segmented{width:100%}.segmented button{flex:1}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.sampleButton{grid-template-columns:96px minmax(0,1fr)}.thumb{width:96px}}
