/* Live magazine (magazine-live.php). Mobile-first: the base rules are the phone layout, wider
   layouts are added only inside min-width media queries. Every rule is scoped under
   .armpin-maglive. Colors come from the site design tokens. */
.armpin-maglive { max-width: 80rem; margin-inline: auto; padding: 1rem 1rem 2.5rem; color: var(--ap-foreground); }
.armpin-maglive a { text-decoration: none; }
.armpin-maglive__head { display: flex; flex-direction: column; gap: 0.75rem; padding-block-end: 0.75rem; border-block-end: 3px solid var(--ap-foreground); }
.armpin-maglive__name { margin: 0; font-family: var(--ap-font-display); font-size: 2rem; line-height: 1.1; text-transform: uppercase; }
.armpin-maglive__name a { color: inherit; }
.armpin-maglive__tag { margin: 0.25rem 0 0; font-size: 0.85rem; color: var(--ap-muted-foreground); }
.armpin-maglive__search { display: flex; gap: 0.4rem; }
.armpin-maglive__search input { flex: 1; min-width: 0; background: var(--ap-panel); border: 1px solid var(--ap-line); border-radius: calc(var(--ap-radius) - 2px); padding: 0.5rem 0.7rem; }
.armpin-maglive button.armpin-maglive__btn[type="submit"] { background: var(--ap-foreground); color: var(--ap-background); border: none; border-radius: calc(var(--ap-radius) - 2px); padding: 0.5rem 1rem; font-weight: 600; cursor: pointer; }

.armpin-maglive__nav { display: flex; gap: 0.25rem; overflow-x: auto; padding-block: 0.5rem; margin-block-end: 0.75rem; border-block-end: 1px solid var(--ap-line); scrollbar-width: thin; }
.armpin-maglive a.armpin-maglive__navlink { flex: none; padding: 0.4rem 0.8rem; border-radius: 999px; font-size: 0.85rem; font-weight: 600; color: var(--ap-muted-foreground); white-space: nowrap; }
.armpin-maglive a.armpin-maglive__navlink.is-active { background: var(--ap-foreground); color: var(--ap-background); }

