/* Shared shell for non-home public pages using the YouGoNow handoff design system */
.ygd-page {
  min-height: 100vh;
  background: var(--ink);
  color: var(--fg);
  font-family: var(--body);
}
.ygd-page .site { position: fixed; left: 0; right: 0; top: 0; z-index: 40; }
.ygd-page-main {
  max-width: 980px;
  margin: 0 auto;
  padding: 104px 20px 80px;
}
.ygd-page-main h1 {
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(32px, 5vw, 48px);
  margin: 0 0 12px;
}
.ygd-page-main .lead {
  color: var(--mist);
  font-size: 17px;
  line-height: 1.55;
  margin: 0 0 28px;
  max-width: 42rem;
}
.ygd-card {
  background: var(--em);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 22px;
  margin-bottom: 16px;
}
.ygd-card h2, .ygd-card h3 {
  font-family: var(--serif);
  font-weight: 500;
  margin: 0 0 10px;
}
.ygd-card p, .ygd-card li { color: var(--mist); line-height: 1.55; }
.ygd-form label {
  display: block;
  margin: 0 0 14px;
  font-size: 14px;
  font-weight: 600;
}
.ygd-form input, .ygd-form textarea, .ygd-form select {
  width: 100%;
  margin-top: 6px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  color: var(--fg);
  padding: 12px 14px;
  font: inherit;
  box-sizing: border-box;
}
html[data-theme="light"] .ygd-form input,
html[data-theme="light"] .ygd-form textarea,
html[data-theme="light"] .ygd-form select {
  background: #fff;
  color: #12251e;
}
.ygd-form .btn, .ygd-actions .btn { margin-top: 8px; }
.ygd-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
.ygd-tour-card {
  display: flex;
  flex-direction: column;
  border-radius: 18px;
  overflow: hidden;
  background: var(--em);
  border: 1px solid var(--line);
  text-decoration: none;
  color: inherit;
}
.ygd-tour-card img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  display: block;
}
.ygd-tour-card .body { padding: 14px 16px 18px; }
.ygd-tour-card h3 {
  font-family: var(--serif);
  margin: 0 0 6px;
  font-size: 22px;
}
.ygd-tour-card p { margin: 0; color: var(--mist); font-size: 14px; }
.ygd-alert {
  border-radius: 14px;
  padding: 12px 14px;
  margin-bottom: 16px;
  background: rgba(63, 219, 230, .12);
  border: 1px solid rgba(63, 219, 230, .35);
}
.ygd-alert.error {
  background: rgba(255, 106, 69, .12);
  border-color: rgba(255, 106, 69, .4);
}
.ygd-page footer.ygd-foot {
  border-top: 1px solid var(--line);
  padding: 28px 20px 40px;
  color: var(--mist2);
  font-size: 13px;
}
.ygd-page footer.ygd-foot .wrap {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  justify-content: space-between;
  align-items: center;
}
.ygd-page footer.ygd-foot a { color: var(--teal); text-decoration: none; }
.ygd-page footer.ygd-foot nav { display: flex; flex-wrap: wrap; gap: 12px 16px; }

/* ?? Account / profile dashboard (handoff visual language) ?? */
.ygd-dash { display: flex; flex-direction: column; gap: 22px; }
.ygd-dash__hero {
  display: flex; flex-wrap: wrap; gap: 18px 28px;
  justify-content: space-between; align-items: flex-end;
  padding: 8px 0 4px;
}
.ygd-dash__kicker {
  margin: 0 0 6px; color: var(--teal); font-size: 12px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
}
.ygd-dash__hero h1 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(32px, 5vw, 46px); margin: 0 0 8px; line-height: 1.1;
}
.ygd-dash__lead { margin: 0; color: var(--mist); max-width: 36rem; }
.ygd-dash__hero-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ygd-dash__logout { margin: 0; display: inline-flex; }
.ygd-dash__remind {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 0 14px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--em); color: var(--fg);
  font: inherit; font-weight: 600; cursor: pointer;
}
.ygd-dash__remind.is-on { border-color: var(--gold); color: var(--gold); }

