/* Public editorial pages; shares BloggerSL's existing palette and local Inter font. */
.bsl-article-body {
    --article-text: #e9e5f3;
    --article-muted: #b9b2cc;
    --article-link: #d2b5ff;
    --article-line: #33284c;
    margin: 0;
    color: var(--article-text);
    font-size: 16px;
    line-height: 1.75;
}
.bsl-article-body *, .bsl-article-body *::before, .bsl-article-body *::after { box-sizing: border-box; }
.bsl-article-body a { color: var(--article-link); text-underline-offset: .22em; }
.bsl-article-body a:hover { color: #fff; }
.bsl-article-body :focus-visible { outline: 3px solid #d8b4fe; outline-offset: 4px; border-radius: 3px; }
.bsl-article-body ::selection { background: #6d28d9; color: #fff; }
.bsl-skip-link { position: fixed; left: 16px; top: -100px; z-index: 110; padding: 10px 18px; background: #fff; color: #281349 !important; }
.bsl-skip-link:focus { top: 12px; }
.bsl-header-inner { max-width: 1248px; margin: 0 auto; padding: 10px 32px; display: flex; align-items: center; gap: 36px; }
.bsl-site-nav { display: flex; align-items: center; gap: 24px; }
.bsl-site-nav a, .bsl-header-login { display: inline-flex; min-height: 44px; align-items: center; font-size: 13px; font-weight: 650; text-decoration: none; }
.bsl-site-nav a { color: #cec5df; }
.bsl-header-login { margin-left: auto; padding: 7px 16px; border: 1px solid #69508f; border-radius: 12px; white-space: nowrap; color: #f3eaff !important; background: #211238; }
.bsl-header-login:hover { background: #352052; }
.bsl-article-main { max-width: 1200px; margin: 0 auto; padding: 0 32px 80px; }
.bsl-breadcrumbs { margin: 32px 0 40px; font-size: 13px; color: var(--article-muted); }
.bsl-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 8px 12px; list-style: none; margin: 0; padding: 0; }
.bsl-breadcrumbs li + li::before { content: "/"; margin-right: 12px; color: #89779f; }
.bsl-article-hero { padding: 0 0 48px; max-width: 960px; }
.bsl-article-hero h1 { margin: 0 0 22px; max-width: 950px; font-size: clamp(34px, 4.9vw, 62px); line-height: 1.08; letter-spacing: -.045em; font-weight: 800; text-wrap: balance; color: #fff; }
.bsl-article-lead { max-width: 760px; margin: 0; color: #d2cbdf; font-size: clamp(17px, 1.75vw, 20px); line-height: 1.7; }
.bsl-article-meta { margin: 22px 0 0; color: var(--article-muted); font-size: 13px; }
.bsl-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.bsl-article-body .bsl-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 10px 21px; border: 1px solid #b793eb; border-radius: 13px; background: #7841c5; color: #fff; font-size: 14px; font-weight: 750; text-decoration: none; line-height: 1.5; text-align: center; }
.bsl-article-body .bsl-button:hover { background: #8c50dd; }
.bsl-article-body .bsl-button-secondary { background: #1a122e; border-color: #524169; color: #e6d6fc; }
.bsl-article-body .bsl-button-secondary:hover { background: #2b1c43; }
.bsl-article-layout { display: grid; grid-template-columns: 205px minmax(0, 1fr); gap: 42px; padding-top: 36px; border-top: 1px solid var(--article-line); align-items: start; }
.bsl-article-toc { position: sticky; top: 100px; font-size: 13px; }
.bsl-article-toc p { margin: 0 0 12px; color: #fff; font-weight: 750; }
.bsl-article-toc ol { list-style: none; margin: 0; padding: 0; }
.bsl-article-toc a { display: block; padding: 8px 0; text-decoration: none; color: #c6bbd6; line-height: 1.6; }
.bsl-article-toc a:hover { text-decoration: underline; }
.bsl-article-content { min-width: 0; }
.bsl-article-content section { scroll-margin-top: 100px; }
.bsl-article-content section + section { margin-top: 48px; }
.bsl-article-content h2 { margin: 0 0 16px; color: #fff; font-size: clamp(25px, 2.5vw, 32px); font-weight: 750; line-height: 1.25; letter-spacing: -.025em; text-wrap: balance; }
.bsl-article-content h3 { margin: 28px 0 9px; color: #eee8f8; font-size: 19px; font-weight: 700; line-height: 1.4; }
.bsl-article-content p { margin: 0 0 18px; max-width: 75ch; }
.bsl-article-content ul { margin: 12px 0 22px; padding-left: 24px; }
.bsl-article-content li { padding-left: 3px; margin: 10px 0; }
.bsl-article-content li::marker { color: #c498f2; }
.bsl-table-hint { color: var(--article-muted); font-size: 13px; }
.bsl-table-wrap { width: 100%; margin: 18px 0; overflow-x: auto; border: 1px solid #514066; border-radius: 16px; background: rgba(12, 8, 29, .82); scrollbar-color: #8461a9 #1a112d; }
.bsl-comparison-table { width: 100%; min-width: 660px; border-collapse: collapse; font-size: 14px; line-height: 1.5; }
.bsl-comparison-table caption { padding: 17px 20px; text-align: left; color: #f1e8ff; font-weight: 750; background: #211331; }
.bsl-comparison-table th, .bsl-comparison-table td { padding: 17px 14px; text-align: left; vertical-align: top; border-top: 1px solid #332542; }
.bsl-comparison-table thead th { color: #bfb4d0; font-size: 12px; font-weight: 650; }
.bsl-comparison-table tbody th { min-width: 175px; color: #fff; font-weight: 700; }
.bsl-comparison-table td { font-variant-numeric: tabular-nums; }
.bsl-comparison-table .bsl-own-plan { background: rgba(119, 64, 178, .14); }
.bsl-table-brand { display: block; margin-bottom: 3px; color: #cbb0eb; font-size: 11px; font-weight: 550; }
.bsl-table-note { display: block; margin-top: 4px; color: #c4b7d4; font-size: 12px; }
.bsl-article-content .bsl-source-note { color: #bfb4cf; font-size: 13px; line-height: 1.75; }
.bsl-callout { border-left: 3px solid #ae78e6; padding: 20px 24px; margin: 24px 0; background: rgba(103, 55, 150, .14); border-radius: 0 14px 14px 0; }
.bsl-callout p:last-child { margin-bottom: 0; }
.bsl-article-content .bsl-checkpoint { color: #d1c5e0; font-size: 14px; padding-top: 12px; border-top: 1px solid #352746; }
.bsl-article-content .bsl-cta-panel { padding: 32px; border: 1px solid #6a448d; border-radius: 22px; background: #201132; }
.bsl-cta-panel .bsl-actions { margin-bottom: 0; }
.bsl-article-footer { border-top: 1px solid var(--article-line); color: var(--article-muted); font-size: 12px; }
.bsl-footer-inner { max-width: 1200px; margin: 0 auto; padding: 25px 32px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.bsl-footer-inner p { margin: 0; }
.bsl-footer-inner nav { display: flex; flex-wrap: wrap; gap: 10px 24px; }
.bsl-footer-inner a { display: inline-flex; min-height: 32px; align-items: center; }
@media (max-width: 960px) {
    .bsl-article-layout { grid-template-columns: 160px minmax(0, 1fr); gap: 28px; }
    .bsl-header-inner { gap: 24px; }
}
@media (max-width: 780px) {
    .bsl-article-layout { display: block; padding-top: 24px; }
    .bsl-article-toc { position: static; padding-bottom: 24px; margin-bottom: 32px; border-bottom: 1px solid var(--article-line); }
    .bsl-article-toc ol { display: flex; flex-wrap: wrap; gap: 3px 22px; }
    .bsl-article-toc a { padding: 5px 0; }
    .bsl-article-hero { padding-bottom: 32px; }
    .bsl-breadcrumbs { margin-bottom: 30px; }
    .bsl-footer-inner { display: block; }
    .bsl-footer-inner nav { margin-top: 14px; }
}
@media (max-width: 620px) {
    .bsl-header-inner { padding: 8px 20px 0; flex-wrap: wrap; gap: 0 16px; }
    .bsl-site-nav { width: 100%; order: 3; gap: 26px; }
    .bsl-site-nav a { min-height: 42px; font-size: 12px; }
    .bsl-header-login { padding: 6px 11px; font-size: 11px; }
    .bsl-article-main { padding: 0 20px 50px; }
    .bsl-breadcrumbs { margin-top: 24px; font-size: 12px; }
    .bsl-article-hero h1 { letter-spacing: -.035em; }
    .bsl-article-content section { scroll-margin-top: 124px; }
    .bsl-article-content section + section { margin-top: 38px; }
    .bsl-callout { padding: 18px; }
    .bsl-article-content .bsl-cta-panel { padding: 24px 20px; }
    .bsl-actions { gap: 10px; }
    .bsl-article-body .bsl-button { padding: 11px 16px; }
    .bsl-footer-inner { padding: 24px 20px; }
}
@media (prefers-reduced-motion: no-preference) { .bsl-article-body { scroll-behavior: smooth; } }
@media print {
    .bsl-article-body { color: #111; background: #fff !important; }
    .bsl-article-body::before, .bsl-article-body::after, .bsl-article-header, .bsl-article-toc, .bsl-article-footer, .bsl-actions { display: none !important; }
    .bsl-article-main { max-width: none; padding: 0; }
    .bsl-article-layout { display: block; }
    .bsl-article-body h1, .bsl-article-body h2, .bsl-article-body h3, .bsl-article-body p, .bsl-article-body a, .bsl-article-body th, .bsl-article-body td, .bsl-table-brand, .bsl-table-note { color: #111 !important; }
    .bsl-table-wrap { overflow: visible; }
    .bsl-comparison-table { min-width: 0; }
    .bsl-comparison-table caption, .bsl-comparison-table .bsl-own-plan, .bsl-callout, .bsl-article-content .bsl-cta-panel { background: #fff; color: #111; }
}

/* Original editorial artwork; text and actions stay selectable and accessible. */
.bsl-article-hero--visual{max-width:none;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:38px;align-items:center}
.bsl-article-hero-copy{min-width:0}
.bsl-article-hero--visual h1{font-size:clamp(32px,4.2vw,52px)}
.bsl-article-hero--visual .bsl-article-lead{font-size:18px;line-height:1.65}
.bsl-article-art{display:block;min-width:0;overflow:hidden;border-radius:20px;background:#100923;border:1px solid #533b69;box-shadow:0 18px 48px rgba(0,0,0,.2)}
.bsl-article-art img{display:block;width:100%;height:auto;aspect-ratio:3/2}
@media(max-width:780px){.bsl-article-hero--visual{display:flex;flex-direction:column;align-items:stretch;gap:28px}.bsl-article-art{width:100%;max-width:680px;align-self:center}.bsl-article-hero--visual h1{font-size:clamp(34px,6vw,48px)}}
@media print{.bsl-article-art{display:none}.bsl-article-hero--visual{display:block}}
