:root{
  --at-bg:#050609;
  --at-bg-soft:#080a0e;
  --at-surface:#0d1015;
  --at-surface-2:#11151b;
  --at-surface-3:#171c23;

  --at-orange:#ff8700;
  --at-orange-2:#ff9d17;
  --at-gold:#ffc15a;

  --at-text:#f4f5f7;
  --at-text-2:#c4c8cf;
  --at-muted:#858c98;

  --at-line:rgba(255,255,255,.072);
  --at-line-2:rgba(255,255,255,.11);
  --at-hot:rgba(255,135,0,.22);

  --at-green:#55bd7a;
  --at-red:#e06969;

  --at-r1:12px;
  --at-r2:16px;
  --at-r3:20px;
  --at-r4:24px;

  --at-ease:cubic-bezier(.22,.78,.22,1);
  --at-shadow:0 20px 55px rgba(0,0,0,.32);
}

*{
  box-sizing:border-box;
}

html{
  background:var(--at-bg)!important;
  color-scheme:dark;
}

body{
  margin:0!important;
  min-height:100vh;

  color:var(--at-text)!important;

  background:
    radial-gradient(
      800px 450px at 90% -12%,
      rgba(255,135,0,.075),
      transparent 65%
    ),
    linear-gradient(
      180deg,
      #050609 0%,
      #07090c 100%
    )!important;

  font-family:
    system-ui,
    -apple-system,
    "Noto Sans Arabic",
    "Segoe UI",
    Arial,
    sans-serif!important;

  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

button,
input,
textarea,
select{
  font:inherit!important;
}

button{
  -webkit-tap-highlight-color:transparent;
}

[hidden]{
  display:none!important;
}


/* ============================================================
   NEW APPLICATION SHELL
   ============================================================ */

.at-shell{
  min-height:100dvh;
  width:100%;

  display:grid;
  grid-template-columns:280px minmax(0,1fr);
  grid-template-rows:72px minmax(0,1fr);

  direction:rtl;
}


.at-topbar{
  grid-column:2;
  grid-row:1;

  position:sticky;
  top:0;
  z-index:700;

  height:72px;

  display:flex;
  align-items:center;
  gap:14px;

  padding:0 22px;

  background:
    rgba(7,9,12,.96);

  border-bottom:
    1px solid var(--at-line);
}


.at-top-brand{
  display:flex;
  align-items:center;
  gap:11px;

  min-width:0;
}


.at-brand-mark{
  position:relative;

  width:43px;
  height:43px;

  flex:0 0 43px;

  display:grid;
  place-items:center;

  overflow:hidden;

  border-radius:13px;

  color:#130b02;
  font-size:16px;
  font-weight:950;
  letter-spacing:-1px;

  background:
    linear-gradient(
      145deg,
      var(--at-gold),
      var(--at-orange)
    );

  border:
    1px solid rgba(255,208,108,.38);

  box-shadow:
    0 8px 22px rgba(255,135,0,.12);
}


.at-brand-mark img{
  width:100%;
  height:100%;
  object-fit:cover;
}


.at-brand-copy{
  min-width:0;
}


.at-brand-copy strong{
  display:block;

  color:#fff;

  font-size:14px;
  line-height:1.2;

  white-space:nowrap;
}


.at-brand-copy span{
  display:block;

  margin-top:3px;

  color:var(--at-muted);

  font-size:10px;
  letter-spacing:.06em;
}


.at-page-heading{
  min-width:0;

  margin-inline-start:18px;
}


.at-page-heading b{
  display:block;

  color:#fff;

  font-size:16px;
  font-weight:720;

  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}


.at-page-heading small{
  display:block;

  margin-top:3px;

  color:var(--at-muted)!important;

  font-size:10px;
}


.at-top-actions{
  margin-inline-start:auto;

  display:flex;
  align-items:center;
  gap:8px;
}


.at-icon-btn{
  width:42px;
  height:42px;
  min-height:42px!important;

  display:grid!important;
  place-items:center!important;

  padding:0!important;

  color:#b9bec7!important;

  background:
    var(--at-surface)!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:13px!important;

  box-shadow:none!important;

  transition:
    transform .16s var(--at-ease),
    color .16s var(--at-ease),
    border-color .16s var(--at-ease),
    background .16s var(--at-ease)!important;
}


.at-icon-btn:hover{
  color:#fff!important;

  border-color:
    rgba(255,135,0,.18)!important;
}


.at-icon-btn:active{
  transform:scale(.94);
}


.at-icon-btn svg{
  width:20px;
  height:20px;
}


.at-avatar-btn{
  color:#160d03!important;

  font-weight:850!important;

  background:
    linear-gradient(
      145deg,
      var(--at-gold),
      var(--at-orange)
    )!important;

  border-color:
    rgba(255,190,75,.35)!important;
}


/* ============================================================
   SIDEBAR
   ============================================================ */

.at-sidebar{
  grid-column:1;
  grid-row:1 / span 2;

  position:sticky;
  top:0;

  height:100dvh;

  display:flex;
  flex-direction:column;

  padding:18px 14px;

  overflow-y:auto;

  background:
    radial-gradient(
      420px 280px at 100% 0,
      rgba(255,135,0,.07),
      transparent 65%
    ),
    #080a0e!important;

  border-left:
    1px solid var(--at-line);

  scrollbar-width:none;
}


.at-sidebar::-webkit-scrollbar{
  display:none;
}


.at-side-brand{
  display:flex;
  align-items:center;
  gap:11px;

  padding:3px 6px 17px;

  border-bottom:
    1px solid var(--at-line);
}


.at-side-brand-copy{
  min-width:0;
}


.at-side-brand-copy strong{
  display:block;

  color:#fff;

  font-size:14px;

  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}


.at-side-brand-copy span{
  display:flex;
  align-items:center;
  gap:6px;

  margin-top:4px;

  color:var(--at-muted);

  font-size:10px;
}


.at-online-dot{
  width:6px;
  height:6px;

  border-radius:50%;

  background:var(--at-orange);

  box-shadow:
    0 0 9px rgba(255,135,0,.52);
}


.at-side-nav{
  display:flex;
  flex-direction:column;

  gap:4px;

  margin-top:14px;
}


.at-side-nav .nav{
  position:relative;

  min-height:51px!important;

  display:flex!important;
  align-items:center!important;
  gap:11px!important;

  width:100%;

  padding:7px 9px!important;

  overflow:hidden;

  color:#999faa!important;

  background:transparent!important;

  border:
    1px solid transparent!important;

  border-radius:14px!important;

  box-shadow:none!important;

  text-align:right;

  font-size:13px!important;
  font-weight:610!important;

  transition:
    transform .15s var(--at-ease),
    color .16s var(--at-ease),
    background .16s var(--at-ease),
    border-color .16s var(--at-ease)!important;
}


.at-side-nav .nav:hover{
  color:#fff!important;

  background:
    rgba(255,255,255,.025)!important;
}


.at-side-nav .nav:active{
  transform:scale(.975);
}


.at-side-nav .nav.active{
  color:#fff!important;

  background:
    linear-gradient(
      90deg,
      rgba(255,135,0,.12),
      rgba(255,135,0,.035)
    )!important;

  border-color:
    rgba(255,135,0,.14)!important;

  box-shadow:
    inset -2px 0 0 var(--at-orange)!important;
}


.at-side-nav .nav .ico{
  width:37px!important;
  height:37px!important;

  flex:0 0 37px!important;

  display:grid!important;
  place-items:center!important;

  color:#7f8691!important;

  background:
    rgba(255,255,255,.018)!important;

  border:
    1px solid rgba(255,255,255,.042)!important;

  border-radius:11px!important;
}


.at-side-nav .nav .ico svg{
  width:19px;
  height:19px;
}


.at-side-nav .nav.active .ico{
  color:var(--at-orange-2)!important;

  background:
    rgba(255,135,0,.065)!important;

  border-color:
    rgba(255,135,0,.13)!important;
}


.at-sidebar-footer{
  margin-top:auto;

  padding-top:14px;
}


.at-sidebar-footer .sidebar-foot{
  margin:0!important;

  padding:10px!important;

  background:
    rgba(255,255,255,.015)!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:14px!important;
}


/* ============================================================
   MAIN CONTENT
   ============================================================ */

.at-main{
  grid-column:2;
  grid-row:2;

  min-width:0;

  padding:22px;

  background:transparent;
}


.at-main .view{
  width:100%;

  max-width:1500px;

  margin:0 auto;

  background:transparent!important;
}


.at-main .view.active{
  animation:
    atViewEnter .21s var(--at-ease) both;
}


@keyframes atViewEnter{
  from{
    opacity:0;
    transform:translateY(6px);
  }

  to{
    opacity:1;
    transform:none;
  }
}


/* ============================================================
   DASHBOARD
   ============================================================ */

.at-dashboard-head{
  position:relative;

  min-height:190px;

  display:grid;
  grid-template-columns:minmax(0,1fr) 210px;
  align-items:center;
  gap:24px;

  overflow:hidden;

  margin-bottom:14px;

  padding:27px 28px;

  background:
    radial-gradient(
      370px 230px at 87% 52%,
      rgba(255,135,0,.12),
      transparent 68%
    ),
    linear-gradient(
      135deg,
      #12151a 0%,
      #090b0e 70%,
      #100b06 100%
    );

  border:
    1px solid rgba(255,135,0,.12);

  border-radius:22px;

  box-shadow:
    0 20px 52px rgba(0,0,0,.25);
}


.at-dashboard-head::before{
  content:"AT";

  position:absolute;

  left:-4px;
  bottom:-53px;

  color:
    rgba(255,255,255,.012);

  font-size:165px;
  line-height:1;
  font-weight:950;

  pointer-events:none;
}


.at-hero-copy{
  position:relative;
  z-index:2;
}


.at-eyebrow{
  color:var(--at-orange-2);

  font-size:10px;
  font-weight:850;

  letter-spacing:.08em;
}


.at-dashboard-head h1{
  margin:8px 0 7px!important;

  color:#fff!important;

  font-size:27px!important;
  line-height:1.25;

  font-weight:760!important;
}


.at-dashboard-head p{
  max-width:580px;

  margin:0!important;

  color:#9aa0aa!important;

  font-size:13px;

  line-height:1.8;
}


.at-hero-actions{
  display:flex;
  flex-wrap:wrap;

  gap:8px;

  margin-top:17px;
}


.at-primary-action,
.at-secondary-action{
  min-height:42px!important;

  padding:0 15px!important;

  border-radius:12px!important;

  font-size:12px!important;
  font-weight:720!important;

  transition:
    transform .15s var(--at-ease),
    box-shadow .16s var(--at-ease)!important;
}


.at-primary-action{
  color:#120a02!important;

  background:
    linear-gradient(
      135deg,
      var(--at-gold),
      var(--at-orange)
    )!important;

  border:
    1px solid rgba(255,199,84,.36)!important;

  box-shadow:
    0 8px 22px rgba(255,135,0,.11)!important;
}


.at-secondary-action{
  color:#eceef1!important;

  background:
    rgba(255,255,255,.025)!important;

  border:
    1px solid var(--at-line)!important;
}


.at-primary-action:active,
.at-secondary-action:active{
  transform:scale(.97);
}


/* ============================================================
   PROFESSIONAL AT AI MASCOT
   ============================================================ */

.at-ai-mascot{
  position:relative;

  z-index:2;

  width:190px;
  height:150px;

  display:grid;
  place-items:center;

  margin:auto;
}


.at-ai-orbit{
  position:absolute;

  width:152px;
  height:152px;

  border-radius:50%;

  border:
    1px solid rgba(255,135,0,.075);
}


.at-ai-orbit::before,
.at-ai-orbit::after{
  content:"";

  position:absolute;

  border-radius:50%;

  border:
    1px solid rgba(255,255,255,.035);
}


.at-ai-orbit::before{
  inset:15px;
}


.at-ai-orbit::after{
  inset:31px;
}


.at-ai-head{
  position:relative;

  width:118px;
  height:92px;

  border-radius:
    31px 31px 27px 27px;

  background:
    linear-gradient(
      145deg,
      #292f38 0%,
      #151920 44%,
      #090b0e 100%
    );

  border:
    1px solid rgba(255,255,255,.10);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 20px 30px rgba(0,0,0,.28);
}


.at-ai-head::before{
  content:"";

  position:absolute;

  left:50%;
  top:-18px;

  width:3px;
  height:18px;

  transform:translateX(-50%);

  border-radius:3px;

  background:#626974;
}


.at-ai-head::after{
  content:"";

  position:absolute;

  left:50%;
  top:-24px;

  width:9px;
  height:9px;

  transform:translateX(-50%);

  border-radius:50%;

  background:var(--at-orange-2);

  box-shadow:
    0 0 12px rgba(255,135,0,.36);
}


.at-ai-face{
  position:absolute;

  inset:17px 13px 20px;

  overflow:hidden;

  border-radius:18px;

  background:
    linear-gradient(
      180deg,
      #07090b,
      #0b0d10
    );

  border:
    1px solid rgba(255,135,0,.15);
}


.at-ai-eye{
  position:absolute;

  top:22px;

  width:18px;
  height:6px;

  border-radius:99px;

  background:var(--at-orange);

  box-shadow:
    0 0 9px rgba(255,135,0,.62);

  animation:
    atBlink 4.5s ease-in-out infinite;
}


.at-ai-eye.r{
  right:19px;
}


.at-ai-eye.l{
  left:19px;
}


@keyframes atBlink{
  0%,92%,100%{
    transform:scaleY(1);
  }

  95%{
    transform:scaleY(.10);
  }
}


.at-ai-monogram{
  position:absolute;

  left:50%;
  bottom:7px;

  transform:translateX(-50%);

  color:#936123;

  font-size:11px;
  font-weight:950;
  letter-spacing:-1px;
}


.at-ai-core{
  position:absolute;

  bottom:-25px;
  left:50%;

  transform:translateX(-50%);

  width:72px;
  height:35px;

  display:grid;
  place-items:center;

  color:var(--at-orange-2);

  font-weight:900;
  font-size:13px;

  background:
    linear-gradient(
      145deg,
      #1b2027,
      #0b0d10
    );

  border:
    1px solid rgba(255,135,0,.16);

  border-radius:13px;

  box-shadow:
    0 12px 24px rgba(0,0,0,.25);
}


/* ============================================================
   STATS
   ============================================================ */

.at-main .stats{
  display:grid!important;

  grid-template-columns:
    repeat(4,minmax(0,1fr))!important;

  gap:10px!important;

  margin-bottom:14px!important;
}


.at-main .stats article{
  min-width:0!important;
  min-height:112px!important;

  display:flex!important;
  flex-direction:column!important;

  justify-content:center!important;

  padding:16px!important;

  background:
    linear-gradient(
      145deg,
      #101319,
      #0b0d11
    )!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:16px!important;

  box-shadow:none!important;

  transition:
    transform .15s var(--at-ease),
    border-color .16s var(--at-ease)!important;

  animation:
    atStatIn .24s var(--at-ease) both;
}


.at-main .stats article:nth-child(2){
  animation-delay:.025s;
}

.at-main .stats article:nth-child(3){
  animation-delay:.05s;
}

.at-main .stats article:nth-child(4){
  animation-delay:.075s;
}


@keyframes atStatIn{
  from{
    opacity:0;
    transform:translateY(7px);
  }

  to{
    opacity:1;
    transform:none;
  }
}


.at-main .stats article:hover{
  border-color:
    rgba(255,135,0,.13)!important;
}


.at-main .stats article:active{
  transform:scale(.97);
}


.at-main .stats article strong{
  display:block;

  order:2;

  margin-top:8px;

  color:#fff!important;

  font-size:29px!important;
  line-height:1;

  font-weight:800!important;

  font-variant-numeric:
    tabular-nums;
}


.at-main .stats article span,
.at-main .stats article small{
  color:var(--at-muted)!important;
}


/* ============================================================
   CARDS / PANELS / SECTIONS
   ============================================================ */

.at-main .panel,
.at-main .card,
.at-main article,
.at-main .box{
  background:
    linear-gradient(
      145deg,
      #101319,
      #0b0d11
    )!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:17px!important;

  box-shadow:none!important;
}


.at-main .panel,
.at-main .card{
  transition:
    transform .15s var(--at-ease),
    border-color .16s var(--at-ease)!important;
}


.at-main .panel:hover,
.at-main .card:hover{
  border-color:
    rgba(255,135,0,.12)!important;
}


.at-main .panel:active,
.at-main .card:active{
  transform:scale(.992);
}


.at-main h2{
  color:#fff!important;

  font-size:17px!important;
  font-weight:720!important;
}


.at-main h3{
  color:#fff!important;

  font-size:14px!important;
  font-weight:680!important;
}


.at-main p,
.at-main small{
  color:var(--at-muted)!important;
}


/* ============================================================
   FORMS
   ============================================================ */

.at-main input,
.at-main textarea,
.at-main select,
.login-card input{
  min-height:44px;

  color:#f1f2f4!important;

  background:
    #0b0e12!important;

  border:
    1px solid rgba(255,255,255,.08)!important;

  border-radius:12px!important;

  outline:none!important;

  box-shadow:none!important;

  transition:
    border-color .16s var(--at-ease),
    box-shadow .16s var(--at-ease),
    background .16s var(--at-ease)!important;
}


.at-main textarea{
  min-height:105px;
}


.at-main input:focus,
.at-main textarea:focus,
.at-main select:focus,
.login-card input:focus{
  border-color:
    var(--at-orange)!important;

  box-shadow:
    0 0 0 3px
    rgba(255,135,0,.075)!important;

  background:
    #0d1015!important;
}


.at-main input::placeholder,
.at-main textarea::placeholder,
.login-card input::placeholder{
  color:#5f6670!important;
}


/* ============================================================
   BUTTONS
   ============================================================ */

.at-main button,
.login-card button{
  border-radius:12px!important;

  transition:
    transform .14s var(--at-ease),
    border-color .16s var(--at-ease),
    background .16s var(--at-ease),
    box-shadow .16s var(--at-ease)!important;
}


.at-main button:active,
.login-card button:active{
  transform:scale(.97);
}


.at-main button.primary,
.at-main .primary,
.at-main button.facebook,
.at-main #connectMetaBtn,
.login-card button[type="submit"]{
  color:#130b02!important;

  font-weight:780!important;

  background:
    linear-gradient(
      135deg,
      var(--at-gold),
      var(--at-orange)
    )!important;

  border:
    1px solid rgba(255,199,87,.34)!important;

  box-shadow:
    0 8px 21px rgba(255,135,0,.11)!important;
}


.at-main button.ghost,
.at-main .ghost,
.at-main #syncPagesBtn{
  color:#eceef1!important;

  background:
    #111419!important;

  border:
    1px solid rgba(255,135,0,.19)!important;

  box-shadow:none!important;
}


