:root{--color-primary: #FF6B00;--color-primary-hover: #E65A00;--color-primary-light: #FFF0E6;--safe-area-top: env(safe-area-inset-top);--safe-area-bottom: env(safe-area-inset-bottom);--safe-area-left: env(safe-area-inset-left);--safe-area-right: env(safe-area-inset-right);--color-bg: #F9F9F8;--color-bg-primary: #F9F9F8;--color-bg-secondary: #FFFFFF;--color-bg-tertiary: #F0F0F0;--color-surface: #FFFFFF;--color-bubble-ai: #F2F2F2;--color-text: #1A1A1A;--color-text-secondary: #666666;--color-text-tertiary: #999999;--color-border: #E5E5E5;--color-border-light: #F0F0F0;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .05), 0 2px 4px -1px rgba(0, 0, 0, .03);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .05), 0 4px 6px -2px rgba(0, 0, 0, .025);--font-main: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--color-code-bg: #F8F9FA;--color-code-header: #E9ECEF;--color-code-text: #1A1A1A}[data-theme=dark]{--color-bg: #1A1A1A;--color-bg-primary: #1A1A1A;--color-bg-secondary: #2A2A2A;--color-bg-tertiary: #333333;--color-surface: #2A2A2A;--color-bubble-ai: #333333;--color-text: #FFFFFF;--color-text-secondary: #A0A0A0;--color-text-tertiary: #666666;--color-border: #444444;--color-border-light: #333333;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .3), 0 2px 4px -1px rgba(0, 0, 0, .2);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -2px rgba(0, 0, 0, .2);--color-primary-light: rgba(255, 107, 0, .15);--color-code-bg: #2D2D2D;--color-code-header: #3A3A3A;--color-code-text: #FFFFFF}*{box-sizing:border-box}body{margin:0;font-family:var(--font-main);background-color:var(--color-bg);color:var(--color-text);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{font-family:inherit;cursor:pointer}a{color:inherit;text-decoration:none}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}.card{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-md);box-shadow:var(--shadow-sm)}.btn-primary{background-color:var(--color-primary);color:#fff;border:none;padding:12px 20px;border-radius:var(--radius-sm);font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px #ff6b004d}.btn-primary:hover{background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 4px 8px #ff6b0066}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{background-color:transparent;color:var(--color-text);border:1px solid var(--color-border);padding:12px 20px;border-radius:var(--radius-sm);font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{background-color:var(--color-bg-secondary);border-color:var(--color-text-tertiary)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin-animation{animation:spin 2s linear infinite}