/* Latest page styles. Extracted from inline <style> in pages/latest.php on 2026-05-10. */
.latest-hdr{
    --accent:var(--bmm-accent);
    --line:#e7e4ef;
    --line-soft:#f1eff5;
    --ink:#14121a;
    --ink-soft:#4a4757;
    --muted:#8a8797;
    position:relative;
    font-family:'Fraunces', Georgia, serif;
    color: var(--ink);
    background:#fff;
    border:1px solid var(--line);
    padding: 18px 20px 16px;
    border-radius:2px;
    display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px;
}
.latest-hdr .crn{
    position:absolute; width:10px; height:10px;
    border:1px solid var(--accent); opacity:.75;
}
.latest-hdr .crn.tl{ top:-1px; left:-1px; border-right:none; border-bottom:none; }
.latest-hdr .crn.tr{ top:-1px; right:-1px; border-left:none; border-bottom:none; }
.latest-hdr .crn.bl{ bottom:-1px; left:-1px; border-right:none; border-top:none; }
.latest-hdr .crn.br{ bottom:-1px; right:-1px; border-left:none; border-top:none; }

.latest-hdr .title-block{ flex:1 1 280px; min-width:0; }
.latest-hdr .kicker{
    font-size:11px; letter-spacing:.22em; text-transform:uppercase;
    color: var(--accent); font-weight:500;
    display:inline-flex; align-items:center; gap:8px;
}
.latest-hdr .kicker .dot{
    width:5px; height:5px; border-radius:50%;
    background: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--bmm-accent) 15%, transparent);
}
.latest-hdr h1{
    font-family:'Fraunces', serif;
    font-weight:500; font-size: clamp(22px, 2.4vw, 28px);
    line-height:1.1; letter-spacing:-0.01em;
    margin: 4px 0 0; color: var(--ink);
}
.latest-hdr h1 em{ font-style:italic; font-weight:400; color: var(--accent); }

.latest-hdr .stats{
    display:flex; align-items:stretch; gap:0;
    border-left:1px solid var(--line-soft);
    padding-left:20px;
}
.latest-hdr .stat{
    padding: 0 16px;
    border-right: 1px solid var(--line-soft);
    display:flex; flex-direction:column; gap:2px;
    min-width:0;
}
.latest-hdr .stat:last-child{ border-right:none; padding-right:0; }
.latest-hdr .stat:first-child{ padding-left:0; }
.latest-hdr .stat .n{
    font-family:'Fraunces', serif;
    font-size:20px; font-weight:500;
    color: var(--ink); font-variant-numeric: tabular-nums;
    line-height:1;
}
.latest-hdr .stat .l{
    font-size:10px; letter-spacing:.14em; text-transform:uppercase;
    color: var(--muted); font-weight:500;
    white-space:nowrap;
}

.latest-hdr form{
    display:flex; align-items:center; gap:8px;
    margin-left:auto;
}
.latest-hdr form label{
    font-size:10px; letter-spacing:.16em; text-transform:uppercase;
    color: var(--muted); font-weight:500;
    margin-right:4px;
}
.latest-hdr select{
    appearance:none; -webkit-appearance:none;
    font-family:'Fraunces', serif; font-size:14px;
    color: var(--ink); background:#fff;
    border: 1px solid var(--line);
    padding: 7px 30px 7px 10px;
    border-radius:2px; outline:none;
    min-width: 180px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'><path d='M1 1l4 4 4-4' stroke='%237E3AF2' stroke-width='1.5' fill='none' stroke-linecap='round'/></svg>");
    background-repeat:no-repeat; background-position: right 10px center;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.latest-hdr select:hover{ border-color:#d3cde2; }
.latest-hdr select:focus{ border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--bmm-accent) 15%, transparent); }
.latest-hdr .btn{
    appearance:none; border:none; cursor:pointer;
    font-family:'Fraunces', serif; font-size:14px; font-weight:500;
    color:#fff; background: var(--accent);
    padding: 8px 14px; border-radius:2px;
    transition: background .2s ease;
}
.latest-hdr .btn:hover{ background:var(--bmm-accent-deep); }
.latest-hdr .reset{
    font-family:'Fraunces', serif; font-size:13px;
    color: var(--muted); text-decoration:none;
    border-bottom: 1px solid transparent;
    padding: 8px 4px;
}
.latest-hdr .reset:hover{ color: var(--accent); border-bottom-color: color-mix(in srgb, var(--bmm-accent) 35%, transparent); }

@media (max-width: 720px){
    .latest-hdr{ padding:16px; }
    .latest-hdr .stats{ border-left:none; padding-left:0; width:100%; }
    .latest-hdr form{ margin-left:0; width:100%; flex-wrap:wrap; }
    .latest-hdr select{ flex:1 1 auto; min-width:0; }
}