/* ============================================================
   FACEBOOK / PAGES
   ============================================================ */

#view-pages .top-actions{
  display:flex!important;
  flex-wrap:wrap!important;

  gap:8px!important;

  margin-bottom:14px!important;
}


#view-pages #connectMetaBtn{
  min-height:46px!important;

  padding-inline:17px!important;
}


#view-pages .panel,
#view-pages article{
  margin-bottom:12px!important;
}


/* ============================================================
   RULES
   ============================================================ */

#view-rules .panel{
  margin-bottom:12px!important;
}


#view-rules form,
#view-rules .form-grid{
  gap:10px!important;
}


.at-reply-count{
  display:grid!important;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:8px!important;
}


.at-reply-count button{
  position:relative;

  min-height:58px!important;

  color:#9ba1ab!important;

  background:
    #101319!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:14px!important;

  box-shadow:none!important;

  font-size:18px!important;
  font-weight:800!important;
}


.at-reply-count button.active{
  color:#fff!important;

  background:
    rgba(255,135,0,.07)!important;

  border-color:
    rgba(255,135,0,.38)!important;
}


.at-reply-count button.active::after{
  content:"✓";

  position:absolute;

  top:7px;
  left:8px;

  color:var(--at-orange-2);

  font-size:10px;
}


/* ============================================================
   MESSENGER — REAL CHAT FEEL
   ============================================================ */

