*{box-sizing:border-box}

html{background:#000;color:#fff}

body{
  margin:0;
  background:#000;
  color:#f4f4f4;
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.62;
  font-size:17px
}

a{color:#fff;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{opacity:.78}

.site-header{border-bottom:1px solid #242424}

.site-bar,.wrap,.site-footer{
  width:min(100% - 36px,900px);
  margin:auto
}

.site-bar{
  min-height:64px;
  display:flex;
  gap:22px;
  align-items:center;
  justify-content:space-between
}

.brand{
  font-size:23px;
  font-weight:800;
  text-decoration:none;
  letter-spacing:-.5px
}

.languages{
  font-size:13px;
  text-align:right;
  color:#aaa
}

.languages a{color:#c8c8c8}
.languages a[aria-current=page]{color:#fff;font-weight:700}

.wrap{padding:44px 0 68px}

h1,h2,h3{line-height:1.14;letter-spacing:-.025em}
h1{font-size:clamp(36px,7vw,56px);margin:0 0 18px}
h2{font-size:28px;margin:50px 0 12px}
h3{font-size:21px;margin:0 0 7px}

.lede{
  color:#cecece;
  font-size:20px;
  max-width:720px;
  margin:0 0 44px
}

.section-note,.muted{color:#929292}

.category-list,.story-list{
  display:grid;
  gap:1px;
  background:#262626;
  border:1px solid #262626
}

.category-card,.story-card{
  display:block;
  background:#080808;
  padding:20px;
  text-decoration:none
}

.category-card p,.story-card p{
  margin:6px 0 0;
  color:#bcbcbc
}

.category-card strong{font-size:20px}

.story-card .mini-meta{
  margin-top:10px;
  color:#888;
  font-size:14px
}

/* Homepage: real two-column cards */
.homepage-categories{
  margin-top:26px;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  background:transparent;
  border:0
}

.homepage-categories .category-card{
  min-height:142px;
  padding:23px 24px 22px;
  border:1px solid #262626;
  background:#070707;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  transition:background-color .16s ease,border-color .16s ease,transform .16s ease
}

.homepage-categories .category-card:hover{
  opacity:1;
  background:#0d0d0d;
  border-color:#555;
  transform:translateY(-1px)
}

.homepage-categories .category-card strong{
  display:block;
  margin:0 0 9px;
  font-size:21px;
  line-height:1.2;
  color:#fff
}

.homepage-categories .category-card p{
  margin:0;
  color:#aaa;
  font-size:15px;
  line-height:1.55
}

.story-list{margin-top:22px}

.story-card{padding:22px 23px}

.story-card:hover{
  opacity:1;
  background:#0d0d0d
}

.breadcrumbs{
  font-size:14px;
  color:#929292;
  margin:0 0 26px
}

.breadcrumbs a{color:#bbb}

.story-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  padding:15px 0 20px;
  border-top:1px solid #222;
  border-bottom:1px solid #222;
  color:#bbb;
  font-size:14px
}

.story-meta strong{color:#fff}

.story-body{
  max-width:720px;
  margin:38px auto 0;
  font-family:Georgia,'Times New Roman',serif;
  font-size:19px;
  line-height:1.72
}

.story-body p{margin:0 0 1.25em}

.story-sign{
  font-family:Arial,Helvetica,sans-serif;
  font-size:.9em;
  letter-spacing:.04em
}

.story-end{
  max-width:720px;
  margin:55px auto 0;
  border-top:1px solid #222;
  padding-top:28px
}

.related-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}

.related-card{
  border:1px solid #282828;
  padding:15px;
  text-decoration:none
}

.related-card span{
  display:block;
  color:#999;
  font-size:13px;
  margin-top:6px
}

.prevnext{
  display:flex;
  justify-content:space-between;
  gap:18px;
  margin-top:32px
}

.prevnext>a{max-width:48%}

.site-footer{
  border-top:1px solid #222;
  padding:28px 0 50px;
  color:#888;
  font-size:13px
}

.empty{
  border:1px solid #292929;
  padding:22px;
  color:#bbb
}

.notice{font-size:14px;color:#aaa}

@media(max-width:700px){
  .homepage-categories{
    grid-template-columns:1fr;
    gap:10px
  }

  .homepage-categories .category-card{
    min-height:0;
    padding:20px
  }

  body{font-size:16px}

  .site-bar{
    align-items:flex-start;
    flex-direction:column;
    justify-content:center;
    padding:14px 0
  }

  .languages{text-align:left}
  .wrap{padding-top:30px}
  .related-grid{grid-template-columns:1fr}
  .story-body{font-size:18px}
  .prevnext{display:block}

  .prevnext>a{
    display:block;
    max-width:none;
    margin:12px 0
  }

  .story-meta{display:block}

  .story-meta span{
    display:block;
    margin:4px 0
  }
}

/* Story previous/next navigation */
.story-pagination{display:flex;justify-content:space-between;gap:24px;margin-top:32px}
.story-pagination>a{display:block;max-width:48%}
.story-pagination>a:last-child{text-align:right;margin-left:auto}
@media (max-width: 640px){
  .story-pagination{display:flex;flex-direction:column;gap:14px}
  .story-pagination>a{display:block;max-width:none;width:100%;padding:12px 0}
  .story-pagination>a:last-child{text-align:left;margin-left:0}
}

/* Related stories: explicit separation on all viewport sizes */
.story-end > a{display:block;margin:0 0 12px}
.story-end > a + a{margin-top:8px}
@media (max-width:640px){.story-end > a{display:block;width:100%;margin:0 0 14px}}