.ygd-dash__stats {
  display: grid; gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 720px) {
  .ygd-dash__stats { grid-template-columns: 1fr; }
}
.ygd-dash__stat {
  display: flex; gap: 14px; align-items: center;
  background: var(--em); border: 1px solid var(--line);
  border-radius: 18px; padding: 16px 18px;
}
.ygd-dash__stat small { display: block; color: var(--mist2); font-size: 12px; margin-bottom: 4px; }
.ygd-dash__stat b {
  font-family: var(--serif); font-size: 28px; font-weight: 500; line-height: 1;
}
.ygd-dash__stat-mark {
  width: 44px; height: 44px; border-radius: 14px;
  display: grid; place-items: center;
  background: rgba(63,219,230,.12); color: var(--teal); font-size: 18px;
  position: relative;
}
.ygd-dash__stat-mark::before {
  content: ""; width: 18px; height: 12px; border: 2px solid currentColor; border-radius: 3px;
  box-shadow: 2px -2px 0 -1px currentColor;
}
.ygd-dash__stat-mark--teal::before {
  width: 14px; height: 14px; border-radius: 50%; box-shadow: none;
  border: 2px solid currentColor; background: transparent;
}
.ygd-dash__stat-mark--gold::before {
  width: 0; height: 0; border: 0; box-shadow: none;
  background: currentColor;
  clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
  width: 16px; height: 16px;
}
.ygd-dash__stat-mark--gold { background: rgba(217,178,90,.16); color: var(--gold); }
.ygd-dash__stat-mark--teal { background: rgba(63,219,230,.16); color: var(--teal); }

.ygd-dash__tabs {
  display: flex; flex-wrap: wrap; gap: 8px;
  border-bottom: 1px solid var(--line); padding-bottom: 12px;
}
.ygd-dash__tabs button {
  min-height: 42px; padding: 0 16px; border-radius: 999px;
  border: 1px solid transparent; background: transparent;
  color: var(--mist); font: inherit; font-weight: 600; cursor: pointer;
}
.ygd-dash__tabs button.is-on {
  background: var(--em); border-color: var(--line); color: var(--fg);
  box-shadow: inset 0 0 0 1px rgba(217,178,90,.25);
}

.ygd-dash__panel { display: flex; flex-direction: column; gap: 16px; }
.ygd-dash__live {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background:
    linear-gradient(120deg, rgba(255, 90, 54, .12), rgba(63, 219, 230, .08)),
    var(--em);
  text-decoration: none;
  color: inherit;
  transition: border-color .2s ease, transform .2s ease;
}
.ygd-dash__live:hover {
  border-color: rgba(217, 178, 90, .45);
  transform: translateY(-1px);
}
.ygd-dash__live-badge {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  background: rgba(var(--fg-rgb), .08);
  color: var(--mist);
  border: 1px solid var(--line);
}
.ygd-dash__live-badge::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  opacity: .55;
}
.ygd-dash__live-badge.is-on {
  color: #1a0a06;
  background: var(--coral);
  border-color: transparent;
}
.ygd-dash__live-badge.is-on::before {
  background: #1a0a06;
  opacity: 1;
  box-shadow: 0 0 0 0 rgba(255, 106, 69, .55);
  animation: ygdLivePing 1.6s infinite;
}
.ygd-dash__live-copy {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  gap: 2px;
}
.ygd-dash__live-copy strong {
  font-family: var(--serif);
  font-weight: 500;
  font-size: 18px;
}
.ygd-dash__live-copy em {
  font-style: normal;
  color: var(--mist);
  font-size: 13.5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ygd-dash__live-go {
  color: var(--gold);
  font-size: 20px;
  font-weight: 700;
  flex-shrink: 0;
}
html[dir="rtl"] .ygd-dash__live-go { transform: scaleX(-1); }

.ygd-dash__banner {
  display: flex; flex-wrap: wrap; gap: 12px 20px; justify-content: space-between; align-items: center;
  padding: 16px 18px; border-radius: 18px;
  background: linear-gradient(120deg, rgba(217,178,90,.18), rgba(63,219,230,.08));
  border: 1px solid rgba(217,178,90,.35);
}
.ygd-dash__banner strong { display: block; font-family: var(--serif); font-size: 20px; margin-bottom: 4px; }
.ygd-dash__banner span, .ygd-dash__banner em { color: var(--mist); font-style: normal; font-size: 14px; }

.ygd-dash__invite {
  background: var(--em); border: 1px solid var(--line); border-radius: 20px; padding: 20px;
  display: grid; gap: 14px;
}
.ygd-dash__invite h3 { margin: 0 0 6px; font-family: var(--serif); font-weight: 500; font-size: 24px; }
.ygd-dash__invite p { margin: 0; color: var(--mist); }
.ygd-dash__invite code {
  display: inline-block; margin-top: 10px; padding: 6px 10px; border-radius: 10px;
  background: rgba(0,0,0,.25); color: var(--gold); font-weight: 700; letter-spacing: .04em;
}
.ygd-dash__invite-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ygd-dash__invite-actions input {
  flex: 1 1 220px; min-height: 48px; border-radius: 12px; border: 1px solid var(--line);
  background: rgba(255,255,255,.04); color: var(--fg); padding: 0 14px; font: inherit;
}
.ygd-dash__invite-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.ygd-dash__invite-list li {
  padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.03); border: 1px solid var(--line);
}

