:root{--dark:#081426;--dark-2:#0c1a30;--dark-3:#10213b;--dark-4:#142945;--dtext:#eef4ff;--dmuted:#94a6bf;--dborder:rgba(255,255,255,.09);--accent:#8655ec;--accent-2:#3478e6}
html,body{background:var(--dark)!important;color:var(--dtext)!important}
body{font-family:Inter,'Noto Sans Thai',sans-serif!important}
#darkTopbar{height:60px;display:flex;align-items:center;gap:16px;padding:0 22px;background:#071224;border-bottom:1px solid var(--dborder);color:var(--dtext);position:relative;z-index:30}
#darkTopbar .dark-brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:15px;white-space:nowrap}
#darkTopbar .dark-brand img{width:32px;height:32px;object-fit:cover;object-position:left;border-radius:9px;background:#fff}
#darkTopbar .dark-divider{width:1px;height:25px;background:var(--dborder)}
#darkTopbar .dark-search{width:min(410px,35vw);position:relative}
#darkTopbar .dark-search input{width:100%;border:1px solid var(--dborder);border-radius:9px;background:#ffffff09;color:var(--dtext);padding:9px 12px;font:12px inherit;outline:0}
#darkTopbar .dark-fill{flex:1}#darkTopbar .dark-date,#darkTopbar .dark-user{border:1px solid var(--dborder);border-radius:9px;background:#ffffff08;color:#cbd8ea}
#darkTopbar .dark-date{padding:8px 11px;font-size:12px}.dark-user{display:flex;align-items:center;gap:8px;padding:4px 10px 4px 4px}.dark-user i{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;font-style:normal;font-weight:800;background:linear-gradient(135deg,#bb7bf8,#4577ee)}.dark-user b{font-size:12px}.dark-user small{display:block;color:var(--dmuted);font-size:10px}
.app{height:calc(100vh - 60px)!important;grid-template-columns:190px 308px minmax(410px,1fr) 275px!important;background:radial-gradient(circle at 74% 0,#17345c 0,var(--dark) 48%)!important}
.rail,.list,.chat,.profile{background:var(--dark-2)!important;border-color:var(--dborder)!important}.rail{padding:16px 12px!important;gap:4px!important;align-items:stretch!important}.logo{width:48px!important;height:48px!important;margin:0 0 14px!important;align-self:center;border-radius:14px!important;background-size:212px auto!important;background-position:5% center!important}
.nav{width:100%!important;display:flex!important;align-items:center!important;gap:11px!important;padding:11px 12px!important;color:#aebdd1!important;text-align:left!important;border-radius:10px!important}.nav .dot{margin:0!important}.nav.active,.nav:hover{background:linear-gradient(135deg,#392263,#1b3971)!important;color:#fff!important}.nav.dark-logout{margin-top:auto;border:1px solid #ff9fa733!important;color:#ffb4bd!important}
.list{background:#0a192e!important}.list-head{padding:17px 16px 11px!important;border-color:var(--dborder)!important}.list-head h1{color:var(--dtext)!important}.list-head h1::after{display:none!important}.search{background:#ffffff08!important;border-color:var(--dborder)!important;color:var(--dtext)!important}.filters{padding:10px 16px 0!important;gap:6px!important}.filters:last-of-type{padding-bottom:11px;border-bottom:1px solid var(--dborder)}.filters button{background:#ffffff08!important;border-color:var(--dborder)!important;color:#c9d6e8!important}.filters button.active{background:linear-gradient(135deg,#7d4ae1,#326dde)!important;border-color:transparent!important;color:#fff!important}.threads{padding:6px 8px!important}.thread{padding:11px 9px!important;border:1px solid transparent!important;border-radius:11px!important;background:transparent!important;color:var(--dtext)!important}.thread:hover,.thread.active{background:#ffffff0a!important;border-color:#ffffff0d!important}.thread.active{border-left:3px solid #43df7b!important}.thread-time,.preview,.empty{color:var(--dmuted)!important}.avatar{background:#244d3b!important;color:#a7f6bf!important}.badge{font-size:9px!important}.line{background:#063d22!important;color:#68ef98!important}.facebook{background:#0b315f!important;color:#a2caff!important}.waiting{background:#513b17!important;color:#ffd584!important}.progress{background:#17375f!important;color:#a7ccff!important}.closed{background:#124630!important;color:#93edb2!important}
.chat{height:100%!important;background:#09172b!important}.chat-head{padding:13px 20px!important;background:#0c1b31!important;border-color:var(--dborder)!important;color:var(--dtext)!important}.status{background:#ffffff09!important;border-color:var(--dborder)!important;color:var(--dtext)!important}.messages{background:radial-gradient(circle at 80% 5%,#1b3a6355,transparent 38%),#09172b!important;padding:21px 24px!important}.msg{background:#ffffff0b!important;border-color:var(--dborder)!important;color:var(--dtext)!important}.msg.out{background:linear-gradient(135deg,#814de6,#3676e2)!important}.compose{background:#0c1b31!important;border-color:var(--dborder)!important}.compose textarea{background:#ffffff09!important;border-color:var(--dborder)!important;color:var(--dtext)!important}.send{background:linear-gradient(135deg,#8757ec,#3479e7)!important}.attach-btn,.emoji-btn{background:#ffffff09!important;border-color:var(--dborder)!important;color:#d8e4f7!important}.attachment-item{background:#ffffff0d!important;color:#dce8f8!important}
.profile{background:#0c1b31!important;color:var(--dtext)!important}.profile-top,.section{border-color:var(--dborder)!important}.profile h2,.section h3{color:var(--dtext)!important}.section h3{color:#a2b4cd!important}.section p,.muted-text{color:#c4d0df!important}.profile-action{background:#ffffff0b!important;border-color:var(--dborder)!important;color:#dce9f8!important}.contact-tag{background:#163e2a!important;color:#91f0b0!important}.order-row{border-color:var(--dborder)!important}.order-row small,.order-row span{color:#a9bad0!important}
.extraPage{left:190px!important;top:60px!important;background:radial-gradient(circle at 70% 0,#17345c,#0a172a 58%)!important;color:var(--dtext)!important;padding:38px 46px!important}.pageTop div div{color:var(--dmuted)!important}.metric,.chartCard,.channelCard,.teamList{background:#10213bd9!important;border-color:var(--dborder)!important;color:var(--dtext)!important;box-shadow:0 15px 35px #0003!important}.metric{border-top-color:#8655ec!important}.metric:first-child{border-top-color:#43d879!important}.teamRow{border-color:var(--dborder)!important}.teamAvatar{background:#ffffff14!important;color:#dce7f8!important}.back{background:#ffffff08!important;border-color:var(--dborder)!important;color:var(--dtext)!important}.channelIcon.line{background:#073e22!important;color:#65ed96!important}.channelIcon.facebook{background:#0b315e!important;color:#9dcbff!important}
#darkMobileNav{display:none}.dark-user-menu{position:absolute;right:20px;top:54px;width:190px;display:none;padding:8px;background:#10213b;border:1px solid var(--dborder);border-radius:11px;box-shadow:0 16px 40px #0008}.dark-user-menu.show{display:block}.dark-user-menu button{width:100%;border:0;border-radius:7px;padding:9px;text-align:left;background:transparent;color:#ffd1d4;font:600 12px inherit}
@media(max-width:1050px){.app{grid-template-columns:175px 290px 1fr!important}.profile{display:none!important}.extraPage{left:175px!important}}
@media(max-width:700px){#darkTopbar{height:56px;padding:0 12px;gap:9px}#darkTopbar .dark-brand span,#darkTopbar .dark-divider,#darkTopbar .dark-search,#darkTopbar .dark-date,#darkTopbar .dark-user div{display:none}.dark-user{margin-left:auto;padding:3px}.dark-user i{width:30px;height:30px}.app{height:calc(var(--mobile-app-height,100dvh) - 56px)!important;min-height:calc(var(--mobile-app-height,100dvh) - 56px)!important;background:#09172b!important}.list{padding-bottom:61px!important;background:#0a192e!important}.list-head{padding:14px 14px 9px!important}.filters{padding:8px 14px 0!important;flex-wrap:nowrap!important;overflow:auto!important}.filters:last-of-type{padding-bottom:9px!important}.filters button{white-space:nowrap!important}.chat{height:calc(100% - 61px)!important;background:#09172b!important}.chat-head{padding:10px 12px!important}.messages{padding:14px!important}.compose{padding:9px 10px calc(9px + env(safe-area-inset-bottom))!important}.extraPage{left:0!important;top:56px!important;bottom:61px!important;right:0!important;padding:22px 14px!important}.gridCards{grid-template-columns:1fr 1fr!important;gap:12px!important}.metric{padding:15px!important}.metric b{font-size:25px!important}.chartCard{margin-top:16px!important;padding:17px!important}.bars{gap:24px!important}.channelCard{padding:14px!important;align-items:flex-start!important;gap:12px!important;flex-direction:column}.teamRow{padding:14px!important}#darkMobileNav{position:absolute;display:flex;z-index:80;bottom:0;left:0;right:0;height:61px;padding:5px 7px max(5px,env(safe-area-inset-bottom));justify-content:space-around;gap:2px;background:#071224f2;border-top:1px solid var(--dborder);backdrop-filter:blur(12px)}#darkMobileNav button{flex:1;border:0;border-radius:9px;background:transparent;color:#9db0c8;font:600 10px Inter,'Noto Sans Thai',sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}#darkMobileNav b{font-size:16px;line-height:16px}#darkMobileNav button.active{color:#fff;background:linear-gradient(135deg,#5d3ab2,#2359af)}}