/* Phase 46I — Final Duelist Kingdom polish layer */
:root{
  --dk-card-bg: rgba(5, 12, 30, .78);
  --dk-card-border: rgba(0, 179, 255, .28);
  --dk-soft-glow: 0 18px 48px rgba(0, 0, 0, .34);
}

.dtn-phase46i-guide,
.dk-final-panel,
.dk-final-card,
[data-dk-card],
.kingdom-card,
.challenge-card,
.event-card,
.notification-card{
  border-radius: 20px;
  border: 1px solid var(--dk-card-border);
  background: var(--dk-card-bg);
  box-shadow: var(--dk-soft-glow);
}

.dtn-phase46i-guide{
  padding: clamp(16px, 3vw, 28px);
  margin: 16px auto;
  max-width: 1100px;
}

.dtn-phase46i-guide h2,
.dtn-phase46i-guide h3{
  font-family: Orbitron, system-ui, sans-serif;
  letter-spacing: .02em;
}

.dtn-phase46i-guide-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
}

.dtn-phase46i-guide-section{
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.055);
}

.dtn-phase46i-guide-section p{
  margin: 8px 0 0;
  line-height: 1.45;
}

.dtn-phase46i-status-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.dtn-phase46i-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,179,255,.12);
  font-size: .88rem;
  line-height: 1.2;
}

.dtn-phase46i-stack{
  display:flex;
  flex-direction:column;
  gap:12px;
}

@media (max-width: 760px){
  html, body{
    max-width:100%;
    overflow-x:hidden;
  }

  .dtn-phase46i-guide,
  .dk-final-panel,
  .dk-final-card,
  [data-dk-card],
  .kingdom-card,
  .challenge-card,
  .event-card,
  .notification-card{
    border-radius: 16px;
  }

  .dtn-phase46i-guide{
    padding: 14px;
    margin: 10px;
  }

  .dtn-phase46i-guide-grid{
    grid-template-columns: 1fr;
  }

  .dtn-phase46i-status-row{
    align-items:stretch;
  }

  .dtn-phase46i-pill{
    width:100%;
    justify-content:center;
  }

  table{
    display:block;
    max-width:100%;
    overflow-x:auto;
  }

  input, select, textarea, button{
    max-width:100%;
  }
}