:root{--bg:#f7fafc;--card:#fff;--border:#e5e7eb;--muted:#6b7280;--teal:#07b6c8;--teal-600:#0894a8;--shadow:0 10px 24px rgba(0,0,0,.06)}*{box-sizing:border-box}body{margin:0;background:linear-gradient(180deg,var(--bg),#fff);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;color:#0f172a}.page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.card{width:min(100%,980px);background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:28px}.title{font-weight:800;font-size:32px;margin:0;text-align:center;color:#18a1b2}.subtitle{margin:8px 0 22px;text-align:center;color:var(--muted)}.grid{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}.plan{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:22px;position:relative;display:flex;flex-direction:column;align-items:center;min-height:360px}.plan h4{margin:0 0 2px;font-weight:800}.plan .sub{letter-spacing:.12em;color:var(--muted);font-size:12px;text-transform:uppercase}.hr{width:60%;height:1px;background:var(--border);margin:18px 0}.price{font-size:28px;font-weight:800;margin-bottom:4px}.permonth{color:var(--muted);font-size:12px;letter-spacing:.04em}.small{color:var(--muted);font-size:12px;text-align:center;margin-top:auto}.btn{margin-top:16px;border:none;border-radius:10px;padding:12px 18px;font-weight:800;cursor:pointer;transition:.15s}.btn-gray{background:#edf0f3;color:#6b7280;border:1px solid #dde2e7}.btn-teal{background:var(--teal);color:#fff}.btn-teal:hover{background:var(--teal-600)}.reco{position:absolute;top:-12px;left:50%;transform:translate(-50%);background:#0aa9bd;color:#fff;font-weight:900;border-radius:999px;padding:6px 14px;font-size:12px;box-shadow:0 6px 16px #0000001f}.recommended{background:#e6fbff;border-color:#baf3ff}.headerRow{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.right{display:flex;gap:8px;align-items:center}.muted{color:var(--muted);font-size:13px}.ghost{background:#fff;border:1px solid var(--border);border-radius:8px;padding:8px 10px;cursor:pointer}.success{background:#ecfeff;border:1px solid #bae6fd;padding:18px;border-radius:12px;text-align:center}.center{text-align:center}.input{width:100%;border:1px solid #d1d5db;border-radius:8px;padding:10px 12px;margin:8px 0}a{text-decoration:none}.overlay{position:fixed;inset:0;background:#00000073;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#fff;width:min(92vw,520px);border-radius:14px;box-shadow:0 20px 40px #00000040;padding:20px 22px}.modal h3{margin:0 0 8px}.modal p{margin:0 0 16px;color:#444}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}