*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:#050912;color:#f8fbff}a{color:inherit;text-decoration:none}.support-app{min-height:100vh;background:radial-gradient(circle at 20% 0,rgba(0,216,255,.12),transparent 34%),linear-gradient(180deg,#060b15 0%,#02050b 100%)}.support-main{width:min(1780px,100%);margin:0 auto;padding:22px 24px 34px;display:grid;grid-template-columns:320px minmax(0,1fr);gap:16px}.panel{background:linear-gradient(180deg,rgba(12,17,29,.96),rgba(7,11,19,.98));border:1px solid rgba(255,255,255,.08);border-radius:26px;box-shadow:0 22px 60px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.04)}.support-sidebar{padding:26px 24px;height:calc(100vh - 132px);min-height:620px}.support-badge{display:inline-flex;align-items:center;height:30px;padding:0 14px;border-radius:999px;background:rgba(0,216,255,.15);color:#6aefff;font-size:13px;font-weight:800;letter-spacing:.03em}.support-head h1{margin:18px 0 8px;font-size:28px;line-height:1.08;font-weight:900;letter-spacing:-.04em}.support-head p{margin:0;color:#9fb2d7;font-size: 17px;line-height:1.55}.support-form{margin-top:24px;display:grid;gap:18px}.support-form label{display:grid;gap:9px;color:#fff;font-size:15px;font-weight:800}.support-form input,.support-form textarea,.reply-form textarea{width:100%;border:1px solid rgba(65,116,187,.38);border-radius:17px;background:#081428;color:#f8fbff;outline:none;font:500 16px/1.4 Inter,sans-serif;transition:border-color .18s,box-shadow .18s,background .18s}.support-form input{height:52px;padding:0 16px}.support-form textarea{min-height:178px;padding:16px;resize:vertical}.support-form input:focus,.support-form textarea:focus,.reply-form textarea:focus{border-color:#00d8ff;box-shadow:0 0 0 4px rgba(0,216,255,.12);background:#0a172d}.primary-button{border:0;border-radius:18px;background:linear-gradient(135deg,#18e58b,#14d6a0);color:#00140c;font-weight:900;letter-spacing:.01em;cursor:pointer;box-shadow:0 14px 30px rgba(20,214,160,.2);transition:transform .15s,filter .15s}.primary-button:hover{transform:translateY(-1px);filter:saturate(1.12)}.support-form .primary-button{height:56px;font-size:15px}.support-chat{padding:22px;height:calc(100vh - 132px);min-height:620px;display:flex;flex-direction:column}.support-chat-head{height:76px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 2px 18px}.support-chat-head h2{margin:10px 0 0;font-size:27px;line-height:1.1;font-weight:900;letter-spacing:-.035em}.ticket-status{min-width:72px;height:40px;padding:0 14px;border-radius:999px;display:grid;place-items:center;background:#171d30;color:#dce8ff;font-size: 15px;font-weight:900;text-transform:uppercase}.support-layout{min-height:0;flex:1;display:grid;grid-template-columns:250px minmax(0,1fr);gap:16px}.ticket-list{min-height:0;overflow:auto;padding:12px;background:#061225;border:1px solid rgba(33,83,148,.45);border-radius:22px}.ticket-list::-webkit-scrollbar,.ticket-thread::-webkit-scrollbar{width:7px}.ticket-list::-webkit-scrollbar-thumb,.ticket-thread::-webkit-scrollbar-thumb{background:#1d3458;border-radius:999px}.ticket-item{width:100%;border:0;text-align:left;cursor:pointer;margin:0 0 10px;padding:16px 15px;border-radius:16px;background:#101a2d;color:#eaf2ff;transition:background .15s,transform .15s,box-shadow .15s}.ticket-item:hover{transform:translateY(-1px);background:#14223a}.ticket-item.active{background:linear-gradient(180deg,#15243b,#0d1a2e);box-shadow:inset 0 0 0 1px rgba(0,216,255,.28),0 12px 26px rgba(0,0,0,.24)}.ticket-item h3{margin:0 0 9px;font-size: 17px;line-height:1.08;font-weight:900;color:#fff}.ticket-item p{margin:0;color:#b6c8ef;font-size:13px;line-height:1.25}.ticket-meta{margin-top:6px;color:#8cb6ff;font-size:12px;font-weight:700}.ticket-thread-wrap{min-width:0;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:14px}.ticket-thread{position:relative;overflow:auto;padding:18px 20px;background:#061225;border:1px solid rgba(33,83,148,.45);border-radius:22px;min-height:0}.ticket-thread:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 15%,rgba(24,229,139,.06),transparent 30%);pointer-events:none}.message{position:relative;max-width:min(560px,76%);margin:0 0 16px;padding:16px 17px;border-radius:18px;color:#f8fbff;font-size:15px;font-weight:700;line-height:1.4;box-shadow:0 12px 30px rgba(0,0,0,.18)}.message.user{margin-left:auto;background:#053c36;border:1px solid rgba(24,229,139,.44);border-top-right-radius:6px}.message.admin{margin-right:auto;background:#111b2d;border:1px solid rgba(255,255,255,.08);border-top-left-radius:6px}.message-meta{margin-top:9px;color:#8fb5e9;font-size:12px;font-weight:800}.reply-form{padding:14px;background:#061225;border:1px solid rgba(33,83,148,.45);border-radius:22px;display:grid;grid-template-columns:minmax(0,1fr) 86px;gap:12px;align-items:end}.reply-form textarea{min-height:84px;padding:16px;resize:vertical}.reply-form .primary-button{height:52px;font-size: 15px}.empty-state{height:100%;min-height:180px;display:grid;place-items:center;text-align:center;color:#9fb2d7;font-size: 17px;font-weight:700}.modal-backdrop.hidden,.hidden{display:none!important}@media(max-width:1050px){.support-main{grid-template-columns:1fr}.support-sidebar,.support-chat{height:auto;min-height:0}.support-layout{grid-template-columns:1fr}.ticket-list{max-height:260px}.reply-form{grid-template-columns:1fr}.reply-form .primary-button{width:100%}}@media(max-width:640px){.support-main{padding:14px}.panel{border-radius:20px}.support-sidebar,.support-chat{padding:18px}.support-head h1,.support-chat-head h2{font-size:23px}.message{max-width:92%}}