.lg-list{
    --accent:var(--bmm-accent);
    --accent-deep:var(--bmm-accent-deep);
    --line:#e7e4ef;
    --line-soft:#f1eff5;
    --ink:#14121a;
    --ink-soft:#4a4757;
    --muted:#8a8797;
    font-family:'Fraunces', Georgia, serif;
    display:grid; gap:14px;
}
.lg-card{
    position:relative;
    display:grid; grid-template-columns: 360px 1fr auto;
    gap: 20px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:2px;
    padding:14px;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.lg-card:hover{
    border-color: var(--accent);
    box-shadow: 0 14px 30px -18px color-mix(in srgb, var(--bmm-accent) 25%, transparent);
    transform: translateY(-1px);
}
.lg-card:hover .lg-crn{ opacity:1; }
.lg-crn{
    position:absolute; width:10px; height:10px;
    border:1px solid var(--accent); opacity:.35;
    transition: opacity .2s ease;
}
.lg-crn.tl{ top:-1px; left:-1px; border-right:none; border-bottom:none; }
.lg-crn.br{ bottom:-1px; right:-1px; border-left:none; border-top:none; }

.lg-media{
    position:relative;
    aspect-ratio: 16/10;
    overflow:hidden;
    background: var(--line-soft);
    border:1px solid var(--line);
    border-radius:2px;
}
.lg-media img{
    position:absolute; inset:0;
    width:100%; height:100%;
    object-fit:cover;
    transition: transform .5s ease;
}
.lg-card:hover .lg-media img{ transform: scale(1.04); }
.lg-media .placeholder{
    position:absolute; inset:0;
    display:flex; align-items:center; justify-content:center;
    font-size:11px; letter-spacing:.18em; text-transform:uppercase;
    color: var(--muted);
    background: repeating-linear-gradient(135deg, #fafafa 0 8px, #f3f1f7 8px 16px);
}
.lg-media .badges{
    position:absolute; top:8px; left:8px;
    display:flex; flex-wrap:wrap; gap:6px;
}
.lg-media .badge{
    font-family:'Fraunces', serif;
    font-size:10px; letter-spacing:.12em; text-transform:uppercase;
    padding: 3px 8px;
    background: rgba(255,255,255,.92);
    color: var(--ink);
    border: 1px solid rgba(20,18,26,.08);
    backdrop-filter: blur(4px);
    font-weight:500;
}
.lg-media .badge.accent{
    background: var(--accent);
    color:#fff;
    border-color: transparent;
}
.lg-media .badge .d{
    display:inline-block; width:5px; height:5px; border-radius:50%;
    background: var(--accent);
    margin-right:6px; vertical-align: 1px;
}

.lg-body{ display:flex; flex-direction:column; min-width:0; gap:6px; padding: 4px 0; }
.lg-eye{
    display:flex; align-items:center; gap:10px;
    font-size:10px; letter-spacing:.18em; text-transform:uppercase;
    color: var(--accent); font-weight:500;
}
.lg-eye .sep{ color: var(--line); }
.lg-eye .date{ color: var(--muted); letter-spacing:.1em; font-weight:400; text-transform:none; font-size:12px; font-family:'Fraunces', serif; }
.lg-title{
    font-family:'Fraunces', serif;
    font-size: 22px; font-weight:500;
    letter-spacing:-0.01em; line-height:1.15;
    margin: 2px 0 0;
}
.lg-title a{ color: var(--ink); text-decoration:none; transition: color .2s ease; }
.lg-title a:hover{ color: var(--accent); }
.lg-flavour{
    color: var(--ink-soft);
    font-size:14px; line-height:1.5;
    margin: 2px 0 0;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.lg-link{
    font-size:12px; color: var(--muted);
    font-variant-numeric: tabular-nums;
    margin-top: 6px;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.lg-link::before{ content:"↗"; color: var(--accent); margin-right:6px; }

.lg-side{
    display:flex; flex-direction:column;
    align-items:flex-end; justify-content:space-between;
    gap:12px; padding: 4px 0;
    min-width: 120px;
}
.lg-gifts{
    display:flex; align-items:center; gap:-6px;
    padding-left:6px;
}
.lg-gifts .gift{
    width:26px; height:26px;
    border:1px solid var(--line);
    background:#fff;
    overflow:hidden;
    margin-left:-6px;
    display:grid; place-items:center;
}
.lg-gifts .gift img{ width:100%; height:100%; object-fit:cover; }
.lg-gifts .gift:first-child{ margin-left:0; }
.lg-cta{
    font-family:'Fraunces', serif;
    font-size:13px; font-weight:500;
    color: var(--accent);
    border: 1px solid var(--accent);
    padding: 8px 14px;
    text-decoration:none;
    border-radius:2px;
    transition: background .2s ease, color .2s ease;
    white-space:nowrap;
    display:inline-flex; align-items:center; gap:6px;
}
.lg-cta:hover{ background: var(--accent); color:#fff; }
.lg-cta .arr{ transition: transform .2s ease; }
.lg-cta:hover .arr{ transform: translateX(3px); }

@media (max-width: 760px){
    .lg-card{ grid-template-columns: 1fr; }
    .lg-media{ aspect-ratio: 16/9; }
    .lg-side{ flex-direction:row; align-items:center; justify-content:space-between; }
}

.lg-empty{
    background:#fff; border: 1px dashed var(--line);
    padding: 28px; text-align:center;
    font-family:'Fraunces', serif; color: var(--ink-soft);
    font-size:14px; border-radius:2px;
}
.lg-empty em{ color: var(--accent); font-style:italic; }