#view-inbox,
#view-messenger{
  min-height:
    calc(100dvh - 116px);
}


.inbox-layout{
  display:grid!important;

  grid-template-columns:
    350px minmax(0,1fr)!important;

  gap:10px!important;

  min-height:
    calc(100dvh - 120px)!important;
}


.inbox-list-panel{
  background:
    #0b0e12!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:17px!important;

  overflow:hidden!important;
}


.conversation-panel{
  background:
    #090c10!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:17px!important;

  overflow:hidden!important;
}


.conversation-item,
.inbox-item{
  padding:12px!important;

  border-bottom:
    1px solid rgba(255,255,255,.04)!important;

  transition:
    background .15s var(--at-ease),
    transform .15s var(--at-ease)!important;
}


.conversation-item:hover,
.inbox-item:hover{
  background:
    rgba(255,135,0,.026)!important;
}


.conversation-item:active,
.inbox-item:active{
  transform:scale(.985);
}


.message-list{
  background:
    radial-gradient(
      440px 300px at 90% 0,
      rgba(255,135,0,.025),
      transparent 65%
    ),
    #090c10!important;
}


.message,
.message-bubble,
.bubble{
  max-width:min(76%,650px);

  padding:10px 12px!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:15px!important;

  line-height:1.65;
}


.message.auto,
.message.at-auto,
.auto-reply{
  background:
    rgba(255,135,0,.055)!important;

  border-color:
    rgba(255,135,0,.14)!important;
}