/* support cleanup v2 */
.support-main{grid-template-columns:320px minmax(0,1fr);gap:16px}.panel{border:0!important;background:rgba(7,10,18,.72)!important;box-shadow:0 18px 48px rgba(0,0,0,.32)!important}.support-chat{padding:22px 24px}.support-chat-head{height:auto;padding:0 0 16px}.support-chat-head h2{font-size:28px}.ticket-status{display:none!important}.support-layout{grid-template-columns:260px minmax(0,1fr);gap:16px}.ticket-list,.ticket-thread,.reply-form{border:0!important;background:rgba(3,12,25,.32)!important;box-shadow:none!important}.ticket-list{padding:12px;border-radius:22px}.ticket-item{background:rgba(18,29,49,.62)!important;border:0!important;box-shadow:none!important}.ticket-item.active{background:rgba(20,36,62,.76)!important;box-shadow:none!important}.ticket-item h3{font-size:15px;line-height:1.15}.ticket-item p{font-size:12px}.ticket-meta{font-size:0!important}.ticket-meta::before{content:''!important}.ticket-thread{padding:18px 20px}.message{font-size:15px;padding:16px 18px;box-shadow:none!important}.message.admin{border:0!important;background:rgba(18,27,45,.86)!important}.message.user{border:1px solid rgba(20,214,160,.45)!important;background:rgba(3,76,62,.9)!important}.reply-form{grid-template-columns:minmax(0,1fr) 140px;align-items:stretch;padding:16px}.reply-form textarea{min-height:96px}.reply-form .primary-button{height:64px;min-width:132px;font-size:15px;border-radius:18px;align-self:end}.support-form input,.support-form textarea,.reply-form textarea{border:1px solid rgba(55,94,145,.22)!important;background:rgba(6,17,34,.58)!important}.support-form input:focus,.support-form textarea:focus,.reply-form textarea:focus{border-color:rgba(0,216,255,.55)!important}.support-form .primary-button{height:58px}.support-badge{background:rgba(0,216,255,.18)}@media(max-width:1050px){.reply-form{grid-template-columns:1fr}.reply-form .primary-button{width:100%;min-width:0}}