.armpin-maglive__ticker { display: flex; align-items: center; gap: 0.6rem; background: var(--ap-secondary); border-radius: var(--ap-radius); padding: 0.4rem 0.6rem; margin-block-end: 1rem; overflow: hidden; }
.armpin-maglive__ticker b { flex: none; background: var(--ap-destructive); color: var(--ap-destructive-foreground); padding: 0.15rem 0.5rem; border-radius: calc(var(--ap-radius) - 2px); font-size: 0.7rem; text-transform: uppercase; }
.armpin-maglive__tickerlist { display: flex; gap: 1.5rem; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
.armpin-maglive__tickerlist::-webkit-scrollbar { display: none; }
.armpin-maglive .armpin-maglive__tickerlist a { flex: none; font-size: 0.85rem; color: var(--ap-foreground); }

.armpin-maglive__layout { display: flex; flex-direction: column; gap: 1.5rem; }
.armpin-maglive__main { min-width: 0; display: flex; flex-direction: column; gap: 1.75rem; }
.armpin-maglive__sech { display: flex; align-items: baseline; justify-content: space-between; margin: 0 0 0.75rem; padding-block-end: 0.4rem; border-block-end: 2px solid var(--ap-line); font-size: 1.2rem; }
.armpin-maglive .armpin-maglive__all { font-size: 0.78rem; font-weight: 600; color: var(--ap-primary); }

.armpin-maglive__hero { display: flex; flex-direction: column; gap: 1rem; }
.armpin-maglive a.armpin-maglive__cover { display: flex; flex-direction: column; gap: 0.4rem; color: var(--ap-foreground); }
.armpin-maglive__ctitle--cover { font-size: 1.5rem !important; line-height: 1.25; }
.armpin-maglive__brief { border: 1px solid var(--ap-line); border-radius: var(--ap-radius); padding: 0.75rem 1rem; background: var(--ap-panel); }
.armpin-maglive__brief h3 { margin: 0 0 0.5rem; font-size: 0.95rem; }
.armpin-maglive__brief ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.armpin-maglive__brief li + li { border-block-start: 1px solid var(--ap-line); }
.armpin-maglive__brief a { display: block; padding-block: 0.55rem; font-size: 0.9rem; font-weight: 600; line-height: 1.35; color: var(--ap-foreground); }
.armpin-maglive__brief small { display: block; font-size: 0.68rem; font-weight: 700; color: var(--ap-primary); text-transform: uppercase; }

.armpin-maglive__grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
.armpin-maglive a.armpin-maglive__card { display: flex; flex-direction: column; gap: 0.3rem; color: var(--ap-foreground); }
.armpin-maglive__thumb { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: calc(var(--ap-radius) - 2px); background: var(--ap-secondary); }
.armpin-maglive__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.armpin-maglive__thumb--logo { display: grid; place-items: center; padding: 0.5rem; }
.armpin-maglive__thumb--logo img { object-fit: contain; }
.armpin-maglive__play { position: absolute; inset: auto 0.5rem 0.5rem auto; width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 999px; background: rgba(0, 0, 0, 0.65); color: #fff; font-size: 0.75rem; font-style: normal; }
.armpin-maglive__meta { font-size: 0.72rem; color: var(--ap-muted-foreground); text-transform: uppercase; }
.armpin-maglive__ctitle { font-size: 1rem; font-weight: 700; line-height: 1.35; }
.armpin-maglive__csum { font-size: 0.82rem; color: var(--ap-muted-foreground); line-height: 1.5; }
.armpin-maglive__vids { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }

.armpin-maglive__side { display: flex; flex-direction: column; gap: 1rem; }
.armpin-maglive__box { border: 1px solid var(--ap-line); border-radius: var(--ap-radius); padding: 1rem; background: var(--ap-panel); }
.armpin-maglive__box h3 { margin: 0 0 0.4rem; font-size: 1rem; }
.armpin-maglive__box p { margin: 0 0 0.6rem; font-size: 0.85rem; color: var(--ap-muted-foreground); }
.armpin-maglive__nl { display: flex; gap: 0.4rem; }
.armpin-maglive__nl input { flex: 1; min-width: 0; background: var(--ap-background); border: 1px solid var(--ap-line); border-radius: calc(var(--ap-radius) - 2px); padding: 0.5rem 0.6rem; }
.armpin-maglive__social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; }
.armpin-maglive__social a { display: inline-block; padding: 0.3rem 0.7rem; border: 1px solid var(--ap-line); border-radius: 999px; font-size: 0.8rem; color: var(--ap-foreground); }
.armpin-maglive a.armpin-maglive__more { display: inline-block; padding: 0.45rem 0.9rem; border-radius: calc(var(--ap-radius) - 2px); background: var(--ap-foreground); color: var(--ap-background); font-size: 0.85rem; font-weight: 600; }
.armpin-maglive a.armpin-maglive__more--ghost { background: transparent; color: var(--ap-foreground); border: 1px solid var(--ap-line); }

.armpin-maglive__ad { display: flex; flex-direction: column; gap: 0.2rem; align-items: center; margin-block: 0.5rem; }
.armpin-maglive__ad small { font-size: 0.65rem; color: var(--ap-muted-foreground); text-transform: uppercase; }
.armpin-maglive__ad img { max-width: 100%; height: auto; border-radius: calc(var(--ap-radius) - 2px); display: block; }
.armpin-maglive__page { max-width: 44rem; }
.armpin-maglive__prices { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: 0.6rem; }
.armpin-maglive__prices li { border: 1px solid var(--ap-line); border-radius: var(--ap-radius); padding: 0.75rem 1rem; background: var(--ap-panel); }
.armpin-maglive__prices span { margin-inline-start: 0.6rem; font-weight: 700; color: var(--ap-primary); }
.armpin-maglive__pager { display: flex; flex-wrap: wrap; gap: 0.3rem; margin-block-start: 1rem; }
.armpin-maglive__pager a { padding: 0.3rem 0.7rem; border: 1px solid var(--ap-line); border-radius: calc(var(--ap-radius) - 2px); color: var(--ap-foreground); }
.armpin-maglive__pager a.is-active { background: var(--ap-foreground); color: var(--ap-background); }
.armpin-maglive__empty, .armpin-maglive__issues p { color: var(--ap-muted-foreground); }

/* classic style: one plain column, small side thumbnails, no cover treatment */
.armpin-maglive--classic .armpin-maglive__grid, .armpin-maglive--classic .armpin-maglive__vids { grid-template-columns: 1fr; gap: 0.75rem; }
.armpin-maglive--classic .armpin-maglive__head { border-block-end-width: 1px; }
.armpin-maglive--classic a.armpin-maglive__card { flex-direction: row; flex-wrap: wrap; align-items: flex-start; column-gap: 0.75rem; }
.armpin-maglive--classic a.armpin-maglive__card .armpin-maglive__thumb { width: 7rem; flex: none; }
.armpin-maglive--classic .armpin-maglive__csum { display: none; }
.armpin-maglive--classic .armpin-maglive__ctitle--cover { font-size: 1.25rem !important; }

@media (min-width: 40rem) {
	.armpin-maglive { padding-inline: 1.5rem; }
	.armpin-maglive__head { flex-direction: row; align-items: flex-end; justify-content: space-between; }
	.armpin-maglive__name { font-size: 2.6rem; }
	.armpin-maglive__search { width: 18rem; }
	.armpin-maglive__grid { grid-template-columns: repeat(2, 1fr); }
	.armpin-maglive__vids { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 64rem) {
	.armpin-maglive__layout { flex-direction: row; align-items: flex-start; }
	.armpin-maglive__main { flex: 1 1 0; }
	.armpin-maglive__side { width: 18rem; flex: none; position: sticky; top: 1rem; }
	.armpin-maglive__hero { display: grid; grid-template-columns: 1.7fr 1fr; align-items: start; }
	.armpin-maglive__ctitle--cover { font-size: 1.9rem !important; }
	.armpin-maglive__grid { grid-template-columns: repeat(3, 1fr); }
	.armpin-maglive__grid--4 { grid-template-columns: repeat(4, 1fr); }
	.armpin-maglive__vids { grid-template-columns: repeat(3, 1fr); }
	.armpin-maglive--classic .armpin-maglive__grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	.armpin-maglive__tickerlist { scroll-behavior: auto; }
}
