@import"https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400;600;700&display=swap";:root{--color-primary: #007ACC;--color-purple: #864CBD;--color-deep-blue: #1568B8;--color-background: #FFFFFF;--color-text: #333333;--color-text-light: #666666;--color-text-dark: #1a1a1a;--color-border: #e0e0e0;--color-background-gray: #f8f9fa;--color-background-blue: #f0f4f8;--gradient-primary: linear-gradient(135deg, #864CBD 0%, #1568B8 100%);--spacing-xs: 8px;--spacing-sm: 16px;--spacing-md: 24px;--spacing-lg: 32px;--spacing-xl: 48px;--spacing-xxl: 64px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 50px;--font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 32px;--font-size-4xl: 48px;--font-size-5xl: 56px;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.2;--line-height-normal: 1.6;--line-height-relaxed: 1.8;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .08);--shadow-md: 0 4px 12px rgba(0, 0, 0, .1);--shadow-lg: 0 6px 20px rgba(0, 0, 0, .15);--shadow-button: 0 6px 20px rgba(134, 76, 189, .4);font-family:var(--font-family);line-height:var(--line-height-normal);font-weight:var(--font-weight-normal);color-scheme:light;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;padding:0;font-family:var(--font-family);background-color:var(--color-background);color:var(--color-text);min-width:320px;min-height:100vh;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-family);color:var(--color-text-dark);margin:0;line-height:var(--line-height-tight)}h1{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold)}h2{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold)}h3{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold)}p{font-size:var(--font-size-lg);line-height:var(--line-height-normal);margin:0}small{font-size:var(--font-size-sm)}a{color:var(--color-primary);text-decoration:none;font-weight:var(--font-weight-semibold);transition:color .2s ease}a:hover{color:var(--color-deep-blue);text-decoration:underline}button{font-family:var(--font-family);cursor:pointer;border:none;background:none}.gradient-primary{background:var(--gradient-primary)}.text-primary{color:var(--color-primary)}.text-secondary{color:var(--color-text-light)}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:var(--color-background-gray)}::-webkit-scrollbar-thumb{background:var(--color-primary);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-deep-blue)}::selection{background-color:var(--color-purple);color:#fff}::-moz-selection{background-color:var(--color-purple);color:#fff}.color-picker-wrapper .react-colorful{width:280px;height:180px}.color-picker-wrapper .react-colorful__saturation{border-radius:8px 8px 0 0;border-bottom:none}.color-picker-wrapper .react-colorful__last-control{border-radius:0 0 8px 8px}.color-picker-wrapper .react-colorful__hue,.color-picker-wrapper .react-colorful__alpha{height:12px;border-radius:6px;margin-top:12px}.color-picker-wrapper .react-colorful__pointer{width:20px;height:20px;border:3px solid white;box-shadow:0 2px 8px #0003}.color-picker-wrapper .react-colorful__saturation-pointer{width:24px;height:24px}.wireframe-container{position:relative;width:100%;min-height:600px;background:#fff;padding:calc(30px * var(--layout-padding-scale, 1));filter:grayscale(100%) sepia(5%);transition:filter .4s ease-in-out}.wireframe-container:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:repeating-linear-gradient(0deg,rgba(0,0,0,.01) 0px,transparent 1px,transparent 2px,rgba(0,0,0,.01) 3px),repeating-linear-gradient(90deg,rgba(0,0,0,.01) 0px,transparent 1px,transparent 2px,rgba(0,0,0,.01) 3px);pointer-events:none;opacity:.3;z-index:0}.wireframe-container>*{position:relative;z-index:1}.wireframe-template-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;margin-bottom:calc(20px * var(--layout-padding-scale, 1));background:#f5f5f5;border:2px dashed #999999;border-radius:4px;box-shadow:2px 2px #0000001a}.wireframe-template-name{font-family:Courier New,monospace;font-size:14px;font-weight:700;color:#333;text-transform:uppercase;letter-spacing:1px}.wireframe-template-description{font-family:Courier New,monospace;font-size:12px;color:#666}.wireframe-section{position:relative;background:#fafafa;border:2px dashed #999999;border-radius:4px;padding:calc(20px * var(--layout-padding-scale, 1));margin-bottom:var(--layout-section-gap, 20px);box-shadow:2px 2px #0000001a;transition:all .2s ease}.wireframe-section:hover{transform:translate(-1px,-1px);box-shadow:3px 3px #00000026}.wireframe-section-label{position:absolute;top:-12px;left:16px;background:#fff;padding:4px 12px;font-family:Courier New,monospace;font-size:10px;font-weight:700;color:#888;text-transform:uppercase;letter-spacing:1px;border:1px solid #999999;border-radius:2px}.wireframe-hero-section{margin-bottom:calc(30px * var(--layout-padding-scale, 1))}.wireframe-hero-content{text-align:center;padding:calc(30px * var(--layout-padding-scale, 1)) 0}.wireframe-headline{font-size:calc(36px * var(--layout-h1-scale, 1));font-weight:700;color:#1a202c;margin:0 0 calc(12px * var(--layout-padding-scale, 1)) 0;line-height:calc(1.2 * var(--layout-line-height-scale, 1))}.wireframe-subheadline{font-size:calc(20px * var(--layout-h2-scale, 1));color:#4a5568;margin:0 0 calc(16px * var(--layout-padding-scale, 1)) 0;line-height:calc(1.4 * var(--layout-line-height-scale, 1))}.wireframe-description{font-size:calc(14px * var(--layout-body-scale, 1));color:#718096;margin:0;line-height:calc(1.6 * var(--layout-line-height-scale, 1))}.wireframe-section-title{font-size:calc(24px * var(--layout-h2-scale, 1));font-weight:700;color:#2d3748;margin:0 0 calc(16px * var(--layout-padding-scale, 1)) 0;line-height:calc(1.3 * var(--layout-line-height-scale, 1))}.wireframe-text{font-size:calc(14px * var(--layout-body-scale, 1));color:#4a5568;line-height:calc(1.6 * var(--layout-line-height-scale, 1));margin:0}.wireframe-list{list-style-type:none;padding:0;margin:0}.wireframe-list-item{position:relative;padding-left:30px;margin-bottom:calc(12px * var(--layout-padding-scale, 1));font-size:calc(14px * var(--layout-body-scale, 1));color:#4a5568;line-height:calc(1.6 * var(--layout-line-height-scale, 1))}.wireframe-list-item:before{content:"✓";position:absolute;left:0;color:#48bb78;font-weight:700;font-size:16px}.wireframe-list-item:last-child{margin-bottom:0}.wireframe-cta-section{margin-top:calc(30px * var(--layout-padding-scale, 1))}.wireframe-cta-content{display:flex;flex-direction:column;align-items:center;gap:calc(12px * var(--layout-padding-scale, 1))}.wireframe-cta-button{background:#4299e1;color:#fff;border:2px dashed #2B6CB0;border-radius:4px;padding:calc(12px * var(--layout-padding-scale, 1)) calc(24px * var(--layout-padding-scale, 1));font-size:calc(16px * var(--layout-body-scale, 1));font-weight:700;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;box-shadow:2px 2px #0003;transition:all .2s ease}.wireframe-cta-button:hover{transform:translate(-1px,-1px);box-shadow:3px 3px #00000040}.wireframe-cta-url{font-family:Courier New,monospace;font-size:11px;color:#a0aec0;text-decoration:underline}.wireframe-two-column-grid{display:grid;grid-template-columns:1fr 1fr;gap:calc(30px * var(--layout-padding-scale, 1));margin-bottom:calc(30px * var(--layout-padding-scale, 1))}.wireframe-three-column-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:calc(24px * var(--layout-padding-scale, 1));margin-bottom:calc(30px * var(--layout-padding-scale, 1))}.wireframe-asymmetric-grid{display:grid;grid-template-columns:2.2fr 1fr 2fr;gap:calc(20px * var(--layout-padding-scale, 1));margin-bottom:calc(30px * var(--layout-padding-scale, 1))}.wireframe-metrics-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(16px * var(--layout-padding-scale, 1));margin-bottom:calc(30px * var(--layout-padding-scale, 1))}.wireframe-metric-card{background:#edf2f7;border:2px dashed #CBD5E0;border-radius:4px;padding:calc(16px * var(--layout-padding-scale, 1));text-align:center;box-shadow:2px 2px #0000000d}.wireframe-metric-value{font-size:calc(28px * var(--layout-h1-scale, 1));font-weight:700;color:#2d3748;margin-bottom:calc(4px * var(--layout-padding-scale, 1))}.wireframe-metric-label{font-size:calc(11px * var(--layout-body-scale, 1));color:#718096;text-transform:uppercase;letter-spacing:.5px}.wireframe-column{position:relative}.wireframe-column-label{position:absolute;top:-24px;left:0;font-family:Courier New,monospace;font-size:10px;font-weight:700;color:#a0aec0;text-transform:uppercase;letter-spacing:1px;background:#fff;padding:2px 8px;border:1px solid #E2E8F0;border-radius:2px}.wireframe-placeholder{background:#f7fafc;border:2px dashed #E2E8F0;border-radius:4px;padding:calc(40px * var(--layout-padding-scale, 1));text-align:center;color:#a0aec0;font-size:calc(12px * var(--layout-body-scale, 1));font-style:italic}.wireframe-grid-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}.wireframe-grid-line{position:absolute;background:#99999926}.wireframe-vertical-line{width:1px;height:100%;top:0}.wireframe-horizontal-line{height:1px;width:100%;left:0}@media (max-width: 768px){.wireframe-two-column-grid,.wireframe-three-column-grid,.wireframe-asymmetric-grid{grid-template-columns:1fr;gap:calc(20px * var(--layout-padding-scale, 1))}.wireframe-metrics-bar{grid-template-columns:repeat(2,1fr)}.wireframe-column-label{display:none}}.wireframe-minimalist{--wireframe-border-color: #999999}.wireframe-bold{--wireframe-border-color: #666666}.wireframe-bold .wireframe-section{border-width:3px;transform:rotate(-.5deg)}.wireframe-bold .wireframe-section:nth-child(2n){transform:rotate(.5deg)}.wireframe-business{--wireframe-border-color: #CBD5E0}.wireframe-business .wireframe-section{border-style:solid;box-shadow:0 1px 3px #0000001a}.wireframe-product{--wireframe-border-color: #A0AEC0}.wireframe-product .wireframe-section{border-width:1px;border-style:solid}.wireframe-mode{filter:grayscale(100%) sepia(5%);transition:filter .4s ease-in-out;position:relative}.wireframe-mode:before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,rgba(0,0,0,.01) 0px,transparent 1px,transparent 2px,rgba(0,0,0,.01) 3px);pointer-events:none;z-index:1;opacity:.3}.wireframe-mode>*{position:relative;z-index:2}.wireframe-mode .section-container{background:#fafafa!important;border:2px dashed #999999!important;border-radius:2px!important;padding:calc(20px * var(--layout-padding-scale, 1))!important;margin-bottom:var(--layout-section-gap, 20px)!important;box-shadow:2px 2px #0000001a!important;transition:all .3s ease}.wireframe-mode .section-container:hover{border-color:#666!important;box-shadow:3px 3px #00000026!important}.wireframe-mode .section-type-label{display:block!important;font-size:11px;text-transform:uppercase;color:#888;font-weight:700;margin-bottom:12px;letter-spacing:1px;font-family:Courier New,monospace;padding:4px 8px;background:#f0f0f0;border-left:3px solid #999999;display:inline-block}.wireframe-mode h1,.wireframe-mode h2,.wireframe-mode h3,.wireframe-mode h4,.wireframe-mode h5,.wireframe-mode h6{color:#1a1a1a!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Arial,sans-serif!important;font-weight:700!important;line-height:calc(1.3 * var(--layout-line-height-scale, 1))!important}.wireframe-mode h1{font-size:calc(32px * var(--layout-h1-scale, 1))!important;border-bottom:3px solid #cccccc;padding-bottom:8px}.wireframe-mode h2{font-size:calc(24px * var(--layout-h2-scale, 1))!important;border-bottom:2px solid #dddddd;padding-bottom:6px}.wireframe-mode p,.wireframe-mode span,.wireframe-mode div,.wireframe-mode li{color:#444!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Arial,sans-serif!important;font-size:calc(14px * var(--layout-body-scale, 1))!important;line-height:calc(1.6 * var(--layout-line-height-scale, 1))!important}.wireframe-mode button,.wireframe-mode a[role=button]{background:#fff!important;color:#333!important;border:2px solid #888888!important;border-radius:2px!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Arial,sans-serif!important;font-weight:600!important;box-shadow:2px 2px #0000001a!important;transition:all .2s ease}.wireframe-mode button:hover,.wireframe-mode a[role=button]:hover{transform:translate(-1px,-1px);box-shadow:3px 3px #00000026!important}.wireframe-mode ul,.wireframe-mode ol{color:#444!important;padding-left:24px}.wireframe-mode li{margin-bottom:8px;position:relative}.wireframe-mode ul li::marker{color:#888;font-size:1.2em}.wireframe-mode [style*=background-image],.wireframe-mode [style*=background-gradient],.wireframe-mode [style*=linear-gradient]{background-image:none!important;background:#f5f5f5!important}.wireframe-mode img{filter:grayscale(100%) contrast(.8);border:2px dashed #bbbbbb!important;background:repeating-linear-gradient(45deg,#f9f9f9,#f9f9f9 10px,#f0f0f0 10px 20px)}.wireframe-mode [style*=box-shadow]{box-shadow:2px 2px #0000001a!important}.styled-mode{transition:filter .4s ease-in-out}.styled-mode .section-type-label{display:none}.wireframe-badge{background:#f5f5f5;color:#555;padding:6px 16px;border-radius:20px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;border:2px solid #999999;box-shadow:2px 2px #0000001a;transition:all .3s ease}.styled-badge{background:linear-gradient(135deg,#864cbd,#1568b8);color:#fff;padding:6px 16px;border-radius:20px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;box-shadow:0 4px 12px #864cbd4d;transition:all .3s ease}.wireframe-mode .hero-section{background:linear-gradient(135deg,#fafafa,#f5f5f5)!important;border:3px dashed #aaaaaa!important;min-height:200px;display:flex;align-items:center;justify-content:center;position:relative}.wireframe-mode .hero-section:before{content:"🖼️ HERO";position:absolute;top:12px;left:12px;font-size:10px;color:#999;font-weight:700;letter-spacing:1px;font-family:Courier New,monospace;background:#f0f0f0;padding:4px 8px;border:1px solid #cccccc}.wireframe-mode .features-grid{background:transparent!important;gap:16px}.wireframe-mode .feature-card{background:#fff!important;border:2px solid #cccccc!important;border-radius:2px!important;box-shadow:2px 2px #00000014!important;transition:all .2s ease}.wireframe-mode .feature-card:hover{border-color:#999!important;box-shadow:3px 3px #0000001f!important}.wireframe-mode .annotation{font-size:11px;color:#888;font-style:italic;margin-top:4px;font-family:Courier New,monospace}.wireframe-mode .content-sections-header{color:#333!important;border-bottom:2px solid #dddddd;padding-bottom:8px;margin-bottom:16px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Arial,sans-serif!important}.wireframe-mode [data-drag-handle]{opacity:.6;transition:opacity .2s ease}.wireframe-mode [data-drag-handle]:hover{opacity:1;cursor:move}@media (max-width: 768px){.wireframe-mode .section-container{padding:16px!important;margin-bottom:16px!important}.wireframe-mode h1{font-size:28px!important}.wireframe-mode h2{font-size:22px!important}.wireframe-mode .section-type-label{font-size:10px;padding:3px 6px}}@media print{.wireframe-mode{filter:grayscale(100%)}.wireframe-mode .section-type-label{display:block!important}}@keyframes fadeInWireframe{0%{opacity:.7;transform:scale(.99)}to{opacity:1;transform:scale(1)}}.wireframe-mode,.styled-mode{animation:fadeInWireframe .3s ease-out}