.ygd-dash__filters { display: flex; flex-wrap: wrap; gap: 10px; }
.ygd-dash__filters select {
  min-height: 44px; border-radius: 12px; border: 1px solid var(--line);
  background: var(--em); color: var(--fg); padding: 0 12px; font: inherit;
}

.ygd-dash__tablewrap {
  overflow: auto; border-radius: 18px; border: 1px solid var(--line); background: var(--em);
}
.ygd-dash__table { width: 100%; border-collapse: collapse; min-width: 640px; }
.ygd-dash__table th, .ygd-dash__table td {
  padding: 14px 16px; text-align: start; border-bottom: 1px solid var(--line); color: var(--mist);
}
.ygd-dash__table th { color: var(--fg); font-size: 12px; letter-spacing: .04em; text-transform: uppercase; }
.ygd-dash__table tr.is-on { background: rgba(217,178,90,.08); }
.ygd-dash__table tr:last-child td { border-bottom: 0; }
.ygd-dash__view {
  min-height: 36px; padding: 0 12px; border-radius: 999px;
  border: 1px solid var(--line); background: transparent; color: var(--teal);
  font: inherit; font-weight: 600; cursor: pointer;
}
.ygd-dash__badge {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 28px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 700;
  background: rgba(255,255,255,.06); color: var(--fg);
}
.ygd-dash__badge--won, .ygd-dash__badge--received { background: rgba(217,178,90,.2); color: var(--gold); }
.ygd-dash__badge--entered, .ygd-dash__badge--awaiting { background: rgba(63,219,230,.14); color: var(--teal); }
.ygd-dash__badge--lost { opacity: .75; }

.ygd-dash__empty {
  text-align: center; padding: 40px 20px; border-radius: 20px;
  border: 1px dashed var(--line); background: var(--em);
}
.ygd-dash__empty p { color: var(--mist); margin: 0 0 16px; }
.ygd-dash__filter-empty { color: var(--mist); text-align: center; }

.ygd-dash__wins { display: grid; gap: 12px; }
.ygd-dash__win-card {
  display: flex; flex-wrap: wrap; gap: 14px; justify-content: space-between; align-items: center;
  padding: 18px; border-radius: 18px; background: var(--em); border: 1px solid var(--line);
}
.ygd-dash__win-card h3 { margin: 0 0 4px; font-family: var(--serif); font-weight: 500; font-size: 22px; }
.ygd-dash__win-card p { margin: 0; color: var(--mist); }
.ygd-dash__win-side { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

.ygd-dash__profile {
  background: var(--em); border: 1px solid var(--line); border-radius: 22px; padding: 22px;
  display: grid; gap: 20px;
}
.ygd-dash__profile-id { display: flex; gap: 14px; align-items: center; }
.ygd-dash__avatar {
  width: 64px; height: 64px; border-radius: 20px; display: grid; place-items: center;
  font-family: var(--serif); font-size: 28px; font-weight: 600;
  background: var(--foil, linear-gradient(110deg,#a77a26,#f3d98b,#a77a26)); color: #1a1408;
}
.ygd-dash__profile-id h2 { margin: 0 0 4px; font-family: var(--serif); font-weight: 500; font-size: 28px; }
.ygd-dash__profile-id p { margin: 0; color: var(--mist); }
.ygd-dash__profile-grid { display: grid; gap: 10px; }
.ygd-dash__profile-row {
  display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; align-items: center;
  padding: 12px 14px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--line);
}
.ygd-dash__profile-row span { color: var(--mist2); font-size: 13px; }
.ygd-dash__profile-row strong.is-muted { color: var(--mist2); font-weight: 500; }
.ygd-dash__switch {
  display: inline-flex; align-items: center; gap: 10px; cursor: pointer; user-select: none;
}
.ygd-dash__switch input { position: absolute; opacity: 0; pointer-events: none; }
.ygd-dash__switch i {
  width: 44px; height: 26px; border-radius: 999px; background: rgba(255,255,255,.12);
  position: relative; display: block; transition: .2s;
}
.ygd-dash__switch i::after {
  content: ""; position: absolute; top: 3px; inset-inline-start: 3px;
  width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: .2s;
}
.ygd-dash__switch input:checked + i { background: rgba(217,178,90,.55); }
.ygd-dash__switch input:checked + i::after { inset-inline-start: 21px; }
.ygd-dash__profile-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.ygd-dash__profile-actions .btn-line,
.ygd-page .btn-line {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 0 18px; border-radius: 999px;
  border: 1px solid var(--line); background: transparent; color: var(--fg);
  font: inherit; font-weight: 700; cursor: pointer; text-decoration: none;
}

.ygd-dash__activity {
  margin-top: 8px; background: var(--em); border: 1px solid var(--line);
  border-radius: 20px; padding: 18px;
}
.ygd-dash__activity h3 { margin: 0 0 12px; font-family: var(--serif); font-weight: 500; }
.ygd-dash__activity ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.ygd-dash__activity li {
  display: grid; gap: 2px; padding: 10px 12px; border-radius: 12px;
  border: 1px solid var(--line); background: rgba(255,255,255,.03);
}
.ygd-dash__activity span { color: var(--mist2); font-size: 12px; }
.ygd-dash__activity em { color: var(--mist); font-style: normal; font-size: 13px; }
.ygd-dash__muted { color: var(--mist2) !important; }

.ygd-dash__modal {
  border: 0; padding: 0; background: transparent; max-width: min(440px, calc(100vw - 24px));
}
.ygd-dash__modal::backdrop { background: rgba(6,16,13,.72); backdrop-filter: blur(6px); }
.ygd-dash__modal-card {
  background: var(--em); color: var(--fg); border: 1px solid var(--line);
  border-radius: 22px; padding: 20px; display: grid; gap: 14px;
}
.ygd-dash__modal-card header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.ygd-dash__modal-card h3 { margin: 0; font-family: var(--serif); font-weight: 500; font-size: 24px; }
.ygd-dash__modal-close {
  width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line);
  background: transparent; color: var(--fg); font-size: 22px; cursor: pointer;
}
.ygd-dash__spec { margin: 0; display: grid; gap: 8px; }
.ygd-dash__spec > div {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.03); border: 1px solid var(--line);
}
.ygd-dash__spec dt { color: var(--mist2); }
.ygd-dash__spec dd { margin: 0; color: var(--fg); font-weight: 600; }

