/* Shared MPFIT article typography; generated by docs/site-migration-guides-20261029/generate.py. */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

:root {
  --bg: #0f1117;
  --bg2: #151822;
  --card: #1a1d27;
  --card2: #22263a;
  --border: #2a2e3d;
  --text: #e2e8f0;
  --text2: #94a3b8;
  --accent: #6366f1;
  --accent2: #818cf8;
  --green: #22c55e;
  --purple: #a855f7;
  --muted: #737d93;
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
}

.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  background: rgba(15, 17, 23, 0.85);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(42, 46, 61, 0.5);
  padding: 0 24px;
}
.header-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between; height: 60px;
}
.header-logo {
  font-size: 20px; font-weight: 900; letter-spacing: 3px;
  background: linear-gradient(135deg, var(--accent), var(--purple));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  text-decoration: none;
}
.header-cta {
  display: inline-block;
  background: linear-gradient(135deg, var(--accent), var(--purple));
  color: white; font-size: 13px; font-weight: 600; padding: 8px 20px;
  border-radius: 8px; text-decoration: none; transition: transform 0.2s, box-shadow 0.2s;
}
.header-cta:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(99,102,241,0.4); }

.breadcrumb {
  padding: 80px 24px 0; max-width: 1200px; margin: 0 auto;
}
.breadcrumb a { color: var(--muted); text-decoration: none; font-size: 14px; }
.breadcrumb a:hover { color: var(--accent2); }
.breadcrumb span { color: var(--muted); font-size: 14px; margin: 0 8px; }
.breadcrumb .current { color: var(--text2); font-size: 14px; }

.article-layout {
  max-width: 1200px; margin: 0 auto; padding: 32px 24px 80px;
  display: grid; grid-template-columns: 1fr 300px; gap: 48px;
}

