/* GUIDE LOOK: Top Hat (config sites.guide_looks.tophat) — magicshowvegas.com, Pete's DiffUI pick D of the SECOND round, 11/15
   (project a0dcf157, build 9a5c2c8b). The first build (a cartoon rabbit, bubbly letters, rainbow neon) he called "way too
   childish"; this one is a grown-up magic theatre: black page, gold and white small-caps serif lettering, deep red
   curtains, a top hat with cards fanning to a gloved hand and wand, violet stage light, thin gold outlines, gold buttons.
   Flat art, no glossy renders. Started from the Stand-Up look's structure, recoloured for a dark page.
   Loaded by templates/guide/header.blade.php, so it also reaches the site's articles, /tonight and show pages. */
:is(body.tpl-guide.gd-look-tophat, body.tpl-page-guide, body.tpl-show-guide) {
    --mg-page: #000000; --mg-card: #0d0b11; --mg-navy: #ffffff; --mg-blue: #d9b65a; --mg-blue-deep: #f1d98e; --mg-magenta: #d9b65a;
    --mg-yellow: #e1b851; --mg-line: #3d3218; --mg-soft: #cdc6b6; --mg-edge: #8f7430; --mg-wine: #7a1030;
    --mg-display: 'Cinzel', 'Trajan Pro', Georgia, serif; --mg-semi: 'EB Garamond', Georgia, 'Times New Roman', serif; --mg-text: 'EB Garamond', Georgia, 'Times New Roman', serif;
    --nl-bg: #7a1030; --nl-ink: #ffffff; --nl-btn: #e1b851; --nl-btn-ink: #14100a; --nl-accent: #e1b851; --nl-bulb: #e1b851;
    /* the engine's own tokens, re-pointed so every shared rule lands in this palette */
    --gd-navy: var(--mg-page); --gd-navy-deep: var(--mg-card); --gd-gold: var(--mg-navy); --gd-gold-deep: var(--mg-navy); --gd-cream: var(--mg-card); --gd-ink: var(--mg-navy);
    --gd-slab: var(--mg-display); --gd-label: var(--mg-semi); --gd-text: var(--mg-text);
    --mg-i-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7zm0 4.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5z'/%3E%3C/svg%3E");
    --mg-i-cal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M7 2v2H4v18h16V4h-3V2h-2v2H9V2zM6 9h12v11H6zm2 2v2h2v-2zm3 0v2h2v-2zm3 0v2h2v-2zm-6 4v2h2v-2zm3 0v2h2v-2zm3 0v2h2v-2z'/%3E%3C/svg%3E");
    --mg-i-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 2.4a7.6 7.6 0 1 1 0 15.2 7.6 7.6 0 0 1 0-15.2zM11 7v6l4.6 2.7 1-1.7-3.6-2.1V7z'/%3E%3C/svg%3E");
    --mg-i-tag: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M3 12.6V4h8.6l9.4 9.4-8.6 8.6zM7.5 6.6a1.8 1.8 0 1 0 0 3.6 1.8 1.8 0 0 0 0-3.6z'/%3E%3C/svg%3E");
    --mg-i-ticket: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg transform='rotate(-32 12 12)'%3E%3Cpath fill-rule='evenodd' d='M1 6.5h22v3.6a1.9 1.9 0 0 0 0 3.8v3.6H1v-3.6a1.9 1.9 0 0 0 0-3.8zm14 2v1.6h1.6V8.5zm0 3v1.6h1.6V11.5zm0 3v1h1.6v-1z'/%3E%3C/g%3E%3C/svg%3E");
    --mg-i-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3 6.6 7.2.8-5.3 4.9 1.5 7.1L12 17.8l-6.4 3.6 1.5-7.1L1.8 9.4 9 8.6z'/%3E%3C/svg%3E");
    --mg-i-glass: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M6 2h12v2h-1v3.5L13.5 12l3.5 4.5V20h1v2H6v-2h1v-3.5L10.5 12 7 7.5V4H6zm3 2v2.8l3 3.8 3-3.8V4z'/%3E%3C/svg%3E");
    --mg-i-food: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2v7a2 2 0 0 0 1.5 1.9V22h2V10.9A2 2 0 0 0 12 9V2h-1.3v6h-.8V2H9.1v6h-.8V2zm9 0c-1.7 1-3 3.5-3 6.5 0 2 .8 3.4 2 4V22h2V2z'/%3E%3C/svg%3E");
}
body.tpl-guide.gd-look-tophat { background: var(--mg-page); color: var(--mg-navy); font-family: var(--mg-text); }

/* ---- the navy frame: header on top, the page under it ---------------------------------------- */
.site-header.gd-header.gd-header--tophat { width: calc(100% - 20px); max-width: 1372px; margin: 10px auto 0; background: var(--mg-page); border: 2px solid var(--mg-edge); border-radius: 10px 10px 0 0; box-shadow: none; }
body.tpl-guide.gd-look-tophat main.gd { width: calc(100% - 20px); max-width: 1372px; margin: 0 auto 26px; padding: 0 14px 26px; background: var(--mg-page); border: 2px solid var(--mg-edge); border-top: 0; border-radius: 0 0 10px 10px; }

