.config-page{width:100vw;height:100vh;color:var(--text-primary);background:#000;overflow:hidden}.config-container{height:100vh;padding-top:80px;display:flex}#config-canvas-container{background:radial-gradient(circle,#1a1a20,#000);flex:1;position:relative}#config-canvas{cursor:grab;width:100%;height:100%}#config-canvas:active{cursor:grabbing}#config-loading{z-index:1000;background:#000;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.loader-logo{font-family:var(--font-accent);letter-spacing:5px;color:var(--accent-gold);margin-bottom:2rem;font-size:2.5rem}.loader-logo span{color:#fff}.loader-bar-bg{background:#ffffff1a;width:200px;height:2px;position:relative;overflow:hidden}.loader-bar-fill{background:var(--accent-gold);width:0%;height:100%;box-shadow:0 0 15px var(--accent-gold);transition:width .3s;position:absolute;top:0;left:0}.view-controls{z-index:10;gap:1rem;display:flex;position:absolute;top:2rem;left:2rem}.view-btn{border:1px solid var(--glass-border);color:#ccc;cursor:pointer;font-family:var(--font-accent);letter-spacing:2px;text-transform:uppercase;clip-path:polygon(10% 0,100% 0,90% 100%,0% 100%);background:#ffffff0d;border-radius:4px;padding:.8rem 1.8rem;font-size:.75rem;transition:all .4s cubic-bezier(.16,1,.3,1)}.view-btn:hover{color:#fff;background:#ffffff1a;border-color:#ffffff4d}.view-btn.active{background:var(--accent-gold);color:#000;border-color:var(--accent-gold);box-shadow:0 0 20px #c9a84c4d}.config-panel{z-index:100;background:linear-gradient(135deg,#0f0f14f2,#050505fa);border-left:1px solid #ffffff14;flex-direction:column;width:450px;padding:2.5rem;display:flex;position:relative;box-shadow:-20px 0 50px #00000080}.config-panel-header{margin-bottom:2rem}.config-panel-header h2{font-family:var(--font-accent);color:var(--accent-gold);letter-spacing:3px;text-transform:uppercase;margin-bottom:.5rem;font-size:1.8rem}.config-panel-header p{color:#777;font-size:.85rem;font-family:var(--font-primary);letter-spacing:1px}.config-tabs{background:#ffffff08;border-radius:8px;gap:.5rem;margin-bottom:2rem;padding:.3rem;display:flex}.config-tab{color:#666;cursor:pointer;text-transform:uppercase;letter-spacing:1.5px;background:0 0;border:none;border-radius:6px;flex:1;padding:.8rem .5rem;font-size:.7rem;font-weight:600;transition:all .4s}.config-tab:hover:not(.active){color:#aaa;background:#ffffff0d}.config-tab.active{color:#fff;background:#ffffff14;box-shadow:0 4px 15px #0003}.config-content{scrollbar-width:thin;scrollbar-color:var(--accent-gold) #ffffff0d;flex:1;padding-right:1.5rem;overflow-y:auto}.config-content::-webkit-scrollbar{width:4px}.config-content::-webkit-scrollbar-track{background:#ffffff0d}.config-content::-webkit-scrollbar-thumb{background:var(--accent-gold);border-radius:2px}.config-pane{display:none}.config-pane.active{animation:.5s cubic-bezier(.16,1,.3,1) forwards slideLeft;display:block}@keyframes slideLeft{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.config-section-title{color:#fff;text-transform:uppercase;letter-spacing:2px;align-items:center;gap:.8rem;margin:2rem 0 1.2rem;font-size:.8rem;display:flex}.config-section-title:after{content:"";background:linear-gradient(90deg,#c9a84c4d,#0000);flex:1;height:1px}.options-grid{grid-template-columns:repeat(3,1fr);gap:.8rem;display:grid}.option-btn{color:#888;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:#ffffff08;border:1px solid #ffffff14;border-radius:4px;padding:1rem .5rem;font-size:.7rem;transition:all .3s}.option-btn:hover{color:#fff;background:#ffffff0f}.option-btn.active{border-color:var(--accent-gold);color:var(--accent-gold);background:#c9a84c1a;box-shadow:inset 0 0 10px #c9a84c1a}.color-grid{grid-template-columns:repeat(5,1fr);gap:.8rem;display:grid}.color-btn-wrapper{flex-direction:column;align-items:center;gap:.5rem;display:flex;position:relative}.color-btn{aspect-ratio:1;cursor:pointer;background-size:cover;border:4px solid #0000;border-radius:50%;width:100%;transition:transform .3s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 5px 15px #0000004d}.color-btn:hover{transform:scale(1.15)}.color-btn.active{border-color:var(--accent-gold);box-shadow:0 0 20px #c9a84c66}.color-name{color:#666;text-transform:uppercase;opacity:0;text-align:center;font-size:.6rem;transition:opacity .2s}.color-btn-wrapper:hover .color-name{opacity:1}.patterns-grid{grid-template-columns:repeat(2,1fr);gap:1rem;display:grid}.pattern-item{cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:8px;transition:all .3s;overflow:hidden}.pattern-item:hover{background:#ffffff0f;border-color:#fff3}.pattern-item.active{border-color:var(--accent-gold);background:#c9a84c0d}.pattern-preview{color:#fff3;background-size:200%;justify-content:center;align-items:center;height:60px;font-size:1.2rem;display:flex}.pattern-preview.none{background:#111}.pattern-preview.carbon{background:repeating-linear-gradient(45deg,#111,#111 2px,#222 2px 4px)}.pattern-preview.camo{background:radial-gradient(circle,#2a2a2a 20%,#1a1a1a 80%)}.pattern-item span{text-align:center;text-transform:uppercase;letter-spacing:1px;color:#ccc;padding:.8rem;font-size:.7rem;display:block}.toggle-list{flex-direction:column;gap:1rem;display:flex}.toggle-item{cursor:pointer;background:#ffffff05;border-radius:8px;justify-content:space-between;align-items:center;padding:1rem;transition:background .3s;display:flex}.toggle-item:hover{background:#ffffff0a}.toggle-item input{display:none}.toggle-track{background:#222;border-radius:20px;width:40px;height:20px;transition:all .3s;position:relative}.toggle-track:after{content:"";background:#555;border-radius:50%;width:14px;height:14px;transition:all .3s;position:absolute;top:3px;left:3px}.toggle-item input:checked+.toggle-track{background:var(--accent-gold)}.toggle-item input:checked+.toggle-track:after{background:#fff;left:23px}.toggle-item span:last-child{color:#ccc;text-transform:uppercase;letter-spacing:1px;font-size:.75rem}.config-footer{margin-top:auto;padding-top:2rem}.config-summary-card{border:1px solid var(--glass-border);background:#ffffff08;border-radius:12px;margin-bottom:1.5rem;padding:1.5rem}.config-price{flex-direction:column;gap:.3rem;display:flex}.config-price .label{color:#666;text-transform:uppercase;letter-spacing:2px;font-size:.65rem}.config-price .value{color:var(--accent-gold);font-size:1.8rem;font-weight:700;font-family:var(--font-accent)}.config-price-hint{color:#555;margin-top:5px;font-size:.6rem}.btn-block{letter-spacing:3px;border-radius:4px;width:100%;height:60px;font-size:.9rem}.canvas-hud{text-align:right;pointer-events:none;flex-direction:column;gap:.5rem;display:flex;position:absolute;bottom:2rem;right:2rem}.hud-item{color:#fff6;text-transform:uppercase;letter-spacing:1px;font-size:.6rem}.hud-item span{color:var(--accent-gold);margin-left:10px}@media (max-width:1200px){.config-panel{width:380px}}@media (max-width:1024px){.config-container{flex-direction:column}.config-panel{border-left:none;border-top:1px solid var(--glass-border);width:100%;height:auto;padding:1.5rem}.view-controls{top:auto;bottom:calc(50% + 2rem);left:1rem;transform:none}}.upload-ref-card{background:#ffffff08;border:1px dashed #ffffff1a;border-radius:12px;margin-top:1rem;padding:1.2rem}.upload-ref-card p{color:#777;margin-bottom:1rem;font-size:.7rem;line-height:1.4}.ref-upload-zone{cursor:pointer;background:#ffffff05;border-radius:8px;flex-direction:column;align-items:center;gap:.5rem;padding:1.5rem;transition:all .3s;display:flex}.ref-upload-zone:hover{border-color:var(--accent-gold);background:#ffffff0d}.ref-upload-zone .icon{font-size:1.5rem}.ref-upload-zone span:not(.icon){text-transform:uppercase;letter-spacing:1px;color:var(--accent-gold);font-size:.7rem}.ref-preview-container{border:1px solid var(--accent-gold);border-radius:8px;margin-top:1rem;position:relative;overflow:hidden}.ref-preview-container.hidden{display:none}.ref-preview-img{filter:brightness(.8);width:100%;display:block}.remove-btn{color:#fff;cursor:pointer;background:#f00c;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:1.2rem;display:flex;position:absolute;top:5px;right:5px}.floating-action-btn{background:var(--accent-gold);color:#000;font-family:var(--font-accent);letter-spacing:2px;z-index:100;cursor:pointer;border:none;border-radius:50px;align-items:center;gap:1rem;padding:1rem 2rem;font-weight:700;transition:all .3s cubic-bezier(.16,1,.3,1);animation:2s infinite pulse-gold;display:flex;position:absolute;bottom:2rem;left:2rem;box-shadow:0 10px 30px #c9a84c66}.floating-action-btn:hover{transform:translateY(-5px)scale(1.05);box-shadow:0 15px 40px #c9a84c99}@keyframes pulse-gold{0%{box-shadow:0 0 #c9a84c66}70%{box-shadow:0 0 0 20px #c9a84c00}to{box-shadow:0 0 #c9a84c00}}