@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";.brand-app{display:flex;height:100vh;background-color:var(--color-bg);overflow:hidden}.sidebar{width:280px;border-right:1px solid var(--color-border);display:flex;flex-direction:column;padding:var(--space-8) var(--space-4);background-color:var(--color-deep-navy);color:#fff}.brand-logo-container{display:flex;flex-direction:column;gap:var(--space-2);padding-left:var(--space-4);margin-bottom:var(--space-20)}.sidebar-logo{height:32px;width:auto;object-fit:contain;align-self:flex-start}.brand-portal-label{font-weight:500;font-size:14px;color:#fff6;letter-spacing:.05em;text-transform:uppercase}.nav-items{display:flex;flex-direction:column;gap:var(--space-4)}.nav-item{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-6);color:#fff9;background:transparent;border:none;border-radius:var(--radius-md);font-weight:600;font-size:16px;position:relative;text-align:left;width:100%;transition:all .2s ease;text-decoration:none;cursor:pointer}.nav-item:hover{background:rgba(255,255,255,.05);color:#fff}.nav-item.active{color:#fff;background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.active-indicator{position:absolute;left:0;width:3px;height:20px;background:var(--color-amber);border-radius:0 4px 4px 0}.main-content{flex:1;overflow-y:auto;padding:var(--space-12) var(--space-20)}.content-container{max-width:900px;margin:0 auto}.overview{display:flex;flex-direction:column;gap:var(--space-20)}.hero{display:flex;flex-direction:column;gap:var(--space-4)}.muted{color:var(--color-fg-muted);max-width:600px}.brand-backdrop-preview{width:100%;aspect-ratio:16/7;background:var(--brand-gradient);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg)}.backdrop-card{width:100%;height:100%;display:flex;align-items:flex-end;padding:var(--space-12);position:relative}.backdrop-overlay{display:flex;flex-direction:column;gap:var(--space-2)}.white{color:#fff}.section{display:flex;flex-direction:column;gap:var(--space-8)}.grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6)}.card{padding:var(--space-8);background:var(--color-bg-subtle);border-radius:var(--radius-md);border:1px solid var(--color-border)}.card h4{margin-bottom:var(--space-2)}.assets-section{display:flex;flex-direction:column;gap:var(--space-12)}.assets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-6)}.asset-card{background:white;border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;transition:all .2s ease}.asset-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.asset-preview{height:180px;border-bottom:1px solid var(--color-border)}.backdrop-sample{width:100%;height:100%}.asset-info{padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-6)}.asset-meta{display:flex;flex-direction:column;gap:var(--space-1)}.asset-type{font-size:10px;font-weight:700;color:var(--color-accent);text-transform:uppercase}.small{font-size:13px}.download-btn{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;padding:var(--space-4) var(--space-6);background:var(--color-bg-muted);border-radius:var(--radius-md);font-weight:600;font-size:14px}.download-btn:hover{background:var(--color-border)}.btn-text-action{display:flex;align-items:center;justify-content:center;gap:var(--space-2);color:var(--color-fg);font-weight:600;font-size:14px;background:var(--color-bg-muted);padding:var(--space-4) var(--space-8);border-radius:var(--radius-md);transition:all .2s ease;width:100%}.btn-text-action:hover{background:var(--color-border);color:var(--color-accent)}.settings-section{display:flex;flex-direction:column;gap:var(--space-12)}.settings-grid{display:flex;flex-direction:column;gap:var(--space-6)}.provider-card{background:white;border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);transition:all .2s ease}.provider-card.active{border-color:var(--color-accent);background:var(--color-bg-subtle)}.provider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-6)}.radio-group{display:flex;align-items:center;gap:var(--space-3);font-weight:600}.provider-fields{display:grid;grid-template-columns:2fr 1fr;gap:var(--space-6)}.field{display:flex;flex-direction:column;gap:var(--space-2)}.field label{font-size:12px;font-weight:600;color:var(--color-fg-muted);display:flex;align-items:center;gap:var(--space-1)}.settings-footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-6);margin-top:var(--space-8)}.save-btn{display:flex;align-items:center;gap:var(--space-2)}.status-msg{color:var(--color-accent);font-weight:600;font-size:14px}.text-success{color:#10b981}.typography-section,.type-scale-list{display:flex;flex-direction:column;gap:var(--space-12)}.type-row{display:flex;flex-direction:column;gap:var(--space-4);padding-bottom:var(--space-8);border-bottom:1px solid var(--color-bg-muted)}.type-meta{display:flex;align-items:center;gap:var(--space-4)}.type-label{font-size:12px;font-weight:700;color:var(--color-fg-subtle);width:80px}.type-specs{font-size:11px;font-family:monospace;color:var(--color-fg-muted);background:var(--color-bg-muted);padding:4px 10px;border-radius:4px}.type-sample{line-height:1.2;color:var(--color-fg)}.colors-section{display:flex;flex-direction:column;gap:var(--space-12)}.color-group{display:flex;flex-direction:column;gap:var(--space-6)}.gradient-preview{background:white;border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-4)}.gradient-bar{height:120px;border-radius:var(--radius-md);background:var(--brand-gradient)}.gradient-code{font-size:12px;color:var(--color-fg-muted);background:var(--color-bg-muted);padding:4px 8px;border-radius:4px}.color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--space-4)}.color-card{background:white;border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden}.color-swatch{height:80px}.color-info{padding:var(--space-6);display:flex;flex-direction:column}.color-name{font-size:14px;font-weight:600;margin-bottom:4px}.color-hex{font-size:12px;font-family:monospace;color:var(--color-fg-muted)}.templates-section{display:flex;flex-direction:column;gap:var(--space-12)}.templates-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-12)}.template-card{background:white;border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.template-preview-wrapper{position:relative;aspect-ratio:4/3;background:var(--color-bg-muted);overflow:hidden}.template-img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.template-card:hover .template-img{transform:scale(1.05)}.template-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease}.template-card:hover .template-overlay{opacity:1}.preview-action{background:white;color:#000;padding:10px 20px;border-radius:var(--radius-full);font-weight:600;display:flex;align-items:center;gap:8px}.primary-button{background:white;color:#000;padding:10px 20px;border-radius:var(--radius-full);font-weight:600;display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;transition:all .2s ease}.primary-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #ffffff1a}.template-info{padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-6)}.template-type{font-size:10px;font-weight:700;color:var(--color-accent);text-transform:uppercase}.text-success{color:#4caf50!important}.clickable{cursor:pointer}.provider-title{display:flex;align-items:center;gap:0;font-weight:600}.custom-radio{width:18px;height:18px;border-radius:50%;border:2px solid var(--color-border);display:flex;align-items:center;justify-content:center;transition:all .2s ease;margin-right:12px}.custom-radio.checked{border-color:var(--color-accent)}.custom-radio.checked:after{content:"";width:10px;height:10px;border-radius:50%;background:var(--color-accent)}.provider-card{background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:20px;transition:all .2s ease}.provider-card.active{border-color:var(--color-accent);background:rgba(255,255,255,.05);box-shadow:var(--shadow-md)}.provider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.provider-fields{display:flex;flex-direction:column;gap:15px}.field{display:flex;flex-direction:column;gap:8px}.field label{font-size:12px;font-weight:600;color:var(--color-fg-muted);display:flex;align-items:center;gap:6px}.test-btn:hover{background:rgba(255,255,255,.1)!important;border-color:#fff3!important}.animate-spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:root{--color-amber: #F5921A;--color-orange: #F06B1D;--color-red-orange: #D93C28;--color-crimson: #C02A50;--color-deep-navy: #1C0F32;--color-bg: #FFFFFF;--color-bg-subtle: #FAF9F7;--color-bg-muted: #F0EFED;--color-bg-inverse: #0C0C0C;--color-fg: #0C0C0C;--color-fg-muted: #5A5A5A;--color-fg-subtle: #9A9A9A;--color-fg-inverse: #FFFFFF;--color-accent: #F06B1D;--color-accent-hover: #D93C28;--color-border: #D8D8D8;--color-border-strong: #2E2E2E;--brand-gradient: linear-gradient(135deg, #F5921A, #F06B1D, #D93C28, #C02A50);--space-1: 4px;--space-2: 8px;--space-4: 16px;--space-6: 24px;--space-8: 32px;--space-12: 48px;--space-20: 80px;--space-32: 128px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 16px;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(12, 12, 12, .06);--shadow-md: 0 4px 12px rgba(12, 12, 12, .1);--shadow-lg: 0 12px 32px rgba(12, 12, 12, .12);--shadow-xl: 0 24px 64px rgba(12, 12, 12, .14);--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-in-out: cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--color-bg);color:var(--color-fg);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.1;letter-spacing:-.02em}.display{font-size:72px;font-weight:600;letter-spacing:-.03em}h1{font-size:48px;letter-spacing:-.02em}h2{font-size:36px;letter-spacing:-.02em}h3{font-size:24px;font-weight:600}.eyebrow{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--color-fg-muted)}.body-lg{font-size:18px}.body-md{font-size:16px}input,select,textarea{padding:var(--space-6) var(--space-8);border:1px solid var(--color-border);border-radius:var(--radius-md);font-family:inherit;font-size:16px;outline:none;transition:border-color .2s ease}.white{color:#fff!important}button{cursor:pointer;border:none;font-family:inherit;transition:all .2s ease;padding:var(--space-4) var(--space-6);border-radius:var(--radius-md);font-weight:600}input:focus,select:focus{border-color:var(--color-accent)}.btn-primary{background:var(--color-bg-inverse);color:var(--color-fg-inverse);padding:16px 32px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;border-radius:var(--radius-sm)}.btn-primary:hover{opacity:.9;transform:translateY(-1px)}.btn-outline{background:transparent;border:1px solid var(--color-border-strong);color:var(--color-fg);padding:12px 24px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;border-radius:var(--radius-sm)}.btn-outline:hover{background:var(--color-bg-subtle)}.container{max-width:1200px;margin:0 auto;padding:0 var(--space-6)}.glass{background:rgba(255,255,255,.7);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}.dark .glass{background:rgba(12,12,12,.7);border:1px solid rgba(255,255,255,.05)}.backdrop-container{position:relative;width:100%;border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:16/9}.backdrop-img{width:100%;height:100%;object-fit:cover}.backdrop-overlay-dark{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);display:flex;flex-direction:column;justify-content:flex-end;padding:var(--space-12);color:#fff}