
.poster-section{background:var(--paper);scroll-margin-top:90px}
.poster-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.poster-card{margin:0;min-width:0;background:var(--white);border-radius:14px;overflow:hidden}
.poster-card>a{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;height:100%;text-decoration:none;color:var(--ink)}
.poster-card img{display:block;width:112px;height:168px;aspect-ratio:2/3;object-fit:contain;background:var(--paper)}
.poster-card-copy{display:flex;flex-direction:column;flex:1;padding:12px;gap:4px;min-width:0}
.poster-category{font-size:12px;font-weight:700;color:var(--muted)}
.poster-card h3{font-size:16px;line-height:1.35;margin:0;font-weight:700}
.poster-card p{display:none;font-size:14px;line-height:1.6;margin:0;color:var(--muted)}
.poster-card .poster-read{display:flex;align-items:center;min-height:44px;margin-top:auto;color:var(--accent);font-size:14px;font-weight:700;text-decoration:underline;text-underline-offset:4px}
.poster-card>a:hover .poster-read{color:var(--accent-hover)}
.poster-card>a:hover{background:var(--surface-hover)}
.poster-card>a:active{background:var(--sky)}
.poster-card>a:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.poster-more{display:flex;align-items:center;min-height:44px;width:fit-content;margin-top:12px;font-weight:700;color:var(--accent);font-size:14px;text-underline-offset:4px}
.poster-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 0}
.poster-top img{display:block;width:150px;height:auto}
.poster-top>a{display:flex;align-items:center;min-height:44px;color:var(--accent);font-size:14px}
.poster-page{padding:32px 0 56px}
.poster-page h1{font-size:36px;line-height:1.2;max-width:25ch;margin:10px 0 18px;color:var(--deep)}
.poster-page .poster-intro{color:var(--muted);max-width:60ch;margin-bottom:28px}
.poster-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.poster-detail figure{margin:0}
.poster-detail figure img{display:block;width:100%;height:auto;border-radius:14px}
.poster-detail figcaption{font-size:13px;color:var(--muted);margin-top:8px}
.poster-prose{font-size:16px;line-height:1.75}
.poster-prose p{margin:0 0 18px}
.poster-prose h2{font-size:20px;margin:26px 0 12px}
.poster-prose ul{padding-left:20px}
.poster-prose a{color:var(--accent);text-underline-offset:4px}
.poster-prose .poster-more{margin-top:20px}
.poster-footer{padding:24px 0;color:var(--muted);font-size:13px}
@media(max-width:750px){
 .poster-grid{grid-template-columns:1fr;gap:10px}
 .poster-card>a{grid-template-columns:80px minmax(0,1fr)}
 .poster-card img{width:80px;height:120px}

 .poster-card-copy{padding:12px;gap:6px}
 .poster-card h3{font-size:15px}
 .poster-card .poster-read{font-size:12px}
 .poster-card-copy{padding:8px 12px;gap:2px}
 .poster-page{padding:18px 0 32px}
 .poster-page h1{font-size:28px}
 .poster-detail{grid-template-columns:1fr;gap:24px}
 .poster-top{gap:12px;padding:10px 0}
 .poster-top img{width:125px}
 .poster-top>a{font-size:12px}
 .poster-section .section-heading{margin-bottom:12px}
}

.poster-card>a>.more-chevron{display:none}
#tip-ringkas .poster-card h3{font-size:16px;line-height:1.35}
#tip-ringkas .poster-card-copy{padding:10px 12px}
@media(max-width:750px){#tip-ringkas .poster-card h3{font-size:15px}#tip-ringkas .poster-card-copy{padding:8px 12px}}

/* Homepage gallery: contained artwork, native horizontal scrolling. */
#tip-ringkas .poster-gallery{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:248px;gap:16px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding:2px;padding:3px 3px 8px;scrollbar-width:none}
#tip-ringkas .poster-gallery::-webkit-scrollbar{display:none}
#tip-ringkas .poster-card{scroll-snap-align:start;background:transparent;border-radius:12px}
#tip-ringkas .poster-card>a{display:flex;flex-direction:column;align-items:stretch;background:transparent}
#tip-ringkas .poster-card img{width:100%;height:auto;aspect-ratio:2/3;object-fit:contain;border-radius:12px}
#tip-ringkas .poster-card-copy{padding:10px 2px 0;gap:4px}
#tip-ringkas .poster-category{display:none}
#tip-ringkas .poster-card h3{font-size:16px;line-height:1.4;min-height:2.8em}
#tip-ringkas .poster-read{min-height:24px;font-size:12px;line-height:20px;margin-top:0}
#tip-ringkas .poster-card>a:hover h3{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
#tip-ringkas .poster-card>a:active{background:var(--sky)}
#tip-ringkas .poster-gallery-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:4px}
#tip-ringkas .poster-gallery-footer .poster-more{margin:0}
@media(max-width:750px){
 #tip-ringkas .poster-gallery{grid-auto-columns:min(232px,72vw);gap:12px}
 #tip-ringkas .poster-card h3{font-size:15px;line-height:1.4}
 #tip-ringkas .poster-card-copy{padding:8px 2px 0;gap:2px}
}



/* One direct-manipulation gallery across mouse, trackpad and touch. */
#tip-ringkas .poster-gallery{cursor:grab;touch-action:pan-x pan-y pinch-zoom}
#tip-ringkas .poster-gallery.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
#tip-ringkas .poster-gallery.is-dragging a{cursor:grabbing}
#tip-ringkas .poster-gallery img{-webkit-user-drag:none;user-select:none}
@media(min-width:751px){#tip-ringkas .poster-gallery{justify-content:start}}