.reply-box{
  padding:10px!important;

  background:
    #0d1015!important;

  border-top:
    1px solid var(--at-line)!important;
}


/* ============================================================
   COMMENTS
   ============================================================ */

#view-comments article,
#view-comments .comment,
#view-comments .comment-card{
  margin-bottom:9px!important;

  padding:13px!important;

  background:
    #101318!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:15px!important;

  box-shadow:none!important;
}


/* ============================================================
   BADGES
   ============================================================ */

.at-main .badge{
  color:var(--at-orange-2)!important;

  background:
    rgba(255,135,0,.06)!important;

  border:
    1px solid rgba(255,135,0,.14)!important;
}


.at-main .badge.success{
  color:#8fd2a8!important;

  background:
    rgba(85,189,122,.06)!important;

  border-color:
    rgba(85,189,122,.15)!important;
}


.at-main .badge.error,
.at-main .badge.danger{
  color:#e8a3a3!important;

  background:
    rgba(224,105,105,.06)!important;

  border-color:
    rgba(224,105,105,.15)!important;
}


/* ============================================================
   LOGIN
   ============================================================ */

.login-card{
  position:relative;

  overflow:hidden;

  background:
    radial-gradient(
      360px 220px at 50% 0,
      rgba(255,135,0,.075),
      transparent 66%
    ),
    linear-gradient(
      145deg,
      #111419,
      #090b0e
    )!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:22px!important;

  box-shadow:
    0 28px 74px rgba(0,0,0,.43)!important;
}


