/* Portrait article cards only; single articles and desktop article styling stay intact. */
@media (max-width: 767px), (max-width: 1024px) and (orientation: portrait) {
  html.toby-portrait-list #primary { width: 100%; min-width: 0; }
  html.toby-portrait-list #main.article-list { padding: 10px; }
  html.toby-portrait-list #navbar-main { padding-top: 10px; padding-bottom: 10px; }
  html.toby-portrait-list #navbar-main .navbar-brand.mr-0 { display: flex; align-items: center; gap: 8px; min-width: 0; }
  html.toby-portrait-list #navbar-main .navbar-icon { margin: 0 !important; padding: 0; }
  html.toby-portrait-list #navbar-main .navbar-icon img { width: 25px; height: 25px; }
  html.toby-portrait-list #navbar-main .navbar-title { font-size: 14px; margin: 0; padding: 0; white-space: normal; overflow-wrap: anywhere; }
  #main.article-list article.toby-portrait-card {
    --toby-thumb: 102px;
    display: block; padding: 16px; margin-bottom: 12px; min-width: 0;
  }
  #main.article-list .toby-card-row { display: grid; grid-template-columns: minmax(0, 1fr) var(--toby-thumb); column-gap: 14px; align-items: start; }
  #main.article-list .toby-card-row.toby-no-image { grid-template-columns: minmax(0, 1fr); }
  #main.article-list .toby-card-copy { min-width: 0; display: flex; flex-direction: column; }
  #main.article-list .toby-portrait-card .post-title {
    display: block; max-width: none; font-size: 19px; line-height: 1.5;
    margin: 0 0 8px; letter-spacing: 0; overflow-wrap: anywhere;
  }
  #main.article-list .toby-portrait-card .post-content {
    flex: none; font-size: 14px; line-height: 1.85; font-weight: 400;
    margin: 0; display: -webkit-box; -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--toby-summary-lines, 3); overflow: hidden; overflow-wrap: anywhere;
  }
  #main.article-list .toby-portrait-card .post-header {
    width: 100%; height: calc(var(--toby-thumb) * 1.08); min-height: 0; max-height: none;
    margin: 0; padding: 0; border-radius: 4px; overflow: hidden;
  }
  #main.article-list .toby-cover-open {
    display: block; width: 100%; height: 100%; border: 0; border-radius: 4px; padding: 5px;
    background: rgba(var(--themecolor-rgbstr), .05); cursor: pointer;
  }
  #main.article-list .toby-portrait-card .post-thumbnail {
    display: block; width: 100%; height: 100%; min-height: 0; max-height: none;
    object-fit: contain; object-position: center; pointer-events: none;
  }
  #main.article-list .toby-portrait-card .post-meta { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(var(--themecolor-rgbstr), .16); }
  #main.article-list .toby-meta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
  #main.article-list .toby-meta-row + .toby-meta-row { margin-top: 8px; }
  #main.article-list .toby-portrait-card .post-meta-detail { font-size: 12px; line-height: 1.6; opacity: .85; }
  #main.article-list .toby-portrait-card .post-meta-detail i { margin-right: 5px; }
  #main.article-list .toby-portrait-card .post-meta-devide,
  #main.article-list .toby-portrait-card .post-meta br { display: none; }
  #main.article-list .toby-portrait-card .post-tags { margin: 10px 0 0; line-height: 1.5; }
  #main.article-list .toby-portrait-card .post-tags > i { display: none; }
  #main.article-list .toby-portrait-card .tag { font-size: 12px; margin-bottom: 0; }
  html.toby-portrait-list #main.article-list .shuoshuo-preview-container { padding: 16px; margin-bottom: 12px; }
  html.toby-portrait-list #main.article-list .shuoshuo-title { font-size: 16px; line-height: 1.6; }
  html.toby-portrait-list #main.article-list .shuoshuo-content { margin-top: 8px; font-size: 14px; line-height: 1.85; }
  html.toby-portrait-list #main.article-list .shuoshuo-content p { margin-bottom: 8px; }
  html.toby-portrait-list #main.article-list .shuoshuo-content img { max-width: 100%; height: auto; object-fit: contain; }
  html.toby-portrait-list #main.article-list .shuoshuo-preview-meta { font-size: 12px; line-height: 1.6; margin-top: 8px; }
  html.toby-portrait-list #main.article-list .shuoshuo-preview-link { width: 32px; height: 32px; right: 14px; bottom: 12px; }
}
/* Keep the theme's original cover. Fold only list previews, on all devices. */
#main .toby-say-card .shuoshuo-content {
  position: relative; max-height: none; overflow: visible;
}
#main .toby-say-card .shuoshuo-content > .show-full-shuoshuo { display: none !important; }
#main .toby-say-card.toby-say-collapsed .shuoshuo-content {
  max-height: var(--toby-say-limit, 140px); overflow: hidden;
}
#main .toby-say-card.toby-say-collapsed .shuoshuo-content::after {
  content: ''; position: absolute; inset: auto 0 0; height: 28px;
  background: linear-gradient(180deg, transparent, var(--color-foreground));
  pointer-events: none;
}
#main .toby-say-card .toby-say-toggle {
  align-self: flex-start; display: block; padding: 6px 14px; margin: 6px 0 0;
  min-height: 36px; border: 1px solid currentColor; border-radius: var(--card-radius, 4px);
  color: var(--themecolor); background: transparent; font: inherit; font-size: 13px;
  line-height: 1.5; cursor: pointer;
}
#main .toby-say-card .toby-say-toggle[hidden] { display: none; }
#main .toby-say-card .toby-say-toggle:focus-visible { outline: 2px solid var(--themecolor); outline-offset: 3px; }
@media (min-width: 610px) and (max-width: 1024px) and (orientation: portrait) {
  #main.article-list article.toby-portrait-card { --toby-thumb: 142px; padding: 22px 24px; }
  #main.article-list .toby-card-row { column-gap: 24px; }
  #main.article-list .toby-portrait-card .post-title { font-size: 22px; }
  #main.article-list .toby-portrait-card .post-content { font-size: 16px; }
  #main.article-list .toby-portrait-card .post-meta-detail { font-size: 13px; }
}
.toby-image-dialog { width: min(760px, calc(100% - 32px)); max-height: 90dvh; padding: 16px; border: 0; border-radius: var(--card-radius, 8px); background: #fff; color: #444; }
html.darkmode .toby-image-dialog { background: #252e39; color: #eee; }
.toby-image-dialog::backdrop { background: rgba(15, 25, 35, .75); }
.toby-image-dialog .toby-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.toby-image-dialog button { border: 0; background: transparent; color: inherit; min-width: 44px; min-height: 44px; font-size: 24px; cursor: pointer; }
.toby-image-dialog img { display: block; width: 100%; max-height: calc(90dvh - 100px); object-fit: contain; }
