:root {
  --g5-green: #2b3f8f;
  --g5-mint: #77b8f3;
  --g5-night: #24356e;
  --g5-fog: #eef3ff;
}
html { background: #f1e4d7; }
body {
  max-width: 860px;
  color: #4b2c28;
  background: linear-gradient(160deg, #fbf2e6 0%, #fffaf5 38%, #f5e5d5 100%);
  background-image: url("../media/site-background.svg");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  box-shadow: 0 0 48px rgba(126, 67, 42, .14);
}
.static-snapshot { padding: 12px 12px 30px; }
.static-snapshot,
.posts-view,
.history-view {
  background-color: transparent !important;
  background-image: url("../media/site-background.svg");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
.site-live-header {
  position: relative !important;
  top: auto !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 14px !important;
  isolation: isolate;
  overflow: hidden;
  border: 0 !important;
  border-radius: 0 0 8px 8px !important;
  background:
    linear-gradient(90deg, rgba(48, 7, 12, .96) 0%, rgba(104, 14, 19, .88) 42%, rgba(104, 14, 19, .34) 100%),
    url('../media/dragon-header-v1.png') right center / cover no-repeat,
    linear-gradient(135deg, #30070c, #8e1c21 68%, #c28a36) !important;
  box-shadow: 0 8px 24px rgba(16, 36, 62, .24);
}
.site-brand-row {
  grid-template-columns: 74px minmax(0, 1fr) auto !important;
  gap: 12px !important;
  padding: 14px 18px 10px !important;
  background: transparent !important;
}
.site-brand-logo {
  display: block;
  width: 56px !important;
  height: 56px !important;
  padding: 0;
  object-fit: contain;
}
.site-brand-mark {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}
.site-brand-symbol { background: transparent !important; color: #fff7d5 !important; }
.site-brand-copy, .site-brand-copy * { color: #fff !important; }
.site-brand-copy strong {
  color: #fff7d5 !important;
  font-size: 24px !important;
  font-weight: 900 !important;
  letter-spacing: 3px;
  text-shadow: 0 2px 12px rgba(0,0,0,.4);
}
.site-brand-copy span {
  color: #ffe9d8 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}
.site-region-toggle {
  min-width: 102px !important;
  height: 38px !important;
  border: 1px solid rgba(255, 248, 214, .58) !important;
  border-radius: 8px !important;
  background: #f6d57a !important;
  color: #5f1217 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}
.site-region-toggle:hover {
  border-color: #fff !important;
  background: #ffe49b !important;
  color: #5f1217 !important;
}
.site-region-tabs {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin: 0;
  padding: 6px 10px 9px !important;
  background: rgba(36, 5, 9, .38) !important;
}
.site-region-tabs button {
  min-height: 40px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #eaffff !important;
  font-size: 17px !important;
  font-weight: 800 !important;
}
.site-region-tabs button.active {
  background: #b8f1ed !important;
  color: #10243e !important;
  box-shadow: none !important;
}
.nav.local-draw {
  margin: 10px !important;
  border: 1px solid rgba(232, 187, 92, .55) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 10px 26px rgba(16, 4, 6, .3);
}
.lottery-panel, .bound-static-panel, .master-cards-panel, .bound-data-panel, .contest-panel, .matrix-panel, .api-posts-panel, .box, .tzlb {
  margin: 12px 0 !important;
  overflow: hidden;
  border: 1px solid #d7e2f7 !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.9) !important;
  box-shadow: 0 8px 22px rgba(36,53,110,.07);
}
.lottery-panel-head, .bound-title, .api-posts-titlebar, .list-title, .tzlb-head {
  border: 0 !important;
  background: linear-gradient(90deg, #2b3f8f, #77b8f3) !important;
  color: #fff !important;
}
.lottery-boxes { gap: 10px !important; padding: 10px !important; background: transparent !important; }
.lottery-box { border-color: #c7d6f2 !important; border-radius: 14px !important; }
.master-card { border: 1px solid #d9e3f7 !important; border-radius: 14px !important; background: #f6f9ff !important; }
.bound-row-link, .home-api-post-link { border-color: #dce7f8 !important; }
.site-statement { margin: 0 12px 18px !important; border-radius: 16px !important; }

.master-card-link {
  grid-template-columns: 54px minmax(220px, .9fr) minmax(240px, 1.2fr) !important;
  align-items: stretch !important;
}

.master-card-side {
  align-content: center;
  justify-items: stretch !important;
  text-align: right;
}

.master-card-content {
  display: block;
  width: 100%;
  padding: 9px 12px;
  border: 1px solid #cbd9f0;
  border-radius: 8px;
  background: #f8fbff;
  color: #1d4ed8 !important;
  font-size: 15px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.45;
  text-align: left;
  overflow-wrap: anywhere;
}

.master-card-side > span:not(.master-card-content) {
  color: #2b3f8f !important;
}

.master-card-side b {
  color: #dc2626 !important;
}

@media (max-width: 720px) {
  .master-card-link {
    grid-template-columns: 42px minmax(0, 1fr) !important;
  }

  .master-card-side {
    grid-column: 2 !important;
    justify-items: stretch !important;
    text-align: left;
  }
}

@media (min-width: 760px) {
  .lottery-boxes { grid-template-columns: repeat(2, 1fr) !important; }
  .bound-data-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bound-data-panel > .bound-title { grid-column: 1 / -1; }
}