/* final support cleanup: remove remaining boxes/borders */
.support-sidebar,.support-chat{background:rgba(4,7,13,.55)!important;border:0!important;box-shadow:none!important;}
.support-form input,.support-form textarea,.reply-form textarea{background:transparent!important;border:0!important;box-shadow:none!important;outline:0!important;}
.support-form input:focus,.support-form textarea:focus,.reply-form textarea:focus{background:transparent!important;border:0!important;box-shadow:none!important;}
.ticket-list,.ticket-thread,.reply-form{background:rgba(2,7,15,.10)!important;border:0!important;box-shadow:none!important;}
.ticket-thread:before{display:none!important;}
.ticket-thread-wrap{background:transparent!important;border:0!important;box-shadow:none!important;}
.message{box-shadow:none!important;border:0!important;}
.message.user{background:rgba(3,76,62,.92)!important;border:1px solid rgba(20,214,160,.42)!important;}
.message.admin{background:rgba(13,18,30,.72)!important;border:0!important;}
.reply-form{padding:10px 0 0!important;grid-template-columns:minmax(0,1fr) 150px!important;}
.reply-form .primary-button{height:68px!important;min-width:142px!important;font-size: 17px!important;}
.ticket-item{border:0!important;box-shadow:none!important;}
@media(max-width:1050px){.reply-form{grid-template-columns:1fr!important}.reply-form .primary-button{width:100%!important}}


/* user requested support final: flatter mobile chat */
.support-form input,.support-form textarea,.reply-form textarea{background:transparent!important;border:0!important;box-shadow:none!important;outline:0!important;}
.support-form input::placeholder,.support-form textarea::placeholder,.reply-form textarea::placeholder{color:rgba(160,177,209,.62)!important;}
.ticket-list,.ticket-thread,.reply-form{background:rgba(0,0,0,.04)!important;border:0!important;box-shadow:none!important;}
.message.admin{background:rgba(11,17,29,.55)!important;border:0!important;}
.message.user{background:rgba(4,88,70,.82)!important;border:0!important;}
@media(max-width:760px){
  .support-main{display:block!important;padding:10px!important;width:100%!important;}
  .support-sidebar{height:auto!important;min-height:0!important;padding:18px 16px!important;margin-bottom:12px!important;}
  .support-chat{height:auto!important;min-height:calc(100vh - 80px)!important;padding:18px 16px!important;}
  .support-layout{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;}
  .ticket-list{max-height:178px!important;display:flex!important;gap:10px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:6px 0!important;}
  .ticket-item{min-width:230px!important;margin:0!important;padding:14px!important;border-radius:16px!important;}
  .ticket-thread-wrap{min-height:420px!important;}
  .ticket-thread{min-height:330px!important;padding:12px!important;}
  .support-chat-head{display:block!important;padding-bottom:10px!important;}
  .support-chat-head h2{font-size:22px!important;line-height:1.18!important;word-break:break-word!important;}
  .support-head h1{font-size:24px!important;}
  .support-head p{font-size: 15px!important;}
  .support-form{gap:12px!important;margin-top:16px!important;}
  .support-form textarea{min-height:120px!important;}
  .reply-form{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;padding:8px 0 0!important;}
  .reply-form textarea{min-height:92px!important;}
  .reply-form .primary-button{width:100%!important;height:56px!important;min-width:0!important;}
  .message{max-width:94%!important;font-size: 15px!important;padding:13px 14px!important;margin-bottom:12px!important;}
}


/* mobile support hard fix */
html,body{max-width:100%;overflow-x:hidden!important;}
.support-app{overflow-x:hidden!important;}
.support-main,.support-sidebar,.support-chat,.support-layout,.ticket-thread-wrap,.ticket-thread,.reply-form{max-width:100%!important;min-width:0!important;}
.support-form input,.support-form textarea,.reply-form textarea{background:transparent!important;border:0!important;box-shadow:none!important;}
.ticket-list,.ticket-thread,.reply-form{background:transparent!important;border:0!important;box-shadow:none!important;}
@media(max-width:760px){
  body{width:100%!important;}
  .support-main{display:flex!important;flex-direction:column!important;width:100%!important;max-width:100%!important;margin:0!important;padding:12px!important;gap:12px!important;overflow:hidden!important;}
  .support-sidebar,.support-chat{width:100%!important;margin:0!important;padding:16px!important;border-radius:22px!important;height:auto!important;min-height:0!important;}
  .support-head h1{font-size:25px!important;line-height:1.08!important;}
  .support-chat-head h2{font-size:24px!important;line-height:1.12!important;word-break:normal!important;overflow-wrap:anywhere!important;}
  .support-layout{display:flex!important;flex-direction:column!important;width:100%!important;gap:12px!important;}
  .ticket-list{width:100%!important;max-width:100%!important;max-height:none!important;display:flex!important;gap:10px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:4px 0 8px!important;scroll-snap-type:x proximity!important;}
  .ticket-item{flex:0 0 220px!important;min-width:220px!important;max-width:220px!important;margin:0!important;scroll-snap-align:start!important;}
  .ticket-thread-wrap{width:100%!important;min-height:360px!important;}
  .ticket-thread{width:100%!important;min-height:270px!important;padding:8px 0!important;overflow-y:auto!important;}
  .message{max-width:88%!important;font-size: 15px!important;line-height:1.35!important;}
  .reply-form{width:100%!important;display:flex!important;flex-direction:column!important;gap:10px!important;padding:0!important;}
  .reply-form textarea{width:100%!important;min-height:92px!important;padding:12px 0!important;}
  .reply-form .primary-button{width:100%!important;height:56px!important;min-width:0!important;}
}
@media(max-width:420px){
  .support-main{padding:10px!important;}
  .support-sidebar,.support-chat{padding:14px!important;}
  .support-badge{font-size:12px!important;max-width:100%;}
  .support-form input{height:46px!important;padding:0!important;}
  .support-form textarea{min-height:150px!important;padding:0!important;}
  .ticket-item{flex-basis:205px!important;min-width:205px!important;max-width:205px!important;}
}


