/* Original Smartest Library palette, with darker teal for readable controls. */
html{scroll-behavior:smooth;scroll-padding-top:12px}
.brand{gap:10px;padding:0 7px;color:var(--muted)}
.brand-logo{display:block;width:48px;height:48px;flex-shrink:0;border-radius:50%;box-shadow:0 0 0 1px #d2e5e7}
.brand strong{font-size:20px}
.topbar{background:#fff}
.nav-link.active{background:var(--selected);color:var(--accent)}
.nav-link.active svg,.nav-link.active .nav-count{color:var(--accent)}
.nav-link:hover,.topic-link:hover{background:var(--hover)}
.topic-link.active:before{color:var(--accent)}
.search-box:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px #00a69316}
.search-submit{background:var(--accent);color:#fff}
.search-submit:hover{background:#006b60;color:#fff}
.result-count{color:var(--accent);border-color:#cce5de;background:#edf8f4}
.view-switch{background:#fff}
.view-switch button[aria-pressed=true]{background:var(--selected);color:var(--accent)}
.post-thumbnail{background:#eff1f2}
.post-title{min-height:2.9em;flex-shrink:0}
.post-stats{margin-top:auto;padding-top:9px}
.post-chips{margin-bottom:0}
.chip:hover,.save-button:hover{background:var(--selected);color:var(--accent)}
.save-button[aria-pressed=true] svg{fill:#b8e4d8}
.thumbnail-expand{border-color:#cae4dc;color:var(--accent);box-shadow:0 2px 10px #183e3212;transition:opacity .2s,transform .2s;transform:translateY(3px)}
.thumbnail-button:hover .thumbnail-expand,.thumbnail-button:focus-visible .thumbnail-expand{transform:translateY(0)}
.page-num.current{background:var(--accent);border-color:var(--accent)}
.page-btn,.page-num{transition:background-color .2s,color .2s,transform .2s;border-color:#dce3e0}
.page-btn:not(.disabled):active,.page-num:not(.current):active{transform:scale(.96)}
.post-card.is-revealed{animation:card-in .36s cubic-bezier(.2,.7,.2,1)}
.list-layout .post-title{min-height:0}
.list-layout .post-stats{padding-top:9px}
.list-layout .post-content{height:100%}
.list-layout .thumbnail-button{aspect-ratio:4/5}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .post-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px #14372b0c,0 2px 6px #14372b06}
  .nav-link,.topic-link{transition:background-color .2s,color .2s,transform .2s}
  .topic-link:hover{transform:translateX(2px)}
}
@keyframes card-in{from{opacity:.55;translate:0 10px}to{opacity:1;translate:0 0}}
@media(max-width:680px){.brand-logo{width:36px;height:36px}.brand{gap:9px;margin-bottom:11px}.brand strong{font-size:18px}.posts-grid{row-gap:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.post-format{font-size:10px;color:var(--muted);white-space:nowrap}
.view-post-btn{color:var(--accent);font-size:11px;font-weight:500;min-height:32px}
.post-title-link:hover{text-decoration:underline;text-underline-offset:3px}
.thumbnail-button:focus-visible{outline-offset:-4px}
.list-layout .card-footer{gap:3px}
@media(max-width:520px){.post-format{font-size:11px}.view-post-btn{font-size:12px;min-height:36px}}
