:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#213547;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}button{border-radius:6px;border:1px solid #ccc;padding:.4em .9em;font-size:.9em;font-weight:500;font-family:inherit;background-color:#f9f9f9;cursor:pointer}button:hover{border-color:#2563eb}#root{width:100%;height:100vh;margin:0;padding:0}.view-shell{display:flex;flex-direction:column;width:100%;height:100vh}.view-switcher{display:flex;gap:.4rem;flex-shrink:0;padding:.4rem .6rem;background:#1f2937}.view-switcher button{padding:.3rem .9rem;font-size:.8rem;border-radius:5px;border:1px solid #374151;background:#111827;color:#d1d5db}.view-switcher button.active{background:#2563eb;border-color:#2563eb;color:#fff}.view-body{flex:1;min-height:0}.app{display:flex;width:100%;height:100%}.toolbar{width:240px;flex-shrink:0;background:#fafafa;border-right:1px solid #e0e0e0;padding:1rem;text-align:left;overflow-y:auto}.toolbar h2{margin:0;font-size:1.1rem}.toolbar-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;position:relative}.info-icon{width:20px;height:20px;padding:0;border-radius:50%;font-size:.75rem;font-style:italic;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center}.info-popover{position:relative;background:#fffbeb;border:1px solid #fde68a;border-radius:6px;padding:.6rem 1.6rem .6rem .6rem;margin-bottom:1rem;font-size:.75rem;color:#78350f}.info-popover ul{margin:0;padding-left:1rem;display:flex;flex-direction:column;gap:.35rem}.info-close{position:absolute;top:4px;right:4px;width:18px;height:18px;padding:0;line-height:1;border:none;background:transparent;font-size:.9rem;cursor:pointer}.toolbar h3{margin:0 0 .5rem;font-size:.9rem;color:#555}.toolbar-section{margin-top:1.5rem;padding-top:1rem;border-top:1px solid #e0e0e0}.save-load-section{display:flex;gap:.5rem;margin-top:0;padding-top:0;border-top:none;margin-bottom:1rem}.save-load-section button{flex:1;font-size:.8rem}.toolbar-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.toolbar-row input[type=number]{width:70px;padding:.25rem}.point-list{list-style:none;margin:0 0 .5rem;padding:0;max-height:200px;overflow-y:auto;font-size:.85rem;color:#333}.point-list li{padding:.15rem .3rem;cursor:pointer;border-radius:4px;display:flex;align-items:center;justify-content:space-between;gap:.25rem}.point-list li:hover{background:#eee}.point-list li.selected{background:#fed7aa;color:#c2410c;font-weight:600}.point-list li.editing{display:flex;flex-direction:column;align-items:stretch;gap:.25rem;cursor:default}.point-edit-row{display:flex;align-items:center;gap:.15rem}.point-edit-input{width:48px;padding:.1rem .2rem;font-size:.8rem;border:1px solid #c2410c;border-radius:3px;background:#fff;color:#c2410c;font-weight:600}.point-copy-input{width:100%;box-sizing:border-box;padding:.15rem .3rem;font-size:.75rem;border:1px solid #ddd;border-radius:3px;background:#fff7ed;color:#7c2d12;cursor:text}.point-delete{flex-shrink:0;width:18px;height:18px;padding:0;line-height:1;font-size:.85rem;border-radius:4px}.mode-toggle{display:flex;gap:.4rem}.mode-toggle button{flex:1;font-size:.8rem;padding:.4rem .3rem}.mode-toggle button.active{background:#2563eb;border-color:#2563eb;color:#fff}.library-panel{width:220px;background:#f0fdf4;border-right:1px solid #bbf7d0}.library-panel h2{margin-bottom:1rem;font-size:1rem}.library-panel .toolbar-section:first-of-type{margin-top:0;padding-top:0;border-top:none}.transform-panel{background:#f5f3ff;border-right:1px solid #ddd6fe}.transform-hint{font-size:.75rem;color:#6d28d9;margin:0 0 .5rem}.panel-tabs{margin-bottom:1rem}.curve-item{display:block;cursor:pointer;padding:.3rem}.curve-item.selected{background:#ffedd5;color:#c2410c;font-weight:600}.curve-item-row{display:flex;align-items:center;justify-content:space-between}.curve-item button{padding:.1rem .4rem;font-size:.75rem}.curve-order{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.3rem}.curve-fill-row{display:flex;align-items:center;gap:.4rem;margin-top:.3rem;font-size:.75rem;cursor:default}.curve-fill-row label{display:flex;align-items:center;gap:.25rem}.curve-fill-row input[type=color]{width:22px;height:18px;padding:0;border:none;cursor:pointer}.fill-controls{background:#fff;border:1px solid #ddd6fe;border-radius:8px;padding:.5rem;margin-bottom:.75rem;font-size:.8rem}.fill-controls input[type=color]{width:24px;height:20px;padding:0;border:none;cursor:pointer}.curve-order-chip{display:inline-flex;align-items:center;gap:.15rem;background:#eef2ff;border-radius:4px;padding:.1rem .25rem;font-size:.7rem}.curve-order-chip button{padding:0 .2rem;font-size:.65rem;line-height:1.2}.equation-pieces{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.5rem}.equation-piece{border:1px solid #e0e0e0;border-radius:6px;padding:.4rem}.equation-piece input[type=text]{flex:1;padding:.25rem;min-width:0}.curve-options{display:flex;flex-direction:column;gap:.75rem;max-height:calc(100vh - 10rem);overflow-y:auto;padding-right:.25rem}.curve-option{border:1px solid #ddd6fe;border-radius:8px;padding:.6rem;background:#fff}.curve-option h3{margin:0 0 .25rem}.curve-option p{margin:0 0 .5rem;font-size:.75rem;color:#666}.curve-option button:disabled{opacity:.5;cursor:not-allowed}.canvas-area{flex:1;display:flex;align-items:center;justify-content:center;background:#f0f0f0;overflow:auto}.canvas{background:#fff;box-shadow:0 0 0 1px #ddd;transform-origin:center center;display:block}.canvas.mode-add{cursor:crosshair}.canvas.mode-select{cursor:grab}.canvas.mode-select:active{cursor:grabbing}.canvas-wrap{position:relative;overflow:hidden}.zoom-controls{position:absolute;top:8px;right:8px;display:flex;align-items:center;gap:4px;background:#ffffffe6;border:1px solid #ddd;border-radius:6px;padding:4px 6px;z-index:1}.zoom-controls button{padding:.15rem .5rem;line-height:1}.zoom-icon{font-size:.9rem;margin-right:2px}