@media (max-width: 640px) {
  .ygd-dash__table { min-width: 0; }
  .ygd-dash__table thead { display: none; }
  .ygd-dash__table tr {
    display: grid; gap: 8px; padding: 14px; border-bottom: 1px solid var(--line);
  }
  .ygd-dash__table td {
    display: flex; justify-content: space-between; gap: 12px;
    border: 0; padding: 0; color: var(--fg);
  }
  .ygd-dash__table td::before {
    content: attr(data-label); color: var(--mist2); font-size: 12px;
  }
}

/* ?? Winner dashboard ?? */
.ygd-winner { display: grid; gap: 22px; }
.ygd-winner__hero {
  display: flex; flex-wrap: wrap; gap: 18px 28px;
  justify-content: space-between; align-items: stretch;
  padding: 8px 0 4px;
}
.ygd-winner__kicker {
  margin: 0 0 8px; color: var(--gold); font-size: 12px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
}
.ygd-winner__hero h1 {
  margin: 0 0 10px; font-family: var(--serif); font-weight: 500;
  font-size: clamp(28px, 4.5vw, 42px); line-height: 1.15; max-width: 18ch;
}
.ygd-winner__status { margin: 0 0 12px; color: var(--mist); }
.ygd-winner__status strong { color: var(--gold); }
.ygd-winner__back { color: var(--teal); text-decoration: none; font-weight: 600; font-size: 14px; }
.ygd-winner__countdown {
  min-width: min(280px, 100%);
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
  padding: 16px; border-radius: 20px;
  background: linear-gradient(145deg, rgba(217,178,90,.18), rgba(63,219,230,.08));
  border: 1px solid rgba(217,178,90,.35); align-content: start;
}
.ygd-winner__count {
  background: rgba(0,0,0,.22); border-radius: 14px; padding: 12px;
  text-align: center; border: 1px solid var(--line);
}
.ygd-winner__count b {
  display: block; font-family: var(--serif); font-size: 32px; font-weight: 500; line-height: 1;
}
.ygd-winner__count span { color: var(--mist2); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.ygd-winner__countdown em {
  grid-column: 1 / -1; font-style: normal; color: var(--mist); font-size: 13px; text-align: center;
}

.ygd-winner__steps {
  display: grid; gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 800px) {
  .ygd-winner__steps { grid-template-columns: 1fr 1fr; }
}
.ygd-winner__steps button {
  display: flex; align-items: center; gap: 10px;
  min-height: 52px; padding: 10px 12px; border-radius: 14px;
  border: 1px solid var(--line); background: var(--em); color: var(--mist);
  font: inherit; font-weight: 600; font-size: 13px; text-align: start; cursor: pointer;
}
.ygd-winner__steps button.is-on {
  color: var(--fg); border-color: rgba(217,178,90,.45);
  box-shadow: inset 0 0 0 1px rgba(217,178,90,.2);
}
.ygd-winner__step-num {
  width: 28px; height: 28px; border-radius: 50%; flex: 0 0 auto;
  display: grid; place-items: center; font-size: 12px;
  background: rgba(217,178,90,.18); color: var(--gold);
}

.ygd-winner__layout {
  display: grid; gap: 18px;
  grid-template-columns: minmax(0, 1.6fr) minmax(240px, .8fr);
}
@media (max-width: 900px) {
  .ygd-winner__layout { grid-template-columns: 1fr; }
}
.ygd-winner__form { display: grid; gap: 14px; }
.ygd-winner__card {
  background: var(--em); border: 1px solid var(--line); border-radius: 20px; padding: 20px;
}
.ygd-winner__card h2 {
  margin: 0 0 8px; font-family: var(--serif); font-weight: 500; font-size: 24px;
}
.ygd-winner__card > p { margin: 0 0 14px; color: var(--mist); line-height: 1.5; }
.ygd-winner__grid { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; }
@media (max-width: 640px) {
  .ygd-winner__grid { grid-template-columns: 1fr; }
}
.ygd-winner__field { display: grid; gap: 6px; font-size: 13px; font-weight: 600; color: var(--mist); }
.ygd-winner__field input,
.ygd-winner__field select {
  min-height: 48px; border-radius: 12px; border: 1px solid var(--line);
  background: rgba(255,255,255,.04); color: var(--fg); padding: 0 12px; font: inherit; font-weight: 500;
}
.ygd-winner__check {
  display: flex; align-items: center; gap: 10px; margin-bottom: 12px;
  color: var(--fg); font-weight: 600; cursor: pointer;
}
.ygd-winner__check input { width: 18px; height: 18px; accent-color: var(--gold); }
.ygd-winner__upload {
  display: grid; gap: 8px; justify-items: center; text-align: center;
  padding: 28px 16px; border-radius: 16px; border: 1px dashed rgba(217,178,90,.45);
  background: rgba(217,178,90,.06); cursor: pointer; position: relative;
}
.ygd-winner__upload input {
  position: absolute; inset: 0; opacity: 0; cursor: pointer;
}
.ygd-winner__upload-ico {
  width: 44px; height: 44px; border-radius: 14px;
  background: rgba(217,178,90,.2); border: 1px solid rgba(217,178,90,.35);
  position: relative;
}
.ygd-winner__upload-ico::before {
  content: ""; position: absolute; inset: 14px 12px 12px;
  border: 2px solid var(--gold); border-top: 0; border-radius: 0 0 4px 4px;
}
.ygd-winner__upload-ico::after {
  content: ""; position: absolute; top: 10px; left: 50%; width: 2px; height: 14px;
  background: var(--gold); transform: translateX(-50%);
  box-shadow: -5px 5px 0 -1px var(--gold), 5px 5px 0 -1px var(--gold);
}
.ygd-winner__upload strong { color: var(--fg); font-size: 14px; }
.ygd-winner__upload em { color: var(--teal); font-style: normal; font-size: 13px; }
.ygd-winner__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.ygd-winner__flash {
  margin: 0; padding: 12px 14px; border-radius: 14px;
  background: rgba(63,219,230,.12); border: 1px solid rgba(63,219,230,.35); color: var(--fg);
}
.ygd-winner__timeline { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.ygd-winner__timeline li {
  display: flex; gap: 12px; align-items: flex-start; color: var(--mist2); font-size: 14px;
}
.ygd-winner__timeline li i {
  width: 12px; height: 12px; margin-top: 4px; border-radius: 50%;
  border: 2px solid var(--line); flex: 0 0 auto; background: transparent;
}
.ygd-winner__timeline li.is-done { color: var(--fg); }
.ygd-winner__timeline li.is-done i { background: var(--gold); border-color: var(--gold); }
.ygd-winner__timeline li.is-next { color: var(--teal); }
.ygd-winner__timeline li.is-next i { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(63,219,230,.15); }

.yg-toast[data-yg-toast], .ygd-page .yg-toast {
  position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%);
  z-index: 90; min-width: min(320px, calc(100vw - 32px));
  padding: 12px 18px; border-radius: 999px; text-align: center;
  background: var(--em2, #0f3a2f); color: var(--fg);
  border: 1px solid var(--line); box-shadow: 0 16px 40px rgba(0,0,0,.35);
}
.yg-toast[hidden] { display: none !important; }

.ygd-otp-channels { border: 0; margin: 0 0 14px; padding: 0; }
.ygd-otp-channels legend { font-size: 13px; font-weight: 700; color: var(--mist); margin-bottom: 8px; }
.ygd-otp-channels__row { display: flex; flex-wrap: wrap; gap: 8px; }
.ygd-otp-channels__opt {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 42px; padding: 0 14px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--em); cursor: pointer; font-weight: 600;
}
.ygd-otp-channels__opt:has(input:checked) {
  border-color: rgba(217,178,90,.5); color: var(--gold);
  box-shadow: inset 0 0 0 1px rgba(217,178,90,.2);
}
.ygd-otp-channels__opt input { accent-color: var(--gold); }

/* Live draw page */
.ygd-live { display: flex; flex-direction: column; gap: 22px; }
.ygd-live__hero { padding: 8px 4px 4px; }
.ygd-live__kicker {
  margin: 0 0 10px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--gold);
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.ygd-live__kicker::before {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--gold);
}
.ygd-live__lead {
  margin: 0 0 18px;
  color: var(--mist);
  font-size: 17px;
  line-height: 1.55;
  max-width: 40rem;
}
.ygd-live__actions { display: flex; flex-wrap: wrap; gap: 10px; }

