/* =========================================================
   Dueltainer Network — Phase 4B Global Design System
   Scope: visual consistency only. No workflow, API, or DB logic.
   Loads after Phase 3 redesign CSS to normalize the site.
   ========================================================= */

body.dtn-redesign-v3{
  --dtn-ui-bg:#050811;
  --dtn-ui-panel:rgba(8, 14, 31, .82);
  --dtn-ui-panel-2:rgba(13, 20, 42, .88);
  --dtn-ui-panel-soft:rgba(255,255,255,.045);
  --dtn-ui-border:rgba(184,231,255,.18);
  --dtn-ui-border-strong:rgba(0,179,255,.42);
  --dtn-ui-text:#eff8ff;
  --dtn-ui-muted:#b9c9dc;
  --dtn-ui-faint:#8ea2bb;
  --dtn-ui-yellow:#ffe76a;
  --dtn-ui-cyan:#00b3ff;
  --dtn-ui-violet:#7c4dff;
  --dtn-ui-green:#4af0a1;
  --dtn-ui-red:#ff5a75;
  --dtn-ui-radius:18px;
  --dtn-ui-radius-sm:12px;
  --dtn-ui-radius-lg:26px;
  --dtn-ui-shadow:0 18px 50px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
  --dtn-ui-shadow-soft:0 12px 32px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);
  --dtn-ui-focus:0 0 0 3px rgba(0,179,255,.16), 0 0 24px rgba(0,179,255,.12);

  color:var(--dtn-ui-text);
  font-size:16px;
  line-height:1.45;
}

/* ---------- Global layout rhythm ---------- */
body.dtn-redesign-v3 main,
body.dtn-redesign-v3 .wrap,
body.dtn-redesign-v3 .site-main,
body.dtn-redesign-v3 .appwrap,
body.dtn-redesign-v3 .tn-shell,
body.dtn-redesign-v3 .meta-shell,
body.dtn-redesign-v3 .members-shell{
  width:min(1440px, calc(100% - 32px))!important;
  max-width:1440px;
  margin-inline:auto!important;
}
body.dtn-redesign-v3 main,
body.dtn-redesign-v3 .appwrap,
body.dtn-redesign-v3 .tn-shell{
  padding-top:clamp(16px,2vw,28px)!important;
  padding-bottom:clamp(38px,4vw,72px)!important;
}
body.dtn-redesign-v3 section + section,
body.dtn-redesign-v3 .dtn-card + .dtn-card,
body.dtn-redesign-v3 .card + .card,
body.dtn-redesign-v3 .panel + .panel{
  margin-top:16px!important;
}

/* ---------- Controlled typography scale ---------- */
body.dtn-redesign-v3 h1,
body.dtn-redesign-v3 .tn-title,
body.dtn-redesign-v3 .dtn-heroTitle,
body.dtn-redesign-v3 .members-title,
body.dtn-redesign-v3 .meta-title,
body.dtn-redesign-v3 .page-title{
  font-size:clamp(28px, 3vw, 42px)!important;
  line-height:1.08!important;
  letter-spacing:.005em!important;
}
body.dtn-redesign-v3 h2,
body.dtn-redesign-v3 .tn-cardTitle,
body.dtn-redesign-v3 .section-title,
body.dtn-redesign-v3 .card-title{
  font-size:clamp(19px, 1.55vw, 26px)!important;
  line-height:1.16!important;
}
body.dtn-redesign-v3 h3,
body.dtn-redesign-v3 .tn-roundTitle,
body.dtn-redesign-v3 .tn-tourTitle{
  font-size:clamp(16px, 1.15vw, 20px)!important;
  line-height:1.22!important;
}
body.dtn-redesign-v3 p,
body.dtn-redesign-v3 li,
body.dtn-redesign-v3 td,
body.dtn-redesign-v3 .body-text{
  font-size:15px;
}
body.dtn-redesign-v3 .small,
body.dtn-redesign-v3 small,
body.dtn-redesign-v3 .tn-labelMuted,
body.dtn-redesign-v3 .muted.small{
  font-size:12px!important;
  line-height:1.35!important;
}
body.dtn-redesign-v3 .muted,
body.dtn-redesign-v3 .sub,
body.dtn-redesign-v3 .hint,
body.dtn-redesign-v3 .tn-sub,
body.dtn-redesign-v3 .tn-cardSub,
body.dtn-redesign-v3 .dtn-heroSub,
body.dtn-redesign-v3 .members-sub{
  color:var(--dtn-ui-muted)!important;
}

/* ---------- Standard hero/page header pattern ---------- */
body.dtn-redesign-v3 .hero,
body.dtn-redesign-v3 .page-hero,
body.dtn-redesign-v3 .dtn-hero,
body.dtn-redesign-v3 .tn-hero,
body.dtn-redesign-v3 .meta-hero,
body.dtn-redesign-v3 .members-hero{
  position:relative;
  padding:clamp(18px,2.2vw,28px)!important;
  border-radius:var(--dtn-ui-radius-lg)!important;
  border:1px solid rgba(137,218,255,.32)!important;
  background:
    radial-gradient(820px 280px at 12% 0%, rgba(0,179,255,.22), transparent 70%),
    radial-gradient(760px 300px at 96% 8%, rgba(124,77,255,.22), transparent 70%),
    linear-gradient(145deg, rgba(10,17,38,.92), rgba(7,10,23,.88))!important;
  box-shadow:var(--dtn-ui-shadow), 0 0 32px rgba(0,179,255,.10)!important;
  overflow:hidden;
}
body.dtn-redesign-v3 .hero::after,
body.dtn-redesign-v3 .page-hero::after,
body.dtn-redesign-v3 .dtn-hero::after,
body.dtn-redesign-v3 .tn-hero::after,
body.dtn-redesign-v3 .meta-hero::after,
body.dtn-redesign-v3 .members-hero::after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, transparent, rgba(0,179,255,.85), rgba(124,77,255,.80), transparent);
  opacity:.82;
  pointer-events:none;
}
body.dtn-redesign-v3 .tn-eyebrow,
body.dtn-redesign-v3 .eyebrow,
body.dtn-redesign-v3 .meta-eyebrow,
body.dtn-redesign-v3 .dtn-kicker{
  display:inline-flex!important;
  align-items:center!important;
  width:max-content;
  max-width:100%;
  min-height:26px!important;
  padding:5px 9px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,231,106,.34)!important;
  background:rgba(255,231,106,.075)!important;
  color:var(--dtn-ui-yellow)!important;
  font-size:11px!important;
  font-weight:950!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

/* ---------- Standard cards/panels ---------- */
body.dtn-redesign-v3 .card,
body.dtn-redesign-v3 .dtn-card,
body.dtn-redesign-v3 .panel,
body.dtn-redesign-v3 .tn-card,
body.dtn-redesign-v3 .tn-tourCard,
body.dtn-redesign-v3 .meta-card,
body.dtn-redesign-v3 .format-panel,
body.dtn-redesign-v3 .rules-panel,
body.dtn-redesign-v3 .members-shell,
body.dtn-redesign-v3 .forum-card,
body.dtn-redesign-v3 .watch-panel,
body.dtn-redesign-v3 .lb-card,
body.dtn-redesign-v3 .lb-tableWrap,
body.dtn-redesign-v3 .deckCard,
body.dtn-redesign-v3 .deckSnapModalCard{
  border-radius:var(--dtn-ui-radius)!important;
  border:1px solid var(--dtn-ui-border)!important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.026)),
    var(--dtn-ui-panel)!important;
  box-shadow:var(--dtn-ui-shadow-soft)!important;
  backdrop-filter:blur(12px);
}
body.dtn-redesign-v3 .card,
body.dtn-redesign-v3 .dtn-card,
body.dtn-redesign-v3 .panel,
body.dtn-redesign-v3 .tn-card,
body.dtn-redesign-v3 .meta-card{
  padding:16px!important;
}
body.dtn-redesign-v3 .card:hover,
body.dtn-redesign-v3 .dtn-card:hover,
body.dtn-redesign-v3 .panel:hover,
body.dtn-redesign-v3 .tn-card:hover,
body.dtn-redesign-v3 .tn-tourCard:hover,
body.dtn-redesign-v3 .meta-card:hover{
  border-color:rgba(0,179,255,.32)!important;
}
body.dtn-redesign-v3 .tn-cardHead,
body.dtn-redesign-v3 .cardHead,
body.dtn-redesign-v3 .card-header,
body.dtn-redesign-v3 .section-head,
body.dtn-redesign-v3 .row.between:has(h2){
  gap:12px!important;
  align-items:flex-start!important;
  padding-bottom:12px!important;
  margin-bottom:12px!important;
  border-bottom:1px solid rgba(188,232,255,.11)!important;
}
body.dtn-redesign-v3 .tn-cardHead h2,
body.dtn-redesign-v3 .card-header h2,
body.dtn-redesign-v3 .section-head h2,
body.dtn-redesign-v3 .row.between h2{
  margin:0!important;
}

/* ---------- Buttons/actions: consistent app-like hierarchy ---------- */
body.dtn-redesign-v3 .btn,
body.dtn-redesign-v3 button,
body.dtn-redesign-v3 .tn-btn,
body.dtn-redesign-v3 .meta-btn,
body.dtn-redesign-v3 a.btn,
body.dtn-redesign-v3 a.tn-btn,
body.dtn-redesign-v3 input[type="submit"]{
  min-height:38px!important;
  padding:8px 12px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  border-radius:12px!important;
  border:1px solid rgba(152,219,255,.34)!important;
  background:linear-gradient(135deg, rgba(0,179,255,.22), rgba(124,77,255,.16))!important;
  color:#f8fdff!important;
  font-size:13px!important;
  font-weight:900!important;
  letter-spacing:.005em!important;
  line-height:1.1!important;
  text-decoration:none!important;
  cursor:pointer;
  box-shadow:0 8px 22px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.10)!important;
  transition:transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease, opacity .14s ease!important;
}
body.dtn-redesign-v3 .btn:hover,
body.dtn-redesign-v3 button:hover,
body.dtn-redesign-v3 .tn-btn:hover,
body.dtn-redesign-v3 .meta-btn:hover,
body.dtn-redesign-v3 a.btn:hover,
body.dtn-redesign-v3 a.tn-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(255,231,106,.55)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.38), 0 0 20px rgba(0,179,255,.14)!important;
}
body.dtn-redesign-v3 .btn:focus-visible,
body.dtn-redesign-v3 button:focus-visible,
body.dtn-redesign-v3 .tn-btn:focus-visible,
body.dtn-redesign-v3 .meta-btn:focus-visible,
body.dtn-redesign-v3 input:focus-visible,
body.dtn-redesign-v3 select:focus-visible,
body.dtn-redesign-v3 textarea:focus-visible{
  outline:none!important;
  box-shadow:var(--dtn-ui-focus)!important;
}
body.dtn-redesign-v3 .btn.ghost,
body.dtn-redesign-v3 .btn-ghost,
body.dtn-redesign-v3 .ghost,
body.dtn-redesign-v3 .tn-btn-ghost,
body.dtn-redesign-v3 .meta-btn-ghost,
body.dtn-redesign-v3 button.ghost{
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(188,232,255,.16)!important;
  color:#dcecff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
}
body.dtn-redesign-v3 .dtn3-primary-action,
body.dtn-redesign-v3 #tnOpenEntryFab,
body.dtn-redesign-v3 #btnLogin,
body.dtn-redesign-v3 #btnCreate,
body.dtn-redesign-v3 #tdOpenCreate,
body.dtn-redesign-v3 #tdCreateSubmit,
body.dtn-redesign-v3 button[type="submit"]:not(.ghost):not(.btn-ghost){
  background:linear-gradient(135deg, rgba(0,179,255,.92), rgba(124,77,255,.82))!important;
  border-color:rgba(255,255,255,.50)!important;
  color:#fff!important;
  box-shadow:0 12px 34px rgba(0,179,255,.20), 0 8px 22px rgba(124,77,255,.18)!important;
}
body.dtn-redesign-v3 .actions,
body.dtn-redesign-v3 .tn-actions,
body.dtn-redesign-v3 .meta-actions,
body.dtn-redesign-v3 .dtn-heroActions,
body.dtn-redesign-v3 .profileActions,
body.dtn-redesign-v3 .row[style*="gap"]{
  gap:10px!important;
}

/* ---------- Forms/search: familiar modern app fields ---------- */
body.dtn-redesign-v3 label,
body.dtn-redesign-v3 .lbl,
body.dtn-redesign-v3 .tn-labelMuted,
body.dtn-redesign-v3 .field > span,
body.dtn-redesign-v3 .members-field > span{
  color:#ecf7ff!important;
  font-weight:850!important;
  letter-spacing:.015em;
}
body.dtn-redesign-v3 input:not([type="checkbox"]):not([type="radio"]),
body.dtn-redesign-v3 select,
body.dtn-redesign-v3 textarea,
body.dtn-redesign-v3 .input,
body.dtn-redesign-v3 .tn-input,
body.dtn-redesign-v3 .tn-textarea,
body.dtn-redesign-v3 .members-select{
  min-height:40px!important;
  border-radius:12px!important;
  border:1px solid rgba(188,232,255,.20)!important;
  background:rgba(3,8,18,.76)!important;
  color:#f4fbff!important;
  font-size:14px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
}
body.dtn-redesign-v3 input::placeholder,
body.dtn-redesign-v3 textarea::placeholder{
  color:#8298b3!important;
}
body.dtn-redesign-v3 input[type="checkbox"],
body.dtn-redesign-v3 input[type="radio"]{
  accent-color:var(--dtn-ui-cyan);
}

/* ---------- Badges/pills/status ---------- */
body.dtn-redesign-v3 .tag,
body.dtn-redesign-v3 .badge,
body.dtn-redesign-v3 .pill,
body.dtn-redesign-v3 .tn-pill,
body.dtn-redesign-v3 .roleTag,
body.dtn-redesign-v3 .members-role,
body.dtn-redesign-v3 .status-pill{
  min-height:24px;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px;
  padding:4px 9px!important;
  border-radius:999px!important;
  border:1px solid rgba(188,232,255,.18)!important;
  background:rgba(255,255,255,.055)!important;
  color:#eaf7ff!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.03em;
  line-height:1.1!important;
}
body.dtn-redesign-v3 .tn-pill.warn,
body.dtn-redesign-v3 .tn-pill-warn,
body.dtn-redesign-v3 .badge.warn,
body.dtn-redesign-v3 .tag.warn{
  border-color:rgba(255,231,106,.44)!important;
  background:rgba(255,231,106,.09)!important;
  color:#fff2a8!important;
}
body.dtn-redesign-v3 .tn-pill.info,
body.dtn-redesign-v3 .badge.info,
body.dtn-redesign-v3 .tag.info{
  border-color:rgba(0,179,255,.36)!important;
  background:rgba(0,179,255,.08)!important;
  color:#dff8ff!important;
}

/* ---------- Tables/lists: less raw spreadsheet, more app panel ---------- */
body.dtn-redesign-v3 table{
  width:100%;
  border-collapse:separate!important;
  border-spacing:0!important;
}
body.dtn-redesign-v3 th{
  color:var(--dtn-ui-yellow)!important;
  background:rgba(4,9,20,.88)!important;
  font-size:11px!important;
  text-transform:uppercase;
  letter-spacing:.07em;
  border-bottom:1px solid rgba(188,232,255,.15)!important;
}
body.dtn-redesign-v3 td{
  border-bottom:1px solid rgba(188,232,255,.08)!important;
}
body.dtn-redesign-v3 tr:hover td{
  background:rgba(0,179,255,.035)!important;
}
body.dtn-redesign-v3 .tableWrap,
body.dtn-redesign-v3 .tn-tableWrap,
body.dtn-redesign-v3 .meta-tableWrap,
body.dtn-redesign-v3 .lb-tableWrap{
  border-radius:var(--dtn-ui-radius)!important;
  border:1px solid rgba(188,232,255,.14)!important;
  overflow:auto!important;
  background:rgba(0,0,0,.13)!important;
}

/* ---------- Empty/loading/error states ---------- */
body.dtn-redesign-v3 .dtn-modern-empty,
body.dtn-redesign-v3 .empty,
body.dtn-redesign-v3 .members-empty,
body.dtn-redesign-v3 .tn-empty,
body.dtn-redesign-v3 .compHistoryEmpty,
body.dtn-redesign-v3 [data-empty="true"]{
  padding:18px!important;
  min-height:92px;
  display:grid;
  place-items:center;
  text-align:center;
  border-radius:16px!important;
  border:1px dashed rgba(255,231,106,.28)!important;
  background:rgba(255,231,106,.055)!important;
  color:#fff1a5!important;
  font-weight:850!important;
}
body.dtn-redesign-v3 .errorBox,
body.dtn-redesign-v3 .tn-alert-error,
body.dtn-redesign-v3 .msg.error{
  border-radius:16px!important;
  border:1px solid rgba(255,90,117,.38)!important;
  background:rgba(255,90,117,.09)!important;
  color:#ffdbe2!important;
}
body.dtn-redesign-v3 .successBox,
body.dtn-redesign-v3 .tn-alert-info,
body.dtn-redesign-v3 .tn-inlineNote,
body.dtn-redesign-v3 .msg:not(.error){
  border-radius:16px!important;
  border:1px solid rgba(0,179,255,.25)!important;
  background:rgba(0,179,255,.07)!important;
}

/* =========================================================
   Page group polish using the same system
   ========================================================= */

/* Login/signup: keep the modern tab/auth-card flow readable and centered. */
body.dtn-redesign-v3.page-login .appwrap{
  width:min(1080px, calc(100% - 32px))!important;
}
body.dtn-redesign-v3.page-login .dtn-hero{
  min-height:unset!important;
}
body.dtn-redesign-v3.page-login .loginGrid,
body.dtn-redesign-v3.page-login .authGrid{
  margin-top:18px!important;
  gap:18px!important;
}
body.dtn-redesign-v3.page-login .loginGrid > .card,
body.dtn-redesign-v3.page-login .authCard,
body.dtn-redesign-v3.page-login .card{
  padding:20px!important;
  min-height:unset!important;
}
body.dtn-redesign-v3.page-login .loginCardTitle > div:first-child{
  font-size:clamp(21px,1.9vw,28px)!important;
}
body.dtn-redesign-v3.page-login #btnLogin,
body.dtn-redesign-v3.page-login #btnCreate,
body.dtn-redesign-v3.page-login #btnForgot{
  width:100%;
}

/* Members directory: make it look like the rest of the app. */
body.dtn-redesign-v3.dtn-page-members .members-shell,
body.dtn-redesign-v3.dtn3-page-members .members-shell{
  display:grid;
  gap:16px;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
body.dtn-redesign-v3.dtn-page-members .members-hero,
body.dtn-redesign-v3.dtn3-page-members .members-hero{
  margin:0!important;
}
body.dtn-redesign-v3.dtn-page-members .members-toolbar,
body.dtn-redesign-v3.dtn3-page-members .members-toolbar,
body.dtn-redesign-v3.dtn-page-members .members-filters,
body.dtn-redesign-v3.dtn3-page-members .members-filters{
  padding:12px!important;
  border-radius:16px!important;
  border:1px solid rgba(188,232,255,.14)!important;
  background:rgba(0,0,0,.16)!important;
}
body.dtn-redesign-v3.dtn-page-members .members-grid,
body.dtn-redesign-v3.dtn3-page-members .members-grid{
  gap:14px!important;
}
body.dtn-redesign-v3.dtn-page-members .member-card,
body.dtn-redesign-v3.dtn3-page-members .member-card,
body.dtn-redesign-v3.dtn-page-members .members-card,
body.dtn-redesign-v3.dtn3-page-members .members-card,
body.dtn-redesign-v3.dtn-page-members #results > *,
body.dtn-redesign-v3.dtn3-page-members #results > *{
  border-radius:18px!important;
  border:1px solid rgba(188,232,255,.16)!important;
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)), rgba(8,14,31,.78)!important;
  box-shadow:var(--dtn-ui-shadow-soft)!important;
}

/* Profiles: identity card, clean avatar, consistent deck/history cards. */
body.dtn-redesign-v3.page-user .userHero,
body.dtn-redesign-v3.dtn-page-app-user .userHero,
body.dtn-redesign-v3.dtn3-page-app-user .userHero{
  padding:20px!important;
}
body.dtn-redesign-v3.page-user .userAvatarWrap,
body.dtn-redesign-v3.dtn-page-app-user .userAvatarWrap,
body.dtn-redesign-v3.dtn3-page-app-user .userAvatarWrap{
  width:124px!important;
  height:124px!important;
  flex:0 0 124px!important;
  border-radius:26px!important;
  overflow:hidden!important;
  background:rgba(0,0,0,.22)!important;
}
body.dtn-redesign-v3.page-user .userAvatarWrap img,
body.dtn-redesign-v3.dtn-page-app-user .userAvatarWrap img,
body.dtn-redesign-v3.dtn3-page-app-user .userAvatarWrap img{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:inherit!important;
}
body.dtn-redesign-v3.page-user .userUsername,
body.dtn-redesign-v3.dtn-page-app-user .userUsername,
body.dtn-redesign-v3.dtn3-page-app-user .userUsername{
  font-size:clamp(26px,3vw,40px)!important;
  line-height:1.04!important;
}
body.dtn-redesign-v3.page-user .linksGrid,
body.dtn-redesign-v3.dtn3-page-app-user .linksGrid,
body.dtn-redesign-v3.page-user .decksGrid,
body.dtn-redesign-v3.dtn3-page-app-user .decksGrid{
  gap:12px!important;
}
body.dtn-redesign-v3.page-user .linksGrid a,
body.dtn-redesign-v3.dtn3-page-app-user .linksGrid a,
body.dtn-redesign-v3.page-user .deckRow,
body.dtn-redesign-v3.dtn3-page-app-user .deckRow,
body.dtn-redesign-v3.page-user .compHistoryCard,
body.dtn-redesign-v3.dtn3-page-app-user .compHistoryCard{
  border-radius:15px!important;
  border:1px solid rgba(188,232,255,.14)!important;
  background:rgba(255,255,255,.04)!important;
}

/* Tournaments: keep Phase 4A, but normalize sizes and prevent giant headers. */
body.dtn-redesign-v3.dtn-page-tournaments .tn-shell,
body.dtn-redesign-v3.dtn3-page-tournaments .tn-shell,
body.dtn-redesign-v3.dtn-page-tournament .tn-shell,
body.dtn-redesign-v3.dtn3-page-tournament .tn-shell{
  width:min(1480px, calc(100% - 32px))!important;
}
body.dtn-redesign-v3.dtn-page-tournaments .tn-hero,
body.dtn-redesign-v3.dtn3-page-tournaments .tn-hero,
body.dtn-redesign-v3.dtn-page-tournament .tn-hero,
body.dtn-redesign-v3.dtn3-page-tournament .tn-hero{
  min-height:unset!important;
}
body.dtn-redesign-v3.dtn-page-tournaments .tn-tourCard,
body.dtn-redesign-v3.dtn3-page-tournaments .tn-tourCard{
  padding:18px!important;
  border-radius:20px!important;
  min-height:unset!important;
}
body.dtn-redesign-v3.dtn-page-tournaments .tn-tourTitle,
body.dtn-redesign-v3.dtn3-page-tournaments .tn-tourTitle{
  font-size:clamp(18px,1.55vw,24px)!important;
  line-height:1.15!important;
}
body.dtn-redesign-v3.dtn-page-tournament .tn-workspace,
body.dtn-redesign-v3.dtn3-page-tournament .tn-workspace{
  grid-template-columns:240px minmax(0,1fr)!important;
}
body.dtn-redesign-v3.dtn-page-tournament .tn-navRail,
body.dtn-redesign-v3.dtn3-page-tournament .tn-navRail{
  border-radius:18px!important;
}
body.dtn-redesign-v3.dtn-page-tournament .tn-tabs-rail .tn-tab,
body.dtn-redesign-v3.dtn3-page-tournament .tn-tabs-rail .tn-tab{
  min-height:40px!important;
  font-size:12.5px!important;
}

