/* Arpack Messenger v58 — professional interface layer */
:root{
  --ap-bg:#07101d;
  --ap-bg-2:#0b1628;
  --ap-surface:#0f1d31;
  --ap-surface-2:#13253d;
  --ap-glass:rgba(15,29,49,.78);
  --ap-border:rgba(148,163,184,.14);
  --ap-border-strong:rgba(96,165,250,.30);
  --ap-text:#eef5ff;
  --ap-muted:#94a7c3;
  --ap-primary:#388bff;
  --ap-primary-2:#19b6d7;
  --ap-green:#18b981;
  --ap-danger:#ef5260;
  --ap-radius:22px;
  --ap-shadow:0 28px 72px rgba(1,8,20,.42);
}
*{scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.24) transparent}
*::-webkit-scrollbar{width:7px;height:7px}
*::-webkit-scrollbar-thumb{background:rgba(148,163,184,.25);border-radius:30px}
*::-webkit-scrollbar-track{background:transparent}
body{color:var(--ap-text);background:var(--ap-bg);}
a,button{transition:transform .16s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease}
button:active,a:active{transform:scale(.985)}
.brand-logo img,[data-brand-logo] img{width:100%;height:100%;object-fit:contain;display:block}
.pro-pill{display:inline-flex;align-items:center;gap:.55rem;padding:.55rem .9rem;border-radius:999px;border:1px solid var(--ap-border);background:rgba(255,255,255,.04);color:#c9dcfa;font-size:.78rem;font-weight:800}
.pro-pill-dot{width:7px;height:7px;border-radius:50%;background:var(--ap-green);box-shadow:0 0 0 6px rgba(24,185,129,.13)}

/* Public landing */
.pro-landing{min-height:100dvh;overflow-x:hidden;background:
 radial-gradient(circle at 14% 0%,rgba(56,139,255,.24),transparent 35%),
 radial-gradient(circle at 78% 12%,rgba(25,182,215,.15),transparent 33%),
 linear-gradient(140deg,#07101d 0%,#0b1527 44%,#08101c 100%);}
.pro-landing::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.24;background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(to bottom,black,transparent 75%)}
.landing-shell{position:relative;max-width:1240px;margin:0 auto;padding:28px 28px 42px;min-height:100dvh;display:flex;flex-direction:column}
.landing-header{height:72px;border:1px solid var(--ap-border);background:rgba(8,17,31,.62);backdrop-filter:blur(18px);border-radius:22px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;gap:18px;box-shadow:0 18px 50px rgba(0,0,0,.22)}
.landing-brand{display:flex;align-items:center;gap:12px;min-width:0}
.landing-logo{width:48px;height:48px;border-radius:15px;padding:8px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(56,139,255,.25),rgba(25,182,215,.12));border:1px solid rgba(96,165,250,.26);overflow:hidden}
.landing-brand-text{display:flex;flex-direction:column;line-height:1.25}.landing-brand-text strong{font-weight:950;color:#fff;font-size:1rem}.landing-brand-text span{font-size:.72rem;color:var(--ap-muted);letter-spacing:.08em;text-transform:uppercase}
.landing-nav{display:flex;gap:10px;align-items:center}
.pro-btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;height:50px;padding:0 23px;border-radius:15px;font-size:.9rem;font-weight:900;white-space:nowrap;border:1px solid transparent}
.pro-btn.primary{background:linear-gradient(135deg,var(--ap-primary),#2474f2);color:#fff;box-shadow:0 17px 34px rgba(56,139,255,.25)}
.pro-btn.primary:hover{box-shadow:0 20px 40px rgba(56,139,255,.34);transform:translateY(-1px)}
.pro-btn.secondary{background:rgba(255,255,255,.04);border-color:var(--ap-border);color:#e5efff}.pro-btn.secondary:hover{background:rgba(255,255,255,.08);border-color:rgba(148,163,184,.25)}
.landing-hero{display:grid;grid-template-columns:minmax(360px,1fr) minmax(390px,520px);align-items:center;gap:74px;flex:1;padding:64px 0 48px}
.hero-copy h1{margin:20px 0 14px;font-size:clamp(2.6rem,4.5vw,4.5rem);line-height:1.25;color:#fff;font-weight:950;letter-spacing:-.04em}
.hero-copy h1 em{font-style:normal;background:linear-gradient(90deg,#7ab7ff,#2fd1e8);background-clip:text;color:transparent}
.hero-copy p{max-width:530px;color:#9eb0ca;font-size:1.02rem;line-height:2.1}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.trust-row{display:flex;gap:20px;flex-wrap:wrap;margin-top:48px}.trust-item{display:flex;gap:10px;align-items:center;color:#b6c8e2;font-size:.82rem;font-weight:800}.trust-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:rgba(56,139,255,.10);border:1px solid rgba(56,139,255,.20);color:#74b3ff}
.hero-product{position:relative}
.hero-product::before{content:"";position:absolute;inset:18% -20% auto 10%;height:58%;background:rgba(56,139,255,.20);filter:blur(72px);border-radius:50%;z-index:0}
.mock-app{position:relative;z-index:1;padding:13px;border-radius:34px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);box-shadow:0 40px 90px rgba(0,0,0,.46);backdrop-filter:blur(18px)}
.mock-inner{display:grid;grid-template-columns:138px 1fr;min-height:504px;border-radius:25px;overflow:hidden;background:#081323;border:1px solid rgba(255,255,255,.06)}
.mock-sidebar{padding:17px 10px;background:#0b182a;border-left:1px solid rgba(255,255,255,.06)}
.mock-side-title{height:14px;width:68px;border-radius:10px;background:#29405d;margin:8px 7px 23px}
.mock-chat-row{display:flex;align-items:center;gap:8px;padding:9px 7px;border-radius:13px;margin-bottom:7px}.mock-chat-row.active{background:rgba(56,139,255,.17)}
.mock-avatar{width:29px;height:29px;border-radius:11px;background:linear-gradient(135deg,#388bff,#18bdd3);flex:none}.mock-avatar.muted{background:#273950}.mock-lines{flex:1}.mock-lines span{display:block;height:6px;border-radius:5px;background:#24374f;margin:5px 0}.mock-lines span:first-child{width:78%;background:#415976}.mock-main{display:flex;flex-direction:column;background:linear-gradient(180deg,#091525,#0a1523)}
.mock-header{height:60px;border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;padding:0 17px;gap:9px}.mock-header .mock-avatar{width:35px;height:35px;border-radius:13px}.mock-status{font-size:8px;color:#24d08d;margin-top:5px}
.mock-messages{padding:27px 20px;display:flex;flex-direction:column;gap:12px;flex:1;justify-content:end}.mock-msg{border-radius:17px 17px 5px 17px;background:rgba(56,139,255,.78);height:auto;min-height:45px;padding:13px 15px;width:75%;margin-right:auto}.mock-msg.other{margin-right:0;background:#13253d;border-radius:17px 17px 17px 5px;width:68%}.mock-msg.small{width:51%}.mock-msg span{height:7px;background:rgba(255,255,255,.62);border-radius:8px;display:block;width:100%;margin:4px 0}.mock-msg span:last-child{width:55%;opacity:.55}
.mock-composer{margin:0 15px 16px;background:#112137;height:47px;border:1px solid rgba(148,163,184,.12);border-radius:18px;display:flex;align-items:center;padding:0 14px;gap:9px}.mock-compose-line{height:7px;width:48%;background:#344861;border-radius:8px}.mock-send{margin-right:auto;width:29px;height:29px;border-radius:10px;background:var(--ap-primary)}
.landing-foot{display:flex;justify-content:space-between;gap:16px;border-top:1px solid rgba(148,163,184,.12);padding-top:22px;color:var(--ap-muted);font-size:.78rem}

/* Auth pages */
.pro-auth-page{min-height:100dvh;overflow-y:auto!important;background:radial-gradient(circle at 12% 12%,rgba(56,139,255,.19),transparent 37%),linear-gradient(140deg,#07101d,#0b1628)!important;color:var(--ap-text)!important}
.pro-auth-shell{max-width:1140px;margin:0 auto;display:grid!important;grid-template-columns:1.03fr .87fr;gap:32px;padding:32px!important;align-items:stretch!important;min-height:100dvh!important}
.auth-showcase{border:1px solid var(--ap-border);border-radius:32px;background:linear-gradient(155deg,rgba(19,37,61,.78),rgba(7,16,29,.66));padding:48px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;box-shadow:var(--ap-shadow)}
.auth-showcase::after{content:"";position:absolute;width:350px;height:350px;left:-110px;bottom:-120px;border-radius:50%;background:rgba(56,139,255,.23);filter:blur(65px)}
.auth-showcase-brand{display:flex;align-items:center;gap:12px;position:relative;z-index:1}.auth-showcase-brand .brand-logo{width:52px;height:52px;padding:8px;border-radius:16px;background:rgba(56,139,255,.15);border:1px solid var(--ap-border-strong)}
.auth-showcase h2{position:relative;z-index:1;font-size:clamp(2rem,3.3vw,2.85rem);line-height:1.55;color:#fff;font-weight:950;margin-top:58px}.auth-showcase p{position:relative;z-index:1;font-size:.94rem;line-height:2;color:var(--ap-muted);margin-top:13px;max-width:450px}
.auth-feature-list{position:relative;z-index:1;display:grid;gap:12px;margin-top:42px}.auth-feature{border:1px solid var(--ap-border);background:rgba(255,255,255,.035);border-radius:17px;padding:13px 15px;display:flex;align-items:center;gap:12px;color:#d7e3f6;font-weight:800;font-size:.82rem}.auth-feature span{color:#65afff}
.auth-form-column{display:flex;flex-direction:column;justify-content:center;gap:20px}.auth-mobile-brand{display:none;align-items:center;gap:10px;color:#fff;font-weight:900}.auth-mobile-brand .brand-logo{width:43px;height:43px;border-radius:13px;padding:7px;background:rgba(56,139,255,.16);border:1px solid var(--ap-border-strong)}
.pro-auth-page .auth-card{max-width:none!important;background:rgba(15,29,49,.88)!important;border:1px solid var(--ap-border)!important;border-radius:30px!important;padding:36px!important;box-shadow:var(--ap-shadow)!important;backdrop-filter:blur(15px)}
.pro-auth-page .auth-logo{width:68px!important;height:68px!important;border-radius:22px!important;padding:10px;background:rgba(56,139,255,.12)!important;border:1px solid var(--ap-border-strong)!important}
.pro-auth-page .auth-title{font-size:1.8rem!important;letter-spacing:-.03em}.pro-auth-page .auth-subtitle{font-size:.82rem!important;color:var(--ap-muted)!important}
.pro-auth-page .auth-label{color:#cad9ef!important}.pro-auth-page .auth-input,.pro-auth-page .otp-digit{background:#091525!important;border-color:var(--ap-border)!important}.pro-auth-page .auth-input{height:53px;border-radius:15px!important}.pro-auth-page .auth-input:focus,.pro-auth-page .otp-digit:focus{border-color:rgba(56,139,255,.7)!important;box-shadow:0 0 0 4px rgba(56,139,255,.13)!important}.pro-auth-page .primary-btn{background:linear-gradient(135deg,var(--ap-primary),#2474f2)!important;color:#fff!important;border:none!important}.pro-auth-page .white-btn{background:#15263c!important;color:#eaf2ff!important;border-color:var(--ap-border)!important}.pro-auth-page .secondary-btn{background:#101f34!important;border-color:var(--ap-border)!important}.auth-security-note{font-size:.74rem;line-height:1.8;color:var(--ap-muted);display:flex;align-items:center;gap:8px;justify-content:center;margin-top:16px}.auth-security-note span{color:var(--ap-green)}

/* Main messenger application */
.pro-app-page{background:var(--ap-bg)!important;color:var(--ap-text)!important}
.pro-app-page #sidebar{width:356px!important;background:linear-gradient(180deg,#091525,#091321)!important;border-left:1px solid var(--ap-border)!important;box-shadow:14px 0 50px rgba(0,0,0,.12)}
.sidebar-brandbar{display:flex;align-items:center;gap:11px;padding:18px 17px 12px}.sidebar-brandbar .brand-logo{width:42px;height:42px;padding:7px;border-radius:14px;background:rgba(56,139,255,.12);border:1px solid var(--ap-border-strong);overflow:hidden}.sidebar-brandbar-title{font-weight:950;color:#fff;font-size:.95rem}.sidebar-brandbar-caption{font-size:.68rem;color:var(--ap-muted);margin-top:2px}
.pro-app-page #sidebar>div:nth-child(2){background:transparent!important;border-color:var(--ap-border)!important;padding:10px 17px 16px!important}
.pro-app-page #my-avatar{border-radius:15px!important;background:linear-gradient(135deg,var(--ap-primary),var(--ap-primary-2))!important}
.pro-app-page .app-connection-box{background:rgba(255,255,255,.04);border:1px solid var(--ap-border);border-radius:999px;padding:6px 9px;font-size:.67rem;color:var(--ap-muted)}
.pro-app-page .sidebar-quick-menu{margin:0 12px 13px;padding:9px;background:#0c192a;border:1px solid var(--ap-border);border-radius:20px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.pro-app-page .sidebar-quick-menu button{height:59px;border-radius:14px;color:var(--ap-muted);font-size:.69rem;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px}.pro-app-page .sidebar-quick-menu button:hover{background:rgba(56,139,255,.10);color:#dfebff}.pro-app-page .sidebar-quick-menu img{width:17px;height:17px}
.pro-app-page #user-search{height:47px;background:#0d1a2c!important;border-color:var(--ap-border)!important;border-radius:16px!important;color:var(--ap-text)!important}.pro-app-page #search-results{background:#102138!important;border-color:var(--ap-border)!important;border-radius:18px!important}
.pro-app-page #conversations-list{padding:3px 8px 74px!important}.pro-app-page .conversation-item{padding:10px!important;border-radius:18px!important;margin:3px 0!important;border:1px solid transparent}.pro-app-page .conversation-item:hover{background:rgba(255,255,255,.04);border-color:rgba(148,163,184,.08)}.pro-app-page .conversation-item.active{background:linear-gradient(105deg,rgba(56,139,255,.20),rgba(25,182,215,.08))!important;border-color:rgba(56,139,255,.20)!important}.pro-app-page .conversation-avatar{border-radius:16px!important}.pro-app-page .conversation-title{color:#edf4ff!important}.pro-app-page .conversation-preview{color:var(--ap-muted)!important}.pro-app-page .conversation-unread-badge{background:var(--ap-primary)!important}
.pro-app-page .quick-create-fab{background:linear-gradient(135deg,var(--ap-primary),#246ef0)!important;box-shadow:0 16px 36px rgba(56,139,255,.38)!important}
.pro-app-page #chat-window{background:linear-gradient(160deg,#07101d,#091627)!important}.pro-app-page .chat-pattern{opacity:.29;background-image:radial-gradient(rgba(99,160,238,.16) 1px,transparent 1px);background-size:26px 26px}
.pro-app-page #chat-header{min-height:72px;background:rgba(9,21,37,.75)!important;border-color:var(--ap-border)!important;backdrop-filter:blur(20px)!important;padding:10px 22px!important}.pro-app-page .chat-header-avatar{border-radius:16px!important}.pro-app-page .chat-header-name{color:#eff6ff!important;font-size:1rem!important}.pro-app-page .chat-header-status{color:#72b7ff!important}.pro-app-page .chat-icon-btn{background:rgba(255,255,255,.045)!important;border:1px solid var(--ap-border)!important;border-radius:13px!important}.pro-app-page .chat-icon-btn:hover{background:rgba(56,139,255,.12)!important}
.pro-app-page #messages-container{padding:28px clamp(16px,5vw,56px)!important}.pro-empty-chat{height:100%;display:flex;align-items:center;justify-content:center}.pro-empty-panel{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;border:1px solid rgba(148,163,184,.12);background:rgba(15,29,49,.40);border-radius:32px;padding:40px 42px;max-width:380px;box-shadow:0 20px 55px rgba(0,0,0,.20)}.pro-empty-logo{width:74px;height:74px;border-radius:24px;padding:14px;background:rgba(56,139,255,.12);border:1px solid var(--ap-border-strong);margin-bottom:4px}.pro-empty-panel h3{font-size:1.15rem;font-weight:950;color:#fff}.pro-empty-panel p{font-size:.82rem;line-height:1.9;color:var(--ap-muted)}
.pro-app-page .message-bubble{border-radius:21px!important;padding:10px 13px!important;box-shadow:0 9px 22px rgba(0,0,0,.11)}.pro-app-page .message-me{background:linear-gradient(135deg,#287ef4,#256be1)!important;color:#fff!important}.pro-app-page .message-other{background:#112238!important;border:1px solid rgba(148,163,184,.09)!important}.pro-app-page .message-meta{color:rgba(214,228,248,.64)!important}.pro-app-page .message-date-pill{background:rgba(15,29,49,.72)!important;border:1px solid var(--ap-border)!important}
.pro-app-page #chat-footer{background:rgba(8,18,32,.88)!important;backdrop-filter:blur(20px);border-color:var(--ap-border)!important;padding:14px 20px calc(14px + env(safe-area-inset-bottom))!important}.pro-app-page .composer-input-wrap{background:#101f34!important;border:1px solid var(--ap-border)!important;border-radius:19px!important}.pro-app-page .composer-input{font-size:15px!important}.pro-app-page .composer-circle{background:#101f34!important;border-color:var(--ap-border)!important}.pro-app-page .composer-send{background:linear-gradient(135deg,var(--ap-primary),#2775ef)!important}
.pro-app-page .modal-card{background:#0e1b2e!important;border:1px solid var(--ap-border)!important;border-radius:28px!important;box-shadow:var(--ap-shadow)!important}.pro-app-page .modal-backdrop{background:rgba(1,8,20,.68)!important;backdrop-filter:blur(8px)}

/* Admin + diagnostics */
.pro-admin-page,.pro-debug-page{background:radial-gradient(circle at top right,rgba(56,139,255,.12),transparent 30%),var(--ap-bg)!important;color:var(--ap-text)!important}
.pro-admin-page .admin-wrap{max-width:1380px!important}.admin-pro-header{border:1px solid var(--ap-border)!important;border-radius:27px;padding:20px 24px!important;background:rgba(15,29,49,.72);backdrop-filter:blur(18px);margin-bottom:26px!important}.admin-brand-head{display:flex;align-items:center;gap:15px}.admin-brand-head .brand-logo{width:58px;height:58px;padding:9px;border-radius:19px;border:1px solid var(--ap-border-strong);background:rgba(56,139,255,.12)}.admin-brand-head h1{font-size:1.55rem!important}.admin-brand-head p{color:var(--ap-muted)!important}.pro-admin-page section{background:rgba(15,29,49,.72)!important;border-color:var(--ap-border)!important;border-radius:25px!important;box-shadow:0 12px 36px rgba(0,0,0,.16)!important}.pro-admin-page section>div:first-child{border-color:var(--ap-border)!important}.pro-admin-page .admin-input{height:auto;min-height:48px;background:#091525!important;border:1px solid var(--ap-border)!important;border-radius:14px!important;padding:13px 14px!important;color:var(--ap-text)!important}.pro-admin-page .admin-input:focus{border-color:rgba(56,139,255,.7)!important;box-shadow:0 0 0 4px rgba(56,139,255,.12)}.pro-admin-page .brand-preview{height:106px!important;background:#091525!important;border-color:rgba(96,165,250,.25)!important;border-radius:18px!important}.pro-admin-page #stats-grid>div{background:rgba(15,29,49,.72)!important;border:1px solid var(--ap-border)!important;border-radius:22px!important}.pro-admin-page .admin-action.blue,.pro-admin-page button.bg-blue-600{background:var(--ap-primary)!important}.pro-admin-page table{border-radius:18px;overflow:hidden}.pro-admin-page thead{background:#091525!important}
.pro-debug-page .card{background:rgba(15,29,49,.75)!important;border:1px solid var(--ap-border)!important;border-radius:22px!important;box-shadow:0 12px 34px rgba(0,0,0,.16)!important}.pro-debug-page .btn{border-radius:14px!important}.pro-debug-page pre{background:#07101d!important;border:1px solid var(--ap-border)}

@media(max-width:960px){
 .landing-shell{padding:16px}.landing-header{height:64px;padding:0 12px}.landing-nav .secondary{display:none}.landing-hero{grid-template-columns:1fr;gap:38px;padding:50px 0 28px}.hero-copy{text-align:center}.hero-copy p{margin:0 auto}.hero-actions,.trust-row{justify-content:center}.hero-product{max-width:520px;width:100%;margin:0 auto}.landing-foot{flex-direction:column;text-align:center}
 .pro-auth-shell{display:flex!important;flex-direction:column!important;justify-content:center;max-width:500px;padding:18px!important}.auth-showcase{display:none}.auth-mobile-brand{display:flex}.pro-auth-page .auth-card{padding:27px 22px!important;border-radius:25px!important}
}
@media(max-width:768px){
 .pro-app-page #sidebar{width:100%!important}.sidebar-brandbar{padding-top:calc(14px + env(safe-area-inset-top))}.pro-app-page #chat-header{padding-top:calc(10px + env(safe-area-inset-top))!important}.pro-app-page #messages-container{padding:20px 11px!important}.pro-empty-panel{padding:30px 22px;margin:0 18px}.pro-app-page .sidebar-quick-menu{grid-template-columns:repeat(6,1fr);margin:0 9px 10px;padding:7px}.pro-app-page .sidebar-quick-menu button{height:48px}.pro-app-page .sidebar-quick-menu span{display:none}.pro-admin-page{padding:10px!important}
}
@media(max-width:520px){.landing-brand-text span{display:none}.landing-logo{width:43px;height:43px}.hero-copy h1{font-size:2.22rem}.mock-inner{grid-template-columns:103px 1fr;min-height:416px}.mock-sidebar{padding:12px 5px}.mock-messages{padding:18px 11px}.pro-btn{width:100%}.hero-actions{display:grid}.trust-row{display:grid;gap:13px}.auth-mobile-brand{padding-right:5px}}
