.subpage { min-height: calc(100vh - 69px); padding: 38px 24px 64px; background: linear-gradient(115deg,#f0f8ff,#f5fffb); }
.page-shell { width: min(1000px,100%); margin: 0 auto; }
.glass-panel { border: 1px solid #cfe3f5; border-radius: 24px; background: rgba(255,255,255,.82); box-shadow: 0 24px 60px rgba(43,91,133,.10); }
.eyebrow { color:#2265f4; font-weight:800; font-size:14px; }

/* Models */
.pricing-hero { padding: 48px 34px; background: radial-gradient(circle at 90% 25%,rgba(137,243,199,.23),transparent 30%),rgba(232,250,255,.88); }
.pricing-intro { display:grid; grid-template-columns:1fr 320px; gap:44px; align-items:center; }
.pricing-intro h1 { margin:22px 0 12px; font-size:38px; letter-spacing:-1.8px; }
.pricing-intro p { margin:0; color:#43566d; line-height:1.8; }
.discount-ticket { padding:24px; border:1px solid #d9e7ef; border-radius:18px; background:rgba(255,255,255,.86); text-align:center; font-weight:800; }
.discount-ticket strong { display:block; color:#2b6df2; font-size:58px; line-height:1; }
.discount-ticket strong::before { content:'× '; font-size:20px; color:#111c2b; }
.price-picker { margin-top:30px; padding:26px; border:1px solid #d9e6ee; border-radius:20px; background:#fff; }
.price-picker h2 { margin:0 0 6px; font-size:24px; }
.price-picker > p { margin:0 0 24px; color:#607187; font-size:13px; }
.price-options { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.price-option { min-height:228px; padding:21px; border:1px solid #a9e9cb; border-radius:14px; background:linear-gradient(145deg,#fff,#f1fcf7); cursor:pointer; text-align:left; }
.price-option.active { outline:3px solid #19b8d0; box-shadow:0 8px 18px rgba(24,151,180,.2); }
.price-option small { color:#9ba9bb; font-weight:700; }
.price-option .original { margin:10px 0 2px; color:#5d6a7e; font-size:34px; font-weight:850; text-decoration:line-through; }
.price-option .deal { display:inline-block; padding:5px 10px; border-radius:999px; color:#008a61; background:#d9f7eb; font-weight:800; }
.price-option h3 { margin:10px 0 8px; font-size:20px; }
.price-option p { color:#64758a; font-size:13px; }
.price-option .rmb { display:block; margin-top:34px; }
.custom-price label { display:block; font-size:19px; font-weight:800; }
.custom-price input { width:100%; height:39px; margin:17px 0 6px; padding:0 11px; border:1px solid #d5dee8; border-radius:5px; font:inherit; }
.price-summary { display:grid; grid-template-columns:1fr auto; gap:8px 30px; margin-top:24px; padding:16px; border:1px solid #dbe3ea; background:#f8fafc; }
.price-summary strong { text-align:right; }
.price-footer { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-top:18px; color:#65758a; font-size:12px; }
.pay-button { min-width:188px; height:41px; border:0; border-radius:999px; color:#fff; background:linear-gradient(100deg,#1d5b51,#09a953); font-weight:800; cursor:pointer; box-shadow:0 10px 20px rgba(17,111,71,.22); }
.model-table { margin-top:28px; padding:26px; }
.model-table h2 { margin-top:0; }
.model-table table { width:100%; border-collapse:collapse; }
.model-table th,.model-table td { padding:14px; border-bottom:1px solid #e4edf3; text-align:left; }
.model-table th { color:#66778c; font-size:12px; }

/* Docs */
.docs-panel { padding:36px; background:rgba(255,255,255,.87); }
.docs-head { position:relative; }
.docs-head h1 { margin:8px 0 10px; font-size:44px; color:#203966; }
.docs-head p { margin:0; color:#5a75a5; font-size:18px; }
.step-badge { position:absolute; right:0; top:0; padding:14px 22px; border:1px solid #cfe0ff; border-radius:22px; background:#eef4ff; color:#405d8c; font-size:12px; }
.step-badge strong { display:block; margin-top:6px; }
.docs-body { display:grid; grid-template-columns:200px 1fr; gap:16px; margin-top:26px; }
.step-nav { display:flex; flex-direction:column; gap:14px; }
.step-nav button { min-height:82px; padding:16px; border:1px solid #cfe0ff; border-radius:18px; background:#fff; color:#203966; text-align:left; cursor:pointer; font-size:16px; }
.step-nav button span { display:block; margin-bottom:8px; color:#2a67f2; font-size:12px; }
.step-nav button.active { color:#fff; background:#426ce4; }
.step-nav button.active span { color:#fff; }
.step-content { padding:30px 35px; border:1px solid #cfddf5; border-radius:22px; background:#fff; }
.step-content h2 { margin:0; color:#203966; font-size:38px; }
.step-content > p { color:#607aaa; }
.doc-demo { display:grid; grid-template-columns:1.65fr .85fr; gap:20px; margin-top:28px; }
.doc-demo img { width:100%; border:1px solid #c7d9f5; border-radius:18px; }
.instruction h3 { margin-top:6px; color:#28456f; font-size:23px; }
.instruction ol { padding:0; list-style:none; counter-reset:steps; }
.instruction li { margin:18px 0; color:#405e91; }
.instruction li::before { counter-increment:steps; content:counter(steps); display:inline-grid; place-items:center; width:30px; height:30px; margin-right:12px; border-radius:50%; color:#fff; background:#3b6ce8; }
.doc-note { margin-top:22px; padding:22px; border:1px solid #c7d9fa; border-radius:18px; background:#f5f9ff; color:#39557f; }

/* Register */
.register-page { min-height:100vh; padding:34px 24px 80px; background:radial-gradient(circle at 72% 68%,#cbeaff,transparent 29%),#f7fdff; }
.register-top { width:min(900px,100%); margin:0 auto; display:flex; justify-content:space-between; align-items:center; }
.register-login { padding:8px 12px; border:1px solid #cbd9e5; border-radius:999px; background:#fff; font-size:13px; font-weight:700; }
.role-panel { width:min(1040px,100%); margin:168px auto 0; padding:58px 72px 80px; }
.role-title { display:flex; align-items:baseline; gap:58px; }
.role-title span { color:#314660; font-weight:700; }
.role-title h1 { margin:0; font-size:42px; }
.register-roles { display:grid; grid-template-columns:repeat(3,1fr); gap:100px; margin-top:66px; }
.register-role { border:0; background:transparent; cursor:pointer; }
.register-role img { width:164px; height:164px; object-fit:cover; border:8px solid #fff; border-radius:50%; box-shadow:0 18px 38px rgba(33,69,94,.16); transition:.2s; }
.register-role:hover img,.register-role.selected img { transform:translateY(-5px); box-shadow:0 0 0 4px #2c74f3,0 18px 38px rgba(33,69,94,.19); }
.register-role h2 { margin:24px 0 10px; }
.register-role p { margin:0; padding:8px 12px; border-radius:14px; background:#eef6ff; line-height:1.45; }
.role-confirm { display:none; margin:36px auto 0; width:max-content; padding:12px 28px; border:0; border-radius:999px; color:#fff; background:#1769e8; font-weight:800; cursor:pointer; }
.role-confirm.show { display:block; }

@media (max-width:760px) {
  .subpage { padding:22px 14px 40px; }
  .pricing-hero,.docs-panel { padding:24px 16px; }
  .pricing-intro { grid-template-columns:1fr; gap:22px; }
  .pricing-intro h1 { font-size:30px; }
  .discount-ticket { display:flex; align-items:center; justify-content:center; gap:12px; }
  .discount-ticket strong { font-size:42px; }
  .price-picker { padding:18px 12px; }
  .price-options { grid-template-columns:1fr 1fr; }
  .price-option { min-height:205px; padding:15px; }
  .price-footer { flex-direction:column; align-items:stretch; }
  .pay-button { width:100%; }
  .model-table { overflow-x:auto; }
  .docs-head h1 { font-size:34px; }
  .docs-head p { font-size:15px; }
  .step-badge { position:static; display:inline-block; margin-top:18px; }
  .docs-body { grid-template-columns:1fr; }
  .step-nav { flex-direction:row; overflow-x:auto; }
  .step-nav button { flex:0 0 140px; min-height:68px; }
  .step-content { padding:24px 16px; }
  .step-content h2 { font-size:29px; }
  .doc-demo { grid-template-columns:1fr; }
  .register-page { padding:20px 16px 50px; }
  .role-panel { margin-top:80px; padding:30px 20px 40px; }
  .role-title { display:block; }
  .role-title h1 { margin-top:8px; font-size:34px; }
  .register-roles { grid-template-columns:1fr; gap:34px; margin-top:40px; }
  .register-role img { width:140px; height:140px; }
}
.login-card{width:min(820px,100%);margin:220px auto 0;display:grid;grid-template-columns:1fr 1fr;overflow:hidden}.login-card>section{padding:50px 38px;background:linear-gradient(145deg,#e8fbff,#f7fffc)}.login-card h1{font-size:38px}.login-card form{padding:38px;display:flex;flex-direction:column;gap:14px}.login-card form h2{margin:0 0 8px}.login-card label,.tool-page label,.gift-page label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:700}.login-card .primary{margin-top:8px}.tool-page,.gift-page{min-height:calc(100vh - 68px);padding:52px max(24px,calc((100vw - 1180px)/2));background:linear-gradient(120deg,#effaff,#f7fffb)}.tool-page h1,.gift-page h1{font-size:48px;margin:18px 0 8px}.tool-page>p,.gift-page>p{color:#5d7088;font-size:17px}.tool-grid,.gift-grid{display:grid;grid-template-columns:1.6fr .9fr;gap:22px;margin-top:30px}.tool-grid .panel,.gift-grid .panel{min-height:260px}.tool-grid form,.gift-grid form{display:flex;flex-direction:column;gap:17px}.qr-preview{text-align:center}.fake-qr{margin:18px auto;width:180px;height:180px;display:grid;place-items:center;border:18px solid #fff;background:repeating-linear-gradient(45deg,#172235 0 5px,#fff 5px 10px);font-size:24px;line-height:1.3}.gift-page{padding-top:70px}.gift-grid ul{line-height:2;color:#53667c}.config-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;list-style:none;padding:0;counter-reset:step}.config-steps li{padding:20px;border-radius:12px;background:#edf5ff;color:#31527e}.config-steps li::before{counter-increment:step;content:'0' counter(step);display:block;margin-bottom:14px;color:#256df1;font-weight:800}@media(max-width:760px){.login-card{margin:70px 16px 0;display:block}.login-card>section,.login-card form{padding:28px 22px}.login-card h1{font-size:32px}.tool-page,.gift-page{padding:34px 16px}.tool-page h1,.gift-page h1{font-size:36px}.tool-grid,.gift-grid{grid-template-columns:1fr}.config-steps{grid-template-columns:1fr 1fr}}