/* Format/Meta: preserve the tuned format layout while making meta panels consistent. */
body.dtn-redesign-v3 .format-layout{
  align-items:start!important;
}
body.dtn-redesign-v3 .format-change,
body.dtn-redesign-v3 .change-line,
body.dtn-redesign-v3 [class*="change"] strong{
  color:var(--dtn-ui-yellow)!important;
}
body.dtn-redesign-v3.dtn-page-meta-index .meta-card,
body.dtn-redesign-v3.dtn3-page-meta-index .meta-card,
body.dtn-redesign-v3 [class*="meta"] .card{
  border-radius:18px!important;
}
body.dtn-redesign-v3 a:not(.btn):not(.tn-btn):not(.meta-btn):not(.nav-link):not(.brand):not(.site-nav a){
  text-underline-offset:3px;
}

/* Deck/My Decks: modest consistency only; do not alter deckbuilder logic/layout aggressively. */
body.dtn-redesign-v3 .deckCard,
body.dtn-redesign-v3 .deckRow,
body.dtn-redesign-v3 .cardResult,
body.dtn-redesign-v3 .searchResultCard{
  border-radius:15px!important;
  border:1px solid rgba(188,232,255,.14)!important;
  background:rgba(255,255,255,.04)!important;
}
body.dtn-redesign-v3 .deckCard:hover,
body.dtn-redesign-v3 .deckRow:hover,
body.dtn-redesign-v3 .cardResult:hover,
body.dtn-redesign-v3 .searchResultCard:hover{
  border-color:rgba(0,179,255,.34)!important;
}

/* Staff/admin: clear tool panels and danger zones. */
body.dtn-redesign-v3 .adminCard,
body.dtn-redesign-v3 .adminCol,
body.dtn-redesign-v3 .staffPanel,
body.dtn-redesign-v3 .modPanel{
  border-radius:18px!important;
  border:1px solid rgba(188,232,255,.14)!important;
  background:rgba(255,255,255,.035)!important;
}
body.dtn-redesign-v3 .danger,
body.dtn-redesign-v3 .dangerZone,
body.dtn-redesign-v3 button.danger,
body.dtn-redesign-v3 .btn-danger{
  border-color:rgba(255,90,117,.42)!important;
  background:rgba(255,90,117,.12)!important;
  color:#ffdce3!important;
}

/* ---------- Mobile consistency ---------- */
@media (max-width: 1180px){
  body.dtn-redesign-v3.dtn-page-tournament .tn-workspace,
  body.dtn-redesign-v3.dtn3-page-tournament .tn-workspace,
  body.dtn-redesign-v3.dtn-page-tournament .tn-hero,
  body.dtn-redesign-v3.dtn3-page-tournament .tn-hero{
    grid-template-columns:1fr!important;
  }
  body.dtn-redesign-v3.dtn-page-tournament .tn-navRail,
  body.dtn-redesign-v3.dtn3-page-tournament .tn-navRail{
    position:static!important;
  }
}
@media (max-width: 760px){
  body.dtn-redesign-v3 main,
  body.dtn-redesign-v3 .wrap,
  body.dtn-redesign-v3 .site-main,
  body.dtn-redesign-v3 .appwrap,
  body.dtn-redesign-v3 .tn-shell,
  body.dtn-redesign-v3 .meta-shell,
  body.dtn-redesign-v3 .members-shell{
    width:min(100% - 20px, 1440px)!important;
  }
  body.dtn-redesign-v3 h1,
  body.dtn-redesign-v3 .tn-title,
  body.dtn-redesign-v3 .dtn-heroTitle,
  body.dtn-redesign-v3 .members-title,
  body.dtn-redesign-v3 .meta-title{
    font-size:clamp(26px,8vw,34px)!important;
  }
  body.dtn-redesign-v3 .hero,
  body.dtn-redesign-v3 .page-hero,
  body.dtn-redesign-v3 .dtn-hero,
  body.dtn-redesign-v3 .tn-hero,
  body.dtn-redesign-v3 .meta-hero,
  body.dtn-redesign-v3 .members-hero{
    border-radius:20px!important;
    padding:16px!important;
  }
  body.dtn-redesign-v3 .card,
  body.dtn-redesign-v3 .dtn-card,
  body.dtn-redesign-v3 .panel,
  body.dtn-redesign-v3 .tn-card,
  body.dtn-redesign-v3 .meta-card{
    padding:14px!important;
    border-radius:16px!important;
  }
  body.dtn-redesign-v3.page-user .userHeroRow,
  body.dtn-redesign-v3.dtn-page-app-user .userHeroRow,
  body.dtn-redesign-v3.dtn3-page-app-user .userHeroRow{
    align-items:flex-start!important;
  }
  body.dtn-redesign-v3.page-user .userAvatarWrap,
  body.dtn-redesign-v3.dtn-page-app-user .userAvatarWrap,
  body.dtn-redesign-v3.dtn3-page-app-user .userAvatarWrap{
    width:96px!important;
    height:96px!important;
    flex-basis:96px!important;
    border-radius:22px!important;
  }
  body.dtn-redesign-v3 .btn,
  body.dtn-redesign-v3 button,
  body.dtn-redesign-v3 .tn-btn,
  body.dtn-redesign-v3 .meta-btn{
    min-height:40px!important;
  }
}


/* =========================================================
   Phase 4C — Homepage platform buttons + Format layout correction
   Scope: visual only. Restores platform-specific CTA colorways and
   shifts Format Rules back left so Lists regain space.
   ========================================================= */

/* Restore the original platform-branded buttons inside Where to Watch.
   The global design-system .btn rule was intentionally broad, but these
   homepage platform CTAs need to keep their Twitch/YouTube/TikTok/Instagram identity. */
body.dtn-redesign-v3 .watch-panel .platform-row{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
body.dtn-redesign-v3 .watch-panel .btn.platform,
body.dtn-redesign-v3 .watch-panel a.btn.platform{
  min-height:40px!important;
  padding:9px 12px!important;
  border-radius:999px!important;
  color:rgba(245,250,255,.96)!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  text-decoration:none!important;
  box-shadow:0 10px 24px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.06) inset!important;
  transform:none;
}
body.dtn-redesign-v3 .watch-panel .btn.platform.twitch{
  border-color:rgba(124,77,255,.72)!important;
  background:
    radial-gradient(130px 68px at 30% 0%, rgba(124,77,255,.48), transparent 72%),
    linear-gradient(180deg, rgba(124,77,255,.30), rgba(12,14,22,.14))!important;
  box-shadow:0 0 0 1px rgba(124,77,255,.24) inset, 0 14px 34px rgba(0,0,0,.38)!important;
}
body.dtn-redesign-v3 .watch-panel .btn.platform.youtube{
  border-color:rgba(255,59,59,.72)!important;
  background:
    radial-gradient(130px 68px at 30% 0%, rgba(255,59,59,.44), transparent 72%),
    linear-gradient(180deg, rgba(255,59,59,.28), rgba(12,14,22,.14))!important;
  box-shadow:0 0 0 1px rgba(255,59,59,.20) inset, 0 14px 34px rgba(0,0,0,.38)!important;
}
body.dtn-redesign-v3 .watch-panel .btn.platform.tiktok{
  border-color:rgba(255,255,255,.28)!important;
  background:
    radial-gradient(130px 68px at 10% 0%, rgba(37,244,238,.32), transparent 72%),
    radial-gradient(130px 68px at 92% 0%, rgba(254,44,85,.30), transparent 72%),
    linear-gradient(180deg, rgba(0,0,0,.58), rgba(12,14,22,.18))!important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.08) inset,
    0 0 0 1px rgba(37,244,238,.14),
    0 0 0 1px rgba(254,44,85,.10),
    0 14px 34px rgba(0,0,0,.42)!important;
}
body.dtn-redesign-v3 .watch-panel .btn.platform.instagram{
  border-color:rgba(255,120,220,.52)!important;
  background:
    linear-gradient(135deg,
      rgba(255,210,80,.22),
      rgba(255,75,180,.30),
      rgba(124,77,255,.25)
    ),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(12,14,22,.10))!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset, 0 14px 34px rgba(0,0,0,.38)!important;
}
body.dtn-redesign-v3 .watch-panel .btn.platform:hover,
body.dtn-redesign-v3 .watch-panel a.btn.platform:hover{
  transform:translateY(-1px)!important;
  filter:brightness(1.10)!important;
  border-color:rgba(255,231,106,.50)!important;
  box-shadow:0 16px 40px rgba(0,0,0,.50), 0 0 0 1px rgba(255,255,255,.12) inset!important;
}

/* Format page correction from DTN (26):
   - Rules panel 175px narrower on desktop so Lists regain space.
   - Lists area expands left by the same amount.
   - Rules panel moves up another 25px from the previous tuned state. */
body.dtn-redesign-v3 .format-layout{
  grid-template-columns:minmax(405px,585px) minmax(0,1fr)!important;
  gap:18px!important;
  align-items:start!important;
}
body.dtn-redesign-v3 .format-layout .rules-panel{
  margin-top:-75px!important;
  align-self:start!important;
}
body.dtn-redesign-v3 .format-layout .lists-panel{
  margin-top:0!important;
  align-self:start!important;
  min-width:0!important;
}
@media (max-width:1100px){
  body.dtn-redesign-v3 .format-layout{
    grid-template-columns:1fr!important;
  }
  body.dtn-redesign-v3 .format-layout .rules-panel{
    margin-top:0!important;
  }
}
@media (max-width:700px){
  body.dtn-redesign-v3 .watch-panel .platform-row{
    grid-template-columns:1fr!important;
  }
}

/* =========================================================
   Phase 4D — Card image aspect-ratio protection
   Scope: visual only. Any actual Yu-Gi-Oh! card image should keep its
   natural ratio inside whatever tile/list/modal size it is placed in.
   This prevents list cards from being stretched or squeezed by older
   fixed-width/fixed-height rules.
   ========================================================= */

/* Source-based safety net: applies to DTN local card images, old bulk cache
   paths, YGOPRODeck remote fallbacks, and the nginx proxy fallback. */
body.dtn-redesign-v3 img[src*="/ygo-db/images/"],
body.dtn-redesign-v3 img[src*="/assets/img/ygoprodeck-bulk-downloader/"],
body.dtn-redesign-v3 img[src*="/proxy/ygoprodeck/images/cards"],
body.dtn-redesign-v3 img[src*="images.ygoprodeck.com/images/cards"],
body.dtn-redesign-v3 img[src*="images.ygoprodeck.com/images/cards_small"],
body.dtn-redesign-v3 img[src*="images.ygoprodeck.com/images/cards_cropped"]{
  object-fit:contain!important;
  object-position:center center!important;
  background:
    radial-gradient(120px 80px at 50% 10%, rgba(0,179,255,.12), transparent 72%),
    rgba(5,10,22,.72)!important;
}

/* Class-based safety net for areas where card images may be filled from data,
   fallback URLs, or later JS after initial render. Keep avatars/logos/social
   platform images out of this list on purpose. */
body.dtn-redesign-v3 .cards .card-row img,
body.dtn-redesign-v3 .format-list-table img,
body.dtn-redesign-v3 .format-card-modal__img,
body.dtn-redesign-v3 .tdr-cardImg,
body.dtn-redesign-v3 .preview .pic img,
body.dtn-redesign-v3 .card-tile img,
body.dtn-redesign-v3 .result .thumb img,
body.dtn-redesign-v3 .meta-cardInline img,
body.dtn-redesign-v3 .meta-cardThumbBtn img,
body.dtn-redesign-v3 .meta-cardRow img,
body.dtn-redesign-v3 .meta-thumb__img,
body.dtn-redesign-v3 .meta-cardModal__image img,
body.dtn-redesign-v3 .meta-cardArt,
body.dtn-redesign-v3 .meta-cardImage,
body.dtn-redesign-v3 .tn-cardThumb,
body.dtn-redesign-v3 .tn-breakdownArtThumb{
  object-fit:contain!important;
  object-position:center center!important;
}

/* Yu-Gi-Oh card frame ratio helpers. These keep fixed card slots visually
   consistent without stretching the image content. */
body.dtn-redesign-v3 .cards .card-row img,
body.dtn-redesign-v3 .format-list-table img,
body.dtn-redesign-v3 .tdr-cardImg,
body.dtn-redesign-v3 .preview .pic img,
body.dtn-redesign-v3 .card-tile img,
body.dtn-redesign-v3 .result .thumb img,
body.dtn-redesign-v3 .meta-cardInline img,
body.dtn-redesign-v3 .meta-cardThumbBtn img,
body.dtn-redesign-v3 .meta-cardRow img,
body.dtn-redesign-v3 .meta-thumb__img{
  aspect-ratio:421 / 614;
}

/* Format lists were the most visible problem: make their card slots preserve
   card shape while still fitting the existing compact layouts. */
body.dtn-redesign-v3 .cards .card-row img{
  width:80px!important;
  height:112px!important;
  display:block!important;
}
body.dtn-redesign-v3 .format-list-table img{
  width:34px!important;
  height:48px!important;
  display:block!important;
}

/* Deckbuilder/result tiles often use square-ish containers. This keeps full
   card images from stretching inside those existing boxes. */
body.dtn-redesign-v3 .preview .pic,
body.dtn-redesign-v3 .card-tile,
body.dtn-redesign-v3 .result .thumb,
body.dtn-redesign-v3 .meta-cardThumbBtn,
body.dtn-redesign-v3 .meta-thumb{
  background:
    radial-gradient(120px 80px at 50% 10%, rgba(0,179,255,.10), transparent 72%),
    rgba(5,10,22,.68)!important;
}


/* =========================================================
   Phase 4E — Profile + Members experience overhaul
   Scope: visual/layout only. No auth, Supabase, deck, or tournament logic.
   Goal: make profiles and member discovery feel like one modern app section.
   ========================================================= */

/* Shared app/profile page shell */
body.dtn-redesign-v3.page-app .appwrap{
  max-width:1260px!important;
  padding-top:24px!important;
}
body.dtn-redesign-v3.page-app .dtn-hero{
  padding:18px 20px!important;
  border-radius:24px!important;
  background:
    radial-gradient(760px 220px at 10% 0%, rgba(0,179,255,.16), transparent 62%),
    radial-gradient(720px 240px at 92% 10%, rgba(124,77,255,.15), transparent 58%),
    linear-gradient(180deg, rgba(13,19,38,.84), rgba(8,12,26,.72))!important;
  border:1px solid rgba(148,190,255,.18)!important;
  box-shadow:0 18px 52px rgba(0,0,0,.40)!important;
}
body.dtn-redesign-v3.page-app .dtn-heroTitle{
  font-size:clamp(1.55rem, 2.15vw, 2.35rem)!important;
  line-height:1.05!important;
}
body.dtn-redesign-v3.page-app .dtn-heroSub{
  font-size:.94rem!important;
  max-width:720px!important;
}
body.dtn-redesign-v3.page-app .dtn-softHr{
  margin:14px 0!important;
  opacity:.55!important;
}

/* Public profile identity card */
body.dtn-redesign-v3.page-user .userHero{
  padding:22px!important;
  border-radius:28px!important;
  overflow:hidden!important;
  background:
    linear-gradient(135deg, rgba(0,179,255,.11), transparent 34%),
    linear-gradient(315deg, rgba(124,77,255,.12), transparent 38%),
    linear-gradient(180deg, rgba(14,20,38,.88), rgba(8,12,27,.76))!important;
  border:1px solid rgba(148,190,255,.20)!important;
  box-shadow:0 20px 58px rgba(0,0,0,.46)!important;
}
body.dtn-redesign-v3.page-user .userHero::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:82px;
  pointer-events:none;
  background:linear-gradient(90deg, rgba(0,179,255,.22), rgba(124,77,255,.20), rgba(255,214,102,.10));
  opacity:.38;
}
body.dtn-redesign-v3.page-user .userHeroRow{
  position:relative!important;
  display:grid!important;
  grid-template-columns:154px minmax(0,1fr)!important;
  gap:22px!important;
  align-items:center!important;
}
body.dtn-redesign-v3.page-user .userAvatarWrap{
  width:154px!important;
  height:154px!important;
  border-radius:32px!important;
  background:
    linear-gradient(135deg, rgba(0,179,255,.35), rgba(124,77,255,.28)),
    rgba(5,10,22,.82)!important;
  border:1px solid rgba(255,255,255,.24)!important;
  box-shadow:
    0 18px 44px rgba(0,0,0,.48),
    0 0 0 5px rgba(0,179,255,.09),
    0 0 34px rgba(124,77,255,.18)!important;
}
body.dtn-redesign-v3.page-user .userAvatarWrap img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
}
body.dtn-redesign-v3.page-user .userHeroMeta{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
}
body.dtn-redesign-v3.page-user .userNameRow{
  align-items:flex-start!important;
  gap:10px 12px!important;
}
body.dtn-redesign-v3.page-user .userUsername{
  font-size:clamp(1.65rem, 2vw, 2.18rem)!important;
  line-height:1.05!important;
  letter-spacing:.2px!important;
  color:#f7fbff!important;
  text-shadow:0 0 18px rgba(0,179,255,.18)!important;
}
body.dtn-redesign-v3.page-user .userDisplay{
  display:inline-flex!important;
  width:max-content!important;
  max-width:100%!important;
  padding:5px 10px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(255,255,255,.055)!important;
  color:rgba(235,245,255,.88)!important;
  font-size:.88rem!important;
}
body.dtn-redesign-v3.page-user .userBio{
  max-width:920px!important;
  margin-top:6px!important;
  padding:12px 14px!important;
  border-radius:16px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(3,8,18,.34)!important;
  color:rgba(245,248,255,.92)!important;
  line-height:1.48!important;
}
body.dtn-redesign-v3.page-user .profileActions{
  margin-left:auto!important;
  margin-top:0!important;
  align-items:center!important;
  justify-content:flex-end!important;
}
body.dtn-redesign-v3.page-user .profileActions .btn{
  min-height:36px!important;
  border-radius:12px!important;
}
body.dtn-redesign-v3.page-user #act_status{
  flex-basis:100%!important;
  text-align:right!important;
}

/* Public profile sections */
body.dtn-redesign-v3.page-user main.appwrap > section.card:not(.userHero),
body.dtn-redesign-v3.page-me main.appwrap > section.card,
body.dtn-redesign-v3.page-me .dtn-grid2 > .card{
  border-radius:22px!important;
  background:
    radial-gradient(520px 160px at 0% 0%, rgba(0,179,255,.08), transparent 64%),
    linear-gradient(180deg, rgba(14,19,35,.82), rgba(8,12,25,.72))!important;
  border:1px solid rgba(148,190,255,.15)!important;
  box-shadow:0 14px 38px rgba(0,0,0,.34)!important;
}
body.dtn-redesign-v3.page-user main.appwrap > section.card h2,
body.dtn-redesign-v3.page-me main.appwrap h2{
  font-size:clamp(1.05rem, 1.25vw, 1.28rem)!important;
  letter-spacing:.25px!important;
}
body.dtn-redesign-v3.page-user .linksGrid,
body.dtn-redesign-v3.page-me #links_list{
  min-height:34px!important;
}
body.dtn-redesign-v3.page-user #u_links .row{
  gap:8px!important;
}
body.dtn-redesign-v3.page-user #u_links a.btn{
  min-height:36px!important;
  padding:7px 12px!important;
  border-radius:12px!important;
  border-color:rgba(0,179,255,.22)!important;
  background:rgba(0,179,255,.08)!important;
}

/* Public deck rows become app-like deck cards */
body.dtn-redesign-v3.page-user .decksGrid{
  gap:12px!important;
}
body.dtn-redesign-v3.page-user .deckRow{
  border-radius:18px!important;
  background:
    linear-gradient(135deg, rgba(0,179,255,.08), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025))!important;
  border:1px solid rgba(255,255,255,.12)!important;
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease!important;
}
body.dtn-redesign-v3.page-user .deckRow:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(0,179,255,.30)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.32), 0 0 22px rgba(0,179,255,.08)!important;
}
body.dtn-redesign-v3.page-user .deckRow img[data-cover-img="1"]{
  object-fit:cover!important;
  object-position:center center!important;
}
body.dtn-redesign-v3.page-user .userPublicDecksScroll{
  max-height:430px!important;
  padding:4px 8px 4px 2px!important;
}

/* Competitive history: modern stat cards and scroll tables */
body.dtn-redesign-v3.page-user .compHistoryTabs{
  display:flex!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  padding:8px!important;
  border-radius:16px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(3,8,18,.34)!important;
}
body.dtn-redesign-v3.page-user .compHistoryTab{
  min-height:34px!important;
  padding:7px 12px!important;
  border-radius:12px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(255,255,255,.045)!important;
  color:rgba(245,248,255,.88)!important;
  font-weight:900!important;
  cursor:pointer!important;
}
body.dtn-redesign-v3.page-user .compHistoryTab.is-on{
  color:#fff8a6!important;
  border-color:rgba(0,179,255,.42)!important;
  background:linear-gradient(180deg, rgba(0,179,255,.18), rgba(124,77,255,.10))!important;
  box-shadow:0 0 0 3px rgba(0,179,255,.08)!important;
}
body.dtn-redesign-v3.page-user .compHistoryStatsGrid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit, minmax(128px,1fr))!important;
  gap:10px!important;
  margin-bottom:14px!important;
}
body.dtn-redesign-v3.page-user .compHistoryStatCard{
  border-radius:16px!important;
  padding:12px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025))!important;
}
body.dtn-redesign-v3.page-user .compHistoryStatCard .label{
  font-size:.72rem!important;
  text-transform:uppercase!important;
  letter-spacing:.12em!important;
  color:rgba(216,232,255,.72)!important;
}
body.dtn-redesign-v3.page-user .compHistoryStatCard .value{
  margin-top:4px!important;
  font-size:1.25rem!important;
  font-weight:1000!important;
  color:#fff8a6!important;
}
body.dtn-redesign-v3.page-user .compHistoryTableWrap,
body.dtn-redesign-v3.page-user .compHistoryScroller{
  scrollbar-color:rgba(0,179,255,.55) rgba(255,255,255,.06)!important;
}
body.dtn-redesign-v3.page-user .compHistoryTable{
  width:100%!important;
  border-collapse:separate!important;
  border-spacing:0 6px!important;
}
body.dtn-redesign-v3.page-user .compHistoryTable th{
  position:sticky!important;
  top:0!important;
  z-index:2!important;
  background:rgba(8,13,28,.96)!important;
  color:#fff8a6!important;
  font-size:.72rem!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
}
body.dtn-redesign-v3.page-user .compHistoryTable td{
  background:rgba(255,255,255,.035)!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
}
body.dtn-redesign-v3.page-user .compHistoryTable td:first-child{
  border-left:1px solid rgba(255,255,255,.08)!important;
  border-radius:12px 0 0 12px!important;
  font-weight:1000!important;
}
body.dtn-redesign-v3.page-user .compHistoryTable td:last-child{
  border-right:1px solid rgba(255,255,255,.08)!important;
  border-radius:0 12px 12px 0!important;
}
body.dtn-redesign-v3.page-user .compHistoryEmpty,
body.dtn-redesign-v3 .members-empty{
  padding:18px!important;
  border-radius:18px!important;
  border:1px dashed rgba(0,179,255,.28)!important;
  background:rgba(0,179,255,.045)!important;
  color:rgba(234,244,255,.78)!important;
}

/* My Profile editing page */
body.dtn-redesign-v3.page-me .dtn-grid2{
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr)!important;
  gap:16px!important;
}
body.dtn-redesign-v3.page-me .dtn-avatarRow{
  align-items:flex-start!important;
}
body.dtn-redesign-v3.page-me .dtn-avatarPreview{
  width:132px!important;
  height:132px!important;
  border-radius:28px!important;
  box-shadow:0 16px 42px rgba(0,0,0,.42), 0 0 0 4px rgba(0,179,255,.08)!important;
}
body.dtn-redesign-v3.page-me .linkRow{
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:16px!important;
  padding:10px!important;
  background:rgba(255,255,255,.035)!important;
}
body.dtn-redesign-v3.page-me .mono{
  word-break:break-all!important;
}

