:root{
  --accent:#9a72f6;
  --accent-rgb:154,114,246;
  --accent-soft:rgba(154,114,246,.12);
  --accent-line:rgba(178,150,255,.34);
}

/* 1. Background - no vertical stripes, only soft depth and light */
body{
  background:
    radial-gradient(900px 620px at 12% -12%, rgba(142,102,232,.15), transparent 66%),
    radial-gradient(820px 620px at 88% 8%, rgba(77,65,138,.12), transparent 68%),
    radial-gradient(620px 520px at 50% 74%, rgba(104,82,168,.055), transparent 72%),
    linear-gradient(180deg,#080a12 0%,#090b14 42%,#070910 100%);
  background-attachment:fixed;
}
body:before{
  background:
    radial-gradient(circle at 76% -8%, rgba(172,137,255,.11), transparent 31%),
    radial-gradient(circle at 22% 22%, rgba(255,255,255,.025), transparent 23%);
  opacity:1;
}
html[data-theme="light"] body{
  background:
    radial-gradient(900px 620px at 10% -10%, rgba(152,116,240,.10), transparent 67%),
    radial-gradient(760px 560px at 88% 7%, rgba(142,154,190,.10), transparent 70%),
    linear-gradient(180deg,#f6f7fb 0%,#f0f3f9 50%,#f5f6fa 100%);
}
html[data-theme="light"] body:before{
  background:radial-gradient(circle at 78% -8%,rgba(155,119,247,.08),transparent 31%);
}

/* 2. Exact chosen logo lockup extracted from the approved reference */
.brand-lockup{
  width:238px;
  height:auto;
  max-height:58px;
  object-fit:contain;
  object-position:left center;
  filter:drop-shadow(0 0 18px rgba(151,112,245,.12));
}
.footer-lockup{width:275px;max-height:76px}
.site-header .brand{min-width:238px}

/* 3. Typography / vertical alignment fixes */
button,.primary-btn,.ghost-btn,.icon-btn,.text-btn,.menu-btn,.notification-button,.login-btn,
input,textarea,select,.status-pill,.badge-dot{
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
button,.primary-btn,.ghost-btn,.icon-btn,.text-btn,.menu-btn,.notification-button,.login-btn{
  line-height:1.05;
  vertical-align:middle;
}
.primary-btn,.ghost-btn,.login-btn{
  min-height:44px;
  padding-top:0;
  padding-bottom:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
}
.primary-btn.compact,.ghost-btn.compact,.login-btn.compact{min-height:40px}
.text-btn{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:3px 2px}
input,select{min-height:46px;line-height:1.25}
textarea{line-height:1.5}
label{line-height:1.3}
label.check,.check{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:40px;
  line-height:1.2;
  margin:0;
}
label.check input[type="checkbox"],.check input[type="checkbox"]{
  width:18px;
  height:18px;
  min-height:18px;
  margin:0;
  flex:0 0 18px;
  accent-color:var(--accent);
}
.filter-actions-v110,.filter-actions-v109,.staff-message-filter .inline-actions{
  align-items:center;
  row-gap:8px;
}
.filter-actions-v110 .ghost-btn,.filter-actions-v109 .ghost-btn{align-self:center}
.status-pill{display:inline-flex;align-items:center;justify-content:center;min-height:28px;line-height:1;padding:5px 10px}

/* Cleaner header spacing with exact lockup */
.header-inner{gap:24px}
.desktop-nav{margin-left:auto}
.header-actions{margin-left:10px}

/* Slight polish for buttons so text cannot visually float */
.primary-btn,.ghost-btn,.composer-tool-v112,.icon-chip-v110{
  font-weight:700;
  letter-spacing:-.01em;
}
.primary-btn{box-shadow:0 14px 30px rgba(var(--accent-rgb),.24)}
.ghost-btn{box-shadow:none}

/* 4. Completely rebuilt chat composer */
.chat-compose-v112{
  position:relative;
  padding:16px 20px 22px;
  border-top:1px solid color-mix(in srgb,var(--line) 88%,transparent);
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface2) 97%,transparent),color-mix(in srgb,var(--surface) 100%,transparent));
}
.composer-shell-v112{
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--line) 92%,transparent);
  border-radius:24px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%,var(--accent) 1.5%),color-mix(in srgb,var(--surface2) 100%,transparent));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 14px 32px rgba(0,0,0,.12);
  transition:border-color .18s ease,box-shadow .18s ease;
}
.composer-shell-v112:focus-within{
  border-color:rgba(var(--accent-rgb),.42);
  box-shadow:0 0 0 4px rgba(var(--accent-rgb),.07),0 16px 34px rgba(0,0,0,.16);
}
.composer-shell-v112 textarea{
  display:block;
  width:100%;
  min-height:74px;
  max-height:180px;
  padding:17px 18px 12px;
  margin:0;
  border:0!important;
  border-radius:0;
  background:transparent!important;
  box-shadow:none!important;
  resize:none;
  color:var(--text);
  line-height:1.48;
}
.composer-shell-v112 textarea:focus{outline:none;box-shadow:none!important}
.composer-shell-v112 textarea::placeholder{color:color-mix(in srgb,var(--muted) 82%,transparent)}
.composer-toolbar-v112{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px 11px;
  border-top:1px solid color-mix(in srgb,var(--line) 76%,transparent);
}
.composer-tools-v112,.composer-send-v112{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.composer-tools-v112{flex-wrap:wrap}
.composer-send-v112{justify-content:flex-end}
.composer-tool-v112{
  min-height:38px;
  padding:0 13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid color-mix(in srgb,var(--line) 90%,transparent);
  border-radius:13px;
  background:color-mix(in srgb,var(--surface2) 98%,var(--accent) 2%);
  color:var(--muted);
  cursor:pointer;
  transition:.18s ease;
  white-space:nowrap;
}
.composer-tool-v112 span{
  color:#c8b3ff;
  font-size:1rem;
  line-height:1;
}
.composer-tool-v112:hover,.composer-tool-v112[aria-expanded="true"]{
  color:var(--text);
  border-color:rgba(var(--accent-rgb),.34);
  background:rgba(var(--accent-rgb),.10);
}
.composer-submit-v112{
  min-width:112px;
  min-height:42px;
  border-radius:14px;
}
.composer-file-chip-v112{
  max-width:260px;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0 8px 0 12px;
  border-radius:12px;
  border:1px solid rgba(var(--accent-rgb),.26);
  background:rgba(var(--accent-rgb),.08);
  color:var(--text);
  font-size:.82rem;
}
.composer-file-chip-v112[hidden]{display:none}
.composer-file-chip-v112>span{
  max-width:210px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.composer-file-chip-v112 button{
  width:26px;
  height:26px;
  padding:0;
  display:grid;
  place-items:center;
  border:0;
  border-radius:9px;
  background:rgba(255,255,255,.05);
  color:var(--muted);
  cursor:pointer;
}
.composer-popover-v112{
  position:absolute;
  z-index:30;
  left:24px;
  bottom:86px;
  width:min(360px,calc(100% - 48px));
  padding:9px;
  border:1px solid color-mix(in srgb,var(--line) 92%,transparent);
  border-radius:18px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 98%,var(--accent) 2%),color-mix(in srgb,var(--surface2) 100%,transparent));
  box-shadow:0 22px 56px rgba(0,0,0,.34);
  backdrop-filter:blur(16px);
}
.composer-popover-v112[hidden]{display:none}
.composer-popover-v112.quick{width:min(330px,calc(100% - 48px))}
.composer-popover-head-v112{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:8px 9px 10px;
  color:var(--text);
}
.composer-popover-head-v112 button{
  width:30px;
  height:30px;
  padding:0;
  border:0;
  border-radius:10px;
  background:var(--soft);
  color:var(--muted);
  cursor:pointer;
}
.composer-popover-v112>button,
.quick-replies-v112 button{
  width:100%;
  min-height:42px;
  padding:9px 11px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:var(--text);
  text-align:left;
  cursor:pointer;
  line-height:1.25;
}
.composer-popover-v112>button:hover,.quick-replies-v112 button:hover{
  background:rgba(var(--accent-rgb),.09);
}
.quick-replies-v112{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.quick-replies-v112 button{text-align:center;border:1px solid color-mix(in srgb,var(--line) 82%,transparent);background:var(--soft)}

/* Chat window keeps enough room for the improved composer */
.chat-thread-v110{min-width:0}
.chat-messages-v110{min-height:500px}

/* Light theme composer */
html[data-theme="light"] .composer-shell-v112{
  background:linear-gradient(180deg,#fff,#f9faff);
  box-shadow:0 12px 28px rgba(48,59,91,.07);
}
html[data-theme="light"] .composer-tool-v112{background:#f6f7fb}
html[data-theme="light"] .composer-popover-v112{background:linear-gradient(180deg,#fff,#f8f9fd);box-shadow:0 20px 50px rgba(41,51,82,.14)}

/* Mobile */
@media(max-width:1060px){
  .site-header .brand{min-width:205px}
  .brand-lockup{width:205px;max-height:52px}
}
@media(max-width:820px){
  .site-header .brand{min-width:180px}
  .brand-lockup{width:180px;max-height:46px}
  .composer-toolbar-v112{align-items:flex-end}
}
@media(max-width:720px){
  .chat-compose-v112{padding:12px 12px 14px}
  .composer-shell-v112{border-radius:21px}
  .composer-shell-v112 textarea{min-height:68px;padding:15px 15px 10px}
  .composer-toolbar-v112{display:grid;gap:10px;padding:9px 10px 10px}
  .composer-tools-v112{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .composer-tool-v112{width:100%;min-width:0;padding:0 7px;font-size:.78rem;white-space:normal;text-align:center}
  .composer-send-v112{width:100%;justify-content:space-between}
  .composer-file-chip-v112{max-width:calc(100% - 116px)}
  .composer-submit-v112{min-width:108px}
  .composer-popover-v112,.composer-popover-v112.quick{left:12px;bottom:91px;width:calc(100% - 24px)}
}
@media(max-width:580px){
  .site-header .brand{min-width:138px}
  .brand-lockup{width:138px;max-height:40px}
  .footer-lockup{width:220px;max-height:66px}
  .primary-btn,.ghost-btn{white-space:normal;text-align:center}
  .composer-tools-v112{grid-template-columns:1fr 1fr 1fr}
  .composer-tool-v112 span{display:none}
  .composer-tool-v112{font-size:.74rem;padding:0 5px}
  .composer-send-v112{align-items:stretch}
  .composer-file-chip-v112{max-width:calc(100% - 104px)}
  .composer-submit-v112{min-width:98px;padding:0 13px}
  .quick-replies-v112{grid-template-columns:1fr 1fr}
}
.hero-core img{filter:none!important;width:78px!important;max-height:64px;object-fit:contain}