/* Match: gold on night. The trophy, the card a match shows as everywhere, the Match screen (leaderboard, keeping
   score, the card) and the composer's shelves of games. Glass panes and the composer's sky come from pings.css. */
.mt-page, .mt-embed, .mt-card, .mt-compose { --g: #ffd24a; --g2: #fff3b0; --g3: #c98a00; }
.mt-page { --c: var(--g); color: #eef4ff; padding-bottom: 130px; }
.mt-bg { background: radial-gradient(80% 46% at 50% 0%, rgba(255, 210, 74, .16), transparent 62%), radial-gradient(60% 40% at 100% 22%, rgba(169, 139, 255, .12), transparent 65%), radial-gradient(50% 36% at 0% 34%, rgba(57, 194, 122, .1), transparent 65%), #04070d; }
.mt-trophy { width: 26px; height: 26px; flex: none; filter: drop-shadow(0 0 8px rgba(255, 210, 74, .65)); }
.mt-trophy-shine { animation: mt-shine 3.6s ease-in-out infinite; }
@keyframes mt-shine { 0%, 100% { opacity: .2; } 50% { opacity: .75; } }
.mt-empty { margin: 8px 2px; color: #9fb4c8; font-size: 14.5px; line-height: 1.45; }
.mt-fine { margin: 8px 2px 0; color: #8194ad; font-size: 12px; line-height: 1.4; }
.mt-h2 { display: flex; align-items: center; gap: 8px; margin: 22px 2px 8px; font: 700 11px/1.2 ui-monospace, "JetBrains Mono", monospace; letter-spacing: .16em; text-transform: uppercase; color: var(--g, #ffd24a); }
.mt-h2 .mt-trophy { width: 20px; height: 20px; }

/* the gold button */
.mt-gold-btn { appearance: none; position: relative; overflow: hidden; display: block; width: 100%; min-height: 54px; margin: 14px 0 4px; padding: 14px 18px; border-radius: 14px; cursor: pointer; border: 1px solid #ffe9a0; color: #2a1a00; font: 700 17px/1.1 "Source Serif 4", Georgia, serif; letter-spacing: .02em;
  background: linear-gradient(135deg, #fff3b0, #ffd24a 45%, #e0a200); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), 0 0 26px rgba(255, 210, 74, .45), 0 10px 26px rgba(0, 0, 0, .4); transition: transform .15s ease, filter .2s ease; }
.mt-gold-btn::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, .6) 50%, transparent 65%); transform: translateX(-120%); animation: pc-sweep 4.2s ease-in-out infinite; }
.mt-gold-btn:active { transform: scale(.98); } .mt-gold-btn:disabled { filter: grayscale(.7) brightness(.7); cursor: default; }
.mt-gold-btn.is-small { width: auto; min-height: 40px; margin: 0; padding: 9px 14px; font-size: 14.5px; }

/* the card */
.mt-list, .mt-lists { display: grid; gap: 10px; }
.mt-card { position: relative; display: grid; gap: 8px; padding: 12px 14px; border-radius: 14px; text-decoration: none; color: #eef4ff; overflow: hidden;
  border: 1px solid rgba(255, 210, 74, .32); background: linear-gradient(150deg, rgba(255, 210, 74, .12), rgba(255, 255, 255, .03) 42%, rgba(8, 12, 24, .86)); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 10px 26px rgba(0, 0, 0, .32); }
.mt-card.is-live { border-color: rgba(255, 210, 74, .7); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 0 24px rgba(255, 210, 74, .22), 0 10px 26px rgba(0, 0, 0, .32); }
.mt-card-head { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: center; }
.mt-card-title { display: grid; gap: 3px; min-width: 0; }
.mt-card-title b { font: 600 16.5px/1.2 "Source Serif 4", Georgia, serif; overflow-wrap: anywhere; }
.mt-card-title small { color: #9fb4c8; font-size: 12.5px; line-height: 1.3; overflow-wrap: anywhere; }
.mt-status { display: inline-flex; align-items: center; gap: 6px; font: 700 10px/1 ui-monospace, monospace; font-style: normal; letter-spacing: .12em; text-transform: uppercase; color: #9fb4c8; white-space: nowrap; }
.mt-status.is-live { color: #ff6b6b; } .mt-status.is-live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #ff4d4d; box-shadow: 0 0 10px #ff4d4d; animation: pc-blink 1.4s ease-in-out infinite; }
.mt-status.is-final { color: var(--g, #ffd24a); }
.mt-card-line { margin: 0; font: 600 14.5px/1.3 "Source Serif 4", Georgia, serif; color: var(--g2); overflow-wrap: anywhere; } .mt-card-line.is-quiet { color: #9fb4c8; font-weight: 400; }
.mt-card-top { display: grid; gap: 4px; }
.mt-card-row { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto auto; gap: 8px; align-items: baseline; font-size: 13.5px; }
.mt-card-row i { font: 700 11px/1 ui-monospace, monospace; font-style: normal; color: #8fa3bd; } .mt-card-row b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mt-card-row em { font: 700 14px/1 ui-monospace, monospace; font-style: normal; color: #fff; }
.mt-card-row u, .mt-money { text-decoration: none; font: 700 12px/1 ui-monospace, monospace; padding: 4px 7px; border-radius: 8px; color: #cfd8e6; background: rgba(255, 255, 255, .07); }
.mt-card-row u.is-up, .mt-money.is-up { color: #2a1a00; background: linear-gradient(135deg, #fff3b0, #ffd24a); } .mt-card-row u.is-down, .mt-money.is-down { color: #ff9a9a; background: rgba(229, 72, 77, .16); }
.mt-embed { display: grid; gap: 4px; margin-top: 20px; }
.mt-embed-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; } .mt-embed-head .mt-h2 { margin: 0; }

/* the Match screen */
.mt-hero { display: grid; justify-items: center; gap: 6px; text-align: center; padding: 6px 0 4px; }
.mt-hero-art { position: relative; display: grid; place-items: center; width: 132px; height: 132px; --c: #ffd24a; }
.mt-hero-art .mt-trophy { position: relative; width: 62px; height: 62px; filter: drop-shadow(0 0 16px rgba(255, 210, 74, .8)); animation: pc-breathe 4.2s ease-in-out infinite; }
.mt-hero h1 { margin: 0; font: 700 clamp(28px, 7vw, 40px)/1.08 "Source Serif 4", Georgia, serif; letter-spacing: -.01em; text-shadow: 0 0 30px rgba(255, 210, 74, .35); overflow-wrap: anywhere; }
.mt-hero .mc-kicker { display: flex; align-items: center; gap: 2px; margin: 0; color: var(--g); }
.mt-hero-sub { margin: 0; color: #a9bbd0; font-size: 14px; line-height: 1.45; max-width: 46ch; }
.mt-headline { margin: 8px 0 0; padding: 10px 16px; border-radius: 14px; font: 700 18px/1.25 "Source Serif 4", Georgia, serif; color: var(--g2); border: 1px solid rgba(255, 210, 74, .35); background: linear-gradient(150deg, rgba(255, 210, 74, .14), rgba(8, 12, 24, .7)); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14); overflow-wrap: anywhere; }
.mt-acts { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 4px; }
.mt-tabs { display: flex; gap: 6px; margin: 14px 0 10px; padding: 4px; border-radius: 14px; border: 1px solid rgba(132, 196, 255, .16); background: rgba(8, 12, 24, .6); }
.mt-tab { appearance: none; flex: 1 1 0; min-height: 44px; padding: 8px 6px; border: 0; border-radius: 10px; background: none; color: #a9bbd0; font: 600 14.5px/1.1 Inter, system-ui, sans-serif; cursor: pointer; }
.mt-tab.is-on { color: #2a1a00; background: linear-gradient(135deg, #fff3b0, #ffd24a); box-shadow: 0 0 18px rgba(255, 210, 74, .4); }
.mt-rule { margin: 18px 2px 0; color: #8fa3bd; font: italic 14px/1.45 "Source Serif 4", Georgia, serif; text-align: center; }

.mt-board { display: grid; gap: 8px; }
.mt-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 12px 14px 12px 10px; border-radius: 14px; border: 1px solid rgba(132, 196, 255, .16); background: linear-gradient(160deg, rgba(255, 255, 255, .06), rgba(8, 12, 24, .7)); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08); animation: mt-in .45s cubic-bezier(.16, 1, .3, 1) both; animation-delay: calc(var(--i, 0) * 40ms); }
@keyframes mt-in { from { opacity: 0; filter: blur(4px); } to { opacity: 1; filter: none; } }
.mt-row.is-lead { border-color: rgba(255, 210, 74, .65); background: linear-gradient(150deg, rgba(255, 210, 74, .18), rgba(8, 12, 24, .72)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 0 26px rgba(255, 210, 74, .2); }
.mt-pos { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; font: 700 13px/1 ui-monospace, monospace; font-style: normal; color: #cfd8e6; background: rgba(255, 255, 255, .07); }
.mt-row.is-lead .mt-pos { color: #2a1a00; background: linear-gradient(135deg, #fff3b0, #ffd24a); box-shadow: 0 0 14px rgba(255, 210, 74, .6); }
.mt-row-text { display: grid; gap: 3px; min-width: 0; }
.mt-row-text b { font: 600 17px/1.2 "Source Serif 4", Georgia, serif; overflow-wrap: anywhere; }
.mt-row-text small { color: #9fb4c8; font-size: 12.5px; line-height: 1.35; overflow-wrap: anywhere; }
.mt-score { font: 700 22px/1 ui-monospace, "JetBrains Mono", monospace; font-style: normal; color: #fff; white-space: nowrap; text-align: right; }
.mt-row.is-lead .mt-score { color: var(--g2); text-shadow: 0 0 14px rgba(255, 210, 74, .5); }
.mt-row .mt-money { grid-column: 2 / -1; justify-self: start; font-size: 13px; padding: 5px 9px; }
.mt-row.is-A, .mt-row.is-B, .mt-row.is-C, .mt-row.is-D { border-left-width: 3px; }
.mt-row.is-A { border-left-color: #4be3ff; } .mt-row.is-B { border-left-color: #ff7ad1; } .mt-row.is-C { border-left-color: #7dffa9; } .mt-row.is-D { border-left-color: #b79bff; }

/* keeping score */
.mt-score-entry { display: grid; gap: 10px; }
.mt-hole { display: grid; grid-template-columns: 52px minmax(0, 1fr) 52px; gap: 8px; align-items: center; }
.mt-hole-nav { appearance: none; height: 52px; border-radius: 14px; border: 1px solid rgba(255, 210, 74, .4); background: rgba(8, 12, 24, .7); color: var(--g); font: 400 28px/1 Inter, system-ui, sans-serif; cursor: pointer; } .mt-hole-nav:disabled { opacity: .3; cursor: default; }
.mt-hole-mid { display: grid; gap: 3px; text-align: center; min-width: 0; } .mt-hole-mid b { font: 700 24px/1.05 "Source Serif 4", Georgia, serif; color: #fff; } .mt-hole-mid small { color: var(--g2); font-size: 13px; overflow-wrap: anywhere; }
.mt-dots { display: flex; gap: 5px; overflow-x: auto; padding: 4px 2px 6px; scrollbar-width: none; overscroll-behavior-x: contain; } .mt-dots::-webkit-scrollbar { display: none; }
.mt-dot { appearance: none; flex: none; width: 32px; height: 32px; border-radius: 50%; border: 1px solid rgba(132, 196, 255, .22); background: rgba(255, 255, 255, .04); color: #9fb4c8; font: 600 12px/1 ui-monospace, monospace; cursor: pointer; padding: 0; }
.mt-dot.is-done { border-color: rgba(255, 210, 74, .55); color: var(--g2); background: rgba(255, 210, 74, .12); } .mt-dot.is-on { color: #2a1a00; background: linear-gradient(135deg, #fff3b0, #ffd24a); border-color: #ffe9a0; box-shadow: 0 0 12px rgba(255, 210, 74, .6); }
.mt-entry { display: grid; grid-template-columns: minmax(0, 1fr) 52px 58px 52px; gap: 8px; align-items: center; padding: 10px 10px 10px 14px; border-radius: 14px; border: 1px solid rgba(132, 196, 255, .16); background: linear-gradient(160deg, rgba(255, 255, 255, .06), rgba(8, 12, 24, .7)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08); }
.mt-entry-name { display: grid; gap: 3px; min-width: 0; justify-items: start; } .mt-entry-name b { font: 600 16.5px/1.2 "Source Serif 4", Georgia, serif; overflow-wrap: anywhere; } .mt-entry-name small { color: #9fb4c8; font-size: 12px; }
.mt-step { appearance: none; width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(255, 210, 74, .45); background: rgba(255, 210, 74, .08); color: var(--g2); font: 400 28px/1 Inter, system-ui, sans-serif; cursor: pointer; padding: 0; transition: transform .12s ease; -webkit-tap-highlight-color: transparent; } .mt-step:active { transform: scale(.9); background: rgba(255, 210, 74, .3); }
.mt-val { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 14px; font: 700 28px/1 ui-monospace, "JetBrains Mono", monospace; color: #fff; border: 1.5px solid rgba(255, 255, 255, .22); background: rgba(4, 8, 18, .6); cursor: pointer; }
.mt-val.is-empty { color: #6f829c; border-style: dashed; }
.mt-val.is-birdie, .mt-val.is-eagle { border-radius: 50%; border-color: #ff6b6b; color: #ffb3b3; } .mt-val.is-eagle { box-shadow: 0 0 0 3px rgba(4, 8, 18, .9), 0 0 0 4.5px #ff6b6b; }
.mt-val.is-bogey, .mt-val.is-double { border-radius: 4px; border-color: #7fb6ff; color: #cfe2ff; } .mt-val.is-double { box-shadow: 0 0 0 3px rgba(4, 8, 18, .9), 0 0 0 4.5px #7fb6ff; }
.mt-clear { appearance: none; border: 0; background: none; padding: 4px 0; color: #8fa3bd; font: 600 12px/1 Inter, system-ui, sans-serif; text-decoration: underline; cursor: pointer; }

/* the card (a table that scrolls inside its own frame, never the page) */
.mt-grid-wrap { overflow-x: auto; border-radius: 14px; border: 1px solid rgba(132, 196, 255, .16); background: rgba(8, 12, 24, .7); overscroll-behavior-x: contain; }
.mt-grid { border-collapse: collapse; font: 600 13px/1 ui-monospace, "JetBrains Mono", monospace; color: #dbe8f7; }
.mt-grid th, .mt-grid td { padding: 9px 0; min-width: 32px; text-align: center; border-bottom: 1px solid rgba(132, 196, 255, .1); }
.mt-grid th:first-child { position: sticky; left: 0; z-index: 1; min-width: 92px; max-width: 120px; padding: 9px 10px; text-align: left; background: #0a1020; font: 600 13px/1.2 Inter, system-ui, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mt-grid tr:first-child th { color: var(--g); font-size: 11px; } .mt-grid .is-par td { color: #8fa3bd; } .mt-grid .is-tot { color: var(--g2); padding: 9px 10px; }
.mt-grid td span { display: inline-grid; place-items: center; width: 24px; height: 24px; }
.mt-grid .is-birdie span, .mt-grid .is-eagle span { border: 1.5px solid #ff6b6b; border-radius: 50%; color: #ffb3b3; } .mt-grid .is-bogey span, .mt-grid .is-double span { border: 1.5px solid #7fb6ff; border-radius: 3px; }
.mt-grid .is-eagle span, .mt-grid .is-double span { outline: 1.5px solid currentColor; outline-offset: 2px; }

/* the composer: shelves of games; the players */
.mt-compose .pc-hero-face .mt-trophy { width: 32px; height: 32px; }
.mt-games { display: grid; gap: 7px; max-height: 300px; overflow-y: auto; padding: 2px; scrollbar-width: thin; overscroll-behavior: contain; }
.mt-game { appearance: none; display: grid; gap: 3px; width: 100%; text-align: left; padding: 10px 12px; border-radius: 12px; cursor: pointer; color: #dbe8f7; font: inherit; border: 1px solid rgba(132, 196, 255, .2); background: rgba(255, 255, 255, .05); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); }
.mt-game b { font: 600 15.5px/1.2 "Source Serif 4", Georgia, serif; color: #fff; } .mt-game small { color: #9fb4c8; font-size: 12.5px; line-height: 1.35; }
.mt-game.is-on { border-color: #ffd24a; background: linear-gradient(140deg, rgba(255, 210, 74, .26), rgba(255, 255, 255, .04)); box-shadow: 0 0 0 1px #ffd24a, 0 0 22px rgba(255, 210, 74, .35); } .mt-game.is-on small { color: #f3e3b0; }
.mt-players { display: grid; gap: 7px; }
.mt-player { appearance: none; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; width: 100%; text-align: left; padding: 8px 12px 8px 8px; border-radius: 12px; cursor: pointer; color: #eef4ff; font: inherit; border: 1px solid rgba(132, 196, 255, .2); background: rgba(255, 255, 255, .05); }
.mt-player-badge { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; font: 700 13px/1 ui-monospace, monospace; font-style: normal; color: #2a1a00; background: linear-gradient(135deg, #fff3b0, #ffd24a); }
.mt-player-badge.is-A { background: #4be3ff; } .mt-player-badge.is-B { background: #ff7ad1; } .mt-player-badge.is-C { background: #7dffa9; } .mt-player-badge.is-D { background: #b79bff; }
.mt-player-text { display: grid; gap: 2px; min-width: 0; } .mt-player-text b { font: 600 15.5px/1.2 Inter, system-ui, sans-serif; overflow-wrap: anywhere; } .mt-player-text small { color: #9fb4c8; font-size: 12px; }
.mt-player em { font: 600 12px/1 Inter, system-ui, sans-serif; font-style: normal; color: var(--g, #ffd24a); }
.mt-player-add { display: flex; flex-wrap: wrap; gap: 7px; }
.mt-guide { display: grid; gap: 8px; margin-top: 10px; }
.mt-guide-group { border-radius: 14px; border: 1px solid rgba(132, 196, 255, .16); background: rgba(8, 12, 24, .6); padding: 0 10px; }
.mt-guide-group[open] { padding-bottom: 10px; } .mt-guide-group .mt-game { margin-top: 7px; }
.mt-guide-group summary { display: flex; justify-content: space-between; align-items: center; min-height: 48px; cursor: pointer; list-style: none; } .mt-guide-group summary::-webkit-details-marker { display: none; }
.mt-guide-group summary b { font: 600 16px/1.2 "Source Serif 4", Georgia, serif; } .mt-guide-group summary small { font: 700 11px/1 ui-monospace, monospace; color: var(--g, #ffd24a); padding: 4px 8px; border-radius: 8px; background: rgba(255, 210, 74, .12); }

/* the welcome's Match button: a golden trophy */
.welcome-match .welcome-newsletter-icon { background: radial-gradient(circle at 50% 35%, rgba(255, 210, 74, .3), rgba(255, 210, 74, .06) 70%); border-color: rgba(255, 210, 74, .6); box-shadow: 0 0 16px rgba(255, 210, 74, .35); }
.welcome-match .mt-trophy { width: 22px; height: 22px; }
.welcome-match .welcome-match-label { color: #ffe9a0; }
@media (prefers-reduced-motion: reduce) { .mt-trophy-shine, .mt-gold-btn::after, .mt-row, .mt-hero-art .mt-trophy, .mt-status.is-live::before { animation: none !important; } }

.mt-hero-art { width: 92px; height: 92px; } .mt-hero-art .mt-trophy { width: 46px; height: 46px; }
.mt-page .mt-acts:last-child { margin-top: 18px; }
.welcome-club-row a.welcome-newsletter, .welcome-club-row a.welcome-newsletter span { text-decoration: none; }
