/* ═══════════════════════════════════════════════════════════════
   Toolkit99 — main.css  v3
═══════════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ── DARK THEME (default) ─────────────────────── */
:root, [data-theme="dark"] {
  --bg:        #0d0e11;
  --bg-rgb:    13,14,17;
  --surface:   #141618;
  --surface2:  #1b1d22;
  --border:    #22252b;
  --text:      #eceef5;
  --muted:     #7c829a;
  --label:     #9aa0ba;
  --amber:     #fbbf24;
  --amber-low: rgba(251,191,36,.10);
  --amber-mid: rgba(251,191,36,.18);
  --amber-bdr: rgba(251,191,36,.28);
  --green:     #22c55e;
  --green-low: rgba(34,197,94,.10);
  --green-bdr: rgba(34,197,94,.22);
  --red:       #ef4444;
  --wa:        #25D366;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 14px;
}

/* ── LIGHT THEME ──────────────────────────────── */
[data-theme="light"] {
  --bg:        #f0f2f7;
  --bg-rgb:    240,242,247;
  --surface:   #ffffff;
  --surface2:  #f5f6fa;
  --border:    #d8dbe8;
  --text:      #1a1d2e;
  --muted:     #6b7280;
  --label:     #374151;
  --amber:     #d97706;
  --amber-low: rgba(217,119,6,.08);
  --amber-mid: rgba(217,119,6,.14);
  --amber-bdr: rgba(217,119,6,.30);
  --green:     #16a34a;
  --green-low: rgba(22,163,74,.08);
  --green-bdr: rgba(22,163,74,.25);
  --red:       #dc2626;
  --wa:        #25D366;
}

body {
  background: var(--bg); color: var(--text);
  font-family: 'Inter', sans-serif;
  min-height: 100vh; overflow-x: hidden;
  -webkit-tap-highlight-color: transparent;
}

/* ── LOGOTYPE ─────────────────────────────────────────────────── */
.logo-toolkit { font-family: 'Orbitron', sans-serif; font-weight: 900; color: var(--text); }
.logo-99      { font-family: 'Orbitron', sans-serif; font-weight: 900; color: var(--amber); }

/* ── PAGE LOADER ──────────────────────────────────────────────── */
.page-loader {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(var(--bg-rgb, 13,14,17), 0.85);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  display: flex; align-items: center; justify-content: center;
  transition: opacity .4s, visibility .4s;
}
.page-loader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.pl-card {
  display: flex; flex-direction: column; align-items: center; gap: 20px;
  padding: 40px 48px; background: var(--surface);
  border: 1px solid var(--border); border-radius: 24px;
  box-shadow: 0 32px 80px rgba(0,0,0,.6);
  animation: plCardIn .35s ease;
}
@keyframes plCardIn { from{opacity:0;transform:translateY(12px) scale(.97)} to{opacity:1;transform:none} }
.pl-logo { font-size: 1.6rem; letter-spacing: -1px; }
.pl-spinner-ring { width: 48px; height: 48px; }
.pl-spinner-ring svg { width:100%; height:100%; animation: plSpin 1s linear infinite; }
.pl-arc { transform-origin: 24px 24px; }
@keyframes plSpin { to { transform: rotate(360deg); } }
.pl-label { font-size: .78rem; color: var(--muted); font-weight: 500; }
.pl-dots span { display: inline-block; animation: plDot 1.2s infinite; }
.pl-dots span:nth-child(1){ animation-delay:0s }
.pl-dots span:nth-child(2){ animation-delay:.2s }
.pl-dots span:nth-child(3){ animation-delay:.4s }
@keyframes plDot { 0%,60%,100%{opacity:.2} 30%{opacity:1} }

/* ── TOPBAR ───────────────────────────────────────────────────── */
.topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 20px; height: 58px;
  background: var(--surface); border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 200; gap: 10px;
}
.tb-logo { font-size: 1.05rem; flex-shrink: 0; }
.tb-mid  { flex:1; display:flex; justify-content:center; gap:4px; }
.tb-tab {
  padding: 7px 14px; border-radius: var(--radius-sm);
  font-size: .76rem; font-weight: 600; color: var(--muted);
  cursor: pointer; transition: all .15s; user-select: none;
}
.tb-tab:hover  { color: var(--text); }
.tb-tab.active { background: var(--amber-low); color: var(--amber); }
.tb-right { display:flex; align-items:center; gap:8px; flex-shrink:0; }

