/* ===== Onboarding ===== */
.acl-onboard-overlay{position:fixed;inset:0;background:linear-gradient(135deg,#F0F5FF,#E5EDFF,#D4E4FF);z-index:999;display:flex;flex-direction:column}
.acl-welcome-bg{flex:1;display:flex;align-items:center;justify-content:center;background:transparent;position:relative;overflow:hidden}
.acl-welcome-bg::before{content:'';position:absolute;width:500px;height:500px;background:radial-gradient(circle,rgba(0,82,217,.22) 0%,transparent 70%);top:-80px;right:-80px;pointer-events:none;animation:floatUp 6s ease-in-out infinite alternate}
.acl-welcome-bg::after{content:'';position:absolute;width:400px;height:400px;background:radial-gradient(circle,rgba(0,82,217,.16) 0%,transparent 70%);bottom:-60px;left:-60px;pointer-events:none;animation:floatUp 8s ease-in-out infinite alternate-reverse}
.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)}
.acl-wc-header h1{font-family:'Google Sans',sans-serif;font-size:22px;font-weight:600}
.acl-wc-header p{font-size:13px;opacity:.8;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}
.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:'Google Sans',sans-serif;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}
.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{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)}
/* ===== Onboarding Caustics 光影斑驳 ===== */
.ob-caustics{z-index:0}
.ob-c{mix-blend-mode:var(--caustic-blend,multiply)}
.ob-c1{width:500px;height:380px;top:-5%;left:-8%;--caustic-color:rgba(0,82,217,.22);animation:causticDrift1 22s ease-in-out infinite,causticBreath 4s ease-in-out infinite}
.ob-c2{width:420px;height:340px;top:55%;right:-6%;--caustic-color:rgba(61,128,255,.2);animation:causticDrift2 28s ease-in-out infinite,causticBreath 4s ease-in-out infinite 1s}
.ob-c3{width:350px;height:260px;top:20%;left:25%;--caustic-color:rgba(110,161,255,.18);animation:causticDrift3 20s ease-in-out infinite,causticBreath 4s ease-in-out infinite 2s}
.ob-c4{width:600px;height:450px;bottom:-8%;right:20%;--caustic-color:rgba(0,82,217,.14);animation:causticDrift4 30s ease-in-out infinite,causticBreath 4s ease-in-out infinite 0.5s}
.ob-c5{width:280px;height:220px;top:8%;right:25%;--caustic-color:rgba(163,196,255,.24);animation:causticDrift5 24s ease-in-out infinite,causticBreath 4s ease-in-out infinite 1.5s}
.ob-c6{width:460px;height:360px;bottom:10%;left:-5%;--caustic-color:rgba(61,128,255,.16);animation:causticDrift6 32s ease-in-out infinite,causticBreath 4s ease-in-out infinite 3s}
.ob-c7{width:320px;height:250px;top:40%;left:60%;--caustic-color:rgba(0,82,217,.18);animation:causticDrift1 26s ease-in-out infinite 3s,causticBreath 4s ease-in-out infinite 0.8s}
.ob-c8{width:380px;height:300px;top:70%;left:10%;--caustic-color:rgba(163,196,255,.16);animation:causticDrift5 35s ease-in-out infinite 2s,causticBreath 4s ease-in-out infinite 2.2s}