.search-container{
  flex: 1;
  display:flex;
  justify-content:center;
  padding: 0 2rem;
}

.search-wrapper{
  position: relative;
  width: 100%;
  max-width: 28rem;
}

.search-icon{
  position:absolute;
  left:.75rem;
  top:50%;
  transform: translateY(-50%);
  width:1rem;
  height:1rem;
  color: var(--muted-foreground);
}

.search-input{
  width:100%;
  padding: .5rem 4rem .5rem 2.25rem;
  background-color: var(--secondary);
  border: 1px solid var(--border);
  border-radius: .375rem;
  color: var(--foreground);
  font-size: .875rem;
  outline:none;
  transition: border-color .2s, box-shadow .2s;
}

.search-input:focus{
  border-color: rgba(128,216,45,.55);
  box-shadow: 0 0 0 4px rgba(128,216,45,.12);
}

.search-input::placeholder{ color: var(--muted-foreground); }

.search-shortcuts{
  position:absolute;
  right:.75rem;
  top:50%;
  transform: translateY(-50%);
  display:flex;
  align-items:center;
  gap:.25rem;
  font-size:.75rem;
  color: var(--muted-foreground);
}

.search-shortcuts kbd{
  padding: .125rem .375rem;
  background-color: var(--muted);
  border-radius: .25rem;
  font-size:.75rem;
}

.search-results{
  display:none;
  position:absolute;
  top: calc(100% + .5rem);
  left:0; right:0;
  background-color: var(--card);
  border: 1px solid var(--border);
  border-radius: .5rem;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,.3);
  overflow:hidden;
  z-index: 50;
  max-height: 400px;
  overflow-y:auto;
}
.search-results.show{ display:block; }

.search-result-item{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.75rem 1rem;
  font-size:.875rem;
  color: var(--foreground);
  background:none;
  border:none;
  width:100%;
  text-align:left;
  cursor:pointer;
  transition: background-color .15s;
}
.search-result-item:hover{ background-color: var(--secondary); }

.search-result-icon{
  width:1rem;
  height:1rem;
  color: var(--muted-foreground);
}

.sidebar-chapter{ margin: 6px 0 14px; }

.sidebar-chapter-title{
  padding: .3rem 1rem;
  font-size: .688rem;
  font-weight: 700;
  color: var(--muted-foreground);
  letter-spacing: .05em;
  text-transform: uppercase;
}
.sidebar-chapter:first-child .sidebar-chapter-title{
  border-top:none;
  margin-top:0;
}

.sidebar-chapter-title::after{
  content:"";
  display:block;
  height:1px;
  margin-top:.55rem;
  background: linear-gradient(to right, rgba(255,255,255,.10), transparent);
}

.sidebar-items{
  list-style:none;
  padding:0;
  margin:0;
}

.sidebar-item{
  position: relative;
  display:flex;
  align-items:center;
  gap:10px;

  width:100%;
  padding: .75rem 1rem;
  margin: 2px 0;

  border:none;
  border-radius: 12px;

  font-size: .90rem;
  color: rgba(229,229,229,.70);

  background: transparent;
  cursor:pointer;

  transition: background .15s, transform .15s, box-shadow .15s;
}

.sidebar-item:hover{
  background-color: var(--secondary);
  transform: scale(1.02);
}

.sidebar-item-icon{
  width:1rem;
  height:1rem;
  flex-shrink:0;
  opacity:.65;
}

.sidebar-item.active{
  background: rgba(128,216,45,.12);
  color: var(--primary);
  font-weight: 600;
  box-shadow:
    0 0 0 1px rgba(128,216,45,.20),
    0 0 18px rgba(128,216,45,.18);
}
.sidebar-item.active .sidebar-item-icon{
  color: var(--primary);
  opacity: .95;
  transform: scale(1.08);
}

.sidebar-item.active::before{
  content:"";
  position:absolute;
  left:-6px;
  top:10px;
  bottom:10px;
  width:3px;
  border-radius: 3px;
  background: var(--primary);
}

.copy-button{
  display:flex;
  align-items:center;
  gap:.5rem;
  padding: .375rem .75rem;
  background:none;
  border:none;
  color: var(--muted-foreground);
  font-size: .875rem;
  cursor:pointer;
  border-radius: 12px;
  transition: background-color .15s, color .15s;
}
.copy-button:hover{
  color: var(--foreground);
  background-color: var(--muted);
}
.copy-button i{ font-size: 1rem; }