.ygd-live__stage {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ygd-live__screen {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid var(--line);
  background: var(--em2);
  padding: 22px 22px 28px;
  min-height: clamp(280px, 42vw, 380px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 18px;
  isolation: isolate;
}
.ygd-live__backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.ygd-live__backdrop img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.04);
  animation: ygdLiveDrift 22s ease-in-out infinite alternate;
}
.ygd-live__veil {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(110deg, rgba(6, 16, 13, .88) 0%, rgba(6, 16, 13, .55) 48%, rgba(6, 16, 13, .28) 100%),
    radial-gradient(ellipse 70% 60% at 80% 20%, rgba(63, 219, 230, .22), transparent 55%),
    radial-gradient(ellipse 50% 45% at 15% 90%, rgba(217, 178, 90, .18), transparent 50%);
}
html[data-theme="light"] .ygd-live__veil {
  background:
    linear-gradient(110deg, rgba(248, 243, 232, .92) 0%, rgba(248, 243, 232, .72) 45%, rgba(18, 37, 30, .35) 100%),
    radial-gradient(ellipse 70% 60% at 80% 20%, rgba(5, 100, 112, .16), transparent 55%),
    radial-gradient(ellipse 50% 45% at 15% 90%, rgba(122, 85, 18, .14), transparent 50%);
}
@keyframes ygdLiveDrift {
  from { transform: scale(1.04) translate3d(0, 0, 0); }
  to { transform: scale(1.1) translate3d(-2%, -1.5%, 0); }
}

