:root{--navy:#26415b;--steel:#679dba;--sky:#b6e6f3;--sky-soft:#eef9fc;--gold:#e3aa31;--orange:#d87e23;--bg:#eef6f9;--bg-elevated:#fff;--bg-muted:#e3f1f6;--border:#26415b1a;--border-strong:#26415b2e;--text:#26415b;--text-muted:#4a6b82;--text-faint:#7a96a8;--forest:var(--navy);--forest-soft:#3a5f7a;--teal:var(--steel);--teal-soft:var(--sky);--accent:var(--gold);--accent-hover:var(--orange);--danger:#c0352b;--danger-bg:#fef2f1;--warning:#b54708;--warning-bg:#fff7ed;--success:#0f7a4f;--success-bg:#ecfdf5;--info:#1d6fa5;--info-bg:#eff8ff;--sidebar:var(--navy);--sidebar-text:#eaf4f8;--sidebar-muted:#9eb9c8;--shadow:0 1px 2px #26415b0a, 0 12px 32px #26415b12;--shadow-hover:0 8px 28px #26415b1f;--radius:14px;--radius-sm:10px;--font:"Poppins", -apple-system, BlinkMacSystemFont, sans-serif;--mono:"IBM Plex Mono", ui-monospace, monospace;--ease:cubic-bezier(.22, 1, .36, 1)}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);color:var(--text);background:radial-gradient(1200px 600px at 100% -10%, #b6e6f38c, transparent 55%), radial-gradient(900px 500px at -10% 110%, #e3aa311f, transparent 50%), var(--bg);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.5}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}h1,h2,h3,h4{color:var(--text);letter-spacing:-.03em;margin:0}h1{font-size:1.55rem;font-weight:650}h2{font-size:1.05rem;font-weight:650}p{margin:0}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes spin{to{transform:rotate(360deg)}}.shell{grid-template-columns:248px 1fr;min-height:100%;display:grid}.sidebar{height:100vh;color:var(--sidebar-text);background:linear-gradient(165deg,#679dba2e,#0000 40%),linear-gradient(#26415b 0%,#1a3044 100%);border-right:1px solid #ffffff0f;flex-direction:column;gap:1.4rem;padding:1.15rem .85rem 1rem;display:flex;position:sticky;top:0}.brand-logo{object-fit:contain;filter:drop-shadow(0 2px 8px #00000026);width:auto;max-width:132px;height:38px;display:block}.brand{flex-direction:column;align-items:flex-start;gap:.55rem;padding:.4rem .55rem .2rem;display:flex}.brand>div{padding-left:.1rem}.brand-mark{background:linear-gradient(135deg, var(--steel), var(--navy));color:#fff;border-radius:11px;place-items:center;width:36px;height:36px;font-size:.8rem;font-weight:700;display:grid}.brand strong{color:#fff;letter-spacing:-.02em;font-size:1rem;font-weight:650;display:block}.brand small{color:var(--sidebar-muted);font-size:.72rem;font-weight:500}.side-nav{flex-direction:column;flex:1;gap:.28rem;display:flex}.nav-item{color:var(--sidebar-text);opacity:.82;transition:background .2s var(--ease), opacity .2s var(--ease), transform .2s var(--ease);border-radius:11px;align-items:center;gap:.7rem;padding:.62rem .8rem;display:flex;position:relative}.nav-item:hover{opacity:1;background:#ffffff12}.nav-item.active{color:#fff8ea;opacity:1;box-shadow:inset 3px 0 0 var(--gold);background:#e3aa312e}.sidebar-foot{color:var(--sidebar-muted);border-top:1px solid #ffffff14;margin-top:auto;padding:.75rem .55rem .25rem;font-size:.68rem;line-height:1.35}.main-col{flex-direction:column;min-width:0;min-height:100vh;display:flex}.topbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);z-index:20;background:#ffffffb8;justify-content:flex-end;align-items:center;gap:1rem;height:60px;padding:0 1.4rem;display:flex;position:sticky;top:0}.topbar-user{border:1px solid var(--border);background:#ffffffb3;border-radius:999px;align-items:center;gap:.75rem;padding:.3rem .35rem .3rem .3rem;display:flex}.topbar-meta{flex-direction:column;padding-right:.25rem;line-height:1.2;display:flex}.topbar-meta strong{font-size:.84rem}.topbar-meta small{color:var(--text-muted);font-size:.72rem}.avatar{background:linear-gradient(135deg, var(--steel), var(--navy));color:#fff;border-radius:50%;place-items:center;width:34px;height:34px;font-size:.85rem;font-weight:600;display:grid}.page{min-height:0;animation:rise .35s var(--ease) both;flex:1;padding:1.35rem 1.5rem 2.25rem}.page-header{justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.25rem;display:flex}.page-header p{color:var(--text-muted);margin-top:.25rem;font-size:.88rem}.card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);transition:transform .25s var(--ease), box-shadow .25s var(--ease)}.card-pad{padding:1.1rem 1.15rem}.stat-card:hover,.panel-grid>.card:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.95rem;margin-bottom:1.1rem;display:grid}.stat-card{flex-direction:column;gap:.65rem;padding:1.1rem 1.15rem;display:flex}.stat-card .stat-top{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.stat-icon{background:var(--bg-muted);width:36px;height:36px;color:var(--navy);border-radius:11px;place-items:center;display:grid}.stat-card.teal .stat-icon{color:#3d7a98;background:#679dba33}.stat-card.danger .stat-icon{background:var(--danger-bg);color:var(--danger)}.stat-card.gold .stat-icon{color:#b88412;background:#e3aa3133}.stat-card .label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.74rem;font-weight:600}.stat-card .value{letter-spacing:-.04em;color:var(--navy);font-size:1.85rem;font-weight:700;line-height:1}.stat-card.danger .value{color:var(--danger)}.stat-card.teal .value{color:#3d7a98}.panel-grid{grid-template-columns:1.2fr 1fr 1fr;gap:.95rem;display:grid}.panel-title{letter-spacing:-.02em;margin-bottom:.9rem;font-size:.9rem;font-weight:650}.bar-list{flex-direction:column;gap:.7rem;display:flex}.bar-row{grid-template-columns:92px 1fr 36px;align-items:center;gap:.55rem;font-size:.82rem;display:grid}.bar-track{background:var(--bg-muted);border-radius:99px;height:9px;overflow:hidden}.bar-fill{background:linear-gradient(90deg, var(--steel), var(--gold));height:100%;transition:width .45s var(--ease);border-radius:99px}.btn{background:linear-gradient(135deg, var(--gold), var(--orange));color:#1c3144;cursor:pointer;white-space:nowrap;transition:transform .2s var(--ease), filter .2s var(--ease), box-shadow .2s var(--ease);border:1px solid #0000;border-radius:11px;justify-content:center;align-items:center;gap:.4rem;padding:.5rem .9rem;font-size:.84rem;font-weight:600;display:inline-flex}.btn:hover{background:linear-gradient(135deg, #ebba45, var(--orange));filter:brightness(1.03);transform:translateY(-1px);box-shadow:0 6px 16px #d87e2340}.btn:disabled{opacity:.55;cursor:not-allowed;box-shadow:none;transform:none}.btn.secondary{color:var(--text);border-color:var(--border-strong);box-shadow:none;background:#fff}.btn.secondary:hover{background:var(--sky-soft);filter:none;box-shadow:none}.btn.ghost{color:var(--text-muted);box-shadow:none;background:0 0;border-color:#0000}.btn.ghost:hover{background:var(--bg-muted);color:var(--text);filter:none;box-shadow:none;transform:none}.btn.danger{background:var(--danger);color:#fff}.btn.teal{background:var(--steel);color:#fff}.btn.teal:hover{filter:none;background:#5a8eaa}.btn.icon{min-width:34px;padding:.4rem .55rem}.btn.sm{border-radius:9px;padding:.35rem .6rem;font-size:.78rem}.field{flex-direction:column;gap:.35rem;display:flex}.field label{color:var(--text-muted);letter-spacing:.02em;font-size:.76rem;font-weight:600}.field input,.field select,.field textarea,.input,.select,.textarea{border:1px solid var(--border-strong);transition:border-color .2s var(--ease), box-shadow .2s var(--ease);background:#fff;border-radius:11px;outline:none;padding:.55rem .75rem}.field input:focus,.field select:focus,.field textarea:focus,.input:focus,.select:focus,.textarea:focus{border-color:var(--steel);box-shadow:0 0 0 4px #679dba33}.textarea,.field textarea{resize:vertical;min-height:110px}.form-grid{gap:.8rem;display:grid}.form-grid.two{grid-template-columns:1fr 1fr}.form-actions{justify-content:flex-end;gap:.5rem;margin-top:.5rem;display:flex}.filters{flex-wrap:wrap;align-items:center;gap:.55rem;margin-bottom:.95rem;display:flex}.filters .input,.filters .select{min-width:140px}.filters .search{flex:1;min-width:220px}.tabs{border:1px solid var(--border);background:#ffffff8c;border-radius:13px;flex-wrap:wrap;gap:.3rem;width:fit-content;max-width:100%;margin-bottom:1rem;padding:.3rem;display:flex}.tab{color:var(--text-muted);cursor:pointer;transition:background .2s var(--ease), color .2s var(--ease);background:0 0;border:none;border-radius:10px;padding:.48rem .8rem;font-size:.84rem;font-weight:560}.tab:hover{color:var(--text);background:#679dba1f}.tab.active{background:var(--navy);color:#fff}.table-wrap{border-radius:var(--radius);overflow:auto}table.data{border-collapse:collapse;width:100%;font-size:.84rem}table.data th,table.data td{text-align:left;border-bottom:1px solid var(--border);vertical-align:middle;padding:.8rem .9rem}table.data th{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;background:#f7fbfd;font-size:.72rem;font-weight:650;position:sticky;top:0}table.data tbody tr{cursor:pointer;transition:background .15s var(--ease)}table.data tbody tr:hover{background:#b6e6f347}.badge{white-space:nowrap;border:1px solid #0000;border-radius:999px;align-items:center;gap:.25rem;padding:.18rem .5rem;font-size:.72rem;font-weight:650;display:inline-flex}.product-badge{border-radius:7px}.status-new{color:#175cd3;background:#eff8ff;border-color:#b2ddff}.status-open{background:var(--success-bg);color:var(--success);border-color:#abefc6}.status-pending{background:var(--warning-bg);color:var(--warning);border-color:#fedf89}.status-on_hold{color:#5925dc;background:#f4f3ff;border-color:#d9d6fe}.status-resolved{color:#0f766e;background:#f0fdf9;border-color:#99f6e4}.status-closed{background:var(--bg-muted);color:var(--text-muted);border-color:var(--border)}.priority-low{color:#475569;background:#f8fafc}.priority-normal{color:#175cd3;background:#eff8ff}.priority-high{background:var(--warning-bg);color:var(--warning)}.priority-urgent{background:var(--danger-bg);color:var(--danger)}.chip{background:var(--bg-muted);color:var(--text);border-radius:999px;align-items:center;padding:.12rem .45rem;font-size:.72rem;font-weight:600;display:inline-flex}.chip-row{flex-wrap:wrap;gap:.35rem;display:flex}.login-page{background:radial-gradient(80% 50% at 10% 0,#679dba73,#0000 55%),radial-gradient(70% 50% at 100% 100%,#e3aa3147,#0000 50%),linear-gradient(155deg,#26415b 0%,#1c3144 42%,#d9f7fb 42.1%,#eef9fc 100%);place-items:center;min-height:100%;padding:1.5rem;display:grid}.login-card{width:min(420px,100%);animation:rise .4s var(--ease) both;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff0;border:1px solid #ffffffb3;border-radius:20px;padding:1.85rem 1.7rem;box-shadow:0 24px 60px #1a304438}.login-card .brand{flex-direction:row;align-items:center;gap:.85rem;margin-bottom:1.35rem;padding:0}.login-card .brand-logo{max-width:150px;height:46px}.login-brand strong{color:var(--navy)}.login-brand small{color:var(--text-muted)}.login-card h1{margin-bottom:.3rem;font-size:1.65rem}.login-card .sub{color:var(--text-muted);margin-bottom:1.35rem}.error-box{background:var(--danger-bg);color:var(--danger);border:1px solid #fecdca;border-radius:11px;margin-bottom:.75rem;padding:.6rem .75rem;font-size:.84rem}.muted{color:var(--text-muted)}.faint{color:var(--text-faint)}.full-center{min-height:100%;color:var(--text-muted);place-items:center;gap:.75rem;display:grid}.spinner{border:3px solid var(--border);border-top-color:var(--steel);border-radius:50%;width:28px;height:28px;animation:.7s linear infinite spin}.empty{text-align:center;color:var(--text-muted);padding:2.5rem 1rem}.ticket-layout{grid-template-columns:minmax(0,1fr) 300px;align-items:start;gap:1rem;display:grid}.ticket-main,.ticket-side{flex-direction:column;gap:.9rem;display:flex}.ticket-header{flex-direction:column;gap:.75rem;display:flex}.ticket-title-row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.ticket-title-row h1{font-size:1.25rem}.meta-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem 1rem;font-size:.84rem;display:grid}.meta-grid dt{color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em;font-size:.72rem;font-weight:650}.meta-grid dd{margin:.1rem 0 0}.actions-row{flex-wrap:wrap;align-items:center;gap:.45rem;display:flex}.timeline{flex-direction:column;gap:.75rem;display:flex}.message{border:1px solid var(--border);background:#fff;border-radius:12px;padding:.85rem .95rem}.message.internal{background:#fffbeb;border-color:#f6d98a}.message.system{background:var(--bg-muted);border-style:dashed}.message-head{justify-content:space-between;gap:.5rem;margin-bottom:.4rem;font-size:.78rem;display:flex}.message-body{white-space:pre-wrap;word-break:break-word;font-size:.9rem}.reply-box{flex-direction:column;gap:.65rem;display:flex}.reply-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.toggle{color:var(--text-muted);align-items:center;gap:.4rem;font-size:.84rem;display:inline-flex}.sla-box{flex-direction:column;gap:.45rem;font-size:.84rem;display:flex}.sla-item{justify-content:space-between;gap:.5rem;display:flex}.sla-item.breached{color:var(--danger);font-weight:650}.events{flex-direction:column;gap:.55rem;max-height:420px;display:flex;overflow:auto}.event{border-bottom:1px dashed var(--border);padding-bottom:.45rem;font-size:.78rem}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:50;animation:rise .2s var(--ease) both;background:#1a30447a;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.modal{border:1px solid var(--border);width:min(460px,100%);box-shadow:var(--shadow-hover);background:#fff;border-radius:16px}.modal.wide{width:min(640px,100%)}.modal-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.95rem 1.1rem;display:flex}.modal-body{padding:1.1rem}.key-reveal{background:var(--navy);color:#e8f4f8;font-family:var(--mono);word-break:break-all;border-radius:11px;margin:.75rem 0;padding:.8rem;font-size:.82rem}.pagination{border-top:1px solid var(--border);color:var(--text-muted);justify-content:space-between;align-items:center;padding:.85rem 1rem;font-size:.82rem;display:flex}.settings-layout{grid-template-columns:190px 1fr;align-items:start;gap:.95rem;display:grid}.settings-nav{border:1px solid var(--border);background:#ffffffb3;border-radius:14px;flex-direction:column;gap:.25rem;padding:.4rem;display:flex}.settings-nav a,.settings-nav button{text-align:left;cursor:pointer;color:var(--text-muted);background:0 0;border:none;border-radius:10px;padding:.55rem .75rem;font-weight:560}.settings-nav a.active,.settings-nav button.active{color:var(--navy);background:#679dba29}.stack{flex-direction:column;gap:.75rem;display:flex}.row-between{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.inline-form{grid-template-columns:1fr 120px auto;align-items:end;gap:.5rem;display:grid}.list-item{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:.75rem;padding:.8rem 0;display:flex}.list-item:last-child{border-bottom:none}@media (width<=1100px){.stats-grid,.panel-grid{grid-template-columns:1fr 1fr}.ticket-layout,.settings-layout{grid-template-columns:1fr}}@media (width<=820px){.shell{grid-template-columns:1fr}.sidebar{flex-flow:wrap;align-items:center;gap:.5rem;height:auto;position:relative}.side-nav{flex-flow:wrap;width:100%}.sidebar-foot{display:none}.stats-grid,.panel-grid,.form-grid.two,.meta-grid,.inline-form{grid-template-columns:1fr}.login-page{background:linear-gradient(160deg,#26415b,#1c3144 35%,#eef9fc 35%)}}