:root{color-scheme:light;font-family:var(--font-family-base, "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);--font-family-base: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-weight-heading: 600;--font-weight-body: 400;--radius-base: 12px;--color-bg: linear-gradient(135deg, #f0f4f8 0%, #e8eef3 100%);--color-bg-solid: #f3f4f6;--color-surface: rgba(255, 255, 255, .95);--color-surface-glass: rgba(255, 255, 255, .7);--color-border: #e5e7eb;--color-border-strong: #cbd5f5;--color-text: #111827;--color-text-muted: #6b7280;--color-primary: hsl(220, 90%, 56%);--color-primary-hover: hsl(220, 90%, 50%);--color-primary-soft: hsla(220, 90%, 56%, .12);--color-accent: hsl(158, 64%, 52%);--color-success: hsl(142, 71%, 45%);--color-critical: hsl(0, 72%, 51%);--shadow-sm: 0 1px 2px 0 rgba(15, 23, 42, .08);--shadow-md: 0 8px 24px rgba(15, 23, 42, .12), 0 2px 6px rgba(15, 23, 42, .08);--shadow-lg: 0 20px 40px rgba(15, 23, 42, .15), 0 4px 12px rgba(15, 23, 42, .1);--shadow-glow: 0 0 20px rgba(37, 99, 235, .3)}*,*:before,*:after{box-sizing:border-box}body{margin:0;padding:0;background:var(--color-bg);background-attachment:fixed;color:var(--color-text);font-family:var(--font-family-base);font-weight:var(--font-weight-body)}h1,h2,h3,h4,h5,h6{margin:0;font-weight:600;letter-spacing:-.02em}button{font:inherit}a{color:inherit;text-decoration:none}.app-shell{display:grid;grid-template-rows:auto 1fr;min-height:100vh}.app-content{display:grid;grid-template-columns:280px minmax(0,1fr) 340px;grid-template-areas:"palette canvas properties";gap:1.25rem;padding:1.5rem}.app-pane{min-height:0;display:flex;flex-direction:column}.app-pane--palette{grid-area:palette}.app-pane--canvas{grid-area:canvas}.app-pane--properties{grid-area:properties}.surface{background:var(--color-surface);backdrop-filter:blur(12px) saturate(180%);-webkit-backdrop-filter:blur(12px) saturate(180%);border:1px solid var(--color-border);border-radius:var(--radius-base);box-shadow:var(--shadow-md);transition:all .3s cubic-bezier(.4,0,.2,1)}.surface:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.scroll-container{overflow-y:auto;scrollbar-width:thin}.scroll-container::-webkit-scrollbar{width:8px}.scroll-container::-webkit-scrollbar-thumb{background-color:#0f172a1f;border-radius:999px}.pill{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .75rem;border-radius:999px;background:var(--color-primary-soft);color:var(--color-primary);font-size:.75rem;font-weight:500}.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:calc(var(--radius-base) - 2px);border:1px solid transparent;cursor:pointer;padding:.55rem 1.1rem;font-weight:var(--font-weight-heading);transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .6s,height .6s}.button:active:before{width:300px;height:300px}.button.primary{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-hover) 100%);color:#fff;box-shadow:0 4px 12px #2a6df44d}.button.primary:hover{transform:translateY(-2px);box-shadow:0 8px 20px #2a6df466}.button.primary:active{transform:translateY(0)}.button.secondary{background:var(--color-primary-soft);color:var(--color-primary);border-color:#2563eb3d}.button.secondary:hover{background:#2a6df42e;border-color:#2563eb66}.button.ghost{background:transparent;color:var(--color-text);border-color:var(--color-border)}.button.ghost:hover{background:var(--color-surface-glass);border-color:var(--color-border-strong)}.button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none!important}.button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.section-title{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);font-weight:600;margin-bottom:.75rem}@media (max-width: 1400px){.app-content{grid-template-columns:240px minmax(0,1fr) 320px}}@media (max-width: 1200px){.app-content{grid-template-columns:240px minmax(0,1fr);grid-template-areas:"palette canvas" "properties properties"}.app-pane--properties{min-height:320px}}@media (max-width: 960px){.app-content{grid-template-columns:minmax(0,1fr);grid-template-areas:"canvas" "properties" "palette";padding:1rem;gap:1rem}.surface{border-radius:calc(var(--radius-base) - 2px)}.app-pane--palette .surface,.app-pane--properties .surface{max-height:none}}@media (max-width: 640px){body{background:var(--color-surface)}.app-shell{grid-template-rows:auto 1fr}.app-content{padding:.75rem;gap:.75rem}.surface{border-radius:calc(var(--radius-base) - 4px)}.button{padding:.5rem .95rem}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.animate-fade-in{animation:fadeIn .4s cubic-bezier(.4,0,.2,1)}.animate-slide-up{animation:slideUp .5s cubic-bezier(.4,0,.2,1)}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.skeleton{background:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0);background-size:1000px 100%;animation:shimmer 2s linear infinite;border-radius:var(--radius-base)}*:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:4px}.page-enter{opacity:0;transform:scale(.98)}.page-enter-active{opacity:1;transform:scale(1);transition:all .3s cubic-bezier(.4,0,.2,1)}.page-exit{opacity:1}.page-exit-active{opacity:0;transition:opacity .2s cubic-bezier(.4,0,.2,1)}.chart-container{padding:1.5rem;background:var(--color-surface);border-radius:var(--radius-base);box-shadow:var(--shadow-md)}.chart-title{font-size:1.125rem;font-weight:600;color:var(--color-text);margin-bottom:1rem}.line-chart,.bar-chart,.pie-chart,.funnel-chart,.heatmap-chart{width:100%;height:auto}.chart-line{transition:stroke-width .2s ease}.chart-line:hover{stroke-width:3}.chart-point{transition:r .2s ease;cursor:pointer}.chart-point:hover{r:6}.chart-bar{transition:opacity .2s ease;cursor:pointer}.chart-bar:hover{opacity:.8}.chart-slice{transition:opacity .2s ease;cursor:pointer}.chart-slice:hover{opacity:.9}.funnel-stage{transition:opacity .2s ease;cursor:pointer}.funnel-stage:hover{opacity:.9}.heatmap-cell{transition:opacity .2s ease;cursor:pointer}.heatmap-cell:hover{opacity:.8}.chart-legend{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--color-border)}.legend-item{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.legend-color{width:16px;height:16px;border-radius:4px;flex-shrink:0}.legend-label{color:var(--color-text)}.legend-value{color:var(--color-text-muted);font-weight:500}@media (max-width: 768px){.chart-container{padding:1rem}.chart-title{font-size:1rem}.chart-legend{flex-direction:column;gap:.5rem}}:root{--container-max: 1280px;--spacing-mobile: 1rem;--spacing-tablet: 1.5rem;--spacing-desktop: 2rem}@media (max-width: 767px){button,a,input[type=checkbox],input[type=radio],.clickable{min-height:44px;min-width:44px}.builder-canvas{grid-template-columns:1fr}.field-palette,.properties-panel{position:fixed;bottom:0;left:0;right:0;max-height:70vh;transform:translateY(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:1000;border-radius:var(--radius-base) var(--radius-base) 0 0}.field-palette.open,.properties-panel.open{transform:translateY(0);box-shadow:0 -4px 20px #00000026}.mobile-nav-toggle{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--color-primary);color:#fff;border:none;cursor:pointer;box-shadow:var(--shadow-lg)}}@media (min-width: 768px){.builder-canvas{grid-template-columns:240px 1fr 280px}.form-field{padding:1.25rem}.app-content{padding:var(--spacing-tablet)}}@media (min-width: 1024px){.builder-canvas{grid-template-columns:280px 1fr 320px}.top-bar{padding:1.5rem 2rem}.app-content{padding:var(--spacing-desktop)}}@media (min-width: 1440px){.container{max-width:var(--container-max);margin:0 auto}}@media (max-width: 767px) and (orientation: landscape){.field-palette,.properties-panel{max-height:50vh}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.icon,.logo{image-rendering:-webkit-optimize-contrast}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (prefers-color-scheme: dark){:root{--color-bg-solid: #1a1a1a;--color-surface: rgba(30, 30, 30, .95);--color-text: #f3f4f6;--color-text-muted: #9ca3af;--color-border: #374151}}.cookie-banner{position:fixed;bottom:0;left:0;right:0;background:var(--color-surface);border-top:1px solid var(--color-border);box-shadow:0 -4px 20px #0000001a;padding:1.5rem;z-index:9999;animation:slideUp .3s cubic-bezier(.4,0,.2,1)}.cookie-banner-content{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:2rem}.cookie-banner-text{flex:1;font-size:.875rem;color:var(--color-text)}.cookie-banner-text a{color:var(--color-primary);text-decoration:underline}.cookie-banner-actions{display:flex;gap:1rem;flex-shrink:0}@media (max-width: 768px){.cookie-banner-content{flex-direction:column;align-items:stretch}.cookie-banner-actions{flex-direction:column}.cookie-banner-actions button{width:100%}}.pwa-install-prompt{position:fixed;bottom:1rem;right:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-base);padding:1rem;box-shadow:var(--shadow-lg);max-width:320px;z-index:9998;animation:slideUp .3s cubic-bezier(.4,0,.2,1)}.pwa-install-prompt-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}.pwa-install-prompt-icon{width:48px;height:48px;border-radius:12px;background:var(--color-primary);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem}.pwa-install-prompt-title{font-weight:600;font-size:1rem}.pwa-install-prompt-text{font-size:.875rem;color:var(--color-text-muted);margin-bottom:1rem}.pwa-install-prompt-actions{display:flex;gap:.5rem}@media (max-width: 768px){.pwa-install-prompt{bottom:0;right:0;left:0;max-width:none;border-radius:var(--radius-base) var(--radius-base) 0 0}}.app-layout{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.app-layout--no-sidebar{grid-template-columns:1fr}.sidebar{position:sticky;top:0;height:100vh;overflow-y:auto;scrollbar-width:thin}.sidebar::-webkit-scrollbar{width:6px}.sidebar::-webkit-scrollbar-thumb{background-color:#0f172a1f;border-radius:999px}.nav-link{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:calc(var(--radius-base) - 2px);font-size:.9rem;font-weight:500;color:var(--color-text);text-decoration:none;transition:all .15s}.nav-link:hover{background:var(--color-bg-solid)}.nav-link--active{background:var(--color-primary-soft);color:var(--color-primary)}.nav-link--active:hover{background:var(--color-primary-soft)}@media (max-width: 768px){.app-layout{grid-template-columns:1fr}.sidebar{position:fixed;left:0;top:0;bottom:0;transform:translate(-100%);z-index:999;box-shadow:var(--shadow-lg)}.sidebar--open{transform:translate(0)}.sidebar-overlay{display:block!important}.mobile-menu-toggle{position:fixed;bottom:1.5rem;right:1.5rem;width:56px;height:56px;border-radius:50%;background:var(--color-primary);color:#fff;border:none;cursor:pointer;box-shadow:var(--shadow-lg);display:flex;align-items:center;justify-content:center;font-size:1.5rem;z-index:997;transition:transform .2s}.mobile-menu-toggle:active{transform:scale(.95)}header{flex-direction:column!important;align-items:flex-start!important;gap:1rem!important}header>div:last-child{width:100%}header button{width:100%}}@media (min-width: 769px){.sidebar-overlay{display:none!important}.mobile-menu-toggle{display:none}}.data-table{width:100%;border-collapse:collapse;font-size:.875rem}.data-table thead{background:var(--color-bg-solid);border-bottom:2px solid var(--color-border)}.data-table th{padding:.75rem 1rem;text-align:left;font-weight:600;color:var(--color-text-muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}.data-table td{padding:.875rem 1rem;border-bottom:1px solid var(--color-border)}.data-table tbody tr:hover{background:var(--color-bg-solid)}.data-table tbody tr:last-child td{border-bottom:none}.field{display:flex;flex-direction:column;gap:.5rem}.field>span{font-size:.875rem;font-weight:500;color:var(--color-text)}.field input,.field select,.field textarea{padding:.625rem .875rem;border:1px solid var(--color-border);border-radius:calc(var(--radius-base) - 2px);font-size:.9rem;font-family:inherit;color:var(--color-text);background:var(--color-surface);transition:border-color .15s,box-shadow .15s}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft)}.field input:disabled,.field select:disabled,.field textarea:disabled{opacity:.6;cursor:not-allowed;background:var(--color-bg-solid)}