/* Members directory modernization */
body.dtn-redesign-v3 .members-shell{
  max-width:1280px!important;
  margin:0 auto!important;
  padding:18px!important;
  border-radius:28px!important;
  background:
    radial-gradient(920px 300px at 12% 0%, rgba(0,179,255,.17), transparent 62%),
    radial-gradient(850px 300px at 92% 4%, rgba(124,77,255,.15), transparent 60%),
    linear-gradient(180deg, rgba(14,20,38,.74), rgba(8,12,25,.62))!important;
  border:1px solid rgba(148,190,255,.18)!important;
  box-shadow:0 20px 60px rgba(0,0,0,.42)!important;
}
body.dtn-redesign-v3 .members-hero{
  padding:18px!important;
  border-radius:22px!important;
  background:rgba(3,8,18,.32)!important;
  border:1px solid rgba(255,255,255,.10)!important;
}
body.dtn-redesign-v3 .members-title{
  font-size:clamp(1.55rem, 2.2vw, 2.35rem)!important;
  line-height:1.05!important;
}
body.dtn-redesign-v3 .members-sub{
  font-size:.94rem!important;
  color:rgba(234,244,255,.82)!important;
}
body.dtn-redesign-v3 .members-countPill,
body.dtn-redesign-v3 .members-pagePill{
  border-radius:14px!important;
  background:rgba(0,179,255,.075)!important;
  border-color:rgba(0,179,255,.22)!important;
}
body.dtn-redesign-v3 .members-toolbar{
  display:grid!important;
  grid-template-columns:minmax(320px,1fr) auto!important;
  align-items:end!important;
  gap:16px!important;
}
body.dtn-redesign-v3 .members-controls{
  justify-content:end!important;
}
body.dtn-redesign-v3 .members-filters{
  padding:8px!important;
  border-radius:16px!important;
  border:1px solid rgba(255,255,255,.09)!important;
  background:rgba(3,8,18,.28)!important;
}
body.dtn-redesign-v3 .members-grid{
  grid-template-columns:repeat(auto-fill, minmax(315px,1fr))!important;
  gap:14px!important;
  padding:8px 4px 4px!important;
}
body.dtn-redesign-v3 .member-card{
  min-height:112px!important;
  padding:14px!important;
  border-radius:22px!important;
  background:
    linear-gradient(135deg, rgba(0,179,255,.10), transparent 42%),
    linear-gradient(315deg, rgba(124,77,255,.10), transparent 44%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025))!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.28)!important;
}
body.dtn-redesign-v3 .member-card:hover{
  transform:translateY(-3px)!important;
  border-color:rgba(0,179,255,.30)!important;
  box-shadow:0 22px 50px rgba(0,0,0,.38), 0 0 24px rgba(0,179,255,.08)!important;
}
body.dtn-redesign-v3 .member-ava{
  width:72px!important;
  height:72px!important;
  border-radius:20px!important;
  background:linear-gradient(135deg, rgba(0,179,255,.25), rgba(124,77,255,.20)), rgba(5,10,22,.82)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.34), 0 0 0 4px rgba(0,179,255,.06)!important;
}
body.dtn-redesign-v3 .member-ava img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
}
body.dtn-redesign-v3 .member-name{
  font-size:1.02rem!important;
  color:#f7fbff!important;
}
body.dtn-redesign-v3 .member-user{
  color:rgba(216,232,255,.72)!important;
}
body.dtn-redesign-v3 .member-actions .btn{
  min-height:34px!important;
  border-radius:12px!important;
  padding-inline:13px!important;
}

@media (max-width:980px){
  body.dtn-redesign-v3.page-user .userHeroRow{
    grid-template-columns:120px minmax(0,1fr)!important;
  }
  body.dtn-redesign-v3.page-user .userAvatarWrap{
    width:120px!important;
    height:120px!important;
    border-radius:26px!important;
  }
  body.dtn-redesign-v3.page-me .dtn-grid2,
  body.dtn-redesign-v3 .members-toolbar{
    grid-template-columns:1fr!important;
  }
  body.dtn-redesign-v3 .members-controls{
    justify-content:flex-start!important;
  }
}
@media (max-width:660px){
  body.dtn-redesign-v3.page-user .userHeroRow{
    grid-template-columns:1fr!important;
    text-align:left!important;
  }
  body.dtn-redesign-v3.page-user .userAvatarWrap{
    width:112px!important;
    height:112px!important;
  }
  body.dtn-redesign-v3.page-user .profileActions{
    width:100%!important;
    margin-left:0!important;
    justify-content:flex-start!important;
  }
  body.dtn-redesign-v3.page-user #act_status{
    text-align:left!important;
  }
  body.dtn-redesign-v3 .members-grid{
    grid-template-columns:1fr!important;
  }
  body.dtn-redesign-v3 .member-card{
    align-items:flex-start!important;
  }
  body.dtn-redesign-v3 .member-actions{
    width:100%!important;
    margin-top:8px!important;
  }
  body.dtn-redesign-v3 .member-actions .btn{
    width:100%!important;
    justify-content:center!important;
  }
}


/* =========================================================
   Phase 4G — Format Meta + Breakdown UI Overhaul
   Scope: visual-only. Does not change Deck Builder layout,
   tournament logic, Supabase calls, card data, or search logic.
   ========================================================= */