.article-header { margin-bottom: 40px; }
.article-meta { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.article-category {
  display: inline-block; padding: 4px 12px; border-radius: 6px;
  font-size: 12px; font-weight: 600; background: rgba(99,102,241,0.12); color: var(--accent2);
}
.article-date, .article-readtime { font-size: 13px; color: var(--muted); }
.article-header h1 {
  font-size: 40px; font-weight: 800; line-height: 1.25;
  background: linear-gradient(135deg, #e2e8f0 0%, #94a3b8 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}

.article-body { max-width: 740px; line-height: 1.8; font-size: 17px; color: var(--text); }
.article-body h2 { font-size: 28px; font-weight: 700; margin: 40px 0 16px; color: #fff; }
.article-body h3 { font-size: 22px; font-weight: 600; margin: 32px 0 12px; color: #fff; }
.article-body p { margin-bottom: 16px; }
.article-body ul, .article-body ol { margin: 16px 0; padding-left: 24px; }
.article-body li { margin-bottom: 8px; }
.article-body strong { color: #fff; }
.article-body blockquote {
  border-left: 3px solid var(--accent); padding: 16px 20px; margin: 24px 0;
  background: rgba(99,102,241,0.06); border-radius: 0 8px 8px 0;
  color: var(--text2); font-style: italic;
}

.article-cta {
  background: linear-gradient(135deg, rgba(99,102,241,0.15), rgba(168,85,247,0.1));
  border: 1px solid var(--accent); border-radius: 16px; padding: 40px;
  text-align: center; margin-top: 48px;
}
.article-cta h3 { font-size: 24px; font-weight: 700; color: var(--text); margin: 0 0 12px; }
.article-cta p { color: var(--text2); margin-bottom: 24px; }
.cta-btn {
  display: inline-block;
  background: linear-gradient(135deg, var(--accent), var(--purple));
  color: white; font-size: 16px; font-weight: 600; padding: 14px 40px;
  border-radius: 10px; text-decoration: none; transition: transform 0.2s, box-shadow 0.2s;
}
.cta-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(99,102,241,0.4); }

.article-sidebar { position: sticky; top: 140px; align-self: start; }
.sidebar-toc {
  background: var(--card); border: 1px solid var(--border); border-radius: 12px;
  padding: 24px; margin-bottom: 24px;
}
.sidebar-toc h4 { font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 16px; text-transform: uppercase; letter-spacing: 1px; }
.sidebar-toc ul { list-style: none; }
.sidebar-toc li { margin-bottom: 10px; }
.sidebar-toc a { font-size: 14px; color: var(--text2); text-decoration: none; transition: color 0.2s; line-height: 1.4; display: block; }
.sidebar-toc a:hover { color: var(--accent2); }
.sidebar-cta {
  background: linear-gradient(135deg, rgba(99,102,241,0.12), rgba(168,85,247,0.08));
  border: 1px solid var(--accent); border-radius: 12px; padding: 24px; text-align: center;
}
.sidebar-cta h4 { font-size: 16px; font-weight: 700; color: var(--text); margin-bottom: 8px; }
.sidebar-cta p { font-size: 13px; color: var(--text2); margin-bottom: 16px; line-height: 1.5; }
.sidebar-cta .cta-btn-sm {
  display: inline-block; background: linear-gradient(135deg, var(--accent), var(--purple));
  color: white; font-size: 13px; font-weight: 600; padding: 10px 24px;
  border-radius: 8px; text-decoration: none; transition: transform 0.2s;
}
.sidebar-cta .cta-btn-sm:hover { transform: translateY(-1px); }

.related-section { max-width: 1200px; margin: 0 auto; padding: 0 24px 80px; }
.related-section h3 { font-size: 28px; font-weight: 700; color: var(--text); margin-bottom: 28px; }
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.related-card {
  background: var(--card); border: 1px solid var(--border); border-radius: 12px;
  padding: 24px; transition: transform 0.2s, border-color 0.2s;
}
.related-card:hover { transform: translateY(-3px); border-color: var(--accent); }
.related-card .rc-category {
  display: inline-block; padding: 3px 10px; border-radius: 5px;
  font-size: 11px; font-weight: 600; background: rgba(99,102,241,0.12); color: var(--accent2); margin-bottom: 12px;
}
.related-card h4 { font-size: 16px; font-weight: 600; line-height: 1.4; margin-bottom: 12px; }
.related-card h4 a { color: var(--text); text-decoration: none; }
.related-card h4 a:hover { color: var(--accent2); }
.related-card .rc-date { font-size: 12px; color: var(--muted); }


@media (max-width: 900px) {
  .article-layout { grid-template-columns: 1fr; }
  .article-sidebar { display: none; }
  .article-header h1 { font-size: 28px; }
  .related-grid { grid-template-columns: 1fr; }
}

:root { --muted: #94a3b8; }
.header-inner { height: auto; min-height: 60px; padding: 12px 0; }
.site-header .header-brand { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.site-header .header-nav { display: flex; gap: 12px 18px; flex-wrap: wrap; align-items: center; }
.breadcrumb { padding-top: 110px; }
.article-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 48px; }
.article-body a { color: var(--accent2); text-underline-offset: 3px; }
a:focus-visible, summary:focus-visible { outline: 3px solid var(--accent2); outline-offset: 4px; border-radius: 3px; }
.article-body [id] { scroll-margin-top: 110px; }
.article-lead { font-size: inherit; }
.takeaway { padding: 22px 24px; margin: 24px 0; border: 1px solid var(--border); border-left: 3px solid var(--accent2); border-radius: 0 12px 12px 0; background: var(--card); }
.takeaway p { margin: 10px 0 0; }
.process-list li { padding-left: 4px; margin-bottom: 16px; }
.calculation-table { border-collapse: collapse; width: 100%; margin: 24px 0; font-size: 15px; }
.calculation-table caption { text-align: left; color: var(--text2); margin-bottom: 12px; }
.calculation-table th, .calculation-table td { padding: 14px 12px; border-bottom: 1px solid var(--border); text-align: left; }
.calculation-table thead, .calculation-table tfoot { background: var(--card); }
.calculation-table tbody th { font-weight: 500; }
.calculation-table td:last-child { white-space: nowrap; text-align: right; font-variant-numeric: tabular-nums; }
.balance-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 24px 0; }
.balance-card { padding: 20px; background: var(--card); border: 1px solid var(--border); border-radius: 12px; }
.article-body .balance-card h3 { margin: 0 0 16px; font-size: 18px; }
.balance-card dl { display: grid; grid-template-columns: 1fr auto; gap: 8px; font-size: 15px; }
.balance-card dt { color: var(--text2); }
.balance-card dd { text-align: right; font-weight: 600; }
.balance-card p { margin: 16px 0 0; font-size: 14px; color: var(--text2); }
.mobile-toc { display: none; }
.related-section h2 { font-size: 28px; margin-bottom: 28px; }
.article-cta h2 { font-size: 24px; margin-bottom: 12px; }
@media (max-width: 1100px) { .breadcrumb { padding-top: 140px; } .article-body [id] { scroll-margin-top: 140px; } }
@media (max-width: 900px) {
  .article-layout { grid-template-columns: minmax(0, 1fr); }
  .mobile-toc { display: block; padding: 18px 20px; border: 1px solid var(--border); border-radius: 12px; margin-bottom: 28px; background: var(--card); }
  .mobile-toc summary { cursor: pointer; font-weight: 600; }
  .mobile-toc ul { padding-left: 20px; margin: 16px 0 0; }
  .mobile-toc li { margin-bottom: 8px; }
  .mobile-toc a { color: var(--accent2); font-size: 14px; }
}
@media (max-width: 600px) {
  .site-header { padding: 0 20px; }
  .header-logo { font-size: 18px; letter-spacing: 2px; }
  .site-header .header-nav { gap: 8px 14px; }
  .header-cta { padding: 6px 12px; }
  .breadcrumb { padding: 185px 20px 0; }
  .article-layout { padding: 28px 20px 48px; }
  .article-header { margin-bottom: 28px; }
  .article-body { font-size: 16px; }
  .article-body h2 { font-size: 25px; line-height: 1.35; }
  .article-body [id] { scroll-margin-top: 185px; }
  .article-lead { font-size: inherit; }
  .takeaway { padding: 18px; }
  .balance-grid { grid-template-columns: minmax(0, 1fr); }
  .calculation-table { font-size: 13px; }
  .calculation-table th, .calculation-table td { padding: 12px 5px; }
  .article-cta { padding: 28px 20px; }
  .cta-btn { padding: 14px 20px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
.sidebar-toc { max-height: calc(100dvh - 170px); overflow-y: auto; }
.cta-actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.cta-btn.cta-telegram { background: #00875a; }
.article-body blockquote p:last-child { margin-bottom: 0; }


.article-main{min-width:0}.intro-action{margin:26px 0 34px}.article-body a.cta-btn{color:#fff}.cta-caption{font-size:14px;color:var(--text2);margin:12px 0 0!important}.table-scroll{overflow-x:auto;border:1px solid var(--border);border-radius:12px;margin:24px 0 8px}.transfer-table{width:100%;min-width:660px;border-collapse:collapse;font-size:15px;line-height:1.6}.transfer-table th,.transfer-table td{padding:16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--border)}.transfer-table thead{background:var(--card)}.transfer-table tbody th{width:23%;font-weight:600;color:var(--text)}.transfer-table tbody tr:last-child th,.transfer-table tbody tr:last-child td{border-bottom:0}.table-hint{font-size:13px;color:var(--text2)}.scope-list li{margin-bottom:18px}.article-body .article-cta h2{margin-top:0}.breadcrumb{line-height:1.8}.faq-item{border-bottom:1px solid var(--border);padding:16px 0}.faq-item summary{cursor:pointer;font-weight:600}.faq-item p{margin:12px 0 0}.article-body .intro-action .cta-btn{font-size:16px}@media(max-width:640px){.article-header h1{font-size:30px}.article-body h2{font-size:24px}.article-layout{padding-left:18px;padding-right:18px}.header-inner{gap:10px!important}.header-nav .header-cta{font-size:12px;padding:9px 12px}.cta-btn{padding:14px 24px}.article-cta{padding:28px 18px}}

.source-note,.cell-note{font-size:13px;color:var(--text2)}
.price-table caption{caption-side:top;text-align:left;padding:16px;background:var(--card);color:var(--text2)}
.price-table tbody th{width:32%}
.token-steps{padding-left:24px!important}.token-steps>li{margin-bottom:28px}
.token-figure{margin:16px 0 24px}.token-figure img{display:block;max-width:100%;height:auto;border:1px solid var(--border);border-radius:10px;background:#fff}.token-figure figcaption{margin-top:10px;font-size:13px;line-height:1.5;color:var(--text2)}.token-menu{max-width:280px}.token-company{max-width:460px}.token-form{max-width:474px}
.comparison-table tbody th{width:25%}.comparison-table td{width:37.5%}
@media(max-width:640px){.comparison-scroll{overflow:visible;border:0}.comparison-table{min-width:0;display:block}.comparison-table thead{display:none}.comparison-table tbody,.comparison-table tr,.comparison-table td,.comparison-table tbody th{display:block;width:100%}.comparison-table tr{margin-bottom:16px;border:1px solid var(--border);border-radius:12px;overflow:hidden}.comparison-table tbody th{background:var(--card);border:0}.comparison-table td{padding-top:12px}.comparison-table td::before{content:attr(data-label);display:block;font-size:12px;font-weight:700;color:var(--accent2);margin-bottom:6px}.comparison-table td:last-child{border-bottom:0}}

/* Components for the ten migration guides. Existing site chrome is preserved. */
.skip-link { position:fixed; z-index:3000; top:8px; left:12px; padding:10px 16px; background:#fff; color:#151822; border-radius:8px; transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
.article-main,.article-body,.migration-comparison-row { min-width:0; }
.migration-eyebrow { color:#a5b4fc; font-size:12px; font-weight:700; letter-spacing:.065em; text-transform:uppercase; margin-bottom:12px; }
.article-body p { overflow-wrap:break-word; }
.intro-action .cta-actions { justify-content:flex-start; }
.intro-action .cta-btn { padding:13px 22px; min-height:48px; }
.migration-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:28px 0 34px; }
.migration-benefit { border:1px solid var(--border); border-top:3px solid var(--accent2); border-radius:10px; padding:20px 17px; background:var(--card); }
.article-body .migration-benefit h3 { margin:0 0 12px; font-size:17px; }
.migration-benefit p { font-size:14px; color:var(--text2); margin:0; line-height:1.65; }
.migration-comparison { margin:24px 0; }
.migration-comparison-row { border:1px solid var(--border); border-radius:12px; overflow:hidden; margin:0 0 16px; }
.article-body .migration-comparison-row h3 { font-size:17px; margin:0; padding:15px 18px; background:var(--card); border-bottom:1px solid var(--border); }
.migration-comparison-cells { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.migration-comparison-cells>div { padding:18px; min-width:0; }
.migration-comparison-cells>div+div { border-left:1px solid var(--border); background:rgba(99,102,241,.045); }
.comparison-label { display:block; color:var(--accent2); font-weight:700; font-size:12px; letter-spacing:.035em; margin-bottom:8px; }
.migration-comparison-cells p { font-size:14px; line-height:1.65; margin:0 0 10px; }
.migration-comparison-cells p:last-child { margin-bottom:0; }
.comparison-check { color:var(--text2); }
.source-ref { font-size:12px; white-space:nowrap; }
.transfer-table caption { text-align:left; padding:14px 16px; color:var(--text2); background:var(--card); font-size:14px; }
.transfer-table tbody th { min-width:140px; }
.migration-focus { background:var(--editorial-paper,#fbf5e7); border:1px solid #d8cfe8; color:var(--editorial-ink,#282535); padding:28px; border-radius:12px 24px 12px 24px; margin:36px 0; }
.article-body .migration-focus h2 { margin:8px 0 18px; color:#282535; }
.migration-focus .migration-eyebrow { color:#66508e; }
.migration-focus p:last-child { margin-bottom:0; }
.article-body .migration-focus strong { color:#282535; }
.article-body .migration-steps { list-style:none; padding:0; margin:24px 0; }
.migration-steps li { display:grid; grid-template-columns:42px minmax(0,1fr); gap:16px; padding:20px 0; border-bottom:1px solid var(--border); }
.step-number { color:var(--accent2); font-size:23px; font-weight:800; }
.article-body .migration-steps h3 { margin:0 0 9px; }
.migration-steps p { color:var(--text2); margin:0; }
.migration-support { border:1px solid var(--accent); background:linear-gradient(135deg,rgba(99,102,241,.12),rgba(168,85,247,.06)); border-radius:16px; padding:26px; margin:30px 0; }
.article-body .migration-support h3 { margin:10px 0 16px; }
.migration-sources { margin-top:40px; padding-top:8px; border-top:1px solid var(--border); font-size:14px; color:var(--text2); }
.migration-sources li { overflow-wrap:anywhere; }
.source-date { font-size:12px; }
.sidebar-toc h2 { font-size:13px; letter-spacing:.06em; text-transform:uppercase; margin-bottom:18px; }
.sidebar-cta h3 { font-size:17px; margin:0 0 12px; }
.migration-directory { display:flex; flex-wrap:wrap; gap:10px; }
.migration-directory a,.migration-directory span { display:inline-flex; align-items:center; min-height:44px; padding:9px 16px; border:1px solid var(--border); border-radius:8px; background:var(--card); color:var(--text); text-decoration:none; font-size:14px; }
.migration-directory a:hover { border-color:var(--accent2); }
.migration-directory span { border-color:var(--accent2); color:var(--accent2); }
.migration-reading { display:flex; flex-wrap:wrap; gap:14px 28px; margin-top:24px; }
.migration-reading a { color:var(--text2); font-size:14px; }
.faq-item summary { min-height:44px; padding:8px 0; }
.faq-item p { padding-bottom:8px; }
@media(max-width:1100px) { .migration-benefits { grid-template-columns:1fr; } .migration-benefit { padding:18px 20px; } }
@media(max-width:600px) { .breadcrumb { padding-top:96px; } .article-body [id] { scroll-margin-top:90px; } .migration-comparison-cells { grid-template-columns:1fr; } .migration-comparison-cells>div+div { border-left:0; border-top:1px solid var(--border); } .migration-focus { padding:22px 18px; } .migration-support { padding:22px 18px; } .intro-action .cta-actions { display:grid; grid-template-columns:1fr; } .intro-action .cta-btn { text-align:center; width:100%; } .migration-steps li { grid-template-columns:33px minmax(0,1fr); gap:10px; } .migration-directory { gap:8px; } .migration-directory a,.migration-directory span { padding:9px 12px; } .article-layout { padding-bottom:44px; } }

@media(max-width:1080px) { .breadcrumb { padding-top:96px; } .article-body [id] { scroll-margin-top:90px; } .article-sidebar { top:100px; } }