.ygd-live__screen-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 14px;
  position: relative;
  z-index: 2;
}
.ygd-live__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  background: rgba(6, 16, 13, .45);
  color: rgba(246, 239, 226, .8);
  border: 1px solid rgba(217, 178, 90, .28);
  backdrop-filter: blur(8px);
}
html[data-theme="light"] .ygd-live__badge {
  background: rgba(248, 243, 232, .78);
  color: #12251e;
  border-color: rgba(140, 105, 40, .28);
}
.ygd-live__badge::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
  opacity: .55;
}
.ygd-live__badge.is-on {
  color: #1a0a06;
  background: var(--coral);
  border-color: transparent;
}
.ygd-live__badge.is-on::before {
  background: #1a0a06;
  opacity: 1;
  box-shadow: 0 0 0 0 rgba(255, 106, 69, .6);
  animation: ygdLivePing 1.6s infinite;
}
@keyframes ygdLivePing {
  100% { box-shadow: 0 0 0 10px rgba(255, 106, 69, 0); }
}
.ygd-live__pulse {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(246, 239, 226, .45);
  opacity: .7;
}
.ygd-live__pulse.is-on {
  background: var(--coral);
  opacity: 1;
  box-shadow: 0 0 0 0 rgba(255, 106, 69, .55);
  animation: ygdLivePing 1.6s infinite;
}