body.dtn-redesign-v3 .meta-shell{
  width:min(1460px, calc(100% - 32px))!important;
  max-width:1460px!important;
  padding:18px 0 58px!important;
  display:grid!important;
  gap:16px!important;
}
body.dtn-redesign-v3 .meta-shell .opal-card,
body.dtn-redesign-v3 .meta-shell .meta-panel,
body.dtn-redesign-v3 .meta-shell .meta-tabs,
body.dtn-redesign-v3 .meta-shell .meta-toolbar,
body.dtn-redesign-v3 .meta-shell .meta-stat,
body.dtn-redesign-v3 .meta-shell .meta-breakdownCard,
body.dtn-redesign-v3 .meta-shell .meta-resultGroup{
  border:1px solid rgba(164,220,255,.16)!important;
  background:
    linear-gradient(135deg, rgba(0,179,255,.055), transparent 40%),
    linear-gradient(315deg, rgba(124,77,255,.060), transparent 44%),
    linear-gradient(180deg, rgba(12,19,40,.86), rgba(6,10,22,.82))!important;
  box-shadow:0 16px 42px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.055)!important;
  backdrop-filter:blur(10px)!important;
}
body.dtn-redesign-v3 .meta-hero{
  display:grid!important;
  grid-template-columns:minmax(0, 1.35fr) minmax(340px, .75fr)!important;
  gap:18px!important;
  align-items:end!important;
  padding:22px!important;
  margin:0!important;
  border-radius:28px!important;
}
body.dtn-redesign-v3 .meta-hero .meta-title{
  font-size:clamp(30px, 3vw, 44px)!important;
  margin-bottom:8px!important;
}
body.dtn-redesign-v3 .meta-eyebrow{
  display:inline-flex!important;
  width:max-content!important;
  align-items:center!important;
  gap:8px!important;
  padding:6px 10px!important;
  border-radius:999px!important;
  color:#fff6a0!important;
  background:rgba(255,231,106,.075)!important;
  border:1px solid rgba(255,231,106,.22)!important;
  font-size:11px!important;
  letter-spacing:.13em!important;
}
body.dtn-redesign-v3 .meta-sub{
  max-width:82ch!important;
  color:rgba(232,242,255,.78)!important;
  font-size:.96rem!important;
}
body.dtn-redesign-v3 .meta-heroSearch,
body.dtn-redesign-v3 .meta-inlineSearch{
  display:flex!important;
  gap:10px!important;
  align-items:center!important;
  min-width:0!important;
}
body.dtn-redesign-v3 .meta-input,
body.dtn-redesign-v3 .meta-select{
  min-height:42px!important;
  border-radius:14px!important;
  border:1px solid rgba(184,231,255,.16)!important;
  background:rgba(3,8,18,.64)!important;
  color:#eff8ff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
body.dtn-redesign-v3 .meta-input:focus,
body.dtn-redesign-v3 .meta-select:focus{
  border-color:rgba(0,179,255,.52)!important;
  outline:0!important;
  box-shadow:0 0 0 3px rgba(0,179,255,.15), 0 0 24px rgba(0,179,255,.09)!important;
}
body.dtn-redesign-v3 .meta-tabs{
  margin:0!important;
  padding:10px!important;
  border-radius:20px!important;
  display:flex!important;
  gap:8px!important;
  align-items:center!important;
  overflow:auto!important;
  scrollbar-width:thin!important;
}
body.dtn-redesign-v3 .meta-tab,
body.dtn-redesign-v3 .meta-scopeTab{
  min-height:38px!important;
  border-radius:13px!important;
  padding:8px 13px!important;
  border:1px solid rgba(184,231,255,.13)!important;
  background:rgba(255,255,255,.035)!important;
  color:rgba(237,247,255,.86)!important;
  font-weight:900!important;
  letter-spacing:.015em!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}
body.dtn-redesign-v3 .meta-tab:hover,
body.dtn-redesign-v3 .meta-scopeTab:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(0,179,255,.34)!important;
  background:rgba(0,179,255,.075)!important;
}
body.dtn-redesign-v3 .meta-tab.is-active,
body.dtn-redesign-v3 .meta-scopeTab.is-active{
  color:#06111f!important;
  border-color:rgba(255,231,106,.60)!important;
  background:linear-gradient(135deg, #fff08a, #73dcff)!important;
  box-shadow:0 10px 26px rgba(0,179,255,.13)!important;
}
body.dtn-redesign-v3 .meta-toolbar{
  margin:0!important;
  padding:12px 14px!important;
  border-radius:20px!important;
  gap:12px!important;
}
body.dtn-redesign-v3 .meta-toolbar__group{
  gap:9px!important;
}
body.dtn-redesign-v3 .meta-toolbar__hint{
  padding:9px 12px!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(255,255,255,.075)!important;
  color:rgba(226,239,255,.76)!important;
}
body.dtn-redesign-v3 .meta-label{
  color:#fff08a!important;
  text-transform:uppercase!important;
  letter-spacing:.09em!important;
  font-size:11px!important;
}
body.dtn-redesign-v3 .meta-grid{
  gap:16px!important;
  margin:0!important;
}
body.dtn-redesign-v3 .meta-grid--stats{
  grid-template-columns:repeat(4, minmax(0, 1fr))!important;
}
body.dtn-redesign-v3 .meta-grid--three{
  grid-template-columns:repeat(3, minmax(0, 1fr))!important;
  gap:16px!important;
  margin:0!important;
}
body.dtn-redesign-v3 .meta-grid--two{
  grid-template-columns:repeat(2, minmax(0, 1fr))!important;
  gap:16px!important;
  margin:0!important;
}
body.dtn-redesign-v3 .meta-stat{
  position:relative!important;
  overflow:hidden!important;
  min-height:116px!important;
  padding:16px!important;
  border-radius:20px!important;
}
body.dtn-redesign-v3 .meta-stat::before{
  content:""!important;
  position:absolute!important;
  inset:0 auto 0 0!important;
  width:4px!important;
  background:linear-gradient(180deg, rgba(0,179,255,.9), rgba(124,77,255,.8))!important;
  opacity:.85!important;
}
body.dtn-redesign-v3 .meta-stat__label{
  color:rgba(226,239,255,.70)!important;
  font-size:11px!important;
  letter-spacing:.11em!important;
}
body.dtn-redesign-v3 .meta-stat__value{
  color:#fff8a6!important;
  font-size:clamp(1.45rem, 2.2vw, 2.1rem)!important;
  text-shadow:0 0 18px rgba(255,231,106,.10)!important;
}
body.dtn-redesign-v3 .meta-stat__sub{
  color:rgba(226,239,255,.72)!important;
}
body.dtn-redesign-v3 .meta-panel{
  padding:16px!important;
  border-radius:22px!important;
  min-width:0!important;
}
body.dtn-redesign-v3 .meta-panel__head{
  align-items:center!important;
  padding-bottom:12px!important;
  margin-bottom:12px!important;
  border-bottom:1px solid rgba(255,255,255,.075)!important;
}
body.dtn-redesign-v3 .meta-panel__head h2{
  font-size:clamp(17px, 1.35vw, 21px)!important;
  line-height:1.15!important;
  color:#f7fbff!important;
}
body.dtn-redesign-v3 .meta-panel__head span{
  color:rgba(226,239,255,.62)!important;
}
body.dtn-redesign-v3 .meta-link,
body.dtn-redesign-v3 .meta-btn,
body.dtn-redesign-v3 .meta-rowActions a,
body.dtn-redesign-v3 .meta-breakdownCard__actions a,
body.dtn-redesign-v3 .meta-breakdownCard__actions button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:34px!important;
  padding:7px 12px!important;
  border-radius:12px!important;
  color:#06111f!important;
  background:linear-gradient(135deg, #fff08a, #73dcff)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  font-weight:900!important;
  text-decoration:none!important;
  box-shadow:0 10px 22px rgba(0,0,0,.18)!important;
}
body.dtn-redesign-v3 .meta-link:hover,
body.dtn-redesign-v3 .meta-btn:hover,
body.dtn-redesign-v3 .meta-rowActions a:hover,
body.dtn-redesign-v3 .meta-breakdownCard__actions a:hover,
body.dtn-redesign-v3 .meta-breakdownCard__actions button:hover{
  transform:translateY(-1px)!important;
  filter:brightness(1.04)!important;
}
body.dtn-redesign-v3 .meta-stack,
body.dtn-redesign-v3 .meta-resultList,
body.dtn-redesign-v3 .meta-cardList{
  gap:10px!important;
}
body.dtn-redesign-v3 .meta-resultItem,
body.dtn-redesign-v3 .meta-miniStat,
body.dtn-redesign-v3 .meta-cardRow{
  border-radius:16px!important;
  border:1px solid rgba(184,231,255,.12)!important;
  background:rgba(255,255,255,.035)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
body.dtn-redesign-v3 .meta-resultItem:hover,
body.dtn-redesign-v3 .meta-cardRow:hover{
  border-color:rgba(0,179,255,.30)!important;
  background:rgba(0,179,255,.060)!important;
}
body.dtn-redesign-v3 .meta-kicker{
  color:#fff08a!important;
  font-size:11px!important;
  letter-spacing:.10em!important;
}
body.dtn-redesign-v3 .meta-resultItem__meta,
body.dtn-redesign-v3 .meta-miniStat__row span:first-child{
  color:rgba(226,239,255,.70)!important;
}
body.dtn-redesign-v3 .meta-tableWrap{
  border-radius:18px!important;
  border:1px solid rgba(184,231,255,.13)!important;
  background:rgba(4,8,18,.60)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
body.dtn-redesign-v3 .meta-table{
  background:transparent!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}
body.dtn-redesign-v3 .meta-table th{
  background:rgba(5,10,22,.96)!important;
  color:#fff08a!important;
  font-size:11px!important;
  letter-spacing:.09em!important;
  border-bottom:1px solid rgba(255,231,106,.18)!important;
}
body.dtn-redesign-v3 .meta-table td{
  border-bottom:1px solid rgba(255,255,255,.070)!important;
  color:rgba(239,248,255,.92)!important;
}
body.dtn-redesign-v3 .meta-table tr:hover td{
  background:rgba(0,179,255,.055)!important;
}
body.dtn-redesign-v3 .meta-chip,
body.dtn-redesign-v3 .meta-pill{
  border-radius:999px!important;
  border:1px solid rgba(184,231,255,.14)!important;
  background:rgba(255,255,255,.045)!important;
  color:rgba(239,248,255,.88)!important;
  font-weight:800!important;
}
body.dtn-redesign-v3 .meta-pill--good{
  border-color:rgba(74,240,161,.38)!important;
  background:rgba(74,240,161,.10)!important;
  color:#a9ffd7!important;
}
body.dtn-redesign-v3 .meta-thumb,
body.dtn-redesign-v3 .meta-cardInline img,
body.dtn-redesign-v3 .meta-cardThumbBtn,
body.dtn-redesign-v3 .meta-cardRow img{
  border-color:rgba(184,231,255,.16)!important;
  background:rgba(3,8,18,.80)!important;
  box-shadow:0 10px 20px rgba(0,0,0,.28)!important;
}
body.dtn-redesign-v3 .meta-thumb__img,
body.dtn-redesign-v3 .meta-cardInline img,
body.dtn-redesign-v3 .meta-cardThumbBtn img,
body.dtn-redesign-v3 .meta-cardRow img{
  object-fit:contain!important;
  object-position:center center!important;
  background:#07101e!important;
}
body.dtn-redesign-v3 .meta-showcase{
  gap:12px!important;
  padding-bottom:8px!important;
}
body.dtn-redesign-v3 .meta-showcaseCard{
  min-width:270px!important;
  max-width:340px!important;
  padding:14px!important;
  border-radius:18px!important;
  border:1px solid rgba(184,231,255,.13)!important;
  background:
    radial-gradient(360px 160px at 0% 0%, rgba(0,179,255,.13), transparent 60%),
    rgba(255,255,255,.035)!important;
}
body.dtn-redesign-v3 .meta-breakdownCard{
  grid-template-columns:minmax(220px, 300px) minmax(0, 1fr)!important;
  gap:18px!important;
  padding:16px!important;
  border-radius:22px!important;
}
body.dtn-redesign-v3 .meta-breakdownCard img,
body.dtn-redesign-v3 .meta-breakdownChartPreview img,
body.dtn-redesign-v3 .meta-breakdownChart{
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  border-radius:16px!important;
  border:1px solid rgba(184,231,255,.14)!important;
  background:#07101e!important;
}
body.dtn-redesign-v3 .meta-breakdownCard__title{
  font-size:clamp(18px,1.45vw,23px)!important;
  color:#f7fbff!important;
}
body.dtn-redesign-v3 .meta-breakdownCard__meta,
body.dtn-redesign-v3 .meta-breakdownCard__chips,
body.dtn-redesign-v3 .meta-breakdownCard__actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
body.dtn-redesign-v3 .meta-empty{
  border:1px dashed rgba(0,179,255,.30)!important;
  background:rgba(0,179,255,.055)!important;
  color:rgba(226,239,255,.78)!important;
  border-radius:18px!important;
  padding:18px!important;
}
body.dtn-redesign-v3 .meta-empty__title{
  color:#fff08a!important;
  font-weight:1000!important;
}
body.dtn-redesign-v3 .meta-autoScroll{
  scrollbar-color:rgba(0,179,255,.65) rgba(255,255,255,.06)!important;
}
body.dtn-redesign-v3 .meta-autoScroll::-webkit-scrollbar{
  width:10px!important;
  height:10px!important;
}
body.dtn-redesign-v3 .meta-autoScroll::-webkit-scrollbar-track{
  background:rgba(255,255,255,.045)!important;
  border-radius:999px!important;
}
body.dtn-redesign-v3 .meta-autoScroll::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(0,179,255,.78),rgba(124,77,255,.78))!important;
  border-radius:999px!important;
  border:2px solid rgba(5,10,22,.86)!important;
}
body.dtn-redesign-v3 .meta-cardModal__dialog{
  border-radius:24px!important;
  border:1px solid rgba(184,231,255,.18)!important;
  background:
    radial-gradient(520px 260px at 10% 0%, rgba(0,179,255,.15), transparent 66%),
    linear-gradient(180deg, rgba(14,21,38,.98), rgba(6,10,21,.98))!important;
  box-shadow:0 28px 90px rgba(0,0,0,.62)!important;
}
body.dtn-redesign-v3 .meta-cardModal__art{
  object-fit:contain!important;
  background:#07101e!important;
}
body.dtn-redesign-v3 .meta-cardModal__titleRow h2{
  font-size:clamp(1.25rem, 2vw, 1.75rem)!important;
}
body.dtn-redesign-v3 .meta-cardModal__desc,
body.dtn-redesign-v3 .meta-cardInfo__desc{
  border-radius:16px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(255,255,255,.08)!important;
}
@media (max-width:1180px){
  body.dtn-redesign-v3 .meta-grid--stats{grid-template-columns:repeat(2, minmax(0, 1fr))!important;}
  body.dtn-redesign-v3 .meta-grid--three{grid-template-columns:1fr!important;}
  body.dtn-redesign-v3 .meta-hero{grid-template-columns:1fr!important;}
  body.dtn-redesign-v3 .meta-heroSearch{max-width:100%!important;}
}
@media (max-width:800px){
  body.dtn-redesign-v3 .meta-shell{width:min(100% - 20px, 1460px)!important;padding-top:12px!important;}
  body.dtn-redesign-v3 .meta-grid--stats,
  body.dtn-redesign-v3 .meta-grid--two{grid-template-columns:1fr!important;}
  body.dtn-redesign-v3 .meta-toolbar{align-items:stretch!important;}
  body.dtn-redesign-v3 .meta-toolbar__group,
  body.dtn-redesign-v3 .meta-inlineSearch,
  body.dtn-redesign-v3 .meta-heroSearch{width:100%!important;}
  body.dtn-redesign-v3 .meta-heroSearch,
  body.dtn-redesign-v3 .meta-inlineSearch{flex-direction:column!important;align-items:stretch!important;}
  body.dtn-redesign-v3 .meta-breakdownCard{grid-template-columns:1fr!important;}
  body.dtn-redesign-v3 .meta-panel__head{align-items:flex-start!important;}
}

/* =====================================================================
   DTN UI Phase 4H - My Decks split library/detail layout
   Scope only: app/decks.html. Does not touch Deck Builder.
   ===================================================================== */
body.page-decks .decksToolbar{
  position: relative;
  z-index: 2;
}

body.page-decks .myDecksSplit{
  display: grid;
  grid-template-columns: minmax(320px, 420px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  margin-top: 14px;
}

body.page-decks .myDecksListPanel,
body.page-decks .myDecksDetailPanel{
  min-width: 0;
  overflow: hidden;
}

body.page-decks .myDecksListPanel{
  position: sticky;
  top: 88px;
  max-height: calc(100vh - 110px);
  display: flex;
  flex-direction: column;
}

body.page-decks .myDecksPanelHead{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 2px 2px 12px;
  border-bottom: 1px solid rgba(255,255,255,.12);
  margin-bottom: 12px;
}

body.page-decks .myDecksPanelHead h2{
  margin: 0;
  font-size: clamp(18px, 1.8vw, 24px);
  line-height: 1.1;
}

body.page-decks .myDecksPanelHead p{
  margin: 5px 0 0;
  font-size: 13px;
}

body.page-decks .myDecksList{
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: auto;
  padding: 2px 4px 4px 2px;
}

body.page-decks .myDecksListItem{
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  background: rgba(5, 12, 26, .54);
  box-shadow: inset 0 0 0 1px rgba(0,179,255,.04);
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

body.page-decks .myDecksListItem:hover,
body.page-decks .myDecksListItem:focus-visible{
  transform: translateY(-1px);
  border-color: rgba(0,179,255,.45);
  background: rgba(8, 20, 42, .74);
  box-shadow: 0 0 18px rgba(0,179,255,.12), inset 0 0 0 1px rgba(124,77,255,.14);
  outline: none;
}

body.page-decks .myDecksListItem.is-selected{
  border-color: rgba(255,214,75,.72);
  background: linear-gradient(135deg, rgba(255,214,75,.13), rgba(0,179,255,.12)), rgba(5,12,26,.72);
  box-shadow: 0 0 22px rgba(255,214,75,.12), inset 0 0 0 1px rgba(255,214,75,.18);
}

body.page-decks .myDecksListCover{
  width: 58px;
  height: 58px;
  border-radius: 14px;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: rgba(0,0,0,.34);
  border: 1px solid rgba(255,255,255,.14);
}

body.page-decks .myDecksListCover img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

body.page-decks .myDecksNoCover{
  font-size: 10px;
  color: rgba(255,255,255,.58);
  text-align: center;
  padding: 4px;
}

body.page-decks .myDecksListMeta{
  min-width: 0;
}

body.page-decks .myDecksListTopline{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

body.page-decks .myDecksListTitle{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 950;
  color: #fff;
}

body.page-decks .myDecksListIndex{
  flex: 0 0 auto;
  font-size: 11px;
  color: rgba(255,255,255,.5);
}

body.page-decks .myDecksListPills,
body.page-decks .myDecksSelectedPills{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 7px;
}

body.page-decks .myDecksListStatus,
body.page-decks .myDecksListChecked{
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.page-decks .myDecksDetailPanel{
  min-height: 540px;
}

body.page-decks .myDecksEmpty{
  padding: 18px;
  border: 1px dashed rgba(255,255,255,.18);
  border-radius: 16px;
  background: rgba(255,255,255,.035);
}

body.page-decks .myDecksSelectedHead{
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.12);
}

body.page-decks .myDecksSelectedCover{
  width: 118px;
  height: 118px;
  border-radius: 20px;
  overflow: hidden;
  background: rgba(0,0,0,.32);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 14px 32px rgba(0,0,0,.28);
}

body.page-decks .myDecksSelectedCover img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

body.page-decks .myDecksSelectedEyebrow{
  color: #ffd64b;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: .12em;
  text-transform: uppercase;
}

body.page-decks .myDecksSelectedMeta h2{
  margin: 3px 0 0;
  font-size: clamp(22px, 2.5vw, 32px);
  line-height: 1.05;
}

body.page-decks .myDecksSelectedStatus{
  margin: 10px 0 0;
  line-height: 1.35;
}

body.page-decks .myDecksSelectedActions{
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 170px;
}

body.page-decks .myDecksSelectedActions .btn{
  width: 100%;
  justify-content: center;
}

body.page-decks .myDecksSelectedControls{
  display: grid;
  grid-template-columns: minmax(190px, 240px) minmax(260px, 1fr) auto;
  gap: 12px;
  align-items: end;
  margin-top: 14px;
}

body.page-decks .myDecksSelectedControls label{
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

body.page-decks .myDecksCoverSelect select{
  width: 100%;
}

body.page-decks .myDecksInlineTools{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

body.page-decks .myDecksCardColumns{
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
  gap: 14px;
  margin-top: 16px;
}

body.page-decks .myDecksCardBlock{
  min-width: 0;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  background: rgba(255,255,255,.035);
  overflow: hidden;
}

body.page-decks .myDecksCardBlockHead{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  background: rgba(0,0,0,.18);
  border-bottom: 1px solid rgba(255,255,255,.10);
}

body.page-decks .myDecksCardBlockHead h3{
  margin: 0;
  font-size: 16px;
}

body.page-decks .myDecksCardsList{
  max-height: 560px;
  overflow: auto;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

body.page-decks .myDecksCardRow{
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 64px;
  padding: 8px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
}

body.page-decks .myDecksCardThumb{
  width: 46px;
  height: 64px;
  object-fit: contain;
  object-position: center;
  display: block;
  border-radius: 6px;
  background: rgba(0,0,0,.38);
  border: 1px solid rgba(255,255,255,.12);
}

body.page-decks .myDecksCardText{
  min-width: 0;
}

body.page-decks .myDecksCardName{
  color: #fff;
  font-weight: 900;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.page-decks .myDecksCardSub{
  margin-top: 4px;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.page-decks .myDecksCardQty{
  color: #ffd64b;
  font-weight: 1000;
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(255,214,75,.12);
  border: 1px solid rgba(255,214,75,.25);
}

@media (max-width: 980px){
  body.page-decks .myDecksSplit{
    grid-template-columns: 1fr;
  }

  body.page-decks .myDecksListPanel{
    position: relative;
    top: auto;
    max-height: none;
  }

  body.page-decks .myDecksList{
    max-height: 420px;
  }

  body.page-decks .myDecksSelectedHead{
    grid-template-columns: 92px minmax(0, 1fr);
  }

  body.page-decks .myDecksSelectedCover{
    width: 92px;
    height: 92px;
  }

  body.page-decks .myDecksSelectedActions{
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.page-decks .myDecksSelectedControls,
  body.page-decks .myDecksCardColumns{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px){
  body.page-decks .myDecksListItem{
    grid-template-columns: 48px minmax(0, 1fr);
  }

  body.page-decks .myDecksListCover{
    width: 48px;
    height: 48px;
    border-radius: 12px;
  }

  body.page-decks .myDecksSelectedActions{
    grid-template-columns: 1fr;
  }

  body.page-decks .myDecksCardRow{
    grid-template-columns: 40px minmax(0, 1fr) auto;
  }

  body.page-decks .myDecksCardThumb{
    width: 40px;
    height: 56px;
  }
}

/* =========================================================
   Phase 4I — My Decks utilities + Deck Builder safe fixes
   - My Decks: pagination, tier badges, card-sort/search readability
   - Deck Builder: restore tier badge colors after global badge normalization
   - Deck Builder: give deck grids a little extra right-side room
========================================================= */

body.dtn-redesign-v3 .pill.ok,
body.dtn-redesign-v3 .pill.legal,
body.page-decks .pill.ok{
  border-color: rgba(35, 209, 125, .55) !important;
  background: linear-gradient(180deg, rgba(35,209,125,.30), rgba(35,209,125,.12)) !important;
  color: #9fffd0 !important;
  box-shadow: 0 0 18px rgba(35,209,125,.12) !important;
}

body.dtn-redesign-v3 .pill.bad,
body.dtn-redesign-v3 .pill.illegal,
body.page-decks .pill.bad{
  border-color: rgba(255, 79, 79, .58) !important;
  background: linear-gradient(180deg, rgba(255,79,79,.30), rgba(255,79,79,.12)) !important;
  color: #ffb0b0 !important;
  box-shadow: 0 0 18px rgba(255,79,79,.12) !important;
}

body.page-decks .myDecksPager{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 2px 0;
  border-top:1px solid rgba(188,232,255,.12);
  margin-top:10px;
}

body.page-decks .myDecksPager .select{
  min-width:112px;
  width:auto;
}

body.page-decks .myDecksCardNameLine{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}

body.page-decks .myDecksCardNameLine .myDecksCardName{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.page-decks .myDecksTierStack,
body.page-decks .myDecksTierSummary{
  display:inline-flex;
  align-items:center;
  gap:4px;
  flex-wrap:wrap;
}

body.page-decks .myDecksTierStack{
  flex:0 0 auto;
}

body.page-decks .myDecksTierBadge,
body.page-decks .myDecksMiniTier{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  min-height:20px;
  padding:2px 6px;
  border-radius:7px;
  border:1px solid rgba(0,0,0,.35);
  font-size:11px;
  line-height:1;
  font-weight:1000;
  letter-spacing:.02em;
  color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.55);
  box-shadow:0 0 14px rgba(0,0,0,.16);
}

body.page-decks .myDecksTierBadge.banned,
body.page-decks .myDecksMiniTier.banned{
  background:rgba(255,59,59,.95);
}

body.page-decks .myDecksTierBadge.aTier,
body.page-decks .myDecksMiniTier.aTier{
  background:rgba(0,179,255,.95);
}

body.page-decks .myDecksTierBadge.bTier,
body.page-decks .myDecksMiniTier.bTier{
  background:rgba(255,206,66,.95);
  color:#101018;
  text-shadow:none;
}

body.page-decks .myDecksTierBadge.exempt,
body.page-decks .myDecksMiniTier.exempt{
  background:rgba(35,209,125,.95);
}

body.page-decks .myDecksListPills .myDecksTierSummary{
  margin-left:2px;
}

body.page-decks .myDecksListPanel .myDecksList{
  max-height:min(68vh, 960px);
}

/* Deck Builder scoped badge fixes — keep the existing builder layout, only restore colors/sizing. */
body.dtn-redesign-v3.page-deckbuilder .badge.banned,
body.dtn-redesign-v3 .page-deckbuilder .badge.banned,
body.dtn-redesign-v3 .deckbuilder .badge.banned,
body.dtn-redesign-v3 .card-tile .badge.banned{
  background:rgba(255,59,59,.95)!important;
  color:#fff!important;
}

body.dtn-redesign-v3.page-deckbuilder .badge.aTier,
body.dtn-redesign-v3 .page-deckbuilder .badge.aTier,
body.dtn-redesign-v3 .deckbuilder .badge.aTier,
body.dtn-redesign-v3 .card-tile .badge.aTier{
  background:rgba(0,179,255,.95)!important;
  color:#fff!important;
}

body.dtn-redesign-v3.page-deckbuilder .badge.bTier,
body.dtn-redesign-v3 .page-deckbuilder .badge.bTier,
body.dtn-redesign-v3 .deckbuilder .badge.bTier,
body.dtn-redesign-v3 .card-tile .badge.bTier{
  background:rgba(255,206,66,.95)!important;
  color:#101018!important;
  text-shadow:none!important;
}

body.dtn-redesign-v3.page-deckbuilder .badge.exempt,
body.dtn-redesign-v3 .page-deckbuilder .badge.exempt,
body.dtn-redesign-v3 .deckbuilder .badge.exempt,
body.dtn-redesign-v3 .card-tile .badge.exempt{
  background:rgba(35,209,125,.95)!important;
  color:#fff!important;
}

body.dtn-redesign-v3 .card-tile .badge,
body.dtn-redesign-v3 .deck-grid .badge{
  position:absolute!important;
  top:6px!important;
  left:6px!important;
  width:var(--badgeSize, 18px)!important;
  height:var(--badgeSize, 18px)!important;
  min-width:var(--badgeSize, 18px)!important;
  min-height:var(--badgeSize, 18px)!important;
  padding:0!important;
  border-radius:7px!important;
}

body.dtn-redesign-v3 .deck-grid{
  min-width:calc((var(--cardW) * 10) + (8px * 9) + 49px);
}

body.dtn-redesign-v3 .center-col{
  overflow-x:auto;
  padding-right:25px;
}

@media (max-width:980px){
  body.dtn-redesign-v3 .deck-grid{
    min-width:0;
  }
  body.dtn-redesign-v3 .center-col{
    padding-right:0;
  }
}

/* =========================================================
   Phase 4J — Deck Builder focused override
   Fixes center workspace clipping and keeps deckbuilder-specific badges.
========================================================= */
body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
  width:min(1720px, calc(100% - 24px))!important;
  grid-template-columns:minmax(260px, clamp(280px,20vw,320px)) minmax(650px, 1fr) minmax(280px, clamp(300px,21vw,345px))!important;
  gap:clamp(10px,.85vw,14px)!important;
}
body.dtn-redesign-v3.page-deckbuilder .left-col,
body.dtn-redesign-v3.page-deckbuilder .center-col,
body.dtn-redesign-v3.page-deckbuilder .right-col{
  min-width:0!important;
  max-width:100%!important;
}
body.dtn-redesign-v3.page-deckbuilder .center-col{
  overflow:visible!important;
  padding-right:0!important;
}
body.dtn-redesign-v3.page-deckbuilder .deck-grid{
  min-width:0!important;
  width:100%!important;
  box-sizing:border-box!important;
  grid-template-columns:repeat(auto-fill, minmax(var(--cardW, 66px), var(--cardW, 66px)))!important;
  justify-content:start!important;
  overflow:visible!important;
}
body.dtn-redesign-v3.page-deckbuilder .badge-stack .badge{
  position:static!important;
  top:auto!important;
  left:auto!important;
}
body.dtn-redesign-v3.page-deckbuilder .card-tile .badge:not(.badge-stack .badge),
body.dtn-redesign-v3.page-deckbuilder .deck-grid .badge:not(.badge-stack .badge){
  position:absolute!important;
  top:6px!important;
  left:6px!important;
}
@media (max-width:1550px){
  body.dtn-redesign-v3.page-deckbuilder{ --cardW:64px; }
  body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
    grid-template-columns:minmax(250px,300px) minmax(610px, 1fr) minmax(280px,315px)!important;
  }
}
@media (max-width:1375px){
  body.dtn-redesign-v3.page-deckbuilder{ --cardW:60px; }
  body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
    width:min(100% - 18px, 1500px)!important;
    grid-template-columns:minmax(240px,280px) minmax(560px, 1fr) minmax(270px,300px)!important;
  }
}
@media (max-width:1240px){
  body.dtn-redesign-v3.page-deckbuilder .db-page-hero,
  body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
    width:min(100% - 18px, 1100px)!important;
  }
  body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
    grid-template-columns:minmax(0,1fr)!important;
  }
  body.dtn-redesign-v3.page-deckbuilder .center-col{ order:1; }
  body.dtn-redesign-v3.page-deckbuilder .right-col{ order:2; }
  body.dtn-redesign-v3.page-deckbuilder .left-col{ order:3; }
}

/* =========================================================
   Phase 4K — Deck Builder alignment + true grid sizing
   - removes the top hero spacing
   - aligns left / center / right panels at the same top level
   - makes Main Deck a 10-column x 6-row visual grid
   - makes Extra Deck a 15-column grid using smaller cards at the same panel width
   - keeps Ban / Tier / Exempt indicators intact
========================================================= */
body.dtn-redesign-v3.page-deckbuilder .db-page-hero,
body.page-deckbuilder .db-page-hero{
  display:none !important;
}

body.dtn-redesign-v3.page-deckbuilder,
body.page-deckbuilder{
  --db-grid-gap: 6px;
  --db-grid-pad: 10px;
  --db-left-final: clamp(260px, 17vw, 300px);
  --db-right-final: clamp(300px, 18vw, 340px);
  --db-center-min-final: 760px;
}

body.dtn-redesign-v3.page-deckbuilder .app.three-cols,
body.page-deckbuilder .app.three-cols{
  width:min(1780px, calc(100% - 24px)) !important;
  margin:14px auto 30px !important;
  display:grid !important;
  grid-template-columns:
    minmax(250px, var(--db-left-final))
    minmax(var(--db-center-min-final), 1fr)
    minmax(290px, var(--db-right-final)) !important;
  gap:clamp(10px, .75vw, 14px) !important;
  align-items:start !important;
}

body.dtn-redesign-v3.page-deckbuilder .left-col,
body.dtn-redesign-v3.page-deckbuilder .center-col,
body.dtn-redesign-v3.page-deckbuilder .right-col,
body.page-deckbuilder .left-col,
body.page-deckbuilder .center-col,
body.page-deckbuilder .right-col{
  align-self:start !important;
  margin-top:0 !important;
  padding-top:0 !important;
}

body.dtn-redesign-v3.page-deckbuilder .center-col > .panel:first-child,
body.dtn-redesign-v3.page-deckbuilder .left-col > .panel:first-child,
body.dtn-redesign-v3.page-deckbuilder .right-col > .panel:first-child,
body.page-deckbuilder .center-col > .panel:first-child,
body.page-deckbuilder .left-col > .panel:first-child,
body.page-deckbuilder .right-col > .panel:first-child{
  margin-top:0 !important;
}

body.dtn-redesign-v3.page-deckbuilder .topbar,
body.page-deckbuilder .topbar{
  margin-top:0 !important;
}

body.dtn-redesign-v3.page-deckbuilder .zone,
body.page-deckbuilder .zone{
  width:100% !important;
  box-sizing:border-box !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-grid,
body.page-deckbuilder .deck-grid{
  --db-grid-cols: 10;
  --db-grid-rows: 6;
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-columns:repeat(var(--db-grid-cols), minmax(0, 1fr)) !important;
  gap:var(--db-grid-gap) !important;
  padding:var(--db-grid-pad) !important;
  justify-content:stretch !important;
  align-content:start !important;
  overflow:visible !important;
  container-type:inline-size;
}

body.dtn-redesign-v3.page-deckbuilder .deck-main,
body.page-deckbuilder .deck-main{
  --db-grid-cols: 10;
  --db-grid-rows: 6;
}

body.dtn-redesign-v3.page-deckbuilder .deck-extra,
body.page-deckbuilder .deck-extra{
  --db-grid-cols: 15;
  --db-grid-rows: 1;
}

body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile,
body.page-deckbuilder .deck-grid .card-tile{
  width:100% !important;
  height:auto !important;
  aspect-ratio:421 / 614 !important;
  min-width:0 !important;
  border-radius:8px !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile img,
body.page-deckbuilder .deck-grid .card-tile img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

@supports (width: 1cqw){
  body.dtn-redesign-v3.page-deckbuilder .deck-grid,
  body.page-deckbuilder .deck-grid{
    --db-cell-w: calc((100cqw - (var(--db-grid-pad) * 2) - ((var(--db-grid-cols) - 1) * var(--db-grid-gap))) / var(--db-grid-cols));
    grid-auto-rows:calc(var(--db-cell-w) * 614 / 421) !important;
    min-height:calc((var(--db-cell-w) * 614 / 421 * var(--db-grid-rows)) + ((var(--db-grid-rows) - 1) * var(--db-grid-gap)) + (var(--db-grid-pad) * 2)) !important;
  }

  body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile,
  body.page-deckbuilder .deck-grid .card-tile{
    height:100% !important;
  }
}

@supports not (width: 1cqw){
  body.dtn-redesign-v3.page-deckbuilder .deck-main,
  body.page-deckbuilder .deck-main{
    min-height:640px !important;
  }
  body.dtn-redesign-v3.page-deckbuilder .deck-extra,
  body.page-deckbuilder .deck-extra{
    min-height:92px !important;
  }
}

body.dtn-redesign-v3.page-deckbuilder .badge-stack .badge,
body.page-deckbuilder .badge-stack .badge{
  position:static !important;
  top:auto !important;
  left:auto !important;
}

body.dtn-redesign-v3.page-deckbuilder .card-tile .badge:not(.badge-stack .badge),
body.dtn-redesign-v3.page-deckbuilder .deck-grid .badge:not(.badge-stack .badge),
body.page-deckbuilder .card-tile .badge:not(.badge-stack .badge),
body.page-deckbuilder .deck-grid .badge:not(.badge-stack .badge){
  position:absolute !important;
  top:5px !important;
  left:5px !important;
  z-index:4 !important;
}

@media (max-width:1550px){
  body.dtn-redesign-v3.page-deckbuilder,
  body.page-deckbuilder{
    --db-left-final:280px;
    --db-right-final:310px;
    --db-center-min-final:690px;
  }
}

@media (max-width:1360px){
  body.dtn-redesign-v3.page-deckbuilder,
  body.page-deckbuilder{
    --db-left-final:260px;
    --db-right-final:290px;
    --db-center-min-final:620px;
    --db-grid-gap:5px;
    --db-grid-pad:8px;
  }
  body.dtn-redesign-v3.page-deckbuilder .app.three-cols,
  body.page-deckbuilder .app.three-cols{
    width:min(100% - 16px, 1500px) !important;
    gap:10px !important;
  }
}

@media (max-width:1240px){
  body.dtn-redesign-v3.page-deckbuilder .app.three-cols,
  body.page-deckbuilder .app.three-cols{
    width:min(100% - 18px, 1100px) !important;
    grid-template-columns:minmax(0,1fr) !important;
  }
  body.dtn-redesign-v3.page-deckbuilder .center-col,
  body.page-deckbuilder .center-col{ order:1; }
  body.dtn-redesign-v3.page-deckbuilder .right-col,
  body.page-deckbuilder .right-col{ order:2; }
  body.dtn-redesign-v3.page-deckbuilder .left-col,
  body.page-deckbuilder .left-col{ order:3; }
}

@media (max-width:760px){
  body.dtn-redesign-v3.page-deckbuilder,
  body.page-deckbuilder{
    --db-grid-gap:4px;
    --db-grid-pad:6px;
  }
  body.dtn-redesign-v3.page-deckbuilder .deck-main,
  body.page-deckbuilder .deck-main{
    --db-grid-cols:5;
    --db-grid-rows:12;
  }
  body.dtn-redesign-v3.page-deckbuilder .deck-extra,
  body.page-deckbuilder .deck-extra{
    --db-grid-cols:5;
    --db-grid-rows:3;
  }
}


/* =========================================================
   Phase 4L — Deck Builder visual grid + card ratio correction
   - fixes the Phase 4K stretched/squashed card scaling
   - adds visible grid slots behind Main Deck / Extra Deck
   - keeps Ban / Tier / Exempt badges and deckbuilder logic intact
========================================================= */
body.dtn-redesign-v3.page-deckbuilder,
body.page-deckbuilder{
  --db-grid-gap: 6px;
  --db-grid-pad: 10px;
  --db-main-slot-w: 68px;
  --db-main-slot-h: 99px;
  --db-extra-slot-w: 44px;
  --db-extra-slot-h: 64px;
}

body.dtn-redesign-v3.page-deckbuilder .deck-grid,
body.page-deckbuilder .deck-grid{
  display:grid !important;
  box-sizing:border-box !important;
  width:100% !important;
  min-width:0 !important;
  padding:var(--db-grid-pad) !important;
  gap:var(--db-grid-gap) !important;
  align-content:start !important;
  justify-content:center !important;
  overflow:visible !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.055),
    inset 0 0 34px rgba(0,0,0,.20),
    0 10px 28px rgba(0,0,0,.18) !important;
}

/* Main Deck: fixed 10x6 visual slot grid. */
body.dtn-redesign-v3.page-deckbuilder .deck-main,
body.page-deckbuilder .deck-main{
  --db-slot-w: var(--db-main-slot-w);
  --db-slot-h: var(--db-main-slot-h);
  grid-template-columns:repeat(10, var(--db-main-slot-w)) !important;
  grid-auto-rows:var(--db-main-slot-h) !important;
  min-height:calc((var(--db-main-slot-h) * 6) + (var(--db-grid-gap) * 5) + (var(--db-grid-pad) * 2)) !important;
  background:
    linear-gradient(135deg, rgba(255,216,72,.13), rgba(128,76,31,.15) 34%, rgba(38,168,89,.12) 67%, rgba(255,93,180,.13)),
    linear-gradient(to right, rgba(255,255,255,.16) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.14) 1px, transparent 1px),
    rgba(12,14,20,.36) !important;
  background-size:
    auto,
    calc(var(--db-main-slot-w) + var(--db-grid-gap)) calc(var(--db-main-slot-h) + var(--db-grid-gap)),
    calc(var(--db-main-slot-w) + var(--db-grid-gap)) calc(var(--db-main-slot-h) + var(--db-grid-gap)),
    auto !important;
  background-position:
    0 0,
    var(--db-grid-pad) var(--db-grid-pad),
    var(--db-grid-pad) var(--db-grid-pad),
    0 0 !important;
}

/* Extra Deck: same panel width, 15 smaller visual slots. */
body.dtn-redesign-v3.page-deckbuilder .deck-extra,
body.page-deckbuilder .deck-extra{
  --db-slot-w: var(--db-extra-slot-w);
  --db-slot-h: var(--db-extra-slot-h);
  grid-template-columns:repeat(15, var(--db-extra-slot-w)) !important;
  grid-auto-rows:var(--db-extra-slot-h) !important;
  min-height:calc((var(--db-extra-slot-h) * 1) + (var(--db-grid-pad) * 2)) !important;
  background:
    linear-gradient(135deg, rgba(124,77,255,.18), rgba(255,255,255,.10) 52%, rgba(179,155,255,.17)),
    linear-gradient(to right, rgba(255,255,255,.18) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.15) 1px, transparent 1px),
    rgba(14,10,30,.42) !important;
  background-size:
    auto,
    calc(var(--db-extra-slot-w) + var(--db-grid-gap)) calc(var(--db-extra-slot-h) + var(--db-grid-gap)),
    calc(var(--db-extra-slot-w) + var(--db-grid-gap)) calc(var(--db-extra-slot-h) + var(--db-grid-gap)),
    auto !important;
  background-position:
    0 0,
    var(--db-grid-pad) var(--db-grid-pad),
    var(--db-grid-pad) var(--db-grid-pad),
    0 0 !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile,
body.page-deckbuilder .deck-grid .card-tile{
  width:var(--db-slot-w) !important;
  height:var(--db-slot-h) !important;
  max-width:100% !important;
  aspect-ratio:421 / 614 !important;
  align-self:start !important;
  justify-self:center !important;
  min-width:0 !important;
  min-height:0 !important;
  border-radius:8px !important;
  overflow:hidden !important;
  background:rgba(0,0,0,.26) !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile img,
body.page-deckbuilder .deck-grid .card-tile img{
  width:100% !important;
  height:100% !important;
  aspect-ratio:421 / 614 !important;
  object-fit:contain !important;
  display:block !important;
  background:rgba(0,0,0,.16) !important;
}

/* Disable the container-query stretch sizing from Phase 4K. */
@supports (width: 1cqw){
  body.dtn-redesign-v3.page-deckbuilder .deck-grid,
  body.page-deckbuilder .deck-grid{
    grid-auto-rows:var(--db-slot-h) !important;
    min-height:initial;
  }
  body.dtn-redesign-v3.page-deckbuilder .deck-main,
  body.page-deckbuilder .deck-main{
    min-height:calc((var(--db-main-slot-h) * 6) + (var(--db-grid-gap) * 5) + (var(--db-grid-pad) * 2)) !important;
  }
  body.dtn-redesign-v3.page-deckbuilder .deck-extra,
  body.page-deckbuilder .deck-extra{
    min-height:calc((var(--db-extra-slot-h) * 1) + (var(--db-grid-pad) * 2)) !important;
  }
  body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile,
  body.page-deckbuilder .deck-grid .card-tile{
    height:var(--db-slot-h) !important;
  }
}

@media (min-width:1680px){
  body.dtn-redesign-v3.page-deckbuilder,
  body.page-deckbuilder{
    --db-main-slot-w:72px;
    --db-main-slot-h:105px;
    --db-extra-slot-w:47px;
    --db-extra-slot-h:68px;
  }
}

@media (max-width:1360px){
  body.dtn-redesign-v3.page-deckbuilder,
  body.page-deckbuilder{
    --db-main-slot-w:60px;
    --db-main-slot-h:88px;
    --db-extra-slot-w:39px;
    --db-extra-slot-h:57px;
    --db-grid-gap:5px;
    --db-grid-pad:8px;
  }
}

@media (max-width:760px){
  body.dtn-redesign-v3.page-deckbuilder .deck-main,
  body.page-deckbuilder .deck-main{
    grid-template-columns:repeat(5, var(--db-main-slot-w)) !important;
    min-height:calc((var(--db-main-slot-h) * 12) + (var(--db-grid-gap) * 11) + (var(--db-grid-pad) * 2)) !important;
  }
  body.dtn-redesign-v3.page-deckbuilder .deck-extra,
  body.page-deckbuilder .deck-extra{
    grid-template-columns:repeat(5, var(--db-extra-slot-w)) !important;
    min-height:calc((var(--db-extra-slot-h) * 3) + (var(--db-grid-gap) * 2) + (var(--db-grid-pad) * 2)) !important;
  }
}

/* =========================================================
   Phase 4M — Deck Builder visual grid alignment + stronger zone color
   - aligns cards to the visible grid cells instead of drifting between lines
   - keeps card image ratio intact
   - makes Main/Extra Deck zone colors more readable and vibrant
   - CSS-only; deckbuilder logic and tier badges untouched
========================================================= */
body.dtn-redesign-v3.page-deckbuilder,
body.page-deckbuilder{
  --db-grid-gap: 6px;
  --db-grid-pad: 12px;
  --db-main-cell-h: 112px;
  --db-main-card-w: 76px;
  --db-extra-cell-h: 72px;
  --db-extra-card-w: 49px;
}

body.dtn-redesign-v3.page-deckbuilder .deck-grid,
body.page-deckbuilder .deck-grid{
  display:grid !important;
  grid-auto-flow:row !important;
  box-sizing:border-box !important;
  width:100% !important;
  min-width:0 !important;
  padding:var(--db-grid-pad) !important;
  gap:var(--db-grid-gap) !important;
  justify-content:stretch !important;
  align-content:start !important;
  align-items:center !important;
  overflow:visible !important;
  border:1px solid rgba(255,255,255,.24) !important;
  border-radius:18px !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.075),
    inset 0 0 42px rgba(0,0,0,.20),
    0 12px 30px rgba(0,0,0,.20) !important;
  background-repeat:no-repeat, repeat, repeat, no-repeat !important;
  background-origin:border-box, content-box, content-box, border-box !important;
  background-clip:border-box, content-box, content-box, border-box !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-main,
body.page-deckbuilder .deck-main{
  grid-template-columns:repeat(10, minmax(0, 1fr)) !important;
  grid-auto-rows:var(--db-main-cell-h) !important;
  min-height:calc((var(--db-main-cell-h) * 6) + (var(--db-grid-gap) * 5) + (var(--db-grid-pad) * 2)) !important;
  background-image:
    linear-gradient(135deg,
      rgba(255,221,74,.42) 0%,
      rgba(156,94,32,.38) 33%,
      rgba(47,196,101,.35) 66%,
      rgba(255,88,188,.40) 100%),
    repeating-linear-gradient(to right,
      rgba(255,255,255,.34) 0 1px,
      transparent 1px 10%),
    repeating-linear-gradient(to bottom,
      rgba(255,255,255,.31) 0 1px,
      transparent 1px calc(var(--db-main-cell-h) + var(--db-grid-gap))),
    radial-gradient(circle at 20% 15%, rgba(255,255,255,.18), transparent 34%) !important;
  background-color:rgba(34,28,18,.72) !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-extra,
body.page-deckbuilder .deck-extra{
  grid-template-columns:repeat(15, minmax(0, 1fr)) !important;
  grid-auto-rows:var(--db-extra-cell-h) !important;
  min-height:calc(var(--db-extra-cell-h) + (var(--db-grid-pad) * 2)) !important;
  background-image:
    linear-gradient(135deg,
      rgba(134,72,255,.52) 0%,
      rgba(255,255,255,.24) 50%,
      rgba(196,166,255,.48) 100%),
    repeating-linear-gradient(to right,
      rgba(255,255,255,.36) 0 1px,
      transparent 1px calc(100% / 15)),
    repeating-linear-gradient(to bottom,
      rgba(255,255,255,.30) 0 1px,
      transparent 1px calc(var(--db-extra-cell-h) + var(--db-grid-gap))),
    radial-gradient(circle at 85% 0%, rgba(255,255,255,.26), transparent 38%) !important;
  background-color:rgba(27,14,58,.78) !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile,
body.page-deckbuilder .deck-grid .card-tile{
  align-self:center !important;
  justify-self:center !important;
  aspect-ratio:421 / 614 !important;
  height:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:calc(100% - 4px) !important;
  border-radius:7px !important;
  overflow:hidden !important;
  background:rgba(0,0,0,.18) !important;
  box-shadow:0 2px 7px rgba(0,0,0,.36) !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-main .card-tile,
body.page-deckbuilder .deck-main .card-tile{
  width:min(var(--db-main-card-w), calc(100% - 4px)) !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-extra .card-tile,
body.page-deckbuilder .deck-extra .card-tile{
  width:min(var(--db-extra-card-w), calc(100% - 4px)) !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile img,
body.page-deckbuilder .deck-grid .card-tile img{
  width:100% !important;
  height:100% !important;
  aspect-ratio:421 / 614 !important;
  object-fit:contain !important;
  display:block !important;
  background:rgba(0,0,0,.12) !important;
}

/* Keep badges readable at the smaller Extra Deck size. */
body.dtn-redesign-v3.page-deckbuilder .deck-extra .badge-stack,
body.page-deckbuilder .deck-extra .badge-stack{
  transform:scale(.84) !important;
  transform-origin:top left !important;
}

body.dtn-redesign-v3.page-deckbuilder .deck-extra .remove-btn,
body.page-deckbuilder .deck-extra .remove-btn{
  transform:scale(.86) !important;
  transform-origin:top right !important;
}

@media (min-width:1680px){
  body.dtn-redesign-v3.page-deckbuilder,
  body.page-deckbuilder{
    --db-main-cell-h: 118px;
    --db-main-card-w: 81px;
    --db-extra-cell-h: 76px;
    --db-extra-card-w: 52px;
  }
}

@media (max-width:1360px){
  body.dtn-redesign-v3.page-deckbuilder,
  body.page-deckbuilder{
    --db-grid-gap: 5px;
    --db-grid-pad: 9px;
    --db-main-cell-h: 96px;
    --db-main-card-w: 66px;
    --db-extra-cell-h: 62px;
    --db-extra-card-w: 42px;
  }
}

@media (max-width:760px){
  body.dtn-redesign-v3.page-deckbuilder .deck-main,
  body.page-deckbuilder .deck-main{
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
    min-height:calc((var(--db-main-cell-h) * 12) + (var(--db-grid-gap) * 11) + (var(--db-grid-pad) * 2)) !important;
    background-image:
      linear-gradient(135deg, rgba(255,221,74,.42), rgba(156,94,32,.38) 33%, rgba(47,196,101,.35) 66%, rgba(255,88,188,.40)),
      repeating-linear-gradient(to right, rgba(255,255,255,.34) 0 1px, transparent 1px 20%),
      repeating-linear-gradient(to bottom, rgba(255,255,255,.31) 0 1px, transparent 1px calc(var(--db-main-cell-h) + var(--db-grid-gap))),
      radial-gradient(circle at 20% 15%, rgba(255,255,255,.18), transparent 34%) !important;
  }

  body.dtn-redesign-v3.page-deckbuilder .deck-extra,
  body.page-deckbuilder .deck-extra{
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
    min-height:calc((var(--db-extra-cell-h) * 3) + (var(--db-grid-gap) * 2) + (var(--db-grid-pad) * 2)) !important;
    background-image:
      linear-gradient(135deg, rgba(134,72,255,.52), rgba(255,255,255,.24) 50%, rgba(196,166,255,.48)),
      repeating-linear-gradient(to right, rgba(255,255,255,.36) 0 1px, transparent 1px 20%),
      repeating-linear-gradient(to bottom, rgba(255,255,255,.30) 0 1px, transparent 1px calc(var(--db-extra-cell-h) + var(--db-grid-gap))),
      radial-gradient(circle at 85% 0%, rgba(255,255,255,.26), transparent 38%) !important;
  }
}


/* =========================================================
   Phase 4N — Deck Builder exact grid + tier fetch stabilization
   - Exact visual slots: Main Deck 10 x 6, Extra Deck 15 x 1.
   - Cards are real CSS-grid children and snap into the same slots as the visible grid.
   - Restores search results as a scrollable list.
   - Keeps Ban / A / B / Exempt badge indicators.
========================================================= */
body.page-deckbuilder,
body.dtn-redesign-v3.page-deckbuilder{
  --db-grid-gap:6px;
  --db-grid-pad:10px;
}

body.page-deckbuilder .deck-grid,
body.dtn-redesign-v3.page-deckbuilder .deck-grid{
  display:grid !important;
  grid-auto-flow:row !important;
  box-sizing:border-box !important;
  width:100% !important;
  min-width:0 !important;
  padding:var(--db-grid-pad) !important;
  gap:var(--db-grid-gap) !important;
  justify-content:stretch !important;
  align-content:start !important;
  align-items:stretch !important;
  overflow:visible !important;
  container-type:inline-size;
  border:1px solid rgba(255,255,255,.28) !important;
  border-radius:18px !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.09),
    inset 0 0 48px rgba(0,0,0,.20),
    0 12px 30px rgba(0,0,0,.22) !important;
}

body.page-deckbuilder .deck-main,
body.dtn-redesign-v3.page-deckbuilder .deck-main{
  --db-grid-cols:10;
  --db-grid-rows:6;
  grid-template-columns:repeat(10, minmax(0, 1fr)) !important;
  background:
    linear-gradient(135deg,
      rgba(255,225,64,.58) 0%,
      rgba(171,101,33,.48) 32%,
      rgba(45,202,102,.48) 66%,
      rgba(255,82,190,.55) 100%),
    radial-gradient(circle at 14% 12%, rgba(255,255,255,.22), transparent 28%),
    rgba(38,28,16,.74) !important;
}

body.page-deckbuilder .deck-extra,
body.dtn-redesign-v3.page-deckbuilder .deck-extra{
  --db-grid-cols:15;
  --db-grid-rows:1;
  grid-template-columns:repeat(15, minmax(0, 1fr)) !important;
  background:
    linear-gradient(135deg,
      rgba(126,72,255,.64) 0%,
      rgba(255,255,255,.32) 50%,
      rgba(190,150,255,.58) 100%),
    radial-gradient(circle at 86% 4%, rgba(255,255,255,.26), transparent 34%),
    rgba(30,14,64,.80) !important;
}

@supports (width: 1cqw){
  body.page-deckbuilder .deck-grid,
  body.dtn-redesign-v3.page-deckbuilder .deck-grid{
    --db-slot-w:calc((100cqw - (var(--db-grid-pad) * 2) - ((var(--db-grid-cols) - 1) * var(--db-grid-gap))) / var(--db-grid-cols));
    --db-slot-h:calc(var(--db-slot-w) * 614 / 421);
    grid-auto-rows:var(--db-slot-h) !important;
    min-height:calc((var(--db-slot-h) * var(--db-grid-rows)) + ((var(--db-grid-rows) - 1) * var(--db-grid-gap)) + (var(--db-grid-pad) * 2)) !important;
  }
}

@supports not (width: 1cqw){
  body.page-deckbuilder .deck-main,
  body.dtn-redesign-v3.page-deckbuilder .deck-main{
    grid-auto-rows:104px !important;
    min-height:calc((104px * 6) + (var(--db-grid-gap) * 5) + (var(--db-grid-pad) * 2)) !important;
  }
  body.page-deckbuilder .deck-extra,
  body.dtn-redesign-v3.page-deckbuilder .deck-extra{
    grid-auto-rows:66px !important;
    min-height:calc(66px + (var(--db-grid-pad) * 2)) !important;
  }
}

body.page-deckbuilder .deck-grid .card-tile,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile,
body.page-deckbuilder .deck-grid .deck-slot,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .deck-slot{
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:none !important;
  aspect-ratio:auto !important;
  border-radius:8px !important;
  box-sizing:border-box !important;
}

body.page-deckbuilder .deck-grid .deck-slot,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .deck-slot{
  pointer-events:none;
  border:1px solid rgba(255,255,255,.28);
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(0,0,0,.08));
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.18),
    inset 0 0 14px rgba(255,255,255,.045);
  opacity:.92;
}

body.page-deckbuilder .deck-grid .card-tile,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile{
  position:relative !important;
  align-self:stretch !important;
  justify-self:stretch !important;
  overflow:hidden !important;
  background:rgba(0,0,0,.18) !important;
  border:1px solid rgba(255,255,255,.32) !important;
  box-shadow:0 3px 9px rgba(0,0,0,.38) !important;
}

body.page-deckbuilder .deck-grid .card-tile img,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile img{
  width:100% !important;
  height:100% !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  display:block !important;
  background:rgba(0,0,0,.12) !important;
}

body.page-deckbuilder .deck-grid .badge-stack .badge,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .badge-stack .badge{
  position:static !important;
}

body.page-deckbuilder .deck-extra .badge-stack,
body.dtn-redesign-v3.page-deckbuilder .deck-extra .badge-stack,
body.page-deckbuilder .deck-extra .remove-btn,
body.dtn-redesign-v3.page-deckbuilder .deck-extra .remove-btn{
  transform:none !important;
}

body.page-deckbuilder .search-panel,
body.dtn-redesign-v3.page-deckbuilder .search-panel{
  overflow:hidden !important;
}

body.page-deckbuilder .results-wrap,
body.dtn-redesign-v3.page-deckbuilder .results-wrap{
  min-height:260px !important;
  flex:1 1 auto !important;
  overflow:hidden !important;
}

body.page-deckbuilder .results-list,
body.dtn-redesign-v3.page-deckbuilder .results-list{
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  height:100% !important;
  max-height:none !important;
  min-height:260px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:4px !important;
}

body.page-deckbuilder .result,
body.dtn-redesign-v3.page-deckbuilder .result{
  display:grid !important;
  grid-template-columns:48px minmax(0,1fr) auto !important;
  align-items:center !important;
}

@media (max-width:760px){
  body.page-deckbuilder .deck-main,
  body.dtn-redesign-v3.page-deckbuilder .deck-main{
    --db-grid-cols:5;
    --db-grid-rows:12;
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
  }
  body.page-deckbuilder .deck-extra,
  body.dtn-redesign-v3.page-deckbuilder .deck-extra{
    --db-grid-cols:5;
    --db-grid-rows:3;
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
  }
}


/* =========================================================
   Phase 4O — Deck Builder slot-size grid + search scroll fix
   - Uses the real placeholder .deck-slot elements as the visible grid.
   - Main Deck stays exactly 10 across / 6 rows through 60 total slots.
   - Extra Deck stays exactly 15 across / 1 row through 15 total slots.
   - Card/slot boxes keep the real Yu-Gi-Oh card ratio with no tall empty cell space.
   - Restores the right search results as a scrollable list.
========================================================= */
body.page-deckbuilder,
body.dtn-redesign-v3.page-deckbuilder{
  --db-grid-gap: 6px;
  --db-grid-pad: 10px;
}

body.page-deckbuilder .deck-grid,
body.dtn-redesign-v3.page-deckbuilder .deck-grid{
  display:grid !important;
  grid-auto-flow:row !important;
  grid-auto-rows:auto !important;
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  padding:var(--db-grid-pad) !important;
  gap:var(--db-grid-gap) !important;
  align-items:start !important;
  align-content:start !important;
  justify-content:stretch !important;
  overflow:visible !important;
  container-type:normal !important;
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.25) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.075),
    inset 0 0 42px rgba(0,0,0,.20),
    0 12px 30px rgba(0,0,0,.20) !important;
}

body.page-deckbuilder .deck-main,
body.dtn-redesign-v3.page-deckbuilder .deck-main{
  grid-template-columns:repeat(10, minmax(0, 1fr)) !important;
  min-height:0 !important;
  background:
    linear-gradient(135deg,
      rgba(255,221,74,.50) 0%,
      rgba(156,94,32,.44) 32%,
      rgba(47,196,101,.42) 66%,
      rgba(255,88,188,.46) 100%),
    radial-gradient(circle at 14% 9%, rgba(255,255,255,.20), transparent 28%),
    rgba(34,28,18,.78) !important;
}

body.page-deckbuilder .deck-extra,
body.dtn-redesign-v3.page-deckbuilder .deck-extra{
  grid-template-columns:repeat(15, minmax(0, 1fr)) !important;
  min-height:0 !important;
  background:
    linear-gradient(135deg,
      rgba(134,72,255,.62) 0%,
      rgba(255,255,255,.26) 50%,
      rgba(196,166,255,.56) 100%),
    radial-gradient(circle at 85% 0%, rgba(255,255,255,.26), transparent 38%),
    rgba(27,14,58,.82) !important;
}

body.page-deckbuilder .deck-grid .card-tile,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile,
body.page-deckbuilder .deck-grid .deck-slot,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .deck-slot{
  width:100% !important;
  height:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:none !important;
  aspect-ratio:421 / 614 !important;
  align-self:start !important;
  justify-self:stretch !important;
  box-sizing:border-box !important;
  border-radius:8px !important;
}

body.page-deckbuilder .deck-grid .deck-slot,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .deck-slot{
  display:block !important;
  pointer-events:none !important;
  border:1px solid rgba(255,255,255,.28) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(0,0,0,.10)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.16),
    inset 0 0 16px rgba(255,255,255,.045) !important;
  opacity:.88 !important;
}

body.page-deckbuilder .deck-grid .card-tile,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile{
  position:relative !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.34) !important;
  background:rgba(0,0,0,.18) !important;
  box-shadow:0 2px 7px rgba(0,0,0,.36) !important;
}

body.page-deckbuilder .deck-grid .card-tile img,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .card-tile img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  aspect-ratio:421 / 614 !important;
  object-fit:cover !important;
  background:rgba(0,0,0,.14) !important;
}

body.page-deckbuilder .deck-extra .badge-stack,
body.dtn-redesign-v3.page-deckbuilder .deck-extra .badge-stack,
body.page-deckbuilder .deck-extra .remove-btn,
body.dtn-redesign-v3.page-deckbuilder .deck-extra .remove-btn{
  transform:scale(.82) !important;
  transform-origin:top left !important;
}

body.page-deckbuilder .deck-grid .remove-btn,
body.dtn-redesign-v3.page-deckbuilder .deck-grid .remove-btn{
  z-index:5 !important;
}

@media (max-width:760px){
  body.page-deckbuilder .deck-main,
  body.dtn-redesign-v3.page-deckbuilder .deck-main{
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
  }
  body.page-deckbuilder .deck-extra,
  body.dtn-redesign-v3.page-deckbuilder .deck-extra{
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
  }
}

/* Search panel: keep filters fixed and put card results back in a scroll box. */
body.page-deckbuilder .search-panel,
body.dtn-redesign-v3.page-deckbuilder .search-panel{
  display:flex !important;
  flex-direction:column !important;
  max-height:calc(100vh - 96px) !important;
  overflow:hidden !important;
}

body.page-deckbuilder .search-panel .filters,
body.dtn-redesign-v3.page-deckbuilder .search-panel .filters,
body.page-deckbuilder .search-panel .pager,
body.dtn-redesign-v3.page-deckbuilder .search-panel .pager{
  flex:0 0 auto !important;
}

body.page-deckbuilder .results-wrap,
body.dtn-redesign-v3.page-deckbuilder .results-wrap{
  flex:1 1 340px !important;
  min-height:240px !important;
  max-height:520px !important;
  overflow:hidden !important;
}

body.page-deckbuilder .results-list,
body.dtn-redesign-v3.page-deckbuilder .results-list{
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  height:100% !important;
  min-height:0 !important;
  max-height:520px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:6px !important;
}

body.page-deckbuilder .results-list .result,
body.dtn-redesign-v3.page-deckbuilder .results-list .result{
  flex:0 0 auto !important;
}

@media (max-width:1240px){
  body.page-deckbuilder .search-panel,
  body.dtn-redesign-v3.page-deckbuilder .search-panel{
    position:static !important;
    max-height:none !important;
  }
  body.page-deckbuilder .results-wrap,
  body.dtn-redesign-v3.page-deckbuilder .results-wrap,
  body.page-deckbuilder .results-list,
  body.dtn-redesign-v3.page-deckbuilder .results-list{
    max-height:520px !important;
  }
}


/* =========================================================
   Phase 4P — Deck Builder header removal + combined checker
   - Removes the auto-added "Deck Builder / Use the tools..." panel.
   - Combines tier legend and deck-check output into one panel.
   - Aligns left/center/right panels close under the site header.
   - Widens the search panel/search box without changing deck logic.
========================================================= */
body.page-deckbuilder .dtn-auto-page-title,
body.dtn-redesign-v3.page-deckbuilder .dtn-auto-page-title{
  display:none !important;
}

body.page-deckbuilder,
body.dtn-redesign-v3.page-deckbuilder{
  --db-left-final: clamp(250px, 15vw, 290px);
  --db-right-final: clamp(480px, 30vw, 590px);
  --db-center-min-final: 820px;
  --db-grid-gap: 6px;
}

body.page-deckbuilder .app.three-cols,
body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
  width:min(1880px, calc(100% - 10px)) !important;
  margin:5px auto 30px !important;
  grid-template-columns:
    minmax(240px, var(--db-left-final))
    minmax(var(--db-center-min-final), 1fr)
    minmax(430px, var(--db-right-final)) !important;
  gap:clamp(8px, .65vw, 12px) !important;
  align-items:start !important;
}

body.page-deckbuilder .left-col > .panel:first-child,
body.page-deckbuilder .center-col > .panel:first-child,
body.page-deckbuilder .right-col > .panel:first-child,
body.dtn-redesign-v3.page-deckbuilder .left-col > .panel:first-child,
body.dtn-redesign-v3.page-deckbuilder .center-col > .panel:first-child,
body.dtn-redesign-v3.page-deckbuilder .right-col > .panel:first-child{
  margin-top:0 !important;
}

body.page-deckbuilder .deckbuilder-check-panel,
body.dtn-redesign-v3.page-deckbuilder .deckbuilder-check-panel{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:12px 14px !important;
  margin:0 0 var(--db-gap) 0 !important;
  border-radius:18px !important;
}

body.page-deckbuilder .deckbuilder-check-panel .topbar-left,
body.dtn-redesign-v3.page-deckbuilder .deckbuilder-check-panel .topbar-left{
  flex:1 1 auto !important;
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:7px !important;
}

body.page-deckbuilder .deckbuilder-check-panel .topbar-title,
body.dtn-redesign-v3.page-deckbuilder .deckbuilder-check-panel .topbar-title{
  font-size:clamp(15px, 1.05vw, 19px) !important;
  line-height:1.1 !important;
  letter-spacing:.035em !important;
  margin:0 !important;
}

body.page-deckbuilder .deckbuilder-check-panel .key,
body.dtn-redesign-v3.page-deckbuilder .deckbuilder-check-panel .key{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  margin:0 !important;
}

body.page-deckbuilder #issuesPanel.deckbuilder-check-output,
body.dtn-redesign-v3.page-deckbuilder #issuesPanel.deckbuilder-check-output{
  display:block !important;
  min-height:0 !important;
  margin:0 !important;
  padding:6px 0 0 0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  font-size:13px !important;
  line-height:1.35 !important;
}

body.page-deckbuilder #issuesPanel.deckbuilder-check-output:empty,
body.dtn-redesign-v3.page-deckbuilder #issuesPanel.deckbuilder-check-output:empty{
  display:none !important;
}

body.page-deckbuilder #issuesPanel.deckbuilder-check-output .keyline,
body.dtn-redesign-v3.page-deckbuilder #issuesPanel.deckbuilder-check-output .keyline{
  display:none !important;
}

