*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{font-family:DM Sans,sans-serif;background:#141c17;color:#e7efe2;overflow:hidden}.app{display:flex;height:100vh}.sidebar{width:330px;min-width:330px;height:100%;overflow-y:auto;background:#141c17;border-right:1px solid rgba(213,225,211,.08);padding:24px;display:flex;flex-direction:column}.sidebar::-webkit-scrollbar{width:5px}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:#95c08f26;border-radius:3px}.sidebar-title{font-size:20px;font-weight:700;letter-spacing:-.3px;margin-bottom:2px}.sidebar-title span{color:#95c08f}.sidebar-sub{font-size:11px;color:#6b7a69;margin-bottom:20px}.section{border-bottom:1px solid rgba(213,225,211,.08)}.section-header{width:100%;display:flex;align-items:center;justify-content:space-between;padding:14px 0;background:none;border:none;cursor:pointer;color:#e7efe2;font-family:DM Sans,sans-serif;font-size:12px;font-weight:600;letter-spacing:1px;text-transform:uppercase}.section-header .arrow{transition:transform .2s;font-size:10px;opacity:.5}.section-header .arrow.open{transform:rotate(180deg)}.section-body{padding-bottom:16px;display:flex;flex-direction:column;gap:10px}.field-label{font-size:11px;color:#8a9a88;display:block;margin-bottom:4px;font-weight:500}.field-input{width:100%;padding:8px 10px;background:#95c08f0f;border:1px solid rgba(213,225,211,.1);border-radius:6px;color:#e7efe2;font-size:13px;font-family:DM Sans,sans-serif;outline:none;transition:border-color .15s}.field-input:focus{border-color:#95c08f66}select.field-input{cursor:pointer;-webkit-appearance:none}select.field-input option{background:#1e2a1e;color:#e0ead0}.color-row{display:flex;align-items:center;gap:10px}.color-picker{width:32px;height:32px;border:2px solid rgba(213,225,211,.15);border-radius:6px;cursor:pointer;padding:0;background:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.color-picker::-webkit-color-swatch-wrapper{padding:0}.color-picker::-webkit-color-swatch{border:none;border-radius:4px}.color-label{font-size:11px;color:#8a9a88;font-weight:500}.color-hex{font-size:11px;color:#6b7a69;font-family:monospace}.presets-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}.preset-btn{padding:8px 6px;border-radius:6px;cursor:pointer;font-size:10px;font-weight:600;font-family:DM Sans,sans-serif;letter-spacing:.3px;text-align:center;transition:.15s}.preset-btn:hover{filter:brightness(1.15);transform:scale(1.03)}.pattern-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.pattern-btn{padding:10px 8px;border-radius:6px;cursor:pointer;font-size:11px;font-family:DM Sans,sans-serif;transition:.15s;text-align:center}.pattern-btn.active{background:#95c08f26;border:1px solid rgba(149,192,143,.5);color:#95c08f;font-weight:600}.pattern-btn:not(.active){background:#95c08f0a;border:1px solid rgba(213,225,211,.08);color:#8a9a88;font-weight:400}.toggle-row{display:flex;align-items:center;gap:10px;cursor:pointer}.toggle-track{width:36px;height:20px;border-radius:10px;position:relative;transition:.2s;flex-shrink:0;cursor:pointer}.toggle-track.on{background:#95c08f}.toggle-track.off{background:#d5e1d31f}.toggle-thumb{width:16px;height:16px;border-radius:8px;background:#fff;position:absolute;top:2px;transition:.2s;box-shadow:0 1px 3px #0000004d}.toggle-track.on .toggle-thumb{left:18px}.toggle-track.off .toggle-thumb{left:2px}.toggle-label{font-size:12px;color:#b6c1b4}.upload-row{display:flex;gap:8px;align-items:center}.upload-btn{padding:6px 14px;background:#95c08f14;border:1px solid rgba(213,225,211,.12);border-radius:6px;cursor:pointer;font-size:12px;color:#b6c1b4;white-space:nowrap}.upload-btn:hover{background:#95c08f24}.remove-btn{padding:6px 10px;background:#ff50501f;border:1px solid rgba(255,80,80,.25);border-radius:6px;cursor:pointer;font-size:11px;color:#f88}.logo-controls{display:flex;flex-direction:column;gap:10px;padding:12px;background:#95c08f0d;border:1px solid rgba(149,192,143,.12);border-radius:8px}.logo-slider{width:100%;height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#d5e1d31f;border-radius:2px;outline:none;cursor:pointer}.logo-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#95c08f;cursor:pointer;box-shadow:0 0 0 2px #95c08f40}.logo-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#95c08f;cursor:pointer;border:none;box-shadow:0 0 0 2px #95c08f40}.logo-slider::-webkit-slider-runnable-track{background:#d5e1d31f;border-radius:2px}.reset-logo-btn{align-self:flex-start;padding:4px 10px;background:none;border:1px solid rgba(213,225,211,.15);border-radius:5px;font-size:10px;color:#6b7a69;cursor:pointer;font-family:DM Sans,sans-serif;transition:.15s;letter-spacing:.3px}.reset-logo-btn:hover{border-color:#95c08f66;color:#95c08f}.dl-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;background:linear-gradient(135deg,#263126,#1d261f);border:1px solid rgba(149,192,143,.25);border-radius:6px;cursor:pointer;font-size:13px;color:#95c08f;font-family:DM Sans,sans-serif;font-weight:500;transition:.15s}.dl-btn:hover{border-color:#95c08f8c;box-shadow:0 6px 24px -6px #95c08f33;transform:translateY(-1px)}.dl-btn:disabled{opacity:.5;cursor:wait}.dl-btn.primary{background:linear-gradient(135deg,#95c08f,#6c9a6b);border:none;color:#141c17;font-weight:700}.preview{flex:1;overflow:auto;display:flex;flex-direction:column;align-items:center;position:relative}.view-toggle{display:flex;gap:4px;border-radius:8px;margin:16px 0 0;overflow:hidden;background:#00000040;padding:4px}.view-btn{padding:8px 22px;background:transparent;border:none;cursor:pointer;font-size:12px;color:#6b7a69;font-family:DM Sans,sans-serif;font-weight:400;border-radius:6px;transition:.15s}.view-btn.active{background:#95c08f2e;color:#95c08f;font-weight:600}.cards-area{flex:1;display:flex;align-items:center;justify-content:center;padding:40px;gap:40px;flex-wrap:wrap}.card-wrap{display:flex;flex-direction:column;align-items:center;gap:16px}.card-shadow{box-shadow:0 30px 60px -15px #00000080;border-radius:4px}.card-wrap .label{font-size:13px;color:#6b7a69;font-weight:400}.card{width:553px;height:316px;border-radius:4px;position:relative;overflow:hidden;flex-shrink:0}.card .pattern-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.card .content{position:relative;z-index:2;height:100%}.front-content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 40px 40px;gap:28px;height:100%}.front-logo{height:120px;width:auto;max-width:420px;object-fit:contain}.front-company{font-size:56px;font-weight:800;letter-spacing:2px;line-height:1}.front-secondary{font-size:15px;font-weight:400;letter-spacing:6px;text-transform:uppercase;margin-top:-10px}.front-tagline{font-size:17px;font-weight:400;letter-spacing:.5px;text-align:center;opacity:.9}.back-content{display:flex;padding:40px 44px;gap:30px;height:100%}.back-left{flex:1;display:flex;flex-direction:column;justify-content:center}.back-name{font-size:38px;font-weight:700;line-height:1;letter-spacing:-.5px}.back-title{font-size:16px;font-weight:400;letter-spacing:.3px;margin-top:6px}.back-right{flex:1.05;display:flex;flex-direction:column;justify-content:center;gap:9px}.contact-item{display:flex;align-items:flex-start;gap:10px;font-size:13px;font-weight:300;line-height:1.3}.contact-item svg{flex-shrink:0;margin-top:1px}.social-row{display:flex;gap:14px;margin-top:10px;align-items:center}.sidebar-footer{margin-top:auto;padding-top:20px;font-size:10px;color:#4a5e48;text-align:center}@media (max-width: 900px){.sidebar{width:280px;min-width:280px;padding:16px}.card{width:440px;height:251px}.front-company{font-size:44px}.front-logo{height:90px}.back-name{font-size:30px}.contact-item{font-size:11px}}