.vcard-page{color:#1b2639;background:#f5f2e9;min-height:100vh}.vcard-nav,.vcard-hero,.vcard-workspace,.vcard-notes,.vcard-footer{width:min(1080px,100% - 40px);margin:0 auto}.vcard-nav{border-bottom:1px solid #c9c4b7;justify-content:space-between;align-items:center;padding:24px 0;display:flex}.vcard-back,.vcard-notes a{color:#1c6c70;font-size:.88rem;font-weight:900}.vcard-hero{padding:80px 0 54px}.vcard-kicker{color:#1c6c70;font-family:var(--font-dm-mono), monospace;letter-spacing:.12em;text-transform:uppercase;margin:0 0 13px;font-size:.72rem;font-weight:700}.vcard-kicker:before{content:"";background:#dc7648;border-radius:50%;width:10px;height:10px;margin-right:10px;display:inline-block}.vcard-hero h1{letter-spacing:-.078em;max-width:850px;margin:0;font-size:clamp(3.1rem,7.2vw,6.6rem);line-height:.91}.vcard-hero>p:last-child{color:#596779;max-width:670px;margin:25px 0 0;font-size:1.06rem;line-height:1.72}.vcard-hero code,.vcard-notes code{color:#15575d;font-family:var(--font-dm-mono), monospace;background:#dce8e5;border-radius:4px;padding:2px 5px}.vcard-workspace{background:#fff;border:1px solid #1b2639;border-radius:18px;grid-template-columns:1.05fr .95fr;display:grid;overflow:hidden;box-shadow:11px 11px #dc7648}.vcard-inputs,.vcard-results{padding:38px}.vcard-inputs h2,.vcard-results h2{letter-spacing:-.065em;max-width:430px;margin:0;font-size:clamp(1.9rem,4vw,3.15rem);line-height:.98}.vcard-field{margin-top:23px;display:block}.vcard-field>span{justify-content:space-between;gap:12px;margin-bottom:8px;font-size:.83rem;font-weight:900;display:flex}.vcard-field em{color:#728084;font-size:.72rem;font-style:normal;font-weight:700}.vcard-field input,.vcard-field textarea{box-sizing:border-box;color:#1b2639;width:100%;font:500 .88rem var(--font-dm-mono), monospace;background:#fff;border:1px solid #c7c9c2;border-radius:8px;outline:0;padding:12px}.vcard-field textarea{resize:vertical;min-height:88px;line-height:1.55}.vcard-field input:focus,.vcard-field textarea:focus{border-color:#1c6c70;box-shadow:0 0 0 3px #1c6c7024}.vcard-two-columns{grid-template-columns:1fr 1fr;gap:12px;display:grid}.vcard-two-columns .vcard-field{margin-top:23px}.vcard-input-note,.vcard-warning{color:#596779;margin:18px 0 0;font-size:.78rem;line-height:1.58}.vcard-warning{color:#8e3a20;border-left:3px solid #bd532f;padding-left:10px}.vcard-results{color:#f6f2ea;background:#1b2639}.vcard-results .vcard-kicker{color:#8fd4d0}.vcard-result-note{color:#c6d1d9;margin:14px 0 17px;font-size:.82rem;line-height:1.58}.vcard-result-note code{color:#ffd5a1;font-family:var(--font-dm-mono), monospace}.vcard-results pre{color:#dcf2eb;min-height:285px;font:.71rem/1.58 var(--font-dm-mono), monospace;white-space:pre-wrap;background:#111a29;border-radius:9px;margin:0;padding:16px;overflow:auto}.vcard-download,.vcard-copy{box-sizing:border-box;cursor:pointer;border:0;border-radius:7px;width:100%;padding:14px;font:900 .84rem inherit}.vcard-download{color:#1b2639;background:#dc7648;margin-top:18px}.vcard-copy{color:#dcf2eb;background:0 0;outline:1px solid #72889a;margin-top:10px}.vcard-download:hover,.vcard-download:focus-visible{background:#f2a477}.vcard-copy:hover,.vcard-copy:focus-visible{background:#ffffff1a}.vcard-download:disabled,.vcard-copy:disabled{cursor:not-allowed;opacity:.45}.vcard-notes{grid-template-columns:.86fr 1.14fr;gap:90px;padding:90px 0;display:grid}.vcard-notes h2{letter-spacing:-.065em;margin:0;font-size:clamp(2rem,4vw,3.4rem);line-height:.98}.vcard-notes>div:last-child{color:#596779;line-height:1.74}.vcard-notes p{margin:0 0 18px}.vcard-notes a{text-underline-offset:3px;text-decoration:underline}.vcard-footer{color:#728084;border-top:1px solid #c9c4b7;gap:22px;padding:25px 0 35px;font-size:.78rem;display:flex}.vcard-footer span{margin-right:auto}.vcard-footer a{color:#596779}@media (width<=760px){.vcard-workspace,.vcard-notes{grid-template-columns:1fr}.vcard-inputs,.vcard-results{padding:28px}.vcard-notes{gap:32px;padding:58px 0}}@media (width<=540px){.vcard-nav,.vcard-hero,.vcard-workspace,.vcard-notes,.vcard-footer{width:min(100% - 28px,1080px)}.vcard-hero{padding-top:56px}.vcard-two-columns{grid-template-columns:1fr;gap:0}.vcard-footer{flex-wrap:wrap}.vcard-footer span{width:100%}.vcard-back{font-size:.78rem}}
