/* 墨白反转（2026-10-18）：订阅计划与关于页共用。黑白灰为主，薄荷绿只做点缀。 */
:root{
  --ink:var(--theme-ink,#111);--ink-2:var(--theme-ink,#2a2a2a);--ink-muted:var(--theme-muted,#666);--ink-faint:var(--theme-muted,#8c8c8c);--ink-line:var(--theme-line,#e6e6e6);--ink-wash:var(--theme-surface,#f6f6f6);
  --ink-night:#0d0d0d;--ink-night-2:#1a1a1a;--ink-night-line:#2a2a2a;--ink-night-muted:#9a9a9a;
  --ink-mint:#7fd4b0;--ink-mint-text:var(--theme-accent,#2f7a5f);--ink-mint-ink:#0d2a1f;
  --ink-display:"Helvetica Neue",Helvetica,Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  --ink-mono:"SF Mono","SFMono-Regular",Menlo,Consolas,monospace;
  --ink-ease:cubic-bezier(.22,.7,.2,1);
}

/* ---------- 回响涟漪 ---------- */
.ink-echo-layer{position:fixed;inset:0;pointer-events:none;z-index:60;overflow:hidden}
.ink-echo{position:absolute;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;border:1px solid var(--echo-color);opacity:0;animation:ink-echo 1.7s cubic-bezier(.2,.6,.3,1) forwards}
.ink-echo.is-fill{border:0;background:radial-gradient(circle,var(--echo-color) 0,transparent 65%);animation-duration:.9s}
@keyframes ink-echo{0%{transform:scale(.2);opacity:.6}100%{transform:scale(var(--echo-scale));opacity:0}}

/* ---------- 订阅计划 ---------- */
.page-plans .ink-plans{padding-bottom:40px}
.page-plans .ink-plans h1,.page-plans .ink-plans h2{font-family:var(--ink-display)}

/* 内测横幅 */
[data-beta-hidden]{display:none!important}
.plan-ownership{font-size:12px;color:inherit;margin-top:12px}
.page-plans .ink-beta [data-beta-plans] [hidden]{display:none!important}
.page-plans .ink-beta{padding-top:56px}
.page-plans .ink-beta .beta-offer{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:center;margin:0;padding:40px 44px;border:0;border-radius:24px;background:var(--ink-night);color:#fff}
.page-plans .ink-beta .beta-offer::after{content:"";position:absolute;right:200px;top:-140px;width:440px;height:440px;border-radius:50%;background:radial-gradient(closest-side,rgba(127,212,176,.2),transparent);pointer-events:none}
.page-plans .ink-beta .beta-offer-copy,.page-plans .ink-beta .beta-offer-actions{position:relative;z-index:1}
.page-plans .ink-beta .beta-offer-label{padding:6px 10px;border:1px solid #444;border-radius:999px;color:#ccc;font:600 11.5px/1 var(--ink-mono);letter-spacing:.08em}
.page-plans .ink-beta .beta-offer h2{margin:18px 0 0;letter-spacing:-.03em}
.page-plans .ink-beta .beta-title-lead{font-size:20px;font-weight:600;color:#ddd;margin-bottom:4px}
.page-plans .ink-beta .beta-title-highlight{font-size:clamp(40px,5vw,64px);line-height:1.05;font-weight:700;color:#fff;padding-bottom:8px}
.page-plans .ink-beta .beta-title-highlight .is-brand,.page-plans .ink-beta .beta-title-highlight .is-brand .beta-title-char{color:var(--ink-mint)}
.page-plans .ink-beta .beta-title-highlight::after{height:3px;background:var(--ink-mint);opacity:.85}
.page-plans .ink-beta .beta-offer p{max-width:620px;margin-top:16px;color:#a8a8a8;font-size:14.5px}
.page-plans .ink-beta .beta-offer-actions{align-items:center;gap:12px}
.page-plans .ink-beta .beta-offer .button.primary.beta-offer-cta{min-width:200px;min-height:54px;border:0;border-radius:12px;background:#fff;color:#111;font-size:15px;font-weight:650}
.page-plans .ink-beta .beta-offer .button.primary.beta-offer-cta:hover{box-shadow:0 0 0 4px rgba(255,255,255,.16)}
.page-plans [data-beta-plans] .beta-offer-arrow{width:18px;height:18px;flex:none}
.page-plans [data-beta-plans] .early-title-phrase{display:inline-block;white-space:nowrap}
.page-plans .ink-beta .beta-member-link{color:#cfcfcf;font-size:13px}
.page-plans .ink-beta .beta-member-link:hover{color:#fff}
.page-plans .ink-beta .beta-offer-retry{color:#fff;border-color:#555}

/* 标题与周期切换 */
.page-plans .ink-intro{max-width:none;padding:88px 0 0;text-align:center}
.page-plans .ink-intro h1{font-size:clamp(36px,4.4vw,56px);line-height:1.05;letter-spacing:-.045em;font-weight:700;color:var(--ink)}
.page-plans .ink-intro>p{max-width:640px;margin:18px auto 0;font-size:17px;color:var(--ink-muted)}
.ink-period{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:2px;margin-top:30px;padding:4px;border-radius:999px;background:var(--theme-surface,#f0f0f0)}
.ink-period[hidden]{display:none}
.ink-period button{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:8px 16px;border:0;border-radius:999px;background:transparent;color:var(--theme-ink,#444);font:inherit;font-size:13.5px;cursor:pointer;transition:background .2s,color .2s}
.ink-period button:hover{color:var(--ink)}
.ink-period button[aria-pressed="true"]{background:var(--ink);color:var(--theme-on-ink,#fff)}
.ink-period button:focus-visible{outline:2px solid var(--ink-mint-text);outline-offset:2px}
.ink-save{font-size:11px;font-weight:700;color:var(--ink-mint-text)}
.ink-period button[aria-pressed="true"] .ink-save{color:var(--theme-on-ink,var(--ink-mint))}

/* 两张卡 */
.ink-tiers{display:grid;grid-template-columns:1fr 1.18fr;gap:18px;grid-auto-rows:1fr;align-items:stretch;max-width:1000px!important;margin:40px auto 0}
.ink-tiers:has(.ink-max){max-width:1320px!important}
@media(min-width:1180px){.ink-tiers:has(.ink-max){grid-template-columns:1fr 1.18fr 1.18fr}}
/* Keep the three-column card widths when centering the lifetime pair. */
@media(min-width:1180px){
  .ink-tiers.is-lifetime:not(.without-max){display:flex;justify-content:center}
  .ink-tiers.is-lifetime:not(.without-max)>.ink-free{flex:0 0 calc((100% - 36px)/3.36);min-width:0}
  .ink-tiers.is-lifetime:not(.without-max)>.ink-pro{flex:0 0 calc((100% - 36px)*1.18/3.36);min-width:0}
}

@media(max-width:1179px){.ink-max{grid-column:1/-1}}
.ink-max{overflow:hidden;background:var(--ink-night);color:#f3f3f3;border:1px solid var(--ink-mint);box-shadow:0 40px 70px -40px rgba(0,0,0,.55)}
.ink-max .ink-feat li,.ink-max .ink-cap{color:#cfcfcf}
.ink-max .ink-feat svg{color:var(--ink-mint)}
.ink-btn-mint{border:0;background:var(--ink-mint);color:#111}
.ink-btn-mint:hover{box-shadow:0 0 0 4px rgba(120,220,180,.2)}
.page-plans .ink-max #max-grid{display:block;min-height:96px}
.page-plans .ink-max #max-grid>p{margin:0;font-size:13px;color:var(--ink-night-muted)}
.page-plans .ink-max .plan-note-line{grid-column:1/-1;margin:2px 0 0;font-size:13px;line-height:1.6;color:var(--ink-mint)}
.page-plans .ink-max .plan .term{display:block}
.page-plans .ink-plans .comparison td.max-cell{background:var(--ink-night);color:#fff}
.page-plans .ink-plans .comparison th:last-child,.page-plans .ink-plans .comparison td:last-child{border-left:1px solid var(--ink-night-line)}
.ink-tier{position:relative;display:flex;flex-direction:column;gap:22px;padding:38px;border-radius:24px}
.ink-free{border:1px solid var(--ink-line);background:var(--theme-bg,#fff)}
.ink-pro{overflow:hidden;background:var(--ink-night);color:#f3f3f3;box-shadow:0 40px 70px -40px rgba(0,0,0,.55)}
.ink-pro-art{position:absolute;right:-70px;top:-70px;width:300px;height:300px;border-radius:50%;background:url(/assets/ink-writing-640.webp) center/cover;filter:invert(1);opacity:.1;pointer-events:none}
.ink-tier header{min-height:86px}
.ink-tier header h2{display:flex;align-items:center;justify-content:space-between;font-size:21px;font-weight:700;letter-spacing:-.3px}
.ink-tier header p{margin:6px 0 0;font-size:14.5px;color:var(--ink-muted)}
.ink-pro header p,.ink-max header p{color:var(--ink-night-muted)}
.ink-badge{padding:4px 10px;border-radius:999px;background:var(--ink-mint);color:var(--ink-mint-ink);font-size:11.5px;font-weight:700;letter-spacing:0;font-family:inherit}
.ink-price{display:flex;align-items:baseline;gap:6px}
.page-plans .ink-free>.ink-price{min-height:66px;align-items:flex-end}
.page-plans .ink-free>.ink-price .ink-unit{margin-bottom:6px}
.page-plans .ink-free>.ink-cap{margin-bottom:23px;line-height:1.6}
.ink-num{font-size:56px;line-height:1;font-weight:700;letter-spacing:-2.4px;font-variant-numeric:tabular-nums}
.ink-unit{font-size:14px;color:var(--ink-muted)}
.ink-cap{margin:-12px 0 0;font-size:13px;color:var(--ink-faint)}
.ink-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;margin:0;padding:12px 22px;border-radius:12px;font-size:14px;font-weight:600;transition:transform .15s var(--ink-ease),box-shadow .2s,background .2s,border-color .2s}
.ink-btn:active{transform:scale(.98)}
.ink-btn-line{border:1px solid var(--theme-line,#d4d4d4);background:var(--theme-bg,#fff);color:var(--ink)}
.ink-btn-line:hover{border-color:var(--ink)}
.page-plans .ink-free>.ink-btn-line{background:var(--ink);border-color:var(--ink);color:var(--theme-on-ink,#fff)}
.ink-btn-light{border:0;background:#fff;color:#111}
.ink-btn-light:hover{box-shadow:0 0 0 4px rgba(255,255,255,.16)}
.ink-btn svg{flex:none}
.ink-rule{height:1px;background:var(--ink-line)}
.ink-pro .ink-rule,.ink-max .ink-rule{background:var(--ink-night-line)}
.ink-label{margin:0 0 -8px;font:600 11.5px/1.4 var(--ink-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint)}
.ink-pro .ink-label,.ink-max .ink-label{color:#777}
.ink-feat{display:grid;gap:12px;margin:0;padding:0;list-style:none;font-size:14.5px}
.ink-feat li{display:flex;gap:10px;align-items:flex-start}
.ink-feat svg{margin-top:3px;color:var(--theme-muted,#a0a0a0);flex:none}
.ink-soon{margin:auto 0 0;padding-top:14px;border-top:1px solid var(--ink-line);font-size:13px;color:var(--ink-muted)}
.ink-soon .soon-tag{margin-left:8px}
.ink-status{margin:-10px 0 0;text-align:center;font-size:12.5px;color:var(--theme-muted,#8a8a8a)}
/* Named PRO benefits use the same Lucide outline icons as Max. */
.ink-pro-features{gap:16px}
.ink-pro-features svg{color:var(--ink-mint)}
.ink-pro-features strong{font-weight:600;color:var(--ink-mint)}
.ink-pro-features .ink-feature-description{display:block;margin-top:3px;color:#cfcfcf;font-size:13px;line-height:1.7}
.ink-feature-new{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:6px;background:var(--ink-mint);color:var(--ink-mint-ink);font-size:11px;font-weight:600;line-height:1.5;vertical-align:middle}
.ink-pro-more{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;min-height:44px;margin-top:auto;padding:8px 0;border:0;background:none;color:var(--ink-mint);font:inherit;font-size:14px;cursor:pointer}
.ink-pro-more:focus-visible{outline:2px solid var(--ink-mint);outline-offset:4px}
#pro-advanced{scroll-margin-top:100px}
#pro-advanced.is-highlighted tr>*{animation:pro-features-highlight 2.2s ease-out}
@keyframes pro-features-highlight{0%,35%{box-shadow:inset 0 0 0 999px #7fd3ab35}100%{box-shadow:inset 0 0 0 999px #7fd3ab00}}
.ink-period-wrap{position:relative;max-width:1320px;margin:112px auto 0}
.ink-period-wrap #plan-period{margin-top:0}
@media(max-width:1179px){.ink-period-wrap{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:36px}}

/* PRO 卡里的价格：四个套餐都渲染，只显示所选一个 */
.page-plans :is(.ink-pro,.ink-max) #plans-grid{display:block;min-height:96px}
.page-plans :is(.ink-pro,.ink-max) #plans-grid>p{margin:0;font-size:13px;color:var(--ink-night-muted)}
.page-plans :is(.ink-pro,.ink-max) .plan{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-rows:minmax(66px,auto);align-items:end;gap:4px 10px;min-height:0;padding:0;border:0;border-radius:0;background:none;color:inherit;overflow:visible}
.page-plans :is(.ink-pro,.ink-max) .plan[hidden]{display:none}
.page-plans :is(.ink-pro,.ink-max) .plan::before{display:none}
.page-plans :is(.ink-pro,.ink-max) .plan-skeleton{display:block;height:84px;border-radius:12px;background:var(--ink-night-2)}
.page-plans :is(.ink-pro,.ink-max) .plan-skeleton~.plan-skeleton{display:none}
.page-plans :is(.ink-pro,.ink-max) .plan-skeleton .skeleton-block{display:none}
.page-plans :is(.ink-pro,.ink-max) .plan-top,.page-plans :is(.ink-pro,.ink-max) .plan h3{display:none}
.page-plans :is(.ink-pro,.ink-max) .plan .price{grid-row:1;align-items:baseline;font-size:56px;line-height:1;font-weight:700;letter-spacing:-2.4px;font-variant-numeric:tabular-nums}
.page-plans :is(.ink-pro,.ink-max) .plan .price-currency{font-size:.5em;letter-spacing:0;margin-right:2px;vertical-align:.7em}
.page-plans :is(.ink-pro,.ink-max) .plan .term{grid-row:1;align-self:end;margin:0 0 6px;font-size:13px;color:var(--ink-night-muted)}
.page-plans :is(.ink-pro,.ink-max) .plan-value{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:4px 14px;min-height:0;margin:6px 0 0;padding:0;border:0}
.page-plans :is(.ink-pro,.ink-max) .plan-daily,.page-plans :is(.ink-pro,.ink-max) .plan-savings{min-height:0;margin:0;padding:0;border:0;font-size:13px;line-height:1.6;color:#8a8a8a}
.page-plans :is(.ink-pro,.ink-max) .plan-savings{color:var(--ink-mint)}
.page-plans :is(.ink-pro,.ink-max) .plan .button{display:none}
.page-plans :is(.ink-pro,.ink-max) .plans-retry{margin-left:8px;padding:6px 12px;border:1px solid #555;border-radius:8px;background:none;color:#fff;cursor:pointer}

/* 信任点 */
.ink-trust{max-width:1000px!important;margin:30px auto 0;text-align:center}
.ink-trust ul{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 34px;margin:0;padding:0;list-style:none;font-size:13.5px;color:var(--ink-muted)}
.ink-trust li,.ink-trust li a{display:inline-flex;align-items:center;gap:8px}
.ink-trust li a:hover{color:var(--ink)}
.ink-trust svg{color:var(--ink)}
.ink-trust .fine{max-width:760px;margin:12px auto 0;font-size:12.5px;line-height:1.7;color:var(--ink-faint)}
.ink-trust .fine strong{color:var(--ink-2);font-weight:600}

/* 逐项对比：沿用现有结构，换成粗黑线 + PRO 黑列 */
.page-plans .ink-plans .comparison{margin-top:96px}
.page-plans .ink-plans .comparison-head{align-items:flex-end;padding-bottom:16px;border-bottom:2px solid var(--ink)}
.page-plans .ink-plans .comparison-head h2{font-size:34px;letter-spacing:-1.2px;font-weight:700}
.page-plans .ink-plans .compare-switch{border-radius:10px;background:var(--theme-surface,#eee)}
.page-plans .ink-plans .comparison th:last-child,.page-plans .ink-plans .comparison td:last-child{background:var(--ink-night);color:#fff;border-bottom-color:var(--ink-night-line)}
.page-plans .ink-plans .comparison td:last-child .comparison-mark{color:var(--ink-mint)}
.page-plans .ink-plans .comparison thead th:last-child span{color:var(--ink-night-muted)}
.page-plans .ink-plans .comparison .feature-group th{background:var(--ink-wash);color:var(--ink)}

/* 常见问题：左右两栏 */
.page-plans .ink-faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;max-width:none;margin-top:96px;padding-top:28px;border-top:2px solid var(--ink)}
.page-plans .ink-faq h2{font-size:34px;line-height:1.15;letter-spacing:-1.2px;font-weight:700;margin:0}
.page-plans .ink-faq-side>p:not(.faq-links){margin:12px 0 0;font-size:14.5px;color:var(--ink-muted)}
.page-plans .ink-faq-issue{display:inline-flex;margin-top:18px;font-size:14px;font-weight:600;border-bottom:1.5px solid var(--ink)}
.page-plans .ink-faq .faq-links{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:22px}
.page-plans .ink-faq details{border-bottom:1px solid var(--ink-line)}
.page-plans .ink-faq details:first-child{border-top:0}
.page-plans .ink-faq summary{font-size:16px;font-weight:600}

/* ---------- 窄屏 ---------- */
@media(max-width:900px){
  .page-plans .ink-beta{padding-top:28px}
  .page-plans .ink-beta .beta-offer{grid-template-columns:1fr;padding:28px 22px}
  .page-plans .ink-beta .beta-offer-actions{align-items:stretch}
  .page-plans .ink-intro{padding-top:56px}
  .ink-period{border-radius:18px}
  .ink-tiers{grid-template-columns:1fr}
  .ink-tier{padding:26px}
  .ink-num,.page-plans :is(.ink-pro,.ink-max) .plan .price{font-size:46px}
  .page-plans .ink-faq{grid-template-columns:1fr;gap:20px}
  .page-plans .ink-plans .comparison-head{flex-wrap:wrap;gap:12px}
}
@media(prefers-reduced-motion:reduce){
  .ink-echo-layer{display:none}
  .ink-btn,.ink-mod,.ink-period button{transition:none}
}
/* The selected CNY pass is now actionable; the period selector owns the plan. */
.page-plans :is(.ink-pro,.ink-max) .plan .button { display:inline-flex; background:#fff; color:#151515; border-color:#fff; margin-top:16px; min-height:44px; }
.page-plans :is(.ink-pro,.ink-max) .plan .button:disabled { opacity:.6; }
.page-plans :is(.ink-pro,.ink-max) > [data-track="plans.pro.claim"][hidden] { display:none; }

.early-bubble{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);font-size:11px;line-height:1.4;white-space:nowrap;background:var(--launch-green,#37695b);color:#fff;padding:5px 8px;border-radius:8px;pointer-events:none}
.early-bubble::after{content:"";position:absolute;top:100%;left:50%;border:4px solid transparent;border-top-color:var(--launch-green,#37695b);transform:translateX(-50%)}
#plan-period{overflow:visible;margin-top:42px}#plan-period [data-period]{position:relative}
.beta-redeem-link{font-size:12px;line-height:1.7;text-decoration:underline;text-underline-offset:3px;color:inherit;max-width:100%}
.beta-offer-actions{flex-wrap:wrap}.beta-offer-actions [data-beta-register]{white-space:normal;text-align:center}
@media(max-width:600px){#plan-period{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 4px;width:100%;border-radius:14px}#plan-period [data-period]{justify-content:center}.early-bubble{left:auto;right:6px;transform:none}.early-bubble::after{left:auto;right:20px;transform:none}}

.ink-tiers.without-max{grid-template-columns:1fr 1.18fr;max-width:1000px!important}
@media(max-width:760px){.ink-tiers.without-max{grid-template-columns:1fr}}

[data-max-only][hidden],[data-max-checkout][hidden]{display:none!important}

/* PRO and Max use the same price, value and purchase rows. */
.page-plans :is(.ink-pro,.ink-max) .plan-action{grid-column:1/-1;display:flex;align-items:center;min-height:48px;margin-top:16px}
.page-plans :is(.ink-pro,.ink-max) .plan-action .button{margin:0;min-height:48px}
.page-plans :is(.ink-pro,.ink-max) .plan-action .ink-status{width:100%;margin:0;font-size:14px}
.page-plans :is(.ink-pro,.ink-max) header{min-height:86px}
.page-plans :is(.ink-pro,.ink-max) .plan-comparison{display:flex;flex-wrap:wrap;align-content:start;gap:4px 14px}
.ink-pro{border:1px solid transparent}
.page-plans :is(.ink-pro,.ink-max) .plan .plan-benefits{min-height:21px;color:var(--ink-mint)}
.page-plans .plan-action :is(#sales-status,#max-status){margin:0}
@media(max-width:380px){html[lang="en"] .page-plans :is(.ink-pro,.ink-max) .plan-benefits{min-height:42px}}
@media(max-width:600px){.page-plans :is(.ink-pro,.ink-max) .plan{grid-template-rows:minmax(86px,auto)}.page-plans .ink-free>.ink-price{min-height:86px}}

/* Purchase controls and named benefits follow the shared plans specification. */
body.page-plans :is(button,.button,[role="button"],[data-account-link],.ink-faq-issue,.ink-status,summary,.language-switch a){border-radius:12px!important}
.page-plans :is(.ink-mod b,.ink-max .ink-feat strong){color:var(--ink-mint);font-weight:600}
.page-plans :is(.ink-mod span,.ink-max .ink-feat li){color:#cfcfcf}
.page-plans .ink-max .ink-feat li{line-height:1.7}

.page-plans .ink-max .sync-comparison{display:block;margin:4px 0}
