/* ========== Theme & Base ========== */
:root{
  --teal-1:#0ea5a5; --teal-2:#0fb2ad;
  --bg:#bfe3ff; --bg-2:#a8d4ff; --bg-3:#9eccff;
  --panel:#eaf4ff; --panel-border:#9dbbd7; --card:#f7fbff; --ink:#0f172a;
  --muted:#475569; --muted-2:#334155;
  --ring:#1a9db2;
  --radius:10px;
}

*,
*::before,
*::after{ box-sizing:border-box; }

html,body{
  background:linear-gradient(180deg, var(--bg), var(--bg-2) 50%, var(--bg-3));
  font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink); font-size:14px; line-height:1.45;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

img{ max-width:100%; height:auto; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; }
}

/* ========== Header ========== */
/* Make the hamburger visible even if resets override Bootstrap vars */
.topbar .navbar-toggler {
  border-color: rgba(255,255,255,.25);
}
.topbar .navbar-toggler-icon {
  width: 1.5rem; height: 1.5rem;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.topbar { z-index: 1030; } /* keep above content when offcanvas opens */
.topbar{
  background:linear-gradient(180deg, var(--teal-2), var(--teal-1));
  color:#fff; border-bottom:3px solid rgba(0,0,0,.12);
}
.brand{ letter-spacing:.08em; font-weight:800; text-transform:uppercase; font-size:18px; }
.navbar .nav-link{ font-weight:700; opacity:.95; }
.navbar .nav-link:hover, .navbar .nav-link:focus{ opacity:1; }
.offcanvas.text-bg-dark .dropdown-menu-dark .dropdown-item.active{ background:#0fb2ad; }
.header-search{ position:relative; width:min(420px, 44vw); height:36px; }
.header-search .form-control{
  height:100%; border-radius:999px; background:rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.35); color:#fff; padding-left:2.4rem;
}
.header-search .form-control::placeholder{ color:rgba(255,255,255,.88); }
.header-search .form-control:focus{ box-shadow:0 0 0 3px rgba(255,255,255,.25); }
.header-search .search-ic{
  position:absolute; left:.65rem; top:50%; transform:translateY(-50%);
  font-size:18px; line-height:1; color:#fff; opacity:.95; pointer-events:none; z-index:2;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button{ -webkit-appearance:none; }
/* ========== End Header ========== */

/* ========== Home Page ========== */
.notice{
  background:#eaf6ff; border:1px solid #bed9ef; color:#214e72;
  padding:.5rem .75rem; border-radius:var(--radius);
}

.panel{
  background:var(--panel); border:2px solid var(--panel-border);
  border-radius:var(--radius); box-shadow:0 2px 0 rgba(0,0,0,.10);
}
.section-title,
.panel h5{
  background:#2f333d; color:#fff; padding:.45rem .6rem; border-radius:6px;
  font-weight:800; text-transform:uppercase; letter-spacing:.05em; font-size:.9rem; display:inline-block;
}

.modern-tabs{
  background:#e8f3ff; border:2px solid #9dbbd7; border-radius:var(--radius);
  padding:.25rem; display:flex; gap:.25rem; row-gap:.35rem; flex-wrap:wrap;
}
.modern-tabs .nav-link{
  border:0; border-radius:999px; padding:.35rem .75rem;
  font-weight:700; color:#20506c; background:transparent; white-space:nowrap;
}
.modern-tabs .nav-link .badge{ margin-left:.35rem; font-weight:700; }
.modern-tabs .nav-link:focus-visible{ outline:3px solid var(--ring); outline-offset:2px; }
.modern-tabs .nav-link.active{
  color:#063a40; background:linear-gradient(180deg, #bdf3ee, #7ee1da);
  box-shadow:0 1px 0 rgba(0,0,0,.12), inset 0 -1px 0 rgba(0,0,0,.12);
  border:1px solid #7fd9d3;
}

.type-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:.35rem; }
.type-btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:34px; width:100%; border:none; border-radius:999px; color:#fff;
  font-weight:800; letter-spacing:.02em; font-size:.78rem;
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.18); cursor:pointer;
}
.type-btn:focus-visible{ outline:3px solid rgba(255,255,255,.7); outline-offset:1px; }
.type-btn.active{ outline:3px solid rgba(255,255,255,.7); }

