html:has(.pricing-c) { color-scheme:dark !important; background:#171815; }
body.pricing-c { --ink:#f8f4ed; --muted:#d8cfc0; --gold:#f4c77d; --line:rgb(239 226 202 / 18%); margin:0; color:var(--ink); font-family:"Microsoft YaHei","PingFang SC",sans-serif; font-synthesis:none; -webkit-font-smoothing:antialiased; background:linear-gradient(rgb(12 14 10 / 36%),rgb(12 14 10 / 48%)),url('./fashion-editorial.jpg') center / cover fixed; }
.pricing-c * { box-sizing:border-box; scrollbar-color:#92846d transparent; scrollbar-width:thin; }
.pricing-c [hidden] { display:none !important; }
.pricing-c button,.pricing-c input { font:inherit; }
.pricing-c button { color:inherit; cursor:pointer; }
.pricing-c button:disabled { cursor:not-allowed; }
.pricing-c :is(button,input,a,summary,[tabindex]):focus-visible { outline:2px solid var(--gold); outline-offset:3px; }
.pricing-c ::selection { background:var(--gold); color:#211c15; }
.pricing-c svg { width:18px; height:18px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.pricing-c a { color:var(--gold); text-underline-offset:3px; }
.pricing-c .pricing-shell { display:flex; flex-direction:column; width:min(1080px,calc(100% - 48px)); height:calc(100dvh - 64px); min-height:420px; margin:32px auto; overflow:hidden; border-radius:16px; background:rgb(24 26 21 / 40%); box-shadow:0 24px 80px rgb(0 0 0 / 28%),inset 0 1px 0 rgb(255 245 223 / 25%),inset 0 0 0 1px rgb(255 245 223 / 13%); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); }
.pricing-c .pricing-header { display:flex; flex-shrink:0; justify-content:space-between; align-items:center; gap:20px; min-height:88px; padding:20px 28px; border-bottom:1px solid var(--line); }
.pricing-title { display:flex; align-items:center; gap:14px; }
.pricing-title-row { display:flex; align-items:center; flex-wrap:wrap; gap:8px 20px; }
.pricing-payment-note { display:inline-flex; align-items:center; gap:12px; padding:5px 10px; border:1px solid rgb(244 199 125 / 26%); border-radius:5px; background:rgb(244 199 125 / 7%); color:var(--gold); font-size:12px; line-height:1.5; white-space:nowrap; }
.pricing-title img { width:32px; height:32px; }
.pricing-c h1 { margin:0; font:500 22px/1.4 var(--ui-font,"Microsoft YaHei","PingFang SC",sans-serif); letter-spacing:-.025em; }
.pricing-title p { margin:6px 0 0; color:var(--muted); font-size:11px; line-height:1.6; }
.pricing-top-actions { display:flex; gap:20px; font-size:12px; }
.pricing-top-actions a { display:inline-flex; align-items:center; min-height:44px; text-decoration:none; }
.pricing-c .pricing-scroll { flex:1; min-height:0; padding:24px 28px; overflow-y:auto; overscroll-behavior:contain; }
.pricing-layout { display:grid; grid-template-columns:minmax(0,1fr); gap:28px; }
.pricing-c h2 { margin:0; font-size:17px; line-height:1.5; font-weight:500; }
.pricing-section-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:16px; }
.pricing-section-head p { margin:5px 0 0; color:var(--muted); font-size:11px; line-height:1.8; }
.pricing-c .pricing-text-button { flex-shrink:0; min-height:44px; padding:0 4px; border:0; background:transparent; color:#f4d49f; font-size:12px; }
.pricing-c .pricing-text-button:hover { text-decoration:underline; text-underline-offset:4px; }
.pricing-c .pricing-text-button:disabled { color:var(--muted); opacity:.7; }
.pricing-status { margin:0 0 16px; color:#f3d19a; font-size:11px; line-height:1.8; }
.pricing-status:empty { display:none; }
.pricing-status[data-type="error"] { color:#ffb4a7; }
.pricing-plans { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.pricing-c .credit-package { position:relative; display:flex; flex-direction:column; min-width:0; padding:24px 20px 20px; text-align:left; border:1px solid rgb(239 226 202 / 23%); border-radius:12px; background:rgb(255 248 230 / 3%); }
.pricing-c .credit-package:hover { border-color:#d6bb8c; background:rgb(244 199 125 / 7%); }
.pricing-c .credit-package.is-selected { border-color:#eecb8b; background:rgb(244 199 125 / 10%); }
.pricing-c .package-select { position:relative; display:flex; flex-direction:column; align-items:flex-start; width:100%; padding:0; border:0; background:transparent; text-align:left; }
.package-name { padding-right:28px; font-size:16px; line-height:1.6; color:#eee4d5; overflow-wrap:anywhere; }
.package-points { display:flex; align-items:baseline; flex-wrap:wrap; gap:8px; margin:28px 0 12px; color:var(--gold); font-size:12px; font-variant-numeric:tabular-nums; }
.package-points strong { font-size:36px; line-height:1.2; font-weight:500; overflow-wrap:anywhere; }
.package-amount { font-size:24px; font-weight:500; font-variant-numeric:tabular-nums; letter-spacing:-.025em; }
.package-check { position:absolute; right:0; top:4px; width:17px; height:17px; border:1px solid rgb(239 226 202 / 35%); border-radius:50%; }
.package-terms { display:grid; gap:8px; margin:24px 0; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; line-height:1.7; }
.credit-package>.pricing-primary { margin-top:auto; }
[aria-pressed="true"]>.package-check { background:var(--gold); border-color:var(--gold); }
[aria-pressed="true"]>.package-check::after { content:""; position:absolute; top:3px; left:5px; width:4px; height:7px; border:solid #29251d; border-width:0 1.5px 1.5px 0; transform:rotate(45deg); }
.pricing-benefits { display:flex; flex-wrap:wrap; gap:14px; margin-top:14px; color:#ddd2bf; font-size:11px; }
.pricing-benefits span::before { content:""; display:inline-block; width:4px; height:4px; margin:0 7px 2px 0; border-radius:50%; background:#cdb58b; }
.pricing-detail { min-width:0; padding:4px 0 0 28px; border-left:1px solid var(--line); }
.detail-caption { margin:22px 0 8px; color:var(--muted); font-size:11px; }
.pricing-detail h3 { margin:0; font-size:16px; font-weight:500; overflow-wrap:anywhere; }
.detail-points { display:flex; align-items:baseline; flex-wrap:wrap; gap:12px; margin:14px 0 20px; }
.detail-points strong { color:#f4d49f; font-size:38px; font-weight:500; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.detail-points span { color:var(--muted); font-size:11px; }
.pricing-detail dl { display:grid; gap:12px; margin:0; }
.pricing-detail dl>div { display:flex; justify-content:space-between; gap:12px; font-size:12px; }
.pricing-detail dt { color:var(--muted); }
.pricing-detail dd { margin:0; text-align:right; }
.detail-note { margin:20px 0 12px; color:#d6c8b1; font-size:11px; line-height:1.8; }
.pricing-c .pricing-primary { display:flex; justify-content:center; align-items:center; min-height:44px; width:100%; padding:10px 16px; border:1px solid var(--gold); border-radius:7px; background:var(--gold); color:#211c15; text-decoration:none; font-size:13px; }
.pricing-c .pricing-primary:hover { background:#ffdaa0; }
.pricing-c .pricing-primary:disabled { border-color:rgb(244 199 125 / 16%); background:rgb(244 199 125 / 12%); color:#e2cfae; }
.pricing-models,.pricing-rules { grid-column:1/-1; min-width:0; padding-top:24px; border-top:1px solid var(--line); }
.pricing-tools { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.pricing-filters { display:flex; gap:4px; }
.pricing-filters button { min-height:40px; padding:0 14px; border:1px solid transparent; border-radius:6px; background:transparent; color:var(--muted); font-size:12px; }
.pricing-filters button[aria-pressed="true"] { background:rgb(244 199 125 / 12%); border-color:rgb(244 199 125 / 35%); color:var(--gold); }
.pricing-filters button:hover { color:#fff5df; }
.pricing-search { display:flex; align-items:center; gap:8px; width:240px; min-height:40px; padding:0 12px; border:1px solid var(--line); border-radius:7px; background:rgb(0 0 0 / 12%); color:#d8cbb7; }
.pricing-search input { width:100%; min-width:0; border:0; padding:8px 0; background:transparent; color:var(--ink); font-size:12px; caret-color:var(--gold); }
.pricing-search input::placeholder { color:#d1c5b2; }
.pricing-table-note { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin:12px 0; color:#ddd0b9; font-size:11px; line-height:1.7; }
.pricing-table-note p { margin:0; }
.pricing-table { width:100%; border-collapse:collapse; table-layout:fixed; font-size:12px; }
.pricing-table th { color:#dbd1c1; font-weight:400; text-align:left; background:rgb(8 10 6 / 18%); }
.pricing-table th,.pricing-table td { padding:12px; border-bottom:1px solid rgb(239 226 202 / 12%); line-height:1.6; overflow-wrap:anywhere; }
.pricing-table th:first-child { width:54%; }
.pricing-table th:nth-child(2) { width:18%; }
.pricing-table th:last-child,.pricing-table td:last-child { text-align:right; }
.pricing-table td small { display:block; color:#cfc4b1; font-size:10px; margin-top:2px; }
.pricing-table .is-unpriced { color:#e6cfaa; }
.pricing-table .is-free { color:#c7e8b6; }
.pricing-table .price-value { color:var(--gold); font-variant-numeric:tabular-nums; }
.pricing-table tr:hover td { background:rgb(255 255 255 / 3%); }
.pricing-rules h2 { margin-bottom:16px; }
.pricing-rules details { border-bottom:1px solid var(--line); }
.pricing-rules summary { padding:17px 0; font-size:13px; cursor:pointer; }
.pricing-rules details p,.pricing-policy { max-width:72ch; margin:0 0 18px; color:var(--muted); font-size:12px; line-height:1.9; }
.pricing-policy { margin:24px 0 0; font-size:11px; }
.pricing-footer { display:flex; flex-shrink:0; align-items:center; justify-content:space-between; gap:20px; padding:12px 28px; border-top:1px solid var(--line); background:rgb(10 12 8 / 17%); }
.pricing-selected { display:flex; gap:24px; align-items:center; color:var(--muted); font-size:12px; }
.pricing-selected strong,.pricing-selected b { color:var(--ink); font-weight:500; }
.pricing-selected i { margin:0 10px; color:#aa9d87; font-style:normal; }
/* The host supplies the glass surface; iframe documents must stay transparent. */
html.pricing-embedded,html.pricing-embedded body.pricing-c { background:transparent; }
html.pricing-embedded { color-scheme:dark !important; }
.pricing-embedded .pricing-c .pricing-shell { width:100%; height:100dvh; min-height:0; margin:0; border-radius:0; background:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.pricing-embedded .pricing-header { padding-right:76px; }
.pricing-embedded .pricing-top-actions { display:none; }
@media(max-width:840px) { .pricing-plans { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:760px) { .pricing-layout { gap:24px; } .pricing-section-head { flex-wrap:wrap; gap:4px; } }
@media(max-width:600px) {
  .pricing-c .pricing-shell { width:calc(100% - 16px); height:calc(100dvh - 16px); min-height:380px; margin:8px; border-radius:14px; }
  .pricing-c .pricing-header { min-height:80px; padding:16px; gap:12px; }
  .pricing-title { gap:10px; } .pricing-title img { width:27px; height:27px; } .pricing-c h1 { font-size:20px; }
  .pricing-title p { max-width:25ch; font-size:10px; } .pricing-top-actions { gap:8px; font-size:11px; } .pricing-top-actions a:last-child { display:none; }
  .pricing-c .pricing-scroll { padding:20px 16px; } .pricing-layout { grid-template-columns:minmax(0,1fr); }
  .pricing-c h2 { font-size:16px; } .pricing-c .credit-package { padding:20px 16px 16px; }
  .pricing-plans { gap:12px; } .package-points strong { font-size:30px; } .package-amount { font-size:22px; }
  .pricing-detail { padding:20px 0 0; border-left:0; border-top:1px solid var(--line); }
  .pricing-tools { flex-wrap:wrap; gap:10px; } .pricing-search { width:100%; } .pricing-table { font-size:11px; }
  .pricing-table th,.pricing-table td { padding:10px 6px; } .pricing-table th:first-child { width:48%; } .pricing-table th:nth-child(2) { width:20%; }
  .pricing-footer { padding:10px 16px; gap:12px; } .pricing-selected { display:grid; gap:6px; font-size:11px; } .pricing-selected i { margin-inline:6px; }
  .pricing-embedded .pricing-c .pricing-header { padding-right:64px; }
}
@media(max-width:359px) { .pricing-plans { grid-template-columns:minmax(0,1fr); } }
@supports not (backdrop-filter:blur(1px)) { .pricing-c .pricing-shell { background:rgb(24 26 21 / 94%); } .pricing-embedded .pricing-c .pricing-shell { background:transparent; } }