.at-login-brand{
  text-align:center;

  margin-bottom:21px;
}


.at-login-logo{
  width:58px;
  height:58px;

  margin:0 auto 12px;

  display:grid;
  place-items:center;

  border-radius:17px;

  color:#120a02;

  font-size:20px;
  font-weight:950;

  background:
    linear-gradient(
      145deg,
      var(--at-gold),
      var(--at-orange)
    );

  box-shadow:
    0 12px 28px rgba(255,135,0,.14);
}


.at-login-brand strong{
  display:block;

  color:#fff;

  font-size:22px;
}


.at-login-brand span{
  display:block;

  margin-top:5px;

  color:var(--at-muted);

  font-size:11px;
}


/* ============================================================
   SPLASH
   ============================================================ */

.at-splash{
  position:fixed;

  inset:0;

  z-index:100000;

  display:grid;
  place-items:center;

  background:
    radial-gradient(
      340px 240px at 50% 50%,
      rgba(255,135,0,.10),
      transparent 67%
    ),
    #050609;

  transition:
    opacity .24s var(--at-ease);
}


.at-splash.hide{
  opacity:0;
  pointer-events:none;
}


.at-splash-content{
  text-align:center;
}


.at-splash-mark{
  width:70px;
  height:70px;

  display:grid;
  place-items:center;

  margin:0 auto;

  color:#120a02;

  font-size:23px;
  font-weight:950;

  border-radius:20px;

  background:
    linear-gradient(
      145deg,
      var(--at-gold),
      var(--at-orange)
    );

  box-shadow:
    0 20px 44px rgba(255,135,0,.13);
}


