:root{color-scheme:light;--bg: #e8ecf2;--bg-canvas: #e8edf5;--surface: #ffffff;--surface-elevated: #f1f4f8;--border: #b8c5d8;--text: #0f172a;--text-muted: #475569;--accent: #1d4ed8;--accent-soft: rgba(29, 78, 216, .12);--accent-active-bg: rgba(29, 78, 216, .16);--radius: 12px;--font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--tap-min: 48px}*,*:before,*:after{box-sizing:border-box}html{color-scheme:light}html,body{margin:0;min-height:100%;min-height:100dvh;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.55;-webkit-text-size-adjust:100%}#root{min-height:100%;min-height:100dvh}.app{min-height:100%;min-height:100dvh;display:flex;flex-direction:column}.header{flex-shrink:0;padding:max(.85rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) .65rem max(1rem,env(safe-area-inset-left));border-bottom:1px solid var(--border);background:linear-gradient(180deg,var(--surface) 0%,var(--bg) 100%)}.header-inner{max-width:1400px;margin:0 auto}.title{margin:0;font-size:clamp(1.2rem,2.5vw,1.4rem);font-weight:700;letter-spacing:-.02em;color:var(--text)}.subtitle{margin:.4rem 0 0;font-size:clamp(.875rem,2vw,.95rem);color:var(--text-muted);max-width:44rem}.main{flex:1;display:grid;grid-template-columns:1fr minmax(min(100%,280px),360px);grid-template-rows:1fr;gap:0;min-height:0}@media(max-width:900px){.main{grid-template-columns:1fr;grid-template-rows:minmax(240px,48dvh) auto}}@media(min-width:901px)and (max-width:1100px){.main{grid-template-columns:1fr minmax(260px,32vw)}}.canvas-wrap{position:relative;min-height:280px;height:100%;background:var(--bg-canvas)}@media(max-width:900px){.canvas-wrap{min-height:min(48dvh,480px)}}.canvas-wrap canvas{display:block;width:100%!important;height:100%!important;touch-action:none}.sidebar{display:flex;flex-direction:column;border-left:1px solid var(--border);background:var(--surface);max-height:calc(100dvh - 4rem);overflow:hidden}@media(max-width:900px){.sidebar{border-left:none;border-top:1px solid var(--border);max-height:none;flex:1;min-height:0;padding-bottom:env(safe-area-inset-bottom)}}.panel{padding:1rem max(1rem,env(safe-area-inset-right)) 1rem max(1rem,env(safe-area-inset-left));overflow-y:auto;-webkit-overflow-scrolling:touch}@media(pointer:coarse){.panel{padding:1.1rem max(1.1rem,env(safe-area-inset-right)) 1.1rem max(1.1rem,env(safe-area-inset-left))}}.parts-list{flex:0 0 auto;max-height:min(38vh,280px);border-bottom:1px solid var(--border)}@media(max-width:900px){.parts-list{max-height:min(30dvh,240px)}}@media(min-width:901px){.parts-list{max-height:42%}}.details{flex:1;min-height:160px}.panel-title{margin:0 0 .65rem;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted)}.part-buttons{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45rem}.part-btn{width:100%;min-height:var(--tap-min);text-align:left;padding:.65rem .85rem;border:2px solid var(--border);border-radius:var(--radius);background:var(--surface-elevated);color:var(--text);cursor:pointer;font:inherit;-webkit-tap-highlight-color:rgba(29,78,216,.12);transition:border-color .15s,background .15s,box-shadow .15s}@media(pointer:coarse){.part-btn{padding:.75rem 1rem;min-height:52px}}.part-btn:hover,.part-btn--hover{border-color:var(--accent);background:var(--accent-soft)}.part-btn--active{border-color:#0284c7;background:linear-gradient(135deg,#0ea5e938,#3b82f62e);box-shadow:inset 4px 0 #0ea5e9,0 0 0 2px #0ea5e973,0 6px 24px #0ea5e933}.part-btn--active .part-btn-label{color:#0c4a6e;font-weight:750}.part-btn--active .part-btn-short{color:#0369a1}.part-btn-label{display:block;font-weight:650;font-size:.95rem}.part-btn-short{display:block;font-size:.8rem;color:var(--text-muted);margin-top:.2rem;line-height:1.35}.details-content{animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.details-heading{margin:0 0 .5rem;font-size:1.1rem;color:var(--text)}.details-desc{margin:0 0 1rem;font-size:.95rem;color:var(--text-muted)}.details-specs-title{margin:0 0 .45rem;font-size:.82rem;font-weight:700;color:var(--text)}.details-specs{margin:0 0 1.1rem;padding-left:1.15rem;font-size:.9rem;color:var(--text-muted)}.details-specs li{margin-bottom:.4rem}.details-placeholder{margin:0;font-size:.95rem;color:var(--text-muted)}.clear-btn{min-height:var(--tap-min);padding:.55rem 1rem;font:inherit;font-size:.875rem;font-weight:600;border-radius:var(--radius);border:2px solid var(--border);background:var(--surface-elevated);color:var(--text-muted);cursor:pointer;-webkit-tap-highlight-color:rgba(29,78,216,.1)}.clear-btn:hover,.clear-btn:active{color:var(--text);border-color:var(--text-muted);background:var(--surface)}