.tbmag {
  --mag-ink: #1c213c;
  --mag-text: #43556a;
  --mag-blue: #21516d;
  --mag-line: #dbe4e8;
  --mag-paper: #f5f8f8;
  --mag-white: #fff;
  --mag-accent: #9b481c;
  --mag-accent-soft: #fff0e5;
  color: var(--mag-ink);
  text-align: start;
}
.tbmag-shell {
  container: magazine / inline-size;
  max-width: 1320px;
  margin-inline: auto;
  padding: 26px clamp(14px, 2vw, 30px) 64px;
}
.tbmag :where(.tbmag-shell,.tbmag-after) a {color: inherit; text-decoration: none;}
.tbmag.main.rtl :is(.tbmag-shell,.tbmag-after,.tbmag-taxonomy) a:is(:hover,:focus-visible) {text-decoration: none;}
.tbmag .tbmag-crumb a:hover {color: var(--mag-blue);}
.tbmag a:focus-visible, .tbmag button:focus-visible, .tbmag input:focus-visible {outline: 2px solid #2b8191; outline-offset: 4px;}
.tbmag-crumb {display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: .8rem; color: var(--mag-text); margin-bottom: 21px;}
.tbmag-crumb > * + *::before {content: '/'; margin-inline-end: 8px; color: #687d8d;}
.tbmag-masthead {display: grid; grid-template-columns: minmax(0,1fr) minmax(200px,310px); gap: 18px 24px; align-items: end; margin-bottom: 25px;}
.tbmag-masthead h1 {margin: 0; color: var(--mag-ink); font-size: clamp(1.65rem,3.3vw,3.45rem); line-height: 1.5; font-weight: 900; overflow-wrap: anywhere;}
.tbmag-masthead h1 span {color: var(--mag-blue);}
.tbmag-article .tbmag-taxonomy a {display: inline-block; padding: 4px 9px; margin: 3px; border: 1px solid var(--mag-line); border-radius: 7px; color: var(--mag-blue); font-size: .82rem;}
.tbmag.main.rtl .tbmag-masthead p {margin: 6px 0 0; color: var(--mag-text); font-size: .94rem; line-height: 1.9;}
.tbmag-search {display: flex; align-items: center; min-width: 0; padding: 4px; border: 1px solid var(--mag-line); border-radius: 12px; background: var(--mag-white);}
.tbmag-search input {width: 100%; min-width: 0; color: var(--mag-ink); font: inherit; font-size: .86rem; padding: 9px 10px; border: 0; background: transparent;}
.tbmag-search button {display: grid; flex: 0 0 43px; place-items: center; height: 42px; border: 0; border-radius: 8px; background: var(--mag-blue); color: white; cursor: pointer;}
.tbmag-search-icon {display: block; width: 15px; height: 15px; border: 2px solid; border-radius: 50%; position: relative;}
.tbmag-search-icon::after {content: ''; position: absolute; width: 7px; height: 2px; background: currentColor; bottom: -3px; left: -5px; transform: rotate(-45deg);}
.tbmag-visually-hidden {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;}
.tbmag-spotlight {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1.05fr);
  align-items: center;
  gap: clamp(20px,3cqi,40px);
  margin-bottom: 30px;
  padding: clamp(20px,3cqi,40px);
  border: 1px solid #e6ded9;
  border-radius: 22px;
  background: linear-gradient(120deg,#fff 36%,#fbf3ec);
}
.tbmag-spotlight-copy {min-width: 0;}
.tbmag-spotlight-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 10px;
  color: var(--mag-accent);
  background: var(--mag-accent-soft);
  border-radius: 6px;
  font-size: .8rem;
  font-weight: 750;
  line-height: 1.7;
}
.tbmag-spotlight-label::before {content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor;}
.tbmag .tbmag-spotlight h2 {
  color: var(--mag-ink);
  margin: 13px 0 0;
  font-size: clamp(1.26rem,3.15cqi,2.45rem);
  font-weight: 850;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.tbmag .tbmag-spotlight h2 a:hover {color: var(--mag-blue);}
.tbmag.main.rtl .tbmag-spotlight-copy p {
  color: var(--mag-text);
  margin: 9px 0 0;
  font-size: .93rem;
  line-height: 1.95;
}
.tbmag a.tbmag-spotlight-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 44px;
  margin-top: 18px;
  padding: 8px 14px;
  border-radius: 9px;
  color: #fff;
  background: var(--mag-ink);
  font-size: .88rem;
  font-weight: 750;
  line-height: 1.55;
  transition: background-color .16s ease;
}
.tbmag a.tbmag-spotlight-link:hover {background: var(--mag-blue);}
.tbmag-spotlight-link span {transition: transform .16s ease;}
.tbmag-spotlight-link:hover span {transform: translateX(-3px);}
.tbmag-spotlight-image {
  position: relative;
  display: block;
  min-width: 0;
  aspect-ratio: 16/10;
  overflow: hidden;
  border: 1px solid #ede4dd;
  border-radius: 13px;
  background: #fff;
}
.tbmag-spotlight-image img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;}
.tbmag-spotlight-image.tbmag-cover-unavailable {background: #f5eee8 url("../fa/app/assets/images/banner-lab.webp") center / cover no-repeat;}
.tbmag-cover-unavailable img {visibility: hidden;}
.tbmag-eyebrow {font-size: .77rem; font-weight: 700; line-height: 1.65;}
.tbmag a.tbmag-button {display: inline-flex; align-items: center; gap: 13px; border-radius: 9px; padding: 10px 15px; background: var(--mag-blue); color: white; font-size: .83rem; line-height: 1.5; font-weight: 700;}
.tbmag a.tbmag-button:hover {background: var(--mag-ink);}
.tbmag-topics h2, .tbmag-section-title h2, .tbmag-panel h2, .tbmag-after h2 {color: var(--mag-ink); margin: 0; font-size: 1.25rem; line-height: 1.55; font-weight: 800;}
.tbmag-topics ul, .tbmag-tags, .tbmag-picks {list-style: none; padding: 0; margin: 0;}
.tbmag-topics ul {display: grid; gap: 7px; margin-top: 10px;}
.tbmag-topics--archive {margin: 0 0 26px;}
.tbmag-topics--archive ul {grid-template-columns: repeat(auto-fit,minmax(min(100%,210px),1fr));}
.tbmag-topics a {
  display: flex;
  height: 100%;
  min-height: 40px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: center;
  align-items: baseline;
  gap: 2px 9px;
  padding: 7px 9px;
  border: 1px solid var(--mag-line);
  border-radius: 8px;
  background: var(--mag-paper);
  font-size: .83rem;
  font-weight: 700;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.tbmag-topics a:is(:hover,[aria-current]) {border-color: #aac0cd; background: #edf3f5; color: var(--mag-blue);}
.tbmag-topics small {font-size: .72rem; color: var(--mag-text); white-space: nowrap; font-weight: 400;}
.tbmag-content {display: grid; gap: 22px;}
.tbmag-content--home {grid-template-columns: minmax(0,1fr) clamp(184px,20cqi,225px);}
.tbmag-stream {min-width: 0;}
.tbmag-section-title {display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--mag-line); margin-bottom: 15px; padding-bottom: 9px;}
.tbmag-section-title > span {font-size: .78rem; color: var(--mag-text); white-space: nowrap;}
.tbmag-grid {display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px;}
.tbmag-content--home .tbmag-grid {grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(12px,1.6cqi,22px);}
.tbmag-card {min-width: 0; display: flex; flex-direction: column; border: 1px solid var(--mag-line); border-radius: 13px; overflow: hidden; background: var(--mag-white); transition: border-color .16s ease, box-shadow .16s ease;}
.tbmag-card:is(:hover,:focus-within) {border-color: #a6bac7; box-shadow: 0 5px 16px #182c430e;}
.tbmag-card-image {display: block; aspect-ratio: 16/9; background: #e4edf1; overflow: hidden;}
.tbmag-card-image img {display: block; width: 100%; height: 100%; object-fit: cover;}
.tbmag-card-image:is(.tbmag-card-image--fallback,.tbmag-cover-unavailable) {background: linear-gradient(145deg,#edf3f5,#d4e2e8); position: relative;}
.tbmag-card-image:is(.tbmag-card-image--fallback,.tbmag-cover-unavailable)::before, .tbmag-card-image:is(.tbmag-card-image--fallback,.tbmag-cover-unavailable)::after {content: ''; background: #f2f7f8; border-radius: 3px; position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%);}
.tbmag-card-image:is(.tbmag-card-image--fallback,.tbmag-cover-unavailable)::before {width: 54px; height: 12px;}
.tbmag-card-image:is(.tbmag-card-image--fallback,.tbmag-cover-unavailable)::after {width: 12px; height: 54px;}
.tbmag-card-body {display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: clamp(13px,1.75cqi,20px);}
.tbmag a.tbmag-card-topic {color: var(--mag-blue); margin-bottom: 7px;}
.tbmag-card h3 {margin: 0; font-size: clamp(.98rem,1.65cqi,1.13rem); line-height: 1.65; font-weight: 800; overflow-wrap: anywhere;}
.tbmag.main.rtl .tbmag-card p {color: var(--mag-text); font-size: .82rem; line-height: 1.9; margin: 8px 0 11px;}
.tbmag .tbmag-card h3 a:hover {color: var(--mag-blue);}
.tbmag-card-meta {width: 100%; display: flex; flex-wrap: wrap; gap: 3px 9px; padding-top: 9px; margin-top: auto; font-size: .73rem; color: var(--mag-text);}
.tbmag-card-meta span + span::before {content: '·'; margin-inline-end: 9px;}
.tbmag-sidebar {display: flex; flex-direction: column; gap: 12px; min-width: 0;}
.tbmag-panel {border: 1px solid var(--mag-line); border-radius: 12px; padding: 13px; background: var(--mag-white);}
.tbmag-panel h2 {font-size: 1rem;}
.tbmag-picks {margin-top: 6px;}
.tbmag-picks li + li {border-top: 1px solid var(--mag-line);}
.tbmag-picks a {display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 0; font-size: .85rem; font-weight: 700; line-height: 1.8; overflow-wrap: anywhere;}
.tbmag-picks a:hover {color: var(--mag-blue);}
.tbmag-tags {display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px;}
.tbmag-tags a {display: inline-flex; align-items: center; min-height: 31px; padding: 4px 8px; border: 1px solid var(--mag-line); border-radius: 7px; color: var(--mag-blue); background: var(--mag-paper); font-size: .77rem; overflow-wrap: anywhere;}
.tbmag-tags a:hover {color: var(--mag-blue); border-color: #aac0cd; background: #edf3f5;}
.tbmag-pagination {display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin: 24px 0 0;}
.tbmag-pagination a {display: grid; place-items: center; min-width: 38px; min-height: 38px; padding: 5px 9px; border: 1px solid var(--mag-line); border-radius: 8px; background: #fff; font-size: .86rem;}
.tbmag-pagination a:not([aria-current]):hover {background: #edf3f5; border-color: #aac0cd;}
.tbmag-pagination a[aria-current] {color: #fff; background: var(--mag-blue); border-color: var(--mag-blue);}
.tbmag-empty {padding: 28px 16px; text-align: center; border: 1px solid var(--mag-line); border-radius: 13px; background: var(--mag-paper);}
.tbmag-empty h1,.tbmag-empty h3 {color: var(--mag-ink); font-size: 1.3rem;}
.tbmag-empty p {color: var(--mag-text);}
.tbmag-after {border: 1px solid var(--mag-line); border-radius: 16px; background: var(--mag-paper); padding: clamp(14px,3vw,25px); margin-block: 18px;}
.tbmag-after-head {margin-bottom: 13px;}
.tbmag-after-head p {margin: 6px 0 0; color: var(--mag-text); font-size: .85rem;}
.tbmag-directory-grid {display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; padding: 0; margin: 0; list-style: none;}
.tbmag-directory-grid a {display: flex; height: 100%; min-height: 85px; flex-direction: column; justify-content: center; gap: 3px; padding: 13px; border: 1px solid var(--mag-line); border-radius: 9px; background: white; overflow-wrap: anywhere;}
.tbmag-directory-grid strong {font-size: .89rem;}
.tbmag-directory-grid small {color: var(--mag-text); font-size: .77rem;}
.tbmag-directory-grid span {color: var(--mag-blue); font-size: .78rem;}
@container magazine (max-width: 900px) {
  .tbmag-content--home {grid-template-columns: minmax(0,1fr);}
  .tbmag-sidebar {display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,210px),1fr));}
}
@container magazine (max-width: 720px) {
  .tbmag-grid {grid-template-columns: repeat(2,minmax(0,1fr));}
}
@container magazine (max-width: 570px) {
  .tbmag-masthead {grid-template-columns: minmax(0,1fr); gap: 12px; margin-bottom: 16px;}
  .tbmag-crumb {margin-bottom: 12px;}
  .tbmag-spotlight {grid-template-columns: minmax(0,1fr); gap: 14px; padding: 12px; border-radius: 15px; margin-bottom: 22px;}
  .tbmag-spotlight-image {order: -1; aspect-ratio: 16/9; border-radius: 8px;}
  .tbmag-spotlight-copy {padding: 2px 4px 5px;}
  .tbmag .tbmag-spotlight h2 {margin-top: 8px;}
  .tbmag-content--home .tbmag-grid, .tbmag-grid {grid-template-columns: minmax(0,1fr);}
}
@media (max-width: 570px) {
  .tbmag-shell {padding-top: 16px;}
  .tbmag-after .tbmag-grid, .tbmag-directory-grid {grid-template-columns: minmax(0,1fr);}
}
@media (prefers-reduced-motion: reduce) {
  .tbmag-spotlight-link, .tbmag-spotlight-link span, .tbmag-card {transition: none;}
}