/* ── NOTIF BUTTON ─────────────────────────────────────────────── */
.notif-wrap { position: relative; }
.notif-btn {
  width:38px; height:38px; border-radius:var(--radius-sm);
  background:var(--surface2); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--muted); font-size:.9rem; transition:all .2s;
  position:relative;
}
.notif-btn:hover,
.notif-btn.has-unread { border-color:var(--amber-bdr); color:var(--amber); background:var(--amber-low); }
.notif-dot {
  position:absolute; top:-4px; right:-4px;
  min-width:16px; height:16px; border-radius:99px;
  background:var(--red); color:#fff;
  font-size:.52rem; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  padding: 0 3px;  pointer-events:none;
}

/* filter/sort dropdown animation */
@keyframes genieDropOpen {
  from { opacity:0; transform: translateY(-6px) scale(.97); transform-origin: top right; }
  to   { opacity:1; transform: translateY(0)    scale(1);   transform-origin: top right; }
}
@keyframes genieDropClose {
  from { opacity:1; transform: translateY(0)    scale(1);   transform-origin: top right; }
  to   { opacity:0; transform: translateY(-5px) scale(.97); transform-origin: top right; }
}


/* ── NOTIFICATION MODAL ───────────────────────────────────────── */
.notif-modal-backdrop {
  position: fixed; inset: 0; z-index: 800;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transition: opacity .25s ease, visibility .25s ease;
}
.notif-modal-backdrop.open {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}

.notif-modal {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 20px; width: 100%; max-width: 420px;
  max-height: 82vh; display: flex; flex-direction: column;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0,0,0,.65);
  opacity: 0; pointer-events: none;
  transform: translateY(12px);
  transition: opacity .25s ease, transform .25s ease;
}
.notif-modal-backdrop.open .notif-modal {
  opacity: 1; pointer-events: all;
  transform: translateY(0);
}
.notif-modal-backdrop.closing .notif-modal {
  opacity: 0;
  transform: translateY(8px);
}

/* MODAL HEADER */
.nm-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px 12px; flex-shrink: 0;
}
.nm-title { font-size: 1rem; font-weight: 700; letter-spacing: -.3px; }
.nm-close-btn {
  width:32px; height:32px; border-radius:9px;
  background:var(--surface2); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--muted); font-size:.82rem;
  transition: all .15s;
}
.nm-close-btn:hover { border-color:var(--red); color:var(--red); background:rgba(239,68,68,.08); }

/* CHIPS ROW */
.nm-chips {
  display:flex; gap:6px; padding:0 18px 12px; flex-shrink:0;
}
.nm-chip {
  display:flex; align-items:center; gap:5px;
  padding: 5px 12px; border-radius: var(--radius-sm);
  font-size:.71rem; font-weight:700;
  background:var(--surface2); border:1px solid var(--border);
  color:var(--muted); cursor:pointer; transition:all .15s; user-select:none;
}
.nm-chip.active { background:var(--amber-low); border-color:var(--amber-bdr); color:var(--amber); }
.nm-chip:hover:not(.active) { color:var(--text); }
.nm-chip-count {
  background:rgba(255,255,255,.08); border-radius:99px;
  padding:1px 6px; font-size:.62rem; font-weight:800;
  min-width:18px; text-align:center;
}
.nm-chip.active .nm-chip-count { background:rgba(251,191,36,.2); }

/* MARK ALL ROW */
.nm-mark-row {
  display:flex; justify-content:flex-end;
  padding: 0 18px 10px; flex-shrink:0;
  border-bottom: 1px solid var(--border);
}
.nm-mark-all {
  font-size:.72rem; color:var(--amber); cursor:pointer; font-weight:600;
  display:flex; align-items:center; gap:5px;
}
.nm-mark-all:hover { text-decoration: underline; }

/* NOTIF LIST */
.nm-list { flex:1; overflow-y:auto; }
.nm-list::-webkit-scrollbar { width:3px; }
.nm-list::-webkit-scrollbar-thumb { background:var(--border); border-radius:2px; }

