/* Generated from frontend/styles/article.css; edit the source and rebuild. */
.time-ago-updated {
     display: inline-block;
     white-space: nowrap;
}
.article-social-follow {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 16px 0 24px;
    padding: 10px 14px;
    border: 1px solid var(--color-border);
    border-inline-start: 3px solid var(--color-primary);
    border-radius: 12px;
    background: var(--color-surface);
    break-inside: avoid;
}
.article-social-follow__label {
    margin-inline-end: auto;
    color: var(--color-text-muted);
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.4;
    white-space: nowrap;
}
.article-inline-also-read + .article-social-follow { margin-top: -8px; }
.article-social-follow__links {
    display: flex;
    gap: 8px;
    min-width: 0;
}
.article-body .article-social-follow__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 40px;
    padding: 0 12px;
    border: 1px solid color-mix(in srgb, var(--follow-color) 20%, var(--color-border));
    border-radius: 9px;
    background: color-mix(in srgb, var(--follow-color) 7%, var(--color-surface));
    color: var(--color-text);
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}
.article-social-follow__link--telegram { --follow-color: #229ed9; }
.article-social-follow__link--facebook { --follow-color: #1877f2; }
.article-social-follow__link--x { --follow-color: var(--color-text); }
.article-social-follow__link .author-social__svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    color: var(--follow-color);
}
.article-body .article-social-follow__link:hover {
    color: var(--color-text);
    border-color: var(--follow-color);
    background: color-mix(in srgb, var(--follow-color) 13%, var(--color-surface));
}
.article-social-follow__link:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 3px;
}
@media (max-width: 600px){
.article-social-follow {
        flex-direction: column;
        align-items: stretch;
        gap: 7px;
        padding: 10px;
    }
.article-social-follow__label { margin-inline-end: 0; }
.article-social-follow__links {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
    }
.article-body .article-social-follow__link { gap: 5px; padding: 0 5px; }
}
.latest-news-widget__list.is-loading .sidebar-list__item {
    border-bottom: 0;
    padding-bottom: 0;
}
.latest-news-widget__skeleton {
    display: block;
    height: 14px;
    width: 100%;
    border-radius: 4px;
    background: linear-gradient(
        100deg,
        color-mix(in srgb, #f6f8fb 86%, transparent) 0%,
        color-mix(in srgb, #edf1f7 90%, transparent) 40%,
        color-mix(in srgb, #f6f8fb 86%, transparent) 75%
    );
    background-size: 220% 100%;
    animation: latest-news-shimmer 1.35s ease-in-out infinite;
}
.latest-news-widget__status {
    margin: 0;
    color: var(--color-text-muted);
    font-size: 0.85rem;
    line-height: 1.45;
}
@media (prefers-reduced-motion: reduce){
.latest-news-widget__skeleton {
        animation: none;
    }
}
.site-text-ad { display:flex; align-items:center; justify-content:space-between; gap:24px; inline-size:100%; min-block-size:var(--article-ad-reserve-height,280px); box-sizing:border-box; padding:32px; border:1px solid var(--color-border); border-radius:14px; background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 6%,var(--color-surface)),var(--color-surface)); color:var(--color-text); text-align:start; direction:inherit; }
.site-text-ad__content { min-width:0; flex:1; }
.site-text-ad__title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:20px; line-height:1.5; overflow-wrap:anywhere; }
.site-text-ad__body,.article-body .site-text-ad__body { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; margin:8px 0 0; font-size:13px; line-height:1.7; color:var(--color-text-muted); text-align:start; overflow-wrap:anywhere; }
.site-text-ad__button,.article-body a.site-text-ad__button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; max-width:100%; padding:9px 18px; border-radius:8px; background:var(--color-primary); color:var(--color-on-primary,#fff); font-size:13px; font-weight:700; line-height:1.5; overflow-wrap:anywhere; text-decoration:none; }
.site-text-ad__button:hover,.article-body a.site-text-ad__button:hover { color:var(--color-on-primary,#fff); filter:brightness(.95); }
[data-theme="dark"] .site-text-ad__button,[data-theme="dark"] .article-body a.site-text-ad__button { color:var(--color-bg); }
.site-text-ad__button:focus-visible { outline:2px solid var(--color-primary); outline-offset:4px; }
[dir="rtl"] .site-text-ad { direction:rtl; }
@media (max-width:767px){
.site-text-ad { flex-direction:column; align-items:stretch; justify-content:center; gap:20px; padding:24px; }
.site-text-ad__content { flex:none; }
.site-text-ad__title { font-size:20px; }
.site-text-ad__button { align-self:flex-start; }
}
.ency-choices-dialog { box-sizing:border-box; width:min(540px, calc(100vw - 32px)); max-height:80vh; max-height:80dvh; padding:22px; border:1px solid var(--color-border, #dce1e7); border-radius:16px; background:var(--color-surface, #fff); color:var(--color-text, #172033); box-shadow:0 24px 70px rgba(0,0,0,.25); overflow:auto; }
.ency-choices-dialog::backdrop { background:rgba(0,0,0,.45); }
.ency-choices-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.ency-choices-heading h2 { margin:0; font-size:1.15rem; }
.ency-choices-close { flex-shrink:0; width:36px; height:36px; border:1px solid var(--color-border, #dce1e7); border-radius:50%; background:transparent; color:inherit; cursor:pointer; font-size:24px; }
.ency-choices-dialog > p { font-size:.9rem; line-height:1.7; }
.ency-choices-list { list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.ency-choices-option { display:grid; gap:5px; padding:14px; border:1px solid var(--color-border, #dce1e7); border-radius:10px; color:inherit; text-decoration:none; overflow-wrap:anywhere; font-size:.9rem; line-height:1.7; }
.ency-choices-option:hover, .ency-choices-option:focus-visible { border-color:var(--color-primary, #1769aa); outline:2px solid var(--color-primary, #1769aa); outline-offset:2px; }
.ency-choices-meta { opacity:.75; font-size:.8rem; }
.article-ad-sticky-dock__inner {
  inline-size: 100%;
  max-inline-size: 728px;
  margin-block: 0;
  margin-inline: auto;
  background: var(--color-surface);
  border-top: 1px solid var(--color-border);
  position: relative;
}
.article-ad-sticky-dock__slot {
  min-height: var(--article-ad-reserve-height, 280px);
}
.article-ad-sticky-dock .article-ad-sticky-dock__close {
  position: absolute;
  inset-inline-end: 8px;
  top: -52px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  margin: 0;
  border-radius: 50%;
  border: 1px solid var(--color-border, #dce1e7);
  background: var(--color-surface, #fff);
  color: var(--color-text, #172033);
  box-shadow: 0 3px 12px rgba(0, 0, 0, .14);
  cursor: pointer;
  line-height: 1;
}
.article-ad-sticky-dock__close svg {
  display: block;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  pointer-events: none;
}
.article-ad-sticky-dock__close:hover {
  border-color: var(--color-text-muted, #64748b);
  box-shadow: 0 4px 16px rgba(0, 0, 0, .2);
}
.article-ad-sticky-dock__close:focus-visible {
  outline: 2px solid var(--color-primary, #2563eb);
  outline-offset: 3px;
}
.article-ad-sticky-dock__close:active {
  transform: translateY(1px);
}
.article-reading .article-tail { display:block; margin:0; padding:22px var(--article-reading-inset) 26px; border-block-start:1px solid var(--color-border); background:transparent; box-shadow:none; }
.article-reading .article-comments { padding:20px 0 0; border-block-start:1px solid var(--color-border); background:transparent; box-shadow:none; }
.article-reading .article-comments__title { font-size:18px; font-weight:800; margin-block-end:12px; }
.article-reading .comments-empty { margin:0; padding:8px 0; font-size:13px; color:var(--color-text-muted); }
.article-reading .comment-form { margin-block-start:12px; }
.article-reading .comment-form__main { min-width:0; }
.article-reading .comment-form__textarea { min-height:76px; padding:12px 14px; border-radius:10px; font:inherit; font-size:13px; line-height:1.7; }
.article-reading .comment-form__actions { display:flex; justify-content:flex-end; margin-block-start:8px; }
.article-reading .comment-form__submit { margin:0; min-height:40px; padding:8px 20px; border-radius:8px; font:inherit; font-size:13px; font-weight:700; }
.article-reading .article-comments__login-hint,.article-reading .article-comments__closed-hint { margin:12px 0 0; font-size:13px; line-height:1.7; }
.article-feedback__heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.article-feedback h2 { margin:0; color:var(--color-text); font-size:19px; line-height:1.5; }
.article-feedback__hint { margin:5px 0 0; font-size:13px; line-height:1.7; color:var(--color-text-muted); }
.article-feedback__reactions { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; max-inline-size:560px; margin:16px 0 12px; }
.article-feedback__reaction { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:76px; min-width:0; padding:8px 4px; border:1px solid var(--color-border); border-radius:10px; background:var(--color-surface); color:var(--color-text); font:inherit; cursor:pointer; transition:border-color .18s,background .18s,transform .18s; }
.article-feedback__reaction:hover { border-color:var(--color-primary); background:color-mix(in srgb,var(--color-primary) 8%,var(--color-surface)); transform:translateY(-3px); }
.article-feedback__reaction.is-active { border-color:var(--color-primary); background:color-mix(in srgb,var(--color-primary) 14%,var(--color-surface)); box-shadow:inset 0 0 0 1px var(--color-primary); }
.article-feedback__emoji { font-family:system-ui; font-size:26px; line-height:1.2; }
.article-feedback__label { font-size:12px; font-weight:700; line-height:1.4; }
.article-feedback__count { color:var(--color-text-muted); font-size:11px; font-variant-numeric:tabular-nums; }
.article-feedback__footer { display:flex; justify-content:space-between; gap:10px; padding:0; }
.article-feedback__action { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:8px 12px; border:0; border-radius:8px; background:transparent; color:var(--color-primary); font:inherit; font-size:13px; font-weight:700; text-decoration:none; cursor:pointer; }
.article-feedback__action--report { color:var(--color-text-muted); }
.article-feedback__action:hover { background:color-mix(in srgb,var(--color-primary) 9%,transparent); color:var(--color-primary); }
.article-feedback__action svg { flex:none; }
.article-feedback__reaction:focus-visible,.article-feedback__action:focus-visible,.article-report button:focus-visible,.article-report input:focus-visible,.article-report textarea:focus-visible { outline:3px solid var(--color-primary); outline-offset:3px; }
.article-feedback__reactions[aria-busy=true] { opacity:.7; }
.article-feedback__reaction:disabled { cursor:wait; }
.article-report { width:min(520px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:26px; box-sizing:border-box; border:1px solid var(--color-border); border-radius:20px; background:var(--color-surface); color:var(--color-text); font:inherit; box-shadow:0 24px 80px #0004; overscroll-behavior:contain; }
.article-report::backdrop { background:#07142599; backdrop-filter:blur(3px); }
.article-report__header { display:flex; justify-content:space-between; align-items:center; margin-block-end:12px; }
.article-report__badge { display:grid; place-items:center; width:46px; height:46px; border-radius:14px; color:var(--color-primary); background:color-mix(in srgb,var(--color-primary) 12%,transparent); }
.article-report__close { margin-inline-start:auto; }
#article-report-title:focus { outline:none; }
.article-report h2 { margin:0 0 6px; font-size:22px; line-height:1.5; }
#article-report-intro { margin:0 0 12px; color:var(--color-text-muted); font-size:13px; line-height:1.8; }
.article-report__story { margin:0 0 18px; padding:10px 12px; border-inline-start:3px solid var(--color-primary); border-radius:6px; background:var(--color-surface-alt); font-size:13px; line-height:1.7; overflow-wrap:anywhere; }
.article-report__reasons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; min-width:0; padding:0; margin:0 0 18px; border:0; }
.article-report__reasons legend { margin-block-end:10px; padding:0; font-size:14px; font-weight:700; }
.article-report__reasons label { display:flex; align-items:center; gap:8px; padding:12px 10px; border:1px solid var(--color-border); border-radius:10px; font-size:13px; line-height:1.5; cursor:pointer; }
.article-report__reasons label:has(input:checked) { border-color:var(--color-primary); background:color-mix(in srgb,var(--color-primary) 10%,transparent); }
.article-report input[type=radio] { accent-color:var(--color-primary); flex:none; width:16px; height:16px; margin:0; }
.article-report__field { display:block; margin-block-end:14px; font-size:13px; font-weight:700; }
.article-report__field textarea,.article-report__field input { display:block; width:100%; box-sizing:border-box; margin-block-start:7px; padding:11px 12px; border:1px solid var(--color-border); border-radius:10px; background:var(--color-bg); color:var(--color-text); font:inherit; font-weight:400; font-size:14px; line-height:1.6; }
.article-report__field textarea { resize:vertical; min-height:90px; max-height:250px; }
.article-report__privacy { margin:0 0 16px; color:var(--color-text-muted); font-size:11px; line-height:1.8; }
.article-report__submit { display:block; width:100%; min-height:48px; border:0; border-radius:11px; background:var(--color-primary); color:#fff; font:inherit; font-size:14px; font-weight:700; cursor:pointer; }
.article-report__submit:disabled { opacity:.65; cursor:wait; }
[data-theme=dark] .article-report__submit { background:#2563eb; }
.article-report__error { padding:10px 12px; border-radius:8px; background:color-mix(in srgb,#dc2626 10%,var(--color-surface)); color:var(--color-text); font-size:13px; line-height:1.7; }
.article-report__success { padding-block:16px 0; text-align:center; }
.article-report__check { display:grid; place-items:center; margin:0 auto 12px; width:58px; height:58px; border-radius:50%; background:color-mix(in srgb,var(--color-primary) 12%,transparent); color:var(--color-primary); font-size:30px; }
.article-report__success p { color:var(--color-text-muted); font-size:14px; line-height:1.8; margin-block-end:24px; }
.article-report__trap { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.article-report__verification { min-height:65px; margin-block:12px; max-width:100%; }
.article-report__retry { display:block; margin:0 0 12px; min-height:44px; padding:8px 12px; border:1px solid var(--color-border); border-radius:8px; color:var(--color-primary); background:transparent; font:inherit; cursor:pointer; }
@media (max-width:480px){
.article-feedback__heading { align-items:flex-start; }
.article-feedback__reactions { gap:4px; }
.article-feedback__reaction { min-height:76px; padding:8px 2px; }
.article-feedback__emoji { font-size:24px; }
.article-feedback__label { font-size:10px; }
.article-feedback__footer { gap:4px; }
.article-feedback__action { padding:8px 4px; font-size:12px; gap:5px; }
.article-report { padding:20px 16px; }
.article-report__reasons { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce){
.article-feedback__reaction { transition:none; }
.article-feedback__reaction:hover { transform:none; }
}
.article-body__inner .video-embed{
    width: 100%;
    max-width: 100%;
    margin: 1.25rem 0;
}
.article-body__inner .video-embed-inner{
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: var(--radius-md);
    background: #000;
}
.article-body__inner .video-embed-inner iframe{
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}
@media (min-width: 768px){
html[dir="rtl"] .article-body__inner .image-style-side {
        float: left;
        clear: none;
        width: min(42%, 340px);
        margin: 0.35rem 1.25rem 1rem 0;
    }
.article-body__inner .image-style-align-center,
    .article-body__inner .aligncenter {
        float: none;
        margin-inline: auto;
    }
}
.article-body h2,
.article-body h3,
.article-body h4,
.article-body h5,
.article-body h6{
  margin: 1.6em 0 0.65em;
  line-height: 1.35;
  font-weight: 900;
  color: var(--color-text);
  background-color: var(--color-surface-alt); 
  scroll-margin-top: calc(var(--header-height-mobile) + 16px);
}
.article-body h2,
.article-body h3{
  position: relative;
  padding-inline-start: 12px; 
}
.article-body h2::before,
.article-body h3::before{
  content: "";
  position: absolute;
  top: 0.22em;                 
  bottom: 0.22em;              
  inset-inline-start: 0;       
  width: 3px;                  
  border-radius: 999px;
  background: var(--color-primary);
  opacity: 0.95;
}
.article-body h2,
.article-body h3{
  
  padding-inline-start: 20px;
}
.article-body h2{ font-size: clamp(1.30rem, 0.75vw + 1.05rem, 1.85rem); }
.article-body h3{ font-size: clamp(1.12rem, 0.55vw + 0.98rem, 1.42rem); }
.article-body h4{ font-size: 1.08rem; font-weight: 800; }
.article-body h5{ font-size: 1.00rem; font-weight: 800; opacity: 0.98; }
.article-body h6{ font-size: 0.95rem; font-weight: 800; opacity: 0.95; }
.article-body ul,
.article-body ol{
    margin: 0 0 1.1em;
    padding-inline-start: 1.25em;
}
.article-body ul{ list-style: disc; }
.article-body ol{ list-style: decimal; }
.article-body li{
    margin: 0.35em 0;
}
.article-body blockquote{
    line-height: var(--article-line);
}
.article-body figure.table,
.article-body .table {
    margin: var(--space-lg) 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background-color: var(--color-surface);
}
.article-body figure.table table,
.article-body .table table {
    display: table;
    width: 100%;
    min-width: 400px;
    border-collapse: collapse;
    font-size: 0.9rem;
    color: var(--color-text);
}
.article-body figure.table thead,
.article-body .table thead {
    display: table-header-group;
    background-color: var(--color-primary);
    color: #fff;
}
.article-body figure.table thead th,
.article-body .table thead th {
    display: table-cell;
    padding: 12px 14px;
    text-align: inherit;
    font-weight: 700;
    font-size: 0.85rem;
    white-space: nowrap;
    border: 1px solid rgba(255,255,255,0.2);
}
.article-body figure.table tbody,
.article-body .table tbody {
    display: table-row-group;
}
.article-body figure.table tbody tr,
.article-body .table tbody tr {
    display: table-row;
    background-color: var(--color-surface);
}
.article-body figure.table tbody tr:nth-child(even),
.article-body .table tbody tr:nth-child(even) {
    background-color: var(--color-surface-alt);
}
.article-body figure.table tbody tr:hover,
.article-body .table tbody tr:hover {
    background-color: var(--color-primary-soft);
}
.article-body figure.table tbody td,
.article-body .table tbody td {
    display: table-cell;
    padding: 10px 14px;
    border: 1px solid var(--color-border);
    vertical-align: middle;
}
.article-body figure.table caption,
.article-body .table caption {
    display: table-caption;
    caption-side: bottom;
    padding: 8px 14px;
    font-size: 0.8rem;
    color: var(--color-text-muted);
}
html[dir="rtl"] .article-body figure.table thead th,
html[dir="rtl"] .article-body .table thead th,
html[dir="rtl"] .article-body figure.table tbody td,
html[dir="rtl"] .article-body .table tbody td {
    text-align: right;
}
html[data-theme="dark"] .article-body figure.table,
html[data-theme="dark"] .article-body .table {
    border-color: var(--color-border);
    background-color: var(--color-surface);
}
html[data-theme="dark"] .article-body figure.table tbody tr:nth-child(even),
html[data-theme="dark"] .article-body .table tbody tr:nth-child(even) {
    background-color: var(--color-surface-alt);
}
.table-scroll-outer {
    position: relative;
}
html[dir="rtl"] .table-scroll-outer::after {
    background: linear-gradient(to right, var(--color-surface) 0%, transparent 100%);
}
html[dir="rtl"] .table-scroll-outer::before {
    background: linear-gradient(to left, var(--color-surface) 0%, transparent 100%);
}
.table-scroll-outer.tsh-scrolled::before    { opacity: 1; }
.table-swipe-hint::before {
    content: "⟷";
    font-size: 0.85em;
    opacity: 0.7;
}
.table-scroll-outer.tsh-nudge table {
    animation: tsh-nudge-ltr 0.55s cubic-bezier(.36,.07,.19,.97) 0.7s both;
}
html[dir="rtl"] .table-scroll-outer.tsh-nudge table {
    animation: tsh-nudge-rtl 0.55s cubic-bezier(.36,.07,.19,.97) 0.7s both;
}
@media (max-width: 767px){
.article-body figure.table,
    .article-body .table {
        margin-inline: calc(-1 * max(var(--space-md), env(safe-area-inset-left, 0px)));
        margin-inline-end: calc(-1 * max(var(--space-md), env(safe-area-inset-right, 0px)));
        border-radius: 0;
        border-inline: none;
    }
.article-body figure.table table,
    .article-body .table table {
        min-width: 520px;
        font-size: 0.85rem;
    }
.article-body figure.table thead th,
    .article-body .table thead th,
    .article-body figure.table tbody td,
    .article-body .table tbody td {
        padding: 10px 12px;
    }
}
.article-inline-media {
     margin: var(--space-lg) auto;
     max-width: 100%;
     border-radius: var(--radius-lg);
     overflow: hidden;
}
.article-inline-media__caption {
     padding: 6px 10px;
     font-size: 0.78rem;
     color: var(--color-text-muted);
     background-color: var(--color-surface-alt);
}
.article-inline-also-read {
     margin: var(--space-lg) 0;
     padding: var(--space-md) 0;
     border-top: 1px solid var(--color-border);
     border-bottom: 1px solid var(--color-border);
     background: transparent;
     break-inside: avoid;
     page-break-inside: avoid;
}
.article-inline-also-read__head {
     display: flex;
     align-items: center;
     gap: 10px;
     margin-bottom: 10px;
}
.article-inline-also-read__bar {
     display: inline-block;
     width: 5px;
     height: 22px;
     border-radius: 2px;
     background: var(--color-warning, #f59e0b);
     flex-shrink: 0;
}
.article-inline-also-read__label {
     font-size: 1rem;
     font-weight: 900;
     color: var(--color-primary);
     letter-spacing: 0.04em;
     text-transform: uppercase;
     line-height: 1;
}
:root[lang="ar"] .article-inline-also-read__label,
[dir="rtl"] .article-inline-also-read__label {
     text-transform: none;
     letter-spacing: 0;
}
.article-inline-also-read__list {
     list-style: disc;
     margin: 0;
     padding-inline-start: 22px;
}
.article-inline-also-read__item {
     margin: 6px 0;
     line-height: 1.55;
}
.article-inline-also-read__item::marker {
     color: var(--color-text-muted);
}
.article-body .article-inline-also-read__link,
.article-inline-also-read__link {
     color: var(--color-text);
     font-weight: 700;
     font-size: 0.98rem;
     text-decoration: none !important;
     transition: color 0.18s ease;
}
.article-body .article-inline-also-read__link:hover,
.article-body .article-inline-also-read__link:focus,
.article-inline-also-read__link:hover,
.article-inline-also-read__link:focus {
     color: var(--color-primary);
     text-decoration: none !important;
}
@media (max-width: 600px){
.article-inline-also-read {
          margin: var(--space-md) 0;
          padding: 14px 0;
     }
.article-inline-also-read__label { font-size: 0.92rem; }
.article-inline-also-read__link  { font-size: 0.93rem; }
.article-inline-also-read__list  { padding-inline-start: 20px; }
}
.article-related {
     margin-top: var(--space-xl);
}
.article-related--grid {
     margin-top: var(--space-lg);
     padding-top: var(--space-lg);
     border-top: 1px solid var(--color-border);
}
.article-related__head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: var(--space-md);
     margin-bottom: var(--space-md);
}
.article-section-title,
.article-related__title {
     margin: 0;
     font-size: 1.15rem;
     font-weight: 800;
     line-height: 1.3;
     color: var(--color-text);
     position: relative;
     padding-inline-start: 12px;
}
.article-related__title::before {
     content: "";
     position: absolute;
     inset-inline-start: 0;
     top: 50%;
     transform: translateY(-50%);
     width: 4px;
     height: 70%;
     border-radius: 4px;
     background: var(--color-primary);
}
.article-related-grid {
     display: grid;
     grid-template-columns: repeat(3, minmax(0, 1fr));
     gap: var(--space-md);
}
.related-card {
     position: relative;
     background-color: var(--color-surface);
     border-radius: var(--radius-lg);
     overflow: hidden;
     box-shadow: var(--shadow-sm);
     border: 1px solid var(--color-border);
     transition: transform 0.22s ease;
     min-width: 0;
}
.related-card:hover,
.related-card:focus-within {
     transform: translateY(-3px);
     box-shadow: var(--shadow-md);
     border-color: color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
}
.related-card__link {
     display: block;
     color: inherit;
     text-decoration: none;
}
.related-card__link:hover,
.related-card__link:focus {
     text-decoration: none;
     color: inherit;
}
.related-card__image {
     position: relative;
     aspect-ratio: 16 / 10;
     overflow: hidden;
     background: var(--color-surface-alt);
}
.related-card__image img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
     transition: transform 0.45s ease;
}
.related-card:hover .related-card__image img {
     transform: scale(1.06);
}
.related-card__image-placeholder {
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, var(--color-surface-alt), color-mix(in srgb, var(--color-primary) 8%, var(--color-surface-alt)));
}
.related-card__cat {
     position: absolute;
     top: 8px;
     inset-inline-start: 8px;
     z-index: 2;
     display: inline-block;
     padding: 4px 10px;
     border-radius: 999px;
     background: var(--color-primary);
     color: #fff;
     font-size: 0.7rem;
     font-weight: 800;
     line-height: 1.2;
     letter-spacing: 0.01em;
     box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
     max-width: calc(100% - 16px);
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
}
.related-card__body {
     padding: 12px 14px 14px;
}
.related-card__title {
     font-size: 0.95rem;
     line-height: 1.45;
     font-weight: 700;
     margin: 0;
     color: var(--color-text);
     display: -webkit-box;
     -webkit-line-clamp: 3;
     line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
     transition: color 0.18s ease;
}
.related-card:hover .related-card__title {
     color: var(--color-primary);
}
@media (max-width: 1023px){
.article-related-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr));
          gap: var(--space-md);
     }
.related-card__title {
          font-size: 0.92rem;
          -webkit-line-clamp: 3;
          line-clamp: 3;
     }
}
@media (max-width: 600px){
.article-related--grid {
          padding-top: var(--space-md);
     }
.article-related-grid {
          grid-template-columns: 1fr;
          gap: var(--space-sm);
     }
.related-card {
          border-radius: var(--radius-md);
     }
.related-card__link {
          display: grid;
          grid-template-columns: 120px 1fr;
          align-items: stretch;
          gap: 0;
     }
.related-card__image {
          aspect-ratio: auto;
          height: 100%;
          min-height: 88px;
     }
.related-card__cat {
          top: 6px;
          inset-inline-start: 6px;
          font-size: 0.62rem;
          padding: 3px 8px;
     }
.related-card__body {
          padding: 10px 12px;
          display: flex;
          align-items: center;
     }
.related-card__title {
          font-size: 0.88rem;
          -webkit-line-clamp: 3;
          line-clamp: 3;
          line-height: 1.4;
     }
.related-card:hover {
          transform: none;
     }
}
.comments-empty {
     margin: 0;
     padding: var(--space-md) 0;
     color: var(--color-text-muted);
     font-size: 0.95rem;
}
.article-interactions {
    background-color: var(--color-surface);
    box-shadow: var(--shadow-soft);
}
.article-interactions .article-engagement {
    box-shadow: none;
    background: transparent;
    border-bottom: 1px solid var(--color-border);
}
.article-interactions .article-comments {
    box-shadow: none;
    background: transparent;
}
.article-comments__title {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 var(--space-md);
}
.comments-load-more {
    margin-top: var(--space-md);
    border-radius: var(--radius-pill);
    border: 1px solid var(--color-border);
    padding: 6px 14px;
    font-size: 0.8rem;
    background-color: var(--color-surface-alt);
    color: var(--color-text);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.comments-load-more:hover {
    border-color: var(--color-primary);
}
.comment-form {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.75rem;
    margin-top: var(--space-md);
    align-items: start;
}
.comment-form__avatar {
    grid-column: 1;
    grid-row: 1 / -1;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-pill);
    background: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-surface);
    font-weight: 600;
    font-size: 0.9rem;
}
.comment-form__replying,
.comment-form__error,
.comment-form__textarea,
#comment-parent-id,
.comment-form__submit {
    grid-column: 2;
}
.comment-form__replying {
    font-size: 0.75rem;
    color: var(--color-text-muted);
    margin-bottom: 4px;
}
.comment-form__textarea {
    width: 100%;
    box-sizing: border-box;
    border-radius: 18px;
    border: 1px solid var(--color-border);
    padding: 8px 12px;
    resize: vertical;
    min-height: 40px;
    max-height: 140px;
    background-color: var(--color-surface-alt);
    color: var(--color-text);
    font-size: 0.85rem;
}
.comment-form__textarea::placeholder {
    color: var(--color-text-muted);
}
.comment-form__textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-primary) 60%, transparent);
}
.comment-form__submit {
    margin-top: 6px;
    justify-self: end;
    color: var(--color-surface);
    border: none;
    padding: 10px 24px;
    border-radius: var(--radius-md);
    font-weight: bold;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    background: var(--color-primary);
}
.comments-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.comments-list:empty {
    min-height: 64px; 
}
.comment {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
}
.comment__avatar {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-pill);
    background: var(--color-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-surface);
    font-weight: 600;
    font-size: 0.85rem;
    flex-shrink: 0;
}
.comment__body {
    flex: 1;
    min-width: 0;
}
.comment__header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 2px;
}
.comment__author {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--color-text);
}
.comment__time {
    font-size: 0.7rem;
    color: var(--color-text-muted);
}
.comment__text {
    display: inline-block;
    background-color: var(--color-surface-alt);
    border-radius: 14px;
    padding: 6px 10px;
    line-height: 1.5;
    font-size: 0.85rem;
    margin-bottom: 2px;
    max-width: 100%;
    word-wrap: break-word;
}
.comment__pending {
    margin-top: 2px;
    font-size: 0.7rem;
    color: var(--color-warning);
}
.comment__footer {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.75rem;
    margin-top: 2px;
}
.comment-action {
    border: none;
    background: none;
    padding: 0;
    font-size: 0.75rem;
    color: var(--color-text-muted);
    cursor: pointer;
}
.comment-action:hover {
    color: var(--color-primary);
}
.comment-action--react {
    padding: 0;
    min-width: 22px;
}
.comment-action__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    line-height: 1;
}
.comment-action--react.is-active .comment-action__icon {
    filter: saturate(1.1);
}
.comment__reactions {
    font-size: 0.75rem;
}
.comment__replies {
    margin-top: 4px;
    margin-inline-start: 28px;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.article-comments__login-hint {
    margin-top: var(--space-md);
    font-size: 0.85rem;
    color: var(--color-text-muted);
}
.article-comments__login-hint a {
    color: var(--color-primary);
    text-decoration: none;
}
.article-reactions__summary {
  font-size:13px;
  color: var(--color-text-muted);
}
.article-reactions__summary .reaction-summary{
  display:inline-flex;
  align-items:center;
  color: var(--color-text-muted);
  font-size:13px;
  line-height:1;
  direction: inherit;
}
.article-reactions__summary .reaction-icons{
  display:inline-flex;
  align-items:center;
  gap:0;
}
.article-reactions__summary .reaction-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  font-size:13px;
  line-height:1;
  border-radius:999px;
  background: var(--color-surface-alt);
  border: 1px solid var(--color-border);
  margin-inline-start:-4px;
}
.article-reactions__summary .reaction-icon:first-child{
  margin-inline-start:0;
}
.article-share-icons{
  display: flex;
  align-items: center;
  gap: 16px;          
  margin-top: 12px;   
}
.share-toast{
  min-width: 120px;
  max-width: 150px;
  height: 28px;
  box-sizing: border-box;
  flex-shrink: 0;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  color: var(--color-text);
  box-shadow: var(--shadow-soft);
}
.reaction-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  font-size: 0.75rem;
  line-height: 1.2;
  background-color: var(--color-surface-alt);
  border: 1px solid var(--color-border);
  color: var(--color-text);
}
@media (max-width: 767px){
.comment__footer{
    flex-wrap: wrap;
    gap: 12px;
    row-gap: 8px;
  }
.comment-action{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;      
    padding: 0 12px;       
    border-radius: 999px;
    line-height: 1;
    -webkit-tap-highlight-color: transparent;
  }
.comment-action--react{
    min-width: 42px;
    padding: 0 8px;
  }
.comment-action:active{
    background-color: color-mix(in srgb, var(--color-primary) 12%, transparent);
  }
.article-share-icons{
    gap: 14px;
  }
}
.comments-loading{margin-top:10px;font-size:14px;opacity:.75}
.comments-skel-wrap {
  height: calc(64px * var(--skel-count, 4) + 12px * (var(--skel-count, 4) - 1));
  background-image: linear-gradient(180deg, transparent 0, transparent 12px, rgba(0,0,0,.06) 12px, rgba(0,0,0,.12) 38px, rgba(0,0,0,.06) 76px);
  background-size: 100% 76px;
  background-repeat: repeat-y;
  border-radius: 14px;
  animation: commentsPulse 1.2s ease-in-out infinite;
  will-change: opacity;
}
html[data-theme="dark"] .comments-skel-wrap {
  background-image: linear-gradient(180deg, transparent 0, transparent 12px, rgba(255,255,255,.06) 12px, rgba(255,255,255,.12) 38px, rgba(255,255,255,.06) 76px);
}
@media (prefers-color-scheme: dark){
.comments-skel-wrap {
    background-image: linear-gradient(180deg, transparent 0, transparent 12px, rgba(255,255,255,.06) 12px, rgba(255,255,255,.12) 38px, rgba(255,255,255,.06) 76px);
  }
}
html[data-theme="dark"] .comments-skel{
  background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.12),rgba(255,255,255,.06))
}
.comment-star{
  margin-inline-start: 6px;
  font-size: 14px;
  line-height: 1;
  vertical-align: middle;
  opacity: .95;
}
.article-tail {
    display: contents;
}
.article-newsletter-subscribe.newsletter-widget {
    position: relative;
    overflow: hidden;
    margin: 0 0 var(--space-md);
    padding: 22px 20px 20px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    box-shadow: var(--shadow-soft);
}
.article-newsletter-subscribe.newsletter-widget::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--color-primary);
    border-start-start-radius: 16px;
    border-end-start-radius: 16px;
}
.article-newsletter-subscribe .newsletter-widget__form {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.article-newsletter-subscribe .newsletter-widget__input-group {
    position: relative;
    display: block;
    width: 100%;
}
.article-newsletter-subscribe .newsletter-widget__input-icon {
    position: absolute;
    inset-inline-start: 12px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-muted);
    pointer-events: none;
    z-index: 1;
}
.article-newsletter-subscribe .newsletter-widget__input-icon svg {
    width: 16px;
    height: 16px;
    display: block;
}
.article-newsletter-subscribe .newsletter-widget__input {
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: 44px;
    padding-inline-start: 38px;
    padding-inline-end: 14px;
    font-size: 0.9rem;
    color: var(--color-text);
    background: var(--color-surface-alt);
    border: 1px solid var(--color-border);
    border-radius: 10px;
    outline: none;
    transition: background-color 0.18s ease;
}
.article-newsletter-subscribe .newsletter-widget__input::placeholder {
    color: var(--color-text-muted);
    opacity: 0.75;
}
.article-newsletter-subscribe .newsletter-widget__input:hover {
    border-color: var(--color-border-strong);
}
.article-newsletter-subscribe .newsletter-widget__input:focus,
.article-newsletter-subscribe .newsletter-widget__input[aria-invalid="true"] {
    border-color: var(--color-primary);
    background: var(--color-surface);
    box-shadow: 0 0 0 3px var(--color-primary-soft);
}
.article-newsletter-subscribe .newsletter-widget__button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding-inline: 18px;
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--color-surface);
    background: var(--color-primary);
    border: 0;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: filter 0.15s ease, opacity 0.18s ease;
}
.article-newsletter-subscribe .newsletter-widget__button:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}
.article-newsletter-subscribe.is-loading .newsletter-widget__spinner {
    display: inline-block;
}
.article-newsletter-subscribe.is-loading .newsletter-widget__button-label {
    opacity: 0.6;
}
.article-newsletter-subscribe .newsletter-widget__privacy {
    margin: 10px 0 0;
    font-size: 0.72rem;
    color: var(--color-text-muted);
    opacity: 0.85;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.article-newsletter-subscribe .newsletter-widget__privacy svg {
    width: 12px;
    height: 12px;
}
.article-newsletter-subscribe .newsletter-widget__message.is-visible {
    display: block;
}
.article-newsletter-subscribe .newsletter-widget__message.is-success {
    background: var(--color-success-soft);
    color: var(--color-success);
    border: 1px solid var(--color-success);
}
.article-newsletter-subscribe .newsletter-widget__message.is-error {
    background: var(--color-danger-soft);
    color: var(--color-danger);
    border: 1px solid var(--color-danger);
}
.article-body .entry-content .article-newsletter-subscribe--inline {
    margin: var(--space-md) 0 0;
    padding: 16px 16px 15px;
    border-radius: var(--radius-md, 10px);
    box-shadow: 0 1px 0 color-mix(in srgb, var(--color-text) 6%, transparent), 0 8px 24px rgba(15, 23, 42, 0.06);
}
.article-body .entry-content .article-newsletter-subscribe--inline::before {
    width: 4px;
    border-radius: var(--radius-sm, 6px) 0 0 var(--radius-sm, 6px);
}
.article-newsletter-subscribe--inline .article-newsletter-subscribe__inline-head {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}
.article-newsletter-subscribe--inline .article-newsletter-subscribe__inline-icon {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--color-primary-soft);
    color: var(--color-primary);
}
.article-newsletter-subscribe--inline .article-newsletter-subscribe__inline-icon svg {
    width: 18px;
    height: 18px;
}
.article-newsletter-subscribe--inline .article-newsletter-subscribe__inline-title {
    margin: 0 0 2px;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.25;
    color: var(--color-text);
}
.article-newsletter-subscribe--inline .article-newsletter-subscribe__inline-lead {
    margin: 0;
    font-size: 0.82rem;
    line-height: 1.45;
    color: var(--color-text-muted);
}
.article-body .entry-content .article-inline-also-read + .article-newsletter-subscribe--inline {
    margin-top: var(--space-sm);
}
@media (min-width: 768px){
.article-newsletter-subscribe .newsletter-widget__form {
        flex-direction: row;
        align-items: center;
    }
.article-newsletter-subscribe .newsletter-widget__input-group {
        flex: 1 1 auto;
        min-width: 0;
    }
.article-newsletter-subscribe .newsletter-widget__button {
        flex: 0 0 auto;
    }
}
@media (max-width: 680px){
.article-newsletter-subscribe.newsletter-widget {
        border-radius: 0;
        margin-inline: calc(var(--space-md) * -1);
        padding-inline: var(--space-md);
    }
.article-body .entry-content .article-newsletter-subscribe--inline {
        margin-inline: 0;
        border-radius: var(--radius-md, 10px);
        padding-inline: 14px;
    }
}
[dir="rtl"] .article-engagement {
    flex-direction: row;
}
[dir="rtl"] .article-engagement__actions {
    order: 1;
}
[dir="rtl"] .article-engagement__left {
    order: 2;
}
.article-engagement__left {
    min-width: 0;
    flex: 1;
    min-height: 1.5em;
}
.engagement-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    min-height: 42px;
    padding: 8px 14px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--color-text);
    cursor: pointer;
    font: inherit;
    line-height: 1;
    transition: background-color .16s ease, color .16s ease;
}
.engagement-btn:hover {
    background: var(--color-surface-alt);
}
.engagement-btn + .engagement-btn {
    border-inline-start: 1px solid var(--color-border);
}
.engagement-btn.is-active {
    background: color-mix(in srgb, var(--color-primary) 10%, transparent);
    color: var(--color-primary);
}
.engagement-btn__emoji {
    inline-size: 18px;
    block-size: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    color: currentColor;
}
.engagement-btn__emoji svg {
    inline-size: 18px;
    block-size: 18px;
    display: block;
}
.engagement-btn--react,
.engagement-btn--comment {
    min-inline-size: 52px;
}
.engagement-btn__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-inline-size: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    line-height: 1;
    color: var(--color-text-muted);
    background: color-mix(in srgb, var(--color-surface-alt) 70%, transparent);
}
.engagement-btn.is-active .engagement-btn__count {
    color: var(--color-primary);
}
.engagement-popover--react {
    width: fit-content;
    left: 0;
    right: auto;
    max-inline-size: calc(100vw - 24px);
    border-radius: 999px;
}
.react-picker {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0;
}
.react-option:hover {
    transform: translateY(-2px) scale(1.08);
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.16));
}
.react-option:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--color-primary) 70%, transparent);
    outline-offset: 2px;
}
.engagement-login-hint {
    padding: 8px 10px;
    font-size: 0.95rem;
}
.engagement-login-hint a {
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 700;
}
.engagement-login-hint a:hover {
    text-decoration: underline;
}
.article-share-icons{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
}
.article-share-icons .share-toast{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-text);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}
.article-comments[data-comments-enabled="1"] {
  min-height: 160px;
}
.article-comments[data-comments-enabled="1"] .comments-list {
  min-height: 50px;
}
.comments-list{
  overflow-anchor: none;
}
.article-comments__title.comments-head{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.comments-head[data-loading="1"] .comments-head__loader{
  opacity: 1;
  visibility: visible;
}
.ld-dots{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ld-dots i{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: currentColor;
  opacity: .7;
  transform: translateY(0);
  animation: ldDot .7s infinite ease-in-out;
}
.ld-dots i:nth-child(2){ animation-delay: .12s; }
.ld-dots i:nth-child(3){ animation-delay: .24s; }
@media (prefers-reduced-motion: reduce){
.ld-dots i{ animation: none; }
}
.comment-form__error{
  display:block;
  margin:10px 0 0;
  padding:10px 12px;
  border-radius: var(--radius-md);
  font-size:14px;
  line-height:1.4;
  background: var(--color-danger-soft);
  border:1px solid var(--color-danger);
  color: var(--color-danger);
}
.article-body__inner .embed-card--x.js-tweet-card{
  
  position: relative;
  padding-inline-start: 12px;
  margin: 14px 0;
}
.article-body__inner .embed-card--x.js-tweet-card::before{
  content: "";
  position: absolute;
  inset-block: 4px;
  inset-inline-start: 0;
  width: 3px;
  border-radius: 999px;
  background: var(--color-primary);
  opacity: .85;
}
.article-body__inner .embed-card--x .embed-card-header{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;  
  padding: 0;
  border: 0;
  background: transparent;
  line-height: 1.25;
}
.article-body__inner .embed-card--x .embed-card-icon{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-surface-alt);
  border: 1px solid var(--color-border);
  font-weight: 800;
  font-size: 12px;
}
.article-body__inner .embed-card--x .embed-card-label{
  font-weight: 800;
  font-size: .95rem;
  color: var(--color-text);
}
.article-body__inner .embed-card--x .embed-card-body{
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;              
  line-height: 1.45;
}
.article-body__inner .embed-card--x .tweet-card-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;

  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: var(--color-primary-soft);
  color: var(--color-text);
  font-weight: 900;
  font-size: .95rem;
  cursor: pointer;

  transition: transform 120ms ease, background-color 120ms ease, border-color 120ms ease;
}
.article-body__inner .embed-card--x .tweet-card-btn:hover{
  border-color: var(--color-primary);
  background: color-mix(in srgb, var(--color-primary-soft) 70%, var(--color-surface) 30%);
  transform: translateY(-1px);
}
.article-body__inner .embed-card--x .tweet-card-btn:active{
  transform: translateY(0);
}
.article-body__inner .embed-card--x .embed-card-body .small{
  margin: 0;
  font-size: .9rem;
  color: var(--color-text-muted);
}
.article-body__inner .embed-card--x .embed-card-body .small a{
  color: var(--color-accent);
  font-weight: 800;
  text-decoration: none;
}
.article-body__inner .embed-card--x .embed-card-body .small a:hover{
  text-decoration: underline;
}
@media (max-width: 767px){
.article-inline-media {
      border-radius: 0;
      box-shadow: none;
      margin-inline: 0;
  }
.article-inline-media__caption {
      padding-inline: var(--space-md);
  }
}
#article-reactions-summary {
  display: block;
  height: 20px;
  line-height: 20px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 0;
}