.at-splash-title{
  margin-top:14px;

  color:#fff;

  font-size:19px;
  font-weight:780;
}


.at-splash-sub{
  margin-top:4px;

  color:var(--at-muted);

  font-size:10px;

  letter-spacing:.06em;
}


/* ============================================================
   SKELETON / SHIMMER
   ============================================================ */

.skeleton,
.at-skeleton{
  position:relative;

  overflow:hidden;

  background:
    #14181e!important;

  border-radius:11px;
}


.skeleton::after,
.at-skeleton::after{
  content:"";

  position:absolute;

  inset:0;

  transform:
    translateX(110%);

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,135,0,.04),
      transparent
    );

  animation:
    atShimmer 1.25s linear infinite;
}


@keyframes atShimmer{
  to{
    transform:
      translateX(-110%);
  }
}


/* ============================================================
   TOAST
   ============================================================ */

.toast{
  left:50%!important;
  right:auto!important;

  bottom:18px!important;

  width:
    min(92vw,420px)!important;

  padding:12px 14px!important;

  color:#fff!important;

  background:
    #111419!important;

  border:
    1px solid rgba(255,135,0,.14)!important;

  border-radius:14px!important;

  box-shadow:
    0 18px 45px rgba(0,0,0,.38)!important;

  transform:
    translate(-50%,100px)!important;
}


.toast.show{
  transform:
    translate(-50%,0)!important;
}


/* ============================================================
   MOBILE BOTTOM NAV
   ============================================================ */

.at-mobile-nav{
  display:none;
}


.at-drawer-overlay{
  display:none;
}


/* ============================================================
   TABLES / LOGS
   ============================================================ */

.at-main table{
  width:100%;

  border-collapse:separate;
  border-spacing:0;

  overflow:hidden;

  background:
    #0c0f13!important;

  border:
    1px solid var(--at-line)!important;

  border-radius:15px!important;
}


.at-main th{
  color:#aeb3bc!important;

  background:
    #111419!important;

  font-size:11px!important;
  font-weight:680!important;
}


.at-main td,
.at-main th{
  padding:11px 12px!important;

  border-bottom:
    1px solid rgba(255,255,255,.04)!important;
}


/* ============================================================
   DESKTOP
   ============================================================ */