/* NOTIF ITEM */
.nd-item {
  display:flex; gap:12px; align-items:flex-start;
  padding:14px 18px; border-bottom:1px solid var(--border);
  cursor:pointer; transition:background .15s;
  position:relative;
   margin-top: 1px;
}
.nd-item:last-child { border-bottom:none; }
.nd-item:hover { background:rgba(255,255,255,.025); }
.nd-item.unread { background:rgba(251,191,36,.07); }
.nd-item.unread::before {
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:3px; background:var(--amber); border-radius:0 2px 2px 0;
}
.nd-item.nm-hidden { display:none; }

.nd-ic {
  width:32px; height:32px; border-radius:9px;
  background:var(--amber-low); border:1px solid var(--amber-bdr);
  display:flex; align-items:center; justify-content:center;
  font-size:.75rem; color:var(--amber); flex-shrink:0; margin-top:1px;
}
.nd-ic.info    { background:rgba(96,165,250,.1);  border-color:rgba(96,165,250,.25);  color:#60a5fa; }
.nd-ic.success { background:var(--green-low);      border-color:var(--green-bdr);      color:var(--green); }
.nd-ic.warning { background:rgba(251,146,60,.1);  border-color:rgba(251,146,60,.25);  color:#fb923c; }
.nd-body { flex:1; min-width:0; }
.nd-text { font-size:.78rem; color:var(--text); line-height:1.5; }
.nd-time { font-size:.65rem; color:var(--muted); margin-top:4px; font-family:'JetBrains Mono',monospace; }

.nm-empty {
  padding:48px 20px; text-align:center;
  font-size:.8rem; color:var(--muted);
}
.nm-empty i { font-size:1.8rem; opacity:.2; display:block; margin-bottom:10px; }

/* ── WRAPPER + STATS ──────────────────────────────────────────── */
.wrapper { max-width:760px; margin:0 auto; padding:28px 20px 120px; }

.head-stats { display:flex; gap:10px; margin-bottom:26px; flex-wrap:wrap; }
.hst {
  flex:1; min-width:80px;
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-md); padding:13px 16px;
  display:flex; align-items:center; gap:10px;
  /* stagger reveal */
  opacity:0; transform:translateY(12px);
  animation: statReveal .4s ease forwards;
}
.hst:nth-child(1){ animation-delay:.05s }
.hst:nth-child(2){ animation-delay:.12s }
.hst:nth-child(3){ animation-delay:.19s }
@keyframes statReveal { to { opacity:1; transform:translateY(0); } }
.hst-icon { font-size:.9rem; opacity:.65; }
.hst-num  { font-size:1.35rem; font-weight:800; letter-spacing:-.5px; line-height:1; }
.hst-lbl  { font-size:.58rem; color:var(--label); text-transform:uppercase; letter-spacing:1.2px; margin-top:2px; font-weight:700; }

/* ── CONTROLS ROW ─────────────────────────────────────────────── */
.controls-row { display:flex; gap:8px; margin-bottom:14px; align-items:center; }

/* SEARCH */
.search-wrap {
  flex:1; position:relative;
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-md);
  display:flex; align-items:center; transition:border-color .2s;
  overflow:hidden;
}
.search-wrap:focus-within { border-color:var(--amber-bdr); }
.search-icon { position:absolute; left:14px; color:var(--muted); font-size:.82rem; pointer-events:none; flex-shrink:0; }
.search-wrap input {
  background:transparent; border:none; outline:none;
  color:var(--text); font-family:'Inter',sans-serif;
  font-size:.83rem; padding:11px 14px 11px 40px; width:100%;
  /* hide on scroll blur handled by JS */
}
.search-wrap input::placeholder { color: var(--label); opacity: .75; }

/* ── THEME TOGGLE BTN ─────────────────────────── */
.theme-toggle-btn {
  width: 38px; height: 38px; border-radius: var(--radius-sm);
  background: var(--surface2); border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--muted); font-size: .88rem;
  transition: all .18s; flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
}
.theme-toggle-btn:hover { color: var(--amber); border-color: var(--amber-bdr); background: var(--amber-low); }

