/* ==========================================================================
   Today @ Juniata — glass bento dashboard (uses tokens from arch-portal.css)
   ========================================================================== */

.taj-bento {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-areas:
        "hello hello now   apps"
        "feat  feat  week  apps"
        "ann   ann   week  sport"
        "ann   ann   week  share";
    color: var(--arch-text);
}
.taj-bento--nofeat {
    grid-template-areas:
        "hello hello now   apps"
        "ann   ann   week  apps"
        "ann   ann   week  sport"
        "ann   ann   week  share";
}
.taj-bento h1, .taj-bento h2, .taj-bento h3, .taj-bento p { margin: 0; font-family: var(--arch-font); }
.taj-bento a { color: inherit; }
.taj-bento ul { margin: 0; padding: 0; list-style: none; }

.taj-tile { min-width: 0; padding: 22px; }
.taj-tile__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
}
.taj-tile__head h2,
.taj-tile__title {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 16px;
    font-weight: 800;
    color: #fff;
}
.taj-tile__title { margin-bottom: 12px !important; }
.taj-tile__head .arch-icon, .taj-tile__title .arch-icon { opacity: .85; }

.taj-pill-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 0;
    border-radius: 999px;
    background: var(--arch-soft);
    color: #fff !important;
    font: 700 13px/1.2 var(--arch-font);
    text-decoration: none !important;
    cursor: pointer;
}
.taj-pill-btn:hover { background: var(--arch-soft-2); }
.taj-pill-btn .arch-icon { width: 14px; height: 14px; }
.taj-pill {
    padding: 4px 11px;
    border-radius: 999px;
    background: var(--arch-soft);
    font-size: 13px;
    font-weight: 700;
}
.taj-empty { padding: 10px 0; color: var(--arch-text-2); }
.taj-link-btn {
    padding: 0;
    border: 0;
    background: none;
    color: #fff;
    font: inherit;
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
}

/* ---------- Greeting ------------------------------------------------------ */
.taj-hello {
    grid-area: hello;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 24px;
    padding: 30px;
    background: var(--arch-glass-blue);
}
.taj-hello__date { color: var(--arch-text-2); font-weight: 600; }
.taj-hello__title {
    margin-top: 4px !important;
    font-size: 44px !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
    letter-spacing: -.03em;
    color: #fff;
}
.taj-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px !important; }
.taj-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    border-radius: 999px;
    background: var(--arch-soft);
    font-size: 13.5px;
    font-weight: 600;
}
.taj-chip b { color: var(--arch-gold); }