@media(min-width:901px){

  .at-menu-mobile{
    display:none!important;
  }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:900px){

  body{
    padding-bottom:80px!important;
  }


  body.at-drawer-open{
    overflow:hidden;
  }


  .at-shell{
    display:block;

    min-height:100dvh;
  }


  .at-topbar{
    position:sticky;
    top:0;

    height:64px;

    display:flex;

    padding:0 12px;

    border-bottom:
      1px solid var(--at-line);
  }


  .at-brand-mark{
    width:39px;
    height:39px;

    flex-basis:39px;

    border-radius:12px;

    font-size:14px;
  }


  .at-brand-copy span,
  .at-page-heading small{
    display:none;
  }


  .at-page-heading{
    margin-inline-start:7px;
  }


  .at-page-heading b{
    max-width:115px;

    font-size:13px;
  }


  .at-sidebar{
    position:fixed;

    top:0;
    right:0;
    bottom:0;

    z-index:999;

    width:min(87vw,340px);
    height:100dvh;

    padding:
      70px 12px 16px;

    visibility:hidden;
    opacity:0;

    pointer-events:none;

    transform:
      translate3d(104%,0,0);

    transition:
      transform .24s var(--at-ease),
      opacity .19s var(--at-ease),
      visibility .24s;

    box-shadow:
      -24px 0 60px rgba(0,0,0,.50);
  }


  .at-sidebar.open{
    visibility:visible;
    opacity:1;

    pointer-events:auto;

    transform:
      translate3d(0,0,0);
  }


  .at-drawer-overlay{
    position:fixed;

    inset:0;

    z-index:998;

    display:block;

    visibility:hidden;
    opacity:0;

    pointer-events:none;

    background:
      rgba(0,0,0,.66);

    transition:
      opacity .20s var(--at-ease),
      visibility .20s;
  }


  .at-drawer-overlay.show{
    visibility:visible;
    opacity:1;

    pointer-events:auto;
  }


  .at-drawer-close{
    position:absolute;

    top:15px;
    left:15px;

    width:40px;
    height:40px;

    display:grid;
    place-items:center;

    color:#fff;

    background:
      #0f1217;

    border:
      1px solid var(--at-line);

    border-radius:12px;
  }


  .at-drawer-close svg{
    width:19px;
    height:19px;
  }


  .at-main{
    padding:
      14px 12px 20px;
  }


  .at-dashboard-head{
    min-height:175px;

    grid-template-columns:
      minmax(0,1fr) 104px;

    gap:8px;

    padding:18px;

    border-radius:19px;
  }


  .at-dashboard-head h1{
    font-size:20px!important;
  }


  .at-dashboard-head p{
    font-size:12px;

    line-height:1.7;
  }


  .at-ai-mascot{
    width:104px;
    height:125px;
  }


  .at-ai-orbit{
    width:105px;
    height:105px;
  }


  .at-ai-head{
    width:88px;
    height:70px;

    border-radius:
      24px 24px 21px 21px;
  }


  .at-ai-face{
    inset:
      13px 10px 15px;
  }


  .at-ai-eye{
    top:17px;

    width:13px;
    height:5px;
  }


  .at-ai-eye.r{
    right:14px;
  }

  .at-ai-eye.l{
    left:14px;
  }


  .at-ai-core{
    bottom:-20px;

    width:57px;
    height:29px;

    font-size:11px;
  }


  .at-main .stats{
    grid-template-columns:
      repeat(2,minmax(0,1fr))!important;
  }


  .at-main .stats article{
    min-height:102px!important;

    padding:14px!important;
  }


  .at-main .stats article strong{
    font-size:25px!important;
  }


  .at-mobile-nav{
    position:fixed;

    left:11px;
    right:11px;

    bottom:
      max(
        9px,
        env(safe-area-inset-bottom)
      );

    z-index:900;

    height:60px;

    display:flex;
    align-items:center;
    justify-content:space-around;

    padding:6px;

    overflow:hidden;

    background:
      #0d1014;

    border:
      1px solid var(--at-line);

    border-radius:18px;

    box-shadow:
      0 15px 40px rgba(0,0,0,.40);
  }


  .at-mobile-item{
    height:48px!important;

    min-width:48px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    gap:5px!important;

    padding:0 8px!important;

    color:#727985!important;

    background:transparent!important;

    border:0!important;

    border-radius:13px!important;

    box-shadow:none!important;
  }


  .at-mobile-item svg{
    width:20px;
    height:20px;

    transition:
      transform .17s var(--at-ease);
  }


  .at-mobile-item span{
    max-width:0;

    overflow:hidden;

    opacity:0;

    white-space:nowrap;

    font-size:10px;

    transition:
      max-width .17s var(--at-ease),
      opacity .15s var(--at-ease);
  }


  .at-mobile-item.active{
    color:
      var(--at-orange-2)!important;

    background:
      rgba(255,135,0,.07)!important;
  }


  .at-mobile-item.active svg{
    transform:scale(1.08);
  }


  .at-mobile-item.active span{
    max-width:66px;

    opacity:1;
  }


  .inbox-layout{
    display:block!important;

    min-height:
      calc(100dvh - 145px)!important;
  }


  .inbox-list-panel{
    min-height:
      calc(100dvh - 145px)!important;
  }


  .conversation-panel{
    border-radius:0!important;
  }


  .at-main table{
    display:block;

    overflow-x:auto;

    white-space:nowrap;
  }

}


@media(max-width:410px){

  .at-dashboard-head{
    grid-template-columns:
      minmax(0,1fr) 82px;
  }


  .at-ai-mascot{
    transform:scale(.82);
    transform-origin:center;
  }


  .at-hero-actions{
    gap:6px;
  }


  .at-primary-action,
  .at-secondary-action{
    min-height:39px!important;

    padding-inline:11px!important;

    font-size:11px!important;
  }

}


/* ============================================================
   LIGHT MODE
   ============================================================ */

html[data-theme="light"] body,
body.light{
  --at-bg:#f1eee9;
  --at-bg-soft:#f6f3ef;

  --at-surface:#fbfaf8;
  --at-surface-2:#f2efe9;

  --at-text:#202329;
  --at-text-2:#424750;
  --at-muted:#6e747d;

  --at-line:
    rgba(20,20,20,.09);

  --at-line-2:
    rgba(20,20,20,.13);

  background:
    #f3f0eb!important;

  color:#23262c!important;
}


