/* Homepage schedule as a compact vertical list of timings. Each row keeps its
   own artwork as a small icon, so the card reads as a timetable rather than a
   poster wall. The surrounding panel/header inherit the gb-home-card styles. */
.gb-home-grid-events { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; --home-panel-height:500px; }
.gb-home-grid-events > .gb-home-card { min-width:0; height:var(--home-panel-height); box-sizing:border-box; display:flex; flex-direction:column; }
.gb-home-grid-events > .gb-home-card > header { flex:0 0 auto; min-width:0; flex-wrap:wrap; padding:12px 16px; }
.gb-home-grid-events > .gb-home-card > header h2 { min-width:0; overflow-wrap:anywhere; }
/* This legacy artwork overlay was intentionally hidden by the compact timetable. */
.gb-events-card::before { content:none; }
.gb-events-card .gb-events-grid { display:flex; flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; flex-direction:column; gap:6px; padding:12px; background:none; scrollbar-width:thin; }
.gb-events-card .gb-events-grid article {
    --event-focus:50% 32%;
    position:relative;
    display:grid;
    grid-template-columns:26px minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
    min-height:44px;
    flex:0 0 auto;
    height:auto;
    padding:2px 8px;
    border:1px solid var(--gb-line);
    border-radius:7px;
    background:var(--gb-panel);
    transition:border-color .18s,background .18s;
}
.gb-events-card .gb-events-grid article[data-event-art="rabbits"] { --event-focus:65% 35%; }
.gb-events-card .gb-events-grid article:hover { border-color:var(--gb-cyan); background:var(--gb-panel-2); }
.gb-events-card .hk-event-art {
    position:relative;
    z-index:0;
    inset:auto;
    width:26px;
    height:26px;
    border:1px solid color-mix(in srgb,var(--gb-cyan) 26%,transparent);
    border-radius:6px;
    object-fit:cover;
    object-position:var(--event-focus);
    transition:transform .2s;
}
.gb-events-card .gb-events-grid article:hover .hk-event-art { transform:scale(1.06); }
.gb-events-card .gb-events-grid article::after { content:none; }
.gb-events-card .gb-events-grid article>i {
    position:absolute;
    left:22px;
    top:18px;
    z-index:2;
    width:15px;
    height:15px;
    display:grid;
    place-items:center;
    border:1px solid color-mix(in srgb,var(--gb-cyan) 30%,transparent);
    border-radius:5px;
    background:var(--gb-bg);
    color:var(--gb-cyan);
    font-size:8px;
}
.gb-events-card .gb-events-grid article>div { position:static; min-width:0; display:flex; flex-wrap:wrap; align-items:center; gap:3px 6px; }
.gb-events-card .gb-events-grid article strong {
    min-width:0;
    overflow:hidden;
    color:var(--gb-text);
    font:700 11px/1.3 var(--font-body);
    text-overflow:ellipsis;
    white-space:nowrap;
    flex-basis:100%;
    text-shadow:none;
}
.gb-events-card .gb-events-grid article small {
    flex:0 0 auto;
    margin:0;
    padding:1px 5px;
    border:1px solid var(--gb-line);
    border-radius:4px;
    color:var(--gb-muted);
    font:600 9px/1.3 var(--font-mono);
    font-variant-numeric:tabular-nums;
}
.gb-events-card .gb-events-grid [data-event-active] {
    position:static;
    flex:0 0 auto;
    margin:0;
    padding:1px 5px;
    border:1px solid var(--gb-green);
    border-radius:4px;
    background:color-mix(in srgb,var(--gb-green) 14%,transparent);
    color:var(--gb-green);
    font:700 8px/1.3 var(--font-body);
    text-transform:uppercase;
    letter-spacing:.05em;
}
.gb-events-card .gb-events-grid time {
    grid-column:auto;
    position:static;
    left:auto;
    right:auto;
    bottom:auto;
    flex-direction:column;
    align-items:flex-end;
    justify-content:center;
    gap:0;
    height:auto;
    width:auto;
    margin:0;
    padding:0 0 0 9px;
    border-top:0;
    border-left:1px solid var(--gb-line);
    background:none;
    color:var(--gb-muted);
}
.gb-events-card .gb-events-grid time span { position:static; width:auto; height:auto; overflow:visible; clip-path:none; font:700 8px/1.3 var(--font-body); text-transform:uppercase; letter-spacing:.06em; }
.gb-events-card .gb-events-grid time b { color:var(--gb-cyan); font:700 12px/1.1 var(--font-mono); font-variant-numeric:tabular-nums; letter-spacing:0; white-space:nowrap; }
.gb-events-card .gb-events-grid article.ev-active { border-color:color-mix(in srgb,var(--gb-green) 55%,transparent); }
.gb-events-card .gb-events-grid article.ev-active time b,
.gb-events-card .gb-events-grid article.ev-active>i { color:var(--gb-green); }
.gb-events-card .mu-event-zone { margin:0; padding:0 8px 8px; color:var(--gb-muted); font:10px/1.4 var(--font-body); overflow-wrap:anywhere; }
.gb-events-card .gb-events-pager { background:none; flex:0 0 auto; flex-wrap:wrap; gap:8px; }
.gb-events-card .gb-events-pager[hidden] { display:none; }
.gb-events-card .mu-event-zone { flex:0 0 auto; }
.gb-events-card .gb-events-pager button:focus-visible { outline:2px solid var(--gb-cyan); outline-offset:2px; }
@media(max-width:1100px) { .gb-home-grid-events { grid-template-columns:1fr; } }
@media(max-width:600px) {
    .gb-home-grid-events { --home-panel-height:480px; }
    .gb-events-card .gb-events-grid { gap:3px; padding:6px; }
    .gb-events-card .gb-events-grid article { grid-template-columns:30px minmax(0,1fr) auto; gap:7px; padding:3px 8px; }
    .gb-events-card .hk-event-art { width:30px; height:30px; }
    .gb-events-card .gb-events-grid article>i { left:24px; top:22px; width:16px; height:16px; }
    .gb-events-card .gb-events-pager button { min-height:44px; }
}
@media(prefers-reduced-motion:reduce) { .gb-events-card .hk-event-art { transition:none; } }