.ygd-live__copy {
  position: relative;
  z-index: 2;
  max-width: 36rem;
}
.ygd-live__show-title {
  display: block;
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(26px, 4.4vw, 36px);
  line-height: 1.1;
  color: #f6efe2;
  letter-spacing: -.015em;
}
html[data-theme="light"] .ygd-live__show-title { color: #12251e; }
.ygd-live__place {
  margin: 8px 0 0;
  color: var(--teal);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .04em;
}
.ygd-live__place.is-empty { display: none; }
.ygd-live__note {
  margin: 12px 0 0;
  color: rgba(246, 239, 226, .78);
  max-width: 36rem;
  line-height: 1.5;
}
html[data-theme="light"] .ygd-live__note { color: rgba(18, 37, 30, .78); }

.ygd-live__ring {
  position: absolute;
  right: 8%;
  bottom: 12%;
  width: min(160px, 34vw);
  height: min(160px, 34vw);
  border-radius: 50%;
  border: 1.5px dashed rgba(243, 217, 139, .42);
  z-index: 1;
  pointer-events: none;
  animation: ygdLiveSpin 18s linear infinite;
}
@keyframes ygdLiveSpin { to { transform: rotate(360deg); } }

.ygd-live__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
@media (max-width: 640px) {
  .ygd-live__stats { grid-template-columns: 1fr; }
  .ygd-live__ring { opacity: .35; }
}
.ygd-live__stat {
  border-radius: 18px;
  border: 1px solid var(--line);
  background: var(--em);
  padding: 16px 18px;
}
.ygd-live__stat small {
  display: block;
  color: var(--mist2);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.ygd-live__stat b {
  font-family: var(--serif);
  font-weight: 600;
  font-size: clamp(22px, 4vw, 28px);
  color: var(--gold2);
  font-variant-numeric: tabular-nums;
}

.ygd-live__winners-card,
.ygd-live__host {
  border-radius: 20px;
  border: 1px solid var(--line);
  background: var(--em);
  padding: 20px 22px;
}
.ygd-live__winners-card h2,
.ygd-live__host h2 {
  margin: 0 0 14px;
  font-family: var(--serif);
  font-weight: 500;
  font-size: 24px;
}
.ygd-live__winners {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.ygd-live__winners li {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 10px 14px;
  border-radius: 14px;
  background: rgba(var(--fg-rgb), .04);
  border: 1px solid var(--line);
  font-weight: 600;
  color: var(--fg);
}
.ygd-live__winners li:not(.is-empty)::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
}
.ygd-live__winners li.is-empty {
  color: var(--mist);
  font-weight: 500;
  border-style: dashed;
}

.ygd-live__host-form {
  display: grid;
  gap: 14px;
}
.ygd-live__host-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--mist);
}
.ygd-live__host-form select,
.ygd-live__host-form input {
  min-height: 48px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  color: var(--fg);
  padding: 0 14px;
  font: inherit;
}
html[data-theme="light"] .ygd-live__host-form select,
html[data-theme="light"] .ygd-live__host-form input {
  background: #fff;
  color: #12251e;
}
.ygd-live__host-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}

@media (prefers-reduced-motion: reduce) {
  .ygd-live__backdrop img,
  .ygd-live__ring,
  .ygd-live__badge.is-on::before,
  .ygd-live__pulse.is-on { animation: none; }
}

/* Checkout */
.ygd-check { display: flex; flex-direction: column; gap: 22px; }
.ygd-check--narrow { max-width: 560px; margin-inline: auto; width: 100%; }
.ygd-check__hero { padding: 4px 2px 0; }
.ygd-check__kicker {
  margin: 0 0 10px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--gold);
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.ygd-check__kicker::before {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--gold);
}
.ygd-check__lead {
  margin: 0;
  color: var(--mist);
  font-size: 17px;
  line-height: 1.55;
  max-width: 40rem;
}
.ygd-check__flash {
  margin: 0;
  padding: 12px 16px;
  border-radius: 14px;
  border: 1px solid rgba(255, 90, 54, .35);
  background: rgba(255, 90, 54, .12);
  color: var(--fg);
  font-weight: 600;
}

.ygd-check__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .9fr);
  gap: 18px 22px;
  align-items: start;
}
@media (max-width: 820px) {
  .ygd-check__layout { grid-template-columns: 1fr; }
}

.ygd-check__main {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ygd-check__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: var(--em);
}
.ygd-check__field span {
  font-size: 13px;
  font-weight: 700;
  color: var(--mist);
}
.ygd-check__field input {
  min-height: 48px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  color: var(--fg);
  padding: 0 14px;
  font: inherit;
}
html[data-theme="light"] .ygd-check__field input {
  background: #fff;
  color: #12251e;
}