body.page-deckbuilder #issuesPanel.deckbuilder-check-output .ok,
body.dtn-redesign-v3.page-deckbuilder #issuesPanel.deckbuilder-check-output .ok{
  color:#7dffb4 !important;
  font-weight:900 !important;
  text-shadow:0 0 14px rgba(35,209,125,.22) !important;
}

body.page-deckbuilder #issuesPanel.deckbuilder-check-output .bad,
body.dtn-redesign-v3.page-deckbuilder #issuesPanel.deckbuilder-check-output .bad{
  color:#ff6868 !important;
  font-weight:900 !important;
  text-shadow:0 0 14px rgba(255,59,59,.22) !important;
}

body.page-deckbuilder #issuesPanel.deckbuilder-check-output ul,
body.dtn-redesign-v3.page-deckbuilder #issuesPanel.deckbuilder-check-output ul{
  margin:5px 0 0 !important;
  padding-left:18px !important;
}

body.page-deckbuilder .deckbuilder-check-panel .topbar-actions,
body.dtn-redesign-v3.page-deckbuilder .deckbuilder-check-panel .topbar-actions{
  flex:0 0 auto !important;
  align-items:flex-start !important;
  justify-content:flex-end !important;
  gap:8px !important;
}

body.page-deckbuilder #issuesPanel.panel.issues,
body.dtn-redesign-v3.page-deckbuilder #issuesPanel.panel.issues{
  display:none !important;
}

