/* ==================================================================
   AgentIQ — product chrome

   The software's own identity. Loaded on every tool page, AFTER
   theme.css so it wins. Charcoal ground, champagne gold as jewellery.

   IMPORTANT: this styles the APPLICATION only — nav, panels, controls,
   the shell around the work. It deliberately does NOT touch `.page`,
   which is the printed document surface and belongs to the agency
   whose brand is in docBrand. That boundary is the whole product.
   ================================================================== */

:root{
  /* platform palette — AgentIQ */
  --y:#EAD196;              /* champagne gold */
  --ylite:#F4E4BC;
  --ui-yellow:#EAD196;
  --bronze:#B78F4A;
  --bg:#141414;
  --bg2:#1A1A1A;
  --bg3:#1E1E1E;
  --tx:#F5F5F5;
  --tx2:#8E8E86;
  --tx3:#5F5F58;
  --edge:rgba(234,209,150,.13);
  --edge-soft:rgba(255,255,255,.07);
  --disp:'Inter',system-ui,-apple-system,sans-serif;
  --mono:'Montserrat',sans-serif;
}

body{
  background:var(--bg);
  font-family:var(--disp);
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}

/* ---------- the top bar ---------- */
#rb-bar{
  background:rgba(20,20,20,.86)!important;
  backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid var(--edge)!important;
  padding:11px 20px!important;
}
#rb-bar .rb-logo{
  border:1px solid rgba(234,209,150,.32)!important;
  background:transparent!important;
  gap:9px!important;padding:6px 12px!important;
  transition:border-color .3s,background .3s;
}
#rb-bar .rb-logo:hover{background:rgba(234,209,150,.08)!important;border-color:var(--y)!important}
#rb-bar a{color:#9C9C93!important;font-size:12.5px!important;transition:color .25s,background .25s}
#rb-bar a:hover{color:var(--tx)!important;background:rgba(255,255,255,.045)!important}
#rb-bar a.on{background:var(--y)!important;color:#1A1A1A!important;font-weight:600!important}
#rb-signout{color:var(--tx3)!important;font-family:var(--mono);font-size:10.5px!important;
  letter-spacing:.1em;text-transform:uppercase}
#rb-signout:hover{color:var(--y)!important;background:rgba(234,209,150,.08)!important}
#rb-data{color:var(--tx3)!important;font-family:var(--mono);font-size:10px!important;
  letter-spacing:.08em}

/* the platform mark in the bar */
#rb-bar .rb-logo img{display:none}
#rb-bar .rb-logo::before{
  content:"";width:17px;height:17px;flex:none;
  background:currentColor;color:var(--y);
  -webkit-mask:url("mark.svg") center/contain no-repeat;
          mask:url("mark.svg") center/contain no-repeat;
}

/* ---------- panels and controls ---------- */
.panel{
  background:rgba(26,26,26,.72)!important;
  border-right:1px solid var(--edge-soft)!important;
  backdrop-filter:blur(12px);
}
fieldset{border:1px solid var(--edge-soft)!important;border-radius:3px!important;
  background:rgba(255,255,255,.016)}
legend{
  font-family:var(--mono)!important;font-weight:500!important;
  font-size:9.5px!important;letter-spacing:.2em!important;text-transform:uppercase!important;
  color:var(--y)!important;
}
label{font-size:10.5px!important;font-weight:500!important;color:#A7A79E!important;
  letter-spacing:.02em}
input,select,textarea{
  background:rgba(255,255,255,.035)!important;
  border:1px solid var(--edge-soft)!important;
  border-radius:3px!important;color:var(--tx)!important;
  transition:border-color .25s,box-shadow .25s,background .25s;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--y)!important;background:rgba(255,255,255,.05)!important;
  box-shadow:0 0 0 3px rgba(234,209,150,.11)!important;outline:none!important;
}
input::placeholder,textarea::placeholder{color:var(--tx3)!important}

button,.btn{border-radius:3px!important;transition:transform .28s cubic-bezier(.34,1.3,.44,1),
  filter .25s,box-shadow .3s,border-color .25s,color .25s}
button:active,.btn:active{transform:scale(.985)}
button:not(.ghost):not(.g):not(.m){
  background:var(--y)!important;color:#1A1A1A!important;
  font-family:var(--mono)!important;font-weight:600!important;
  letter-spacing:.1em;text-transform:uppercase;font-size:12px!important;
}
button:not(.ghost):not(.g):not(.m):hover{
  filter:brightness(1.05);box-shadow:0 10px 30px -12px rgba(234,209,150,.45);
}
button.ghost,button.g,.btn.g{
  background:transparent!important;border:1px solid var(--edge-soft)!important;
  color:#C4C4BC!important;font-family:var(--mono)!important;font-weight:500!important;
  letter-spacing:.09em;text-transform:uppercase;font-size:11px!important;
}
button.ghost:hover,button.g:hover{border-color:var(--y)!important;color:var(--y)!important}

/* ---------- headings on tool pages ---------- */
.wrap>h1,.stage>h1,body>h1{font-family:var(--disp);font-weight:600;letter-spacing:-.02em}
.micro,.kick{font-family:var(--mono)!important;font-weight:500!important;
  letter-spacing:.22em!important;text-transform:uppercase!important;color:var(--y)!important}

/* ---------- cards and surfaces ---------- */
.card,.tile,.box{
  background:rgba(255,255,255,.022)!important;
  border:1px solid var(--edge-soft)!important;
  border-radius:3px!important;
  transition:border-color .3s,box-shadow .35s,transform .35s cubic-bezier(.16,1,.3,1);
}
.card:hover,.tile:hover{
  border-color:rgba(234,209,150,.26)!important;
  box-shadow:0 22px 55px -28px rgba(0,0,0,.85);
}

/* ---------- the sign-in gate ---------- */
#rb-gate{background:#141414!important}
#rb-gate::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(110% 80% at 72% 6%,rgba(234,209,150,.06),transparent 58%),
    repeating-linear-gradient(135deg,transparent 0 74px,rgba(234,209,150,.022) 74px 75px);
}
#rb-gate .box{position:relative;z-index:1;background:rgba(26,26,26,.94);
  border:1px solid rgba(234,209,150,.16);border-radius:4px;padding:40px 42px;
  box-shadow:0 40px 100px -40px rgba(0,0,0,.9)}
#rb-gate .mark{width:34px;height:34px;color:var(--y);margin-bottom:20px}
#rb-gate .mark svg{width:100%;height:100%;display:block}
#rb-gate h2 b{background:linear-gradient(178deg,#F7EBCE,#EAD196 55%,#B78F4A)!important;
  -webkit-background-clip:text!important;background-clip:text!important}
#rb-gate .who button:hover{border-color:var(--y)!important;background:rgba(234,209,150,.06)!important}
#rb-gate .go{background:var(--y)!important;color:#1A1A1A!important}

/* ---------- links ---------- */
a{color:inherit}
a:not(.btn):not(.rb-logo):hover{color:var(--ylite)}

/* ---------- the printed page is NOT ours ----------
   Everything inside .page belongs to the agency. AgentIQ's palette
   must not leak onto a document a vendor will read. */
.page,.page *{--y:initial;--ui-yellow:initial}
.page{background:#fff}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}
