
#fitline-demo{color-scheme:light;--fl-bg:#ffffff;--fl-text:#171717;--fl-soft:#f5f5f5;--fl-muted:#666666;--fl-line:#e6e6e6;--fl-accent:#cd0039;--fl-radius:16px;max-width:580px;margin:auto;background:var(--fl-bg);color:var(--fl-text);font-family:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;border-radius:24px;overflow:hidden;font-size:15px;line-height:1.6}
#fitline-demo *{box-sizing:border-box}#fitline-demo header{display:flex;align-items:center;justify-content:space-between;padding:20px 26px;border-bottom:1px solid var(--fl-line)}#fitline-demo .brand{font-size:27px;font-weight:750;letter-spacing:-1px;font-style:italic}#fitline-demo .brand-dot{color:var(--fl-accent)}#fitline-demo .demo-tag{font-size:11px;color:var(--fl-muted);letter-spacing:1px}#fitline-demo main{padding:26px;min-height:450px}#fitline-demo h1{font-size:30px;line-height:1.35;letter-spacing:-.8px;margin:18px 0}#fitline-demo h2{font-size:24px;line-height:1.4;margin:22px 0 10px}#fitline-demo p{margin:0 0 20px}#fitline-demo .sub{color:var(--fl-muted);font-size:14px}#fitline-demo .eyebrow{color:var(--fl-accent);font-size:12px;font-weight:650;letter-spacing:2px}#fitline-demo .hero{text-align:center;padding-top:36px}#fitline-demo .hero h1 em{font-style:normal;color:var(--fl-accent)}#fitline-demo .motif{display:flex;align-items:center;justify-content:center;gap:12px;margin:28px 0}#fitline-demo .motif span{display:grid;place-items:center;width:64px;height:64px;border-radius:22px;background:var(--fl-soft);color:var(--fl-accent)}#fitline-demo .motif span:nth-child(2){width:82px;height:82px;background:var(--fl-accent);color:#fff}#fitline-demo .motif svg{width:28px;height:28px}#fitline-demo button{font:inherit;cursor:pointer}#fitline-demo .primary{width:100%;padding:16px;border:0;border-radius:var(--fl-radius);background:var(--fl-accent);color:#fff;font-weight:600;margin-top:22px}#fitline-demo .primary:disabled{opacity:.4;cursor:not-allowed}#fitline-demo .quiet{border:0;background:transparent;color:var(--fl-muted);padding:10px;min-height:44px}#fitline-demo .meta{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:var(--fl-muted)}#fitline-demo .track{height:4px;background:var(--fl-soft);border-radius:8px;overflow:hidden;margin:10px 0 24px}#fitline-demo .fill{height:100%;background:var(--fl-accent);transition:width .2s}#fitline-demo .options{display:grid;gap:10px;margin-top:22px}#fitline-demo .option{width:100%;min-height:58px;display:flex;align-items:center;text-align:left;gap:12px;padding:14px 16px;border:1px solid transparent;border-radius:var(--fl-radius);background:var(--fl-soft);color:var(--fl-text)}#fitline-demo .option[aria-pressed=true]{border-color:var(--fl-accent);background:color-mix(in srgb,var(--fl-accent) 10%,var(--fl-bg))}#fitline-demo .marker{width:21px;height:21px;flex-shrink:0;border:1px solid var(--fl-line);border-radius:50%;display:grid;place-items:center;font-size:13px}#fitline-demo .multi .marker{border-radius:6px}#fitline-demo .option[aria-pressed=true] .marker{background:var(--fl-accent);border-color:var(--fl-accent);color:white}#fitline-demo .note{background:var(--fl-soft);padding:20px;border-radius:var(--fl-radius);text-align:left;margin:22px 0}#fitline-demo .note p{margin:0}#fitline-demo .result-row{padding:14px 0;border-bottom:1px solid var(--fl-line)}#fitline-demo .result-row small{display:block;color:var(--fl-muted);margin-bottom:4px}#fitline-demo footer{text-align:center;font-size:11px;color:var(--fl-muted);padding:20px 24px;border-top:1px solid var(--fl-line)}#fitline-demo .error{color:var(--fl-accent);font-size:13px;min-height:22px;margin-top:10px}#fitline-demo .center{text-align:center}#fitline-demo .complete-icon{display:inline-grid;place-items:center;background:var(--fl-soft);color:var(--fl-accent);width:70px;height:70px;border-radius:50%;margin:12px 0}#fitline-demo .complete-icon svg{width:30px;height:30px}@media(max-width:380px){#fitline-demo main{padding:20px}#fitline-demo h1{font-size:27px}#fitline-demo header{padding:16px 20px}}
#fitline-demo a.primary{display:block;text-align:center;text-decoration:none}#fitline-demo .recipient{font-size:13px;color:var(--fl-muted);text-align:center;margin:16px 0 0}
#fitline-demo .brand-lockup{display:flex;align-items:center;gap:20px}#fitline-demo .fitline-logo{display:block;width:71px;height:56px;object-fit:contain}#fitline-demo .logo-divider{height:40px;width:1px;background:var(--fl-line)}#fitline-demo .pm-lockup{display:flex;align-items:center;gap:9px}#fitline-demo .pm-logo{display:block;width:46px;height:41px;object-fit:contain}#fitline-demo .pm-lockup span{font-size:12px;font-weight:600;color:#404040}#fitline-demo .demo-tag{text-align:right;letter-spacing:.5px}#fitline-demo .primary{border-radius:999px}#fitline-demo .hero{background:linear-gradient(180deg,#ffffff 45%,#fff5f7 100%)}#fitline-demo .option[aria-pressed=true]{background:#fff0f4}#fitline-demo .motif span{background:#fff0f4}#fitline-demo .motif span:nth-child(2){background:var(--fl-accent)}#fitline-demo .primary:hover{background:#ad0030}#fitline-demo .primary:disabled:hover{background:var(--fl-accent)}@media(max-width:420px){#fitline-demo .brand-lockup{gap:12px}#fitline-demo .pm-lockup{gap:6px;flex-direction:column}#fitline-demo .pm-lockup span{font-size:10px}#fitline-demo header{padding:16px 20px;gap:8px}}
html{color-scheme:light;background:#f4f4f4}body{margin:0;padding:32px 16px;color:#171717;background:#f4f4f4}#fitline-demo{box-shadow:0 12px 50px #00000008}#fitline-demo main{padding:28px;min-height:400px}#fitline-demo .hero{background:none;text-align:center;padding:12px 0}#fitline-demo h1,#fitline-demo h2{overflow-wrap:anywhere}#fitline-demo h1:focus,#fitline-demo h2:focus{outline:none}#fitline-demo button:focus-visible,#fitline-demo a:focus-visible,#fitline-demo input:focus-visible,#fitline-demo textarea:focus-visible,#fitline-demo summary:focus-visible{outline:3px solid #202020;outline-offset:4px}#fitline-demo .intro-facts{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:26px 0;font-size:13px;color:#666}#fitline-demo .intro-facts span{padding:6px 12px;background:#f5f5f5;border-radius:30px}#fitline-demo .advisor{display:flex;align-items:center;gap:14px;text-align:left;margin:26px 0;padding:18px;background:#fff4f6;border-radius:16px}#fitline-demo .advisor-mark{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;background:#cd0039;color:white;border-radius:50%;font-size:20px;font-weight:650}#fitline-demo .advisor small{display:block;font-size:12px;color:#666}#fitline-demo .advisor strong{display:block;font-size:16px}#fitline-demo .advisor div>span{display:block;font-size:14px;color:#666}#fitline-demo .name-field,#fitline-demo .other-field{text-align:left;margin-top:22px}#fitline-demo .name-field label,#fitline-demo .other-field label{display:block;font-weight:600;margin-bottom:8px}#fitline-demo label>span:not(:only-child){font-weight:400}#fitline-demo .name-field label span,#fitline-demo .other-field label span{font-size:12px;color:#777;margin-left:5px}#fitline-demo input[type=text],#fitline-demo textarea{width:100%;box-sizing:border-box;border:1px solid #d8d8d8;border-radius:12px;background:white;color:#171717;font:inherit;font-size:16px;padding:14px}#fitline-demo textarea{resize:vertical}#fitline-demo .field-hint,#fitline-demo .small-note{font-size:12px;line-height:1.75;color:#666;margin:10px 0 0}#fitline-demo .small-note{text-align:center}#fitline-demo fieldset{margin:0;padding:0;border:0;min-width:0}#fitline-demo .option{cursor:pointer}#fitline-demo .option input{margin:0;width:21px;height:21px;flex-shrink:0;accent-color:#cd0039}#fitline-demo .option:has(input:checked){border-color:#cd0039;background:#fff0f4}#fitline-demo .option:hover{background:#eee}#fitline-demo .option:has(input:checked):hover{background:#ffe8ef}#fitline-demo .primary{display:block;box-sizing:border-box;font-size:15px}#fitline-demo .result-row{display:flex;justify-content:space-between;gap:18px;align-items:center}#fitline-demo .result-row>div{min-width:0;overflow-wrap:anywhere}#fitline-demo .edit{flex-shrink:0;min-height:44px;background:transparent;border:0;color:#a9002f;font-size:13px;padding:8px}#fitline-demo .message-details{margin-top:20px;font-size:13px}#fitline-demo summary{cursor:pointer;min-height:44px;display:list-item;align-content:center}#fitline-demo pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:1.8;padding:16px;background:#f5f5f5;border-radius:12px}#fitline-demo footer p{margin:0 0 8px}#fitline-demo footer details{text-align:left;font-size:12px;line-height:1.8}#fitline-demo footer summary{text-align:center}#fitline-demo .no-script{padding:24px}#fitline-demo .error:empty{min-height:0;margin:0}#fitline-demo [hidden]{display:none!important}@media(max-width:600px){body{padding:0;background:white}#fitline-demo{border-radius:0;box-shadow:none;max-width:none}#fitline-demo main{padding:24px 20px}#fitline-demo header{padding:18px 20px}#fitline-demo .demo-tag{font-size:11px}#fitline-demo h1{font-size:28px}#fitline-demo h2{font-size:23px}}@media(prefers-reduced-motion:reduce){#fitline-demo *{transition:none!important;scroll-behavior:auto!important}}