.chapter-badge{
  font-size: .75rem;
  font-weight: 700;
  color: var(--primary);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.section-card{
  padding: 14px 14px 6px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.015);
  box-shadow: 0 8px 18px rgba(0,0,0,.28);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.section-card:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(0,0,0,.38);
  border-color: rgba(128,216,45,.18);
}

.section-head{
  display:flex;
  align-items:flex-start;
  gap: 12px;
  margin-bottom: 10px;
}

.section-num{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 900;
  color: rgba(255,255,255,.95);
  background: rgba(128,216,45,.10);
  border: 1px solid rgba(128,216,45,.18);
  box-shadow: 0 0 0 3px rgba(128,216,45,.06);
  flex: 0 0 auto;
}

.section-title{
  font-size: 1.05rem;
  font-weight: 900;
  letter-spacing: .2px;
  color: var(--foreground);
  line-height: 1.25;
  margin-top: 2px;
}

.section-card .section-heading{
  margin-bottom: 10px;
}

.section-card .section-items{
  margin-top: 6px;
  padding-bottom: 6px;
}

.section-card .section-items:empty{ display:none; }

.section-heading{
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: .3px;
  color: var(--primary);
  margin-bottom: 1rem;
}

.section-text{
  margin: 0 0 .9rem;
  color: rgba(226,228,233,.92);
  line-height: 1.7;
  font-size: .98rem;
}
.section-text + .section-text{ margin-top: -.35rem; }

.section-items{
  list-style:none;
  display:flex;
  flex-direction: column;
  gap: .75rem;
}

.section-item{
  display:flex;
  align-items: flex-start;
  gap: .75rem;
  color: rgba(226,228,233,.90);
}

.section-item-bullet{
  width:6px;
  height:6px;
  border-radius: 50%;
  background: var(--primary);
  margin-top: .55em;
  opacity: .75;
  flex: 0 0 auto;
}

.section-item-text{
  line-height: 1.6;
  font-size: .938rem;
}

.section-item--sub{
  padding-left: 16px;
  opacity: .95;
}
.section-item-bullet--sub{
  width: 5px;
  height: 5px;
  opacity: .55;
  margin-top: .62em;
  box-shadow: none;
}

.section-divider{ display:none; }

.section-table-wrap{
  width:100%;
  overflow:auto;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  background: rgba(255,255,255,.02);
  box-shadow: var(--shadow-sm);
}

.section-table{
  width:100%;
  border-collapse: collapse;
  min-width: 560px;
}

.section-table th,
.section-table td{
  padding: 10px 12px;
  text-align:left;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.section-table th{
  font-weight: 800;
  font-size: .81rem;
  color: rgba(229,229,229,.78);
  text-transform: uppercase;
  letter-spacing: .05em;
  background: rgba(255,255,255,.03);
}

.section-table td{
  color: rgba(229,229,229,.88);
  font-size: .94rem;
}

.section-table tbody tr:nth-child(odd){
  background: rgba(255,255,255,.015);
}
.section-table tbody tr:hover{
  background: rgba(128,216,45,.06);
}

.mini-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0 18px;
}

@media (max-width: 980px){
  .mini-grid{ grid-template-columns: 1fr; }
}

.mini-card{
  padding: 14px 14px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  box-shadow: var(--shadow-sm);
}

.mini-card--warn{
  border-color: rgba(251,191,36,.18);
  background: rgba(251,191,36,.06);
}

.mini-kicker{
  display:flex;
  align-items:center;
  gap: 8px;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(229,229,229,.72);
  margin-bottom: 8px;
}

.mini-kicker i{
  color: var(--primary);
}

.mini-card--warn .mini-kicker i{
  color: var(--warning);
}

.mini-card p{
  margin: 0;
  color: rgba(229,229,229,.78);
  line-height: 1.6;
  font-size: .93rem;
}

.info-card{
  display:flex;
  align-items:flex-start;
  gap: 14px;
  padding: 14px 16px;
  margin: 10px 0;
  border-radius: 14px;
  border: 1px solid rgba(128,216,45,.18);
  background: rgba(128,216,45,.06);
}

.info-card-icon{
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  color: var(--primary);
  font-size: 1.15rem;
}

.info-card-text{
  color: rgba(229,229,229,.90);
  line-height: 1.6;
  font-size: .95rem;
}

.danger-card{
  display:flex;
  align-items:flex-start;
  gap: 14px;
  padding: 14px 16px;
  margin: 10px 0;
  border-radius: 14px;
  border: 1px solid rgba(251,191,36,.25);
  background: rgba(251,191,36,.08);
}

.danger-card-icon{
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  color: var(--warning);
  font-size: 1.15rem;
}