body.page-deckbuilder .right-col,
body.dtn-redesign-v3.page-deckbuilder .right-col{
  width:100% !important;
}

body.page-deckbuilder .search-panel,
body.dtn-redesign-v3.page-deckbuilder .search-panel{
  width:100% !important;
  max-width:none !important;
}

body.page-deckbuilder .search-query-field,
body.dtn-redesign-v3.page-deckbuilder .search-query-field,
body.page-deckbuilder #fQuery,
body.dtn-redesign-v3.page-deckbuilder #fQuery{
  width:100% !important;
  max-width:none !important;
}

body.page-deckbuilder .results-wrap,
body.dtn-redesign-v3.page-deckbuilder .results-wrap{
  min-height:260px !important;
  flex:1 1 360px !important;
}

body.page-deckbuilder .results-list,
body.dtn-redesign-v3.page-deckbuilder .results-list{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  min-height:260px !important;
  max-height:calc(100vh - 510px) !important;
}

@media (max-width:1550px){
  body.page-deckbuilder,
  body.dtn-redesign-v3.page-deckbuilder{
    --db-left-final:250px;
    --db-right-final:430px;
    --db-center-min-final:760px;
  }
  body.page-deckbuilder .app.three-cols,
  body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
    width:min(100% - 10px, 1540px) !important;
    grid-template-columns:minmax(230px, var(--db-left-final)) minmax(var(--db-center-min-final), 1fr) minmax(380px, var(--db-right-final)) !important;
  }
}

@media (max-width:1240px){
  body.page-deckbuilder .app.three-cols,
  body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
    width:min(100% - 12px, 1100px) !important;
    margin-top:5px !important;
    grid-template-columns:minmax(0,1fr) !important;
  }
  body.page-deckbuilder .deckbuilder-check-panel,
  body.dtn-redesign-v3.page-deckbuilder .deckbuilder-check-panel{
    flex-direction:column !important;
  }
  body.page-deckbuilder .deckbuilder-check-panel .topbar-actions,
  body.dtn-redesign-v3.page-deckbuilder .deckbuilder-check-panel .topbar-actions{
    justify-content:flex-start !important;
  }
  body.page-deckbuilder .results-list,
  body.dtn-redesign-v3.page-deckbuilder .results-list{
    max-height:520px !important;
  }
}

/* =========================================================
   Phase 4Q — Deck Builder search LENGTH fix
   - "Longer" means taller, not wider.
   - Restores a more normal right column width.
   - Extends the search results list vertically by about 250px.
   - Keeps Deck Builder grids, tier badges, and deck logic untouched.
========================================================= */
body.page-deckbuilder,
body.dtn-redesign-v3.page-deckbuilder{
  --db-right-final: clamp(380px, 23vw, 440px) !important;
  --db-center-min-final: 860px !important;
}

body.page-deckbuilder .app.three-cols,
body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
  grid-template-columns:
    minmax(240px, var(--db-left-final))
    minmax(var(--db-center-min-final), 1fr)
    minmax(360px, var(--db-right-final)) !important;
}

body.page-deckbuilder .search-panel,
body.dtn-redesign-v3.page-deckbuilder .search-panel{
  width:100% !important;
  max-width:440px !important;
  max-height:calc(100vh - 74px) !important;
  min-height:min(840px, calc(100vh - 74px)) !important;
  overflow:hidden !important;
}

body.page-deckbuilder .results-wrap,
body.dtn-redesign-v3.page-deckbuilder .results-wrap{
  flex:1 1 auto !important;
  min-height:500px !important;
  max-height:none !important;
  overflow:hidden !important;
}

body.page-deckbuilder .results-list,
body.dtn-redesign-v3.page-deckbuilder .results-list{
  height:100% !important;
  min-height:500px !important;
  max-height:calc(100vh - 260px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

@media (max-width:1550px){
  body.page-deckbuilder,
  body.dtn-redesign-v3.page-deckbuilder{
    --db-right-final:400px !important;
    --db-center-min-final:780px !important;
  }
  body.page-deckbuilder .app.three-cols,
  body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
    grid-template-columns:minmax(230px, var(--db-left-final)) minmax(var(--db-center-min-final), 1fr) minmax(360px, var(--db-right-final)) !important;
  }
}

@media (max-width:1240px){
  body.page-deckbuilder .search-panel,
  body.dtn-redesign-v3.page-deckbuilder .search-panel{
    max-width:none !important;
    min-height:auto !important;
    max-height:none !important;
  }
  body.page-deckbuilder .results-wrap,
  body.dtn-redesign-v3.page-deckbuilder .results-wrap{
    min-height:420px !important;
  }
  body.page-deckbuilder .results-list,
  body.dtn-redesign-v3.page-deckbuilder .results-list{
    min-height:420px !important;
    max-height:620px !important;
  }
}

/* =========================================================
   Phase 4R — Deck Builder search panel top alignment
   - Keeps the Search panel/top edge directly under the site header.
   - Preserves the longer scrollable search results from Phase 4Q.
   - Does not alter deck logic, card search logic, deck check, or grids.
========================================================= */
body.page-deckbuilder .right-col,
body.dtn-redesign-v3.page-deckbuilder .right-col{
  align-self:start !important;
  margin-top:0 !important;
  padding-top:0 !important;
}

body.page-deckbuilder .right-col > .search-panel,
body.dtn-redesign-v3.page-deckbuilder .right-col > .search-panel{
  margin-top:0 !important;
  top:auto !important;
}

body.page-deckbuilder .app.three-cols,
body.dtn-redesign-v3.page-deckbuilder .app.three-cols{
  margin-top:5px !important;
  padding-top:0 !important;
}

@media (min-width:1241px){
  body.page-deckbuilder .right-col,
  body.dtn-redesign-v3.page-deckbuilder .right-col{
    position:sticky !important;
    top:calc(var(--dtn-site-header-height, 70px) + 5px) !important;
    max-height:calc(100vh - 75px) !important;
  }

  body.page-deckbuilder .search-panel,
  body.dtn-redesign-v3.page-deckbuilder .search-panel{
    max-height:calc(100vh - 75px) !important;
    min-height:min(840px, calc(100vh - 75px)) !important;
  }
}

@media (max-width:1240px){
  body.page-deckbuilder .right-col,
  body.dtn-redesign-v3.page-deckbuilder .right-col{
    position:relative !important;
    top:auto !important;
    max-height:none !important;
  }
}

/* =========================================================
   Phase 4S — Deck Builder locked search panel
   - Keeps the Search/Card Results panel locked under the site header on desktop.
   - The page/deck zones may scroll, but the search panel stays available.
   - Results continue to scroll inside the panel.
   - Mobile/tablet returns to normal stacked flow.
========================================================= */
@media (min-width:1241px){
  body.page-deckbuilder,
  body.dtn-redesign-v3.page-deckbuilder{
    --db-search-lock-top: calc(var(--dtn-site-header-height, 70px) + 5px);
    --db-search-lock-height: calc(100vh - var(--dtn-site-header-height, 70px) - 10px);
  }

  body.page-deckbuilder .right-col,
  body.dtn-redesign-v3.page-deckbuilder .right-col{
    position:sticky !important;
    top:var(--db-search-lock-top) !important;
    align-self:start !important;
    height:var(--db-search-lock-height) !important;
    max-height:var(--db-search-lock-height) !important;
    overflow:visible !important;
    z-index:20 !important;
  }

  body.page-deckbuilder .right-col > .search-panel,
  body.dtn-redesign-v3.page-deckbuilder .right-col > .search-panel{
    position:sticky !important;
    top:var(--db-search-lock-top) !important;
    height:var(--db-search-lock-height) !important;
    max-height:var(--db-search-lock-height) !important;
    min-height:0 !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:hidden !important;
    margin-top:0 !important;
  }

  body.page-deckbuilder .search-panel .filters,
  body.dtn-redesign-v3.page-deckbuilder .search-panel .filters,
  body.page-deckbuilder .search-panel .pager,
  body.dtn-redesign-v3.page-deckbuilder .search-panel .pager{
    flex:0 0 auto !important;
  }

  body.page-deckbuilder .search-panel .results-wrap,
  body.dtn-redesign-v3.page-deckbuilder .search-panel .results-wrap{
    flex:1 1 auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:hidden !important;
  }

  body.page-deckbuilder .search-panel .results-list,
  body.dtn-redesign-v3.page-deckbuilder .search-panel .results-list{
    height:100% !important;
    min-height:0 !important;
    max-height:none !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
}

@media (max-width:1240px){
  body.page-deckbuilder .right-col,
  body.dtn-redesign-v3.page-deckbuilder .right-col,
  body.page-deckbuilder .right-col > .search-panel,
  body.dtn-redesign-v3.page-deckbuilder .right-col > .search-panel{
    position:relative !important;
    top:auto !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }
}


/* =========================================================
   Phase 4T — Forums + Duelist Mail / Messenger UI overhaul
   - CSS-only polish for community and messaging pages.
   - Does not touch Deck Builder, tournaments, Supabase, YGO data, or mail/forum logic.
========================================================= */

/* ---------- Community Forums: modern app/channel layout ---------- */
body.dtn-redesign-v3.page-forums{
  --forum-side: clamp(260px, 22vw, 330px);
  --forum-gap: 16px;
}

body.dtn-redesign-v3.page-forums .forumsWrap{
  max-width:min(1680px, calc(100vw - 32px)) !important;
  margin:10px auto 36px !important;
  padding:0 12px !important;
}

body.dtn-redesign-v3.page-forums .forumsShellV2,
body.dtn-redesign-v3.page-forums .forums-shell{
  padding:16px !important;
  border-radius:24px !important;
  border:1px solid rgba(148,220,255,.18) !important;
  background:
    radial-gradient(900px 360px at 12% -8%, rgba(0,179,255,.18), transparent 62%),
    radial-gradient(820px 340px at 92% 0%, rgba(124,77,255,.17), transparent 60%),
    linear-gradient(180deg, rgba(12,18,34,.86), rgba(8,10,18,.72)) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.50), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

body.dtn-redesign-v3.page-forums .forumsTopV2,
body.dtn-redesign-v3.page-forums .forums-top{
  margin:0 0 12px !important;
  padding:0 2px 12px !important;
  border-bottom:1px solid rgba(188,232,255,.10) !important;
}

body.dtn-redesign-v3.page-forums .forums-title,
body.dtn-redesign-v3.page-forums .forumsTitle{
  font-size:clamp(26px, 2.2vw, 36px) !important;
  line-height:1.02 !important;
  margin:0 0 4px !important;
}

body.dtn-redesign-v3.page-forums .forums-sub,
body.dtn-redesign-v3.page-forums .forumsSub{
  max-width:920px !important;
  font-size:13px !important;
  color:rgba(232,244,255,.72) !important;
  margin:0 !important;
}

body.dtn-redesign-v3.page-forums .forumsGridV2,
body.dtn-redesign-v3.page-forums .forums-grid{
  grid-template-columns:var(--forum-side) minmax(0,1fr) !important;
  gap:var(--forum-gap) !important;
  align-items:start !important;
}

body.dtn-redesign-v3.page-forums .forumsSidebar,
body.dtn-redesign-v3.page-forums .forumsMain{
  border-radius:20px !important;
  border:1px solid rgba(160,226,255,.16) !important;
  background:
    radial-gradient(760px 260px at 12% 0%, rgba(0,179,255,.10), transparent 62%),
    linear-gradient(180deg, rgba(15,20,35,.78), rgba(9,12,22,.66)) !important;
  box-shadow:0 16px 42px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

@media (min-width:981px){
  body.dtn-redesign-v3.page-forums .forumsSidebar{
    position:sticky !important;
    top:calc(var(--dtn-site-header-height, 70px) + 10px) !important;
    max-height:calc(100vh - var(--dtn-site-header-height, 70px) - 24px) !important;
    overflow:hidden !important;
  }
  body.dtn-redesign-v3.page-forums .channelList{
    max-height:calc(100vh - var(--dtn-site-header-height, 70px) - 96px) !important;
    overflow:auto !important;
    padding-right:4px !important;
  }
}

body.dtn-redesign-v3.page-forums .sidebarHeader,
body.dtn-redesign-v3.page-forums .threadsHeader{
  padding:14px !important;
  border-bottom:1px solid rgba(188,232,255,.10) !important;
}

body.dtn-redesign-v3.page-forums .sidebarTitle,
body.dtn-redesign-v3.page-forums .cardTitle{
  font-family:Orbitron, system-ui, sans-serif !important;
  font-size:14px !important;
  letter-spacing:.05em !important;
  text-transform:uppercase !important;
  color:#ffe76a !important;
}

body.dtn-redesign-v3.page-forums .channelList{
  padding:12px !important;
  gap:8px !important;
}

body.dtn-redesign-v3.page-forums .channelGroupTitle{
  padding:6px 8px 5px !important;
  font-size:11px !important;
  color:rgba(226,239,255,.58) !important;
}

body.dtn-redesign-v3.page-forums .channelBtn{
  min-height:42px !important;
  border-radius:14px !important;
  padding:9px 10px !important;
  justify-content:flex-start !important;
  background:rgba(255,255,255,.035) !important;
  border-color:rgba(188,232,255,.10) !important;
  box-shadow:none !important;
}

body.dtn-redesign-v3.page-forums .channelBtn:hover,
body.dtn-redesign-v3.page-forums .channelBtn.isActive{
  transform:translateX(2px) !important;
  border-color:rgba(0,179,255,.38) !important;
  background:linear-gradient(135deg, rgba(0,179,255,.18), rgba(124,77,255,.12)) !important;
  box-shadow:inset 3px 0 0 rgba(255,231,106,.88), 0 12px 28px rgba(0,0,0,.28) !important;
}

body.dtn-redesign-v3.page-forums .threadsHeader{
  display:grid !important;
  grid-template-columns:minmax(220px, .8fr) minmax(360px, 1.4fr) !important;
  gap:14px !important;
  align-items:start !important;
}

body.dtn-redesign-v3.page-forums .forumsActionsV2{
  display:grid !important;
  grid-template-columns:minmax(260px,1fr) auto !important;
  gap:10px !important;
  align-items:start !important;
}

body.dtn-redesign-v3.page-forums .forums-search{
  display:flex !important;
  gap:8px !important;
  align-items:center !important;
}

body.dtn-redesign-v3.page-forums .forums-search .input{
  min-width:0 !important;
  flex:1 1 auto !important;
}

body.dtn-redesign-v3.page-forums .forums-controls{
  display:flex !important;
  gap:8px !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:wrap !important;
}

body.dtn-redesign-v3.page-forums .tabRow{
  display:flex !important;
  gap:8px !important;
  margin-top:10px !important;
  justify-content:flex-end !important;
}

body.dtn-redesign-v3.page-forums .tabBtn{
  min-height:32px !important;
  padding:7px 11px !important;
  border-radius:999px !important;
  font-size:12px !important;
}

body.dtn-redesign-v3.page-forums .tabBtn.isActive{
  color:#10131b !important;
  background:linear-gradient(135deg, #ffe76a, #00b3ff) !important;
  border-color:rgba(255,231,106,.65) !important;
}

body.dtn-redesign-v3.page-forums .threadList,
body.dtn-redesign-v3.page-forums .threadListV2{
  padding:12px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
}

body.dtn-redesign-v3.page-forums .threadRow{
  border-radius:18px !important;
  padding:13px 14px !important;
  border:1px solid rgba(188,232,255,.11) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)) !important;
  box-shadow:0 10px 26px rgba(0,0,0,.24) !important;
}

body.dtn-redesign-v3.page-forums .threadRow:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(0,179,255,.34) !important;
  background:linear-gradient(135deg, rgba(0,179,255,.11), rgba(124,77,255,.08)) !important;
}

body.dtn-redesign-v3.page-forums .threadTitleSmall,
body.dtn-redesign-v3.page-forums .threadTitle{
  font-size:15px !important;
  color:#f7fbff !important;
}

body.dtn-redesign-v3.page-forums .threadByline,
body.dtn-redesign-v3.page-forums .cardHint{
  font-size:12px !important;
  color:rgba(232,244,255,.62) !important;
}

body.dtn-redesign-v3.page-forums .pager{
  margin:0 12px 12px !important;
  padding:10px !important;
  border-radius:16px !important;
  border:1px solid rgba(188,232,255,.10) !important;
  background:rgba(6,10,18,.42) !important;
}

body.dtn-redesign-v3.page-forums .dtnSearchDrop{
  border-radius:18px !important;
  border:1px solid rgba(0,179,255,.24) !important;
  background:rgba(8,12,22,.95) !important;
  box-shadow:0 22px 54px rgba(0,0,0,.55) !important;
  backdrop-filter:blur(14px) !important;
}

@media (max-width:980px){
  body.dtn-redesign-v3.page-forums .forumsGridV2,
  body.dtn-redesign-v3.page-forums .forums-grid,
  body.dtn-redesign-v3.page-forums .threadsHeader,
  body.dtn-redesign-v3.page-forums .forumsActionsV2{
    grid-template-columns:1fr !important;
  }
  body.dtn-redesign-v3.page-forums .forums-controls,
  body.dtn-redesign-v3.page-forums .tabRow{
    justify-content:flex-start !important;
  }
}

/* ---------- Duelist Mail + Messenger: modern split-pane mail app ---------- */
body.dtn-redesign-v3.page-dms .wrap,
body.dtn-redesign-v3.page-dm-thread .wrap,
body.dtn-redesign-v3.page-dm-compose .wrap{
  max-width:min(1680px, calc(100vw - 28px)) !important;
  margin:10px auto 34px !important;
  padding:0 12px !important;
}

body.dtn-redesign-v3.page-dms .dms-shell,
body.dtn-redesign-v3.page-dm-thread .dms-shell,
body.dtn-redesign-v3.page-dm-compose .dms-shell{
  max-width:none !important;
  margin:0 auto !important;
  padding:16px !important;
  border-radius:24px !important;
  border:1px solid rgba(148,220,255,.18) !important;
  background:
    radial-gradient(880px 360px at 12% -8%, rgba(0,179,255,.18), transparent 62%),
    radial-gradient(760px 320px at 92% 0%, rgba(124,77,255,.18), transparent 60%),
    linear-gradient(180deg, rgba(12,18,34,.86), rgba(8,10,18,.72)) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.50), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

body.dtn-redesign-v3.page-dms .dms-top,
body.dtn-redesign-v3.page-dm-thread .dms-top,
body.dtn-redesign-v3.page-dm-compose .dms-top{
  margin:0 0 12px !important;
  padding:0 2px 12px !important;
  border-bottom:1px solid rgba(188,232,255,.10) !important;
  align-items:flex-start !important;
}

body.dtn-redesign-v3.page-dms .dms-title,
body.dtn-redesign-v3.page-dm-thread .dms-title,
body.dtn-redesign-v3.page-dm-compose .dms-title{
  font-size:clamp(24px, 2vw, 34px) !important;
  line-height:1.05 !important;
  margin:0 0 4px !important;
}

body.dtn-redesign-v3.page-dms .dms-command{
  position:sticky !important;
  top:calc(var(--dtn-site-header-height, 70px) + 6px) !important;
  z-index:18 !important;
  margin:0 0 14px !important;
  padding:10px !important;
  border-radius:18px !important;
  border:1px solid rgba(188,232,255,.14) !important;
  background:rgba(8,12,22,.78) !important;
  backdrop-filter:blur(12px) !important;
}

body.dtn-redesign-v3.page-dms .dms-command .cmd{
  min-height:34px !important;
  border-radius:12px !important;
  font-size:12px !important;
  padding:7px 10px !important;
}

body.dtn-redesign-v3.page-dms .dms-command .cmd.primary,
body.dtn-redesign-v3.page-dms #cmdNew{
  color:#10131b !important;
  background:linear-gradient(135deg, #ffe76a, #00b3ff) !important;
  border-color:rgba(255,231,106,.65) !important;
}

body.dtn-redesign-v3.page-dms .dms-command .cmd.danger,
body.dtn-redesign-v3.page-dm-thread .dms-actions .btn#btnTrash,
body.dtn-redesign-v3.page-dm-thread .dms-actions .btn#btnBlock{
  background:linear-gradient(135deg, rgba(255,61,104,.25), rgba(124,77,255,.12)) !important;
  border-color:rgba(255,83,116,.42) !important;
}

body.dtn-redesign-v3.page-dms .cmdSearchWrap{
  min-width:260px !important;
}

body.dtn-redesign-v3.page-dms .cmdSearch,
body.dtn-redesign-v3.page-dm-thread .threadSearchRow .input{
  height:38px !important;
  border-radius:14px !important;
  background:rgba(4,8,16,.60) !important;
  border:1px solid rgba(188,232,255,.16) !important;
}

body.dtn-redesign-v3.page-dms .dms-grid,
body.dtn-redesign-v3.page-dms .dms-grid.outlook,
body.dtn-redesign-v3.page-dms .dms-grid-2{
  display:grid !important;
  grid-template-columns:minmax(320px, 390px) minmax(0, 1fr) !important;
  gap:16px !important;
  align-items:start !important;
}

body.dtn-redesign-v3.page-dms .dms-list,
body.dtn-redesign-v3.page-dms .dms-reader,
body.dtn-redesign-v3.page-dm-thread .dm-thread,
body.dtn-redesign-v3.page-dm-thread .composer,
body.dtn-redesign-v3.page-dm-thread .mailCard{
  border-radius:20px !important;
  border:1px solid rgba(160,226,255,.16) !important;
  background:
    radial-gradient(720px 240px at 12% 0%, rgba(0,179,255,.09), transparent 62%),
    linear-gradient(180deg, rgba(15,20,35,.78), rgba(9,12,22,.66)) !important;
  box-shadow:0 16px 42px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

body.dtn-redesign-v3.page-dms .dms-list{
  min-height:calc(100vh - 240px) !important;
  max-height:calc(100vh - 190px) !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}

body.dtn-redesign-v3.page-dms .threads{
  overflow:auto !important;
  padding-right:4px !important;
}

body.dtn-redesign-v3.page-dms .list-hdr{
  padding:2px 4px 10px !important;
  margin:0 !important;
  border-bottom:1px solid rgba(188,232,255,.10) !important;
}

body.dtn-redesign-v3.page-dms .list-title{
  font-size:13px !important;
  color:#ffe76a !important;
  text-transform:uppercase !important;
  letter-spacing:.06em !important;
}

body.dtn-redesign-v3.page-dms .dmRow{
  border-radius:16px !important;
  padding:12px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)) !important;
  border-color:rgba(188,232,255,.11) !important;
  box-shadow:0 10px 26px rgba(0,0,0,.22) !important;
}

