/* OpaJonko AI Lab V18.1 — Pro UI
   Final visual normalization layer. Functional markup/IDs remain unchanged. */

:root{
  --oj-bg:#080a0f;
  --oj-bg-elev:#0b0e14;
  --oj-sidebar:#0a0d12;
  --oj-surface:#0f131a;
  --oj-surface-2:#121720;
  --oj-surface-3:#171d27;
  --oj-border:#242b37;
  --oj-border-strong:#303948;
  --oj-text:#f6f7f9;
  --oj-text-2:#c9d0da;
  --oj-muted:#8994a5;
  --oj-subtle:#626d7d;
  --oj-accent:#8b6df6;
  --oj-accent-hi:#a58cf8;
  --oj-accent-soft:rgba(139,109,246,.12);
  --oj-success:#53d99a;
  --oj-warning:#f2b84b;
  --oj-danger:#f06b78;
  --oj-radius:14px;
  --oj-radius-sm:10px;
  --oj-shadow:0 18px 50px rgba(0,0,0,.24);
}

html,body{
  background:var(--oj-bg)!important;
  color:var(--oj-text)!important;
  color-scheme:dark;
}
body{
  min-width:320px;
  background:
    radial-gradient(900px 440px at 74% -12%,rgba(139,109,246,.08),transparent 64%),
    radial-gradient(620px 360px at 22% -12%,rgba(89,111,175,.04),transparent 66%),
    var(--oj-bg)!important;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{background:rgba(139,109,246,.35);color:#fff}
*{scrollbar-width:thin;scrollbar-color:#2e3745 transparent}
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-thumb{background:#2e3745;border-radius:20px}
*::-webkit-scrollbar-track{background:transparent}

/* ===== APP SHELL ===== */
.shell{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0 24px 48px 272px!important;
}
.top{
  position:fixed!important;
  inset:0 auto 0 0!important;
  z-index:1200!important;
  width:248px!important;
  height:100dvh!important;
  min-height:0!important;
  padding:18px 14px 14px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:14px!important;
  overflow-y:auto!important;
  border:0!important;
  border-right:1px solid var(--oj-border)!important;
  border-radius:0!important;
  background:linear-gradient(180deg,#0b0e14 0%,#090c11 100%)!important;
  box-shadow:12px 0 40px rgba(0,0,0,.12)!important;
}
.brandimg{display:none!important}
.v181Brand{
  display:flex;
  align-items:center;
  gap:11px;
  min-height:48px;
  padding:4px 6px 13px;
  text-decoration:none;
  color:var(--oj-text);
  border-bottom:1px solid rgba(255,255,255,.055);
}
.v181BrandMark{
  width:34px;height:34px;flex:0 0 34px;
  display:grid;place-items:center;
  border:1px solid rgba(165,140,248,.42);
  border-radius:10px;
  background:linear-gradient(145deg,rgba(139,109,246,.28),rgba(139,109,246,.08));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 18px rgba(0,0,0,.18);
  color:#ded5ff;font-size:11px;font-weight:900;letter-spacing:-.02em;
}
.v181BrandText{min-width:0;display:flex;flex-direction:column;gap:2px}
.v181BrandText strong{font-size:13px;line-height:1.1;letter-spacing:-.01em;color:#fff;white-space:nowrap}
.v181BrandText span{font-size:9px;line-height:1.1;color:#7f8a9b;text-transform:uppercase;letter-spacing:.14em;font-weight:800}

.nav.cleanNav,.nav{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  width:100%!important;
  max-width:none!important;
  gap:3px!important;
}
.navGroupLabel{
  display:block!important;
  margin:8px 8px 4px!important;
  padding:0!important;
  color:#5e6877!important;
  font-size:9px!important;
  font-weight:800!important;
  letter-spacing:.13em!important;
  line-height:1!important;
}
.nav button{
  position:relative!important;
  width:100%!important;
  height:38px!important;
  min-height:38px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  padding:0 10px!important;
  border:1px solid transparent!important;
  border-radius:9px!important;
  background:transparent!important;
  color:#98a3b3!important;
  box-shadow:none!important;
  font-size:11.5px!important;
  font-weight:650!important;
  text-align:left!important;
  transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s ease!important;
}
.nav button b{
  width:24px!important;height:24px!important;flex:0 0 24px!important;
  display:grid!important;place-items:center!important;
  border:1px solid transparent!important;border-radius:7px!important;
  color:#6f7a8b!important;font-size:12px!important;font-weight:800!important;
  transition:.15s ease!important;
}
.nav button:hover{
  background:#11161e!important;
  border-color:#1e2632!important;
  color:#e7eaf0!important;
  transform:translateX(1px)!important;
}
.nav button:hover b{color:#aeb8c7!important;background:#151b24!important}
.nav button.active{
  background:linear-gradient(90deg,rgba(139,109,246,.13),rgba(139,109,246,.045))!important;
  border-color:rgba(139,109,246,.26)!important;
  color:#fff!important;
  box-shadow:none!important;
}
.nav button.active:before{
  content:"";position:absolute;left:-1px;top:8px;bottom:8px;width:2px;border-radius:4px;background:var(--oj-accent);
}
.nav button.active b{
  color:#d8ceff!important;
  border-color:rgba(139,109,246,.22)!important;
  background:rgba(139,109,246,.10)!important;
}

.userbox.authUserBox,.userbox{
  margin-top:auto!important;
  width:100%!important;
  min-width:0!important;
  padding:11px!important;
  border:1px solid #202733!important;
  border-radius:12px!important;
  background:#0d1118!important;
  box-shadow:none!important;
}
.userbox strong{font-size:11px!important;color:#e9ecf1!important;font-weight:750!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.userbox>span{color:#7f8a9a!important;font-size:8px!important;letter-spacing:.07em!important}
.topLicenseBadge{display:flex!important;align-items:center!important;gap:4px!important;margin-top:7px!important;flex-wrap:wrap!important}
.licenseChip,.versionPill{
  padding:4px 6px!important;border-radius:999px!important;background:#111720!important;
  border:1px solid #28313f!important;color:#aeb9c8!important;font-size:7.5px!important;font-weight:750!important
}
.versionPill{border-color:rgba(139,109,246,.30)!important;color:#cbbcff!important;background:rgba(139,109,246,.08)!important}
.logoutBtn{
  width:100%!important;margin-top:8px!important;padding:7px 9px!important;
  border:1px solid #28303b!important;border-radius:8px!important;background:#10151c!important;color:#8f9bab!important;
}
.logoutBtn:hover{border-color:#3a4657!important;color:#fff!important;background:#151b23!important}

/* ===== TOP APP BAR ===== */
.cleanStatusBar{
  position:sticky!important;top:0!important;z-index:950!important;
  height:64px!important;margin:0 -24px 20px!important;padding:0 28px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  border:0!important;border-bottom:1px solid rgba(36,43,55,.90)!important;border-radius:0!important;
  background:rgba(8,10,15,.84)!important;
  backdrop-filter:blur(20px) saturate(140%)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.08)!important;
}
.cleanStatusBar>span:first-child{display:flex!important;flex-direction:column!important;gap:3px!important}
.cleanStatusBar b{font-size:14px!important;line-height:1!important;color:#f7f8fa!important;letter-spacing:-.01em!important}
.cleanStatusBar small{font-size:10px!important;line-height:1!important;color:#6f7a8b!important}
.v18TopActions{display:flex!important;align-items:center!important;gap:7px!important}
.v18TopChip{
  padding:6px 9px!important;border:1px solid #242d3a!important;border-radius:8px!important;
  background:#0d1219!important;color:#96a2b3!important;font-size:8.5px!important;font-weight:650!important;
}
.cleanStatusLive{
  padding:6px 9px!important;border:1px solid rgba(83,217,154,.20)!important;border-radius:8px!important;
  background:rgba(83,217,154,.055)!important;color:#70dba4!important;font-size:8px!important;font-weight:800!important;letter-spacing:.08em!important;
}

/* Hide empty announcement chrome; active announcements still show. */
@supports selector(:has(*)){
  #globalAnnouncements:has(#announcementList > .tiny:only-child){display:none!important}
}
.globalAnnouncements{
  max-width:1560px!important;margin:0 auto 16px!important;padding:12px 14px!important;
  border:1px solid #252d39!important;border-radius:12px!important;background:#0d1118!important;
}
.globalAnnouncementHead h3{color:#d6dbe3!important;font-size:10px!important;letter-spacing:.08em!important}
.globalAnnouncementBadge{background:#141a23!important;border-color:#2a3443!important;color:#7f8b9c!important}

/* ===== CORE SURFACES ===== */
.card,.studioCard,.libraryItem,.planCard,.presetCard,.poseCard,.adminControlCard{
  border:1px solid var(--oj-border)!important;
  border-radius:var(--oj-radius)!important;
  background:linear-gradient(180deg,#10141b 0%,#0d1117 100%)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.012)!important;
}
.card{padding:16px!important}
.card:hover{border-color:#2a3341!important}
.card h3{
  margin:0 0 14px!important;color:#dce1e8!important;font-size:10.5px!important;font-weight:800!important;
  line-height:1.2!important;letter-spacing:.075em!important;text-transform:uppercase!important;
}
.card h3.purp,.purp{color:#c9bcfa!important}
.card h3.green{color:#9bd6bb!important}.card h3.red{color:#ed99a2!important}
.num{color:#8d7ad1!important;font-variant-numeric:tabular-nums!important}
.tiny{color:#7d8999!important;font-size:10px!important;line-height:1.55!important}
hr{border-top-color:#222a35!important;margin:14px 0!important}

label{
  margin:10px 0 6px!important;color:#8f9aaa!important;font-size:9.5px!important;font-weight:650!important;
  letter-spacing:.025em!important
}
input,select,textarea,.realDropdown{
  min-height:39px!important;
  padding:9px 11px!important;
  border:1px solid #293342!important;
  border-radius:9px!important;
  background:#0a0f15!important;
  color:#e9edf2!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.012)!important;
  transition:border-color .15s ease,box-shadow .15s ease,background .15s ease!important;
}
textarea{min-height:112px!important;line-height:1.6!important}
input:hover,select:hover,textarea:hover{border-color:#344154!important}
input:focus,select:focus,textarea:focus,.realDropdown:focus{
  outline:none!important;border-color:#6e59c0!important;background:#0c1118!important;
  box-shadow:0 0 0 3px rgba(139,109,246,.09)!important;
}
input::placeholder,textarea::placeholder{color:#4f5b6a!important}
.customDropdownInput.visible{margin-top:7px!important;border-color:#6653b1!important}
.rangeRow{grid-template-columns:minmax(0,1fr) 48px!important;gap:10px!important}
.rangeRow span{color:#7f8b9d!important;font-size:9px!important;text-align:right!important;font-variant-numeric:tabular-nums!important}
input[type=range]{accent-color:var(--oj-accent)!important;min-height:auto!important;background:transparent!important;border:0!important;box-shadow:none!important}

.grid2{gap:10px!important}.grid4{gap:12px!important}
.switchrow{margin-top:11px!important;color:#aeb7c4!important;font-size:10px!important;gap:12px!important}
.switch{width:34px!important;height:18px!important;background:#29313c!important;border:0!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)!important}
.switch.on{background:#7259d0!important}
.modeRow{gap:8px!important}
.modeBtn{
  min-height:38px!important;padding:8px 10px!important;border-radius:9px!important;background:#0b1016!important;
  color:#8f9aaa!important;font-size:10px!important;font-weight:750!important
}
.modeBtn.sfw{border-color:#2a3d36!important}.modeBtn.nsfw{border-color:#433036!important}
.modeBtn.active.sfw{background:rgba(83,217,154,.07)!important;border-color:rgba(83,217,154,.28)!important;color:#9ce1bd!important}
.modeBtn.active.nsfw{background:rgba(240,107,120,.07)!important;border-color:rgba(240,107,120,.30)!important;color:#f1a0a8!important}

/* ===== BUTTON SYSTEM ===== */
button,.action,.preset,.poseFilter,.presetFilter{transition:transform .13s ease,border-color .13s ease,background .13s ease,color .13s ease,filter .13s ease!important}
button:active{transform:translateY(1px)}
.action,.seg,.preset,.poseFilter,.presetFilter,.videoCopySecondary{
  min-height:36px!important;padding:8px 11px!important;border:1px solid #2b3544!important;border-radius:9px!important;
  background:#10161e!important;color:#aeb8c6!important;box-shadow:none!important;font-size:10px!important;font-weight:700!important
}
.action:hover,.seg:hover,.preset:hover,.poseFilter:hover,.presetFilter:hover{
  border-color:#455166!important;background:#151c26!important;color:#f0f2f5!important
}
.seg.active,.poseFilter.active,.presetFilter.active{
  border-color:rgba(139,109,246,.42)!important;background:rgba(139,109,246,.10)!important;color:#ddd5ff!important;box-shadow:none!important
}
.purpleBtn,.generateMainPromptBtn,.videoGeneratePrimary,.cleanPrimary,.primaryLarge{
  border:1px solid rgba(165,140,248,.52)!important;
  border-radius:10px!important;
  background:linear-gradient(180deg,#8268e4 0%,#6e56ca 100%)!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(72,53,146,.18),inset 0 1px 0 rgba(255,255,255,.12)!important;
  font-weight:800!important;
}
.purpleBtn:hover,.generateMainPromptBtn:hover,.videoGeneratePrimary:hover,.cleanPrimary:hover,.primaryLarge:hover{
  filter:brightness(1.08)!important;transform:translateY(-1px)!important
}
.copyBtn{
  border:1px solid #3b485b!important;border-radius:8px!important;background:#121923!important;color:#c6cfdb!important;
  min-height:32px!important;padding:7px 11px!important;font-size:9px!important;font-weight:750!important
}
.copyBtn:hover{border-color:#5a6880!important;color:#fff!important}
.copyBtn.red{border-color:rgba(240,107,120,.30)!important;background:rgba(240,107,120,.055)!important;color:#ef9ca5!important}
.random{border-color:#4b3f2d!important;background:#15120e!important;color:#cfaa69!important;border-radius:9px!important}

/* ===== DASHBOARD LAYOUT ===== */
.dashboard{
  width:100%!important;max-width:1560px!important;margin:0 auto!important;
  display:grid!important;
  grid-template-columns:300px minmax(560px,1fr) 326px!important;
  gap:16px!important;align-items:start!important;
}
#expiryBanner{grid-column:1/-1!important}
.cleanCommand{grid-column:1/-1!important}
.projectTopbar{grid-column:1/-1!important}
.mainAssistant{grid-column:2!important;grid-row:4!important}
.left{grid-column:1!important;grid-row:4 / span 2!important;gap:12px!important}
.center{grid-column:2!important;grid-row:5!important;gap:12px!important;min-width:0!important}
.right.compactToolSidebar{
  grid-column:3!important;grid-row:4 / span 2!important;
  position:sticky!important;top:82px!important;align-self:start!important;
  max-height:calc(100dvh - 100px)!important;overflow:auto!important;gap:12px!important;
}

/* ===== DASHBOARD HERO / WORKFLOW ===== */
.cleanCommand{
  position:relative!important;
  overflow:hidden!important;
  padding:22px!important;
  border:1px solid #282f3d!important;
  border-radius:16px!important;
  background:
    radial-gradient(600px 220px at 100% 0%,rgba(139,109,246,.105),transparent 64%),
    linear-gradient(135deg,#11161e,#0c1016)!important;
  box-shadow:var(--oj-shadow)!important;
}
.cleanCommand:after{content:"";position:absolute;right:-100px;top:-140px;width:300px;height:300px;border:1px solid rgba(139,109,246,.08);border-radius:50%;pointer-events:none}
.cleanHero{position:relative;z-index:1!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:24px!important;margin:0 0 18px!important;padding:0!important}
.eyebrow{display:block!important;margin-bottom:7px!important;color:#9c8be0!important;font-size:8px!important;font-weight:900!important;letter-spacing:.16em!important}
.cleanHero h1{
  max-width:760px!important;margin:0 0 7px!important;color:#fff!important;font-size:26px!important;font-weight:760!important;
  line-height:1.12!important;letter-spacing:-.032em!important;text-wrap:balance!important
}
.cleanHero p{max-width:760px!important;margin:0!important;color:#7f8a9b!important;font-size:11px!important;line-height:1.55!important}
.cleanPrimary{min-height:42px!important;padding:0 15px!important;white-space:nowrap!important;font-size:10px!important}
.cleanFlow{
  position:relative;z-index:1!important;display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:8px!important;
  padding:0!important;border:0!important;background:transparent!important
}
.cleanFlow button{
  position:relative!important;min-height:64px!important;padding:12px!important;
  display:grid!important;grid-template-columns:28px 1fr!important;grid-template-rows:auto auto!important;column-gap:9px!important;
  border:1px solid #252e3b!important;border-radius:11px!important;background:rgba(9,13,18,.68)!important;color:#cdd3dd!important;text-align:left!important
}
.cleanFlow button:not(:last-child):after{content:"";position:absolute;right:-9px;top:50%;width:9px;height:1px;background:#2d3542;pointer-events:none}
.cleanFlow button:hover{border-color:#3c475a!important;background:#111720!important;transform:translateY(-1px)!important}
.cleanFlow button b{grid-row:1/3!important;display:grid!important;place-items:center!important;width:26px;height:26px;border-radius:8px;background:rgba(139,109,246,.09)!important;color:#a391ea!important;font-size:8px!important}
.cleanFlow button span{align-self:end!important;font-size:10px!important;font-weight:780!important;color:#e2e6ec!important}
.cleanFlow button small{align-self:start!important;color:#657183!important;font-size:8px!important}
.cleanQuickGrid{
  position:relative;z-index:1!important;display:grid!important;grid-template-columns:repeat(6,1fr)!important;gap:7px!important;margin-top:8px!important
}
.cleanQuickGrid button{
  min-height:38px!important;padding:8px 9px!important;border:1px solid #222a36!important;border-radius:9px!important;
  background:#0b1016!important;color:#737f91!important;font-size:10px!important;font-weight:650!important
}
.cleanQuickGrid button span{display:inline!important;margin:0 0 0 4px!important;font-size:9px!important}
.cleanQuickGrid button:hover{border-color:#364153!important;background:#10161e!important;color:#cdd4df!important}

.projectTopbar{
  display:grid!important;grid-template-columns:minmax(240px,1fr) auto auto auto!important;gap:8px!important;
  padding:9px!important;border:1px solid var(--oj-border)!important;border-radius:12px!important;background:#0d1117!important
}
.projectTopbar input{margin:0!important;min-height:36px!important}
.projectTopbar .action{white-space:nowrap!important}

/* ===== AI ASSISTANT ===== */
.mainAssistant{
  padding:18px!important;border-color:#2c3140!important;
  background:linear-gradient(180deg,#111620,#0e1219)!important;
}
.mainAssistant .viewTitle{margin:0 0 12px!important;padding:0 0 12px!important;border:0!important;border-bottom:1px solid #222a35!important;border-radius:0!important;background:transparent!important}
.mainAssistant .viewTitle h3{font-size:12px!important;letter-spacing:-.01em!important;text-transform:none!important;color:#f1f3f6!important}
.mainAssistant .viewTitle p{max-width:780px!important}
.assistantContext{display:flex!important;flex-wrap:wrap!important;gap:5px!important;margin-bottom:10px!important}
.assistantChip{padding:5px 7px!important;border:1px solid #28313e!important;border-radius:7px!important;background:#0b1016!important;color:#7f8b9c!important;font-size:8px!important}
.assistantGrid{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr)!important;gap:12px!important}
.assistantActions{display:grid!important;grid-template-columns:1.4fr repeat(3,1fr)!important;gap:7px!important;margin-top:8px!important}
.assistantStatus{margin-top:8px!important;color:#657283!important;font-size:8.5px!important}
.outputBox{padding:12px!important;border:1px solid #26303d!important;border-radius:10px!important;background:#090e14!important;color:#aeb9c7!important;font:10px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important;overflow:auto!important}

/* ===== BUILDER CARDS ===== */
.left .card,.center .card{scroll-margin-top:86px!important}
.centerColumns{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
.composition{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px 12px!important}
.presetBar{gap:7px!important}
.presetLabel{width:100%!important;margin-bottom:1px!important;color:#616d7d!important;font-size:8px!important;letter-spacing:.08em!important}

.generateMainCard{padding:10px!important;border-color:rgba(139,109,246,.28)!important;background:linear-gradient(180deg,rgba(139,109,246,.055),#0d1117)!important}
.generateMainPromptBtn{min-height:58px!important;padding:10px 16px!important}
.generateMainPromptBtn strong{font-size:12px!important}.generateMainPromptBtn small{font-size:8px!important;color:#d9d1f5!important}
.generateMainMeta{gap:6px!important}.generateMainMeta span{border-color:#2a3040!important;background:#0d1118!important;color:#6d7888!important}

.outputCard{padding:0!important;overflow:hidden!important;border-color:#2a3341!important}
.outputHeader{min-height:44px!important;padding:10px 12px!important;border-bottom:1px solid #252e3a!important;background:#0c1117!important;font-size:10px!important;font-weight:800!important}
.outputHeader.green{color:#b8c2d0!important}.outputHeader.red{color:#e2949d!important}
.promptText{min-height:180px!important;padding:14px!important;background:#090d13!important;color:#bcc5d1!important;font:10.5px/1.66 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important}
.negText{min-height:90px!important;color:#d99098!important}
.promptMeta{padding:8px 12px!important;border-top-color:#222a35!important;color:#667283!important}
.promptMeta b{color:#a797df!important}
.quickActions{grid-template-columns:repeat(5,1fr)!important;gap:7px!important}
.quickActions .action{min-height:40px!important}

/* ===== RIGHT TOOLBOX ===== */
.toolboxShell{
  border:1px solid #27303c!important;border-radius:14px!important;background:#0b0f15!important;overflow:hidden!important;
  box-shadow:0 14px 36px rgba(0,0,0,.14)!important
}
.toolboxHeader{min-height:50px!important;padding:10px 12px!important;border-bottom:1px solid #222a35!important;background:#0d1218!important}
.toolboxHeader b{color:#d9dee5!important;font-size:10px!important;letter-spacing:.08em!important}
.toolboxHeader span{display:block!important;margin-top:2px!important;color:#5f6b7b!important;font-size:8px!important}
.toolboxCollapse{width:28px!important;height:28px!important;border:1px solid #28313f!important;border-radius:8px!important;background:#111720!important;color:#788596!important}
.toolboxTabs{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:5px!important;padding:8px!important;border-bottom:1px solid #222a35!important;background:#0a0e14!important}
.toolboxTab{min-height:31px!important;padding:6px 3px!important;border:1px solid transparent!important;border-radius:7px!important;background:transparent!important;color:#657183!important;font-size:8px!important;font-weight:750!important}
.toolboxTab:hover{background:#111720!important;color:#aeb8c6!important}
.toolboxTab.active{border-color:rgba(139,109,246,.28)!important;background:rgba(139,109,246,.08)!important;color:#cfc3fb!important}
.toolboxBody{padding:8px!important}
.toolboxBody .card{padding:13px!important;border-radius:11px!important;background:#0d1218!important}
.compactDrop,.drop{min-height:116px!important;border:1px dashed #374254!important;border-radius:10px!important;background:#090d13!important;color:#8793a4!important}
.drop:hover{border-color:#545f73!important;background:#0c1117!important}
.preview{border-radius:9px!important;background:#080c11!important}
.mainReferenceBox{border-color:#2a3340!important;background:#0b1016!important;border-radius:10px!important}
.refMini{border-color:#2a3340!important;background:#0a0f15!important;border-radius:9px!important}
.referenceDivider span{color:#657183!important;background:#0b0f15!important}
.auditTip,.faceHero{border-color:#2c3442!important;background:#0b1016!important;color:#7f8a9a!important}
.v18ContextBox{border-color:#27313e!important;background:#090e14!important;color:#7f8b9b!important}
.v18Followups button{border-color:#293342!important;background:#0c1117!important;color:#8f9aaa!important}
.v18Followups button:hover{border-color:#51476f!important;color:#d7d0ee!important;background:#111620!important}

.v18QualityStrip{
  grid-template-columns:repeat(3,1fr) auto!important;gap:0!important;margin-bottom:10px!important;padding:0!important;
  overflow:hidden!important;border:1px solid #27303c!important;border-radius:10px!important;background:#0a0f15!important
}
.v18QualityStrip>div{padding:9px 10px!important;border-right:1px solid #222b36!important}
.v18QualityStrip span{color:#5f6b7b!important;font-size:7.5px!important}.v18QualityStrip b{color:#cbd2dc!important;font-size:11px!important}
.v18QualityStrip button{margin:6px!important;border-color:#473e61!important;background:rgba(139,109,246,.07)!important;color:#b6a9df!important;border-radius:7px!important}

/* ===== NSFW / WARNING SURFACES ===== */
.nsfwCard{
  border-color:rgba(240,107,120,.22)!important;
  background:linear-gradient(180deg,rgba(240,107,120,.035),#0d1117)!important
}
.nsfwCard h3{color:#df949c!important}.nsfwBadge{border-color:rgba(240,107,120,.30)!important;color:#dd949c!important;background:rgba(240,107,120,.05)!important}
.facePro{border-color:rgba(139,109,246,.28)!important;background:linear-gradient(180deg,rgba(139,109,246,.04),#0d1117)!important}
.facePro h3{color:#c7bbef!important}

/* ===== STANDALONE VIEWS ===== */
.standaloneToolView,.creatorStudio,#libraryView,#projectsView,#historyView,#presetsView,#posesView,#plansView,#settingsView,#adminView{
  width:100%!important;max-width:1360px!important;margin:0 auto!important;padding:0 0 28px!important
}
.toolPageHero,.viewTitle,.studioHead,.presetHero,.poseHero{
  margin:0 0 14px!important;padding:18px 20px!important;border:1px solid #262f3c!important;border-radius:14px!important;
  background:linear-gradient(180deg,#11161e,#0d1218)!important;box-shadow:none!important
}
.toolPageHero h2,.viewTitle h2,.studioHead h2,.presetHero h2,.poseHero h2{
  margin:0!important;color:#f3f5f7!important;font-size:20px!important;font-weight:760!important;letter-spacing:-.025em!important
}
.toolPageHero p,.viewTitle p,.studioHead p,.presetHero p,.poseHero p{margin:5px 0 0!important;color:#768294!important;font-size:10px!important;line-height:1.5!important}
.standaloneToolGrid{gap:14px!important}
.studioGrid{gap:14px!important}.studioCard{padding:18px!important}.studioCard h3{color:#eceff3!important;font-size:13px!important}.studioIcon{border-color:#332d45!important;background:#14111d!important;color:#a89ae0!important}
.scoreRow span{background:#0a0f15!important;border-color:#242d39!important;color:#687486!important}.scoreRow b{color:#c4ccd7!important}
.miniItem,.versionItem{border-color:#252e3b!important;background:#0a0f15!important}
.chipSelect button{border-color:#2a3442!important;background:#0d1218!important;color:#7d899a!important}.chipSelect button.active{border-color:#5b4a91!important;background:rgba(139,109,246,.08)!important;color:#c7baef!important}

.libraryToolbar,.dataToolbar{gap:8px!important;margin-bottom:14px!important}
.libraryGrid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
.libraryItem{min-height:170px!important;padding:15px!important}.libraryItem h4{color:#e9ecf1!important;font-size:11px!important}.libraryMeta{color:#687485!important}.librarySnippet{color:#9da8b7!important;font-size:10px!important}
.libraryButtons button{border-color:#2c3645!important;background:#111720!important;color:#9da8b6!important;border-radius:8px!important}
.emptyState{color:#657183!important;padding:56px 12px!important}

.presetHero,.poseHero{border-color:#2b3340!important}.presetHero h2,.poseHero h2{color:#f2f4f7!important}.presetCount{border-color:#3e3655!important;color:#a99dcc!important;background:#11101a!important}
.presetGrid,.poseGrid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
.presetCard,.poseCard{min-height:126px!important;padding:16px!important;border-color:#28313e!important;background:#0f141b!important}
.presetCard:hover,.poseCard:hover{transform:translateY(-2px)!important;border-color:#465166!important;box-shadow:0 12px 28px rgba(0,0,0,.16)!important}
.presetName,.poseTitle{color:#e2e6ec!important;font-size:12px!important}.presetDesc,.poseText{color:#748092!important;font-size:10px!important}.presetTag{color:#756a98!important}
.presetCard.applied,.poseCard.selected{border-color:rgba(83,217,154,.35)!important;box-shadow:inset 0 0 0 1px rgba(83,217,154,.10)!important}

.planGrid{gap:14px!important}.planCard{padding:20px!important}.planCard:hover{border-color:#394456!important}.planCard.featured{border-color:rgba(139,109,246,.43)!important;background:linear-gradient(180deg,rgba(139,109,246,.07),#0e1219)!important}
.adminControlStrip{gap:10px!important}.adminControlCard{background:#0f141b!important;border-color:#28313e!important}.adminSecurityBanner{border-color:#393147!important;background:#0e1118!important}

/* ===== FILES / MEDIA / VIDEO ===== */
.ojFileDropZone{outline-color:rgba(139,109,246,.22)!important;outline-offset:3px!important}
.ojFileDropZone.ojDragActive{outline-color:#8b6df6!important;box-shadow:0 0 0 4px rgba(139,109,246,.08)!important}
.videoModelPanel{border-color:#302a40!important;background:#0c1117!important;border-radius:11px!important}.videoModelTitle{color:#c4b8eb!important}.videoModelHint{color:#718093!important}
.videoModelBtn{border-color:#2b3544!important;background:#0d131a!important;color:#aeb9c8!important;border-radius:9px!important}.videoModelBtn.active{border-color:#6758a4!important;background:rgba(139,109,246,.13)!important;color:#e0d8fa!important;box-shadow:none!important}
.videoGeneratePrimary{min-height:54px!important;margin-top:10px!important;font-size:11px!important}.videoGeneratePrimary strong{font-size:12px!important}.videoGeneratePrimary small{font-size:8px!important;color:#d6cff0!important}.videoGenerateIcon{font-size:18px!important}
#videoResult,#imageResult{border-color:#2b3544!important;background:#090e14!important}

/* ===== FOOTER ===== */
.footer{max-width:1560px!important;margin:22px auto 0!important;padding:14px 2px 0!important;border-top:1px solid #202733!important;color:#586475!important;font-size:9px!important}
.logoMini{color:#8e7ec7!important;letter-spacing:.09em!important}

/* ===== RESPONSIVE ===== */
@media(max-width:1460px){
  .dashboard{grid-template-columns:280px minmax(520px,1fr)!important}
  .right.compactToolSidebar{grid-column:1/-1!important;grid-row:auto!important;position:static!important;max-height:none!important;overflow:visible!important}
  .toolboxTabs{grid-template-columns:repeat(7,1fr)!important}
  .toolboxBody{padding:10px!important}
}
@media(max-width:1120px){
  .shell{padding-left:228px!important}
  .top{width:208px!important}
  .v181BrandText span{display:none}
  .dashboard{grid-template-columns:250px minmax(430px,1fr)!important}
  .cleanQuickGrid{grid-template-columns:repeat(3,1fr)!important}
  .assistantGrid{grid-template-columns:1fr!important}
  .assistantActions{grid-template-columns:1fr 1fr!important}
  .libraryGrid{grid-template-columns:repeat(2,1fr)!important}
  .presetGrid,.poseGrid{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:900px){
  .shell{padding:0 14px 32px!important}
  .top{
    position:relative!important;inset:auto!important;width:auto!important;height:auto!important;min-height:auto!important;
    margin:0 -14px!important;padding:10px 14px!important;border-right:0!important;border-bottom:1px solid var(--oj-border)!important;
    overflow:visible!important;box-shadow:none!important
  }
  .v181Brand{padding:2px 2px 9px!important}.v181BrandMark{width:30px;height:30px;flex-basis:30px}.v181BrandText span{display:block}
  .nav.cleanNav,.nav{display:grid!important;grid-template-columns:repeat(6,1fr)!important;gap:5px!important}
  .navGroupLabel{display:none!important}
  .nav button{height:36px!important;min-height:36px!important;justify-content:center!important;padding:0 6px!important}
  .nav button span{display:none!important}.nav button b{width:24px!important;height:24px!important}.nav button.active:before{display:none!important}
  .userbox{display:none!important}
  .cleanStatusBar{margin:0 -14px 16px!important;padding:0 14px!important;height:56px!important}
  .dashboard{grid-template-columns:1fr!important;gap:12px!important}
  .mainAssistant,.left,.center,.right.compactToolSidebar{grid-column:1!important;grid-row:auto!important}
  .left{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .right.compactToolSidebar{position:static!important;max-height:none!important}
  .cleanHero{align-items:flex-start!important}.cleanHero h1{font-size:22px!important}
  .cleanFlow{grid-template-columns:repeat(5,minmax(120px,1fr))!important;overflow-x:auto!important;padding-bottom:3px!important}
  .cleanFlow button:after{display:none!important}
  .projectTopbar{grid-template-columns:1fr 1fr!important}.projectTopbar input{grid-column:1/-1!important}
  .centerColumns{grid-template-columns:1fr 1fr!important}
}
@media(max-width:640px){
  .shell{padding-bottom:24px!important}
  .nav.cleanNav,.nav{grid-template-columns:repeat(4,1fr)!important}
  .cleanStatusBar{height:52px!important}.v18TopChip{display:none!important}.cleanStatusLive{padding:5px 7px!important}
  .cleanCommand{padding:16px!important}.cleanHero{flex-direction:column!important;gap:14px!important}.cleanHero h1{font-size:20px!important}.cleanPrimary{width:100%!important}
  .cleanFlow{grid-template-columns:repeat(2,1fr)!important;overflow:visible!important}.cleanFlow button{min-height:58px!important}.cleanFlow button:last-child{grid-column:1/-1!important}
  .cleanQuickGrid{grid-template-columns:1fr 1fr!important}
  .projectTopbar{grid-template-columns:1fr!important}.projectTopbar input{grid-column:auto!important}
  .left{grid-template-columns:1fr!important}
  .centerColumns,.composition,.grid2,.grid4{grid-template-columns:1fr!important}
  .quickActions{grid-template-columns:1fr 1fr!important}
  .toolboxTabs{grid-template-columns:repeat(4,1fr)!important}
  .v18QualityStrip{grid-template-columns:1fr 1fr!important}.v18QualityStrip>div{border-bottom:1px solid #222b36!important}.v18QualityStrip button{min-height:38px!important}
  .libraryGrid,.presetGrid,.poseGrid{grid-template-columns:1fr!important}
  .libraryToolbar,.dataToolbar{grid-template-columns:1fr!important}
  .toolPageHero,.viewTitle,.studioHead,.presetHero,.poseHero{padding:15px!important;align-items:flex-start!important;flex-direction:column!important}
  .toolPageHero h2,.viewTitle h2,.studioHead h2,.presetHero h2,.poseHero h2{font-size:18px!important}
  .assistantActions{grid-template-columns:1fr!important}
  .footer{flex-direction:column!important;gap:5px!important}
}