.danger-card-text{
  color: rgba(229,229,229,.90);
  line-height: 1.6;
  font-size: .95rem;
}

.toast-container{
  position: fixed;
  top: calc(var(--header-h) + 1rem);
  right: 1rem;
  z-index: 100;
  display:flex;
  flex-direction:column;
  gap: 10px;
}

.toast{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 18px;
  box-shadow: 0 10px 25px rgba(0,0,0,.4);
  display:flex;
  align-items:center;
  gap: 12px;
  min-width: 280px;
  animation: toastIn .25s ease-out;
}

@keyframes toastIn{
  from{
    opacity: 0;
    transform: translateX(100px);
  }
  to{
    opacity: 1;
    transform: translateX(0);
  }
}

.toast-icon{
  font-size: 1.25rem;
  color: var(--primary);
}

.toast-text{
  flex: 1;
  font-size: .9rem;
  color: var(--foreground);
}

.force-pill{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(0,0,0,0.20);
  max-width: fit-content;
}

.force-crest{
  width: 44px;
  height: 44px;
  border-radius: 8px;
  object-fit: contain;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  padding: 4px;
}

.force-text{
  display: flex;
  flex-direction: column;
  gap: 4px;
  line-height: 1.15;
}

.force-code{
  font-size: 15px;
  font-weight: 900;
  letter-spacing: .4px;
  text-transform: uppercase;
}

.force-name{
  font-size: 12px;
  color: var(--muted-foreground);
}

/* ================================
   Sidebar nested groups (children)
================================ */
.sidebar-group-row{
  display:flex;
  align-items:center;
  gap: 8px;
}

.sidebar-toggle{
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  background: rgba(255,255,255,.01);
  color: rgba(229,229,229,.55);
  cursor:pointer;
  display:grid;
  place-items:center;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
  flex: 0 0 auto;
}

.sidebar-toggle:hover{
  background: rgba(255,255,255,.03);
  border-color: rgba(255,255,255,.12);
  color: rgba(229,229,229,.82);
  transform: translateY(-1px);
}

.sidebar-toggle i{
  transition: transform .18s ease;
  transform: rotate(0deg);
}

.sidebar-group.is-open .sidebar-toggle i{
  transform: rotate(90deg);
}

/* Child list */
.sidebar-subitems{
  list-style:none;
  padding: 6px 0 8px;
  margin: 4px 0 8px;

  display:none;

  /* subtle hierarchy */
  border-left: 1px solid rgba(255,255,255,.06);
  margin-left: 16px;
  padding-left: 10px;
}

.sidebar-group.is-open .sidebar-subitems{ display:block; }

/* Parent item: keep premium, but less “fat” when it’s just a container */
.sidebar-item.sidebar-item--parent{
  flex: 1;
  min-width: 0;
}

/* Children: smaller, cleaner, no “scale” jump */
.sidebar-item.sidebar-item--child{
  padding: .60rem .90rem;
  border-radius: 12px;
  font-size: .86rem;
  color: rgba(229,229,229,.62);
  transform: none !important;
}

.sidebar-item.sidebar-item--child:hover{
  background-color: rgba(255,255,255,.02);
  color: rgba(229,229,229,.82);
  transform: none !important;
}

/* Dot marker for children */
.sidebar-item.sidebar-item--child{
  position: relative;
  padding-left: 1.65rem;
}

.sidebar-item.sidebar-item--child::before{
  content:"";
  position:absolute;
  left: .85rem;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.18);
  box-shadow: 0 0 0 3px rgba(0,0,0,.20);
}

.sidebar-item.sidebar-item--child.active::before{
  background: rgba(128,216,45,.95);
  box-shadow: 0 0 0 4px rgba(128,216,45,.10);
}

/* Active child: tighter glow than parent */
.sidebar-item.sidebar-item--child.active{
  background: rgba(128,216,45,.10);
  color: var(--primary);
  font-weight: 700;
  box-shadow:
    0 0 0 1px rgba(128,216,45,.18),
    0 0 12px rgba(128,216,45,.14);
}

/* Parent that has an active child: subtle, not screaming */
.sidebar-group.has-active-child > .sidebar-group-row .sidebar-item--parent.active{
  background: rgba(255,255,255,.02);
  box-shadow: 0 0 0 1px rgba(255,255,255,.06);
  color: rgba(229,229,229,.90);
  font-weight: 700;
}

.sidebar-item-label{
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Reduce scale hover effect for group rows only (prevents “wobble”) */
.sidebar-group .sidebar-item:hover{
  transform: none;
}