/* ===== Onboarding ===== */
/* 背景与登录页统一：纯色底 + FaultyTerminal WebGL 点阵（#onboard-bg） */
.acl-onboard-overlay{position:fixed;inset:0;background:#f5f5f5;z-index:999;display:flex;flex-direction:column;overflow:hidden}
.acl-welcome-bg{flex:1;display:flex;align-items:center;justify-content:center;background:transparent;position:relative;z-index:2;overflow:hidden}
.acl-welcome-card{width:520px;background:var(--md-surface);border-radius:var(--radius-md);box-shadow:0 24px 48px rgba(0,82,217,.12),0 8px 16px rgba(0,0,0,.05);overflow:hidden;transform:scale(.9) translateY(30px);opacity:0;filter:blur(8px);transition:none}
.acl-welcome-card.show{animation:obCardEmerge .55s var(--ease-spring) forwards}
.acl-welcome-card.exit{animation:welcomeExit .45s var(--ease-spring) both}
.acl-wc-header{text-align:center;padding:32px 32px 20px;background:var(--brand-gradient);background-size:200% 200%;animation:gradientShift 4s ease infinite;color:#fff;position:relative;overflow:hidden}
.acl-wc-header::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.1) 50%,transparent 60%);background-size:200% 100%;animation:shimmer 4s ease infinite}
.acl-wc-logo{width:56px;height:56px;background:rgba(255,255,255,.25);border-radius:16px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;backdrop-filter:blur(4px)}
.acl-wc-logo .adclaw-icon{width:48px;height:48px;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(0,0,0,.15));transition:transform .3s var(--ease-spring)}
.acl-wc-logo:hover .adclaw-icon{transform:scale(1.1) rotate(-3deg)}
/* Wordmark variant: 使用 AdBuddy 艺术字 logo 替代小企鹅图标，去掉方框玻璃底，横版展示
   Header 底色永远是蓝色渐变（--brand-gradient），亮/暗模式统一使用白色 logo */
