/* ThvnderLab v3 additions: accounts, wallet, admin. Uses the tokens defined in app.css. */
.wallet-card{display:flex;flex-direction:column;gap:4px;width:100%;text-align:left;background:linear-gradient(135deg,#2b224b,#1d2b42);border:1px solid #50416b;border-radius:14px;padding:14px 15px;margin-bottom:12px;color:var(--ink)}
.wallet-card .eyebrow{display:flex;align-items:center;gap:6px;color:#aeece6;font-size:9px}
.wallet-card strong{font-size:26px;letter-spacing:-.04em;line-height:1.1}
.wallet-card span:last-child{font-size:11px;color:#bdc0d4}
.wallet-card:hover{border-color:#7c66b0}
.credit-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid #514274;background:#342857;color:#e3d9ff;font-size:11px;font-weight:750;border-radius:99px;padding:7px 12px;white-space:nowrap}
.credit-pill b{font-size:13px}
.credit-pill .icon{width:14px;height:14px}
.status-pill.pill-off{border-color:#6c5036;background:#4a362b55;color:#ffd5a1}
.status-pill.pill-off .status-dot{background:#ffc87c;box-shadow:0 0 10px #ffc87c}
.side-account .icon-button{margin-left:auto}

/* landing + auth */
.landing{max-width:1240px;margin:0 auto;padding:22px clamp(16px,3vw,40px) 50px}
.landing-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
.landing-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.9fr);gap:20px;align-items:stretch}
.landing-grid.single{grid-template-columns:minmax(0,520px);justify-content:center;margin-top:8vh}
.landing-hero{min-height:420px}
.auth-card{padding:0;align-self:start}
.auth-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line-2)}
.auth-tabs button{background:transparent;border:0;color:var(--muted);padding:15px 8px;font-weight:720;font-size:12px;border-bottom:2px solid transparent}
.auth-tabs button.active{color:var(--ink);border-bottom-color:var(--violet)}
.auth-form{padding:20px 22px 22px;display:flex;flex-direction:column;gap:4px}
.auth-form .field{margin-bottom:12px}
.auth-form .btn{margin-top:6px}
.auth-or{display:flex;align-items:center;gap:10px;color:var(--faint);font-size:11px;margin:10px 0 2px}
.auth-or:before,.auth-or:after{content:"";flex:1;height:1px;background:var(--line)}
.auth-msg{margin-top:12px;padding:10px 12px;border-radius:10px;background:#31274262;border:1px solid #574371;color:#e3d6fb;font-size:12px;line-height:1.55}
.check-row{display:flex;gap:9px;align-items:flex-start;font-size:12px;color:var(--muted);margin:4px 0 12px;line-height:1.5}
.check-row input{margin-top:3px;accent-color:#8065d7}
.check-row a{color:var(--violet)}
.footer-note a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}

/* notices */
.notice{display:flex;align-items:center;gap:9px;padding:13px 15px;border-radius:12px;border:1px solid var(--line);background:var(--panel);font-size:13px;margin-bottom:16px}
.notice.ok{border-color:#255f61;background:#123c3f80;color:#c4f3ec}
.notice.bad{border-color:#7f464e;background:#59252f40;color:#ffd1d5}

/* editor */
.static-input{display:flex;align-items:center;color:var(--muted)}
.cost-box{display:flex;flex-direction:column;gap:1px}
.cost-box span{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:800}
.cost-box strong{font-size:20px;letter-spacing:-.03em}
.cost-box small{font-size:11px;color:var(--muted)}
.chosen-char{display:flex;gap:12px;align-items:center;margin-top:10px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}
.chosen-char img{width:64px;height:64px;object-fit:cover;border-radius:10px}
.gen-overlay{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:20px;background:#0a0b12a8;color:#f2efff}
.gen-overlay small{color:#c9c6dc;font-size:11px;max-width:320px;line-height:1.5}
.preview-art .gen-overlay{position:absolute}
.preview-art:not(.real-output):has(.gen-overlay):not(:has(img)){min-height:260px}
.failed-art{min-height:240px;background:#2a1820}
.spinner{width:30px;height:30px;border-radius:50%;border:3px solid #ffffff2a;border-top-color:var(--aqua);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.job-error{margin-top:8px;color:var(--danger);font-size:11px}
.ref-ph{width:68px;height:68px;border-radius:9px;background:var(--panel-3)}
.topup-pack .btn{margin-top:4px}
.pricing-table th,.pricing-table td{padding:10px 8px;border-bottom:1px solid var(--line-2);font-size:12px;vertical-align:top}
.pricing-table th{color:var(--faint);font-weight:760;font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.row-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}

/* admin */
.admin-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.admin-stat{padding:15px 16px;display:flex;flex-direction:column;gap:4px}
.admin-stat span{font-size:11px;color:var(--muted)}
.admin-stat strong{font-size:20px;letter-spacing:-.03em;overflow-wrap:anywhere}
.dialog{width:min(520px,100%)}

/* light theme */
.light .wallet-card{background:linear-gradient(135deg,#e8e2fa,#dff2f2);border-color:#d4c7ff}
.light .wallet-card span:last-child{color:#595971}
.light .wallet-card .eyebrow{color:#536e76}
.light .credit-pill{background:#f0eaff;color:#4b3a85;border-color:#d4c7ff}
.light .auth-msg{background:#f1ebff;color:#4f4270;border-color:#d4c7ff}
.light .notice.ok{background:#e2f7f4;color:#21615c}
.light .notice.bad{background:#ffecee;color:#8a2f3a}
.light .gen-overlay{background:#ffffffc4;color:#2a2440}
.light .gen-overlay small{color:#55536a}
.light .failed-art{background:#fbe9ec}

@media(max-width:940px){.landing-grid{grid-template-columns:1fr}.admin-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.landing-hero{min-height:340px}}
@media(max-width:640px){.admin-stats{grid-template-columns:1fr 1fr}.editor-footer{flex-direction:column;align-items:stretch}.editor-footer .btn{width:100%}.landing-hero .hero-visual{display:none}}
.check-row[hidden]{display:none}
.side-account{min-width:0}
.account-text{overflow:hidden}
.account-text b,.account-text span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.footer-note{flex-wrap:wrap;line-height:1.9}
@media(max-width:640px){.topbar .credit-pill{display:inline-flex}.topbar .status-pill{display:none}.topbar .top-divider{display:none}}
.legal{max-width:760px;margin:0 auto;padding:40px 20px 70px;line-height:1.7}
.legal h1{margin:6px 0 4px}
.legal h2{font-size:17px;margin:26px 0 8px}
.legal p,.legal li{color:var(--muted);font-size:14px}
.legal ul{padding-left:20px}
.legal a{color:var(--violet)}
.legal-back{display:inline-block;margin-bottom:24px;font-size:13px}
.legal-date{font-size:12px!important;color:var(--faint)!important}
.legal-draft{margin:16px 0;padding:10px 12px;border:1px dashed #6c5036;border-radius:10px;color:#ffd5a1;font-size:12px}
.legal-foot{margin-top:40px;font-size:12px!important}
.gen-overlay small{max-width:min(320px,100%);overflow-wrap:anywhere}
.gen-overlay b{overflow-wrap:anywhere}
.preview-frame,.preview-art{min-width:0;max-width:100%}