html,body,#root{color:#f3f4f6;background-color:#121316;width:100vw;height:100vh;margin:0;padding:0;font-family:Inter,system-ui,-apple-system,sans-serif;overflow:hidden}:root{--bg-primary:#121316;--bg-secondary:#1a1c22;--bg-tertiary:#22252c;--bg-glass:#1a1c22bf;--border-color:#2c2f3a;--border-color-active:#244a73;--text-main:#f3f4f6;--text-muted:#9ca3af;--accent-color:#244a73;--accent-color-hover:#17304b;--accent-bg:#244a7326;--success-color:#10b981;--error-color:#ef4444;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-mono:"SFMono-Regular", Consolas, Monaco, monospace}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--text-main);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;overflow:hidden}.app-container{background-color:var(--bg-primary);width:100vw;height:100vh;display:flex;overflow:hidden}@media (width<=900px){.app-container{height:100vh;flex-direction:column;height:-webkit-fill-available}}.viewer-section{background-color:#16171d;flex:1;height:100%;position:relative}@media (width<=900px){.viewer-section{border-bottom:1px solid var(--border-color);flex:none;width:100%;height:42vh}}.viewer-ui-overlay-container{z-index:100;flex-direction:column;align-items:center;gap:10px;width:max-content;max-width:90%;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}@media (width<=900px){.viewer-ui-overlay-container{gap:8px;bottom:12px}}.viewer-orientation-overlay{background:var(--bg-glass);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-color);border-radius:30px;gap:8px;padding:6px 10px;display:flex;box-shadow:0 10px 25px #00000059}@media (width<=900px){.viewer-orientation-overlay{padding:4px 8px}}.viewer-icon-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:20px;justify-content:center;align-items:center;padding:6px 12px;transition:all .2s;display:flex}@media (width<=900px){.viewer-icon-btn{padding:4px 8px}}.viewer-icon-btn.active,.viewer-icon-btn:hover{background-color:var(--accent-color);color:var(--text-main);box-shadow:0 2px 10px #244a7366}.viewer-controls-overlay{background:var(--bg-glass);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-color);border-radius:30px;gap:8px;padding:6px 12px;display:flex;box-shadow:0 10px 25px #00000059}@media (width<=900px){.viewer-controls-overlay{padding:4px 10px}}.viewer-overlay-btn{color:var(--text-muted);font-family:var(--font-sans);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:20px;padding:6px 12px;font-size:13px;font-weight:500;transition:all .2s}@media (width<=900px){.viewer-overlay-btn{padding:4px 10px;font-size:11px}}.viewer-overlay-btn.active,.viewer-overlay-btn:hover{background-color:var(--accent-color);color:var(--text-main);box-shadow:0 2px 10px #244a7366}.controls-section{background-color:var(--bg-secondary);border-left:1px solid var(--border-color);flex-direction:column;width:420px;height:100%;display:flex;overflow-y:auto;box-shadow:-5px 0 25px #0003}@media (width<=900px){.controls-section{-webkit-overflow-scrolling:touch;border-left:none;flex:1;width:100%;height:58vh;overflow-y:auto}}.controls-header{border-bottom:1px solid var(--border-color);background:linear-gradient(135deg, var(--bg-tertiary), var(--bg-secondary));padding:24px}@media (width<=900px){.controls-header{padding:16px}}.controls-header h1{color:var(--text-main);letter-spacing:-.5px;font-size:24px;font-weight:800;line-height:1.2}@media (width<=900px){.controls-header h1{font-size:18px}}.controls-header p{color:var(--text-muted);margin-top:6px;font-size:13px}@media (width<=900px){.controls-header p{margin-top:4px;font-size:11px}}.controls-content{flex-direction:column;flex:1;gap:28px;padding:24px;display:flex}@media (width<=900px){.controls-content{gap:20px;padding:16px}}.control-group{flex-direction:column;gap:12px;display:flex}@media (width<=900px){.control-group{gap:10px}}.group-title{text-transform:uppercase;letter-spacing:1px;color:#fff;padding-bottom:8px;font-size:13px;font-weight:700}@media (width<=900px){.group-title{padding-bottom:6px;font-size:11px}}.group-title-toggle{border:none;border-bottom:1px solid var(--border-color);cursor:pointer;text-align:left;background:0 0;justify-content:space-between;align-items:center;width:100%;padding:0;display:flex}.group-title-toggle .group-title{border-bottom:none;padding-bottom:8px}.group-chevron{color:var(--text-muted);flex-shrink:0;margin-bottom:8px;transition:transform .2s}.group-chevron.open{transform:rotate(180deg)}.control-group-body{grid-template-rows:1fr;transition:grid-template-rows .25s;display:grid}.control-group-body.collapsed{grid-template-rows:0fr}.control-group-body-inner{flex-direction:column;gap:12px;min-height:0;display:flex;overflow:hidden}.slider-container{flex-direction:column;gap:6px;display:flex}.slider-label-row{justify-content:space-between;font-size:14px;font-weight:500;display:flex}@media (width<=900px){.slider-label-row{font-size:12px}}.slider-value{font-family:var(--font-mono);color:#fff;font-weight:700}.slider-input{-webkit-appearance:none;background:var(--bg-tertiary);cursor:pointer;border-radius:3px;outline:none;width:100%;height:6px;margin:10px 0}.slider-input::-webkit-slider-thumb{appearance:none;background:var(--accent-color);cursor:pointer;border-radius:50%;width:18px;height:18px;transition:transform .1s;box-shadow:0 0 10px #244a7380}.slider-input::-webkit-slider-thumb:hover{transform:scale(1.2)}.btn-toggle-group{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.btn-toggle-group.two-cols{grid-template-columns:repeat(2,1fr)}.btn-toggle-group.four-cols{grid-template-columns:repeat(4,1fr)}.btn-toggle-group.five-cols{grid-template-columns:repeat(5,1fr)}@media (width<=900px){.btn-toggle-group.four-cols{grid-template-columns:repeat(2,1fr)}.btn-toggle-group.five-cols{grid-template-columns:repeat(3,1fr)}}.toggle-btn{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-muted);cursor:pointer;border-radius:8px;padding:10px;font-size:13px;font-weight:600;transition:all .2s}@media (width<=900px){.toggle-btn{border-radius:6px;padding:8px;font-size:11px}}.toggle-btn:hover{border-color:var(--text-muted);color:var(--text-main)}.toggle-btn.active{background-color:var(--accent-bg);border-color:var(--accent-color);color:var(--text-main)}.shape-btn-content{flex-direction:column;align-items:center;gap:6px;display:flex}.shape-icon{opacity:.5;transition:opacity .2s,stroke .2s}.toggle-btn:hover .shape-icon{opacity:.8}.toggle-btn.active .shape-icon{opacity:1;stroke:var(--text-main)}.upload-card{background-color:var(--bg-tertiary);border:1px dashed var(--border-color);border-radius:12px;flex-direction:column;gap:12px;padding:18px;transition:all .2s;display:flex}@media (width<=900px){.upload-card{border-radius:8px;gap:8px;padding:12px}}.upload-card:hover{border-color:var(--accent-color)}.upload-card-header{justify-content:space-between;align-items:center;display:flex}.upload-card-title{font-size:14px;font-weight:600}@media (width<=900px){.upload-card-title{font-size:12px}}.file-input-wrapper{width:100%;display:inline-block;position:relative;overflow:hidden}.file-input-wrapper input[type=file]{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;top:0;left:0}.upload-btn{background-color:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-main);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:10px;font-size:13px;font-weight:600;transition:all .2s;display:flex}@media (width<=900px){.upload-btn{border-radius:6px;padding:8px;font-size:11px}}.upload-btn:hover{background-color:var(--bg-tertiary);border-color:var(--text-muted)}.preview-row{align-items:center;gap:12px;display:flex}@media (width<=900px){.preview-row{gap:8px}}.preview-thumbnail{border:1px solid var(--border-color);object-fit:cover;background-color:#000;border-radius:4px;width:48px;height:144px}@media (width<=900px){.preview-thumbnail{width:36px;height:108px}}.preview-info{flex-direction:column;flex:1;gap:4px;display:flex}.preview-filename{white-space:nowrap;text-overflow:ellipsis;max-width:250px;font-size:13px;font-weight:600;overflow:hidden}@media (width<=900px){.preview-filename{max-width:180px;font-size:11px}}.preview-dimensions{color:var(--text-muted);font-size:11px;font-family:var(--font-mono)}@media (width<=900px){.preview-dimensions{font-size:9px}}.sidecut-feel{background-color:var(--accent-bg);border:1px solid #244a7359;border-radius:6px;flex-direction:column;gap:3px;margin-top:6px;padding:8px 10px;display:flex}.sidecut-feel-label{color:#7bb3ec;text-transform:uppercase;letter-spacing:.5px;font-size:11px;font-weight:700}.sidecut-feel-desc{color:var(--text-muted);font-size:11px;line-height:1.4}@media (width<=900px){.sidecut-feel-label,.sidecut-feel-desc{font-size:10px}}.validation-message{border-radius:6px;padding:8px 10px;font-size:11px;line-height:1.4}@media (width<=900px){.validation-message{padding:6px 8px;font-size:9px}}.validation-message.success{color:var(--success-color);background-color:#10b9811a;border:1px solid #10b98133}.validation-message.warning{color:#ff9f43;background-color:#ef444414;border:1px solid #ff9f4333}.remove-btn{color:var(--error-color);cursor:pointer;text-align:left;background:0 0;border:none;width:fit-content;font-size:11px;text-decoration:underline}.sidebar-actions{border-top:1px solid var(--border-color);background-color:var(--bg-tertiary);flex-direction:column;gap:12px;padding:24px;display:flex}@media (width<=900px){.sidebar-actions{gap:8px;padding:16px}}.primary-btn{background-color:var(--accent-color);color:var(--text-main);cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:10px;width:100%;padding:14px 20px;font-size:15px;font-weight:700;transition:all .2s;display:flex;box-shadow:0 4px 15px #244a7366}@media (width<=900px){.primary-btn{border-radius:6px;padding:10px 16px;font-size:13px}}.primary-btn:hover{background-color:var(--accent-color-hover);transform:translateY(-1px)}.secondary-btn{color:var(--text-main);border:1px solid var(--border-color);cursor:pointer;background-color:#0000;border-radius:8px;width:100%;padding:12px 20px;font-size:13px;font-weight:600;transition:all .2s}@media (width<=900px){.secondary-btn{border-radius:6px;padding:10px 16px;font-size:11px}}.secondary-btn:hover{background-color:var(--bg-secondary);border-color:var(--text-muted)}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background-color:#000000d9;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.3s fadeIn;display:flex;position:fixed;top:0;left:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;flex-direction:column;width:520px;max-width:90%;max-height:90vh;animation:.3s cubic-bezier(.16,1,.3,1) slideUp;display:flex;overflow:hidden;box-shadow:0 15px 50px #00000080}@media (width<=900px){.modal-card{border-radius:12px}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.modal-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}@media (width<=900px){.modal-header{padding:14px 16px}}.modal-header h2{font-size:20px;font-weight:800}@media (width<=900px){.modal-header h2{font-size:16px}}.close-modal-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:24px}.close-modal-btn:hover{color:var(--text-main)}.modal-body{flex-direction:column;gap:20px;padding:24px;display:flex;overflow-y:auto}@media (width<=900px){.modal-body{gap:14px;padding:16px}}.specs-summary-table{background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:10px;flex-direction:column;gap:10px;padding:16px;display:flex}@media (width<=900px){.specs-summary-table{border-radius:8px;gap:8px;padding:12px}}.specs-summary-row{border-bottom:1px solid #2c2f3a66;justify-content:space-between;padding-bottom:6px;font-size:13px;display:flex}@media (width<=900px){.specs-summary-row{padding-bottom:4px;font-size:11px}}.specs-summary-row:last-child{border-bottom:none;padding-bottom:0}.specs-label{color:var(--text-muted)}.specs-val{font-weight:700;font-family:var(--font-mono)}.contact-form{flex-direction:column;gap:16px;display:flex}@media (width<=900px){.contact-form{gap:12px}}.form-field{flex-direction:column;gap:6px;display:flex}.form-field label{text-transform:uppercase;color:var(--text-muted);font-size:12px;font-weight:600}@media (width<=900px){.form-field label{font-size:10px}}.form-input{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-main);font-size:14px;font-family:var(--font-sans);border-radius:8px;outline:none;padding:12px;transition:all .2s}@media (width<=900px){.form-input{border-radius:6px;padding:10px;font-size:12px}}.form-input:focus{border-color:var(--accent-color);box-shadow:0 0 0 2px var(--accent-bg)}.form-input.input-error{border-color:var(--error-color);box-shadow:0 0 0 2px #ef444426}.field-error-text{color:var(--error-color);font-size:11px}@media (width<=900px){.field-error-text{font-size:10px}}.form-status{border-radius:8px;padding:12px;font-size:13px;line-height:1.5}@media (width<=900px){.form-status{border-radius:6px;padding:10px;font-size:11px}}.form-status.success{border:1px solid var(--success-color);color:var(--success-color);background-color:#10b98126}.form-status.error{border:1px solid var(--error-color);color:var(--error-color);background-color:#ef444426}.spinner{border:3px solid #ffffff1a;border-left-color:var(--text-main);border-radius:50%;width:20px;height:20px;animation:.8s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.instructions-alert{color:var(--text-muted);background-color:#244a7314;border:1px solid #244a7333;border-radius:8px;padding:12px 14px;font-size:12px;line-height:1.5}@media (width<=900px){.instructions-alert{padding:10px 12px;font-size:10px}}.instructions-alert strong{color:var(--text-main)}.slider-value-row{align-items:center;gap:6px;display:flex}.slider-value-input{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:#fff;font-family:var(--font-mono);text-align:right;border-radius:6px;outline:none;width:54px;padding:2px 6px;font-size:13px;font-weight:700;transition:all .2s}.slider-value-input:focus{border-color:var(--accent-color);box-shadow:0 0 0 2px var(--accent-bg);background-color:var(--bg-secondary)}.slider-value-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.slider-value-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.slider-value-input{-moz-appearance:textfield}.slider-unit{color:var(--text-muted);font-size:11px;font-weight:700}.schematics-wrapper{flex-direction:column;gap:12px;width:100%;display:flex}.schematic-card{background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:10px;padding:14px;transition:all .2s;box-shadow:inset 0 1px 3px #ffffff05}@media (width<=900px){.schematic-card{padding:10px}}.schematic-card-header{flex-direction:column;gap:2px;margin-bottom:10px;display:flex}@media (width<=900px){.schematic-card-header{margin-bottom:6px}}.schematic-card-title{color:var(--text-main);letter-spacing:.3px;font-size:12px;font-weight:700}@media (width<=900px){.schematic-card-title{font-size:11px}}.schematic-card-subtitle{color:var(--text-muted);font-size:10px}@media (width<=900px){.schematic-card-subtitle{font-size:9px}}.schematic-svg-container{aspect-ratio:auto;background-color:#0b0c0e;border:1px solid #ffffff0a;border-radius:6px;width:100%;display:flex;overflow:hidden}
