/* =========================================================
   XSELLER AI V3.6.3-R4 — FINAL UI POLISH
   UI-only overlay. Loaded after R3.1.
   ========================================================= */

:root{
  --r4-bg:#0b0e12;
  --r4-bg-2:#0e1116;
  --r4-sidebar:#0e1115;
  --r4-surface:#15191f;
  --r4-surface-2:#191e25;
  --r4-surface-3:#20262e;
  --r4-input:#101419;
  --r4-border:#292f38;
  --r4-border-soft:#222831;
  --r4-text:#f1f3f5;
  --r4-text-2:#aeb4be;
  --r4-text-3:#757d89;
  --r4-accent:#a44156;
  --r4-accent-hover:#b94d64;
  --r4-accent-deep:#823244;
  --r4-accent-soft:rgba(164,65,86,.115);
  --r4-accent-border:rgba(185,77,100,.27);
  --r4-success:#3bb47d;
  --r4-warning:#d4a14b;
  --r4-danger:#c95865;
  --r4-radius:12px;
  --r4-radius-sm:9px;
  --r4-shadow:0 18px 46px rgba(0,0,0,.20);
}

html{
  color-scheme:dark;
  background:var(--r4-bg)!important;
}
body{
  color:var(--r4-text)!important;
  background:
    radial-gradient(950px 520px at 76% -10%,rgba(122,40,58,.055),transparent 62%),
    linear-gradient(180deg,var(--r4-bg-2),var(--r4-bg))!important;
  font-family:"Be Vietnam Pro","Inter","Segoe UI",Arial,sans-serif!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body *{box-sizing:border-box}
body ::selection{background:rgba(164,65,86,.28);color:#fff}

body h1,body h2,body h3,body h4{
  color:var(--r4-text)!important;
  text-shadow:none!important;
  letter-spacing:-.032em!important;
}
body p,body small,body label{color:var(--r4-text-2)}
body a{transition:background-color .16s ease,border-color .16s ease,color .16s ease,opacity .16s ease,transform .16s ease}

/* ---------- Forms ---------- */
body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body textarea,
body select{
  color:#edf0f3!important;
  background:var(--r4-input)!important;
  border:1px solid var(--r4-border)!important;
  border-radius:var(--r4-radius-sm)!important;
  box-shadow:none!important;
  outline:none!important;
}
body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body select{min-height:42px}
body textarea{line-height:1.65!important}
body input:focus,body textarea:focus,body select:focus{
  border-color:#6f4854!important;
  box-shadow:0 0 0 3px rgba(164,65,86,.075)!important;
}
body input::placeholder,body textarea::placeholder{color:#626b77!important}

/* ---------- Global buttons: soft wine instead of neon red ---------- */
body button,
body .btn,
body a.btn{
  border-radius:var(--r4-radius-sm)!important;
  font-family:inherit!important;
  text-shadow:none!important;
}
body .btn:not(.ghost):not(.secondary):not(.danger),
body .btnPrimary,
body .ctaPrimary,
body .heroCta,
body .primaryCta,
body button[type="submit"]:not(.ghost):not(.secondary):not(.danger),
body a[href="/app"].btn,
body a[href="/login"].btn,
body a[href="/register"].btn{
  background:linear-gradient(180deg,var(--r4-accent),var(--r4-accent-deep))!important;
  border:1px solid var(--r4-accent-border)!important;
  color:#fff!important;
  box-shadow:0 8px 22px rgba(80,25,38,.14)!important;
}
body .btn:not(.ghost):not(.secondary):not(.danger):hover,
body .btnPrimary:hover,
body .ctaPrimary:hover,
body .heroCta:hover,
body .primaryCta:hover,
body button[type="submit"]:not(.ghost):not(.secondary):not(.danger):hover{
  background:linear-gradient(180deg,var(--r4-accent-hover),#92374b)!important;
  border-color:rgba(201,90,114,.34)!important;
  box-shadow:0 10px 26px rgba(80,25,38,.18)!important;
  transform:translateY(-1px);
}
body .ghost,body .secondary,
body a[class*="secondary"],body button[class*="secondary"]{
  background:#14181e!important;
  border-color:var(--r4-border)!important;
  color:#d5d9df!important;
  box-shadow:none!important;
}

/* ---------- Accent/status language ---------- */
body .eyebrow,
body .admEyebrow,
body .platformEyebrow,
body [class*="eyebrow"]{
  color:#c36d80!important;
  text-shadow:none!important;
}
body .cost,
body .hot,
body .new,
body .badge.hot,
body .packageType{
  color:#ce7a8b!important;
  background:rgba(164,65,86,.08)!important;
  border-color:var(--r4-accent-border)!important;
  box-shadow:none!important;
}
body [class*="glow"],body [class*="Glow"]{box-shadow:none!important}

/* =========================================================
   LANDING
   ========================================================= */
body.xs-global-landing,
body.landing,
body.home{
  background:
    radial-gradient(820px 500px at 56% 18%,rgba(116,37,55,.09),transparent 64%),
    linear-gradient(180deg,#0d1014,#090c10)!important;
}
body.xs-global-landing header,
body.xs-global-landing nav,
body.landing header,
body.home header{
  background:rgba(12,15,19,.91)!important;
  border-color:var(--r4-border-soft)!important;
  box-shadow:none!important;
  backdrop-filter:blur(15px);
}
body.xs-global-landing header a:not(.btn),
body.xs-global-landing nav a:not(.btn){
  color:#c4c9d0!important;
}
body.xs-global-landing header a:not(.btn):hover,
body.xs-global-landing nav a:not(.btn):hover{color:#fff!important}
body.xs-global-landing .hero,
body.xs-global-landing [class*="hero"]{
  box-shadow:none!important;
}
body.xs-global-landing h1 span,
body.xs-global-landing .accent,
body.xs-global-landing [class*="highlight"]{
  color:#c5536a!important;
  text-shadow:none!important;
}
body.xs-global-landing .hero p{
  color:#b7bdc6!important;
  line-height:1.7!important;
}
body.xs-global-landing .hero .btn,
body.xs-global-landing .hero a[class*="cta"]{
  min-height:44px!important;
  padding-inline:20px!important;
}
body.xs-global-landing [class*="ticker"],
body.xs-global-landing [class*="marquee"]{
  border-color:var(--r4-border-soft)!important;
  color:#868e99!important;
  background:#0c0f13!important;
}

/* =========================================================
   WORKSPACE
   ========================================================= */
body.dash #sidebar{
  width:216px!important;
  background:linear-gradient(180deg,#0f1217,#0c0f13)!important;
  border-right:1px solid var(--r4-border-soft)!important;
  box-shadow:none!important;
}
body.dash #sidebar .tool,
body.dash #sidebar .sideLink,
body.dash #sidebar .adminlink{
  border-radius:9px!important;
  color:#aeb4bd!important;
}
body.dash #sidebar .tool:hover,
body.dash #sidebar .sideLink:hover,
body.dash #sidebar .adminlink:hover{
  color:#f0f2f4!important;
  background:rgba(255,255,255,.035)!important;
}
body.dash #sidebar .tool.active,
body.dash #sidebar .activeLink{
  color:#fff!important;
  background:var(--r4-accent-soft)!important;
  border-color:var(--r4-accent-border)!important;
  box-shadow:inset 2px 0 0 #b65368!important;
}
body.dash .workspace{
  margin-left:216px!important;
  padding-left:32px!important;
  padding-right:32px!important;
}
body.dash .workspace>header{
  width:min(1180px,100%)!important;
  background:rgba(11,14,18,.84)!important;
  border-color:var(--r4-border-soft)!important;
}
body.dash .workspace>section,
body.dash .workspace>.history,
body.dash .workspace>.notice,
body.dash .workspace>.historyExplorer,
body.dash .workspace>.upgradeHero,
body.dash .workspace>.accountGrid,
body.dash .workspace>.payShell{
  width:min(1180px,100%)!important;
  margin-inline:auto!important;
}
body.dash .panel,
body.dash .accountCard,
body.dash .packageCard,
body.dash .payCard,
body.dash .historyExplorer,
body.dash .historyCard{
  background:linear-gradient(160deg,#171b21,#13171c)!important;
  border-color:var(--r4-border)!important;
  box-shadow:var(--r4-shadow)!important;
}
body.dash .result,
body.dash .structuredOutput,
body.dash .historyInputBox{
  background:#0f1318!important;
  border-color:var(--r4-border)!important;
}
body.dash .historyCard:hover{
  border-color:#363e48!important;
  background:#171b21!important;
}

/* =========================================================
   ADMIN
   ========================================================= */
body.xs-global-admin,
body.adminbody{
  background:linear-gradient(180deg,#0d1014,#090c10)!important;
}
body.xs-global-admin .admTop,
body.adminbody .admTop{
  background:rgba(12,15,19,.94)!important;
  border-color:var(--r4-border-soft)!important;
  box-shadow:none!important;
}
body.xs-global-admin .admStat,
body.xs-global-admin .admSection,
body.adminbody .admStat,
body.adminbody .admSection{
  background:linear-gradient(160deg,#171b21,#13171c)!important;
  border-color:var(--r4-border)!important;
  box-shadow:none!important;
}
body.xs-global-admin table,
body.adminbody table{
  background:#101419!important;
  border-color:var(--r4-border)!important;
}
body.xs-global-admin th,
body.adminbody th{
  color:#858e9a!important;
  background:#13171c!important;
  border-color:var(--r4-border-soft)!important;
}
body.xs-global-admin td,
body.adminbody td{
  color:#cbd0d6!important;
  border-color:var(--r4-border-soft)!important;
}
body.xs-global-admin .admSearch button,
body.adminbody .admSearch button,
body.xs-global-admin .admAction,
body.adminbody .admAction{
  background:#a23e54!important;
  border-color:var(--r4-accent-border)!important;
  box-shadow:none!important;
}

/* =========================================================
   PLATFORM MANAGER
   ========================================================= */
body.xs-global-platform,
body.platformPage{
  background:linear-gradient(180deg,#0d1014,#090c10)!important;
}
body.xs-global-platform [class*="platform"],
body.platformPage [class*="platform"]{
  border-color:var(--r4-border)!important;
}
body.xs-global-platform .tab,
body.platformPage .tab{
  color:#aeb4bd!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.xs-global-platform .tab.active,
body.platformPage .tab.active{
  color:#fff!important;
  background:var(--r4-accent-soft)!important;
  border-color:var(--r4-accent-border)!important;
}
body.xs-global-platform article,
body.xs-global-platform .card,
body.platformPage article,
body.platformPage .card{
  background:linear-gradient(160deg,#171b21,#13171c)!important;
  border-color:var(--r4-border)!important;
  box-shadow:none!important;
}

/* ---------- Tables everywhere ---------- */
body table{border-color:var(--r4-border)!important}
body th{color:#89919d!important}
body td{color:#c9ced5!important}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  body.dash .workspace{
    margin-left:0!important;
    padding-left:18px!important;
    padding-right:18px!important;
  }
  body.dash #sidebar{width:min(286px,86vw)!important}
  body h1{overflow-wrap:anywhere}
}
@media(max-width:640px){
  body{font-size:13px}
  body.dash .workspace{padding-inline:12px!important}
  body.dash .panel{padding:18px!important}
  body .btn,body button{min-height:40px}
}