body.dtn-redesign-v3.page-dms .dmRow:hover,
body.dtn-redesign-v3.page-dms .dmRow.isActive,
body.dtn-redesign-v3.page-dms .dmRow.active{
  transform:translateY(-1px) !important;
  border-color:rgba(0,179,255,.36) !important;
  background:linear-gradient(135deg, rgba(0,179,255,.12), rgba(124,77,255,.08)) !important;
  box-shadow:inset 3px 0 0 rgba(255,231,106,.88), 0 14px 32px rgba(0,0,0,.32) !important;
}

body.dtn-redesign-v3.page-dms .dmWho,
body.dtn-redesign-v3.page-dms .dmSubj{
  color:#f8fdff !important;
}

body.dtn-redesign-v3.page-dms .dmSnippet,
body.dtn-redesign-v3.page-dms .dmMeta{
  color:rgba(232,244,255,.64) !important;
}

body.dtn-redesign-v3.page-dms .dms-reader{
  min-height:calc(100vh - 240px) !important;
  padding:14px !important;
}

body.dtn-redesign-v3.page-dms .readerHdr{
  padding:0 0 12px !important;
  margin-bottom:12px !important;
  border-bottom:1px solid rgba(188,232,255,.10) !important;
}

body.dtn-redesign-v3.page-dms .readerSubject{
  font-family:Orbitron, system-ui, sans-serif !important;
  font-size:18px !important;
  color:#ffe76a !important;
}

body.dtn-redesign-v3.page-dms .readerMsgs{
  max-height:calc(100vh - 470px) !important;
  overflow:auto !important;
  padding-right:4px !important;
}

body.dtn-redesign-v3.page-dms .readerReply,
body.dtn-redesign-v3.page-dms .composeForm{
  border-radius:18px !important;
  padding:12px !important;
  border:1px solid rgba(188,232,255,.12) !important;
  background:rgba(5,9,18,.50) !important;
}

body.dtn-redesign-v3.page-dms textarea,
body.dtn-redesign-v3.page-dm-thread textarea,
body.dtn-redesign-v3.page-dm-compose textarea{
  width:100% !important;
  border-radius:16px !important;
  border:1px solid rgba(188,232,255,.16) !important;
  background:rgba(4,8,16,.62) !important;
  color:#f8fdff !important;
  padding:12px !important;
}

body.dtn-redesign-v3.page-dms .readerEmpty,
body.dtn-redesign-v3.page-dms .dmsEmpty{
  min-height:320px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:18px !important;
  border:1px dashed rgba(188,232,255,.18) !important;
  background:rgba(255,255,255,.025) !important;
}

body.dtn-redesign-v3.page-dm-thread .dms-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  justify-content:flex-end !important;
}

body.dtn-redesign-v3.page-dm-thread .threadSearchRow{
  max-width:860px !important;
}

body.dtn-redesign-v3.page-dm-thread .dm-thread{
  height:calc(100vh - 270px) !important;
  min-height:560px !important;
  max-height:980px !important;
  padding:12px !important;
}

body.dtn-redesign-v3.page-dm-thread .dm-messages{
  padding:12px !important;
  gap:12px !important;
}

body.dtn-redesign-v3.page-dm-thread .mailCard{
  overflow:hidden !important;
}

body.dtn-redesign-v3.page-dm-thread .mailHdr{
  background:rgba(4,8,16,.56) !important;
  border-bottom:1px solid rgba(188,232,255,.10) !important;
}

body.dtn-redesign-v3.page-dm-thread .mailBody{
  font-size:15px !important;
  line-height:1.5 !important;
}

body.dtn-redesign-v3.page-dm-thread .composer{
  padding:12px !important;
  background:rgba(7,12,22,.84) !important;
  backdrop-filter:blur(14px) !important;
}

body.dtn-redesign-v3.page-dm-thread .composer-footer{
  gap:12px !important;
  align-items:center !important;
}

body.dtn-redesign-v3.page-dm-thread .backlink{
  display:inline-flex !important;
  align-items:center !important;
  min-height:30px !important;
  padding:5px 10px !important;
  border-radius:999px !important;
  border:1px solid rgba(188,232,255,.14) !important;
  background:rgba(255,255,255,.035) !important;
  color:rgba(232,244,255,.78) !important;
  text-decoration:none !important;
  margin-bottom:8px !important;
}

@media (max-width:980px){
  body.dtn-redesign-v3.page-dms .dms-command{
    position:relative !important;
    top:auto !important;
    flex-wrap:wrap !important;
  }
  body.dtn-redesign-v3.page-dms .cmdSearchWrap{
    flex:1 1 100% !important;
    min-width:0 !important;
  }
  body.dtn-redesign-v3.page-dms .dms-grid,
  body.dtn-redesign-v3.page-dms .dms-grid.outlook,
  body.dtn-redesign-v3.page-dms .dms-grid-2{
    grid-template-columns:1fr !important;
  }
  body.dtn-redesign-v3.page-dms .dms-list,
  body.dtn-redesign-v3.page-dms .dms-reader,
  body.dtn-redesign-v3.page-dm-thread .dm-thread{
    min-height:auto !important;
    max-height:none !important;
    height:auto !important;
  }
  body.dtn-redesign-v3.page-dms .dms-reader{
    display:block !important;
  }
  body.dtn-redesign-v3.page-dm-thread .dms-top{
    flex-direction:column !important;
  }
  body.dtn-redesign-v3.page-dm-thread .dms-actions{
    justify-content:flex-start !important;
  }
}