/* Change 5: inline result chip */
.search-result-chip {
  flex-shrink:0; margin-right:10px;
  background:var(--amber-low); border:1px solid var(--amber-bdr);
  color:var(--amber); padding:3px 10px; border-radius:99px;
  font-size:.65rem; font-weight:700; white-space:nowrap;
  animation: chipPop .2s ease;
}
@keyframes chipPop { from{opacity:0;transform:scale(.8)} to{opacity:1;transform:scale(1)} }

/* ── FILTERSORT BUTTON ────────────────────────────────────────── */
.filtersort-wrap { position:relative; flex-shrink:0; }
.filtersort-btn {
  width:42px; height:42px; border-radius:var(--radius-md);
  background:var(--surface); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--muted); font-size:.95rem;
  transition:all .2s; user-select:none;
  position:relative; overflow:hidden;
}
.filtersort-btn:hover,
.filtersort-btn.open { border-color:var(--amber-bdr); color:var(--amber); background:var(--amber-low); }
.fs-active-dot {
  position:absolute; top:6px; right:6px;
  width:6px; height:6px; border-radius:50%;
  background:var(--amber); display:none; border:1px solid var(--bg);
}
.filtersort-btn.has-active .fs-active-dot { display:block; }

/* GENIE dropdown */
.filtersort-dropdown {
  position:absolute; top:calc(100% + 6px); right:0;
  width:210px; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-md);
  box-shadow:0 16px 48px rgba(0,0,0,.55);
  z-index:500; overflow:hidden;
  /* hidden state */
  opacity:0; pointer-events:none;
  transform-origin: top right;
}
.filtersort-dropdown.genie-drop-open  {
  pointer-events:all;
  animation: genieDropOpen  .3s cubic-bezier(.25,.46,.45,.94) forwards;
}
.filtersort-dropdown.genie-drop-close {
  pointer-events:none;
  animation: genieDropClose .2s cubic-bezier(.55,.06,.68,.19) forwards;
}

.fsd-section-label {
  padding:10px 14px 6px;
  font-size:.6rem; font-weight:700; color:var(--label);
  letter-spacing:1.5px; text-transform:uppercase;
}
.fsd-section-label:not(:first-child) {
  border-top:1px solid var(--border); margin-top:4px; padding-top:12px;
}
.fsd-option {
  display:flex; align-items:center; gap:10px;
  padding:10px 14px; font-size:.78rem; color:var(--muted);
  cursor:pointer; transition:background .12s,color .12s;
  user-select:none; position:relative; overflow:hidden;
}
.fsd-option i:first-child { font-size:.72rem; width:14px; text-align:center; }
.fsd-option:hover  { background:rgba(255,255,255,.035); color:var(--text); }
.fsd-option.active { color:var(--amber); background:var(--amber-low); }
.fsd-check { margin-left:auto; font-size:.65rem; color:var(--amber); display:none; }
.fsd-option.active .fsd-check { display:block; }
.fsd-divider { height:1px; background:var(--border); margin:4px 0; }

/* ── ACCORDION ────────────────────────────────────────────────── */
.accordion { display:flex; flex-direction:column; gap:8px; }

/* stagger reveal */
.acc-item {
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); overflow:hidden;
  transition:border-color .3s;
  opacity:0; transform:translateY(16px);
  animation: accReveal .4s ease forwards;
}
@keyframes accReveal { to { opacity:1; transform:translateY(0); } }
.acc-item.open { border-color:var(--amber-bdr); }

.acc-head {
  display:flex; align-items:center; gap:12px;
  padding:15px 16px; cursor:pointer;
  position:relative; overflow:hidden; user-select:none;
}
.acc-head:hover { background:rgba(255,255,255,.018); }

/* ripple */
.ripple {
  position:absolute; border-radius:50%;
  background:rgba(251,191,36,.16);
  transform:scale(0); pointer-events:none;
  animation:rippleAnim .55s ease-out forwards;
}
@keyframes rippleAnim { to { transform:scale(5); opacity:0; } }

.acc-icon-box {
  width:44px; height:44px; border-radius:12px;
  background:var(--surface2); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem; flex-shrink:0; transition:border-color .3s;
}
.acc-item.open .acc-icon-box { border-color:var(--amber-bdr); }