.t-normal{background:#A8A77A;} .t-fire{background:#EE8130;}
.t-water{background:#6390F0;} .t-electric{background:#F7D02C;color:#222;}
.t-grass{background:#7AC74C;} .t-ice{background:#96D9D6;color:#222;}
.t-fighting{background:#C22E28;} .t-poison{background:#A33EA1;}
.t-ground{background:#E2BF65;color:#222;} .t-flying{background:#A98FF3;}
.t-psychic{background:#F95587;} .t-bug{background:#A6B91A;}
.t-rock{background:#B6A136;} .t-ghost{background:#735797;}
.t-dragon{background:#6F35FC;} .t-dark{background:#705746;}
.t-steel{background:#B7B7CE;color:#222;} .t-fairy{background:#D685AD;}

.dex-grid{ --bs-gutter-x:.5rem; --bs-gutter-y:.5rem; }
.dex-card{
  position:relative; background:var(--card);
  border:2px solid #cfe1f2; border-radius:var(--radius);
  box-shadow:0 2px 0 rgba(0,0,0,.08);
  aspect-ratio:1/1; overflow:hidden;
  transition:transform .12s ease, box-shadow .12s ease;
}
.dex-card:hover{ transform:translateY(-1px); box-shadow:0 3px 0 rgba(0,0,0,.10); }

.dex-content{ position:absolute; inset:0; display:grid; grid-template-rows:28px 1fr; padding:6px 6px 40px; }
.dex-title{
  display:flex; align-items:center; justify-content:center;
  background:#2e3446; color:#fff; font-weight:800; letter-spacing:.04em;
  font-size:.8rem; border-radius:6px; text-transform:capitalize;
}
.dex-center{ display:flex; justify-content:center; }
.dex-img{ max-width:78%; max-height:78%; object-fit:contain; filter:drop-shadow(0 1px 1px rgba(0,0,0,.15)); }
.dex-id{
  position:absolute; left:8px; right:8px; bottom:8px; height:26px;
  display:flex; align-items:center; justify-content:center;
  background:#ecf5ff; border:1px solid #d8e8f7; color:#15324a;
  font-weight:800; font-size:.9rem; border-radius:6px;
}

.tile-normal{ background:#eef3df; }   .tile-fire{ background:#ffeadc; }
.tile-water{ background:#e6f0ff; }    .tile-electric{ background:#fff3c6; }
.tile-grass{ background:#e6f6e2; }    .tile-ice{ background:#e9f9f8; }
.tile-fighting{ background:#f7d0cb; } .tile-poison{ background:#f0dcf7; }
.tile-ground{ background:#f4eac8; }   .tile-flying{ background:#eee8ff; }
.tile-psychic{ background:#ffe0ec; }  .tile-bug{ background:#ecf7c8; }
.tile-rock{ background:#f1e4c2; }     .tile-ghost{ background:#ebe4f6; }
.tile-dragon{ background:#ece5ff; }   .tile-dark{ background:#e7dedb; }
.tile-steel{ background:#edf1fb; }    .tile-fairy{ background:#ffddeb; }

.pill{
  display:inline-flex; align-items:center; justify-content:center;
  height:28px; padding:0 .55rem; font-weight:800; color:#fff;
  border-radius:999px; font-size:.78rem; margin:.15rem .2rem 0 0;
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.18);
}
.type-pill-small{
  display:inline-flex; height:22px; padding:0 .45rem;
  border-radius:999px; align-items:center; color:#fff;
  font-weight:800; font-size:.72rem;
}
/* ========== End Home Page ========== */

/* ========== Pokémon Page ========== */
.nav-pills .nav-link.form-tab-link.active{
  border-color:var(--bs-primary);
  box-shadow:0 0 0 .15rem rgba(var(--bs-primary-rgb),.15);
}
.form-tabs { 
  margin: .25rem 0 .5rem;
  gap: .4rem;
  flex-wrap: wrap;
}
.form-tabs .nav-link { text-transform: none; }
.form-tabs.nav-pills .nav-link {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .7rem;
  line-height: 1.1;
  border-radius: .6rem;
  border: 1px solid rgba(0,0,0,.14);
  background: rgba(0,0,0,.04);
  color: rgba(0,0,0,.78);
  font-weight: 600;
  text-decoration: none;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .06s ease;
}

.form-tabs.nav-pills .nav-link:hover { 
  background: rgba(0,0,0,.06); 
  color: rgba(0,0,0,.9);
}
.form-tabs.nav-pills .nav-link.active {
  background: #111 !important;
  color: #fff !important;
  border-color: #111 !important;
  box-shadow: none !important;
}

.form-tabs.nav-pills .nav-link:focus { 
  outline: none;
  box-shadow: none !important;
}
.form-tabs.nav-pills .nav-link:focus-visible {
  outline: 2px solid rgba(17,17,17,.6);
  outline-offset: 2px;
}

.form-tabs.nav-pills .pill {
  font-size: .68rem;
  line-height: 1;
  padding: .18rem .38rem;
  border-radius: .35rem;
  border: 1px solid rgba(255,255,255,.35);
  background: rgba(255,255,255,.18);
  color: #fff;
}
.form-tabs.nav-pills .nav-link:not(.active) .pill {
  border-color: rgba(0,0,0,.14);
  background: rgba(0,0,0,.05);
  color: rgba(0,0,0,.7);
}

@media (max-width: 480px) {
  .form-tabs.nav-pills .nav-link { padding: .3rem .55rem; font-weight: 600; }
}
.hero-card{
  background:var(--card); border:2px solid #cfe1f2; border-radius:14px;
  box-shadow:0 2px 0 rgba(0,0,0,.08); overflow:hidden;
      margin-bottom: 1rem !important;
}
.hero-top{
  display:flex; align-items:center; justify-content:space-between; gap:.5rem;
  padding:.6rem .8rem; background:#ecf5ff; border-bottom:1px solid #d8e8f7;
}
.hero-img-wrap{ display:flex; align-items:center; justify-content:center; background:#f2fbff; }
.hero-img{
  width:100%; max-width:360px; height:auto; object-fit:contain;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.15));
}

.hero-img-wrap { padding-bottom: .75rem; }
.hero-img { max-height: 360px; width: 100%; object-fit: contain; }

.hero-sprite-strip{
  display:flex; justify-content:center; gap:1rem;
  padding: .75rem 1rem;
  border-top:1px solid rgba(0,0,0,.06);
  background: linear-gradient(1deg, #f7fbff 0%, #ffffff 100%);
}

.sprite-box{
  display:flex; flex-direction:column; align-items:center;
  gap:.25rem;
  width:116px;
  padding:.5rem .75rem;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:.75rem;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
}

.sprite-box figcaption{
  font-size:.75rem; line-height:1; color:#6c757d;
  font-weight:600;
}

.pixel-sprite{
  width:80px; height:80px;
}

@media (max-width: 576px){
  .sprite-box{ width:104px; padding:.4rem .6rem; }
  .pixel-sprite{ width:72px; height:72px; }
}
.dex-badge{
  font-weight:800; color:#15324a; background:#ecf5ff;
  border:1px solid #d8e8f7; border-radius:6px; padding:.15rem .45rem;
}
.moves-block .moves-header { margin-bottom: .25rem; }

.moves-block .form-select.form-select-sm.w-auto {
  min-width: 9rem;
  border-radius: .5rem;
  padding-top: .25rem; padding-bottom: .25rem;
}

.moves-tabs { 
  gap: .4rem; 
  flex-wrap: wrap;
}
.moves-tabs .nav-link {
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.35rem .65rem;
  font-weight:700; font-size:.9rem; line-height:1.1;
  border:1px solid rgba(0,0,0,.12);
  border-radius:.6rem;
  background:rgba(0,0,0,.04);
  color:rgba(0,0,0,.78);
}
.moves-tabs .nav-link:hover { background:rgba(0,0,0,.06); color:#111; }
.moves-tabs .nav-link.active {
  background:#111; color:#fff; border-color:#111;
}
.moves-tabs .nav-link.disabled { opacity:.45; pointer-events:none; }
.moves-tabs .count-pill{
  display:inline-block; min-width:1.6em; text-align:center;
  font-size:.72rem; line-height:1.3; font-weight:800;
  padding:.05rem .38rem; border-radius:1rem;
  background:rgba(0,0,0,.08); color:rgba(0,0,0,.8);
}
.moves-tabs .nav-link.active .count-pill{
  background:rgba(255,255,255,.2); color:#fff; border:1px solid rgba(255,255,255,.35);
}

.moves-table-wrap { border:1px solid rgba(0,0,0,.06); border-radius:.6rem; overflow:hidden; }
.moves-table {
  margin:0;
  --row-pad-y:.4rem;
  --row-pad-x:.5rem;
}
.moves-table thead th{
  font-size:.75rem; letter-spacing:.02em; color:#6b7280;
  text-transform:uppercase;
  background:linear-gradient(180deg,#f7fafc 0%, #f0f4f8 100%);
  position:sticky; top:0; z-index:1;
  padding:.45rem var(--row-pad-x);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.moves-table tbody td{
  padding:var(--row-pad-y) var(--row-pad-x);
  border-bottom:1px solid rgba(0,0,0,.05);
}
.moves-table tbody tr:hover { background:#f9fbfe; }

.moves-table .col-lvl   { width:70px;  }
.moves-table .col-mach  { width:80px;  }
.moves-table .col-type  { width:120px; }
.moves-table .col-cat   { width:104px; }
.moves-table .col-num   { width:78px;  }

.chip, .chip-code{
  display:inline-block; font-weight:700; font-size:.72rem;
  padding:.1rem .4rem; border-radius:.4rem;
  border:1px solid rgba(0,0,0,.15); background:rgba(0,0,0,.04);
}

.cat { 
  display:inline-block; font-weight:700; font-size:.72rem;
  line-height:1; padding:.22rem .44rem; border-radius:.35rem;
  border:1px solid transparent;
}
.chip-physical { background:#fdeae7; color:#b6402e; border-color:#f4c9c1; }
.chip-special  { background:#e9f1ff; color:#2b57a4; border-color:#cfe0ff; }
.chip-status   { background:#eef7ea; color:#2f6a2f; border-color:#d2e7cf; }

.text-muted-700 { color:#374151; }
/* ========== End Pokémon Page ========== */

/* ======= Type Effectivness ===== */
.typegrid-cols{
  display:grid;
  grid-template-columns:repeat(9,minmax(0,1fr));
  gap:.45rem .5rem;
}
@media (max-width: 900px){ .typegrid-cols{ grid-template-columns:repeat(6,minmax(0,1fr)); } }
@media (max-width: 560px){ .typegrid-cols{ grid-template-columns:repeat(4,minmax(0,1fr)); } }

.tg-col{ display:grid; grid-template-rows:auto 36px; gap:.4rem; }

.tg-head{ display:flex; justify-content:center; }
.tg-head .pill{
  width:100%; text-align:center; white-space:nowrap;
}

.tg-cell{
  border-radius:10px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  display:flex; align-items:center; justify-content:center;
}
.tg-cell .tg-val{
  font-weight:800;
  font-size:.95rem;
  line-height:1;
  font-variant-numeric: tabular-nums;
  -moz-font-feature-settings: "tnum";
  -webkit-font-feature-settings: "tnum";
  font-feature-settings: "tnum";
  letter-spacing:.01em;
}
.tg-cell{ position:relative; overflow:hidden; }

.tg-cell.d1{
  background:#f4f8fd;
  border-color:rgba(0,0,0,.06);
}
.tg-cell.d1::before{
  content:"";
  position:absolute; inset:0;
  border-radius:inherit;
  pointer-events:none;
  opacity:.25;
  background:
    repeating-linear-gradient(
      135deg,
      rgba(0,0,0,.05) 0 8px,
      rgba(255,255,255,.6) 8px 16px
    );
}

.tg-cell.d1 .tg-val{ display:none; }
.tg-cell.d2   { background:#ffe3e3; border-color:#ffd2d2; }
.tg-cell.d4   { background:#ffc9c9; border-color:#ffb8b8; }
.tg-cell.d05  { background:#e3f4e8; border-color:#d3eddb; }
.tg-cell.d025 { background:#d1f0d8; border-color:#bfe8c7; }
.tg-cell.d0   { background:#ececf2; border-color:#dedee6; color:#555; }

.stat-row{ display:flex; align-items:center; gap:.5rem; }
.stat-label{ width:90px; font-weight:700; text-transform:uppercase; font-size:.8rem; color:var(--muted-2); }
.stat-bar{ flex:1; height:10px; background:#e9eef5; border-radius:999px; overflow:hidden; }
.stat-bar > span{ display:block; height:100%; background:#5b7cf2; }

.evo-chain .dex-card{ width:180px; aspect-ratio:1/1; }
.evo-chain .dex-title{ font-size:.8rem; }
.evo-chain .dex-id{ height:24px; font-size:.86rem; }

.evo-chain .evo-stage{ min-width: 200px; }

.evo-chain .cond-pills .cond-pill{
  display:inline-flex; align-items:center; height:22px; padding:0 .45rem;
  border-radius:999px; background:#ecf5ff; border:1px solid #d8e8f7;
  color:#15324a; font-weight:700; font-size:.72rem; margin:.15rem .25rem 0 0;
}

.type-cell{
  text-align:center; font-weight:800; padding:.35rem .25rem;
  border-radius:8px; border:1px solid #d9e6f5; background:#f2f8ff;
}
.mult-0{ background:#222; color:#fff; }
.mult-0-25{ background:#d7f9e6; }
.mult-0-5{ background:#e8f9f1; }
.mult-1{ opacity:.9; }
.mult-2{ background:#ffe5e5; }
.mult-4{ background:#ffd0d0; }

.subtabs{
  background:#e8f3ff; border:1px solid #cfe1f2; border-radius:999px;
  padding:.25rem; display:inline-flex; gap:.25rem;
}
.subtabs .nav-link{
  border:0; border-radius:999px; padding:.3rem .6rem; font-weight:700; color:#20506c; background:transparent;
}
.subtabs .nav-link:focus-visible{ outline:3px solid var(--ring); outline-offset:2px; }
.subtabs .nav-link.active{
  color:#063a40; background:linear-gradient(180deg,#bdf3ee,#7ee1da);
  border:1px solid #7fd9d3; box-shadow:0 1px 0 rgba(0,0,0,.12), inset 0 -1px 0 rgba(0,0,0,.12);
}
.move-filters .form-select{ height:34px; padding:.25rem .5rem; font-size:.85rem; }

.table.moves-table thead th{
  position:sticky; top:0; z-index:1;
  background:rgba(0,0,0,.04);
  font-size:.78rem; text-transform:uppercase; letter-spacing:.03em; color:#475569;
}
.table.moves-table td{ vertical-align:middle; background:transparent; }
.cat-pill{
  display:inline-flex; height:22px; padding:0 .45rem; border-radius:6px;
  align-items:center; font-weight:800; font-size:.72rem; border:1px solid rgba(0,0,0,.08);
}
.cat-physical{ background:#ffe8df; color:#8a2f12; }
.cat-special{ background:#e8f0ff; color:#223a9d; }
.cat-status{  background:#eef3f0; color:#185a37; }
/* ========== End Pokémon Page ========== */

/* ========== About Page ========== */
.about-page { background: transparent; }
.about-card { border-radius: .9rem; border: 1px solid var(--bs-border-color); background: var(--bs-card-bg); }
.about-page .card { border-radius: .9rem; }
.about-page .lead { max-width: 70ch; }
.about-page .alert {
  background-color: var(--bs-info-bg-subtle) !important;
  border-color: var(--bs-info-border-subtle) !important;
  color: var(--bs-info-text-emphasis, var(--bs-info)) !important;
  border-radius: .6rem;
  padding: .75rem .9rem;
}
.about-page ul { margin-bottom: .75rem; }
.about-page li { margin-bottom: .35rem; }
.about-page .btn { border-radius: .6rem; }
/* ========== End About Page ========== */

/* ========== Types Page ========== */
.type-matrix-wrap{background:#fff;padding:.5rem;border-radius:.5rem}
.type-matrix{border-collapse:separate!important;border-spacing:2px;table-layout:fixed;display:table!important;width:100%;min-width:900px}
.type-matrix thead{display:table-header-group!important}
.type-matrix tbody{display:table-row-group!important}
.type-matrix tr{display:table-row!important}
.type-matrix th,.type-matrix td{display:table-cell!important;flex:none!important;border:0;background:#fff;color:var(--bs-body-color);height:2.2rem;padding:0;text-align:center;vertical-align:middle}
.type-matrix thead th{position:sticky;top:0;z-index:5;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.06)}
.matrix-corner{width:5rem;background:#fff}
.legend{position:relative;height:3rem}
.legend-top,.legend-left{position:absolute;left:.5rem;font-weight:600;color:var(--bs-secondary-color,#6b7280)}
.legend-top{top:.25rem}
.legend-left{bottom:.25rem}
.row-head{height:auto;padding:.15rem;border-radius:.25rem}
.type-matrix tbody tr:nth-child(odd) .cell.empty{background:#fcfdff}
.cell{border-radius:.25rem;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.cell-chip{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:800;letter-spacing:.01em}
.cell.eff-2{background:#59a14f;color:#fff}
.cell.eff-gt2{background:#2e7d32;color:#fff}
.cell.eff-05{background:#b71c1c;color:#fff}
.cell.eff-lt05{background:#880e4f;color:#fff}
.cell.eff-0{background:#2f3136;color:#fff}
.cell.empty{background:#fff}
.legend-chip{display:inline-flex;align-items:center;justify-content:center;min-width:2.2rem;height:1.6rem;padding:0 .45rem;border-radius:.375rem;font-weight:700;border:1px solid rgba(0,0,0,.08)}
.legend-chip.eff-2{background:#59a14f;color:#fff;border-color:transparent}
.legend-chip.eff-05{background:#b71c1c;color:#fff;border-color:transparent}
.legend-chip.eff-0{background:#2f3136;color:#fff;border-color:transparent}
.legend-chip.bg-body{background:#fff}
.panel .border-bottom{border-color:rgba(0,0,0,.06)!important}

.type-stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.75rem}
.type-stat-card{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto auto;gap:.25rem;
  background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:.5rem;padding:.6rem .7rem;text-decoration:none;color:inherit;
  box-shadow:0 1px 0 rgba(0,0,0,.02)}
.type-stat-card:hover{transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,.12)}
.type-stat-name{grid-column:1/-1;font-weight:800}
.type-stat-row{display:flex;flex-direction:column;align-items:flex-end;min-width:4.5rem}
.type-stat-num{font-weight:800;font-size:1.05rem;line-height:1}
.type-stat-label{font-size:.72rem;letter-spacing:.02em;opacity:.75}
.type-about p { margin-bottom:.5rem }
.type-about ul li { margin-bottom:.25rem }
.type-about strong { color: var(--bs-body-color) }

/* headers & type colors */
.type-head .type-pill,
.row-head .type-pill{
  display:flex;
  align-items:center;
  justify-content:center;
  height:2.2rem;
  width:100%;
  border-radius:.25rem;
  font-weight:700;
  font-size:.9rem;
  text-transform:capitalize;
  padding:0;
  border:1px solid rgba(0,0,0,.25);
  box-shadow:inset 0 1px 2px rgba(255,255,255,.3),0 1px 3px rgba(0,0,0,.3);
  transition:all .15s ease-in-out;
  text-decoration:none;
  text-shadow:0 1px 1px rgba(0,0,0,.35);
}
.type-pill:hover{
  transform:translateY(-1px);
  box-shadow:inset 0 1px 3px rgba(255,255,255,.4),0 2px 6px rgba(0,0,0,.35);
}
.type-pill.large{justify-content:center;padding:0}

.tp-normal{background:#A8A77A;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-fire{background:#EE8130;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-water{background:#6390F0;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-electric{background:#F7D02C;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-grass{background:#7AC74C;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-ice{background:#96D9D6;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-fighting{background:#C22E28;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-poison{background:#A33EA1;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-ground{background:#E2BF65;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-flying{background:#A98FF3;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-psychic{background:#F95587;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-bug{background:#A6B91A;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-rock{background:#B6A136;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-ghost{background:#735797;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-dragon{background:#6F35FC;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-dark{background:#705746;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-steel{background:#B7B7CE;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}
.tp-fairy{background:#D685AD;color:#fff;text-shadow: 1px 1px 2px rgba(0, 0, 0, .7);}

.stat-band .num{font-weight:800;font-size:1.4rem;line-height:1}
.stat-band .label{font-size:.8rem;color:var(--bs-secondary-color,#6c757d)}
.stat-band .cell{padding:.75rem 1rem;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:.5rem}

.section-head{display:flex;align-items:flex-end;gap:.5rem;margin-bottom:.75rem}
.section-head .eyebrow{font-size:1.25rem;font-weight:800}
.section-head .sub{color:var(--bs-secondary-color,#6c757d);font-weight:600}

.pc-list{margin:0;padding:0;list-style:none;display:grid;row-gap:.5rem}
.pc-item{display:grid;grid-template-columns:1.25rem auto;align-items:start;column-gap:.5rem}
.pc-icon{display:inline-flex;width:1.25rem;height:1.25rem;border-radius:999px;align-items:center;justify-content:center;font-size:.75rem;line-height:1;background:#eef3f9;color:#1f6feb}
.pc-icon.danger{background:#fdecea;color:#c62828}
.pc-icon.warn{background:#fff7e6;color:#b26a00}
.pc-icon.mute{background:#f2f2f2;color:#666}

.none-chip{display:inline-block;padding:.15rem .4rem;border-radius:.35rem;background:#f6f7f9;border:1px solid rgba(0,0,0,.08);color:#8a8f98;font-size:.8rem}

.pill-row{display:flex;flex-wrap:wrap;gap:.35rem}
.pill{width: 60px;display:inline-flex;align-items:center;border:1px solid rgba(0,0,0,.12);border-radius:.4rem;padding:.15rem .5rem;font-weight:600;font-size:.85rem;line-height:1;text-decoration:none;}
.pill:hover{box-shadow:0 2px 6px rgba(0,0,0,.12);transform:translateY(-1px)}

.panel-soft-divider{border-top:1px dashed rgba(0,0,0,.08);margin:.75rem 0}

.dual-head small{color:var(--bs-secondary-color,#6c757d)}
.dual-legend{display:flex;align-items:center;gap:.5rem}
.dual-legend .legend-chip{transform:translateY(-1px)}
.cell.disabled { background: #f0f0f0 !important; border: none !important; }
.cell[title]:hover { outline: 2px solid rgba(25,118,210,.15); cursor: help; }
/* ========== End Types Page ========== */

/* ========== Moves Page ============= */
.moves-toolbar {
  display: grid;
  grid-template-columns: 1fr minmax(520px, 760px);
  align-items: center;
  gap: 0.75rem;
}

.moves-title .section-title {
  margin: 0;
  font-weight: 800;
}

.moves-title .text-muted.small {
  margin-left: 0.5rem;
}

.moves-filters {
  display: grid;
  grid-template-columns: minmax(180px, 260px) 1fr auto auto;
  gap: 0.5rem;
  justify-self: end;
}

.moves-filters .input-group {
  min-width: 260px;
}

.moves-filters .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  border-radius: 0.6rem;
  padding: 0.35rem 0.75rem;
  line-height: 1;
  height: 38px; 
}

@media (max-width: 992px) {
  .moves-toolbar {
    grid-template-columns: 1fr;
  }
  .moves-filters {
    grid-template-columns: 1fr;
  }
}

.move-card {
  display: block;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: .9rem;
  transition: all .15s ease;
  height: 100%;
}
.move-card:hover {
  border-color: rgba(0,0,0,.15);
  box-shadow: 0 6px 14px rgba(0,0,0,.08);
  transform: translateY(-2px);
}
.move-card-body {
  padding: 1rem 1.25rem;
  border-radius: inherit;
  height: 100%;
}

.move-num {
  font-size: .9rem;
  font-family: monospace;
  opacity: .7;
}
.move-name {
  font-size: 1.15rem;
  color: #0a58ca;
  line-height: 1.2;
}
.move-name span:last-child:hover {
  text-decoration: underline;
}
.move-icon {
  font-size: 1.15rem;
  line-height: 1;
}

.move-stats {
  line-height: 1.15;
}
.move-stats div + div {
  margin-top: .15rem;
}

@media (max-width: 576px){
  .move-card-body { padding: .9rem 1rem; }
  .move-name { font-size: 1rem; }
  .move-icon { font-size: 1rem; }
}

/* ========== End Moves Page ============= */


/* ========== Footer ========== */
.site-footer{
  --footer-bg: #0e9d92; --footer-fg: #f7fafc; --footer-muted: rgba(255,255,255,.75);
  --footer-link: #e7f2ff; --footer-link-hover: #ffffff; --footer-divider: rgba(255,255,255,.18);
  background: linear-gradient(180deg, var(--footer-bg) 0%, #0c8a82 100%);
  color: var(--footer-fg);
}
.site-footer .text-body-secondary{ color: var(--footer-muted)!important; }
.site-footer .brand{ color: var(--footer-fg); letter-spacing:.4px; }
.site-footer h6{ color: var(--footer-fg); font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:.5rem; }
.site-footer a{ color: var(--footer-link); text-decoration: none; }
.site-footer a:hover, .site-footer a:focus{ color: var(--footer-link-hover); text-decoration: underline; }
.site-footer a:focus-visible{ outline: 2px solid #fff; outline-offset: 2px; border-radius:.25rem; }
.site-footer .bi{ opacity:.9; transform: translateY(1px); }
.site-footer .d-inline-flex.gap-2{ gap:.4rem!important; }
.site-footer ul{ margin:0; padding:0; list-style:none; }
.site-footer li + li{ margin-top:.375rem; }
.site-footer .row.g-4{ row-gap:1.5rem; }
.site-footer hr{ border-color: var(--footer-divider); opacity:1; }
.site-footer nav[aria-label="Legal"] a{ color: var(--footer-muted); }
.site-footer nav[aria-label="Legal"] a:hover{ color: var(--footer-fg); }
.site-footer .btn-outline-secondary{
  --bs-btn-color: var(--footer-link);
  --bs-btn-border-color: var(--footer-divider);
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: var(--footer-fg);
  --bs-btn-hover-border-color: var(--footer-fg);
  --bs-btn-active-bg: var(--footer-fg);
  --bs-btn-active-border-color: var(--footer-fg);
  border-radius:.75rem; box-shadow: 0 1px 0 rgba(0,0,0,.08);
}

@media (max-width: 767.98px){
  .site-footer .d-flex.justify-content-between{ justify-content: center!important; gap:1rem!important; text-align:center; }
  .site-footer .text-end{ text-align:center!important; }
}

/* ========== Small Responsive Tweaks ========== */
@media (max-width: 575.98px){
  .dex-title{ font-size:.75rem; }
  .dex-id{ font-size:.82rem; height:24px; }
  .modern-tabs .nav-link{ padding:.3rem .6rem; }
}