.taj-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
    color: var(--arch-text-2) !important;
    font-weight: 700;
    text-decoration: none !important;
}
.taj-back:hover { color: #fff !important; text-decoration: underline !important; }
.taj-back .arch-icon { width: 16px; height: 16px; }

.taj-search {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 5px 5px 5px 16px;
    border-radius: 999px;
    background: rgba(255,255,255,.95);
    color: var(--arch-ink);
}
.taj-search:focus-within { box-shadow: 0 0 0 3px var(--arch-gold); }
.taj-search__icon { color: var(--arch-ink-2); }
.taj-search input {
    flex: 1;
    min-width: 0;
    height: auto;
    padding: 10px 6px;
    border: 0 !important;
    outline: 0;
    background: transparent;
    box-shadow: none !important;
    font: 15.5px var(--arch-font);
    color: var(--arch-ink);
}
.taj-search input::placeholder { color: #5d6878; }
.taj-search button {
    padding: 10px 18px;
    border: 0;
    border-radius: 999px;
    background: var(--arch-navy);
    color: #fff;
    font: 700 14.5px/1 var(--arch-font);
    cursor: pointer;
}
.taj-search button:hover { background: #26497a; }

/* ---------- Up next ------------------------------------------------------- */
.taj-now { grid-area: now; display: flex; flex-direction: column; }
.taj-now__label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #ffd8d2;
    font-size: 13px;
    font-weight: 800;
}
.taj-live {
    width: 9px; height: 9px;
    border-radius: 50%;
    background: #ff6b57;
    animation: taj-live 1.8s infinite;
}
@keyframes taj-live {
    0%   { box-shadow: 0 0 0 0 rgba(255,107,87,.7); }
    70%  { box-shadow: 0 0 0 9px rgba(255,107,87,0); }
    100% { box-shadow: 0 0 0 0 rgba(255,107,87,0); }
}
.taj-now__title { margin-top: 12px !important; font-size: 20px; font-weight: 800; line-height: 1.2; }
.taj-now__title a { text-decoration: none; }
.taj-now__title a:hover { text-decoration: underline; }
.taj-now__meta { margin-top: 6px !important; color: var(--arch-text-2); font-size: 14px; }
.taj-now__count { margin-top: auto !important; padding-top: 16px; color: var(--arch-text-2); font-size: 13.5px; }
.taj-now__count b { display: block; color: #fff; font-size: 30px; letter-spacing: -.02em; line-height: 1.15; }

/* ---------- My apps ------------------------------------------------------- */
.taj-apps { grid-area: apps; }
.taj-apps__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.taj-app {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    height: 100%;
    padding: 14px;
    border-radius: 16px;
    background: var(--arch-soft);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    text-decoration: none !important;
    transition: background .15s;
}
.taj-app:hover { background: var(--arch-soft-2); }
.taj-app__icon {
    display: grid;
    place-items: center;
    width: 36px; height: 36px;
    border-radius: 11px;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.2);
}
.taj-apps__picker { margin: 0; padding: 0; border: 0; min-width: 0; }
.taj-apps__options { display: grid; gap: 2px; max-height: 340px; overflow-y: auto; }

/* Thin, glass-friendly scrollbars (instead of the browser's white default) */
.taj-apps__options,
.taj-week__scroll { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.35) transparent; }
.taj-apps__options::-webkit-scrollbar,
.taj-week__scroll::-webkit-scrollbar { width: 8px; }
.taj-apps__options::-webkit-scrollbar-track,
.taj-week__scroll::-webkit-scrollbar-track { background: transparent; }
.taj-apps__options::-webkit-scrollbar-thumb,
.taj-week__scroll::-webkit-scrollbar-thumb { background: rgba(255,255,255,.3); border-radius: 8px; }
.taj-apps__options label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 8px 10px;
    border-radius: 10px;
    font-size: 14.5px;
    font-weight: 600;
    cursor: pointer;
}
.taj-apps__options label:hover { background: var(--arch-soft); }
.taj-apps__options input { width: 18px; height: 18px; margin: 0; accent-color: var(--arch-gold); }
.taj-apps__hint { margin-top: 10px !important; color: var(--arch-text-2); font-size: 13px; }

/* ---------- Daily feature ------------------------------------------------- */
.taj-feat { grid-area: feat; display: grid; gap: 28px; align-content: start; padding: 0; overflow: hidden; }
.taj-feat__item { display: flex; flex-direction: column; }
.taj-feat__item + .taj-feat__item { border-top: 1px solid var(--arch-edge); }

/* Banner: the whole image is always visible (flyers keep their text);
   a blurred, darkened copy of the same image fills any leftover space. */
.taj-feat__media {
    position: relative;
    display: grid;
    place-items: center;
    height: 300px;
    overflow: hidden;
    background: rgba(255,255,255,.06);
    isolation: isolate;
}
.taj-feat__media::before {
    content: "";
    position: absolute;
    inset: -40px;
    z-index: -1;
    background: var(--taj-feat-img) center / cover no-repeat;
    filter: blur(28px) saturate(1.2) brightness(.65);
}
.taj-feat__media img {
    display: block;
    max-width: calc(100% - 40px);
    max-height: 268px;   /* banner height minus breathing room */
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 12px;
    box-shadow: 0 16px 36px -14px rgba(0,0,0,.6);
}
.taj-feat__body { padding: 22px 26px 26px; }

