:root{--color-primary:#6d28d9;--color-primary-dark:#4c1d95;--color-primary-light:#8b5cf6;--color-surface:#fffffff7;--color-surface-muted:#fcfaff;--color-border:#e9ddff;--color-border-input:#d8b4fe;--color-text:#1f1b2d;--color-text-muted:#6b7280;--color-label:#5b21b6;--color-heading:#3b0764;--color-danger:#b91c1c;--color-danger-bg:#fef2f2;--color-success:#15803d;--color-success-bg:#f0fdf4;--color-warning:#b45309;--color-warning-bg:#fffbeb;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-full:999px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--shadow-card:0 12px 28px #4c1d9514;--shadow-topbar:0 16px 40px #4c1d9538;--font-body:14px;--font-caption:12px;--font-title:18px;--bg-app:radial-gradient(circle at 10% 10%, #a78bfa59, transparent 35%), radial-gradient(circle at 90% 0%, #c084fc40, transparent 28%), linear-gradient(180deg, #f7f1ff 0%, #f6f7ff 100%)}[data-theme=dark]{--color-surface:#1e1b2ef7;--color-surface-muted:#252238;--color-border:#3f3a5c;--color-border-input:#5b5380;--color-text:#f3f0ff;--color-text-muted:#a8a3b8;--color-label:#c4b5fd;--color-heading:#ede9fe;--color-danger-bg:#3f1d1d;--color-success-bg:#14291a;--color-warning-bg:#3f2a0a;--shadow-card:0 12px 28px #00000059;--bg-app:linear-gradient(180deg, #14121f 0%, #1a1728 100%)}*{box-sizing:border-box}body{font-family:Segoe UI,PingFang TC,Noto Sans TC,system-ui,sans-serif;font-size:var(--font-body);color:var(--color-text);background:var(--bg-app);margin:0}#root{min-height:100vh}.app{max-width:1200px;padding:var(--space-5);color:var(--color-text);flex-direction:column;min-height:100vh;margin:0 auto;display:flex}.auth-wrap{flex:1;justify-content:center;align-items:center;display:flex}.auth-card{width:min(480px,100%)}.auth-brand{align-items:center;gap:var(--space-3);margin-bottom:var(--space-2);color:var(--color-heading);display:flex}.auth-brand h2{margin:0}.auth-form{flex-direction:column;gap:10px;display:flex}.auth-error{color:var(--color-danger);font-size:var(--font-caption);margin:0}.auth-public{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border);gap:var(--space-2);flex-direction:column;display:flex}.auth-public-btn{justify-content:center;width:100%}.shake{animation:.35s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.topbar{justify-content:space-between;align-items:center;gap:var(--space-3);background:linear-gradient(120deg, var(--color-primary-dark) 0%, var(--color-primary) 55%, var(--color-primary-light) 100%);border-radius:var(--radius-lg);box-shadow:var(--shadow-topbar);border:1px solid #ffffff38;padding:14px 18px;display:flex}.brand{color:#fff;align-items:center;gap:10px;display:flex}.brand h1{margin:0;font-size:20px;font-weight:700}.brand-tagline{font-size:var(--font-caption);opacity:.9;margin:2px 0 0}.controls{align-items:center;gap:var(--space-2);display:flex}.topbar-user{font-size:var(--font-caption);color:var(--color-muted);border-radius:var(--radius-pill);background:var(--color-surface-muted);padding:4px 10px}.settings-menu{position:relative}.settings-dropdown{background:var(--color-surface);min-width:240px;color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3);box-shadow:var(--shadow-card);gap:var(--space-2);z-index:20;flex-direction:column;display:flex;position:absolute;top:calc(100% + 8px);right:0}.menu-item{border:1px solid var(--color-border);background:var(--color-surface-muted);color:var(--color-text);border-radius:var(--radius-sm);cursor:pointer;align-items:center;gap:8px;padding:8px 10px;font-weight:600;display:inline-flex}.menu-item:hover{filter:brightness(1.03)}.ghost-btn,.subtle-btn,.icon-btn{color:#fff;box-shadow:none;background:#ffffff26;border:1px solid #ffffff40}.subtle-btn,.icon-btn{background:var(--color-surface-muted);border:1px solid var(--color-border);color:var(--color-heading)}.icon-btn{border-radius:var(--radius-sm);padding:6px 8px}.ghost-btn:hover:not(:disabled),.subtle-btn:hover:not(:disabled),.icon-btn:hover:not(:disabled){filter:brightness(1.03);transform:translateY(-1px)}.tabs{gap:var(--space-2);flex-wrap:wrap;margin-top:14px;display:flex}.tabs button{border:1px solid var(--color-border);background:var(--color-surface-muted);color:var(--color-heading);border-radius:var(--radius-full);cursor:pointer;align-items:center;gap:6px;padding:8px 14px;font-weight:600;transition:all .2s;display:inline-flex}.tabs button[aria-selected=true],.tabs .active{background:linear-gradient(120deg, var(--color-primary) 0%, var(--color-primary-light) 100%);color:#fff;border-color:var(--color-primary-light);box-shadow:0 8px 20px #7c3aed59}.alert{align-items:center;gap:var(--space-2);background:var(--color-danger-bg);color:var(--color-danger);border-radius:var(--radius-md);border:1px solid #fecaca;margin:12px 0;padding:10px 12px;display:flex}.alert-retry{color:var(--color-danger);background:var(--color-surface);border-color:#fecaca;margin-left:auto}.grid{gap:var(--space-4);flex:1;grid-template-columns:minmax(340px,1fr) minmax(380px,1.2fr);margin-top:14px;display:grid}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:var(--shadow-card);flex-direction:column;gap:9px;display:flex}.card h2{font-size:var(--font-title);color:var(--color-heading);margin:0 0 6px}.panel-header{justify-content:space-between;align-items:flex-start;gap:var(--space-3);margin-bottom:var(--space-2);display:flex}.panel-header-text{flex:1;min-width:0}.panel-header-text h2{margin:0 0 6px}.panel-header-text .panel-intro{margin:0}.panel-clear-btn{color:var(--color-heading);border:1px solid var(--color-border);background:var(--color-surface);box-shadow:none;flex-shrink:0;align-items:center;gap:4px;padding:6px 12px;font-size:13px;font-weight:600;display:inline-flex}.panel-clear-btn:hover:not(:disabled){color:var(--color-danger);border-color:var(--color-danger);background:#ef44440f;transform:none}.panel-clear-btn:disabled{opacity:.55;cursor:not-allowed}.panel-intro{margin:0 0 var(--space-4)}.settings-hint{margin:0 0 var(--space-2)}label{color:var(--color-label);font-size:13px;font-weight:600}textarea,select,input,button{font:inherit}textarea,select,input{border:1px solid var(--color-border-input);background:var(--color-surface);color:var(--color-text);border-radius:10px;padding:9px 11px;transition:border-color .2s,box-shadow .2s}textarea:focus,select:focus,input:focus{border-color:var(--color-primary-light);outline:none;box-shadow:0 0 0 3px #8b5cf62e}textarea{min-height:84px}.message-field{flex-direction:column;gap:6px;display:flex}.message-field-header{justify-content:space-between;align-items:center;gap:var(--space-2);display:flex}.message-field-header label{margin:0}.message-field-clear{color:var(--color-muted);border-color:var(--color-border);background:0 0;padding:4px 10px;font-size:12px}.message-field-clear:disabled{opacity:.55;cursor:not-allowed}.message-field-clear:hover:not(:disabled){color:var(--color-danger);border-color:var(--color-danger);background:#ef44440f}textarea.message-input{resize:vertical;width:100%;overflow-y:auto}textarea.message-input--large{min-height:160px;max-height:320px;font-size:15px;line-height:1.6}textarea.message-input--compact{min-height:84px;max-height:180px}textarea.readonly-scroll{resize:none;max-height:220px;overflow-y:auto}button{border:1px solid var(--color-primary-light);background:linear-gradient(120deg, var(--color-primary) 0%, var(--color-primary-light) 100%);color:#fff;cursor:pointer;border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:9px 12px;font-weight:600;transition:transform .15s,box-shadow .2s,filter .2s;display:inline-flex}button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 18px #6d28d947}button:disabled{opacity:.55;cursor:not-allowed}.primary-btn{width:100%}.panel-with-sticky{padding-bottom:72px;position:relative}.sticky-submit{padding-top:var(--space-3);background:linear-gradient(180deg, transparent, var(--color-surface) 30%);margin-top:auto;position:sticky;bottom:0}.form-section{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:0 var(--space-3);background:var(--color-surface-muted);position:relative}.form-section-summary{cursor:pointer;color:var(--color-heading);padding:10px 88px 10px 0;font-weight:700;list-style:none}.form-section summary::-webkit-details-marker{display:none}.form-section-clear{top:10px;right:var(--space-3);color:var(--color-muted);padding:4px 10px;font-size:12px;font-weight:500;position:absolute}.form-section-clear:hover:not(:disabled){color:var(--color-danger);border-color:var(--color-danger);background:#ef44440f}.form-section-clear:disabled{opacity:.45;cursor:not-allowed;transform:none}.form-section-body{padding-bottom:var(--space-3);flex-direction:column;gap:9px;display:flex}.field-row{gap:var(--space-2);display:grid}.field-row-3{grid-template-columns:repeat(3,minmax(0,1fr))}.char-count{font-size:var(--font-caption);color:var(--color-text-muted);margin:0}.toggle-row{justify-content:space-between;align-items:center;gap:var(--space-3);padding:8px 0;display:flex}.toggle-copy label{display:block}.toggle-switch{border-radius:var(--radius-full);background:#d1d5db;border:none;flex-shrink:0;width:46px;height:26px;padding:0;position:relative}.toggle-switch.on{background:var(--color-primary)}.toggle-knob{background:#fff;border-radius:50%;width:20px;height:20px;transition:transform .2s;position:absolute;top:3px;left:3px}.toggle-switch.on .toggle-knob{transform:translate(20px)}.meta{color:var(--color-primary);align-items:center;gap:4px;font-size:13px;display:flex}.loading-step{animation:1.2s infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}.analysis-summary{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-muted);padding:0 var(--space-3)}.analysis-summary summary{align-items:center;gap:var(--space-2);cursor:pointer;color:var(--color-heading);padding:10px 0;font-weight:700;list-style:none;display:flex}.analysis-summary summary::-webkit-details-marker{display:none}.analysis-summary .chevron{margin-left:auto;transition:transform .2s}.analysis-summary[open] .chevron{transform:rotate(180deg)}.analysis-body p,.analysis-body ul{margin:0 0 8px}.badge{border-radius:var(--radius-full);font-size:var(--font-caption);align-items:center;padding:2px 10px;font-weight:700;display:inline-flex}.badge-success{background:var(--color-success-bg);color:var(--color-success)}.badge-warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge-danger{background:var(--color-danger-bg);color:var(--color-danger)}.badge-neutral{background:var(--color-surface-muted);color:var(--color-text-muted)}.email-preview{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);overflow:hidden}.email-preview-header{gap:var(--space-2);background:var(--color-surface-muted);border-bottom:1px solid var(--color-border);grid-template-columns:auto 1fr auto;align-items:center;padding:10px 12px;display:grid}.email-preview-label{font-size:var(--font-caption);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em}.email-preview-subject{color:var(--color-heading);font-weight:700}.email-preview-body{white-space:pre-wrap;min-height:160px;padding:14px 16px;font-size:15px;line-height:1.7}.result-actions{gap:var(--space-2);flex-wrap:wrap;display:flex}.variants-collapse{border:1px dashed var(--color-border);border-radius:var(--radius-md);padding:0 var(--space-3)}.variants-collapse summary{cursor:pointer;color:var(--color-heading);padding:10px 0;font-weight:600}.variant-grid{padding-bottom:var(--space-3);grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.variant-card{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-muted);flex-direction:column;gap:6px;padding:10px;transition:transform .15s,box-shadow .2s;display:flex}.variant-card:hover{box-shadow:var(--shadow-card);transform:translateY(-2px)}.skeleton-wrap{flex-direction:column;gap:10px;display:flex}.skeleton{border-radius:var(--radius-sm);background:linear-gradient(90deg,#ece7fb 25%,#f5f1ff 50%,#ece7fb 75%) 0 0/200% 100%;animation:1.2s infinite shimmer}[data-theme=dark] .skeleton{background:linear-gradient(90deg,#2d2940 25%,#3a3550 50%,#2d2940 75%) 0 0/200% 100%}.skeleton-line{height:14px}.skeleton-line.w-30{width:30%}.skeleton-line.w-45{width:45%}.skeleton-line.w-60{width:60%}.skeleton-block{height:96px}.skeleton-block.tall{height:180px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.empty-state{text-align:center;color:var(--color-text-muted);padding:28px 12px}.empty-title{color:var(--color-heading);margin:8px 0 4px;font-weight:700}.history-panel .history-header{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.history-list{flex-direction:column;gap:10px;margin:12px 0 0;padding:0;list-style:none;display:flex}.history-item{text-align:left;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-muted);width:100%;color:var(--color-text);cursor:pointer;padding:10px 12px;transition:transform .15s,box-shadow .2s}.history-item:hover{box-shadow:var(--shadow-card);transform:translateY(-1px)}.history-meta{justify-content:space-between;gap:var(--space-2);margin-bottom:6px;font-size:13px;display:flex}.history-item p{margin:0}.manual{margin-top:14px;line-height:1.7}.manual h3{margin:10px 0 4px;font-size:16px}.manual ul,.manual ol{margin:0 0 8px;padding-left:20px}.app-footer{padding-top:var(--space-4);justify-content:space-between;gap:var(--space-3);font-size:var(--font-caption);color:var(--color-text-muted);flex-wrap:wrap;margin-top:auto;display:flex}.toast-stack{z-index:100;flex-direction:column;gap:8px;display:flex;position:fixed;top:16px;right:16px}.toast-item{background:var(--color-heading);color:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:10px 14px;animation:.25s toast-in}@keyframes toast-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.strategy-note{margin:0}@media (width<=980px){.app{padding:var(--space-3)}.topbar{flex-direction:column;align-items:stretch}.controls{justify-content:space-between}.grid,.field-row-3,.variant-grid{grid-template-columns:1fr}.sticky-submit{z-index:10;background:0 0;padding:0;position:fixed;bottom:12px;left:12px;right:12px}.panel-with-sticky{padding-bottom:88px}}