/* FINAL mobile support adaptive */
html,body{max-width:100%;overflow-x:hidden;}
.support-shell,.support-layout,.support-main,.support-chat,.thread-panel,.ticket-sidebar{box-sizing:border-box;max-width:100%;}
@media(max-width:760px){
  .support-shell{padding:18px 12px 34px!important;overflow-x:hidden!important;}
  .support-layout{display:flex!important;flex-direction:column!important;gap:16px!important;width:100%!important;max-width:100%!important;overflow:visible!important;}
  .support-create,.support-main{width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;}
  .support-main{padding:18px 16px!important;}
  .chat-grid{display:flex!important;flex-direction:column!important;gap:14px!important;width:100%!important;max-width:100%!important;overflow:visible!important;}
  .ticket-sidebar{display:flex!important;flex-direction:row!important;gap:10px!important;overflow-x:auto!important;width:100%!important;min-height:auto!important;padding:0!important;background:transparent!important;border:0!important;}
  .ticket-item{min-width:210px!important;max-width:250px!important;flex:0 0 210px!important;}
  .thread-panel,.reply-panel{width:100%!important;max-width:100%!important;min-width:0!important;background:transparent!important;border:0!important;padding:0!important;}
  #ticketThread{min-height:260px!important;max-height:none!important;width:100%!important;}
  #replyMessage{width:100%!important;min-height:90px!important;}
  .send-button,.reply-submit{width:100%!important;min-height:54px!important;}
}


/* === final notification indicator: separate glowing circle, always visible === */
.profile-wrapper{position:relative!important;display:inline-flex!important;align-items:center!important;gap:10px!important;}
.profile-trigger{position:relative!important;}
.notification-counter.notification-pulse{
  position:absolute!important;
  right:44px!important;
  top:8px!important;
  z-index:12!important;
  width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important;
  padding:0!important;border:0!important;border-radius:999px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  font:900 10px/1 Inter,Arial,sans-serif!important;
  color:#171100!important;background:#f7d318!important;
  box-shadow:0 0 0 2px rgba(20,14,0,.78),0 0 12px rgba(255,214,0,.95),0 0 24px rgba(255,214,0,.55)!important;
  cursor:pointer!important;
  animation:notificationPulse 1.25s ease-in-out infinite!important;
}
.notification-counter.notification-pulse.is-empty{color:transparent!important;background:#5d6674!important;box-shadow:0 0 0 2px rgba(5,8,16,.85),0 0 7px rgba(140,150,165,.45)!important;animation:none!important;}
.notification-counter.notification-pulse.has-unread{background:#f7d318!important;color:#171100!important;}
@keyframes notificationPulse{0%,100%{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.18);filter:brightness(1.25)}}
/* Thread switch animations */
@keyframes threadFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes threadFadeOut{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-6px)}}
.ticket-thread{transition:opacity .18s ease;}
.ticket-thread.thread-switching{opacity:0;transform:translateY(-4px);transition:opacity .12s ease,transform .12s ease;}
.ticket-thread.thread-entered{animation:threadFadeIn .24s cubic-bezier(.22,.61,.36,1) forwards;}
.ticket-item{transition:background .18s,transform .18s,box-shadow .18s,opacity .15s;}
.message{animation:threadFadeIn .22s cubic-bezier(.22,.61,.36,1) both;}
@media(max-width:760px){.notification-counter.notification-pulse{right:38px!important;top:6px!important;width:17px!important;height:17px!important;min-width:17px!important;font-size:9px!important;}}
