.main-content{display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:20px}.main-content .canvas-section{background:rgba(252,252,252,.5333333333);border-radius:12px;overflow:hidden;position:relative}.main-content .canvas-section::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:12px;pointer-events:none;background:linear-gradient(to left, #e9f2f2 0%, rgba(233, 242, 242, 0) 10px),linear-gradient(to right, #e9f2f2 0%, rgba(233, 242, 242, 0) 10px),linear-gradient(to bottom, #e9f2f2 0%, rgba(233, 242, 242, 0) 10px),linear-gradient(to top, #e9f2f2 0%, rgba(233, 242, 242, 0) 10px)}.main-content .canvas-container{display:flex;flex-direction:column;align-items:stretch}.main-content .canvas-container h2{padding:20px 24px 16px;font-size:1.25rem;font-weight:600;color:#1e293b;border-bottom:1px solid #e2e8f0}.main-content #bezierCanvas{display:block;margin:20px;border:2px solid #e2e8f0;border-radius:8px;cursor:crosshair;background:#fff;--curve-point-size: 8;--curve-point-font-size: 12;--curve-point-distance: 12}.main-content .control-panel{display:flex;flex-direction:column;gap:20px}.main-content .control-panel-sub{display:flex;flex-direction:row;gap:20px;align-items:stretch;justify-content:center}.main-content .control-group{background:rgba(252,252,252,.5333333333);border-radius:12px;padding:20px;position:relative}.main-content .control-group h3{font-size:1.125rem;font-weight:600;color:#1e293b;margin-bottom:16px}.main-content .control-group::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:12px;pointer-events:none;background:linear-gradient(to left, #e9f2f2 0%, rgba(233, 242, 242, 0) 10px),linear-gradient(to right, #e9f2f2 0%, rgba(233, 242, 242, 0) 10px),linear-gradient(to bottom, #e9f2f2 0%, rgba(233, 242, 242, 0) 10px),linear-gradient(to top, #e9f2f2 0%, rgba(233, 242, 242, 0) 10px)}.main-content .canvas-setting{flex-grow:1}.main-content .config-info{flex-shrink:0;min-width:50%}.main-content .button-group{display:flex;gap:8px;margin-bottom:12px}.main-content .btn{padding:8px 16px;border:none;border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;flex:1}.main-content .btn-primary{background-color:#3b82f6;color:#fff}.main-content .btn-primary:hover{background-color:#2563eb}.main-content .btn-secondary{background-color:#6b7280;color:#fff}.main-content .btn-secondary:hover{background-color:#4b5563}.main-content .btn-outline{background-color:rgba(0,0,0,0);color:#374151;border:1px solid #d1d5db;width:100%}.main-content .btn-outline:hover{background-color:#f9fafb;border-color:#9ca3af}.main-content .info-text{font-size:.875rem;color:#6b7280;margin-top:8px}.main-content .checkbox-group{display:flex;flex-direction:column;gap:12px}.main-content .checkbox-label{display:flex;align-items:center;cursor:pointer;font-size:.875rem;color:#374151}.main-content .checkbox-label input[type=checkbox]{display:none}.main-content .checkmark{width:18px;height:18px;border:2px solid #d1d5db;border-radius:4px;margin-right:8px;position:relative;transition:all .2s ease}.main-content .checkbox-label input[type=checkbox]:checked+.checkmark{background-color:#3b82f6;border-color:#3b82f6}.main-content .checkbox-label input[type=checkbox]:checked+.checkmark::after{content:"";position:absolute;left:5px;top:2px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}.main-content .slider-group{margin-top:16px}.main-content .slider-group label{display:block;font-size:.875rem;color:#374151;margin-bottom:8px}.main-content input[type=range]{width:100%;height:6px;border-radius:3px;background:#e2e8f0;outline:none;-webkit-appearance:none}.main-content input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#3b82f6;cursor:pointer;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.2);margin-top:-2px}.main-content input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#3b82f6;cursor:pointer;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.2);margin-top:-2px}.main-content .config-section{margin-bottom:20px}.main-content .config-section h4{font-size:.875rem;font-weight:600;color:#374151;margin-bottom:8px}.main-content .config-section:last-child{margin-bottom:0}.main-content .coordinates-list{font-size:.875rem;color:#6b7280;line-height:1.5}.main-content .coordinate-item{display:flex;justify-content:space-between;margin-bottom:4px}.main-content .css-output{background-color:#f1f5f9;border:1px solid #e2e8f0;border-radius:6px;padding:12px;font-family:"Monaco","Menlo","Ubuntu Mono",monospace;font-size:.75rem;color:#1e293b;word-break:break-all;margin-bottom:12px}.main-content #bezierCanvas:hover{border-color:#3b82f6}.main-content .btn,.main-content .checkbox-label,.main-content input[type=range]{transition:all .2s ease}.main-content .control-group{transition:box-shadow .2s ease}@media only screen and (max-width: 800px){.main-content .container{padding:15px}.main-content header h1{font-size:2rem}.main-content .button-group{flex-direction:column}.main-content .btn{flex:none}.main-content #bezierCanvas{margin:15px;--curve-point-size: 12;--curve-point-font-size: 20;--curve-point-distance: 20}}/*# sourceMappingURL=bezier-style.css.map */