.acc-title { flex:1; min-width:0; }
.acc-name  { font-size:.9rem; font-weight:600; letter-spacing:-.2px; margin-bottom:3px; }
.acc-time  {
  font-size:.68rem; color:var(--muted); font-family:'JetBrains Mono',monospace;
  display:flex; align-items:center; gap:5px;
  max-height:30px; overflow:hidden; opacity:1;
  transition:max-height .35s ease,opacity .25s ease,margin .35s ease;
}
.acc-time i { font-size:.6rem; }
.acc-item.open .acc-time { max-height:0; opacity:0; margin:0; overflow:hidden; }

.acc-right { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.badge { font-size:.58rem; font-weight:700; padding:4px 10px; border-radius:7px; letter-spacing:.4px; }
.badge.free { background:var(--green-low); color:var(--green); border:1px solid var(--green-bdr); }
.badge.paid { background:var(--amber-low); color:var(--amber); border:1px solid var(--amber-bdr); }
.acc-chevron {
  color:var(--muted); font-size:.72rem;
  transition:transform .35s ease,color .25s; flex-shrink:0;
}
.acc-item.open .acc-chevron { transform:rotate(180deg); color:var(--amber); }

/* smooth grid-row expand */
.acc-body {
  display:grid; grid-template-rows:0fr;
  transition:grid-template-rows .38s cubic-bezier(.4,0,.2,1);
}
.acc-item.open .acc-body { grid-template-rows:1fr; }
.acc-body-inner { overflow:hidden; }
.acc-content {
  padding:16px 18px 20px; border-top:1px solid var(--border);
  opacity:0; transform:translateY(4px);
  transition:opacity .25s ease .1s,transform .25s ease .1s;
}
.acc-item.open .acc-content { opacity:1; transform:translateY(0); }

.ac-desc { font-size:.8rem; color:var(--muted); line-height:1.7; margin-bottom:14px; }
.ac-meta-row { display:flex; align-items:center; gap:16px; margin-bottom:14px; flex-wrap:wrap; }
.ac-date-full {
  display:flex; align-items:center; gap:6px;
  font-family:'JetBrains Mono',monospace; font-size:.67rem; color:var(--muted);
}
.ac-date-full i { font-size:.62rem; }
.ac-tags { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px; }
.ac-tag {
  background:var(--bg); border:1px solid var(--border);
  color:var(--muted); padding:3px 10px; border-radius:6px;
  font-size:.63rem; font-weight:600; display:flex; align-items:center; gap:4px;
}
.ac-tag i { font-size:.55rem; }
.ac-launch-btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 20px; border-radius:9px; font-weight:700; font-size:.78rem;
  cursor:pointer; font-family:'Inter',sans-serif; border:none;
  transition:opacity .2s; position:relative; overflow:hidden;
}
.ac-launch-btn.free-btn { background:var(--amber); color:#000; }
.ac-launch-btn.free-btn:hover { opacity:.85; }
.ac-launch-btn.paid-btn { background:var(--surface2); color:var(--amber); border:1px solid var(--amber-bdr); }
.ac-launch-btn.paid-btn:hover { background:var(--amber-low); }

/* ── EMPTY / ERROR ────────────────────────────────────────────── */
.empty-state { text-align:center; padding:60px 20px; color:var(--muted); font-size:.82rem; }
.empty-state i { font-size:2rem; opacity:.2; display:block; margin-bottom:12px; }
.empty-state strong { display:block; font-size:.95rem; color:var(--text); margin-bottom:4px; font-weight:600; }

/* ── IFRAME OVERLAY ───────────────────────────────────────────── */
#iframeOverlay {
  position:fixed; inset:0; z-index:500;
  background:var(--bg); display:none; flex-direction:column;
}
#iframeOverlay.show { display:flex; }
.iframe-topbar {
  height:52px; background:var(--surface); border-bottom:1px solid var(--border);
  display:flex; align-items:center; gap:12px; padding:0 16px; flex-shrink:0;
}
.iframe-back {
  width:34px; height:34px; border-radius:9px;
  background:var(--surface2); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--text); font-size:.85rem; transition:all .15s;
}
.iframe-back:hover { border-color:var(--amber-bdr); color:var(--amber); }
.iframe-title { font-size:.85rem; font-weight:600; flex:1; }
.iframe-url {
  font-size:.68rem; color:var(--muted); font-family:'JetBrains Mono',monospace;
  max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
#toolIframe { flex:1; border:none; width:100%; display:block; }

/* ── PAID MODAL ───────────────────────────────────────────────── */
.modal-backdrop {
  position:fixed; inset:0; z-index:600;
  background:rgba(0,0,0,.7); backdrop-filter:blur(4px);
  align-items:center; justify-content:center; padding:20px; display:none;
}
.modal-backdrop.show { display:flex; }
.modal {
  background:var(--surface); border:1px solid var(--border);
  border-radius:20px; padding:32px 28px; max-width:380px; width:100%;
  animation:modalIn .22s ease; text-align:center;
}
@keyframes modalIn { from{opacity:0;transform:scale(.94) translateY(10px)} to{opacity:1;transform:none} }
.modal-icon-ring {
  width:68px; height:68px; border-radius:50%;
  background:var(--amber-low); border:2px solid var(--amber-bdr);
  display:flex; align-items:center; justify-content:center;
  font-size:1.8rem; margin:0 auto 20px;
}
.modal h2 { font-size:1.1rem; font-weight:700; letter-spacing:-.3px; margin-bottom:8px; }
.modal p  { font-size:.8rem; color:var(--muted); line-height:1.65; margin-bottom:24px; }
.modal-wa-btn {
  display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%; padding:13px; background:var(--wa); color:#fff; border:none;
  border-radius:12px; font-size:.88rem; font-weight:700;
  cursor:pointer; font-family:'Inter',sans-serif; margin-bottom:12px; transition:opacity .2s;
}
.modal-wa-btn:hover { opacity:.9; }
.modal-close-btn {
  width:100%; padding:11px; background:transparent; color:var(--muted);
  border:1px solid var(--border); border-radius:12px;
  font-size:.82rem; font-weight:600; cursor:pointer;
  font-family:'Inter',sans-serif; transition:all .15s;
}
.modal-close-btn:hover { color:var(--text); border-color:var(--muted); }

/* ── FLOAT WA ─────────────────────────────────────────────────── */
.float-wa {
  position:fixed; bottom:24px; right:20px; z-index:400;
  width:52px; height:52px; border-radius:50%;
  background:var(--wa); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; box-shadow:0 4px 20px rgba(37,211,102,.35);
  transition:transform .2s,box-shadow .2s; text-decoration:none;
}
.float-wa:hover { transform:scale(1.1); box-shadow:0 6px 28px rgba(37,211,102,.5); }

/* ── TOAST ────────────────────────────────────────────────────── */
.toast {
  position:fixed; bottom:90px; left:50%;
  transform:translateX(-50%) translateY(20px);
  background:var(--surface2); border:1px solid var(--border);
  color:var(--text); padding:10px 20px; border-radius:99px;
  font-size:.78rem; font-weight:500; white-space:nowrap;
  opacity:0; pointer-events:none; transition:all .25s; z-index:700;
}
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* ── RESPONSIVE ───────────────────────────────────────────────── */
@media (max-width:560px) {
  .tb-mid { display:none; }
  .iframe-url { display:none; }
  .acc-content { padding:14px; }
}

/* ── LIGHT THEME SPECIFIC OVERRIDES ──────────────────────────── */
[data-theme="light"] .acc-head:hover { background: rgba(0,0,0,.025); }
[data-theme="light"] .nd-item:hover  { background: rgba(0,0,0,.03); }
[data-theme="light"] .fsd-option:hover { background: rgba(0,0,0,.04); color: var(--text); }
[data-theme="light"] .tbl tr:hover td { background: rgba(0,0,0,.02); }
[data-theme="light"] .nm-chip-count { background: rgba(0,0,0,.07); }
[data-theme="light"] .nm-chip.active .nm-chip-count { background: rgba(217,119,6,.18); }
[data-theme="light"] .nd-item.unread { background: rgba(217,119,6,.07); }
[data-theme="light"] .ac-tag { background: var(--surface2); }
[data-theme="light"] .filtersort-dropdown { box-shadow: 0 8px 32px rgba(0,0,0,.12); }