*{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{font-family:system-ui,-apple-system,sans-serif;background:#1a1d23;color:#e8eaed;height:100vh;min-height:100%;display:flex;flex-direction:column;overflow:hidden}#app{flex:1;display:flex;flex-direction:row;min-height:0;width:100%;max-width:1600px;margin:0 auto}.sidebar{flex:0 0 232px;display:flex;flex-direction:column;gap:.85rem;padding:1.5rem 1.1rem;border-right:1px solid #3c4043;overflow-y:auto;background:#202329}.sidebar-title{font-size:1.15rem;font-weight:600;color:#e8eaed;letter-spacing:.01em}.sidebar-sub{font-size:.75rem;color:#9aa0a6;margin-top:-.6rem}.sidebar-btn{width:100%;padding:.6rem .8rem;font-size:.9rem;font-weight:500}.sidebar-btn--ghost{margin-top:auto}.sidebar-hint{font-size:.72rem;line-height:1.45;color:#9aa0a6;margin-top:-.4rem}.sidebar-state{display:flex;flex-direction:column;gap:.6rem}.block-card{background:#1a1d23;border:1px solid #3c4043;border-radius:6px;padding:.6rem .7rem;font-size:.75rem;line-height:1.5}.block-card h3{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:#8ab4f8;margin-bottom:.35rem}.block-card .row{display:flex;justify-content:space-between;gap:.5rem;font-family:JetBrains Mono,monospace;color:#bdc1c6}.block-card .row .key{color:#9aa0a6}.block-card .status{margin-top:.35rem;font-weight:500}.block-card .status.faced{color:#81c995}.block-card .status.partial{color:#fdd663}.block-card .status.approaching{color:#9aa0a6}.block-card .status.exhausted{color:#f28b82}.debug-panel{margin-top:1rem;border:1px solid #3c4043;border-radius:6px;background:#13151a;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;line-height:1.35}.debug-panel-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.4rem .5rem;border-bottom:1px solid #3c4043}.debug-panel-title{font-weight:500;color:#9aa0a6;font-size:10px}.debug-panel-actions{display:flex;gap:.25rem}.debug-panel-btn{font-size:9px;padding:.15rem .35rem;border:1px solid #3c4043;border-radius:3px;background:#1a1d23;color:#c8ccd0;cursor:pointer}.debug-panel-btn:hover{background:#2a2d33}.debug-panel-body{margin:0;padding:.4rem .5rem;max-height:180px;overflow:auto;color:#bdc1c6;white-space:pre-wrap;word-break:break-word}.main{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden;padding:0 1.5rem .75rem}.tab-bar{flex-shrink:0;display:flex;gap:.35rem;margin:0 -1.5rem .75rem;padding:1.5rem 1.5rem .35rem;background:#1a1d23;border-bottom:1px solid #3c4043}.tab-btn{background:transparent;border:1px solid transparent;border-radius:6px 6px 0 0;color:#9aa0a6;padding:.55rem 1.1rem;font-size:.9rem;font-weight:500;cursor:pointer}.tab-btn:hover{background:#2a2d33;color:#e8eaed}.tab-btn.active{background:#252830;border-color:#3c4043;border-bottom-color:#252830;color:#8ab4f8;margin-bottom:-1px}.tab-btn[data-tab=common].active{color:#81c995}.tab-panels{flex:1;display:flex;flex-direction:column;min-height:0}.tab-panel{display:none}.tab-panel:not(.active){display:none!important}.tab-panel.active{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.common-panel.active{overflow-y:auto}.common-panel footer{margin-top:1.5rem;display:flex;align-items:center;gap:1rem;justify-content:center;flex-wrap:wrap}.jaw-panel{flex:1;min-height:0;background:#252830;border-radius:8px;padding:.75rem 1rem 1rem;border:1px solid #3c4043}.jaw-panel .controls,.jaw-panel .readouts{flex-shrink:0}.controls{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.5rem}.knob-row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem}.knob-group{display:flex;align-items:center;gap:.25rem}.knob-group label{font-size:.7rem;color:#9aa0a6;width:2.5rem;flex-shrink:0}.knob-input{width:3rem;padding:.15rem .25rem;font-size:.8rem;font-family:monospace;text-align:center;background:#1a1d23;border:1px solid #5f6368;border-radius:4px;color:#e8eaed;-moz-appearance:textfield}.knob-input::-webkit-outer-spin-button,.knob-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}body.knob-angles-hidden .knob-input,body.knob-angles-hidden .knob-reset{display:none}.knob-step{flex:0 0 auto;width:22px;height:22px;padding:0;font-size:.9rem;line-height:1;display:flex;align-items:center;justify-content:center;background:#3c4043;border:1px solid #5f6368;border-radius:4px;color:#e8eaed;cursor:pointer}.knob-step:hover{background:#5f6368}.knob-step:active{background:#1a73e8;border-color:#1a73e8}.knob-reset{font-size:.75rem;color:#9aa0a6}.apply-knobs,.knob-row-btn{align-self:center;padding:.25rem .65rem;font-size:.8rem;line-height:1.2;min-height:28px}button{background:#3c4043;color:#e8eaed;border:1px solid #5f6368;border-radius:4px;padding:.4rem .8rem;cursor:pointer;font-size:.85rem}button:hover{background:#5f6368}button.primary{background:#1a73e8;border-color:#1a73e8}button.primary:hover{background:#1967d2}button:disabled,button.primary:disabled{background:#2a2d33;border-color:#3c4043;color:#5f6368;cursor:not-allowed}.readouts{font-size:.8rem;font-family:monospace;color:#bdc1c6;margin-bottom:.75rem;line-height:1.5}.jaw-views{flex:1;display:grid;grid-template-columns:2fr 1fr;gap:.75rem;align-items:stretch;min-height:0;overflow-y:auto}.view-component{background:#1e2128;border:1px solid #3c4043;border-radius:8px;padding:.85rem;min-width:0;display:flex;flex-direction:column}.view-component .canvas-wrap{flex:1;min-height:0}.canvas-aspect-wrap{display:flex;align-items:center;justify-content:center;min-width:0}.view-component--face .canvas-aspect-wrap{flex:1}.canvas-wrap--face{flex:1;min-height:0}.view-title{font-size:.8rem;font-weight:600;color:#8ab4f8;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.65rem}.canvas-wrap{display:flex;flex-direction:column;gap:.25rem}canvas{background:#1a1d23;border-radius:4px;border:1px solid #3c4043;width:100%;height:auto}.view-component .canvas-wrap canvas{flex:1;min-height:0;height:100%}.view-component .canvas-aspect-wrap canvas{flex:none;width:auto!important;height:auto!important;max-width:100%;max-height:100%;aspect-ratio:25 / 40;object-fit:contain}.view-3d-wrap{min-height:0}.view-3d{width:100%;flex:1;min-height:0;background:#1a1d23;border-radius:4px;border:1px solid #3c4043;overflow:hidden;position:relative}.view-3d canvas{display:block;width:100%!important;height:100%!important;border:none;border-radius:0}.view-3d-legend{display:flex;flex-wrap:wrap;gap:.5rem;font-size:.6rem;color:#9aa0a6;margin-top:.25rem;align-items:center}.view-toggle{display:inline-flex;align-items:center;gap:.3rem;cursor:pointer;-webkit-user-select:none;user-select:none}.view-toggle input{margin:0;accent-color:#8ab4f8}.sidebar-toggle{font-size:.75rem;color:#bdc1c6;padding:.35rem .1rem}@media (max-width: 1024px){#app{height:100vh;min-height:0;flex-direction:column}.sidebar{flex:none;width:100%;border-right:none;border-bottom:1px solid #3c4043;flex-direction:row;flex-wrap:wrap;align-items:center}.sidebar-title,.sidebar-sub{width:100%}.sidebar-btn{width:auto}.sidebar-btn--ghost{margin-top:0}.sidebar-hint{width:100%;margin-top:0}.sidebar-state{flex-direction:row;flex-wrap:wrap;flex:1 1 100%}.block-card{flex:1 1 240px}.jaw-views{grid-template-columns:1fr}.view-3d{min-height:240px}}.view-3d-legend .swatch{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:4px;vertical-align:middle}.view-3d-legend .swatch.blade{background:#1a73e8}.view-3d-legend .swatch.clamp{background:#81c784}.view-3d-legend .swatch.base{background:#1b5e20}.view-3d-legend .swatch.face{background:#8ab4f8}.view-3d-legend .swatch.guide{background:#8ab4f88c;border:1px dashed #8ab4f8}.view-3d-legend .swatch.axis-x{background:#f28b82}.view-3d-legend .swatch.axis-y{background:#81c995}.view-3d-legend .swatch.gravity{background:#f4b400}.view-3d-legend .swatch.cut{background:#f28b82}.match-panel{background:#252830;border-radius:8px;padding:1rem;border:1px solid #3c4043}.match-panel h2{font-size:1.1rem;margin-bottom:.75rem;color:#81c995}.match-content{display:flex;gap:1.5rem;align-items:flex-start;flex-wrap:wrap}.match-info{flex:1;min-width:200px;font-size:.9rem;line-height:1.6}.match-score{font-size:1.4rem;font-weight:600;color:#81c995}.match-hint{color:#fdd663;margin-top:.5rem}.match-actions{margin-top:.75rem}.hint{font-size:.8rem;color:#9aa0a6}.history-carousel{display:flex;flex-direction:column;gap:.4rem;margin-top:.25rem;flex-shrink:0}.carousel-nav{display:flex;align-items:center;justify-content:center;gap:.5rem}.carousel-btn{width:28px;height:28px;padding:0;font-size:1.1rem;line-height:1;display:flex;align-items:center;justify-content:center;background:#3c4043;border:1px solid #5f6368;border-radius:4px;color:#e8eaed;cursor:pointer}.carousel-btn:hover:not(:disabled){background:#5f6368}.carousel-btn:disabled{opacity:.35;cursor:default}.carousel-indicator{font-size:.75rem;color:#9aa0a6;font-family:monospace;min-width:7rem;text-align:center}.carousel-track{display:flex;gap:.4rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.25rem 0;scrollbar-width:thin;scrollbar-color:#5f6368 #1a1d23}.carousel-track::-webkit-scrollbar{height:4px}.carousel-track::-webkit-scrollbar-track{background:#1a1d23;border-radius:2px}.carousel-track::-webkit-scrollbar-thumb{background:#5f6368;border-radius:2px}.carousel-thumb{flex:0 0 auto;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.2rem;background:#1a1d23;border:2px solid #3c4043;border-radius:4px;cursor:pointer;transition:border-color .15s}.carousel-thumb:hover{border-color:#5f6368}.carousel-thumb.active{border-color:#8ab4f8;box-shadow:0 0 0 1px #8ab4f8}.carousel-thumb canvas{display:block;width:52px;height:40px;border:none;border-radius:2px}.carousel-thumb--face canvas{width:40px;height:64px}.carousel-thumb-label{font-size:.65rem;color:#9aa0a6;font-family:monospace;line-height:1}