/* ── demo additions (not part of the original theme) ── */
.demo-ribbon{position:sticky;top:0;z-index:99;background:#0E4976;color:#fff;text-align:center;font-size:14px;padding:7px 12px;direction:ltr}
.demo-ribbon a{color:#9fd1ff;text-decoration:underline}
.langbar{position:fixed;bottom:22px;left:22px;z-index:98;display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #d9d9d9;border-radius:999px;padding:7px 12px;box-shadow:0 8px 28px rgba(0,0,0,.16)}
.langbar-globe{display:flex;align-items:center;color:#0E4976}
.langbar-pill{padding:4px 11px;border-radius:999px;font-size:14.5px;color:#253650;text-decoration:none;white-space:nowrap}
.langbar-pill:hover{background:#eef3f8}
.langbar-pill.on{background:#0E4976;color:#fff}
@media (max-width:700px){.langbar{left:10px;right:10px;bottom:12px;overflow-x:auto;justify-content:flex-start}}
.writer_line .name{display:flex !important;flex-direction:column !important;line-height:1.35}
.left_side .side-card{margin-top:10px;border:1px solid #e3e3e3;border-radius:8px;overflow:hidden;background:#fff}
.left_side .side-card-pic{display:block;position:relative}
.left_side .side-card-pic img{display:block;width:100%;height:170px;object-fit:cover}
.left_side .side-card-tag{position:absolute;top:10px;inset-inline-start:10px;background:rgba(30,34,44,.85);color:#fff;font-size:13px;padding:3px 9px;border-radius:4px}
.left_side .side-card h3{font-size:17px;line-height:1.35;margin:0;padding:10px 12px 14px;color:#1c2430}
.left_side .side-card a{text-decoration:none}

/* ── "Listen to this article" player (sits where the original TTS widget lived) ── */
.tts-player{position:relative;z-index:6;display:flex;align-items:center;gap:12px;background:#f4f6f9;border:1px solid #dfe4ea;border-radius:10px;padding:10px 14px;margin:6px 0 14px;max-width:520px}
.tts-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;min-width:40px;border-radius:50%;border:none;background:#0E4976;color:#fff;cursor:pointer}
.tts-btn:hover{filter:brightness(1.15)}
.tts-meta{flex:1;min-width:0}
.tts-label{display:block;font-weight:600;color:#253650;font-size:14.5px;margin-bottom:6px}
.tts-track{height:5px;background:#dfe4ea;border-radius:5px;cursor:pointer;overflow:hidden}
.tts-progress{height:100%;width:0;background:#0E4976;border-radius:5px}
.tts-time{font-size:12.5px;color:#5c6675;font-variant-numeric:tabular-nums;white-space:nowrap}
/* RTL: contain the absolutely-positioned logo to the header (body.ltr provides
   this positioning context in LTR; mirror it for the RTL edition) */
#page[dir=rtl] .big_top_header{position:relative}