/* take-x-nav.css — TAKE X 全站统一顶部栏（v2 · 2026-09-15）
   目标（俊导 18:12）：不论在哪个页面，顶部栏都完全一样（logo / 菜单 / 导演画布 / 历史 / 主题 / 用户区），
   顶部固定不变，变的只有下方的页面内容。
   数值逐项复刻首页原生栏（Playwright 实测 computed style），本文件自包含，不依赖其它 CSS。 */
header.take-site-nav{
  position:sticky;top:0;z-index:100;width:100%;
  background:rgba(255,255,255,.88);
  -webkit-backdrop-filter:blur(14.1px);backdrop-filter:blur(14.1px);
  border-bottom:.9px solid rgba(26,26,46,.10);
  font-family:"PingFang SC","Helvetica Neue","Noto Sans SC",-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:16px;color:#080b1f;box-sizing:border-box;
}
header.take-site-nav *{box-sizing:border-box}
/* 锁死行高/字体继承：避免宿主页面的 body{line-height:1.6} 把本栏撑高，导致各页高度不一致 */
header.take-site-nav,
header.take-site-nav a,
header.take-site-nav button,
header.take-site-nav span{line-height:normal;font-family:"PingFang SC","Helvetica Neue","Noto Sans SC",-apple-system,BlinkMacSystemFont,sans-serif}
header.take-site-nav a{text-decoration:none}
header.take-site-nav .tsn-ic{width:13.2px;height:13.2px;flex:none;display:inline-block;vertical-align:-.18em}
header.take-site-nav .tsn-inner{
  max-width:1355.2px;width:90%;margin:0 auto;padding:10.6px 0;
  display:flex;align-items:center;justify-content:space-between;gap:59.8px;
}
/* 左：logo */
header.take-site-nav .tsn-brand{display:flex;align-items:center;flex:none}
header.take-site-nav .tsn-brand img{display:block;height:30px;width:auto;max-width:none;object-fit:contain}
/* 中：主导航 */
header.take-site-nav .tsn-menu{display:flex;align-items:center;gap:35.2px}
header.take-site-nav .tsn-menu a{font-size:12.3px;color:#080b1f;white-space:nowrap;position:relative}
header.take-site-nav .tsn-menu a:hover{color:#4f46e5}
/* 右：工具区（导演画布 / 主题 / 历史 / 用户） */
/* ===== 俊导 2026-09-15《第二轮 UI 修正·可视化上线方案 V2》组件 A：顶部右侧工具条按图4定尺寸 =====
   token：统一高 40px / 圆角 14px / 段间距 12px；宽度 主题40·历史96·会员116·积分118·头像40；
   会员与积分 = 浅金边 + 极淡暖白底；头像 40×40 双层紫环。禁止再按比例缩回旧尺寸。 */
header.take-site-nav .tsn-right{display:flex;align-items:center;gap:12px;margin-left:auto;white-space:nowrap}
header.take-site-nav .tsn-link{display:flex;align-items:center;gap:5.3px;font-size:12.3px;font-weight:600;color:#353c59}
header.take-site-nav .tsn-link:hover{color:#4f46e5}
header.take-site-nav .tsn-link .tsn-ic{color:#4f46e5}
header.take-site-nav .tsn-theme{
  width:34px;min-width:34px;height:34px;padding:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  background:var(--tx-card,#fff);border:1px solid var(--tx-line,#e2e6fb);border-radius:14px;
  box-shadow:0 2px 9px rgba(66,70,140,.025);
}
header.take-site-nav .tsn-ghost{
  height:34px;padding:0 14px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:7px;
  font-size:12.3px;font-weight:600;line-height:1;color:#202b4d;
  background:var(--tx-card,#fff);border:1px solid var(--tx-line,#e2e6fb);border-radius:11px;
  box-shadow:0 2px 9px rgba(66,70,140,.025);
}
header.take-site-nav .tsn-theme:hover,
header.take-site-nav .tsn-ghost:hover{border-color:#c9cfe8;color:#4f46e5}
header.take-site-nav .tsn-theme[aria-disabled='true']{opacity:.42;cursor:default}
/* 主题图标（俊导 2026-09-15 设计稿）：浅色=立体太阳、深色=月牙+紫星；两枚 SVG 内联、由 JS 切显隐） */
header.take-site-nav .tsn-theme .tsn-sun,
header.take-site-nav .tsn-theme .tsn-moon{display:block;line-height:0;font-size:0}
header.take-site-nav .tsn-theme .tsn-moon{display:none}
header.take-site-nav .tsn-theme svg{width:20px;height:20px;display:block;overflow:visible}
/* 用户区：会员 116 / 积分 118 / 头像 40 */
header.take-site-nav .tsn-user{display:flex;align-items:center;gap:10px;font-size:12.3px;font-weight:600}
header.take-site-nav .tsn-member{
  height:34px;padding:0 14px;gap:7px;cursor:pointer;font-size:12.3px;font-weight:600;line-height:1;
  color:#9b6414;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#fffefd 0%,#fffaf0 100%);
  border:1px solid #f0cf8d;border-radius:11px;
}
/* 未开通会员：紫调「开通会员」（俊导 2026-09-16：徽章要跟实际等级实时联动） */
header.take-site-nav .tsn-member.is-free{color:#5b4bd6;background:linear-gradient(180deg,#fbfaff 0%,#f3f1ff 100%);border-color:#cdc4f5}
header.take-site-nav .tsn-member.is-free .tsn-ic{color:#7754f6}
header.take-site-nav .tsn-member .tsn-ic{width:13.2px;height:13.2px;color:#e29a19}
header.take-site-nav .tsn-quota{
  height:34px;padding:0 14px;gap:7px;cursor:pointer;font-size:12.3px;font-weight:600;line-height:1;
  color:#ca6b00;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#fffefd 0%,#fffaf0 100%);
  border:1px solid #f0cf8d;border-radius:11px;
}
header.take-site-nav .tsn-quota .tsn-ic{width:13.2px;height:13.2px;color:#7754f6}
header.take-site-nav .tsn-profile{
  width:34px;height:34px;padding:2px;cursor:pointer;border-radius:50%;
  background:#fff;border:2.5px solid #7c5cff;
  box-shadow:0 0 0 2px rgba(104,72,255,.14),0 0 18px rgba(104,72,255,.25);
}
header.take-site-nav .tsn-avatar{
  width:100%;height:100%;display:grid;place-items:center;border-radius:50%;
  color:#fff;font-size:11px;font-weight:700;
  background:linear-gradient(145deg,#20264d,#896bff);overflow:hidden;
}
header.take-site-nav .tsn-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
/* 2026-09-20 俊导反馈「紫环里面还有一圈」：有头像图时把容器底色改成与背景一致，
   否则 .tsn-avatar 的深色渐变会在 img 圆形边缘的抗锯齿像素处透出一圈发丝级暗线。 */
header.take-site-nav .tsn-avatar.has-img,
header.take-site-nav .tsn-avatar:has(img){background:#fff}
[data-theme='dark'] header.take-site-nav .tsn-avatar.has-img,
[data-theme='dark'] header.take-site-nav .tsn-avatar:has(img){background:#171722}
header.take-site-nav .tsn-login{
  height:42.2px;padding:0 17.6px;display:flex;align-items:center;cursor:pointer;
  font-size:11.4px;color:#fff;border:0;border-radius:13.2px;
  background:linear-gradient(120deg,#a481ff,#7344ed);letter-spacing:.2px;
}
header.take-site-nav .tsn-login:hover{filter:brightness(1.06)}
/* 用户信息小卡（非首页页面点击头像时用） */
header.take-site-nav .tsn-pop{
  position:absolute;top:calc(100% + 11px);right:0;min-width:200px;padding:12px 14px;z-index:120;
  background:#fff;border:1px solid #e6e6ef;border-radius:14px;font-size:11.4px;color:#353c59;line-height:2;
  box-shadow:0 10px 30px rgba(26,26,46,.12);text-align:left;
}
header.take-site-nav .tsn-pop b{display:block;font-size:12.3px;color:#080b1f;margin-bottom:2px}
header.take-site-nav .tsn-pop i{font-style:normal;color:#8b6217}
/* —— 悬停浮层（俊导 2026-09-16）：积分卡 / 账号卡。
   要点：① 10px 透明桥接 + visibility 延迟 0.3s，鼠标从按钮移向浮层不会断（否则点不到菜单）；
        ② 仅 hover / 键盘聚焦时显示 */
header.take-site-nav .tsn-slot{position:relative;display:flex;align-items:center}
header.take-site-nav .tsn-slot .tsn-pop{
  opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:opacity .13s ease,transform .13s ease,visibility 0s linear .32s;
}
header.take-site-nav .tsn-slot .tsn-pop:before{content:'';position:absolute;left:0;right:0;top:-11px;height:11px}
header.take-site-nav .tsn-slot:hover .tsn-pop,
header.take-site-nav .tsn-slot:focus-within .tsn-pop{
  opacity:1;visibility:visible;transform:none;
  transition:opacity .13s ease,transform .13s ease,visibility 0s;
}
header.take-site-nav .tsn-pop-quota{min-width:252px}
header.take-site-nav .pop-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding-bottom:8px;border-bottom:1px solid #eef0f8;margin-bottom:7px;line-height:1.2;
}
header.take-site-nav .pop-lb{font-size:11.4px;color:#8b90a8}
header.take-site-nav .pop-num{font-size:19px;font-weight:800;color:#080b1f;letter-spacing:-.3px}
header.take-site-nav .pop-num i{font-style:normal;font-size:11px;font-weight:600;color:#8b90a8;margin-left:2px}
header.take-site-nav .pop-plan{
  display:flex;align-items:center;gap:6px;padding:6px 9px;border-radius:9px;margin-bottom:6px;line-height:1.4;
  background:#fbf9f3;border:1px solid #f0e3c2;
}
header.take-site-nav .pop-plan .tsn-ic{width:14px;height:14px;color:#e29a19}
header.take-site-nav .pop-plan span{font-size:11.4px;font-weight:700;color:#9b6414}
header.take-site-nav .pop-plan em{font-style:normal;font-size:10.5px;color:#a8926a;margin-left:auto;white-space:nowrap}
#tsnToast{
  position:fixed;left:50%;top:76px;transform:translate(-50%,-8px);opacity:0;z-index:999;
  padding:9px 16px;border-radius:12px;background:rgba(26,26,46,.92);color:#fff;
  font-size:12.3px;line-height:1.4;pointer-events:none;transition:opacity .18s ease,transform .18s ease;
}
#tsnToast.on{opacity:1;transform:translate(-50%,0)}
[data-theme='dark'] header.take-site-nav .pop-head{border-bottom-color:#2c2c3a}
[data-theme='dark'] header.take-site-nav .pop-num{color:#f2f1ff}
[data-theme='dark'] header.take-site-nav .pop-plan{background:#221f2e;border-color:#3a3348}
[data-theme='dark'] header.take-site-nav .pop-plan em{color:#9c8fb0}
header.take-site-nav .tsn-pop .tsn-pop-item{
  display:block;width:100%;text-align:left;border:0;background:transparent;cursor:pointer;
  font-size:11.4px;font-family:inherit;color:#353c59;padding:6px 8px;border-radius:8px;line-height:1.5;
}
header.take-site-nav .tsn-pop .tsn-pop-item:hover{color:#4f46e5;background:rgba(79,70,229,.06)}
header.take-site-nav .tsn-pop .tsn-pop-out{margin-top:5px;border-top:.9px solid #eceef8;border-radius:0;color:#d45268}
header.take-site-nav .tsn-pop .tsn-pop-out:hover{color:#ef4444;background:rgba(239,68,68,.07)}
[data-theme='dark'] header.take-site-nav .tsn-pop .tsn-pop-item{color:#c8cbe0}
[data-theme='dark'] header.take-site-nav .tsn-pop .tsn-pop-out{border-top-color:#2c2c3a}
[data-theme='dark'] header.take-site-nav .tsn-pop .tsn-pop-item:hover{background:rgba(155,130,255,.12);color:#c3b2ff}
header.take-site-nav .tsn-user{position:relative}
[hidden]{display:none!important}
/* —— 深色 —— */
[data-theme='dark'] header.take-site-nav{background:rgba(20,21,28,.88);border-bottom-color:rgba(255,255,255,.10)}
[data-theme='dark'] header.take-site-nav .tsn-brand img{content:url('take-x-logo-approved-dark.png')}
[data-theme='dark'] header.take-site-nav,
[data-theme='dark'] header.take-site-nav .tsn-menu a{color:#e0def6}
[data-theme='dark'] header.take-site-nav .tsn-menu a:hover,
[data-theme='dark'] header.take-site-nav .tsn-link:hover{color:#a99eff}
[data-theme='dark'] header.take-site-nav .tsn-link{color:#e0def6}
[data-theme='dark'] header.take-site-nav .tsn-theme,
[data-theme='dark'] header.take-site-nav .tsn-ghost{
  background:linear-gradient(135deg,#252943,#1b2038);border-color:#373d5d;color:#e0def6;box-shadow:inset 0 .9px 0 #ffffff0c;
}
[data-theme='dark'] header.take-site-nav .tsn-member{
  color:#f1bf58;background:linear-gradient(rgba(31,31,45,.96),rgba(22,22,34,.96));
  border-color:rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 5px 18px rgba(0,0,0,.24);
}
[data-theme='dark'] header.take-site-nav .tsn-quota{
  color:#f3f0ff;background:linear-gradient(rgba(31,31,45,.96),rgba(22,22,34,.96));
  border-color:rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 5px 18px rgba(0,0,0,.24);
}
[data-theme='dark'] header.take-site-nav .tsn-quota .tsn-ic{color:#9b82ff}
[data-theme='dark'] header.take-site-nav .tsn-member .tsn-ic{color:#f3ad2f}
[data-theme='dark'] header.take-site-nav .tsn-profile{background:#171722;border-color:#9178ff;box-shadow:0 0 0 1px rgba(255,255,255,.04),0 0 16px rgba(124,92,255,.2)}
[data-theme='dark'] header.take-site-nav .tsn-pop{background:#1b1b24;border-color:#2c2c3a;color:#c8cbe0}
[data-theme='dark'] header.take-site-nav .tsn-pop b{color:#f2f1ff}
/* —— 旧的自带顶部栏：隐藏，保证全站只有一条完全一致的栏 —— */
[data-take-nav-hidden]{display:none!important}
/* ——【静态兜底】上面那条规则要等 JS 给旧栏打标记才生效；本脚本在 <body> 开头执行时旧栏还没被解析到，
     于是会出现「我的栏 + 页面自带栏」两条叠着闪一下（实测 8/11 页可见）。这里直接用 CSS 静态隐藏，
     与 JS 执行时机无关；导演画布的工具条用 [data-take-nav-keep] 静态豁免。 —— */
header.nav:not([data-take-nav-keep]),
header.topbar:not([data-take-nav-keep]),
.case-nav:not([data-take-nav-keep]),
.case-nav-top:not([data-take-nav-keep]),
.take-page-head:not([data-take-nav-keep]){display:none!important}
/* —— 导演画布：保留自带工具条（含项目名/保存状态），只藏掉重复的 logo，并补高度 —— */
[data-take-nav-keep]{position:relative;z-index:99}
[data-take-nav-keep] .logo,[data-take-nav-keep] .take-page-brand{display:none!important}
body.take-nav-canvas .app{height:calc(100vh - 128.4px)!important}
/* —— 窄屏（对齐首页原生响应式） —— */
@media(max-width:1000px){
  header.take-site-nav .tsn-inner{width:94%;gap:24.6px}
  header.take-site-nav .tsn-menu{gap:17.6px}
  header.take-site-nav .tsn-right{gap:10px}
}
@media(max-width:800px){
  header.take-site-nav .tsn-inner{flex-wrap:wrap;gap:13.2px;padding:11.4px 0}
  header.take-site-nav .tsn-brand img{height:25.4px}
  header.take-site-nav .tsn-menu{order:3;width:100%;justify-content:center;gap:19.4px}
  header.take-site-nav .tsn-menu a{font-size:10.6px}
  header.take-site-nav .tsn-link{font-size:9.7px}
  header.take-site-nav .tsn-ghost{padding:0 7.9px}
  header.take-site-nav .tsn-theme{width:29.9px;min-width:29.9px}
}
@media(max-width:430px){
  header.take-site-nav .tsn-link{display:none}
  header.take-site-nav .tsn-inner{gap:8.8px}
  header.take-site-nav .tsn-ghost{display:none}
}

/* ===== 俊导 2026-09-16：快捷输入框展开后保持展开，输入完点别处不再缩回 ===== */
.canvas-quick-input.is-open,.home-app .canvas-quick-input.is-open{padding:17.6px 21.1px 14.1px;border-color:#bcb1d8;box-shadow:0 7px 24.6px #372b6914}
.canvas-quick-input.is-open textarea,.home-app .canvas-quick-input.is-open textarea{height:73.9px;min-height:73.9px}
.canvas-quick-input.is-open .canvas-quick-footer,.home-app .canvas-quick-input.is-open .canvas-quick-footer{display:flex;position:static;transform:none;padding-top:10.6px;animation:none}
.canvas-quick-input.is-open .canvas-quick-footer span,.canvas-quick-input.is-open .canvas-quick-upload{display:flex}
.home-app .canvas-quick-input.is-open .canvas-quick-footer .pro-cost{margin-left:auto}
.canvas-quick-input.is-open:before{content:"";position:absolute;left:17.6px;right:17.6px;bottom:-0.9px;height:0.9px;background:linear-gradient(90deg,transparent,#8064ee,transparent)}

/* ===== 购买记录弹窗（2026-09-21 俊导：点「购买记录」要出真实账单）
   ⚠️ 弹窗挂在 <body> 下（不在 header 内），所以这些规则**不能加 `header.take-site-nav` 前缀**，
   否则样式不生效（踩过：加了前缀 → 弹窗无样式，看起来「点了没反应」）。
   深色主题用 [data-theme='dark'] 单独覆盖。 ===== */
.tsn-mask{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(8,11,31,.44);font-family:"PingFang SC","Helvetica Neue","Noto Sans SC",-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:16px;color:#080b1f;-webkit-font-smoothing:antialiased}
.tsn-mask *{box-sizing:border-box}
.tsn-modal{width:min(540px,100%);max-height:min(72vh,600px);display:flex;flex-direction:column;
  background:#fff;border:1px solid #e2e6fb;border-radius:18px;box-shadow:0 24px 64px rgba(8,11,31,.22);overflow:hidden;animation:tsnIn .16s ease-out}
@keyframes tsnIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.tsn-modal-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;border-bottom:1px solid #e2e6fb}
.tsn-modal-hd b{font-size:15px;font-weight:600;color:#080b1f}
.tsn-modal-x{width:28px;height:28px;border:1px solid #e2e6fb;border-radius:9px;background:transparent;color:#5b6486;
  font:inherit;font-size:17px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.tsn-modal-x:hover{border-color:#c9cfe8;color:#4f46e5}
.tsn-modal-bd{overflow:auto;padding:6px 18px 16px}
.tsn-rec-empty{padding:28px 0;text-align:center;font-size:13px;color:#8b93ad}
.tsn-rec{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px dashed #e2e6fb}
.tsn-rec:last-child{border-bottom:0}
.tsn-rec-main{min-width:0}
.tsn-rec-main b{display:block;font-size:13.5px;font-weight:600;color:#080b1f;margin-bottom:3px}
.tsn-rec-main em{display:block;font-style:normal;font-size:11.5px;color:#8b93ad;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tsn-rec-right{display:flex;align-items:center;gap:9px;flex:none}
.tsn-rec-amt{font-size:14px;font-weight:600;color:#080b1f}
.tsn-rec-tag{font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid #f0d5a6;background:#fdf6e8;color:#8b6217}
.tsn-rec-tag.on{border-color:#c8e6cd;background:#eefaf0;color:#1f7a3d}
[data-theme='dark'] .tsn-modal{background:#141830;border-color:#262b4a}
[data-theme='dark'] .tsn-modal-hd{border-bottom-color:#262b4a}
[data-theme='dark'] .tsn-modal-hd b,
[data-theme='dark'] .tsn-rec-main b,
[data-theme='dark'] .tsn-rec-amt{color:#e9e7fb}
[data-theme='dark'] .tsn-rec{border-bottom-color:#262b4a}
[data-theme='dark'] .tsn-rec-main em{color:#8d93b5}
[data-theme='dark'] .tsn-modal-x{color:#a9b0cf;border-color:#2c3358}
[data-theme='dark'] .tsn-mask{background:rgba(4,6,18,.6)}
[data-theme='dark'] .tsn-rec-tag{background:#2a2418;border-color:#4a3c22;color:#e0b877}
[data-theme='dark'] .tsn-rec-tag.on{background:#152a1d;border-color:#27543a;color:#7fd39b}
/* ===== 购买记录：待支付行可点「继续支付」（2026-09-21 俊导要求有点击感） ===== */
.tsn-rec.is-pending{cursor:pointer;border-radius:12px;transition:background .15s ease,transform .15s ease}
.tsn-rec.is-pending:hover{background:rgba(79,70,229,.06)}
.tsn-rec.is-pending:focus-visible{outline:2px solid rgba(79,70,229,.4);outline-offset:2px}
.tsn-rec.is-pending:active{transform:scale(.995)}
.tsn-rec-hint{margin:8px 0 2px;padding:9px 12px;border-radius:10px;font-size:11.5px;color:#6b5cd6;
  background:rgba(79,70,229,.06);border:1px solid rgba(79,70,229,.16)}
.tsn-rec-pay{display:inline-flex;align-items:center;gap:5px;font:inherit;font-size:11.5px;font-weight:600;
  color:#4f46e5;background:rgba(79,70,229,.08);border:1px solid rgba(79,70,229,.3);border-radius:999px;
  padding:5px 11px;cursor:pointer;white-space:nowrap;transition:background .15s ease,color .15s ease,border-color .15s ease}
.tsn-rec-pay:hover{background:#4f46e5;border-color:#4f46e5;color:#fff}
.tsn-rec-pay:disabled{opacity:.62;cursor:default}
.tsn-rec-pay i{font-style:normal;font-size:11px;line-height:1}
[data-theme='dark'] .tsn-rec.is-pending:hover{background:rgba(155,130,255,.09)}
[data-theme='dark'] .tsn-rec-hint{color:#b3a9ff;background:rgba(155,130,255,.09);border-color:rgba(155,130,255,.22)}
[data-theme='dark'] .tsn-rec-pay{color:#b3a9ff;background:rgba(155,130,255,.14);border-color:rgba(155,130,255,.36)}
[data-theme='dark'] .tsn-rec-pay:hover{background:#7c6cff;border-color:#7c6cff;color:#fff}

/* ── 站点统一提示组件（2026-09-26）：替代原生 alert/confirm ── */
#tkToast{
  position:fixed;left:50%;top:84px;transform:translate(-50%,-10px);opacity:0;z-index:99999;
  display:flex;align-items:center;gap:9px;max-width:82vw;
  padding:10px 18px;border-radius:999px;background:rgba(20,18,32,.94);color:#f2f1ff;
  font-size:13px;font-weight:600;line-height:1.4;letter-spacing:.2px;
  border:1px solid rgba(124,92,255,.34);box-shadow:0 10px 30px rgba(0,0,0,.32);
  pointer-events:none;transition:opacity .2s ease,transform .2s ease;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
#tkToast.on{opacity:1;transform:translate(-50%,0)}
#tkToast::before{content:'';width:7px;height:7px;border-radius:50%;flex:0 0 auto}
#tkToast.kind-ok::before{background:#3ddc84}
#tkToast.kind-warn::before{background:#ffb020}
#tkToast.kind-info::before{background:#8b7bff}
#tkPrompt{
  position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;
  background:rgba(6,6,14,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease;
}
#tkPrompt.on{opacity:1;visibility:visible}
#tkPrompt .tkp-card{
  width:min(360px,86vw);box-sizing:border-box;border-radius:20px;padding:26px 24px 20px;text-align:center;
  background:linear-gradient(180deg,#1a1826,#141220);border:1px solid rgba(124,92,255,.28);
  box-shadow:0 24px 60px rgba(0,0,0,.5);transform:translateY(8px) scale(.97);
  transition:transform .22s cubic-bezier(.2,.8,.2,1);
}
#tkPrompt.on .tkp-card{transform:none}
.tkp-ic{
  width:40px;height:40px;margin:0 auto 14px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:19px;font-weight:800;line-height:1;font-style:normal;
}
.tkp-card.kind-ok .tkp-ic{background:rgba(61,220,132,.13);color:#3ddc84;border:1px solid rgba(61,220,132,.35)}
.tkp-card.kind-warn .tkp-ic{background:rgba(255,176,32,.13);color:#ffb020;border:1px solid rgba(255,176,32,.35)}
.tkp-card.kind-info .tkp-ic{background:rgba(124,92,255,.16);color:#a99bff;border:1px solid rgba(124,92,255,.4)}
.tkp-tx{color:#e8e6f5;font-size:14px;line-height:1.7;white-space:pre-line;word-break:break-word}
.tkp-btns{display:flex;gap:10px;margin-top:20px}
.tkp-btn{
  flex:1;height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:transparent;
  color:#c9c6dd;font-size:13.5px;font-weight:600;cursor:pointer;font-family:inherit;
  transition:background .15s ease,filter .15s ease;
}
.tkp-btn:hover{background:rgba(255,255,255,.06)}
.tkp-btn.primary{border-color:transparent;background:linear-gradient(135deg,#7c5cff,#5b3fd6);color:#fff}
.tkp-btn.primary:hover{background:linear-gradient(135deg,#8a6dff,#6647e0)}
[data-theme='light'] #tkPrompt{background:rgba(24,20,50,.42)}
[data-theme='light'] #tkPrompt .tkp-card{background:#fff;border-color:#e8e5f6;box-shadow:0 24px 60px rgba(24,20,60,.18)}
[data-theme='light'] .tkp-tx{color:#1e1c2e}
[data-theme='light'] .tkp-btn{color:#4a4763;border-color:#e2e0ee}
[data-theme='light'] .tkp-btn:hover{background:#f5f4fb}
[data-theme='light'] .tkp-card.kind-info .tkp-ic{color:#6b4df0}