/* ---- header: COMEDY (blue) VEGAS (magenta), spaced tag line under it, navy menu ------------------ */
.gd-header--tophat .gd-header-inner { max-width: none; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; align-items: center; gap: 0 12px; min-height: 0; padding: 8px 8px 8px 16px; }
.gd-header--tophat .gd-mark { grid-column: 1; grid-row: 1; font-family: 'Cinzel', 'Trajan Pro', Georgia, serif; font-weight: 900; font-size: clamp(38px, 10.6vw, 44px); line-height: .9; letter-spacing: -.005em; text-transform: uppercase; color: #d9b65a !important; }
.gd-header--tophat .gd-mark span { margin-left: .16em; color: #d9b65a; }
.gd-header--tophat .gd-tagline { display: block; grid-column: 1; grid-row: 2; margin: 4px 0 0 4px; font-family: 'EB Garamond', Georgia, 'Times New Roman', serif; font-weight: 700; font-size: 11px; line-height: 1.2; letter-spacing: .26em; word-spacing: .3em; text-transform: uppercase; color: #ffffff; white-space: nowrap; }
.gd-header--tophat .gd-nav { grid-column: 2; grid-row: 1 / span 2; gap: 4px 44px; }
.gd-header--tophat .gd-nav a { padding: 6px 0; font-family: 'EB Garamond', Georgia, 'Times New Roman', serif; font-weight: 600; font-size: clamp(19px, 1.9vw, 25px); letter-spacing: 0; text-transform: none; color: #ffffff; border-bottom: 3px solid transparent; }
.gd-header--tophat .gd-nav a:hover, .gd-header--tophat .gd-nav a:focus-visible { color: #d9b65a; border-bottom-color: #d9b65a; }
.gd-header--tophat .gd-burger { grid-column: 2; grid-row: 1 / span 2; }
.gd-header--tophat .gd-burger-lines, .gd-header--tophat .gd-burger-lines::before, .gd-header--tophat .gd-burger-lines::after { background: #ffffff; }
@media (min-width: 760px) {
    .gd-header--tophat .gd-header-inner { padding: 14px 44px 14px 28px; }
    .gd-header--tophat .gd-mark { font-size: clamp(54px, 6.7vw, 88px); }
    .gd-header--tophat .gd-tagline { margin: 8px 0 0 20px; font-size: clamp(12px, 1.25vw, 16px); letter-spacing: .3em; }
}

/* ---- hero: headline left, drawing right (drawing under the text on phones) ------------------------ */
body.gd-look-tophat .gd-hero { display: grid; grid-template-columns: minmax(0, 1fr); padding: 18px 4px 16px; text-align: left; }
body.gd-look-tophat .gd-hero-rule { display: none; }
body.gd-look-tophat .gd-hero-art { display: block; order: 5; margin: 16px 0 0; }
body.gd-look-tophat .gd-hero-art .mg-stage { display: block; width: 100%; height: auto; aspect-ratio: 600 / 440; }
body.tpl-guide.gd-look-tophat .gd .gd-hero h1, body.tpl-guide.gd-look-tophat .gd .gd-hero h1.gd-h1--long { margin: 0; max-width: none; font-family: var(--mg-display); font-weight: 900; font-size: clamp(44px, 13.6vw, 66px); line-height: .97; letter-spacing: -.005em; text-transform: uppercase; text-shadow: none; text-wrap: wrap; white-space: nowrap; color: var(--mg-blue); }
body.gd-look-tophat .gd-hero h1 .gd-h1-topic { color: inherit; }
body.gd-look-tophat .gd-hero h1 .gd-h1-topic::after { content: '\A'; white-space: pre; }
body.gd-look-tophat .gd-hero h1 .gd-h1-city { display: block; color: var(--mg-magenta); }
body.gd-look-tophat .gd-intro { margin: 10px 0 0; max-width: 31em; font-family: var(--mg-text); font-weight: 400; font-size: 17px; line-height: 1.34; color: var(--mg-navy); text-wrap: wrap; }
body.tpl-guide.gd-look-tophat .gd .gd-updated { margin: 12px 0 0; font-family: var(--mg-text); font-weight: 400; font-size: 15px; line-height: 1.35; letter-spacing: 0; text-transform: none; color: var(--mg-navy); }
body.tpl-guide.gd-look-tophat .gd .gd-updated a { font-weight: 700; color: var(--mg-blue); text-decoration: none; }
body.tpl-guide.gd-look-tophat .gd .gd-updated a:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 859px) {
    body.gd-look-tophat .gd-credit { display: block; }
    body.gd-look-tophat .gd-credit-dot { display: none; }
}
@media (min-width: 860px) {
    body.tpl-guide.gd-look-tophat main.gd { padding: 0 28px 36px; }
    body.gd-look-tophat .gd-hero { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); column-gap: 8px; align-items: center; padding: 22px 0 22px; }
    body.gd-look-tophat .gd-hero > * { grid-column: 1; }
    body.gd-look-tophat .gd-hero-art { order: 0; grid-column: 2; grid-row: 1 / span 6; margin: 0; align-self: center; }
    body.gd-look-tophat .gd-hero-art .mg-stage { aspect-ratio: 600 / 440; }
    body.tpl-guide.gd-look-tophat .gd .gd-hero h1, body.tpl-guide.gd-look-tophat .gd .gd-hero h1.gd-h1--long { font-size: clamp(56px, 9.3vw, 128px); }
    body.gd-look-tophat .gd-intro { margin-top: 14px; max-width: 19.5em; font-size: clamp(18px, 2.15vw, 29px); }
    body.tpl-guide.gd-look-tophat .gd .gd-updated { margin-top: 16px; font-size: clamp(15px, 1.55vw, 20px); }
}

/* ---- filter box: "Show type" chips | "Sort by" chips ------------------------------------------- */
body.gd-look-tophat .gd-filter { margin: 0 0 16px; padding: 14px 14px 16px; gap: 10px 10px; border: 2px solid var(--mg-edge); border-radius: 10px; background: var(--mg-page); }
body.gd-look-tophat .gd-filter-label { margin-right: 4px; font-family: var(--mg-semi); font-weight: 700; font-size: 18px; color: var(--mg-navy); }
body.gd-look-tophat .gd-chip { padding: 8px 18px; border: 2px solid var(--mg-blue); border-radius: 999px; background: var(--mg-card); color: var(--mg-blue-deep); font-family: var(--mg-semi); font-weight: 700; font-size: 17px; line-height: 1.15; }
body.gd-look-tophat .gd-chip.is-on { background: var(--mg-blue); color: #fff; }
body.gd-look-tophat .gd-chip:hover, body.gd-look-tophat .gd-chip:focus-visible { background: #1d1810; }
body.gd-look-tophat .gd-chip.is-on:hover, body.gd-look-tophat .gd-chip.is-on:focus-visible { background: var(--mg-blue-deep); }
body.gd-look-tophat .gd-sort { gap: 10px; }
@media (max-width: 1199px) {
    body.gd-look-tophat .gd-sort { flex: 1 1 100%; margin: 6px 0 0; padding-top: 16px; border-top: 1.5px solid var(--mg-edge); }
}
@media (min-width: 1200px) {
    body.gd-look-tophat .gd-filter { position: relative; flex-wrap: nowrap; align-items: flex-end; margin-bottom: 22px; padding: 50px 16px 16px; gap: 8px; }
    body.gd-look-tophat .gd-filter > .gd-filter-label { position: absolute; top: 14px; left: 18px; font-size: clamp(18px, 1.7vw, 22px); }
    body.gd-look-tophat .gd-chip { padding: 9px 10px; border-radius: 8px; font-family: var(--mg-display); font-weight: 600; font-size: clamp(17px, 1.42vw, 21px); white-space: nowrap; }
    body.gd-look-tophat .gd-sort { position: relative; flex: 0 0 auto; flex-wrap: nowrap; gap: 8px; margin: -36px 0 -2px auto; padding: 36px 0 2px 16px; border-left: 1.5px solid var(--mg-edge); }
    body.gd-look-tophat .gd-sort .gd-filter-label { position: absolute; top: 0; left: 16px; font-size: clamp(18px, 1.7vw, 22px); }
}

/* ---- our shows: photo first, yellow Recommended tab, name, venue line, icon facts, yellow button ---- */
body.gd-look-tophat .gd-cards { gap: 16px; margin-top: 0; }
body.gd-look-tophat .gd-cards + .gd-cards { margin-top: 16px; }
body.tpl-guide.gd-look-tophat .gd .gd-shows .gd-card:not(.gd-card--plain) { background: var(--mg-card); border: 1.5px solid var(--mg-edge); border-radius: 6px; box-shadow: none !important; }
body.tpl-guide.gd-look-tophat .gd .gd-rec { top: 0; left: 0; padding: 6px 30px 6px 16px; background: var(--mg-yellow); color: var(--mg-navy); border-radius: 0; box-shadow: none; clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 100%, 0 100%); font-family: var(--mg-display); font-weight: 800; font-size: 18px; letter-spacing: .02em; line-height: 1.15; }
body.gd-look-tophat .gd-card-art { order: 1; margin: 0; }
body.gd-look-tophat .gd-card-art img { aspect-ratio: 5 / 3; object-position: center !important; border-radius: 0; }
body.tpl-guide.gd-look-tophat .gd .gd-card-name { order: 2; padding: 12px 16px 0; text-align: left; font-family: var(--mg-semi); font-weight: 700; font-size: clamp(29px, 3.3vw, 44px); line-height: 1.08; letter-spacing: -.005em; color: var(--mg-navy); text-shadow: none; }
body.tpl-guide.gd-look-tophat .gd .gd-card-name a { color: inherit; }
body.gd-look-tophat .gd-card-venue { display: block; order: 3; margin: 2px 16px 0; font-family: var(--mg-semi); font-weight: 700; font-size: clamp(19px, 1.95vw, 26px); line-height: 1.2; color: var(--mg-blue); }
body.gd-look-tophat .gd-honors { order: 3; margin: 4px 16px 0; color: var(--mg-soft); opacity: 1; }
body.gd-look-tophat .gd-ribbon { display: none; }
body.gd-look-tophat .gd-card-panel { order: 4; margin: 0; padding: 12px 16px 16px; background: transparent; border-radius: 0; }
body.gd-look-tophat .gd-facts { gap: 7px; margin-bottom: 14px; }
body.gd-look-tophat .gd-facts > div { grid-template-columns: 132px 1fr; gap: 8px; align-items: center; }
body.tpl-guide.gd-look-tophat .gd .gd-facts dt { display: flex; align-items: center; gap: 9px; font-family: var(--mg-text); font-weight: 700; font-size: 16.5px; letter-spacing: 0; text-transform: none; color: var(--mg-navy); }
body.gd-look-tophat .gd-facts dt::after { content: ':'; margin-left: -9px; }
body.gd-look-tophat .gd-facts dt::before { content: ''; flex: 0 0 21px; width: 21px; height: 21px; background: currentColor; -webkit-mask: var(--mg-i, var(--mg-i-pin)) center / contain no-repeat; mask: var(--mg-i, var(--mg-i-pin)) center / contain no-repeat; }
body.gd-look-tophat .gd-facts [data-fact="venue"] { --mg-i: var(--mg-i-pin); }
body.gd-look-tophat .gd-facts [data-fact="days"] { --mg-i: var(--mg-i-cal); }
body.gd-look-tophat .gd-facts [data-fact="showtime"] { --mg-i: var(--mg-i-clock); }
body.gd-look-tophat .gd-facts [data-fact="run-time"] { --mg-i: var(--mg-i-glass); }
body.gd-look-tophat .gd-facts [data-fact="food"] { --mg-i: var(--mg-i-food); }
body.gd-look-tophat .gd-facts [data-fact="from-price"] { --mg-i: var(--mg-i-tag); }
body.gd-look-tophat .gd-facts [data-fact="reviews"] { --mg-i: var(--mg-i-star); }
body.gd-look-tophat .gd-facts [data-fact="next-show"], body.gd-look-tophat .gd-facts [data-fact="next-date"] { --mg-i: var(--mg-i-ticket); }
body.tpl-guide.gd-look-tophat .gd .gd-facts dd { font-family: var(--mg-text); font-weight: 400; font-size: 16.5px; line-height: 1.25; color: var(--mg-navy); }
body.tpl-guide.gd-look-tophat .gd .gd-facts [data-fact="from-price"] dd { font-weight: 700; }
body.gd-look-tophat .gd-card-panel .gd-from-word { display: none; }
body.tpl-guide.gd-look-tophat .gd .gd-facts dd a { color: inherit; text-decoration: none; }
body.tpl-guide.gd-look-tophat .gd .gd-facts dd a:hover { text-decoration: underline; text-underline-offset: 3px; }
body.gd-look-tophat .gd-star { color: var(--mg-magenta) !important; }
/* Box Office: one flat yellow button, as drawn (no label above it, no second line, no badge). */
body.gd-look-tophat .gd-buy--direct { padding-top: 0; }
body.gd-look-tophat .gd-buy--direct .gd-buy-label, body.gd-look-tophat .gd-direct .gd-buy-price, body.gd-look-tophat .gd-direct .gd-direct-badge { display: none; }
body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct { min-height: 62px; padding: 8px 12px; background: var(--mg-yellow) !important; border: 1.5px solid var(--mg-edge) !important; border-radius: 8px; box-shadow: 0 2px 0 rgba(17, 31, 78, .3); font-family: var(--mg-display); }
body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct:hover, body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct:focus-visible { filter: none; transform: none; background: #ffd21f !important; }
body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-seller, body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-seller * { color: var(--mg-navy) !important; font-family: var(--mg-display); font-weight: 700; font-size: clamp(28px, 2.9vw, 36px); letter-spacing: 0; line-height: 1; }
@media (min-width: 860px) {
    body.gd-look-tophat .gd-cards { gap: 22px; }
    body.gd-look-tophat .gd-cards + .gd-cards { margin-top: 22px; }
    body.gd-look-tophat .gd-card-art img { aspect-ratio: 3 / 2; }
    body.tpl-guide.gd-look-tophat .gd .gd-rec { padding: 7px 36px 7px 22px; font-size: clamp(18px, 1.75vw, 23px); }
    body.tpl-guide.gd-look-tophat .gd .gd-card-name { padding: 18px 22px 0; }
    body.gd-look-tophat .gd-card-venue, body.gd-look-tophat .gd-honors { margin-left: 22px; margin-right: 22px; }
    body.gd-look-tophat .gd-card-panel { padding: 16px 22px 22px; }
    body.gd-look-tophat .gd-facts > div { grid-template-columns: 190px 1fr; gap: 10px; }
    body.tpl-guide.gd-look-tophat .gd .gd-card:not(.gd-card--plain) .gd-facts dt { gap: 12px; }
    body.gd-look-tophat .gd-card:not(.gd-card--plain) .gd-facts dt::after { margin-left: -12px; }
    body.tpl-guide.gd-look-tophat .gd .gd-facts dt, body.tpl-guide.gd-look-tophat .gd .gd-facts dd { font-size: clamp(18px, 1.75vw, 22px); }
    body.gd-look-tophat .gd-facts dt::before { flex-basis: 28px; width: 28px; height: 28px; }
    body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct { min-height: 70px; }
}

/* ---- outside shows: the same card language, smaller (thumbnail, name, facts, seller rows) ----------- */
body.tpl-guide.gd-look-tophat .gd .gd-card--plain { padding: 14px 16px 16px; background: var(--mg-card); border: 1.5px solid var(--mg-edge); border-radius: 6px; text-align: left; color: var(--mg-navy); }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-card-name { order: 0; padding: 0 0 2px; font-size: clamp(25px, 2.5vw, 32px); }
body.gd-look-tophat .gd-card--plain .gd-honors { margin: 2px 0 0; }
body.gd-look-tophat .gd-card-sub { font-family: var(--mg-semi); font-weight: 700; font-size: 16px; letter-spacing: 0; text-transform: none; color: var(--mg-blue); }
body.gd-look-tophat .gd-out-art { margin: 0 0 10px; }
body.gd-look-tophat .gd-out-art img { border: 1.5px solid var(--mg-edge); border-radius: 4px; }
body.gd-look-tophat .gd-card--plain .gd-facts { max-width: none; margin: 10px 0 12px; gap: 5px; color: var(--mg-navy); }
body.gd-look-tophat .gd-card--plain .gd-facts > div { grid-template-columns: 138px 1fr; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-facts dt, body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-facts dd { font-size: 16px; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-facts dt { gap: 9px; }
body.gd-look-tophat .gd-card--plain .gd-facts dt::before { flex-basis: 19px; width: 19px; height: 19px; }
body.gd-look-tophat .gd-card--plain .gd-facts dt::after { margin-left: -9px; }
body.gd-look-tophat .gd-out { align-items: flex-start; margin-top: 4px; }
body.tpl-guide.gd-look-tophat .gd .gd-out a { color: var(--mg-blue) !important; font-family: var(--mg-semi); font-weight: 700; font-size: 19px; }
body.tpl-guide.gd-look-tophat .gd .gd-buy-label { margin-bottom: 6px; font-family: var(--mg-semi); font-size: 14px; letter-spacing: .08em; color: var(--mg-navy) !important; opacity: 1 !important; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn { border: 1.5px solid var(--mg-blue); border-radius: 8px; background: var(--mg-card); color: var(--mg-navy); font-family: var(--mg-semi); }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn:hover, body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn:focus-visible { background: #1d1810; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn.is-lowest { border-color: var(--mg-navy); background: #221b0c; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-low { padding: 1px 9px; border-radius: 3px; background: var(--mg-yellow); color: var(--mg-navy); font-family: var(--mg-display); font-weight: 800; font-size: 13px; letter-spacing: .03em; text-transform: uppercase; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-seller, body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-price { color: var(--mg-navy); }
body.gd-look-tophat .gd-photo-credit { color: var(--mg-soft); opacity: 1; }
@media (min-width: 860px) {
    body.tpl-guide.gd-look-tophat .gd .gd-card--plain { padding: 18px 20px; }
    body.gd-look-tophat .gd-card--pic { align-items: flex-start; gap: 20px; }
    body.gd-look-tophat .gd-card--pic .gd-out-art { flex: 0 0 190px; margin: 4px 0 0; }
}

/* ---- panels: compare, dates, which show, history, things, FAQ, more guides ------------------------- */
body.gd-look-tophat .gd-panel { margin-top: 22px; padding: 18px 14px 20px; background: var(--mg-card); border: 1.5px solid var(--mg-edge); border-radius: 8px; color: var(--mg-navy); }
body.tpl-guide.gd-look-tophat .gd .gd-panel > h2, body.tpl-guide.gd-look-tophat .gd .gd-articles > h2 { margin: 0 0 14px; text-align: left; font-family: var(--mg-display); font-weight: 800; font-size: clamp(32px, 4.3vw, 58px); line-height: 1; letter-spacing: -.005em; text-transform: uppercase; text-shadow: none; text-wrap: balance; color: var(--mg-blue); }
body.tpl-guide.gd-look-tophat .gd :is(.gd-panel, .gd-card-panel) :is(p, span, b, li, h3, dt, dd) { color: var(--mg-navy); }
body.tpl-guide.gd-look-tophat .gd .gd-panel a { color: var(--mg-blue); }
@media (min-width: 860px) { body.gd-look-tophat .gd-panel { margin-top: 28px; padding: 26px 28px 30px; } }

body.gd-look-tophat .gd-dates-table, body.gd-look-tophat .gd-compare-table, body.gd-look-tophat .gd-faq-list, body.gd-look-tophat .gd-network-list { max-width: none; margin-left: 0; margin-right: 0; }
body.tpl-guide.gd-look-tophat .gd .gd-dates-table th { font-family: var(--mg-semi); font-weight: 700; font-size: 14px; letter-spacing: .12em; color: var(--mg-navy); border-bottom: 2px solid var(--mg-edge); }
body.tpl-guide.gd-look-tophat .gd .gd-dates-table td { border-bottom: 1px solid var(--mg-line); color: var(--mg-navy); }
body.tpl-guide.gd-look-tophat .gd .gd-dates-table td a.gd-date-show { color: var(--mg-navy); font-weight: 700; text-decoration: none; }
body.tpl-guide.gd-look-tophat .gd .gd-dates-table td a.gd-date-show:hover { text-decoration: underline; text-underline-offset: 3px; }
body.tpl-guide.gd-look-tophat .gd .gd-dates-table td:last-child a { font-weight: 700; color: var(--mg-blue); }
body.gd-look-tophat .gd-dates-table tr.gd-row-ours td { background: #221b0c; }
body.gd-look-tophat .gd-dates-table .gd-col-venue { display: none; }
body.gd-look-tophat .gd-sold { font-family: var(--mg-semi); font-weight: 700; color: var(--mg-magenta) !important; }
body.gd-look-tophat .gd-dates-note, body.gd-look-tophat .gd-history-intro { text-align: left; color: var(--mg-soft); }
body.gd-look-tophat .gd-dates-more { justify-content: flex-start; }
body.tpl-guide.gd-look-tophat .gd .gd-dates-more a { font-family: var(--mg-semi); font-weight: 700; color: var(--mg-blue); }
@media (min-width: 860px) { body.gd-look-tophat .gd-dates-table .gd-col-venue { display: table-cell; } body.gd-look-tophat .gd-dates-table td:nth-child(2) small { display: none; } }

body.gd-look-tophat .gd-compare-table { color: var(--mg-navy); }
body.gd-look-tophat .gd-compare-table tr { border-color: var(--mg-line); }
body.tpl-guide.gd-look-tophat .gd .gd-compare-table thead th { font-family: var(--mg-semi); font-weight: 700; color: var(--mg-navy); border-bottom: 2px solid var(--mg-edge); }
body.gd-look-tophat .gd-compare-table thead tr { border-bottom: 2px solid var(--mg-edge); }
body.tpl-guide.gd-look-tophat .gd .gd-compare-table tbody th { font-family: var(--mg-semi); font-weight: 700; font-size: 13px; letter-spacing: .12em; color: var(--mg-blue); border-color: var(--mg-line); }
body.gd-look-tophat .gd-compare-table td { border-color: var(--mg-line); }
body.tpl-guide.gd-look-tophat .gd .gd-compare-table .gd-cmp-cost b { font-family: var(--mg-display); font-weight: 800; color: var(--mg-magenta); }
body.tpl-guide.gd-look-tophat .gd .gd-compare-table .gd-cmp-go a { font-family: var(--mg-semi); font-weight: 700; color: var(--mg-blue); }
body.gd-look-tophat .gd-compare-table { --gd-dial: var(--mg-blue); }

body.gd-look-tophat .gd-which-list li { border-color: var(--mg-line); }
body.tpl-guide.gd-look-tophat .gd .gd-which-list h3 { font-family: var(--mg-semi); font-weight: 700; font-size: 21px; letter-spacing: 0; text-transform: none; }
body.gd-look-tophat .gd-timeline li::before, body.gd-look-tophat .gd-timeline li::after { background: var(--mg-magenta); }
body.gd-look-tophat .gd-timeline b { font-family: var(--mg-display); font-weight: 800; color: var(--mg-blue) !important; }
body.gd-look-tophat .gd-things-list li, body.gd-look-tophat .gd-event { border: 1.5px solid var(--mg-edge); border-radius: 6px; background: var(--mg-card); }
body.tpl-guide.gd-look-tophat .gd :is(.gd-things-list h3, .gd-event-name) { font-family: var(--mg-semi); font-weight: 700; }

body.gd-look-tophat .gd-faq-list { border-top: 1.5px solid var(--mg-edge); }
body.gd-look-tophat .gd-faq-item { padding: 14px 2px 16px; border-bottom: 1px solid var(--mg-line); }
body.tpl-guide.gd-look-tophat .gd .gd-faq-item h3 { margin-bottom: 5px; font-family: var(--mg-semi); font-weight: 700; font-size: clamp(20px, 2vw, 25px); line-height: 1.2; }
body.gd-look-tophat .gd-faq-item p { font-size: clamp(16px, 1.5vw, 18px); }

body.gd-look-tophat .gd-network-list a { background: var(--mg-card); border: 1.5px solid var(--mg-edge); border-radius: 8px; }
body.tpl-guide.gd-look-tophat .gd .gd-network-list b { font-family: var(--mg-semi); font-weight: 700; font-size: 21px; color: var(--mg-blue); }
body.tpl-guide.gd-look-tophat .gd .gd-network-list small { color: var(--mg-soft); opacity: 1; }

body.gd-look-tophat .gd-article { background: var(--mg-card); border: 1.5px solid var(--mg-edge); border-radius: 6px; }
body.tpl-guide.gd-look-tophat .gd .gd-article-body h3 { font-family: var(--mg-semi); font-weight: 700; font-size: 24px; }
body.gd-look-tophat .gd-disclosure { margin: 22px 0 0; max-width: none; text-align: left; color: var(--mg-soft); }

/* ---- footer + the site's other pages (templates/page-skin.css tokens) ------------------------------ */
:is(body.tpl-guide.gd-look-tophat, body.tpl-page-guide, body.tpl-show-guide) footer { background: #0a080d; border-top: 0; }
:is(body.tpl-guide.gd-look-tophat, body.tpl-page-guide, body.tpl-show-guide) footer :is(h3, h4) { color: #ffe14a !important; font-family: 'EB Garamond', Georgia, 'Times New Roman', serif; }
:is(body.tpl-guide.gd-look-tophat, body.tpl-page-guide, body.tpl-show-guide) footer a:hover { color: #ffe14a !important; }
body.tpl-page.tpl-page-guide {
    --pg-bg: #000000; --pg-surface: #0d0b11; --pg-surface-2: #15121b; --pg-line: #3d3218; --pg-chip-line: #8f7430;
    --pg-ink: #ffffff; --pg-ink-2: #ece6d8; --pg-ink-3: #cdc6b6;
    --pg-accent: #e1b851; --pg-accent-hover: #f1d98e; --pg-accent-ink: #14100a;
    --pg-price: #ffffff; --pg-star: #d9b65a;
    --pg-display: 'Barlow Condensed'; --pg-display-weight: 800; --pg-display-tracking: 0; --pg-text: 'Barlow'; --pg-button-font: 'Barlow Semi Condensed'; --pg-nav-font: 'Barlow Semi Condensed';
    --pg-radius: 6px; --pg-btn-radius: 8px;
    --pg-header-bg: #000000; --pg-header-ink: #ffffff;
}

/* Box Office arrow: a full-weight arrow, as drawn (the condensed face's own arrow is hairline thin). */
body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-seller span[aria-hidden] { font-family: var(--mg-text); font-weight: 700; font-size: .82em; }

/* Outside-show cards on wide screens: a smaller thumbnail and a narrower label column, so values are not squeezed. */
@media (min-width: 860px) {
    body.gd-look-tophat .gd-card--pic .gd-out-art { flex: 0 0 clamp(120px, 12vw, 170px); }
    body.gd-look-tophat .gd-card--plain .gd-facts > div { grid-template-columns: 124px 1fr; }
}
/* Dates table on phones: fixed columns so the price links stay inside the panel. */
@media (max-width: 859px) {
    body.gd-look-tophat .gd-dates-table { table-layout: fixed; font-size: 15px; }
    body.gd-look-tophat .gd-dates-table th:first-child { width: 82px; }
    body.gd-look-tophat .gd-dates-table th:last-child { width: 104px; }
    body.gd-look-tophat .gd-dates-table td:nth-child(2) { overflow-wrap: anywhere; }
    body.tpl-guide.gd-look-tophat .gd .gd-dates-table td:last-child a { font-size: 14px; }
}
body.gd-look-tophat .gd-daypick { max-width: none; margin: 0 0 14px; }
body.gd-look-tophat .gd-daypick .gd-chip { padding: 7px 14px; border-radius: 999px; font-family: var(--mg-semi); font-weight: 700; font-size: 16px; }

/* ---- headliners (special events): photo-top cards, two or three across, compact icon facts ---------------- */
body.gd-look-tophat .gd-events-list { grid-template-columns: minmax(0, 1fr); gap: 16px; }
body.tpl-guide.gd-look-tophat .gd .gd-event { padding: 0 0 16px; overflow: hidden; background: var(--mg-card); border: 1.5px solid var(--mg-edge); border-radius: 6px; box-shadow: none !important; }
body.gd-look-tophat .gd-event-art { margin: 0 0 12px; }
body.gd-look-tophat .gd-event-art img { aspect-ratio: 250 / 188; border-radius: 0; object-position: center 20%; }
body.tpl-guide.gd-look-tophat .gd .gd-event-name { margin: 0 16px; font-size: clamp(23px, 2.1vw, 28px); line-height: 1.12; color: var(--mg-navy); }
body.tpl-guide.gd-look-tophat .gd .gd-event-name a { color: inherit; }
body.gd-look-tophat .gd-event-sub { margin: 6px 16px 0; }
body.gd-look-tophat .gd-event .gd-facts { margin: 10px 16px 12px; gap: 5px; }
body.gd-look-tophat .gd-event .gd-facts > div { grid-template-columns: 122px minmax(0, 1fr); gap: 8px; }
body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts dt, body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts dd { font-size: 16px; }
body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts dt { gap: 9px; }
body.gd-look-tophat .gd-event .gd-facts dt::before { flex-basis: 19px; width: 19px; height: 19px; }
body.gd-look-tophat .gd-event .gd-facts dt::after { margin-left: -9px; }
body.gd-look-tophat .gd-event .gd-out, body.gd-look-tophat .gd-event .gd-buy { margin: auto 16px 0; }
body.gd-look-tophat .gd-event .gd-rec { top: 0; left: 0; }
@media (min-width: 640px) { body.gd-look-tophat .gd-events-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { body.gd-look-tophat .gd-events-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; } }
@media (min-width: 860px) { body.gd-look-tophat .gd-event .gd-facts > div { grid-template-columns: 122px minmax(0, 1fr); } body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts dt, body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts dd { font-size: 16px; } }

/* ==== Desktop scale (Pete 11/14: "Everything (at least on desktop) looks HUGE!") ==========================================
   The first build scaled type with the window, as the 1090px mockup did; on a real desktop that made it oversized. From
   860px up the page is narrower and every size has a fixed ceiling. Phone sizes above are unchanged. */
@media (min-width: 860px) {
    .site-header.gd-header.gd-header--tophat, body.tpl-guide.gd-look-tophat main.gd { max-width: 1180px; }
    .gd-header--tophat .gd-header-inner { padding: 10px 28px 10px 24px; }
    .gd-header--tophat .gd-mark { font-size: clamp(40px, 3.9vw, 50px); }
    .gd-header--tophat .gd-tagline { margin: 5px 0 0 6px; font-size: 11.5px; letter-spacing: .28em; }
    .gd-header--tophat .gd-nav { gap: 4px 34px; }
    .gd-header--tophat .gd-nav a { font-size: 19px; }
    body.gd-look-tophat .gd-hero { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); padding: 18px 0 18px; }
    body.tpl-guide.gd-look-tophat .gd .gd-hero h1, body.tpl-guide.gd-look-tophat .gd .gd-hero h1.gd-h1--long { font-size: clamp(50px, 6.1vw, 78px); }
    body.gd-look-tophat .gd-intro { margin-top: 10px; max-width: 27em; font-size: clamp(17px, 1.5vw, 19px); }
    body.tpl-guide.gd-look-tophat .gd .gd-updated { margin-top: 12px; font-size: 15px; }
    body.gd-look-tophat .gd-hero-art { justify-self: end; width: 100%; max-width: 400px; }
    body.gd-look-tophat .gd-filter-label, body.gd-look-tophat .gd-filter > .gd-filter-label, body.gd-look-tophat .gd-sort .gd-filter-label { font-size: 17px; }
    body.gd-look-tophat .gd-chip { font-size: 16px; }
    body.tpl-guide.gd-look-tophat .gd .gd-rec { padding: 5px 30px 5px 16px; font-size: 16px; }
    body.tpl-guide.gd-look-tophat .gd .gd-card-name { padding: 14px 20px 0; font-size: clamp(26px, 2.4vw, 31px); }
    body.gd-look-tophat .gd-card-venue { margin-left: 20px; margin-right: 20px; font-size: 18px; }
    body.gd-look-tophat .gd-card-panel { padding: 12px 20px 20px; }
    body.gd-look-tophat .gd-card-art img { aspect-ratio: 16 / 9; }
    body.gd-look-tophat .gd-facts > div { grid-template-columns: 150px 1fr; }
    body.tpl-guide.gd-look-tophat .gd .gd-facts dt, body.tpl-guide.gd-look-tophat .gd .gd-facts dd { font-size: 17px; }
    body.gd-look-tophat .gd-facts dt::before { flex-basis: 22px; width: 22px; height: 22px; }
    body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct { min-height: 54px; }
    body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-seller, body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-seller * { font-size: 26px; }
    body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-card-name { padding: 0 0 2px; font-size: 23px; }
    body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-facts dt, body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-facts dd { font-size: 15px; }
    body.gd-look-tophat .gd-card--plain .gd-facts > div { grid-template-columns: 116px 1fr; }
    body.tpl-guide.gd-look-tophat .gd .gd-event-name { font-size: 22px; }
    body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts dt, body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts dd { font-size: 15px; }
    body.tpl-guide.gd-look-tophat .gd .gd-panel > h2, body.tpl-guide.gd-look-tophat .gd .gd-articles > h2 { font-size: clamp(28px, 2.9vw, 36px); }
    body.gd-look-tophat .gd-panel { margin-top: 22px; padding: 22px 24px 24px; }
    body.gd-look-tophat .gd-dates-table, body.gd-look-tophat .gd-compare-table { font-size: 16px; }
    body.tpl-guide.gd-look-tophat .gd .gd-compare-table thead th { font-size: 17px; }
    body.tpl-guide.gd-look-tophat .gd .gd-faq-item h3 { font-size: 20px; }
    body.gd-look-tophat .gd-faq-item p { font-size: 16px; }
    /* headliners sit inside the shows section in this look */
    body.gd-look-tophat .gd-shows > .gd-events { margin: 22px 0; }
}
@media (min-width: 1200px) {
    body.gd-look-tophat .gd-filter { padding: 44px 16px 14px; }
    body.gd-look-tophat .gd-filter > .gd-filter-label { top: 12px; }
    body.gd-look-tophat .gd-sort { margin-top: -32px; padding-top: 32px; }
}
@media (max-width: 859px) { body.gd-look-tophat .gd-shows > .gd-events { margin: 16px 0; } }

/* sponsor line + producer call-out in this look */
body.gd-look-tophat .gd-sponsor { color: var(--mg-soft); opacity: 1; }
body.tpl-guide.gd-look-tophat .gd .gd-sponsor a { color: var(--mg-blue); }
body.gd-look-tophat .gd-producers { text-align: left; }
body.gd-look-tophat .gd-producers-text { margin-left: 0; }
body.gd-look-tophat .gd-producers-links { justify-content: flex-start; }
body.tpl-guide.gd-look-tophat .gd .gd-producers-btn { border: 1.5px solid var(--mg-edge); border-radius: 8px; background: var(--mg-yellow); color: var(--mg-navy); font-family: var(--mg-semi); }
body.tpl-guide.gd-look-tophat .gd .gd-producers-btn--plain { background: var(--mg-card); border-color: var(--mg-blue); color: var(--mg-blue); }
/* producer buttons in this look's own colours (beats the fixed fallback in guide.css) */
body.tpl-guide.gd-look-tophat .gd .gd-producers .gd-producers-btn { background: var(--mg-yellow) !important; border-color: var(--mg-navy) !important; }
body.tpl-guide.gd-look-tophat .gd .gd-producers .gd-producers-btn, body.tpl-guide.gd-look-tophat .gd .gd-producers .gd-producers-btn span { color: var(--mg-navy) !important; }
body.tpl-guide.gd-look-tophat .gd .gd-producers .gd-producers-btn--plain { background: var(--mg-card) !important; border-color: var(--mg-blue) !important; }
body.tpl-guide.gd-look-tophat .gd .gd-producers .gd-producers-btn--plain, body.tpl-guide.gd-look-tophat .gd .gd-producers .gd-producers-btn--plain span { color: var(--mg-blue) !important; }

/* Article pages: the live show card is a dark card in every look, so its text stays light here (this look's page ink is navy). */
body.tpl-page-guide .article-showcard__price, body.tpl-page-guide .article-showcard__price strong { color: #ffffff !important; }
body.tpl-page-guide .article-showcard a.article-showcard__date { color: #f1d98e !important; }
body.tpl-page-guide .article-showcard .article-showcard__name, body.tpl-page-guide .article-showcard .article-showcard__name a { color: #ffffff !important; }

/* heading + sort buttons above the weekly shows */
body.tpl-guide.gd-look-tophat .gd .gd-sortbar-h { font-family: var(--mg-display); font-weight: 800; font-size: clamp(28px, 2.9vw, 36px); line-height: 1; text-transform: uppercase; color: var(--mg-blue); }
body.gd-look-tophat .gd-sortbar .gd-chip { padding: 7px 14px; border-radius: 999px; font-family: var(--mg-semi); font-weight: 700; font-size: 16px; }

/* ==== Compact listing cards, three across (Pete's DiffUI pick C, 11/14; project 32f8be61, build 00709a2c) =====================
   Pete: the two-across cards were "huge... should be 3 in a row - this page is huge". Outside shows and headliners become
   short cards: small thumbnail left, name, one icon line of facts, then the sellers as price chips on one row. Our own
   featured cards keep the big photo layout. The mockup's "Popular" / "Special event" tags and stub notches are not built
   (no data behind them); "Family friendly" (Vegas.com's category) and "Just added" (auto-added in the last 14 days) are. */
body.gd-look-tophat .gd-cards--theirs { grid-template-columns: minmax(0, 1fr); gap: 12px; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain { position: relative; display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 2px 12px; align-items: start; align-content: start; padding: 12px; text-align: left; border-radius: 8px; }
body.gd-look-tophat .gd-card--plain .gd-out-art { grid-column: 1; grid-row: 1 / span 2; width: 72px; max-width: 72px; flex: none; margin: 0; }
body.gd-look-tophat .gd-card--plain .gd-out-art img { aspect-ratio: 1 / 1; object-fit: cover; border-width: 1px; border-radius: 6px; }
body.gd-look-tophat .gd-card--plain .gd-photo-credit { display: none; }
body.gd-look-tophat .gd-card--plain .gd-out-body { display: contents; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-card-name { grid-column: 2; padding: 0; font-size: 20px; line-height: 1.15; text-align: left; }
body.gd-look-tophat .gd-card--plain:not(.gd-card--pic) .gd-card-name, body.gd-look-tophat .gd-card--plain:not(.gd-card--pic) .gd-facts { grid-column: 1 / -1; }
body.gd-look-tophat .gd-card--plain .gd-honors, body.gd-look-tophat .gd-card--plain .gd-card-sub { grid-column: 2; margin: 0; font-size: 14px; }
/* facts on one flowing line: [pin] venue · days · showtime, then [clock] run time on its own line */
body.gd-look-tophat .gd-card--plain .gd-facts { grid-column: 2; display: block; max-width: none; margin: 2px 0 0; font-size: 14px; line-height: 1.4; }
body.gd-look-tophat .gd-card--plain .gd-facts > div { display: inline; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-facts dt { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
body.gd-look-tophat .gd-card--plain .gd-facts dt::before, body.gd-look-tophat .gd-card--plain .gd-facts dt::after { content: none; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-facts dd { display: inline; margin: 0; font-size: 14px; font-weight: 400; line-height: 1.4; }
body.gd-look-tophat .gd-card--plain .gd-facts > div + div::before { content: '\00a0\00b7\00a0'; }
body.gd-look-tophat .gd-card--plain .gd-facts [data-fact="venue"]::before, body.gd-look-tophat .gd-card--plain .gd-facts [data-fact="run-time"]::before { content: '' !important; display: inline-block; width: 13px; height: 13px; margin: 0 5px -1px 0; background: var(--mg-navy); -webkit-mask: var(--mg-i-pin) center / contain no-repeat; mask: var(--mg-i-pin) center / contain no-repeat; }
body.gd-look-tophat .gd-card--plain .gd-facts [data-fact="run-time"] { display: block; }
body.gd-look-tophat .gd-card--plain .gd-facts [data-fact="run-time"]::before { -webkit-mask-image: var(--mg-i-clock); mask-image: var(--mg-i-clock); }
body.gd-look-tophat .gd-card--plain .gd-facts [data-fact="from-price"], body.gd-look-tophat .gd-card--plain .gd-facts [data-fact="next-show"] { display: none; }
/* sellers: price chips on one row, the cheapest in yellow */
body.gd-look-tophat .gd-card--plain .gd-buy { grid-column: 1 / -1; margin: 8px 0 0; padding: 0; align-self: end; }
body.gd-look-tophat .gd-card--plain .gd-buy-label { display: none; }
body.gd-look-tophat .gd-card--plain .gd-buy-row--stack { display: flex; flex-wrap: wrap; gap: 6px; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack .gd-buy-btn { flex: 1 1 auto; flex-direction: row; justify-content: center; align-items: center; gap: 6px; min-height: 36px; padding: 5px 8px; border-width: 1.5px; border-radius: 7px; white-space: nowrap; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack .gd-buy-seller { display: inline; font-size: 14px; font-weight: 700; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack .gd-buy-price { font-size: 14px; font-weight: 700; }
body.gd-look-tophat .gd-card--plain .gd-buy-low, body.gd-look-tophat .gd-card--plain .gd-from-word, body.gd-look-tophat .gd-card--plain .gd-check-word, body.gd-look-tophat .gd-card--plain .gd-buy-arrow { display: none !important; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn.is-lowest { background: var(--mg-yellow); border-color: var(--mg-navy); }
/* one seller only: the same chip shape, with the price from the hidden fact row */
body.gd-look-tophat .gd-card--plain .gd-out { grid-column: 1 / -1; margin: 8px 0 0; align-items: stretch; align-self: end; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-out a { justify-content: center; min-height: 36px; padding: 5px 10px; border: 1.5px solid var(--mg-edge); border-radius: 7px; background: var(--mg-yellow); color: var(--mg-navy) !important; font-family: var(--mg-semi); font-size: 14px; font-weight: 700; text-decoration: none; }
/* corner tags */
body.gd-look-tophat .gd-tag { display: block; position: absolute; top: 0; left: 0; z-index: 2; padding: 2px 16px 2px 10px; background: var(--mg-yellow); color: var(--mg-navy); clip-path: polygon(0 0, 100% 0, calc(100% - 9px) 100%, 0 100%); font-family: var(--mg-display); font-weight: 800; font-size: 12px; letter-spacing: .04em; line-height: 1.3; text-transform: uppercase; }
body.gd-look-tophat .gd-card--plain:has(> .gd-tag), body.gd-look-tophat .gd-event:has(> .gd-tag) { padding-top: 26px !important; }

/* headliners: thumbnail left, name, venue, [calendar] date, yellow price chip + outlined Tickets button */
body.gd-look-tophat .gd-events-list { grid-template-columns: minmax(0, 1fr); gap: 12px; }
body.tpl-guide.gd-look-tophat .gd .gd-event { position: relative; display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 1px 12px; align-content: start; padding: 12px; border-radius: 8px; }
body.gd-look-tophat .gd-event .gd-event-art { grid-column: 1; grid-row: 1 / span 3; margin: 0; }
body.gd-look-tophat .gd-event .gd-event-art img { aspect-ratio: 1 / 1; object-fit: cover; object-position: center 18%; border: 1px solid var(--mg-edge); border-radius: 6px; }
body.gd-look-tophat .gd-event .gd-photo-credit { display: none; }
body.tpl-guide.gd-look-tophat .gd .gd-event-name { grid-column: 2; margin: 0; font-size: 20px; line-height: 1.15; }
body.gd-look-tophat .gd-event .gd-event-sub { grid-column: 2; margin: 0; font-size: 14px; }
body.gd-look-tophat .gd-event .gd-facts { grid-column: 2; display: block; margin: 1px 0 0; font-size: 14px; }
body.gd-look-tophat .gd-event .gd-facts > div { display: block; }
body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts dt { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
body.gd-look-tophat .gd-event .gd-facts dt::before, body.gd-look-tophat .gd-event .gd-facts dt::after { content: none; }
body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts dd { display: inline; margin: 0; font-size: 14px; font-weight: 400; line-height: 1.45; }
body.gd-look-tophat .gd-event .gd-facts [data-fact="days"], body.gd-look-tophat .gd-event .gd-facts [data-fact="showtime"], body.gd-look-tophat .gd-event .gd-facts [data-fact="run-time"] { display: none; }
body.gd-look-tophat .gd-event .gd-facts [data-fact="next-date"] { order: 2; }
body.gd-look-tophat .gd-event .gd-facts [data-fact="next-date"]::before { content: ''; display: inline-block; width: 13px; height: 13px; margin: 0 5px -1px 0; background: var(--mg-navy); -webkit-mask: var(--mg-i-cal) center / contain no-repeat; mask: var(--mg-i-cal) center / contain no-repeat; }
body.gd-look-tophat .gd-event .gd-facts { display: flex; flex-direction: column; }
body.gd-look-tophat .gd-event .gd-facts [data-fact="venue"] { order: 1; }
body.gd-look-tophat .gd-event .gd-facts [data-fact="from-price"] { order: 3; margin-top: 4px; }
body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts [data-fact="from-price"] dd { display: inline-block; padding: 2px 9px; border-radius: 6px; background: var(--mg-yellow); font-weight: 700; text-transform: lowercase; }
body.gd-look-tophat .gd-event .gd-out { position: absolute; right: 12px; bottom: 12px; margin: 0; }
body.tpl-guide.gd-look-tophat .gd .gd-event .gd-out a { min-height: 32px; padding: 3px 12px; border: 1.5px solid var(--mg-blue); border-radius: 7px; background: var(--mg-card); font-size: 14px; text-decoration: none; }
body.tpl-guide.gd-look-tophat .gd .gd-event .gd-facts [data-fact="from-price"] dd { white-space: nowrap; }
body.gd-look-tophat .gd-card--plain:not(:has(.gd-buy)) .gd-facts [data-fact="from-price"]::before { content: none !important; }
/* a card with one seller has no price chip, so its price stays in the fact line */
body.gd-look-tophat .gd-card--plain:not(:has(.gd-buy)) .gd-facts [data-fact="from-price"] { display: inline; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain:not(:has(.gd-buy)) .gd-facts [data-fact="from-price"] dd { font-weight: 700; }
@media (min-width: 640px) {
    body.gd-look-tophat .gd-cards--theirs, body.gd-look-tophat .gd-events-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1000px) {
    body.gd-look-tophat .gd-cards--theirs, body.gd-look-tophat .gd-events-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
}

/* Headliner cards: price chip and Tickets button share the last row of the card's own grid (never on top of each other). */
body.tpl-guide.gd-look-tophat .gd .gd-event:not(.gd-event--ours) { grid-template-columns: 84px auto minmax(0, 1fr); }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-event-art { grid-row: 1 / span 4; }
body.tpl-guide.gd-look-tophat .gd .gd-event:not(.gd-event--ours) .gd-event-name { grid-column: 2 / 4; grid-row: 1; }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-event-sub { display: none; }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts { display: contents; }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts > div { font-size: 14px; }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts [data-fact="venue"] { grid-column: 2 / 4; grid-row: 2; }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts [data-fact="next-date"] { grid-column: 2 / 4; grid-row: 3; }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts [data-fact="from-price"] { grid-column: 2; grid-row: 4; margin-top: 5px; align-self: center; }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-out { position: static; grid-column: 3; grid-row: 4; justify-self: end; align-self: center; margin: 5px 0 0; }
body.tpl-guide.gd-look-tophat .gd .gd-event:not(.gd-event--ours) .gd-out a { white-space: nowrap; padding: 3px 10px; }
/* Headliner button reads "Tickets →" (as drawn), short enough to sit beside the price chip at every width. */
body.tpl-guide.gd-look-tophat .gd .gd-event:not(.gd-event--ours) .gd-out a { font-size: 0; gap: 0; }
body.tpl-guide.gd-look-tophat .gd .gd-event:not(.gd-event--ours) .gd-out a::after { content: 'Tickets \2192'; font-size: 14px; }
/* Phones: the headliner card is too narrow for chip + button side by side, so the button drops under the price. */
body.gd-look-tophat .gd-event:not(.gd-event--ours) > *, body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts > div { min-width: 0; }
/* ...and at every other width too: the price chip (left) and the button (right) share one full-width row under the thumbnail. */
@media (min-width: 1px) {
    body.tpl-guide.gd-look-tophat .gd .gd-event:not(.gd-event--ours) { grid-template-columns: 76px minmax(0, 1fr); }
    body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-event-art { grid-row: 1 / span 3; }
    body.tpl-guide.gd-look-tophat .gd .gd-event:not(.gd-event--ours) .gd-event-name, body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts [data-fact="venue"], body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts [data-fact="next-date"] { grid-column: 2; }
    body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts [data-fact="from-price"] { grid-column: 1 / -1; grid-row: 4; margin-top: 8px; }
    body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-out { grid-column: 1 / -1; grid-row: 4; justify-self: end; margin-top: 8px; }
}

/* ==== Uniform cards (Pete 11/14: "the different size boxes make my OCD crazy") ==========================================
   Every card in a section is the same height: equal grid rows, name and fact line capped at two lines, sellers pinned to
   the bottom edge, seller chips all the same width. */
body.gd-look-tophat .gd-cards--theirs, body.gd-look-tophat .gd-events-list { grid-auto-rows: 1fr; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain { grid-template-rows: auto 1fr auto; height: 100%; box-sizing: border-box; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-card-name, body.tpl-guide.gd-look-tophat .gd .gd-event:not(.gd-event--ours) .gd-event-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
body.gd-look-tophat .gd-card--plain .gd-facts { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; align-self: start; }
body.gd-look-tophat .gd-card--plain .gd-facts [data-fact="run-time"] { display: inline; }
body.gd-look-tophat .gd-card--plain .gd-facts [data-fact="run-time"]::before { content: '\00a0\00b7\00a0' !important; display: inline; width: auto; height: auto; margin: 0; background: none; -webkit-mask: none; mask: none; }
body.gd-look-tophat .gd-card--plain .gd-buy, body.gd-look-tophat .gd-card--plain .gd-out { grid-row: 3; align-self: end; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack { flex-wrap: nowrap; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack .gd-buy-btn { flex: 1 1 0; min-width: 0; padding: 5px 4px; gap: 4px; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack .gd-buy-seller, body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack .gd-buy-price { font-size: 13px; }
/* tag sits on the card's top edge without pushing the content down, so tagged and untagged cards line up */
body.gd-look-tophat .gd-card--plain:has(> .gd-tag), body.gd-look-tophat .gd-event:has(> .gd-tag) { padding-top: 12px !important; }
body.gd-look-tophat .gd-tag { top: -1px; left: auto; right: -1px; clip-path: polygon(9px 0, 100% 0, 100% 100%, 0 100%); padding: 1px 9px 1px 15px; border-radius: 0 7px 0 0; }
body.gd-look-tophat .gd-card--plain:has(> .gd-tag) .gd-card-name, body.gd-look-tophat .gd-event:has(> .gd-tag) .gd-event-name { padding-right: 96px; }
/* headliners: same idea */
body.tpl-guide.gd-look-tophat .gd .gd-event:not(.gd-event--ours) { grid-template-rows: auto auto 1fr auto; height: 100%; box-sizing: border-box; }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts [data-fact="venue"] { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-clamp: 1; overflow: hidden; }
body.gd-look-tophat .gd-event:not(.gd-event--ours) .gd-facts [data-fact="next-date"] { align-self: start; }
/* Narrower cards (phones, two across, tight three across): seller over price inside each chip, so three chips always fit. */
@media (max-width: 1179px) {
    body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack .gd-buy-btn { flex-direction: column; gap: 0; min-height: 42px; padding: 4px 2px; line-height: 1.15; }
    body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack .gd-buy-seller { font-size: 12px; font-weight: 600; }
    body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-row--stack .gd-buy-price { font-size: 14px; }
}

/* signup + Vegas411 news in this look */
body.gd-look-tophat .gd-signup-form button { font-family: var(--mg-display); font-size: 24px; text-transform: uppercase; }
body.gd-look-tophat .gd-news { margin-top: 22px; }
body.gd-look-tophat .gd-news-more { text-align: left; }
body.tpl-guide.gd-look-tophat .gd .gd-news-more a { color: var(--mg-blue); font-family: var(--mg-semi); }
body.tpl-guide.gd-look-tophat .gd .gd-news .gd-article-body h3 { font-size: 20px; line-height: 1.2; }
body.gd-look-tophat .gd-news .gd-article-body p { font-size: 15px; }
body.tpl-guide.gd-look-tophat .gd .gd-signup h2 { font-family: var(--mg-display); font-weight: 800; font-size: clamp(30px, 3.2vw, 42px); text-transform: uppercase; }
body.tpl-guide.gd-look-tophat .gd .gd-news-more a { border: 1.5px solid var(--mg-blue); border-radius: 8px; color: var(--mg-blue) !important; }

/* Comedy.Vegas logo (Pete's DiffUI logo pick D, 11/14): the dot between the two words is a yellow spotlight disc. */
.gd-header--tophat .gd-mark--dot { white-space: nowrap; }
.gd-header--tophat .gd-mark--dot .gd-mark-dot { display: inline-block; width: .42em; height: .42em; margin: 0 .03em -.14em .03em; vertical-align: baseline; }
.gd-header--tophat .gd-mark--dot span { margin-left: 0; }

/* Our shows on desktop: wide cards, picture left and details right, close in height to the list under them instead of two
   tall cards (Pete 11/15: "do the same wide feature card on the other guide sites"). Phones keep the stacked card. */
@media (min-width: 1000px) {
    body.tpl-guide.gd-look-tophat .gd .gd-cards--ours { grid-template-columns: minmax(0, 1fr); }
    body.tpl-guide.gd-look-tophat .gd .gd-cards--ours > .gd-card { display: grid; grid-template-columns: minmax(0, 46fr) minmax(0, 54fr); grid-template-rows: auto auto auto 1fr; }
    body.tpl-guide.gd-look-tophat .gd .gd-cards--ours .gd-card-art { grid-column: 1; grid-row: 1 / span 4; height: 100%; margin: 0; }
    body.tpl-guide.gd-look-tophat .gd .gd-cards--ours .gd-card-art img { width: 100%; height: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
    body.tpl-guide.gd-look-tophat .gd .gd-cards--ours :is(.gd-card-name, .gd-card-venue, .gd-honors, .gd-ribbon, .gd-card-panel) { grid-column: 2; }
    /* The room is already printed under the name. */
    body.tpl-guide.gd-look-tophat .gd .gd-cards--ours .gd-facts [data-fact="venue"] { display: none; }
}

/* ==== TOP HAT: what differs from the structure it started from ===================================== */
/* no frame: the page is plain black edge to edge */
.site-header.gd-header.gd-header--tophat { width: 100%; max-width: none; margin: 0; background: #000; border: 0; border-bottom: 1px solid #3d3218; border-radius: 0; }
.gd-header--tophat .gd-header-inner { max-width: 1180px; margin: 0 auto; padding: 10px 14px; }
body.tpl-guide.gd-look-tophat main.gd { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 14px 30px; background: #000; border: 0; border-radius: 0; }
/* wordmark: MAGIC SHOW in gold small caps, VEGAS spaced out under it between two rules */
.gd-header--tophat .gd-mark { display: inline-flex; flex-direction: column; align-items: center; justify-self: start; font-family: 'Cinzel', Georgia, serif; font-weight: 500; font-size: 24px; line-height: 1; letter-spacing: .02em; text-transform: none; color: #e1b851 !important; }
.gd-header--tophat .gd-mark span { display: flex; align-items: center; gap: 10px; margin: 5px 0 0; font-size: .5em; font-weight: 500; letter-spacing: .34em; text-transform: uppercase; color: #fff; }
.gd-header--tophat .gd-mark span::before, .gd-header--tophat .gd-mark span::after { content: ''; width: 22px; height: 1px; background: #e1b851; }
.gd-header--tophat .gd-tagline { display: none; }
.gd-header--tophat .gd-nav { gap: 4px 32px; }
.gd-header--tophat .gd-nav a { padding: 6px 0; font-family: 'Cinzel', Georgia, serif; font-weight: 500; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #fff; border-bottom: 1px solid transparent; }
.gd-header--tophat .gd-nav a:hover, .gd-header--tophat .gd-nav a:focus-visible { color: #e1b851; border-bottom-color: #e1b851; }
.gd-header--tophat .gd-burger-lines, .gd-header--tophat .gd-burger-lines::before, .gd-header--tophat .gd-burger-lines::after { background: #fff; }
@media (min-width: 760px) {
    .gd-header--tophat .gd-header-inner { padding: 14px 24px; }
    .gd-header--tophat .gd-mark { font-size: 31px; }
}

/* hero: headline left, the drawing right (a strip above the headline on phones) */
body.gd-look-tophat .gd-hero { position: relative; display: block; margin: 0 -14px; padding: 0 18px 18px; text-align: left; overflow: hidden; }
body.gd-look-tophat .gd-hero > * { position: relative; z-index: 1; }
body.gd-look-tophat .gd-hero-art { display: block; position: static; margin: 0 -18px 10px; order: 0; }
body.gd-look-tophat .gd-hero-art .mg-stage { display: block; width: 100%; height: auto; }
body.gd-look-tophat .gd-hero-art .mg-stage--wide { display: none; }
body.gd-look-tophat .gd-hero-art .mg-stage--small { aspect-ratio: 390 / 150; }
body.tpl-guide.gd-look-tophat .gd .gd-hero h1, body.tpl-guide.gd-look-tophat .gd .gd-hero h1.gd-h1--long { margin: 0; max-width: none; font-family: var(--mg-display); font-weight: 500; font-size: clamp(32px, 9.4vw, 46px); line-height: 1.04; letter-spacing: .005em; text-transform: none; white-space: normal; color: #fff; text-shadow: none; }
body.gd-look-tophat .gd-hero h1 .gd-h1-topic { display: block; color: #e1b851; font-size: 1.16em; line-height: 1; }
body.gd-look-tophat .gd-hero h1 .gd-h1-topic::after { content: none; }
body.gd-look-tophat .gd-hero h1 .gd-h1-city { display: inline; color: #fff; }
body.gd-look-tophat .gd-intro { margin: 12px 0 0; max-width: 30em; font-family: var(--mg-text); font-size: 19px; line-height: 1.35; color: #fff; }
body.tpl-guide.gd-look-tophat .gd .gd-updated { margin: 10px 0 0; font-family: var(--mg-text); font-size: 15px; color: var(--mg-soft); }
body.tpl-guide.gd-look-tophat .gd .gd-updated a { color: #e1b851; }
@media (min-width: 520px) and (max-width: 859px) { body.gd-look-tophat .gd-hero-art .mg-stage--small { aspect-ratio: auto; height: 190px; } }
@media (min-width: 860px) {
    body.tpl-guide.gd-look-tophat main.gd { padding: 0 24px 40px; }
    body.gd-look-tophat .gd-hero { display: flex; flex-direction: column; justify-content: center; min-height: 360px; margin: 0 -24px; padding: 30px 48% 30px 64px; }
    body.gd-look-tophat .gd-hero > * { grid-column: auto; }
    body.tpl-guide.gd-look-tophat .gd .gd-hero .gd-hero-art { position: absolute; inset: 0; width: 100%; max-width: none; height: 100%; margin: 0; z-index: 0; }
    body.gd-look-tophat .gd-hero-art .mg-stage--small { display: none; }
    body.gd-look-tophat .gd-hero-art .mg-stage--wide { display: block; width: 100%; height: 100%; aspect-ratio: auto; }
    body.tpl-guide.gd-look-tophat .gd .gd-hero h1, body.tpl-guide.gd-look-tophat .gd .gd-hero h1.gd-h1--long { font-size: clamp(40px, 4.4vw, 54px); white-space: nowrap; }
    body.gd-look-tophat .gd-intro { margin-top: 14px; max-width: 24em; font-size: 21px; }
    body.tpl-guide.gd-look-tophat .gd .gd-updated { margin-top: 12px; font-size: 15px; }
}

/* text sizes: the serif runs small, so body copy sits a step up */
body.tpl-guide.gd-look-tophat { font-size: 18px; }
body.tpl-guide.gd-look-tophat .gd :is(h2, h3) { font-family: var(--mg-display); font-weight: 500; letter-spacing: .03em; text-transform: none; }
body.tpl-guide.gd-look-tophat .gd .gd-sortbar-h, body.tpl-guide.gd-look-tophat .gd :is(.gd-panel, .gd-articles) > h2 { font-family: var(--mg-display); font-weight: 500; font-size: clamp(22px, 2.2vw, 27px); line-height: 1.15; letter-spacing: .06em; text-transform: uppercase; color: #e1b851; }

/* filter: outlined pills, the chosen one filled gold */
body.gd-look-tophat .gd-filter { border: 0; border-radius: 0; padding: 12px 0 14px; background: transparent; }
body.gd-look-tophat .gd-filter-label { font-family: var(--mg-display); font-weight: 500; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--mg-soft); }
body.gd-look-tophat .gd-chip { padding: 7px 18px; border: 1px solid #b9a56a; background: transparent; color: #fff; font-family: var(--mg-text); font-weight: 500; font-size: 17px; }
body.gd-look-tophat .gd-chip.is-on { border-color: #e1b851; background: #e1b851; color: #14100a; font-weight: 600; }
body.gd-look-tophat .gd-chip:hover, body.gd-look-tophat .gd-chip:focus-visible { background: #1d1810; border-color: #e1b851; }
body.gd-look-tophat .gd-chip.is-on:hover, body.gd-look-tophat .gd-chip.is-on:focus-visible { background: #f1d98e; border-color: #f1d98e; }

/* cards: near-black panels with a thin gold outline */
body.tpl-guide.gd-look-tophat .gd .gd-card { background: #0d0b11; border: 1px solid #8f7430 !important; border-radius: 6px; box-shadow: none !important; overflow: hidden; }
body.tpl-guide.gd-look-tophat .gd .gd-cards--ours .gd-card { border-color: #e1b851 !important; }
body.tpl-guide.gd-look-tophat .gd .gd-rec { background: #e1b851; color: #14100a; font-family: var(--mg-display); font-weight: 700; letter-spacing: .08em; }
body.tpl-guide.gd-look-tophat .gd .gd-card-name, body.tpl-guide.gd-look-tophat .gd .gd-card-name a { font-family: var(--mg-display); font-weight: 500; letter-spacing: .01em; color: #fff; text-transform: none; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-card-name, body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-card-name a { font-size: 19px; line-height: 1.2; }

/* buttons: gold with dark lettering; second sellers are outlined */
body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct { border-radius: 4px; border-color: #e1b851; background: #e1b851 !important; }
body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct:hover, body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct:focus-visible { background: #f1d98e !important; }
body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-seller, body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-seller *, body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-price { color: #14100a !important; }
body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-seller { font-family: var(--mg-display); font-weight: 700; font-size: 19px !important; letter-spacing: .1em; text-transform: uppercase; }
body.tpl-guide.gd-look-tophat .gd .gd-buy-btn.gd-direct .gd-buy-seller * { font-size: inherit !important; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn { border: 1px solid #8f7430; border-radius: 4px; font-family: var(--mg-text); }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn.is-lowest { background: #e1b851; border-color: #e1b851; }
body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn.is-lowest .gd-buy-seller, body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn.is-lowest .gd-buy-price, body.tpl-guide.gd-look-tophat .gd .gd-card--plain .gd-buy-btn.is-lowest .gd-buy-seller * { color: #14100a !important; }

/* the Vegas411 news block: dark like the rest of the page */
body.tpl-guide.gd-look-tophat .gd .gd-articles.gd-news { background: #0d0b11; border: 1px solid #3d3218; border-top: 4px solid #7a1030; }
body.tpl-guide.gd-look-tophat .gd .gd-news .gd-article { background: #15121b; border: 1px solid #3d3218; color: #fff; }
body.tpl-guide.gd-look-tophat .gd .gd-news :is(h2, h3, h3 a, p) { color: #fff; }
body.tpl-guide.gd-look-tophat .gd .gd-news-more a { background: transparent; }

/* fixes after the first look in the browser */
body.gd-look-tophat .gd-filter .gd-filter-label { position: static; flex: 0 0 auto; margin: 0 8px 0 0; }
body.tpl-guide.gd-look-tophat .gd .gd-out a { color: #14100a !important; background: #e1b851; border-color: #e1b851; border-radius: 4px; font-family: var(--mg-text); font-weight: 600; }
body.tpl-guide.gd-look-tophat .gd .gd-out a:hover, body.tpl-guide.gd-look-tophat .gd .gd-out a:focus-visible { background: #f1d98e; }
@media (min-width: 860px) {
    body.gd-look-tophat .gd-hero { align-items: flex-start; }
    body.gd-look-tophat .gd-hero > :not(.gd-hero-art) { text-align: left; }
}