.ygd-check__methods {
  margin: 0;
  padding: 18px;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: var(--em);
  display: grid;
  gap: 10px;
}
.ygd-check__methods legend {
  padding: 0;
  margin: 0 0 4px;
  font-family: var(--serif);
  font-weight: 500;
  font-size: 22px;
  color: var(--fg);
}
.ygd-check__method { display: block; cursor: pointer; }
.ygd-check__method input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.ygd-check__method-card {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 56px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(var(--fg-rgb), .03);
  transition: border-color .15s ease, background .15s ease;
}
.ygd-check__method input:checked + .ygd-check__method-card {
  border-color: rgba(217, 178, 90, .55);
  background: rgba(217, 178, 90, .1);
}
.ygd-check__method-card strong {
  flex: 1;
  font-size: 15px;
  font-weight: 700;
}
.ygd-check__method-ico {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  flex-shrink: 0;
  background:
    linear-gradient(135deg, rgba(217,178,90,.35), rgba(63,219,230,.2));
}
.ygd-check__method-ico--stripe { background: linear-gradient(135deg, #635bff, #0a2540); }
.ygd-check__method-ico--paypal { background: linear-gradient(135deg, #003087, #009cde); }
.ygd-check__method-ico--crypto { background: linear-gradient(135deg, #f7931a, #0f3a2f); }
.ygd-check__method-tick {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid var(--line);
  flex-shrink: 0;
}
.ygd-check__method input:checked + .ygd-check__method-card .ygd-check__method-tick {
  border-color: var(--gold);
  background: var(--gold);
  box-shadow: inset 0 0 0 3px var(--em);
}

.ygd-check__note {
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px dashed var(--line);
  background: rgba(var(--fg-rgb), .02);
}
.ygd-check__note h2 {
  margin: 0 0 8px;
  font-family: var(--serif);
  font-weight: 500;
  font-size: 20px;
}
.ygd-check__note p {
  margin: 0;
  color: var(--mist);
  line-height: 1.55;
  font-size: 14.5px;
}

.ygd-check__summary,
.ygd-check__panel {
  border-radius: 20px;
  border: 1px solid var(--line);
  background: var(--em);
  padding: 18px 18px 20px;
  display: grid;
  gap: 14px;
}
.ygd-check__summary { position: sticky; top: 96px; }
@media (max-width: 820px) {
  .ygd-check__summary { position: static; }
}

.ygd-check__tour {
  display: flex;
  gap: 12px;
  align-items: center;
}
.ygd-check__tour img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 14px;
  flex-shrink: 0;
}
.ygd-check__tour strong {
  display: block;
  font-family: var(--serif);
  font-weight: 500;
  font-size: 18px;
  line-height: 1.2;
}
.ygd-check__tour em {
  display: block;
  font-style: normal;
  color: var(--teal);
  font-size: 13px;
  font-weight: 700;
  margin: 2px 0 6px;
}
.ygd-check__tour a {
  color: var(--gold);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}
.ygd-check__tour a:hover { text-decoration: underline; }

.ygd-check__rows {
  margin: 0;
  display: grid;
  gap: 10px;
}
.ygd-check__rows > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}
.ygd-check__rows dt {
  margin: 0;
  color: var(--mist2);
  font-size: 13px;
  font-weight: 700;
}
.ygd-check__rows dd {
  margin: 0;
  font-weight: 700;
  color: var(--fg);
  font-variant-numeric: tabular-nums;
}
.ygd-check__total-row {
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.ygd-check__total-row dd {
  font-family: var(--serif);
  font-size: 26px;
  font-weight: 600;
  color: var(--gold2);
}

.ygd-check__hint,
.ygd-check__social,
.ygd-check__secure {
  margin: 0;
  color: var(--mist);
  font-size: 13.5px;
  line-height: 1.45;
}
.ygd-check__secure { text-align: center; font-size: 12.5px; color: var(--mist2); }
.ygd-check__pay,
.ygd-check__confirm .btn {
  width: 100%;
  justify-content: center;
  min-height: 50px;
}

.ygd-check__qr {
  margin: 0 auto;
  max-width: 260px;
  text-align: center;
}
.ygd-check__qr img {
  width: 100%;
  height: auto;
  border-radius: 16px;
  background: #fff;
  padding: 14px;
}
.ygd-check__actions { margin: 0; text-align: center; }
.ygd-check__confirm {
  display: grid;
  gap: 12px;
}
.ygd-check__wallets {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.ygd-check__wallets li {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(var(--fg-rgb), .03);
}
.ygd-check__wallets strong {
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mist2);
}
.ygd-check__wallets code {
  font-size: 13px;
  word-break: break-all;
  color: var(--gold2);
}