/* Phase 4U: preserve unread Duelist Mail highlights over global forum/mail row polish */
body.dtn-redesign-v3 .threadRow.is-unread{
  border-color:rgba(0,179,255,.64)!important;
  background:radial-gradient(420px 120px at 0% 50%, rgba(0,179,255,.26), transparent 70%), linear-gradient(135deg, rgba(0,179,255,.16), rgba(124,77,255,.12)), rgba(10,12,20,.68)!important;
  box-shadow:0 0 0 2px rgba(0,179,255,.18), 0 14px 34px rgba(0,179,255,.10)!important;
}
body.dtn-redesign-v3 .threadUnreadBadge{color:#07101b!important;background:linear-gradient(135deg,#00B3FF,#ffe76a)!important;}


/* ========================================================================
   UI Redesign Phase 5A — Tournament Visual Rebuild
   Goal: clean, modern tournament library + command center without touching
   tournament logic. This intentionally overrides older tournament decoration
   layers that caused overlap, ovals, oversized headers, and messy panels.
   ======================================================================== */

body:has(#tdList),
body:has(#tnTitle){
  --tn5-surface: rgba(8, 14, 27, .82);
  --tn5-surface-2: rgba(13, 20, 36, .90);
  --tn5-surface-3: rgba(18, 28, 48, .74);
  --tn5-line: rgba(126, 178, 255, .16);
  --tn5-line-strong: rgba(0, 179, 255, .34);
  --tn5-blue: #00B3FF;
  --tn5-violet: #7C4DFF;
  --tn5-yellow: #ffe86b;
  --tn5-text: #f4f8ff;
  --tn5-muted: #aeb9d7;
}

body:has(#tdList) .tn-shell,
body:has(#tnTitle) .tn-shell{
  width:min(1480px, calc(100vw - 44px)) !important;
  max-width:1480px !important;
  padding-top:12px !important;
}

body:has(#tdList) .tn-shell *,
body:has(#tnTitle) .tn-shell *{box-sizing:border-box !important;}

/* Kill old decorative pseudo-elements and accidental shape overlays. */
body:has(#tdList) .tn-tourCard::before,
body:has(#tdList) .tn-tourCard::after,
body:has(#tdList) .tn-card::before,
body:has(#tdList) .tn-card::after,
body:has(#tdList) .tn-directoryBar::before,
body:has(#tdList) .tn-directoryBar::after,
body:has(#tnTitle) .tn-hero::before,
body:has(#tnTitle) .tn-hero::after,
body:has(#tnTitle) .tn-card::before,
body:has(#tnTitle) .tn-card::after{
  content:none !important;
  display:none !important;
}

/* ------------------------------------------------------------------------
   Tournaments directory: modern library toolbar
   ------------------------------------------------------------------------ */
body:has(#tdList) .tn-directoryBar{
  display:grid !important;
  grid-template-columns:minmax(210px, 1fr) minmax(310px, 430px) minmax(300px, 420px) !important;
  gap:12px !important;
  align-items:end !important;
  margin:12px 0 12px !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  overflow:visible !important;
}

body:has(#tdList) .tn-directoryBarTop,
body:has(#tdList) .tn-listTabs,
body:has(#tdList) .tn-gridToolbar-compact{
  min-width:0 !important;
  border-radius:18px !important;
  background:linear-gradient(180deg, rgba(12, 18, 34, .92), rgba(6, 11, 24, .82)) !important;
  border:1px solid var(--tn5-line) !important;
  box-shadow:0 12px 28px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

body:has(#tdList) .tn-directoryBarTop{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  padding:15px 18px !important;
  min-height:74px !important;
}

body:has(#tdList) .tn-directoryTitle{
  margin:0 !important;
  font:900 clamp(24px, 2.2vw, 36px)/1 Orbitron, system-ui, sans-serif !important;
  color:var(--tn5-text) !important;
  letter-spacing:.01em !important;
  text-shadow:0 0 18px rgba(0,179,255,.16) !important;
}

body:has(#tdList) .tn-directorySub{
  margin:6px 0 0 !important;
  color:var(--tn5-muted) !important;
  font-size:13px !important;
  line-height:1.25 !important;
}

body:has(#tdList) .tn-listTabs{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:6px !important;
  padding:7px !important;
  min-height:74px !important;
  align-items:center !important;
}

body:has(#tdList) .tn-listTabs .tn-tab,
body:has(#tdList) .tn-directoryBar .tn-tab{
  width:100% !important;
  justify-content:center !important;
  min-height:40px !important;
  padding:8px 10px !important;
  border-radius:12px !important;
  font:900 12px/1.1 Atkinson Hyperlegible, system-ui, sans-serif !important;
  letter-spacing:.02em !important;
  color:#eaf4ff !important;
  background:rgba(255,255,255,.045) !important;
  border:1px solid rgba(255,255,255,.11) !important;
  box-shadow:none !important;
}

body:has(#tdList) .tn-listTabs .tn-tab.is-active,
body:has(#tdList) .tn-directoryBar .tn-tab.is-active{
  background:linear-gradient(135deg, rgba(0,179,255,.30), rgba(124,77,255,.28)) !important;
  border-color:rgba(0,179,255,.55) !important;
  color:#fff !important;
  box-shadow:0 0 0 2px rgba(0,179,255,.12), 0 8px 20px rgba(0,0,0,.20) !important;
}

body:has(#tdList) .tn-gridToolbar-compact{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  min-height:74px !important;
  padding:12px !important;
  align-items:end !important;
}

body:has(#tdList) .tn-gridToolbar-compact label{min-width:0 !important;}
body:has(#tdList) .tn-labelMuted{
  display:block !important;
  margin:0 0 5px !important;
  font:900 10px/1 Orbitron, system-ui, sans-serif !important;
  letter-spacing:.09em !important;
  color:#d5dbf4 !important;
}
body:has(#tdList) .tn-gridToolbar-compact .tn-input,
body:has(#tdList) .tn-gridToolbar-compact select{
  width:100% !important;
  max-width:100% !important;
  min-height:34px !important;
  padding:7px 10px !important;
  border-radius:11px !important;
  background:#070d18 !important;
  border:1px solid rgba(255,255,255,.13) !important;
  color:#f6f9ff !important;
}

/* Organizer hub becomes a compact staff utility strip. */
body:has(#tdList) #tdStaffHub{
  display:block !important;
  margin:10px 0 12px !important;
  padding:12px 14px !important;
  border-radius:18px !important;
  background:linear-gradient(135deg, rgba(10,16,31,.82), rgba(13,20,38,.72)) !important;
  border:1px solid rgba(255,232,107,.16) !important;
  box-shadow:0 10px 22px rgba(0,0,0,.18) !important;
}
body:has(#tdList) #tdStaffHub[hidden]{display:none !important;}
body:has(#tdList) #tdStaffHub .tn-cardHead{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:center !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
body:has(#tdList) #tdStaffHub .tn-cardTitle{
  margin:0 !important;
  font:900 17px/1.1 Orbitron, system-ui, sans-serif !important;
  color:var(--tn5-yellow) !important;
}
body:has(#tdList) #tdStaffHub .tn-cardSub{
  margin:4px 0 0 !important;
  color:var(--tn5-muted) !important;
  font-size:12.5px !important;
}
body:has(#tdList) #tdStaffHub .tn-inlineNote{
  margin:9px 0 0 !important;
  padding:8px 10px !important;
  border-radius:12px !important;
  background:rgba(0,179,255,.06) !important;
  border:1px solid rgba(0,179,255,.14) !important;
  color:#cbd8f7 !important;
  font-size:12.5px !important;
}

/* Tournament event library cards. */
body:has(#tdList) #tdList.tn-cardGrid,
body:has(#tdList) .tn-cardGrid{
  display:grid !important;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 590px), 1fr)) !important;
  gap:14px !important;
  margin-top:14px !important;
  padding:0 !important;
  overflow:visible !important;
  max-height:none !important;
}

body:has(#tdList) .tn-tourCard{
  position:relative !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  grid-template-areas:
    "title"
    "desc"
    "meta"
    "footer" !important;
  gap:0 !important;
  min-width:0 !important;
  min-height:190px !important;
  padding:17px 18px 16px 22px !important;
  border-radius:22px !important;
  overflow:hidden !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(0,179,255,.16), transparent 34%),
    linear-gradient(145deg, rgba(11,20,36,.94), rgba(17,26,49,.82) 55%, rgba(9,16,31,.90)) !important;
  border:1px solid rgba(0,179,255,.23) !important;
  box-shadow:0 14px 36px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04) !important;
  transform:none !important;
}
body:has(#tdList) .tn-tourCard::marker{display:none !important;}
body:has(#tdList) .tn-tourCard > *{min-width:0 !important;}
body:has(#tdList) .tn-tourCard:hover{
  transform:translateY(-2px) !important;
  border-color:rgba(0,179,255,.52) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.35), 0 0 0 1px rgba(124,77,255,.16) !important;
}
body:has(#tdList) .tn-tourCard:before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:0 auto 0 0 !important;
  width:5px !important;
  border-radius:22px 0 0 22px !important;
  background:linear-gradient(180deg, var(--tn5-blue), var(--tn5-violet)) !important;
}
body:has(#tdList) .tn-tourCard:after{content:none !important;display:none !important;}
body:has(#tdList) .tn-tourTitle{
  grid-area:title !important;
  margin:0 !important;
  max-width:100% !important;
  font:900 clamp(18px, 1.35vw, 25px)/1.08 Orbitron, system-ui, sans-serif !important;
  color:#ffffff !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  text-shadow:0 0 12px rgba(0,179,255,.14) !important;
}
body:has(#tdList) .tn-tourDesc{
  grid-area:desc !important;
  margin:7px 0 0 !important;
  min-height:34px !important;
  color:#c8d4f1 !important;
  font-size:13.5px !important;
  line-height:1.35 !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
body:has(#tdList) .tn-tourMeta{
  grid-area:meta !important;
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  margin:12px 0 0 !important;
}
body:has(#tdList) .tn-pill,
body:has(#tdList) .tn-tourMeta .tn-pill{
  display:inline-flex !important;
  align-items:center !important;
  min-height:24px !important;
  padding:4px 8px !important;
  border-radius:999px !important;
  font:900 10.5px/1 Atkinson Hyperlegible, system-ui, sans-serif !important;
  background:rgba(255,255,255,.055) !important;
  color:#edf6ff !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:none !important;
}
body:has(#tdList) .tn-pill.ok{background:rgba(29,209,161,.12) !important;border-color:rgba(29,209,161,.40) !important;color:#d3fff2 !important;}
body:has(#tdList) .tn-pill.warn{background:rgba(255,232,107,.13) !important;border-color:rgba(255,232,107,.40) !important;color:#fff6c9 !important;}
body:has(#tdList) .tn-pill.info{background:rgba(0,179,255,.11) !important;border-color:rgba(0,179,255,.36) !important;color:#e0f8ff !important;}
body:has(#tdList) .tn-pill.bad{background:rgba(255,77,109,.13) !important;border-color:rgba(255,77,109,.38) !important;color:#ffd8e1 !important;}
body:has(#tdList) .tn-tourFooter{
  grid-area:footer !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0,1fr)) auto !important;
  gap:8px !important;
  align-items:end !important;
  justify-content:stretch !important;
  margin:14px 0 0 !important;
  padding:12px 0 0 !important;
  border-top:1px solid rgba(255,255,255,.075) !important;
}
body:has(#tdList) .tn-kv{
  display:block !important;
  min-width:0 !important;
  padding:8px 9px !important;
  border-radius:13px !important;
  background:rgba(0,0,0,.20) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  color:var(--tn5-muted) !important;
}
body:has(#tdList) .tn-kv span{
  display:block !important;
  margin:0 0 4px !important;
  font:900 9.5px/1 Orbitron, system-ui, sans-serif !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:#b8c5e4 !important;
}
body:has(#tdList) .tn-kv strong{
  display:block !important;
  font:900 12.5px/1.1 Atkinson Hyperlegible, system-ui, sans-serif !important;
  color:#fff !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
body:has(#tdList) .tn-tourFooter .tn-actions{
  display:flex !important;
  align-items:end !important;
  justify-content:flex-end !important;
  margin:0 !important;
}
body:has(#tdList) .tn-tourFooter .tn-btn{
  min-height:39px !important;
  border-radius:13px !important;
  padding:9px 13px !important;
  white-space:nowrap !important;
  font:900 12px/1 Atkinson Hyperlegible, system-ui, sans-serif !important;
}

/* ------------------------------------------------------------------------
   Single tournament page: cleaner command center
   ------------------------------------------------------------------------ */
body:has(#tnTitle) .tn-backLink{
  margin:8px 0 10px !important;
  min-height:34px !important;
  padding:7px 12px !important;
  border-radius:12px !important;
  font-size:12px !important;
}
body:has(#tnTitle) .tn-hero{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) minmax(420px, 520px) !important;
  gap:14px !important;
  align-items:stretch !important;
  margin:0 0 14px !important;
  padding:18px !important;
  border-radius:24px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(0,179,255,.18), transparent 30%),
    linear-gradient(145deg, rgba(10,17,31,.94), rgba(17,24,47,.82) 62%, rgba(8,13,27,.94)) !important;
  border:1px solid rgba(0,179,255,.23) !important;
  box-shadow:0 18px 44px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.04) !important;
  overflow:hidden !important;
}
body:has(#tnTitle) .tn-heroCopy{
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
body:has(#tnTitle) .tn-eyebrow{
  align-self:flex-start !important;
  padding:5px 9px !important;
  border-radius:999px !important;
  background:rgba(255,232,107,.09) !important;
  border:1px solid rgba(255,232,107,.28) !important;
  color:var(--tn5-yellow) !important;
  font:900 10px/1 Orbitron, system-ui, sans-serif !important;
  letter-spacing:.09em !important;
}
body:has(#tnTitle) .tn-title{
  margin:9px 0 6px !important;
  font:900 clamp(30px, 3vw, 46px)/1.02 Orbitron, system-ui, sans-serif !important;
  color:var(--tn5-yellow) !important;
  text-shadow:0 0 20px rgba(255,232,107,.12) !important;
}
body:has(#tnTitle) .tn-sub{
  margin:0 !important;
  max-width:940px !important;
  color:#c9d5ef !important;
  font-size:14px !important;
  line-height:1.45 !important;
}
body:has(#tnTitle) .tn-pillRow{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  margin-top:12px !important;
}
body:has(#tnTitle) .tn-pillRow .tn-pill{
  min-height:24px !important;
  padding:4px 8px !important;
  font-size:10.5px !important;
}
body:has(#tnTitle) .tn-statGrid{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  gap:10px !important;
  min-width:0 !important;
}
body:has(#tnTitle) .tn-stat{
  min-width:0 !important;
  min-height:86px !important;
  padding:14px !important;
  border-radius:18px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)) !important;
  border:1px solid rgba(255,255,255,.105) !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
body:has(#tnTitle) .tn-statLabel{
  font:900 10px/1 Orbitron, system-ui, sans-serif !important;
  letter-spacing:.08em !important;
  color:#b9c7e6 !important;
  text-transform:uppercase !important;
}
body:has(#tnTitle) .tn-statValue{
  margin-top:7px !important;
  font:900 clamp(18px, 1.8vw, 25px)/1.08 Atkinson Hyperlegible, system-ui, sans-serif !important;
  color:#fff !important;
  word-break:break-word !important;
}
body:has(#tnTitle) .tn-statValue-sm{font-size:14px !important;}

body:has(#tnTitle) .tn-workspace{
  display:grid !important;
  grid-template-columns:230px minmax(0,1fr) !important;
  gap:14px !important;
  align-items:start !important;
  margin-top:0 !important;
}
body:has(#tnTitle) .tn-navRail{
  position:sticky !important;
  top:86px !important;
  align-self:start !important;
  min-width:0 !important;
}
body:has(#tnTitle) .tn-tabs-rail{
  display:grid !important;
  gap:7px !important;
  margin:0 !important;
  padding:10px !important;
  border-radius:20px !important;
  background:linear-gradient(180deg, rgba(9,15,29,.90), rgba(6,10,22,.86)) !important;
  border:1px solid rgba(0,179,255,.20) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.25) !important;
}
body:has(#tnTitle) .tn-tabs-rail .tn-tab{
  width:100% !important;
  justify-content:flex-start !important;
  text-align:left !important;
  min-height:40px !important;
  padding:9px 11px !important;
  border-radius:13px !important;
  font:900 12px/1.15 Atkinson Hyperlegible, system-ui, sans-serif !important;
  color:#f0f6ff !important;
  background:rgba(255,255,255,.045) !important;
  border:1px solid rgba(255,255,255,.10) !important;
}
body:has(#tnTitle) .tn-tabs-rail .tn-tab.is-active{
  background:linear-gradient(135deg, rgba(0,179,255,.26), rgba(124,77,255,.22)) !important;
  border-color:rgba(0,179,255,.52) !important;
  box-shadow:0 0 0 2px rgba(0,179,255,.11) !important;
}
body:has(#tnTitle) .tn-tabs-rail .tn-tab-action.is-accent,
body:has(#tnTitle) #tnOpenEntryFab{
  background:linear-gradient(135deg, rgba(0,179,255,.42), rgba(124,77,255,.32)) !important;
  border-color:rgba(0,179,255,.62) !important;
  color:#fff !important;
}
body:has(#tnTitle) .tn-tabs-rail .tn-tab-action-secondary{
  background:rgba(124,77,255,.12) !important;
  border-color:rgba(124,77,255,.35) !important;
}
body:has(#tnTitle) .tn-railDivider{
  height:1px !important;
  margin:3px 0 !important;
  background:rgba(255,255,255,.10) !important;
}
body:has(#tnTitle) .tn-mainColumn,
body:has(#tnTitle) .tn-section,
body:has(#tnTitle) .tn-twoCol,
body:has(#tnTitle) .tn-card{min-width:0 !important;}
body:has(#tnTitle) .tn-section{display:none !important;}
body:has(#tnTitle) .tn-section.is-active{display:block !important;}
body:has(#tnTitle) .tn-twoCol,
body:has(#tnTitle) .tn-participantsLayout,
body:has(#tnTitle) .tn-participantsLayout-single{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:14px !important;
  margin-top:0 !important;
  align-items:start !important;
}
body:has(#tnTitle) .tn-card,
body:has(#tnTitle) .tn-roundBoard,
body:has(#tnTitle) .tn-pairingCard,
body:has(#tnTitle) .tn-pairingCardSlim,
body:has(#tnTitle) .tn-rosterCard,
body:has(#tnTitle) .tn-toolBlock,
body:has(#tnTitle) .tn-adminSettingsPanel,
body:has(#tnTitle) .tn-entryBox,
body:has(#tnTitle) .tn-block{
  border-radius:20px !important;
  background:linear-gradient(180deg, rgba(12,18,34,.90), rgba(7,11,22,.82)) !important;
  border:1px solid rgba(0,179,255,.17) !important;
  box-shadow:0 14px 32px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
body:has(#tnTitle) .tn-card{
  padding:16px !important;
  margin-top:0 !important;
}
body:has(#tnTitle) .tn-cardHead{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin:0 0 14px !important;
  padding:0 0 12px !important;
  border-bottom:1px solid rgba(255,255,255,.075) !important;
}
body:has(#tnTitle) .tn-cardTitle{
  margin:0 !important;
  font:900 clamp(20px,1.9vw,28px)/1.05 Orbitron, system-ui, sans-serif !important;
  color:#f8fbff !important;
  text-shadow:0 0 12px rgba(0,179,255,.12) !important;
}
body:has(#tnTitle) .tn-cardSub{
  margin:5px 0 0 !important;
  color:#aeb9d7 !important;
  font-size:13px !important;
  line-height:1.4 !important;
}
body:has(#tnTitle) .tn-btn,
body:has(#tnTitle) .tn-tab{
  min-height:38px !important;
  border-radius:13px !important;
  padding:9px 12px !important;
  font:900 12px/1 Atkinson Hyperlegible, system-ui, sans-serif !important;
}
body:has(#tnTitle) .tn-btn:not(.tn-btn-ghost):not(.tn-btn-danger){
  background:linear-gradient(135deg, rgba(0,179,255,.30), rgba(124,77,255,.26)) !important;
  border-color:rgba(0,179,255,.50) !important;
}
body:has(#tnTitle) .tn-btn-ghost{
  background:rgba(255,255,255,.045) !important;
  border-color:rgba(255,255,255,.13) !important;
}
body:has(#tnTitle) .tn-btn-danger,
body:has(#tnTitle) #tnAdminSettingsDangerPanel .tn-btn:not(.tn-btn-ghost){
  background:rgba(255,77,109,.15) !important;
  border-color:rgba(255,77,109,.38) !important;
}

/* Pairings, standings, admin tools: smaller, cleaner, no overlap. */
body:has(#tnTitle) .tn-roundBoard{padding:14px !important;margin-top:12px !important;}
body:has(#tnTitle) .tn-roundTitle{margin:0 0 10px !important;font:900 19px/1.1 Orbitron, system-ui, sans-serif !important;color:#fff3a6 !important;}
body:has(#tnTitle) .tn-roundPairingsGrid{display:grid !important;grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)) !important;gap:10px !important;}
body:has(#tnTitle) .tn-pairingCard,
body:has(#tnTitle) .tn-pairingCardSlim{padding:12px !important;border-radius:17px !important;}
body:has(#tnTitle) .tn-pairingVs{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important;gap:10px !important;}
body:has(#tnTitle) .tn-versus{font-size:15px !important;color:#dbe9ff !important;}
body:has(#tnTitle) .tn-tableWrap{border-radius:18px !important;overflow:auto !important;background:rgba(0,0,0,.16) !important;border:1px solid rgba(255,255,255,.08) !important;}
body:has(#tnTitle) .tn-table{min-width:760px !important;}
body:has(#tnTitle) .tn-table th,
body:has(#tnTitle) .tn-table td{padding:10px 11px !important;}
body:has(#tnTitle) .tn-table thead th{background:rgba(8,12,22,.96) !important;color:#dbe9ff !important;}
body:has(#tnTitle) #tnSettingsPanel,
body:has(#tnTitle) #tnParticipantToolsMount,
body:has(#tnTitle) #tnPairingToolsMount,
body:has(#tnTitle) #tnBreakdownPanel,
body:has(#tnTitle) #tnDangerZone{min-width:0 !important;}
body:has(#tnTitle) .tn-settingsGrid,
body:has(#tnTitle) .tn-grid2,
body:has(#tnTitle) .tn-toolbarControlGrid{
  display:grid !important;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap:11px !important;
}
body:has(#tnTitle) .tn-input,
body:has(#tnTitle) .tn-textarea,
body:has(#tnTitle) select{
  max-width:100% !important;
  min-height:38px !important;
  border-radius:12px !important;
  background:#070d18 !important;
  border:1px solid rgba(255,255,255,.13) !important;
  color:#f6f9ff !important;
}
body:has(#tnTitle) .tn-clockSettingsMount:empty{display:none !important;}
body:has(#tnTitle) #tnAdminSettingsDangerPanel{
  margin-top:14px !important;
  background:rgba(255,77,109,.06) !important;
  border-color:rgba(255,77,109,.30) !important;
}

/* Keep hidden rails hidden; old CSS occasionally made hidden containers occupy space. */
body:has(#tnTitle) .tn-entryRail-hidden,
body:has(#tnTitle) [hidden]{display:none !important;}

@media (max-width:1180px){
  body:has(#tdList) .tn-directoryBar{grid-template-columns:1fr !important;}
  body:has(#tdList) .tn-directoryBarTop,
  body:has(#tdList) .tn-listTabs,
  body:has(#tdList) .tn-gridToolbar-compact{min-height:0 !important;}
  body:has(#tdList) #tdList.tn-cardGrid{grid-template-columns:1fr !important;}
  body:has(#tnTitle) .tn-hero{grid-template-columns:1fr !important;}
  body:has(#tnTitle) .tn-workspace{grid-template-columns:200px minmax(0,1fr) !important;}
}
@media (max-width:820px){
  body:has(#tdList) .tn-shell,
  body:has(#tnTitle) .tn-shell{width:calc(100vw - 18px) !important;}
  body:has(#tdList) .tn-gridToolbar-compact{grid-template-columns:1fr !important;}
  body:has(#tdList) .tn-tourFooter{grid-template-columns:1fr 1fr !important;}
  body:has(#tdList) .tn-tourFooter .tn-actions{grid-column:1/-1 !important;justify-content:stretch !important;}
  body:has(#tdList) .tn-tourFooter .tn-btn{width:100% !important;}
  body:has(#tnTitle) .tn-statGrid{grid-template-columns:1fr 1fr !important;}
  body:has(#tnTitle) .tn-workspace{grid-template-columns:1fr !important;}
  body:has(#tnTitle) .tn-navRail{position:static !important;top:auto !important;}
  body:has(#tnTitle) .tn-tabs-rail{display:flex !important;overflow:auto !important;}
  body:has(#tnTitle) .tn-tabs-rail .tn-tab{white-space:nowrap !important;justify-content:center !important;text-align:center !important;}
  body:has(#tnTitle) .tn-cardHead{flex-direction:column !important;align-items:flex-start !important;}
  body:has(#tnTitle) .tn-roundPairingsGrid{grid-template-columns:1fr !important;}
}
@media (max-width:560px){
  body:has(#tdList) .tn-listTabs{grid-template-columns:1fr !important;}
  body:has(#tnTitle) .tn-statGrid{grid-template-columns:1fr !important;}
}

/* === DTN Phase 5B: Tournament Cleanup + Compact Event Library === */
body:has(#tdList) .tn-shell,
body:has(#tnTitle) .tn-shell{
  max-width:1440px !important;
  width:min(1440px, calc(100vw - 34px)) !important;
  margin:14px auto 40px !important;
  padding:0 !important;
}

body:has(#tdList) .tn-directoryBar,
body:has(#tdList) #tdStaffHub,
body:has(#tdList) #tdList,
body:has(#tnTitle) .tn-hero,
body:has(#tnTitle) .tn-workspace .tn-card,
body:has(#tnTitle) .tn-navRail,
body:has(#tnTitle) .tn-tabs-rail{
  box-sizing:border-box !important;
}

body:has(#tdList) .tn-directoryBar::before,
body:has(#tdList) .tn-directoryBar::after,
body:has(#tdList) .tn-tourCard::before,
body:has(#tdList) .tn-tourCard::after,
body:has(#tnTitle) .tn-hero::before,
body:has(#tnTitle) .tn-hero::after,
body:has(#tnTitle) .tn-card::before,
body:has(#tnTitle) .tn-card::after{
  content:none !important;
  display:none !important;
}

body:has(#tdList) .tn-directoryBar{
  display:grid !important;
  grid-template-columns:minmax(240px, 1fr) auto auto !important;
  align-items:center !important;
  gap:14px !important;
  padding:14px 16px !important;
  border-radius:20px !important;
  background:linear-gradient(135deg, rgba(8,14,28,.92), rgba(17,18,40,.86)) !important;
  border:1px solid rgba(0,179,255,.22) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
  overflow:visible !important;
}
body:has(#tdList) .tn-directoryBarTop{display:block !important;min-width:0 !important;}
body:has(#tdList) .tn-directoryTitle{
  margin:0 !important;
  font-size:clamp(30px, 3.4vw, 46px) !important;
  line-height:1 !important;
  letter-spacing:.035em !important;
  color:#eaf7ff !important;
  text-shadow:0 0 18px rgba(0,179,255,.16) !important;
}
body:has(#tdList) .tn-directorySub{margin:6px 0 0 !important;font-size:13px !important;color:#b7c5dc !important;}
body:has(#tdList) .tn-gridToolbar{display:none !important;}
body:has(#tdList) .tn-listTabs{
  display:flex !important;
  gap:8px !important;
  margin:0 !important;
  padding:6px !important;
  border:1px solid rgba(255,255,255,.09) !important;
  border-radius:16px !important;
  background:rgba(0,0,0,.22) !important;
  min-width:0 !important;
}
body:has(#tdList) .tn-listTabs .tn-tab{
  min-width:112px !important;
  min-height:38px !important;
  padding:9px 12px !important;
  border-radius:12px !important;
  font-size:12px !important;
  justify-content:center !important;
  background:rgba(14,25,48,.82) !important;
  border-color:rgba(255,255,255,.12) !important;
  color:#dbe7ff !important;
}
body:has(#tdList) .tn-listTabs .tn-tab.is-active{
  background:linear-gradient(135deg, rgba(0,179,255,.42), rgba(124,77,255,.35)) !important;
  border-color:rgba(0,179,255,.55) !important;
  color:#fff !important;
}
.tn-directoryLinks,
.tn-heroLinks{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  min-width:0 !important;
}
.tn-miniLink{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:34px !important;
  padding:8px 11px !important;
  border-radius:12px !important;
  border:1px solid rgba(0,179,255,.28) !important;
  background:linear-gradient(135deg, rgba(0,179,255,.18), rgba(124,77,255,.16)) !important;
  color:#eaf7ff !important;
  text-decoration:none !important;
  font-weight:900 !important;
  font-size:12px !important;
  white-space:nowrap !important;
}
.tn-miniLink:hover{transform:translateY(-1px);border-color:rgba(255,221,74,.45)!important;color:#ffef8a!important;}

body:has(#tdList) #tdStaffHub{
  margin-top:12px !important;
  padding:12px 14px !important;
  border-radius:18px !important;
  background:rgba(8,14,28,.75) !important;
  border:1px solid rgba(255,221,74,.18) !important;
}
body:has(#tdList) #tdStaffHub .tn-cardHead{display:flex !important;align-items:center !important;justify-content:space-between !important;gap:12px !important;margin:0 !important;}
body:has(#tdList) #tdStaffHub .tn-cardTitle{font-size:16px !important;margin:0 !important;}
body:has(#tdList) #tdStaffHub .tn-cardSub{font-size:12px !important;margin:3px 0 0 !important;}
body:has(#tdList) #tdStaffHub .tn-inlineNote{margin-top:8px !important;padding:8px 10px !important;font-size:12px !important;}

body:has(#tdList) .tn-cardGrid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  margin-top:14px !important;
  max-height:none !important;
  overflow:visible !important;
  padding:0 !important;
}
body:has(#tdList) .tn-tourCard{
  position:relative !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(300px, 370px) auto !important;
  align-items:center !important;
  gap:14px !important;
  min-height:116px !important;
  padding:13px 14px 13px 18px !important;
  border-radius:18px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.11) !important;
  background:linear-gradient(135deg, rgba(11,18,34,.92), rgba(17,20,44,.84)) !important;
  box-shadow:0 12px 34px rgba(0,0,0,.24) !important;
}
body:has(#tdList) .tn-tourCard-community{
  border-left:5px solid #00b3ff !important;
  background:linear-gradient(135deg, rgba(0,179,255,.14), rgba(10,18,36,.92) 34%, rgba(16,22,48,.88)) !important;
}
body:has(#tdList) .tn-tourCard-dueltainer{
  border-left:5px solid #ffdd4a !important;
  background:linear-gradient(135deg, rgba(255,221,74,.15), rgba(73,45,148,.20) 36%, rgba(11,18,34,.92)) !important;
}
body:has(#tdList) .tn-tourCard:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(0,179,255,.38) !important;
  box-shadow:0 16px 40px rgba(0,0,0,.30), 0 0 24px rgba(0,179,255,.12) !important;
}
body:has(#tdList) .tn-tourMain{min-width:0 !important;}
body:has(#tdList) .tn-tourKicker{
  margin-bottom:4px !important;
  font-family:Orbitron, sans-serif !important;
  font-size:10px !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
  color:#ffef8a !important;
}
body:has(#tdList) .tn-tourCard-community .tn-tourKicker{color:#80e9ff !important;}
body:has(#tdList) .tn-tourTitle{
  margin:0 !important;
  font-size:clamp(18px, 1.5vw, 24px) !important;
  line-height:1.08 !important;
  color:#fff !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  max-width:100% !important;
}
body:has(#tdList) .tn-tourDesc{
  margin:6px 0 0 !important;
  font-size:13px !important;
  line-height:1.3 !important;
  color:#cbd6ea !important;
  max-height:2.7em !important;
  overflow:hidden !important;
}
body:has(#tdList) .tn-tourMeta{display:flex !important;flex-wrap:wrap !important;gap:5px !important;margin-top:8px !important;}
body:has(#tdList) .tn-tourMeta .tn-pill{padding:4px 8px !important;font-size:10px !important;line-height:1.1 !important;}
body:has(#tdList) .tn-tourFacts{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(84px,1fr)) !important;
  gap:8px !important;
  align-items:stretch !important;
  min-width:0 !important;
}
body:has(#tdList) .tn-kv{
  min-width:0 !important;
  padding:8px 9px !important;
  border-radius:12px !important;
  background:rgba(0,0,0,.18) !important;
  border:1px solid rgba(255,255,255,.08) !important;
}
body:has(#tdList) .tn-kv span{display:block !important;font-size:9px !important;letter-spacing:.09em !important;text-transform:uppercase !important;color:#aebbd3 !important;}
body:has(#tdList) .tn-kv strong{display:block !important;margin-top:3px !important;font-size:13px !important;color:#fff !important;white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;}
body:has(#tdList) .tn-tourOpen .tn-btn{min-height:38px !important;padding:9px 13px !important;border-radius:12px !important;font-size:12px !important;white-space:nowrap !important;}

/* Single tournament command center compact rebuild */
body:has(#tnTitle) .tn-backLink{margin:0 0 10px !important;min-height:36px !important;padding:8px 12px !important;border-radius:12px !important;}
body:has(#tnTitle) .tn-hero{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(360px, 480px) !important;
  gap:14px !important;
  align-items:center !important;
  padding:16px !important;
  border-radius:20px !important;
  background:linear-gradient(135deg, rgba(8,14,28,.92), rgba(20,22,50,.82)) !important;
  border:1px solid rgba(0,179,255,.24) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.28) !important;
  overflow:hidden !important;
}
body:has(#tnTitle) .tn-eyebrow{font-size:10px !important;letter-spacing:.12em !important;color:#ffef8a !important;}
body:has(#tnTitle) .tn-title{font-size:clamp(28px, 3vw, 44px) !important;line-height:1 !important;margin:5px 0 6px !important;color:#fff !important;}
body:has(#tnTitle) .tn-sub{font-size:13px !important;line-height:1.35 !important;color:#cbd6ea !important;max-width:900px !important;margin:0 !important;}
body:has(#tnTitle) .tn-pillRow{margin-top:10px !important;gap:6px !important;}
body:has(#tnTitle) .tn-heroLinks{justify-content:flex-start !important;margin-top:8px !important;}
body:has(#tnTitle) .tn-statGrid{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:8px !important;}
body:has(#tnTitle) .tn-stat{padding:11px !important;border-radius:14px !important;background:rgba(0,0,0,.18) !important;border:1px solid rgba(255,255,255,.09) !important;min-height:82px !important;}
body:has(#tnTitle) .tn-statLabel{font-size:10px !important;letter-spacing:.1em !important;color:#aebbd3 !important;}
body:has(#tnTitle) .tn-statValue{font-size:22px !important;line-height:1.05 !important;color:#ffef8a !important;}
body:has(#tnTitle) .tn-statValue-sm{font-size:17px !important;}
body:has(#tnTitle) .tn-workspace{
  display:grid !important;
  grid-template-columns:210px minmax(0,1fr) !important;
  gap:12px !important;
  margin-top:12px !important;
  align-items:start !important;
}
body:has(#tnTitle) .tn-navRail{position:sticky !important;top:84px !important;}
body:has(#tnTitle) .tn-tabs-rail{
  display:grid !important;
  gap:7px !important;
  padding:10px !important;
  border-radius:18px !important;
  background:rgba(8,14,28,.86) !important;
  border:1px solid rgba(0,179,255,.18) !important;
  box-shadow:0 14px 32px rgba(0,0,0,.22) !important;
}
body:has(#tnTitle) .tn-tabs-rail .tn-tab{
  min-height:38px !important;
  justify-content:flex-start !important;
  text-align:left !important;
  padding:9px 10px !important;
  border-radius:12px !important;
  font-size:12px !important;
  background:rgba(16,28,54,.70) !important;
  border-color:rgba(255,255,255,.10) !important;
}
body:has(#tnTitle) .tn-tabs-rail .tn-tab.is-active{background:rgba(0,179,255,.18) !important;border-color:rgba(0,179,255,.44) !important;color:#fff !important;}
body:has(#tnTitle) .tn-tabs-rail .tn-tab-action.is-accent{background:linear-gradient(135deg, rgba(0,179,255,.65), rgba(124,77,255,.48)) !important;border-color:rgba(0,179,255,.70) !important;color:#fff !important;}
body:has(#tnTitle) .tn-tabs-rail .tn-tab-action-secondary{background:rgba(255,221,74,.12) !important;border-color:rgba(255,221,74,.26) !important;color:#ffef8a !important;}
body:has(#tnTitle) .tn-mainColumn{min-width:0 !important;}
body:has(#tnTitle) .tn-mainColumn .tn-card{padding:14px !important;border-radius:20px !important;background:rgba(8,14,28,.82) !important;border:1px solid rgba(0,179,255,.15) !important;box-shadow:0 14px 36px rgba(0,0,0,.20) !important;}
body:has(#tnTitle) .tn-cardHead{gap:10px !important;margin-bottom:10px !important;}
body:has(#tnTitle) .tn-cardTitle{font-size:clamp(20px, 1.9vw, 28px) !important;line-height:1.05 !important;}
body:has(#tnTitle) .tn-cardSub{font-size:13px !important;line-height:1.35 !important;color:#b9c5da !important;}
body:has(#tnTitle) .tn-twoCol{grid-template-columns:minmax(0,1fr) !important;gap:12px !important;}
body:has(#tnTitle) .tn-entryRail{display:none !important;}
body:has(#tnTitle) .tn-adminSettingsPanel,
body:has(#tnTitle) .tn-toolBlock,
body:has(#tnTitle) .tn-toolbarGroup{border-radius:16px !important;background:rgba(0,0,0,.18) !important;border:1px solid rgba(255,255,255,.08) !important;padding:12px !important;margin-top:10px !important;}

/* Tournament deck picker dropdown */
.tn-entryDeckDropdownBox{padding:12px !important;}
.tn-deckPickerWrap{position:relative !important;margin-top:10px !important;}
.tn-nativeDeckSelect{position:absolute !important;opacity:0 !important;pointer-events:none !important;width:1px !important;height:1px !important;}
.tn-deckPicker{position:relative !important;}
.tn-deckPickerToggle{
  width:100% !important;
  min-height:70px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  padding:9px 10px !important;
  border-radius:14px !important;
  border:1px solid rgba(0,179,255,.28) !important;
  background:linear-gradient(135deg, rgba(0,179,255,.12), rgba(124,77,255,.10), rgba(0,0,0,.18)) !important;
  color:#fff !important;
  cursor:pointer !important;
  text-align:left !important;
}
.tn-deckPickerToggle:hover{border-color:rgba(255,221,74,.42)!important;}
.tn-deckPickerSelected,
.tn-deckPickerOptionInner{display:flex !important;align-items:center !important;gap:10px !important;min-width:0 !important;}
.tn-deckPickerText{display:flex !important;flex-direction:column !important;min-width:0 !important;gap:3px !important;}
.tn-deckPickerText strong{font-size:14px !important;color:#fff !important;white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;}
.tn-deckPickerText small{font-size:11px !important;color:#aebbd3 !important;white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;}
.tn-deckPickerThumb{width:42px !important;height:58px !important;flex:0 0 42px !important;border-radius:6px !important;object-fit:contain !important;background:rgba(0,0,0,.28) !important;border:1px solid rgba(255,255,255,.14) !important;}
.tn-deckPickerThumbFallback{display:inline-flex !important;align-items:center !important;justify-content:center !important;font-weight:900 !important;color:#ffef8a !important;}
.tn-deckPickerEmpty{color:#b9c5da !important;font-weight:900 !important;}
.tn-deckPickerChevron{flex:0 0 auto !important;color:#ffef8a !important;font-size:16px !important;}
.tn-deckPickerMenu{
  position:absolute !important;
  z-index:80 !important;
  top:calc(100% + 6px) !important;
  left:0 !important;
  right:0 !important;
  max-height:320px !important;
  overflow:auto !important;
  padding:8px !important;
  border-radius:16px !important;
  background:rgba(5,10,22,.98) !important;
  border:1px solid rgba(0,179,255,.34) !important;
  box-shadow:0 24px 60px rgba(0,0,0,.48), 0 0 28px rgba(0,179,255,.15) !important;
}
.tn-deckPickerOption{
  width:100% !important;
  display:block !important;
  padding:8px !important;
  border-radius:12px !important;
  border:1px solid transparent !important;
  background:transparent !important;
  color:#fff !important;
  cursor:pointer !important;
  text-align:left !important;
}
.tn-deckPickerOption:hover,
.tn-deckPickerOption.is-selected{background:rgba(0,179,255,.12)!important;border-color:rgba(0,179,255,.32)!important;}
.tn-empty-compact{padding:12px !important;font-size:13px !important;}

@media (max-width:1100px){
  body:has(#tdList) .tn-directoryBar{grid-template-columns:1fr !important;align-items:stretch !important;}
  body:has(#tdList) .tn-directoryLinks{justify-content:flex-start !important;}
  body:has(#tdList) .tn-tourCard{grid-template-columns:1fr !important;align-items:start !important;}
  body:has(#tdList) .tn-tourFacts{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  body:has(#tdList) .tn-tourOpen .tn-btn{width:100% !important;}
  body:has(#tnTitle) .tn-hero{grid-template-columns:1fr !important;}
  body:has(#tnTitle) .tn-workspace{grid-template-columns:1fr !important;}
  body:has(#tnTitle) .tn-navRail{position:static !important;}
  body:has(#tnTitle) .tn-tabs-rail{display:flex !important;overflow:auto !important;}
  body:has(#tnTitle) .tn-tabs-rail .tn-tab{white-space:nowrap !important;justify-content:center !important;text-align:center !important;}
}
@media (max-width:700px){
  body:has(#tdList) .tn-shell,
  body:has(#tnTitle) .tn-shell{width:calc(100vw - 18px) !important;margin-top:10px !important;}
  body:has(#tdList) .tn-listTabs{overflow:auto !important;}
  body:has(#tdList) .tn-listTabs .tn-tab{min-width:100px !important;}
  body:has(#tdList) .tn-tourFacts{grid-template-columns:1fr !important;}
  body:has(#tnTitle) .tn-statGrid{grid-template-columns:1fr 1fr !important;}
  .tn-deckPickerMenu{position:static !important;margin-top:6px !important;}
}