/* Long posts collapse to ~5 lines with a fade; "Read more" expands. */
.taj-feat__content.is-clamped {
    max-height: 8em;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent);
    mask-image: linear-gradient(180deg, #000 55%, transparent);
}
.taj-feat__more { margin-top: 12px; }
.taj-feat__kicker { margin-bottom: 8px !important; color: var(--arch-gold); font-size: 13.5px; font-weight: 800; }
.taj-feat__title { font-size: 26px !important; line-height: 1.15 !important; font-weight: 800 !important; letter-spacing: -.02em; color: #fff; }
.taj-feat__sub { margin-top: 6px !important; color: var(--arch-text-2); font-weight: 600; }
.taj-feat__content { margin-top: 10px; color: var(--arch-text-2); }
.taj-feat__content p { margin: 0 0 .8em !important; }
.taj-feat__content a { color: #fff !important; text-decoration: underline; }
.taj-feat__content img { max-width: 100%; height: auto; border-radius: 10px; }
.taj-feat__content h1, .taj-feat__content h2, .taj-feat__content h3, .taj-feat__content h4 { color: #fff; font-size: 18px; }

/* ---------- This week ----------------------------------------------------- */
.taj-week { grid-area: week; display: flex; flex-direction: column; min-height: 0; }
/* The list fills whatever height the neighbouring tiles give this column.
   height:0 + flex-grow keeps the list from stretching the row itself; it scrolls instead. */
.taj-week__scroll {
    flex: 1 1 auto;
    height: 0;
    min-height: 320px;
    overflow-y: auto;
    margin-right: -8px;
    padding-right: 8px;
    overscroll-behavior: contain;
}
.taj-day + .taj-day { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--arch-edge); }
.taj-day__label { margin-bottom: 8px !important; color: var(--arch-gold); font-size: 13.5px !important; font-weight: 800 !important; }
.taj-events { display: grid; gap: 10px; }
.taj-event { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; gap: 8px; align-items: start; font-size: 14px; }
.taj-event__time { padding-top: 1px; color: var(--arch-text-2); font-size: 13px; font-weight: 700; white-space: nowrap; }
.taj-event__main { font-weight: 600; line-height: 1.35; }
.taj-event__main a { text-decoration: none; }
.taj-event__main a:hover { text-decoration: underline; }
.taj-event__main small { display: block; color: var(--arch-text-2); font-size: 12.5px; font-weight: 500; }
.taj-event.is-off .taj-event__time { text-decoration: line-through; opacity: .7; }
.taj-event.is-off .taj-event__main > a,
.taj-event.is-off .taj-event__main { text-decoration-line: none; }
.taj-event__status { display: inline-block !important; margin: 2px 0; padding: 1px 7px; border-radius: 999px; background: #b42318; color: #fff !important; font-weight: 700 !important; font-size: 11.5px !important; }
.taj-cal {
    display: grid;
    place-items: center;
    width: 30px; height: 30px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: none;
    color: var(--arch-text-2);
    cursor: pointer;
}
.taj-cal:hover { background: var(--arch-soft); color: #fff; }
.taj-cal .arch-icon { width: 17px; height: 17px; }
.taj-cal.is-done { color: var(--arch-gold); }

/* ---------- Announcements ------------------------------------------------- */
.taj-ann { grid-area: ann; }
.taj-anns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.taj-ann__item {
    position: relative;
    display: flex;
    gap: 14px;
    padding: 12px;
    border-radius: 16px;
    background: var(--arch-soft);
    transition: background .15s;
}
.taj-ann__item:hover { background: var(--arch-soft-2); }
.taj-ann__item:focus-within { outline: 3px solid var(--arch-gold); outline-offset: 2px; }
.taj-ann__media {
    display: grid;
    place-items: center;
    width: 64px; height: 64px;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 800;
}
.taj-ann__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.taj-tone-0 { background: #d8c99a; color: #2a2410; }
.taj-tone-1 { background: #e7eef6; color: #1B365D; }
.taj-tone-2 { background: #4e6d93; color: #fff; }
.taj-tone-3 { background: #8a9b74; color: #17200f; }
.taj-tone-4 { background: #9a4733; color: #fff; }
.taj-tone-5 { background: #ece4cf; color: #2a2410; }
.taj-ann__body { min-width: 0; }
.taj-ann__who { color: var(--arch-gold); font-size: 12.5px; font-weight: 700; }
.taj-ann__title { margin-top: 2px !important; font-size: 15px !important; line-height: 1.3 !important; font-weight: 700 !important; color: #fff; }
.taj-ann__title a { text-decoration: none; }
.taj-ann__title a::after { content: ""; position: absolute; inset: 0; border-radius: 16px; }
.taj-ann__title a:focus-visible { outline: none; }
.taj-ann__item:hover .taj-ann__title a { text-decoration: underline; }
.taj-ann__summary {
    margin-top: 4px !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: var(--arch-text-2);
    font-size: 13.5px;
    line-height: 1.45;
}
.taj-ann__meta { display: flex; align-items: flex-start; gap: 6px; margin-top: 6px !important; color: var(--arch-text-2); font-size: 13px; }
.taj-ann__meta .arch-icon { width: 14px; height: 14px; margin-top: 2px; }

/* ---------- Athletics ----------------------------------------------------- */
.taj-sport { grid-area: sport; }
.taj-game { display: flex; align-items: center; gap: 12px; padding: 10px 0; }
.taj-game + .taj-game { border-top: 1px solid var(--arch-edge); }
.taj-game__badge {
    flex-shrink: 0;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--arch-soft-2);
    font-size: 11.5px;
    font-weight: 800;
}
.taj-game__badge.is-home { background: var(--arch-gold); color: #2a2410; }
.taj-game__main { font-size: 14px; font-weight: 600; line-height: 1.3; }
.taj-game__main a { text-decoration: none; }
.taj-game__main a:hover { text-decoration: underline; }
.taj-game__main small { display: block; color: var(--arch-text-2); font-size: 12.5px; font-weight: 500; }

/* ---------- Share --------------------------------------------------------- */
.taj-share { grid-area: share; background: var(--arch-glass-sand); color: var(--arch-ink); border-color: rgba(255,255,255,.55); }
.taj-share .taj-tile__title { color: var(--arch-ink); }
.taj-share ul { display: grid; gap: 7px; font-size: 14.5px; }
.taj-share a { color: var(--arch-navy) !important; font-weight: 700; text-decoration: none; }
.taj-share a:hover { text-decoration: underline; }
.taj-share__mine { margin-top: 4px; padding-top: 9px; border-top: 1px solid rgba(29,39,56,.15); }
.taj-share p { font-size: 14.5px; color: var(--arch-ink-2); }
.taj-share__signin {
    display: inline-block;
    margin-top: 12px;
    padding: 8px 16px;
    border-radius: 999px;
    background: var(--arch-navy);
    color: #fff !important;
}

/* ---------- Responsive ---------------------------------------------------- */
@media (max-width: 1100px) {
    .taj-bento, .taj-bento--nofeat {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-areas:
            "hello hello"
            "now   apps"
            "feat  feat"
            "ann   ann"
            "week  sport"
            "week  share";
    }
    .taj-bento--nofeat {
        grid-template-areas: "hello hello" "now apps" "ann ann" "week sport" "week share";
    }
}
@media (max-width: 680px) {
    .taj-bento, .taj-bento--nofeat {
        grid-template-columns: 1fr;
        grid-template-areas: "hello" "now" "apps" "ann" "feat" "week" "sport" "share";
        gap: 12px;
    }
    .taj-bento--nofeat { grid-template-areas: "hello" "now" "apps" "ann" "week" "sport" "share"; }
    .taj-tile { padding: 18px; }
    .taj-hello { padding: 24px 20px; }
    .taj-hello__title { font-size: 34px !important; }
    .taj-feat__media { height: 220px; }
    .taj-feat__media img { max-height: 192px; }
    .taj-feat__body { padding: 18px 18px 20px; }
    .taj-anns { grid-template-columns: 1fr; }
    .taj-apps__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .taj-app { align-items: center; text-align: center; padding: 12px 6px; font-size: 13px; }
    .taj-week__scroll { height: auto; min-height: 0; overflow: visible; margin-right: 0; padding-right: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .taj-bento *, .taj-bento *::before { animation: none !important; transition: none !important; }
}

.taj-share li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 5px 0;
}

.taj-share__icon {
    display: block;
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
    color: #1B365D;
}

.taj-share li a:hover .taj-share__icon {
    color: #a89968;
}

.taj-share__mine {
    margin-top: 8px;
    padding-top: 12px;
    border-top: 1px solid rgba(29,39,56,.15);
}
/* ===== Compact dashboard top cards ===== */

@media (min-width: 1101px) {

    .taj-hello {
        padding: 20px 26px;
        gap: 14px;
    }

    .taj-hello__title {
        font-size: 36px !important;
        line-height: 1.1 !important;
    }

    .taj-chips {
        margin-top: 12px !important;
        gap: 7px;
    }

    .taj-chip {
        padding: 5px 11px;
        font-size: 12.5px;
    }

    .taj-search {
        padding: 3px 4px 3px 14px;
    }

    .taj-search input {
        padding: 7px 6px;
    }

    .taj-search button {
        padding: 9px 17px;
    }

    .taj-now {
        padding: 20px;
    }

    .taj-now__title {
        margin-top: 8px !important;
        font-size: 18px;
    }

    .taj-now__count {
        padding-top: 10px;
    }

    .taj-now__count b {
        font-size: 25px;
    }
}
/* Fix Share with Campus sign-in button */

.taj-share .taj-share__signin,
.taj-share .taj-share__signin:visited {
    background: #1B365D;
    color: #ffffff !important;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
}

.taj-share .taj-share__signin:hover {
    background: #294b78;
    color: #ffffff !important;
}

/* ==========================================================================
   A LITTLE JUNIATA GOLD
   Light touches of gold on the glass tiles. Light gold (--arch-gold #d6c592)
   is used on the dark glass; Juniata gold (#A89968) for bars and rules.
   Text colours are unchanged, so contrast stays the same.
   To go back, delete this whole block.
   ========================================================================== */
.taj-bento { --taj-gold: #A89968; --taj-gold-soft: rgba(214, 197, 146, .18); --taj-gold-line: rgba(214, 197, 146, .45); }

/* Every tile: a thin gold highlight along the top edge */
.taj-bento .taj-tile { box-shadow: inset 0 2px 0 var(--taj-gold-line), var(--arch-shadow); }

/* Tile headings: gold icons */
.taj-tile__head .arch-icon,
.taj-tile__title .arch-icon { color: var(--arch-gold); opacity: 1; }

/* Greeting: gold rule along the bottom, gold-edged chips, gold-trimmed search button */
.taj-hello { border-bottom: 3px solid var(--taj-gold); }
.taj-chip { box-shadow: inset 0 0 0 1px var(--taj-gold-line); }
.taj-search button { box-shadow: inset 0 -3px 0 var(--taj-gold); }

/* Up next: the big countdown number in gold */
.taj-now__count b { color: var(--arch-gold); }

/* My apps: gold ring on hover */
.taj-app:hover { box-shadow: inset 0 0 0 1px var(--taj-gold-line); }
.taj-app:hover .taj-app__icon { box-shadow: inset 0 0 0 1px rgba(255,255,255,.2), 0 0 0 2px var(--arch-gold); }

/* Daily feature: gold bar between the image and the story */
.taj-feat__media { border-bottom: 3px solid var(--taj-gold); }

/* This week: gold rail beside each day's events */
.taj-bento .taj-events { padding-left: 12px; border-left: 2px solid var(--taj-gold-line); }
.taj-cal:hover { color: var(--arch-gold); }

/* Announcements: gold edge appears on hover */
.taj-ann__item { box-shadow: inset 3px 0 0 transparent; transition: background .15s, box-shadow .15s; }
.taj-ann__item:hover { box-shadow: inset 3px 0 0 var(--arch-gold); }

/* Pill buttons and soft pills: faint gold edge */
.taj-pill-btn:hover { box-shadow: inset 0 0 0 1px var(--taj-gold-line); }
.taj-pill { box-shadow: inset 0 0 0 1px var(--taj-gold-line); }

/* Share tile (sand): gold bar on top */
.taj-share { border-top: 4px solid var(--taj-gold); }

/* Scrollbars: gold thumb */
.taj-apps__options,
.taj-week__scroll { scrollbar-color: rgba(214,197,146,.55) transparent; }
.taj-apps__options::-webkit-scrollbar-thumb,
.taj-week__scroll::-webkit-scrollbar-thumb { background: rgba(214,197,146,.55); }

@media (prefers-reduced-motion: reduce) {
    .taj-ann__item { transition: none; }
}


/* ==========================================================================
   LAYOUT TWEAKS
   1. Submission tools: a slim glass strip instead of a tall navy bar
      (only people who post use it; the Share tile has the same links).
   2. Right column: My apps, Go Eagles and Share stack straight under each
      other, so there's no empty glass under My apps.
   3. Go Eagles a little bigger.
   (Needs the matching today-at-juniata.php: nav has .arch-glass and the
   three right-hand tiles are wrapped in <div class="taj-side">.)
   ========================================================================== */

/* ---------- 1. Slim submission tools strip ------------------------------ */
.taj-submit-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px;
    margin: 0 0 14px;
    padding: 4px;
    border-radius: 999px;
    border-bottom: 2px solid var(--taj-gold-line, rgba(214,197,146,.45));
}
.taj-submit-nav a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 13px;
    border-radius: 999px;
    color: var(--arch-text-2) !important;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none !important;
    white-space: nowrap;
    transition: background .15s, color .15s;
}
.taj-submit-nav a:hover,
.taj-submit-nav a:focus-visible { background: var(--arch-soft); color: #fff !important; }
.taj-submit-nav .arch-icon { width: 15px; height: 15px; color: var(--arch-gold); }

/* Phones: one scrollable row instead of four stacked full-width buttons */
@media (max-width: 768px) {
    .taj-submit-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        border-radius: 14px;
        scrollbar-width: none;
    }
    .taj-submit-nav::-webkit-scrollbar { display: none; }
}

/* ---------- 2. Right column stack --------------------------------------- */
@media (min-width: 1101px) {
    .taj-bento {
        grid-template-areas:
            "hello hello now   side"
            "feat  feat  week  side"
            "ann   ann   week  side"
            "ann   ann   week  side";
    }
    .taj-bento--nofeat {
        grid-template-areas:
            "hello hello now   side"
            "ann   ann   week  side"
            "ann   ann   week  side"
            "ann   ann   week  side";
    }
}
.taj-side {
    grid-area: side;
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
    align-self: start;
}
/* Tablet / phone: the tiles go back to their own places in the grid */
@media (max-width: 1100px) {
    .taj-side { display: contents; }
}

/* ---------- 3. Go Eagles, a little bigger -------------------------------- */
.taj-sport .taj-tile__title { font-size: 18px; }
.taj-sport .taj-tile__title .arch-icon { width: 20px; height: 20px; }
.taj-game { gap: 14px; padding: 12px 0; }
.taj-game__badge { padding: 4px 10px; font-size: 12px; }
.taj-game__main { font-size: 15.5px; font-weight: 700; }
.taj-game__main small { margin-top: 2px; font-size: 13px; }