/* NNWI Guide — institutional navy/gold/cream. Self-scoped under #nnwi-guide-root. */
:root{
  --nnwi-navy:#0d1b2a;
  --nnwi-gold:#c9a227;
  --nnwi-cream:#f7f3e8;
  --nnwi-ink:#16202b;
  --nnwi-line:#d8d2c0;
  --nnwi-shadow:0 8px 30px rgba(13,27,42,.28);
  --nnwi-radius:12px;
}

#nnwi-guide-root,
#nnwi-guide-root *{ box-sizing:border-box; }

/* Launcher button */
#nnwi-guide-root .nnwi-launch{
  position:fixed; right:18px; bottom:18px; z-index:2147483000;
  display:inline-flex; align-items:center; gap:8px;
  background:var(--nnwi-navy); color:var(--nnwi-cream);
  border:2px solid var(--nnwi-gold); border-radius:999px;
  padding:12px 16px; font:600 15px/1 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  cursor:pointer; box-shadow:var(--nnwi-shadow);
}
#nnwi-guide-root .nnwi-launch:hover{ background:#11253a; }
#nnwi-guide-root .nnwi-launch .nnwi-dot{
  width:10px; height:10px; border-radius:50%; background:var(--nnwi-gold); display:inline-block;
}
#nnwi-guide-root .nnwi-launch[hidden]{ display:none; }

/* Panel */
#nnwi-guide-root .nnwi-panel{
  position:fixed; right:18px; bottom:18px; z-index:2147483000;
  width:360px; max-width:calc(100vw - 24px);
  height:560px; max-height:calc(100vh - 36px);
  display:flex; flex-direction:column;
  background:var(--nnwi-cream); color:var(--nnwi-ink);
  border:1px solid var(--nnwi-line); border-radius:var(--nnwi-radius);
  box-shadow:var(--nnwi-shadow); overflow:hidden;
  font:400 15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
#nnwi-guide-root .nnwi-panel[hidden]{ display:none; }

#nnwi-guide-root .nnwi-head{
  background:var(--nnwi-navy); color:var(--nnwi-cream);
  padding:12px 14px; display:flex; align-items:center; gap:10px;
  border-bottom:3px solid var(--nnwi-gold);
}
#nnwi-guide-root .nnwi-head h2{ margin:0; font-size:15px; font-weight:700; letter-spacing:.2px; }
#nnwi-guide-root .nnwi-head p{ margin:0; font-size:12px; opacity:.8; }
#nnwi-guide-root .nnwi-head .nnwi-titles{ flex:1; min-width:0; }
#nnwi-guide-root .nnwi-head button{
  background:transparent; color:var(--nnwi-cream); border:0; cursor:pointer;
  width:32px; height:32px; border-radius:8px; font-size:18px; line-height:1;
}
#nnwi-guide-root .nnwi-head button:hover{ background:rgba(255,255,255,.12); }

#nnwi-guide-root .nnwi-log{
  flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:10px;
  background:var(--nnwi-cream);
}

/* Message bubbles */
#nnwi-guide-root .nnwi-msg{ max-width:88%; padding:10px 12px; border-radius:12px; }
#nnwi-guide-root .nnwi-bot{ align-self:flex-start; background:#fff; border:1px solid var(--nnwi-line); }
#nnwi-guide-root .nnwi-user{ align-self:flex-end; background:var(--nnwi-navy); color:var(--nnwi-cream); }
#nnwi-guide-root .nnwi-safe{ border-left:4px solid #b00020; background:#fff6f6; }

/* Quick-reply chips */
#nnwi-guide-root .nnwi-chips{ display:flex; flex-wrap:wrap; gap:8px; }
#nnwi-guide-root .nnwi-chip{
  background:#fff; color:var(--nnwi-navy);
  border:1.5px solid var(--nnwi-gold); border-radius:999px;
  padding:7px 12px; font-size:13.5px; font-weight:600; cursor:pointer;
}
#nnwi-guide-root .nnwi-chip:hover{ background:var(--nnwi-gold); color:var(--nnwi-navy); }

/* Page / category links */
#nnwi-guide-root .nnwi-links{ display:flex; flex-direction:column; gap:6px; }
#nnwi-guide-root .nnwi-link{
  display:inline-flex; align-items:center; gap:8px;
  color:var(--nnwi-navy); font-weight:600; text-decoration:none;
  border:1px solid var(--nnwi-line); background:#fff; border-radius:8px; padding:8px 10px;
}
#nnwi-guide-root .nnwi-link:hover{ border-color:var(--nnwi-gold); }
#nnwi-guide-root .nnwi-link.nnwi-quote{ background:var(--nnwi-gold); border-color:var(--nnwi-gold); color:var(--nnwi-navy); }

/* Product cards */
#nnwi-guide-root .nnwi-prods{ display:flex; flex-direction:column; gap:8px; }
#nnwi-guide-root .nnwi-card{
  display:flex; gap:10px; align-items:center; text-decoration:none;
  background:#fff; border:1px solid var(--nnwi-line); border-radius:10px; padding:8px;
  color:var(--nnwi-ink);
}
#nnwi-guide-root .nnwi-card:hover{ border-color:var(--nnwi-gold); }
#nnwi-guide-root .nnwi-card img{ width:48px; height:48px; object-fit:contain; border-radius:6px; background:#fff; flex:0 0 auto; }
#nnwi-guide-root .nnwi-card .nnwi-cn{ font-weight:600; font-size:14px; }
#nnwi-guide-root .nnwi-card .nnwi-cp{ font-size:12.5px; color:#5b6470; }
#nnwi-guide-root .nnwi-card .nnwi-view{ margin-left:auto; color:var(--nnwi-navy); font-weight:700; font-size:13px; white-space:nowrap; }

/* Composer */
#nnwi-guide-root .nnwi-foot{
  border-top:1px solid var(--nnwi-line); background:#fff; padding:8px;
}
#nnwi-guide-root .nnwi-form{ display:flex; gap:8px; }
#nnwi-guide-root .nnwi-input{
  flex:1; border:1px solid var(--nnwi-line); border-radius:8px; padding:10px 12px; font-size:14px;
}
#nnwi-guide-root .nnwi-input:focus{ outline:2px solid var(--nnwi-gold); outline-offset:1px; }
#nnwi-guide-root .nnwi-send{
  background:var(--nnwi-navy); color:var(--nnwi-cream); border:0; border-radius:8px;
  padding:0 14px; font-weight:700; cursor:pointer;
}
#nnwi-guide-root .nnwi-send:hover{ background:#11253a; }
#nnwi-guide-root .nnwi-disclaim{ font-size:11px; color:#5b6470; padding:6px 4px 2px; text-align:center; }

/* Visible keyboard focus everywhere */
#nnwi-guide-root :focus-visible{ outline:3px solid var(--nnwi-gold); outline-offset:2px; border-radius:6px; }

/* Mobile: bottom-sheet feel, never wider than the viewport */
@media (max-width:480px){
  #nnwi-guide-root .nnwi-panel{
    right:8px; left:8px; bottom:8px; width:auto; max-width:none;
    height:78vh; max-height:78vh;
  }
  #nnwi-guide-root .nnwi-launch{ right:12px; bottom:12px; }
}

/* Respect reduced-motion + forced-colors */
@media (prefers-reduced-motion:reduce){
  #nnwi-guide-root *{ transition:none !important; animation:none !important; }
}