/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media(prefers-reduced-motion:reduce){

  *,
  *::before,
  *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }

}

/* =========================================================
   ATAKET — DUPLICATE UI HARD CLEANUP
   Keep ONLY Rebirth shell
   ========================================================= */

/* Previous navigation layers */
.at-bottom-nav,
.rp-bottom-nav,
.at-root-bottom,
.at-bottom-navigation,
.bottom-nav:not(.at-mobile-nav),
.mobile-bottom-nav:not(.at-mobile-nav),
nav.at-bottom-nav,
nav.rp-bottom-nav,
nav.at-root-bottom{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* Previous injected headers / brands / robots */
.at-header-brand,
.rp-header-brand,
.at-root-header,
.at-dashboard-hero,
.rp-dashboard-intro,
.at-root-hero,
.rp-login-head,
.at-login-brand-old,
.at-splash-old{
  display:none !important;
}

/* We want ONE mobile navigation only */
.at-mobile-nav{
  display:none;
}

@media(max-width:900px){
  .at-mobile-nav{
    display:flex !important;
  }
}

/* =========================================================
   LOGIN — ONE CLEAN PREMIUM SCREEN
   ========================================================= */

.login-card{
  width:min(92vw,430px) !important;
  margin:32px auto !important;
  padding:32px 24px 28px !important;

  background:
    radial-gradient(
      400px 210px at 50% -10%,
      rgba(255,135,0,.08),
      transparent 68%
    ),
    #0b0e12 !important;

  border:1px solid rgba(255,255,255,.075) !important;
  border-radius:22px !important;

  box-shadow:
    0 26px 70px rgba(0,0,0,.38) !important;
}

/* Never show two branding blocks */
.login-card .at-login-brand{
  display:none !important;
}

/* Original logo inside login */
.login-card img{
  max-width:82px !important;
  max-height:82px !important;

  display:block !important;

  margin:0 auto 18px !important;

  object-fit:contain !important;

  border-radius:20px !important;

  box-shadow:
    0 14px 34px rgba(255,135,0,.09) !important;
}

/* Original title */
.login-card h1,
.login-card h2{
  margin:5px 0 7px !important;

  text-align:center !important;

  color:#f7f7f8 !important;

  font-size:25px !important;
  font-weight:780 !important;

  line-height:1.25 !important;
}

.login-card > p{
  max-width:320px !important;

  margin:0 auto 25px !important;

  text-align:center !important;

  color:#878e99 !important;

  font-size:13px !important;
  line-height:1.7 !important;
}

.login-card label{
  display:block !important;

  margin:0 2px 7px !important;

  color:#aeb3bc !important;

  font-size:12px !important;
  font-weight:550 !important;
}

.login-card input{
  width:100% !important;
  min-height:48px !important;

  margin-bottom:15px !important;

  padding:0 14px !important;

  color:#f4f5f6 !important;

  background:#090c10 !important;

  border:1px solid rgba(255,255,255,.085) !important;
  border-radius:13px !important;

  box-shadow:none !important;

  outline:none !important;
}

.login-card input:focus{
  border-color:#ff8a00 !important;

  box-shadow:
    0 0 0 3px rgba(255,138,0,.07) !important;
}

.login-card button[type="submit"],
.login-card .primary{
  width:100% !important;
  min-height:49px !important;

  margin-top:4px !important;

  color:#150d04 !important;

  font-size:14px !important;
  font-weight:800 !important;

  background:
    linear-gradient(
      135deg,
      #ffc15a,
      #ff8700
    ) !important;

  border:1px solid rgba(255,199,88,.32) !important;
  border-radius:13px !important;

  box-shadow:
    0 10px 26px rgba(255,135,0,.12) !important;
}

/* No navigation while login form is visible */
body:has(.login-card:not([hidden]))
.at-mobile-nav{
  display:none !important;
}

body:has(.login-card:not([hidden]))
.at-sidebar{
  display:none !important;
}

body:has(.login-card:not([hidden]))
.at-topbar{
  display:none !important;
}

/* Login should not reserve app-shell/sidebar space */
body:has(.login-card:not([hidden]))
.at-shell{
  display:block !important;
}

body:has(.login-card:not([hidden]))
.at-main{
  width:100% !important;

  padding:15px !important;
}

/* Prevent horizontal mobile overflow */
html,
body{
  overflow-x:hidden !important;
  max-width:100% !important;
}

@media(max-width:900px){
  .login-card{
    margin:18px auto !important;
    padding:27px 19px 24px !important;
  }

  body:has(.login-card:not([hidden])){
    padding-bottom:0 !important;
  }
}