.acl-wc-logo.acl-wc-logo-wordmark{width:auto;height:auto;background:none;border-radius:0;backdrop-filter:none;margin:0 auto 14px;padding:0;display:flex;justify-content:center;max-width:100%}
.acl-wc-logo.acl-wc-logo-wordmark .adclaw-wordmark{display:block;height:36px;width:auto;max-width:70%;object-fit:contain;filter:drop-shadow(0 2px 10px rgba(0,0,0,.22));transition:transform .3s var(--ease-spring)}
.acl-wc-logo.acl-wc-logo-wordmark:hover .adclaw-wordmark{transform:scale(1.04)}
/* 问候语：替代原 h1"欢迎使用 AdBuddy"，消除品牌词重复 */
.acl-wc-header .acl-wc-greet{font-family:var(--font-family-display);font-size:20px;font-weight:600;color:#fff;letter-spacing:.3px;line-height:1.3}
.acl-wc-header .acl-wc-wave{display:inline-block;animation:aclWcWave 1.8s ease-in-out infinite;transform-origin:70% 70%}
@keyframes aclWcWave{0%,60%,100%{transform:rotate(0)}10%,30%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}}
.acl-wc-header h1{font-family:var(--font-family-display);font-size:22px;font-weight:600}
.acl-wc-header p{font-size:13px;opacity:.85;margin-top:6px}
.acl-wc-body{padding:24px 32px;display:flex;flex-direction:column;gap:16px}
.acl-wc-feature{display:flex;gap:14px;align-items:center;opacity:0;transform:translateX(-16px);transition:opacity .4s var(--ease-spring),transform .4s var(--ease-spring)}
.acl-wc-feature.show{opacity:1;transform:translateX(0)}
.acl-fi{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.acl-fi .material-symbols-outlined{font-size:22px}
.acl-ft h4{font-size:14px;font-weight:600}.acl-ft p{font-size:12px;color:var(--md-on-surface-variant);margin-top:2px}
.acl-wc-footer{padding:16px 32px 28px;text-align:center}
.acl-btn-primary{padding:12px 32px;border:none;border-radius:var(--radius-lg);background:var(--brand-gradient);background-size:200% 200%;animation:gradientShift 4s ease infinite;color:#fff;font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:box-shadow .25s var(--ease-spring),transform .25s var(--ease-spring);box-shadow:0 4px 16px rgba(0,82,217,.25);position:relative;overflow:hidden}
.acl-btn-primary::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.2) 50%,transparent 60%);background-size:200% 100%;opacity:0;transition:opacity .3s}
.acl-btn-primary:hover{box-shadow:0 8px 24px rgba(0,82,217,.35);transform:translateY(-2px)}
.acl-btn-primary:hover::after{opacity:1;animation:shimmer 2s ease infinite}
.acl-btn-primary .material-symbols-outlined{font-size:18px}
.acl-wizard-bg{display:flex;align-items:center;justify-content:center;background:transparent;position:relative;z-index:2}
.acl-wizard-card{width:600px;max-height:calc(100vh - 120px);display:flex;flex-direction:column;background:var(--md-surface);border-radius:var(--radius-md);box-shadow:0 24px 48px rgba(0,82,217,.1),0 8px 16px rgba(0,0,0,.05);overflow:hidden;opacity:0;transform:translateY(20px) scale(.97);transition:opacity .5s var(--ease-spring),transform .5s var(--ease-spring),box-shadow .5s var(--ease-spring)}
.acl-wizard-card.height-transition{transition:height .4s cubic-bezier(.4,0,.2,1)!important;overflow:hidden}
.acl-wizard-card.show{opacity:1;transform:translateY(0) scale(1)}
.acl-wiz-progress{display:flex;align-items:center;justify-content:center;gap:0;padding:24px 40px 16px}
.acl-ws{display:flex;flex-direction:column;align-items:center;gap:4px}
.acl-ws-dot{width:28px;height:28px;border-radius:50%;background:var(--md-surface-3);color:var(--md-outline);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;transition:background .35s var(--ease-spring),color .35s var(--ease-spring),transform .35s var(--ease-spring),box-shadow .35s var(--ease-spring)}
.acl-ws.active .acl-ws-dot{background:var(--md-primary);color:#fff;transform:scale(1.1);box-shadow:0 2px 8px rgba(0,82,217,.3)}
.acl-ws.done .acl-ws-dot{background:var(--md-success);color:#fff;transform:scale(1.05)}
.acl-ws-label{font-size:10px;color:var(--md-outline);font-weight:500}
.acl-ws.active .acl-ws-label{color:var(--md-primary);font-weight:600}
.acl-ws.done .acl-ws-label{color:var(--md-success)}
.acl-wc-conn{width:48px;height:2px;background:var(--md-surface-3);margin:0 4px;margin-bottom:18px;transition:background .4s var(--ease-spring);position:relative;overflow:hidden}
.acl-wc-conn.done{background:var(--md-success)}
.acl-wc-conn.done::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(30,142,62,.4),transparent);animation:shimmer 2s ease 1}
.acl-wiz-content{padding:8px 40px 24px;transition:none;position:relative;overflow-y:auto;flex:1;min-height:0}
.acl-wiz-content.abs-exit{position:absolute;top:0;left:0;right:0;pointer-events:none}
.acl-wiz-content.abs-exit-rev{position:absolute;top:0;left:0;right:0;pointer-events:none}
.acl-wiz-content.step-enter{animation:wizStepEnter .4s var(--ease-spring) both}
.acl-wiz-content.step-exit{animation:wizStepExit .25s ease both}
.acl-wiz-content.step-enter-rev{animation:wizStepEnterRev .4s var(--ease-spring) both}
.acl-wiz-content.step-exit-rev{animation:wizStepExitRev .25s ease both}
.acl-wiz-content h3{font-family:var(--font-family-display);font-size:18px;font-weight:600;margin-bottom:4px}
.acl-wiz-desc{font-size:13px;color:var(--md-on-surface-variant);margin-bottom:20px}
.acl-wiz-form{display:flex;flex-direction:column;gap:16px}
.acl-wiz-row{display:flex;gap:16px}.acl-wiz-row .acl-wiz-field{flex:1}
.acl-wiz-field label{font-size:12px;font-weight:600;color:var(--md-on-surface-variant);margin-bottom:6px;display:block}
.acl-wiz-input{width:100%;height:40px;border:1.5px solid var(--md-surface-4);border-radius:var(--radius-xs);padding:0 12px;font-family:inherit;font-size:13px;color:var(--md-on-surface);background:var(--md-surface);outline:none;transition:border-color .2s}
.acl-wiz-input:focus{border-color:var(--md-primary);box-shadow:0 0 12px rgba(0,82,217,.15),0 0 4px rgba(0,82,217,.1);outline:none !important}
.acl-chip-group{display:flex;flex-wrap:wrap;gap:8px}
.acl-chip{display:inline-flex;align-items:center;gap:5px;padding:8px 14px;border-radius:20px;border:1.5px solid var(--md-surface-4);font-size:12px;font-weight:500;cursor:pointer;transition:all .2s;color:var(--md-on-surface-variant)}
.acl-chip:hover{border-color:var(--md-primary);color:var(--md-primary)}
.acl-chip.selected{border-color:var(--md-primary);background:var(--md-primary-container);color:var(--md-on-primary-container);font-weight:600}
.acl-chip .material-symbols-outlined{font-size:16px}
/* Persona card grid */
.acl-persona-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.acl-persona-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 12px;border-radius:var(--radius-sm);border:2px solid var(--md-surface-4);cursor:pointer;transition:all .25s;text-align:center}
.acl-persona-card:hover{border-color:var(--md-primary);background:rgba(0,82,217,.03)}
.acl-persona-card.selected{border-color:var(--md-primary);background:var(--md-primary-container);box-shadow:0 0 0 1px var(--md-primary)}
.acl-persona-card.selected .acl-persona-icon{color:var(--md-primary)}
.acl-persona-icon{font-size:28px;color:var(--md-on-surface-variant);transition:color .25s}
.acl-persona-card strong{font-size:13px;font-weight:600;color:var(--md-on-surface)}
.acl-persona-desc{font-size:11px;color:var(--md-outline);line-height:1.4}
.ch-chip{padding:10px 16px;border-radius:var(--radius-sm);border:2px solid var(--md-surface-4);cursor:pointer;transition:all .2s;display:flex;flex-direction:column;gap:6px;flex:1}
.ch-chip:hover{border-color:var(--md-primary)}.ch-chip.selected{border-color:var(--md-primary);background:rgba(0,82,217,.04)}
.ch-chip-head{display:flex;align-items:center;gap:8px}
.ch-chip-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff}
.ch-chip-name{font-size:13px;font-weight:600;color:var(--md-on-surface)}
.ch-chip-desc{font-size:11px;color:var(--md-outline)}
.ch-chip-accounts{font-size:11px;color:var(--md-on-surface-variant);margin-top:4px;padding-top:6px;border-top:1px solid var(--md-surface-3)}
.acl-toggle-row{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:var(--radius-sm);border:1px solid var(--md-surface-3)}
.acl-toggle-info{flex:1}.acl-toggle-info h5{font-size:13px;font-weight:600;margin-bottom:2px}.acl-toggle-info p{font-size:11px;color:var(--md-on-surface-variant)}
.acl-toggle{width:44px;height:24px;border-radius:12px;border:none;background:var(--md-surface-4);cursor:pointer;position:relative;transition:background .2s;flex-shrink:0}
.acl-toggle::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:var(--shadow-1);transition:transform .2s}
.acl-toggle.on{background:var(--md-primary)}.acl-toggle.on::after{transform:translateX(20px)}
.acl-wiz-footer{padding:16px 40px 24px;display:flex;justify-content:space-between;border-top:1px solid var(--md-surface-3);flex-shrink:0}
.acl-wiz-back{padding:8px 20px;border:1px solid var(--md-surface-4);border-radius:var(--radius-lg);background:none;font-family:inherit;font-size:13px;font-weight:500;color:var(--md-on-surface-variant);cursor:pointer;display:flex;align-items:center;gap:4px;transition:border-color .25s var(--ease-spring),color .25s var(--ease-spring),transform .25s var(--ease-spring)}
.acl-wiz-back:hover{border-color:var(--md-primary);color:var(--md-primary);transform:translateX(-3px)}
.acl-wiz-next{padding:10px 24px;border:none;border-radius:var(--radius-lg);background:var(--md-primary);color:#fff;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;transition:box-shadow .25s var(--ease-spring),transform .25s var(--ease-spring);box-shadow:var(--shadow-1);position:relative;overflow:hidden}
.acl-wiz-next::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.2) 50%,transparent 60%);background-size:200% 100%;opacity:0;transition:opacity .3s}
.acl-wiz-next:hover{box-shadow:0 4px 16px rgba(0,82,217,.35);transform:translateX(3px)}
.acl-wiz-next:hover::after{opacity:1;animation:shimmer 1.5s ease infinite}
.acl-ob-phasebar{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:0;padding:16px;background:rgba(255,255,255,.5);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid rgba(0,82,217,.08)}
.acl-ob-step{display:flex;flex-direction:column;align-items:center;gap:4px}
.acl-ob-dot{width:32px;height:32px;border-radius:50%;background:var(--md-surface-3);display:flex;align-items:center;justify-content:center;transition:all .3s}
.acl-ob-dot .material-symbols-outlined{font-size:16px;color:var(--md-outline)}
.acl-ob-step.active .acl-ob-dot{background:var(--md-primary-container)}.acl-ob-step.active .acl-ob-dot .material-symbols-outlined{color:var(--md-primary)}
.acl-ob-step.done .acl-ob-dot{background:var(--md-success-container)}.acl-ob-step.done .acl-ob-dot .material-symbols-outlined{color:var(--md-success)}
.acl-ob-label{font-size:10px;color:var(--md-outline);font-weight:500}
.acl-ob-step.active .acl-ob-label{color:var(--md-primary);font-weight:600}
.acl-ob-step.done .acl-ob-label{color:var(--md-success)}
.acl-ob-conn{width:40px;height:2px;background:var(--md-surface-4);margin:0 6px;margin-bottom:18px;transition:background .3s}
.acl-ob-conn.done{background:var(--md-success)}