:root { color-scheme: light; --blue:#0a3b96; --text:#000; --muted:#70747d; --line:rgba(0,0,0,.15); --danger:#ff4b5f; --soft:#f6f8fb; }
* { box-sizing: border-box; }
html { background:#fff; }
body { margin:0; color:var(--text); font-family:"Pingfang SC","Helvetica Neue","Microsoft Yahei",Helvetica,Arial,"Hiragino Sans GB","Microsoft Sans Serif","WenQuanYi Micro Hei",sans-serif; font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased; }
button,input,textarea { font:inherit; }
.form-shell { width:calc(100% - 64px); max-width:700px; margin:32px auto 0; position:relative; }
.hero { display:block; position:sticky; top:32px; width:100%; height:auto; border-radius:12px 12px 0 0; }
.form-card { position:relative; margin-top:-28px; padding:28px 32px 32px; border-radius:28px 28px 12px 12px; background:linear-gradient(to bottom,rgba(255,255,255,.3) 0%,rgba(255,255,255,.9) 20vh); backdrop-filter:blur(20px) saturate(180%); -webkit-backdrop-filter:blur(20px) saturate(180%); }
.form-card::before { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; padding:1px; background:linear-gradient(145deg,#fffc,#ffffff0d 50vw); mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); mask-composite:exclude; }
.intro { padding:0 13px 33px; }
.intro h1 { margin:0 0 16px; text-align:center; font-size:28px; line-height:42px; font-weight:600; letter-spacing:0; overflow-wrap:break-word; }
.intro h2 { margin:0 0 24px; text-align:center; font-size:22px; line-height:33px; font-weight:700; }
.notice-copy { margin:0; font-size:16px; line-height:24px; }
.notice-copy p { margin:0; }
.field { margin:0 0 40px; padding:0; border:0; min-inline-size:0; }
.field > label:not(.choice),.field legend { display:block; position:relative; width:100%; padding:0 13px; margin:0 0 8px; font-size:16px; font-weight:600; line-height:24px; }
.required { position:absolute; left:-12px; top:0; color:#ff4b5f; font-weight:400; }
input[type="text"],input[type="tel"],textarea { display:block; width:100%; height:48px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.8); padding:11px 12px; color:var(--text); outline:none; box-shadow:0 2px 4px rgba(0,0,0,.04); transition:border-color .18s,box-shadow .18s; }
textarea { min-height:48px; resize:none; }
input[type="text"]:focus,input[type="tel"]:focus,textarea:focus { border-color:#3971d2; box-shadow:0 0 0 3px rgba(57,113,210,.12); }
.choice-group { border-radius:12px; box-shadow:0 2px 4px rgba(0,0,0,.04); }
.choice { display:flex; align-items:flex-start; gap:12px; min-height:47px; margin:0; padding:11px 12px; border:1px solid var(--line); border-bottom-width:0; background:rgba(255,255,255,.8); font-size:16px; font-weight:400; line-height:24px; cursor:pointer; transition:background .18s,border-color .18s; }
.choice:first-child { border-radius:12px 12px 0 0; }
.choice:last-child { border-bottom-width:1px; border-radius:0 0 12px 12px; }
.choice:only-child { border-radius:12px; }
.choice:has(input:checked) { background:rgba(10,59,150,.08); border-color:#3971d2; }
.choice:has(input:checked) + .choice { border-top-color:#3971d2; }
.choice input { appearance:none; flex:0 0 24px; width:24px; height:24px; margin:0; border:1px solid rgba(0,0,0,.3); background:rgba(255,255,255,.8); cursor:pointer; position:relative; outline-offset:3px; }
.choice input[type="checkbox"] { border-radius:6px; }
.choice input[type="radio"] { border-radius:50%; }
.field[data-field="aware"] .choice input[type="radio"] { border-radius:6px; }
.consent-field .choice input[type="checkbox"] { border-radius:50%; }
.choice input:checked { border-color:var(--blue); background:var(--blue); }
.choice input[type="checkbox"]:checked::after { content:""; position:absolute; left:7px; top:3px; width:6px; height:11px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); }
.choice input[type="radio"]:checked::after { content:""; position:absolute; inset:5px; border-radius:50%; background:#fff; }
.field[data-field="aware"] .choice input[type="radio"]:checked::after { left:7px; top:3px; width:6px; height:11px; border:solid #fff; border-width:0 2px 2px 0; border-radius:0; background:transparent; transform:rotate(45deg); }
.choice span { flex:1; line-height:24px; }
.field-help { color:rgba(0,0,0,.5); font-size:16px; margin:-4px 13px 8px; line-height:24px; }
.error { display:none; color:var(--danger); margin:7px 0 0; font-size:13px; line-height:1.4; }
.field.invalid .error { display:block; }
.field.invalid input[type="text"],.field.invalid input[type="tel"] { border-color:var(--danger); }
.recent { margin:0 0 40px; }
.recent-title { text-align:center; font-size:16px; color:#000; font-weight:600; line-height:24px; margin-bottom:8px; }
.ticker-frame { padding:24px; border:1px solid var(--line); border-radius:12px; box-shadow:0 2px 4px rgba(0,0,0,.04); }
.ticker-window { overflow:hidden; position:relative; max-width:420px; height:168px; margin:0 auto; }
.ticker { display:flex; flex-direction:column; width:100%; animation:ticker 15s linear infinite; font-size:16px; color:#000; line-height:24px; }
.ticker span { display:grid; grid-template-columns:1fr 1fr 1fr; flex:none; height:36px; padding-bottom:12px; }
.ticker b { font-weight:400; text-align:center; white-space:nowrap; }
.ticker b:first-child { text-align:left; }
.ticker b:last-child { text-align:right; }
@keyframes ticker { to { transform:translateY(-50%); } }
.form-message { text-align:center; color:var(--danger); font-size:14px; margin:0 0 8px; }
.form-message:empty { display:none; }
.submit-btn { display:block; width:auto; min-width:112px; min-height:46px; margin:0 auto; padding:11px 40px; border:0; border-radius:12px; background:#f9fcfe; color:#000; box-shadow:0 2px 4px rgba(0,0,0,.04); font-weight:600; cursor:pointer; transition:background .18s,transform .05s; }
.submit-btn:hover { background:#e9f2fb; }
.submit-btn:active { transform:translateY(1px); }
.submit-btn:disabled { opacity:.58; cursor:wait; }
.form-extra { display:flex; justify-content:flex-end; margin-top:8px; line-height:24px; }
.text-button { padding:0; border:0; background:none; color:rgba(0,0,0,.5); font:inherit; cursor:pointer; }
.page-footer { display:flex; flex-direction:column; align-items:center; gap:8px; padding:0 16px; margin:32px 0 20px; text-align:center; color:rgba(0,0,0,.5); font-size:14px; line-height:21px; }
.privacy-link { color:#1677ff; }
.footer-brand { display:flex; align-items:center; gap:4px; }
.footer-brand svg { width:14px; height:14px; }
.share-card { position:absolute; top:0; left:calc(100% + 32px); width:144px; padding:12px 12px 14px; border-radius:6px; background:#fff; box-shadow:0 2px 4px #0002; font-size:14px; line-height:21px; text-align:center; }
.share-card img { display:block; width:120px; height:120px; margin-bottom:12px; }
.info-dialog { width:min(480px,calc(100% - 32px)); max-height:80vh; padding:24px; border:0; border-radius:16px; color:#000; box-shadow:0 12px 48px #0003; }
.info-dialog::backdrop { background:#0006; }
.info-dialog h2 { margin:0 0 16px; font-size:22px; }
.info-dialog p { margin:0 0 16px; line-height:1.7; }
.dialog-close { display:block; margin-left:auto; border:0; border-radius:8px; padding:8px 24px; background:#f4f7fb; color:#000; cursor:pointer; }
.success-layer { position:fixed; inset:0; z-index:20; display:grid; place-items:center; padding:24px; background:rgba(6,18,45,.55); }
.success-layer[hidden] { display:none; }
.success-card { width:min(360px,100%); padding:30px 25px 24px; border-radius:18px; background:#fff; text-align:center; box-shadow:0 22px 60px rgba(0,0,0,.24); }
.success-icon { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 13px; border-radius:50%; color:#fff; background:#1da36c; font-size:33px; }
.success-card h2 { margin:0 0 8px; font-size:23px; }
.success-card p { margin:0 0 22px; color:#656a73; font-size:14px; }
.success-copy { display:flex; flex-direction:column; gap:4px; line-height:1.6; }
.success-card button { min-width:140px; padding:10px 20px; border:0; border-radius:10px; color:#fff; background:var(--blue); cursor:pointer; }

@media (max-width:1099px) {
  .share-card { display:none; }
}
@media (max-width:575.99px) {
  .form-shell { width:100%; max-width:none; margin:0; }
  .hero { top:0; border-radius:0; }
  .submit-btn { width:100%; padding-left:8px; padding-right:8px; }
  .form-extra { margin-top:16px; }
  .page-footer { margin:16px 0; }
}
@media (max-width:429px) {
  .form-card { padding-left:16px; padding-right:16px; padding-bottom:16px; }
}
