@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap";.backdrop-blur-lg,.backdrop-blur-md{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}:root{font-size:90%;--forest-900: #1a3a34;--forest-800: #234a43;--forest-700: #2d5a52;--forest-600: #377062;--forest-500: #418871;--forest-400: #5a9f8c;--forest-300: #7ab5a7;--forest-200: #9dcbc2;--forest-100: #c1e1dc;--forest-50: #e6f5f2;--lime-900: #4a5a0f;--lime-800: #6b7f16;--lime-700: #8ca41c;--lime-600: #a8c324;--lime-500: #c4dd3b;--lime-400: #d0e560;--lime-300: #dcec85;--lime-200: #e8f3aa;--lime-100: #f3f9cf;--lime-50: #f9fce7;--primary: var(--forest-700);--primary-hover: var(--forest-800);--primary-active: var(--forest-900);--primary-light: var(--forest-100);--accent: var(--lime-500);--accent-hover: var(--lime-600);--accent-active: var(--lime-700);--accent-light: var(--lime-100);--green-50: var(--forest-50);--green-800: var(--forest-800);--success: #10b981;--success-light: #d1fae5;--warning: #f59e0b;--warning-light: #fef3c7;--error: #ef4444;--error-light: #fee2e2;--info: #3b82f6;--info-light: #dbeafe;--gray-900: #111827;--gray-800: #1f2937;--gray-700: #374151;--gray-600: #4b5563;--gray-500: #6b7280;--gray-400: #9ca3af;--gray-300: #d1d5db;--gray-200: #e5e7eb;--gray-100: #f3f4f6;--gray-50: #f9fafb;--white: #ffffff;--font-display: "Space Grotesk", sans-serif;--font-body: "DM Sans", sans-serif;--font-mono: "IBM Plex Mono", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--text-6xl: 3.75rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1);--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .25);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .35s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-body);color:var(--gray-800);background:var(--gray-50);line-height:1.6;font-size:var(--text-base);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}h1{font-family:var(--font-display);font-size:var(--text-5xl);font-weight:700;letter-spacing:-.02em;color:var(--gray-900)}h2{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:600;color:var(--primary)}h3{font-family:var(--font-display);font-size:var(--text-xl);font-weight:600;color:var(--gray-800)}h4{font-family:var(--font-display);font-size:var(--text-lg);font-weight:600;color:var(--gray-800)}p{color:var(--gray-700);line-height:1.7}a{color:var(--primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--primary-hover)}button,.btn{font-family:var(--font-body);font-weight:600;padding:var(--space-3) var(--space-6);border-radius:var(--radius-md);border:none;cursor:pointer;transition:all var(--transition-base);font-size:var(--text-base);display:inline-flex;align-items:center;gap:var(--space-2)}.btn-primary{background:var(--primary);color:var(--white)}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-accent{background:var(--accent);color:var(--forest-900)}.btn-accent:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-outline{background:transparent;border:2px solid var(--primary);color:var(--primary)}.btn-outline:hover{background:var(--primary);color:var(--white)}.btn-ghost{background:transparent;color:var(--primary)}.btn-ghost:hover{background:var(--forest-50)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--text-lg)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--text-sm)}.input-group{margin:var(--space-4) 0}label{display:block;font-weight:600;margin-bottom:var(--space-2);color:var(--gray-700);font-size:var(--text-sm)}input[type=text],input[type=email],input[type=password],textarea,select{width:100%;padding:var(--space-3) var(--space-4);border:2px solid var(--gray-300);border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-base);transition:all var(--transition-fast);color:var(--gray-800);background:var(--white)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--forest-100)}.card{background:var(--white);border-radius:var(--radius-lg);padding:var(--space-6);box-shadow:var(--shadow-md);transition:all var(--transition-base);border:1px solid var(--gray-200)}.card:hover{box-shadow:var(--shadow-xl);transform:translateY(-4px)}.card-header{font-size:var(--text-xl);font-weight:700;color:var(--primary);margin-bottom:var(--space-3)}.card-body{color:var(--gray-700);line-height:1.7}.badge{display:inline-block;padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.badge-primary{background:var(--forest-100);color:var(--forest-800)}.badge-accent{background:var(--lime-100);color:var(--lime-800)}.badge-success{background:var(--success-light);color:#065f46}.badge-warning{background:var(--warning-light);color:#92400e}.badge-error{background:var(--error-light);color:#991b1b}.alert{padding:var(--space-4) var(--space-5);border-radius:var(--radius-lg);margin:var(--space-4) 0;border-left:4px solid}.alert-info{background:var(--info-light);border-color:var(--info);color:#1e40af}.alert-success{background:var(--success-light);border-color:var(--success);color:#065f46}.alert-warning{background:var(--warning-light);border-color:var(--warning);color:#92400e}.alert-error{background:var(--error-light);border-color:var(--error);color:#991b1b}pre{background:var(--gray-900);color:var(--lime-300);padding:var(--space-4);border-radius:var(--radius-lg);overflow-x:auto;font-family:var(--font-mono);font-size:var(--text-sm);line-height:1.6;margin:var(--space-4) 0}code{font-family:var(--font-mono);background:var(--gray-100);padding:2px 6px;border-radius:var(--radius-sm);font-size:.9em;color:var(--forest-800)}pre code{background:none;padding:0;color:inherit}.grid{display:grid;gap:var(--space-6)}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}@media (max-width: 768px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}.mb-4{margin-bottom:var(--space-4)}.mt-8{margin-top:var(--space-8)}.p-4{padding:var(--space-4)}.text-center{text-align:center}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-4{gap:var(--space-4)}.btn-primary-solid{background:var(--primary);color:#fff;border-radius:var(--radius-md);padding:var(--space-3) var(--space-6);font-weight:600;font-size:var(--text-base);border:none;cursor:pointer;transition:all var(--transition-base);display:inline-flex;align-items:center;gap:var(--space-2)}.btn-primary-solid:hover{background:var(--primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-primary-solid:disabled{opacity:.5;cursor:not-allowed}.btn-secondary-outline{background:white;border:1.5px solid var(--gray-300);color:var(--gray-800);border-radius:var(--radius-md);padding:var(--space-3) var(--space-6);font-weight:600;font-size:var(--text-base);cursor:pointer;transition:all var(--transition-base);display:inline-flex;align-items:center;gap:var(--space-2)}.btn-secondary-outline:hover{border-color:var(--primary);background:var(--primary-light)}.btn-secondary-outline:disabled{opacity:.5;cursor:not-allowed}.landing-container{max-width:1440px;width:100%;margin-left:auto;margin-right:auto;padding-left:80px;padding-right:80px;box-sizing:border-box}@media (max-width: 767px){.landing-container{padding-left:24px;padding-right:24px}}.sidebar-item-btn{border-radius:var(--radius-xl);transition:all var(--transition-base);padding:var(--space-2)}.sidebar-item-btn.inactive:hover{background:rgba(255,255,255,.1)}.sidebar-item-btn.active{background:var(--primary);color:#fff;box-shadow:0 4px 12px #00000026}.edit-panel-card{border-radius:var(--radius-2xl);transition:all var(--transition-base);cursor:pointer;border:1px solid var(--gray-200);padding:var(--space-4);background:var(--gray-100)}.edit-panel-card:hover{background:var(--green-50);color:var(--green-800);border-color:var(--primary)}.edit-panel-card.selected{border-color:var(--primary);background:var(--primary-light)}.edit-panel-button{padding:var(--space-3) var(--space-4);border-radius:var(--radius-xl);border:1px solid var(--gray-300);background:var(--gray-100);cursor:pointer;transition:all var(--transition-base);font-size:var(--text-sm);font-weight:600;color:var(--gray-600)}.edit-panel-button:hover{background:var(--green-50);color:var(--green-800);border-color:var(--primary)}.edit-panel-shape-button{aspect-ratio:1;border-radius:var(--radius-2xl);border:1px solid var(--gray-200);background:var(--gray-100);cursor:pointer;transition:all var(--transition-base);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2)}.edit-panel-shape-button:hover{background:var(--green-50);color:var(--green-800);border-color:var(--primary)}.edit-panel-shape-button:hover svg,.edit-panel-shape-button:hover span{color:var(--green-800)}.edit-panel-text-button{width:100%;padding:var(--space-4) var(--space-6);text-align:left;border-radius:var(--radius-2xl);border:1px solid var(--gray-200);background:var(--gray-100);cursor:pointer;transition:all var(--transition-base);display:flex;align-items:center;justify-content:space-between}.edit-panel-text-button:hover{background:var(--green-50);color:var(--green-800);border-color:var(--primary)}.text-button-group:hover svg{color:var(--green-800)}@keyframes pulse-green{0%,to{box-shadow:0 0 #1a5c3800}50%{box-shadow:0 0 0 4px #1a5c384d}}.pulse-green-highlight{animation:pulse-green .6s ease 2;outline:2px solid #1a5c38;outline-offset:2px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeInUp .6s ease-out}.editor-canvas-container{font-size:16px}