:root{--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px;--background: oklch(.99 .003 250);--foreground: oklch(.2 .01 250);--card: oklch(1 0 0);--card-foreground: oklch(.2 .01 250);--card-hover: oklch(.97 .005 250);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .01 250);--primary: oklch(.62 .16 150);--primary-foreground: oklch(.98 .01 150);--primary-glow: rgba(16, 185, 129, .2);--secondary: oklch(.96 .006 250);--secondary-foreground: oklch(.25 .01 250);--muted: oklch(.96 .006 250);--muted-foreground: oklch(.52 .01 250);--accent: oklch(.96 .02 150);--accent-foreground: oklch(.3 .05 150);--accent-orange: #F97316;--accent-orange-glow: rgba(249, 115, 22, .25);--accent-purple: #8B5CF6;--destructive: oklch(.58 .22 27);--destructive-foreground: oklch(.98 .01 27);--warning: oklch(.78 .16 75);--warning-foreground: oklch(.3 .05 75);--border: oklch(.91 .005 250);--border-glass: oklch(.91 .005 250 / .8);--input: oklch(.91 .005 250);--ring: oklch(.62 .16 150);--font-sans: "Be Vietnam Pro", "Inter", -apple-system, sans-serif;--font-heading: "Be Vietnam Pro", "Inter", -apple-system, sans-serif;--font-body: "Be Vietnam Pro", "Inter", -apple-system, sans-serif;--font-cta: "Be Vietnam Pro", "Roboto", -apple-system, sans-serif;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1)}.dark{--background: oklch(.18 .01 250);--foreground: oklch(.96 .005 250);--card: oklch(.21 .012 250);--card-foreground: oklch(.96 .005 250);--card-hover: oklch(.24 .012 250);--popover: oklch(.21 .012 250);--popover-foreground: oklch(.96 .005 250);--primary: oklch(.68 .16 150);--primary-foreground: oklch(.18 .02 150);--primary-glow: rgba(16, 185, 129, .35);--secondary: oklch(.26 .01 250);--secondary-foreground: oklch(.96 .005 250);--muted: oklch(.26 .01 250);--muted-foreground: oklch(.68 .01 250);--accent: oklch(.3 .03 150);--accent-foreground: oklch(.92 .03 150);--destructive: oklch(.62 .2 27);--destructive-foreground: oklch(.96 .01 27);--warning: oklch(.78 .16 75);--warning-foreground: oklch(.2 .03 75);--border: oklch(.3 .01 250);--border-glass: oklch(.3 .01 250 / .6);--input: oklch(.32 .01 250);--ring: oklch(.68 .16 150)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--background);color:var(--foreground);font-family:var(--font-sans);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;transition:background-color var(--transition-normal),color var(--transition-normal)}.glass-panel{background:var(--card);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-glass);border-radius:var(--radius-md);box-shadow:0 10px 30px #00000026;transition:background-color var(--transition-normal),border-color var(--transition-normal)}.glass-panel-interactive{transition:all var(--transition-normal)}.glass-panel-interactive:hover{background:var(--card-hover);border-color:var(--primary);transform:translateY(-2px)}h1,h2,h3,h4{font-family:var(--font-heading);letter-spacing:-.02em}.gradient-text{background:linear-gradient(135deg,#FFFFFF 0%,#CBD5E1 50%,var(--accent-orange) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.gradient-text-purple{background:linear-gradient(135deg,#a855f7,#6366f1,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#0f172a99}::-webkit-scrollbar-thumb{background:#94a3b84d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#f9731699}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--radius-sm);font-family:var(--font-cta, inherit);font-weight:600;cursor:pointer;border:1px solid transparent;outline:none;transition:all var(--transition-fast);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn-default{background:var(--primary);color:var(--primary-foreground);box-shadow:0 4px 14px var(--primary-glow)}.btn-default:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 6px 18px var(--primary-glow)}.btn-primary{background:linear-gradient(135deg,var(--primary) 0%,oklch(.58 .16 150) 100%);color:var(--primary-foreground);box-shadow:0 4px 16px var(--primary-glow);font-weight:700}.btn-primary:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 6px 20px var(--primary-glow)}.btn-secondary{background:var(--secondary);color:var(--secondary-foreground);border:1px solid var(--border)}.btn-secondary:hover{background:var(--card-hover);border-color:var(--primary)}.btn-destructive{background:var(--destructive);color:var(--destructive-foreground);box-shadow:0 4px 12px #ef444433}.btn-destructive:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn-outline{background:transparent;color:var(--primary);border:1px solid var(--primary)}.btn-outline:hover{background:var(--primary-glow);color:var(--primary)}.btn-ghost{background:transparent;color:var(--muted-foreground)}.btn-ghost:hover{background:var(--muted);color:var(--foreground)}.btn-ai{background:linear-gradient(135deg,var(--accent-purple) 0%,#6366F1 50%,var(--primary) 100%);color:var(--primary-foreground);box-shadow:0 4px 16px #8b5cf659;font-weight:700}.btn-ai:hover{filter:brightness(1.12);transform:translateY(-1px);box-shadow:0 6px 22px #8b5cf680}.btn-sm{padding:4px 10px;font-size:11px;border-radius:var(--radius-sm)}.btn-md{padding:8px 14px;font-size:13px;border-radius:var(--radius-sm)}.btn-lg{padding:12px 20px;font-size:15px;border-radius:var(--radius-md)}.btn-icon{padding:0;width:34px;height:34px;border-radius:var(--radius-sm)}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;line-height:1.4;border:1px solid transparent;-webkit-user-select:none;user-select:none}.badge-default{background:var(--primary-glow);color:var(--primary);border-color:color-mix(in oklch,var(--primary) 30%,transparent)}.badge-locked{background:#ef44441f;color:#ef4444;border-color:#ef444440}.badge-unlocked{background:#10b9811f;color:#10b981;border-color:#10b98140}.badge-accent{background:var(--primary-glow);color:var(--primary);border-color:color-mix(in oklch,var(--primary) 30%,transparent)}.badge-secondary{background:var(--secondary);color:var(--muted-foreground);border-color:var(--border)}.guardrail-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;background:#f9731626;color:var(--accent-orange);border:1px solid rgba(249,115,22,.3)}.guardrail-badge-locked{background:#ef444426;color:#ef4444;border-color:#ef44444d}.form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.form-label{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:600;color:var(--text-muted)}.input-text,.input-textarea,.input-select{width:100%;padding:10px 14px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--foreground);font-family:var(--font-sans);font-size:14px;outline:none;transition:border-color var(--transition-fast),background-color var(--transition-fast)}.input-text:focus,.input-textarea:focus,.input-select:focus{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-glow)}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseGlow{0%,to{opacity:.6}50%{opacity:1}}.animate-fade-in{animation:fadeIn .3s cubic-bezier(.4,0,.2,1) forwards}.animate-pulse-glow{animation:pulseGlow 2s infinite}.card{border-radius:var(--radius-md);border:1px solid var(--border);background-color:var(--card);color:var(--card-foreground);box-shadow:0 4px 20px #0000000d;overflow:hidden;transition:background-color var(--transition-normal),border-color var(--transition-normal),transform var(--transition-fast)}.dark .card{box-shadow:0 8px 32px #00000040}.card-header{padding:16px 20px;border-bottom:1px solid var(--border)}.card-title{font-size:16px;font-weight:700;color:var(--foreground);margin:0}.card-content{padding:20px}:root{--text-main: var(--foreground);--text-muted: var(--muted-foreground);--text-dim: var(--muted-foreground);--bg-dark: var(--background);--bg-card: var(--card);--bg-card-hover: var(--card-hover);--border-glass: var(--border)}.dark{--text-main: var(--foreground);--text-muted: var(--muted-foreground);--text-dim: var(--muted-foreground);--bg-dark: var(--background);--bg-card: var(--card);--bg-card-hover: var(--card-hover);--border-glass: var(--border)}.editor-workspace{background-color:var(--background)!important;background-image:radial-gradient(var(--border) 1px,transparent 1px)!important;background-size:24px 24px!important}.editor-pages-strip{background-color:var(--card)!important;border:1px solid var(--border)!important;box-shadow:0 4px 12px #0000000d!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important}html:not(.dark) .editor-pages-strip button{color:var(--foreground)!important}.editor-sidebar{background-color:var(--card)!important;border-right:1px solid var(--border)!important}html:not(.dark) .editor-sidebar div[style*="rgba(15, 23, 42"],html:not(.dark) .editor-sidebar div[style*=linear-gradient],html:not(.dark) .editor-sidebar aside[style*="rgba(15, 23, 42"]{background:var(--card)!important;background-image:none!important;border-color:var(--border)!important;color:var(--foreground)!important}html:not(.dark) .editor-sidebar div[style*="background: rgba(15, 23, 42"],html:not(.dark) .editor-sidebar div[style*="background:rgba(15, 23, 42"]{background:var(--secondary)!important;border-color:var(--border)!important}html:not(.dark) .editor-sidebar div[style*="rgba(30, 41, 59, 0.85)"]{background:var(--accent)!important;border-color:var(--primary)!important}html:not(.dark) .editor-sidebar div[style*="rgba(15, 23, 42, 0.55)"]{background:var(--card)!important;border-color:var(--border)!important}html:not(.dark) .editor-sidebar div[style*="rgba(0,0,0,0.25)"],html:not(.dark) .editor-sidebar div[style*="rgba(0, 0, 0, 0.25)"]{background:var(--secondary)!important;border:1px solid var(--border)!important}html:not(.dark) .editor-sidebar span[style*="color: rgb(255, 255, 255)"],html:not(.dark) .editor-sidebar span[style*="color: #FFF"],html:not(.dark) .editor-sidebar span[style*="color:#FFF"],html:not(.dark) .editor-sidebar span[style*="color: rgb(248, 250, 252)"],html:not(.dark) .editor-sidebar label[style*="color: rgb(255, 255, 255)"],html:not(.dark) .editor-sidebar label[style*="color: #FFF"],html:not(.dark) .editor-sidebar label[style*="color:#FFF"]{color:var(--foreground)!important}html:not(.dark) .editor-sidebar h3,html:not(.dark) .editor-sidebar h4,html:not(.dark) .editor-sidebar p{color:var(--foreground)!important}.editor-sidebar button[style*=borderBottom]{background:transparent!important}html:not(.dark) .editor-sidebar button[style*=transparent]{color:var(--muted-foreground)!important}html:not(.dark) .editor-sidebar button[style*=borderColor]{border-color:var(--primary)!important;color:var(--primary)!important;background:var(--card)!important}html:not(.dark) .editor-sidebar button[style*=borderColor]:hover{background:var(--secondary)!important}html:not(.dark) .editor-sidebar button[style*="rgba(255, 255, 255"],html:not(.dark) .editor-sidebar span[style*="rgba(255, 255, 255"]{background:var(--secondary)!important;border-color:var(--border)!important;color:var(--foreground)!important}html:not(.dark) .editor-sidebar button[style*="rgba(255, 255, 255"] svg,html:not(.dark) .editor-sidebar span[style*="rgba(255, 255, 255"] svg{stroke:var(--foreground)!important}html:not(.dark) .editor-sidebar button[style*="rgba(255,255,255,0.06)"],html:not(.dark) .editor-sidebar button[style*="rgba(255,255,255,0.08)"],html:not(.dark) .editor-sidebar button[style*="rgba(255, 255, 255, 0.06)"],html:not(.dark) .editor-sidebar button[style*="rgba(255, 255, 255, 0.08)"]{background:var(--secondary)!important;color:var(--muted-foreground)!important}html:not(.dark) .editor-sidebar button[style*="rgba(255,255,255,0.06)"] svg,html:not(.dark) .editor-sidebar button[style*="rgba(255, 255, 255, 0.06)"] svg{stroke:var(--muted-foreground)!important}html:not(.dark) .editor-sidebar input,html:not(.dark) .editor-sidebar select,html:not(.dark) .editor-sidebar textarea{background:var(--card)!important;color:var(--foreground)!important;border-color:var(--border)!important}html:not(.dark) header div[style*="rgba(15, 23, 42"],html:not(.dark) div[style*="position: absolute"][style*="rgba(15, 23, 42"]{background:var(--card)!important;border:1px solid var(--border)!important;box-shadow:0 10px 25px #0000001a!important}html:not(.dark) header div[style*="rgba(15, 23, 42"] button,html:not(.dark) div[style*="position: absolute"][style*="rgba(15, 23, 42"] button{color:var(--foreground)!important}html:not(.dark) header div[style*="rgba(15, 23, 42"] button:hover,html:not(.dark) div[style*="position: absolute"][style*="rgba(15, 23, 42"] button:hover{background:var(--secondary)!important}html:not(.dark) header div[style*="rgba(15, 23, 42"] svg,html:not(.dark) div[style*="position: absolute"][style*="rgba(15, 23, 42"] svg{stroke:var(--foreground)!important}html:not(.dark) div[style*="position: fixed"][style*="inset: 0"]{background:#ffffffb3!important;-webkit-backdrop-filter:blur(16px)!important;backdrop-filter:blur(16px)!important}html:not(.dark) .glass-panel{background-color:var(--card)!important;border-color:var(--border)!important;box-shadow:0 20px 40px #00000014!important;color:var(--foreground)!important}html:not(.dark) .glass-panel div[style*="rgba(15, 23, 42"],html:not(.dark) .glass-panel div[style*="rgba(30, 41, 59"],html:not(.dark) .glass-panel div[style*=linear-gradient][style*="15, 23, 42"],html:not(.dark) .glass-panel div[style*=linear-gradient][style*="30, 41, 59"]{background:var(--secondary)!important;background-image:none!important;border-color:var(--border)!important;color:var(--foreground)!important}html:not(.dark) .glass-panel h2,html:not(.dark) .glass-panel h3,html:not(.dark) .glass-panel h4,html:not(.dark) .glass-panel p,html:not(.dark) .glass-panel span[style*="color: rgb(255, 255, 255)"],html:not(.dark) .glass-panel span[style*="color: #FFF"],html:not(.dark) .glass-panel span[style*="color:#FFF"]{color:var(--foreground)!important}html:not(.dark) .glass-panel div[style*="rgba(15, 23, 42, 0.65)"]{background:var(--secondary)!important;border-color:var(--border)!important}html:not(.dark) .glass-panel input,html:not(.dark) .glass-panel select,html:not(.dark) .glass-panel textarea{background:var(--card)!important;color:var(--foreground)!important;border-color:var(--border)!important}