*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,sans-serif;background:#f4f6fb;color:#0f172a}
.hidden{display:none!important}.muted{color:#64748b;font-size:13px}.err{color:#dc2626;min-height:18px;font-size:13px}
.mailbar{background:#fef3c7;border-bottom:1px solid #fcd34d;color:#92400e;padding:8px 16px;font-size:13px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.mailbar.ok{background:#d1fae5;border-color:#6ee7b7;color:#065f46}
.mailbar b{font-weight:700}
.btn{border:1px solid #e2e8f0;background:#fff;border-radius:10px;padding:8px 12px;cursor:pointer;font-weight:600;font-size:13px}
.btn.primary{background:#2563eb;border-color:#2563eb;color:#fff}.btn.primary:hover{background:#1d4ed8}
.btn.ghost:hover{background:#eef2ff}
.btn.danger{color:#dc2626;border-color:#fecaca}
.btn.danger:hover{background:#fef2f2;border-color:#fca5a5}.me{background:#e0e7ff;border-radius:20px;padding:6px 10px;font-size:12px;font-weight:700}
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#dbeafe,#f0fdf4)}
.login-card{background:#fff;border-radius:20px;padding:32px;width:360px;box-shadow:0 20px 60px rgba(37,99,235,.15);display:flex;flex-direction:column;gap:10px}
.logo{font-size:26px;font-weight:800}.logo.small{font-size:18px}
.login-card input{border:1px solid #e2e8f0;border-radius:10px;padding:10px 12px;font-size:14px}
.topbar{display:flex;gap:12px;align-items:center;padding:10px 16px;background:#fff;border-bottom:1px solid #e2e8f0;position:sticky;top:0;z-index:5}
#search{flex:1;max-width:480px;border:1px solid #e2e8f0;border-radius:10px;padding:8px 12px}
.top-actions{margin-left:auto;display:flex;gap:8px;align-items:center}
.stats{display:flex;gap:10px;padding:12px 16px 0;flex-wrap:wrap}
.stat{background:#fff;border:1px solid #e2e8f0;border-radius:14px;padding:10px 14px;min-width:140px}.stat b{font-size:20px;display:block}.stat.over b{color:#dc2626}
.layout{display:grid;grid-template-columns:230px 360px 1fr;gap:12px;padding:12px 16px;height:calc(100vh - 150px)}
.side,.list,.chat{background:#fff;border:1px solid #e2e8f0;border-radius:16px;overflow:hidden}
.side{padding:12px;display:flex;flex-direction:column;gap:12px}
.queues{display:flex;flex-direction:column;gap:6px}
.q{border:1px solid #e2e8f0;border-radius:10px;padding:8px 10px;cursor:pointer;display:flex;justify-content:space-between;font-size:13px;font-weight:600}
.q.active{background:#2563eb;color:#fff;border-color:#2563eb}.q .n{background:rgba(0,0,0,.08);border-radius:12px;padding:0 8px}
.q.archive{border-style:dashed;color:#64748b}
.q.archive.active{background:#475569;border-color:#475569;color:#fff}
.card.arch{opacity:.72}
.badge.archbadge{background:#e2e8f0;color:#475569}
.filters{display:flex;flex-direction:column;gap:8px}.filters label{font-size:12px;display:flex;flex-direction:column;gap:4px}
.filters select{border:1px solid #e2e8f0;border-radius:8px;padding:6px}
.list{overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:8px}
.card{border:1px solid #e2e8f0;border-radius:12px;padding:10px;cursor:pointer;background:#fff}
.card.active{border-color:#2563eb;box-shadow:0 0 0 2px #bfdbfe}
.card .t{font-weight:700;font-size:14px;margin:4px 0}
.card .m{font-size:12px;color:#64748b}
.badge{font-size:11px;font-weight:700;border-radius:20px;padding:2px 8px;display:inline-block}
.pr-critical{background:#fee2e2;color:#b91c1c}.pr-high{background:#ffedd5;color:#c2410c}.pr-medium{background:#fef9c3;color:#a16207}.pr-low{background:#dcfce7;color:#15803d}
.st{background:#eef2ff;color:#3730a3}.overdue{border-color:#fca5a5!important;background:#fff7f7}
.sla{font-size:11px;font-weight:700}.sla.bad{color:#dc2626}.sla.ok{color:#059669}
.chat{display:flex;flex-direction:column}.chat-empty{margin:auto;color:#94a3b8}
#chatBox{display:flex;flex-direction:column;height:100%}
.chat-head{display:flex;justify-content:space-between;gap:10px;padding:12px;border-bottom:1px solid #e2e8f0;flex-wrap:wrap}
.chat-head>div:first-child{min-width:0;flex:1 1 260px}
.c-subject{font-weight:800;font-size:16px;overflow-wrap:anywhere}.c-meta{font-size:12px;color:#64748b;margin-top:4px}
.c-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;flex:0 1 auto}
.tabs{display:flex;gap:6px;padding:8px 12px;border-bottom:1px solid #e2e8f0}
.tab{border:1px solid #e2e8f0;background:#f8fafc;border-radius:8px;padding:6px 10px;cursor:pointer;font-size:13px}.tab.active{background:#0f172a;color:#fff}
.messages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;background:#f8fafc}
.msg{max-width:75%;padding:8px 12px;border-radius:14px;font-size:13px;background:#fff;border:1px solid #e2e8f0}
.msg .who{font-size:11px;color:#64748b;font-weight:700;margin-bottom:4px}
.msg.client{align-self:flex-start;border-top-left-radius:4px}
.msg.tech{align-self:flex-end;background:#2563eb;color:#fff;border-color:#2563eb}.msg.tech .who{color:#bfdbfe}
.msg.internal{align-self:flex-end;background:#fef9c3;border-color:#fde68a}
.msg.system{align-self:center;background:#e2e8f0;font-size:12px}
.msg.auto{align-self:center;background:#ecfdf5;border:1px solid #a7f3d0;font-size:12px;max-width:85%}
.regno{background:#e0e7ff;color:#3730a3;border-radius:5px;padding:1px 6px;font-size:11px}
/* Email keeps its structure, while typography and colours belong to the panel. */
.msg:has(.mail-html){width:min(96%,1100px);max-width:96%}
.mail-html{display:block;max-width:100%;overflow-x:auto;color:inherit;font:inherit;line-height:1.5;overflow-wrap:anywhere}
.mail-html :where(p,div,h1,h2,h3,h4,h5,h6,ul,ol,blockquote,pre,table){max-width:100%}
.mail-html p{margin:.55em 0}.mail-html h1{font-size:1.35em}.mail-html h2{font-size:1.22em}.mail-html h3{font-size:1.12em}
.mail-html h1,.mail-html h2,.mail-html h3,.mail-html h4,.mail-html h5,.mail-html h6{margin:.75em 0 .4em;font-family:inherit;color:inherit}
.mail-html table{width:auto;min-width:min(100%,420px);max-width:100%;border-collapse:collapse;font:inherit}
.mail-html td,.mail-html th{padding:4px 6px;border:0;text-align:left;vertical-align:top}
.mail-html table[border]:not([border="0"]) td,.mail-html table[border]:not([border="0"]) th{border:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.mail-html :empty:not(img,br,hr){display:none!important}
.mail-html blockquote{margin:.7em 0;padding:.55em .8em;border-left:3px solid color-mix(in srgb,currentColor 45%,transparent);background:color-mix(in srgb,currentColor 6%,transparent);border-radius:7px}
.mail-html pre{white-space:pre-wrap;word-break:break-word;font:12px ui-monospace,SFMono-Regular,Consolas,monospace}
.mail-html img{display:block;max-width:100%;height:auto;margin:8px 0;border-radius:8px}
.mail-html a{text-decoration:underline}
.mail-text{white-space:pre-wrap;word-break:break-word}
.msg.tech .mail-text{color:#fff}
.msg.auto .mail-text{color:#065f46}
.msg a{color:inherit}
.reply-preview{display:flex;flex-direction:column;gap:2px;margin:0 0 7px;padding:7px 9px;border-left:3px solid currentColor;border-radius:8px;background:rgba(100,116,139,.11);font-size:11px;line-height:1.35;opacity:.88;overflow:hidden}
.reply-preview b,.reply-preview span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.msg.tech .reply-preview{background:rgba(255,255,255,.16)}
.message-reply{display:block;margin:6px 0 -3px auto;padding:2px 5px;border:0;background:transparent;color:inherit;font:600 10px Inter,system-ui,sans-serif;cursor:pointer;opacity:.6}.message-reply:hover{opacity:1;text-decoration:underline}
.composer{border-top:1px solid #e2e8f0;padding:10px;display:flex;flex-direction:column;gap:8px}
.reply-composer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px;border-left:3px solid var(--accent);border-radius:10px;background:var(--accent-soft);font-size:11px}.reply-composer>div{min-width:0}.reply-composer b,.reply-composer span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reply-composer span{margin-top:2px;color:var(--muted)}.reply-composer button{border:0;background:transparent;color:var(--muted);font-size:20px;line-height:1;cursor:pointer}
.created-badge{background:rgba(100,116,139,.12);color:var(--muted);font-variant-numeric:tabular-nums}
.composer-row{display:flex;gap:8px;align-items:center}
#tplSel{flex:1;border:1px solid #e2e8f0;border-radius:8px;padding:6px}
.internal{font-size:12px;display:flex;gap:4px;align-items:center;background:#fef9c3;border-radius:8px;padding:4px 8px}
.file{cursor:pointer;border:1px solid #e2e8f0;border-radius:8px;padding:4px 8px}
.composer-editor{flex:1;min-height:62px;border:1px solid #e2e8f0;border-radius:10px;padding:8px;font-family:inherit;outline:none;overflow:auto}.composer-editor:empty:before{content:attr(data-placeholder);color:#94a3b8}.composer-editor img{display:block;max-width:100%;max-height:320px;margin:8px 0;border-radius:8px}.attachment-chip{display:inline-flex;gap:5px;align-items:center;background:#eef2ff;border-radius:14px;padding:4px 8px;margin:2px;font-size:12px}.attachment-chip button{border:0;background:transparent;cursor:pointer;color:#475569}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center}
.modal-card{background:#fff;border-radius:16px;padding:20px;min-width:420px;max-width:640px;max-height:80vh;overflow:auto;position:relative}
#modalClose{position:absolute;top:10px;right:10px}
.modal-card input,.modal-card select,.modal-card textarea{width:100%;border:1px solid #e2e8f0;border-radius:8px;padding:8px;margin:4px 0}
.row{display:flex;gap:8px}.row>*{flex:1}
.toast{position:fixed;bottom:20px;right:20px;background:#0f172a;color:#fff;padding:10px 16px;border-radius:12px;font-size:13px}
table{width:100%;border-collapse:collapse;font-size:13px}td,th{border-bottom:1px solid #e2e8f0;padding:6px;text-align:left}
@media(max-width:1100px){.layout{grid-template-columns:1fr;height:auto}.side,.list{max-height:300px}}

/* TT vs notification: notifications are calm, informational and have no SLA. */
.item-kind{margin-right:4px}.kind-ticket{background:rgba(10,122,255,.14);color:#1261c9}.kind-notification{background:#f1e8ff;color:#7c3aed}.sla.notice{color:#7c3aed}.notification-stat b{color:#7c3aed!important}
.type-btn{border:1px solid rgba(10,122,255,.28);border-radius:12px;padding:8px 11px;background:rgba(10,122,255,.11);color:#1261c9;font:800 12px Inter,system-ui,sans-serif;cursor:pointer;white-space:nowrap;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.type-btn:hover{transform:translateY(-1px);box-shadow:0 0 0 3px rgba(10,122,255,.12)}.type-btn.type-notification{background:#f1e8ff;border-color:#c4b5fd;color:#6d28d9}.card.type-notification{border-left-color:#8b5cf6!important}.card.type-notification .t{margin-top:6px}:root[data-theme="dark"] .kind-ticket{background:#193b70;color:#9dc6ff}:root[data-theme="dark"] .kind-notification{background:#43256f;color:#e4c7ff}:root[data-theme="dark"] .type-btn{background:#193b70;border-color:#3978c8;color:#a9d1ff}:root[data-theme="dark"] .type-btn.type-notification{background:#43256f;border-color:#8556c4;color:#e4c7ff}:root[data-theme="dark"] .sla.notice{color:#d4adff}
.ai-score{background:#e0f2fe;color:#0369a1}.priority-analysis{display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-top:6px}.analysis-label{font-size:10px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.analysis-chip{font-size:10px;font-weight:700;border-radius:999px;padding:3px 7px;background:rgba(239,68,68,.12);color:#b91c1c}.analysis-chip.negative{background:rgba(16,185,129,.13);color:#047857}:root[data-theme="dark"] .ai-score{background:#123e5b;color:#9bdcff}:root[data-theme="dark"] .analysis-chip{background:rgba(248,113,113,.18);color:#ffb2b2}:root[data-theme="dark"] .analysis-chip.negative{background:rgba(52,211,153,.18);color:#9ff0c9}
.review-btn{border:1px solid #fbbf24;border-radius:12px;padding:8px 10px;background:#fff8df;color:#a16207;font:800 12px Inter,system-ui,sans-serif;cursor:pointer;white-space:nowrap}.review-btn.active{background:#fef3c7;color:#92400e;box-shadow:0 0 0 3px rgba(245,158,11,.14)}.review-badge{background:#fef3c7;color:#a16207}.review-stat b{color:#a16207!important}:root[data-theme="dark"] .review-btn{background:#5a430e;border-color:#b88618;color:#ffe48c}:root[data-theme="dark"] .review-badge{background:#61460b;color:#ffe48c}
.analysis-reason{font-size:10px;color:var(--muted);font-style:italic}
/* iOS-inspired glass layer */
:root{--ink:#182033;--muted:#667085;--line:rgba(255,255,255,.68);--panel:rgba(255,255,255,.68);--panel-strong:rgba(255,255,255,.84);--accent:#0a7aff;--accent-soft:rgba(10,122,255,.13);--canvas:#eaf0fb;--shadow:0 18px 52px rgba(42,59,90,.12);--bubble:#f7f9ff}
:root[data-theme="dark"]{--ink:#f4f7ff;--muted:#aab6cc;--line:rgba(255,255,255,.13);--panel:rgba(20,27,43,.66);--panel-strong:rgba(26,35,55,.84);--accent:#4da3ff;--accent-soft:rgba(77,163,255,.18);--canvas:#101522;--shadow:0 20px 58px rgba(0,0,0,.34);--bubble:rgba(255,255,255,.06)}
body{min-height:100vh;background:radial-gradient(circle at 8% 4%,rgba(120,186,255,.42),transparent 31rem),radial-gradient(circle at 94% 90%,rgba(178,147,255,.27),transparent 34rem),var(--canvas);color:var(--ink);letter-spacing:-.01em}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.15),transparent 38%);z-index:-1}.hidden{display:none!important}
.topbar{margin:12px 16px 0;padding:10px 14px;border:1px solid var(--line);border-radius:20px;background:var(--panel);box-shadow:var(--shadow);backdrop-filter:blur(24px) saturate(155%);-webkit-backdrop-filter:blur(24px) saturate(155%)}
.logo{letter-spacing:-.045em;color:var(--ink)}.logo.small{font-size:19px}.top-actions{gap:6px}.btn{border-color:var(--line);background:rgba(255,255,255,.42);color:var(--ink);border-radius:12px;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}.btn:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(35,63,108,.12)}.btn.primary{background:linear-gradient(135deg,#0a7aff,#4c87ff);border-color:transparent;box-shadow:0 8px 18px rgba(10,122,255,.24)}.btn.ghost:hover{background:var(--accent-soft)}.theme-toggle{width:36px;padding-left:0;padding-right:0;font-size:16px}
#search{border-color:transparent;background:rgba(255,255,255,.48);color:var(--ink);border-radius:12px;box-shadow:inset 0 1px 1px rgba(255,255,255,.52)}#search::placeholder{color:var(--muted)}
.stats{padding:14px 16px 0;gap:10px}.stat{border:1px solid var(--line);background:var(--panel);box-shadow:0 8px 24px rgba(35,63,108,.06);backdrop-filter:blur(16px);border-radius:18px;min-width:128px;transition:transform .18s ease}.stat:hover{transform:translateY(-2px)}.stat b{color:var(--ink)}.stat.over b{color:#ff4f5b}
.layout{gap:14px;padding:14px 16px 16px;height:calc(100vh - 166px)}.side,.list,.chat{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%);border-radius:22px}.side{padding:12px}.q{border-color:transparent;background:rgba(255,255,255,.32);border-radius:12px;color:var(--ink);transition:transform .16s ease,background .16s ease}.q:hover{transform:translateX(2px);background:var(--accent-soft)}.q.active{background:linear-gradient(135deg,#0a7aff,#4d86ff);border-color:transparent;box-shadow:0 7px 16px rgba(10,122,255,.22)}.q.archive{color:var(--muted)}.filters select{background:rgba(255,255,255,.42);color:var(--ink);border-color:var(--line)}
.list{padding:9px;background:var(--panel)}.card{border-color:transparent;background:rgba(255,255,255,.4);border-radius:16px;color:var(--ink);transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.card:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(35,63,108,.1);background:var(--panel-strong)}.card.active{border-color:rgba(10,122,255,.34);background:var(--accent-soft);box-shadow:0 0 0 1px rgba(10,122,255,.13),0 10px 24px rgba(10,122,255,.12)}.card .m,.muted,.c-meta{color:var(--muted)}.badge.st{background:var(--accent-soft);color:var(--accent)}.regno{background:var(--accent-soft);color:var(--accent)}
.chat{background:var(--panel-strong)}.chat-head,.tabs,.composer{border-color:var(--line)}.messages{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.03));gap:10px}.msg{background:var(--bubble);border-color:var(--line);box-shadow:0 4px 12px rgba(32,48,78,.05);border-radius:18px}.msg.client{border-top-left-radius:5px}.msg.tech{background:linear-gradient(135deg,#0a7aff,#4d86ff);border-color:transparent;border-top-right-radius:5px;box-shadow:0 8px 18px rgba(10,122,255,.22)}.msg.internal{background:rgba(255,211,77,.22);border-color:rgba(232,175,0,.3);color:var(--ink)}.msg.system{background:rgba(128,145,174,.14);color:var(--muted)}.tab{border-color:transparent;background:rgba(255,255,255,.32);color:var(--muted);border-radius:10px}.tab.active{background:var(--ink);color:var(--panel-strong)}
.composer{background:rgba(255,255,255,.2)}.composer-editor,#tplSel{background:rgba(255,255,255,.45);border-color:var(--line);color:var(--ink)}.internal,.file{border-color:var(--line);background:rgba(255,255,255,.34);color:var(--ink)}.modal{background:rgba(13,20,35,.36);backdrop-filter:blur(9px)}.modal-card{background:var(--panel-strong);color:var(--ink);border:1px solid var(--line);border-radius:24px;box-shadow:0 26px 80px rgba(0,0,0,.24);backdrop-filter:blur(26px)}.toast{background:rgba(20,28,45,.86);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.16);border-radius:14px}
.login-wrap{background:radial-gradient(circle at 18% 15%,rgba(114,180,255,.55),transparent 30rem),radial-gradient(circle at 80% 85%,rgba(186,152,255,.4),transparent 30rem),var(--canvas)}.login-card{background:var(--panel-strong);border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(30px);border-radius:28px;color:var(--ink)}.login-card input{background:rgba(255,255,255,.42);border-color:var(--line);color:var(--ink)}
@media(max-width:800px){.topbar{margin:8px 8px 0;align-items:flex-start;flex-wrap:wrap}.topbar .logo{width:100%}#search{order:3;min-width:100%;max-width:none}.top-actions{margin-left:0;overflow-x:auto;max-width:100%;padding-bottom:2px}.stats{padding:10px 8px 0;flex-wrap:nowrap;overflow-x:auto}.stat{min-width:112px}.layout{padding:10px 8px;height:auto}.side,.list{max-height:none}.chat{min-height:68vh}.layout{grid-template-columns:1fr}.modal-card{min-width:calc(100vw - 32px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

.profile-trigger{border:1px solid var(--line);cursor:pointer;color:var(--ink)}.status-control{display:flex;flex-direction:column;gap:2px;font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.status-control select{min-width:138px;border:1px solid var(--line);border-radius:10px;background:var(--panel-strong);color:var(--ink);padding:7px 9px;font:600 13px Inter,system-ui,sans-serif;text-transform:none;letter-spacing:0}.status-hint{flex-basis:100%;color:var(--muted);font-size:11px;line-height:1.3;max-width:250px}.profile-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.profile-stats>div{padding:10px 6px;background:var(--accent-soft);border-radius:12px;text-align:center}.profile-stats b{display:block;font-size:18px;color:var(--accent)}.profile-stats span{display:block;font-size:10px;color:var(--muted)}.profile-tools{display:flex;gap:7px;flex-wrap:wrap}.modal-card h4{margin:20px 0 8px;color:var(--ink)}
:root[data-theme="dark"] body{background:radial-gradient(circle at 8% 4%,rgba(47,109,201,.28),transparent 31rem),radial-gradient(circle at 94% 90%,rgba(129,88,211,.22),transparent 34rem),#0a0e17;color:#edf3ff}:root[data-theme="dark"] input,:root[data-theme="dark"] select,:root[data-theme="dark"] textarea,:root[data-theme="dark"] .composer-editor{background:rgba(255,255,255,.09)!important;color:#edf3ff!important;border-color:rgba(255,255,255,.16)!important}:root[data-theme="dark"] .side,:root[data-theme="dark"] .list,:root[data-theme="dark"] .chat{background:rgba(18,25,41,.88)}:root[data-theme="dark"] .card,:root[data-theme="dark"] .q,:root[data-theme="dark"] .tab,:root[data-theme="dark"] .internal,:root[data-theme="dark"] .file{background:rgba(255,255,255,.075)}:root[data-theme="dark"] .messages{background:rgba(3,7,15,.35)}:root[data-theme="dark"] .msg{background:rgba(255,255,255,.075)}:root[data-theme="dark"] .msg.tech{background:linear-gradient(135deg,#176fd8,#557fff)}:root[data-theme="dark"] .mail-html,:root[data-theme="dark"] .mail-html *{color:#e7eefc!important;background-color:transparent!important}:root[data-theme="dark"] .mail-html blockquote{border-color:#607aa9!important;background:rgba(255,255,255,.06)!important}:root[data-theme="dark"] .mail-html pre{background:#070b13!important;color:#e7eefc!important}:root[data-theme="dark"] .mail-html a{color:#87c4ff!important}:root[data-theme="dark"] .modal-card{background:rgba(22,30,48,.96)}

.c-actions{display:grid;grid-template-columns:auto minmax(175px,1fr) auto;align-items:end;gap:8px;max-width:100%}.status-picker{position:relative;min-width:175px}.status-label{display:block;margin:0 0 3px;font-size:10px;line-height:1;color:var(--muted);font-weight:800;letter-spacing:.07em;text-transform:uppercase}.status-btn{display:flex;width:100%;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--line);border-radius:12px;background:var(--panel-strong);padding:8px 10px;color:var(--ink);font:700 13px Inter,system-ui,sans-serif;cursor:pointer}.status-btn:hover{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.status-menu{position:absolute;top:calc(100% + 8px);left:0;z-index:20;width:270px;padding:6px;border:1px solid var(--line);border-radius:16px;background:var(--panel-strong);box-shadow:0 18px 42px rgba(0,0,0,.24);backdrop-filter:blur(22px)}.status-menu button{display:block;width:100%;border:0;border-radius:11px;background:transparent;padding:9px 10px;text-align:left;color:var(--ink);cursor:pointer}.status-menu button:hover,.status-menu button.selected{background:var(--accent-soft)}.status-menu b,.status-menu span{display:block}.status-menu b{font-size:13px}.status-menu span{margin-top:2px;color:var(--muted);font-size:11px}.status-hint{align-self:end;padding:0 4px 8px;max-width:240px}.c-actions .danger{align-self:end}@media(max-width:1250px){.c-actions{grid-template-columns:auto minmax(160px,1fr);width:100%}.c-actions .status-hint{grid-column:2}.c-actions .btn{justify-self:start}}@media(max-width:700px){.c-actions{grid-template-columns:1fr 1fr}.status-picker{grid-column:1/-1}.status-hint{grid-column:1/-1!important;padding-bottom:0}.status-menu{width:100%}}
:root[data-theme="dark"] .topbar,:root[data-theme="dark"] .stat,:root[data-theme="dark"] .side,:root[data-theme="dark"] .list,:root[data-theme="dark"] .chat,:root[data-theme="dark"] .modal-card{border-color:#2b3852!important}:root[data-theme="dark"] .topbar{background:#121a2a!important}:root[data-theme="dark"] .stat{background:#151e30!important}:root[data-theme="dark"] .card{background:#202a3d!important;border-color:#2d3952!important}:root[data-theme="dark"] .card.active{background:#172f56!important;border-color:#276ed1!important}:root[data-theme="dark"] .q{background:#252e40!important}:root[data-theme="dark"] .q.active{background:linear-gradient(135deg,#176fd8,#497cff)!important}:root[data-theme="dark"] .messages{background:#0d1320!important}:root[data-theme="dark"] .composer{background:#1b2638!important}:root[data-theme="dark"] .mail-html table,:root[data-theme="dark"] .mail-html td,:root[data-theme="dark"] .mail-html th{border-color:#35425c!important}:root[data-theme="dark"] .status-btn,:root[data-theme="dark"] .status-menu{background:#1d283b!important;border-color:#394862!important}:root[data-theme="dark"] .status-menu button{color:#edf3ff!important}

/* Compact, collapsible A2P explanation so the conversation keeps the space. */
.priority-triage{margin-top:7px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--accent-soft) 52%,transparent);overflow:hidden}.priority-triage summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 9px;cursor:pointer;list-style:none;color:var(--accent);font-size:10px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;user-select:none}.priority-triage summary::-webkit-details-marker{display:none}.priority-triage summary:before{content:'›';font-size:17px;line-height:10px;transition:transform .18s ease}.priority-triage[open] summary:before{transform:rotate(90deg)}.triage-title{margin-right:auto}.triage-summary{font-size:10px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--muted)}.priority-triage .priority-analysis{margin:0;padding:0 9px 8px}.priority-triage .analysis-chip{font-size:10px}.priority-triage .analysis-reason{display:block;margin-top:4px}.priority-triage:not([open]){background:transparent}:root[data-theme="dark"] .priority-triage{background:rgba(77,163,255,.08);border-color:rgba(117,181,255,.3)}

.st-new{background:#dbeafe;color:#1d4ed8}.st-in_progress{background:#ede9fe;color:#6d28d9}.st-waiting_client{background:#fef3c7;color:#b45309}.st-review{background:#cffafe;color:#0e7490}.st-resolved{background:#dcfce7;color:#15803d}.st-closed{background:#e5e7eb;color:#475569}.status-btn[data-status="new"]{border-color:#60a5fa}.status-btn[data-status="in_progress"]{border-color:#a78bfa}.status-btn[data-status="waiting_client"]{border-color:#fbbf24}.status-btn[data-status="review"]{border-color:#22d3ee}.status-btn[data-status="resolved"]{border-color:#4ade80}.status-btn[data-status="closed"]{border-color:#94a3b8}:root[data-theme="dark"] .st-new{background:#193b70;color:#9dc6ff}:root[data-theme="dark"] .st-in_progress{background:#3c286e;color:#d4c4ff}:root[data-theme="dark"] .st-waiting_client{background:#61460b;color:#ffe48c}:root[data-theme="dark"] .st-review{background:#12495a;color:#8ae8ff}:root[data-theme="dark"] .st-resolved{background:#164d31;color:#9ff0bf}:root[data-theme="dark"] .st-closed{background:#3b4555;color:#d3dae7}

/* Fit the whole workspace into the viewport; only ticket lists and messages scroll. */
html,body{height:100%;overflow:hidden}#app{height:100dvh;display:grid;grid-template-rows:auto auto auto minmax(0,1fr);overflow:hidden}.mailbar{grid-row:1;min-height:0}.topbar{grid-row:2}.stats{grid-row:3}.layout{grid-row:4;height:auto!important;min-height:0;overflow:hidden;padding-bottom:14px}.side,.list,.chat{min-height:0}.side{overflow:auto}.list{overflow-y:auto}.chat{overflow:hidden}#chatBox{min-height:0}.messages{min-height:0;overflow-y:auto}.composer{margin:8px;border:1px solid color-mix(in srgb,var(--accent) 32%,var(--line));border-radius:16px;box-shadow:0 0 0 3px rgba(10,122,255,.05)}.composer-editor{min-height:76px!important;border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line))!important;background:var(--panel-strong)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}.composer-editor:focus{border-color:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-soft)!important}.composer .file,.composer .internal,.composer #tplSel{border:1px solid var(--line)}.composer .file:hover,.composer .internal:hover{border-color:var(--accent);background:var(--accent-soft)}@media(max-width:1100px){html,body{overflow:auto}#app{height:auto;min-height:100dvh;display:block}.layout{overflow:visible}.side,.list,.chat{min-height:auto}.messages{min-height:360px}.composer{margin:0}}

/* Priority stripe: status still controls the card tint, urgency controls the edge. */
.card.card.pr-critical{border-left-color:#ef4444!important}.card.card.pr-high{border-left-color:#f97316!important}.card.card.pr-medium{border-left-color:#eab308!important}.card.card.pr-low{border-left-color:#22c55e!important}
:root[data-theme="dark"] .card.card.pr-critical{border-left-color:#ff5c67!important}:root[data-theme="dark"] .card.card.pr-high{border-left-color:#ff9a3d!important}:root[data-theme="dark"] .card.card.pr-medium{border-left-color:#f6d34f!important}:root[data-theme="dark"] .card.card.pr-low{border-left-color:#4ade80!important}

/* Outlook-style reading workspace: navigation is compact and the ticket wins. */
.layout{grid-template-columns:190px 320px minmax(0,1fr);gap:10px}
.stats{padding-top:8px;gap:8px}.stat{min-width:112px;padding:6px 10px;display:flex;align-items:baseline;justify-content:space-between;gap:12px}.stat b{font-size:17px}
.tabs .reading-toggle{margin-left:auto}.layout.reading-focus{grid-template-columns:minmax(0,1fr)}.layout.reading-focus>.side,.layout.reading-focus>.list{display:none}
#app:has(.layout.reading-focus)>.stats{display:none}
.messages{padding:16px 20px}.msg.client{width:min(96%,1120px);max-width:96%;font-size:14px;line-height:1.55}.msg.tech{max-width:82%;font-size:14px;line-height:1.5}
.layout.reading-focus .messages{padding:20px clamp(20px,5vw,76px)}.layout.reading-focus .msg.client{width:min(100%,1240px);max-width:100%}.layout.reading-focus .composer{margin:10px clamp(12px,4vw,62px)}
@media(max-width:1100px){.layout{grid-template-columns:1fr}.layout.reading-focus>.side,.layout.reading-focus>.list{display:flex}.layout.reading-focus>.list{display:block}#app:has(.layout.reading-focus)>.stats{display:flex}.tabs .reading-toggle{display:none}.messages{padding:12px}.msg.client{width:100%;max-width:100%}}

/* Ticket status tint: the whole card communicates its current stage. */
.card{border-left:5px solid transparent}.card.status-new{background:linear-gradient(90deg,#eaf3ff,#fff);border-left-color:#3b82f6}.card.status-in_progress{background:linear-gradient(90deg,#f2edff,#fff);border-left-color:#8b5cf6}.card.status-waiting_client{background:linear-gradient(90deg,#fff8df,#fff);border-left-color:#f59e0b}.card.status-review{background:linear-gradient(90deg,#e6fbff,#fff);border-left-color:#06b6d4}.card.status-resolved{background:linear-gradient(90deg,#e8fbed,#fff);border-left-color:#22c55e}.card.status-closed{background:linear-gradient(90deg,#f0f2f5,#fff);border-left-color:#94a3b8}.card.active.status-new{background:linear-gradient(90deg,#d9ebff,#eef6ff)}.card.active.status-in_progress{background:linear-gradient(90deg,#e8ddff,#f5f0ff)}.card.active.status-waiting_client{background:linear-gradient(90deg,#fff0ba,#fff9e5)}.card.active.status-review{background:linear-gradient(90deg,#cff6ff,#edfcff)}.card.active.status-resolved{background:linear-gradient(90deg,#d2f8df,#effdf4)}.card.active.status-closed{background:linear-gradient(90deg,#e0e5ec,#f5f7fa)}:root[data-theme="dark"] .card.status-new{background:linear-gradient(90deg,#183b70,#202a3d)!important;border-left-color:#60a5fa}:root[data-theme="dark"] .card.status-in_progress{background:linear-gradient(90deg,#372767,#202a3d)!important;border-left-color:#a78bfa}:root[data-theme="dark"] .card.status-waiting_client{background:linear-gradient(90deg,#5a430e,#202a3d)!important;border-left-color:#fbbf24}:root[data-theme="dark"] .card.status-review{background:linear-gradient(90deg,#10485a,#202a3d)!important;border-left-color:#22d3ee}:root[data-theme="dark"] .card.status-resolved{background:linear-gradient(90deg,#164c31,#202a3d)!important;border-left-color:#4ade80}:root[data-theme="dark"] .card.status-closed{background:linear-gradient(90deg,#3b4555,#202a3d)!important;border-left-color:#94a3b8}
/* Persistent workspace-wide automatic acknowledgement control. */
.auto-reply-control{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #d6a83b;border-radius:14px;background:#fff3cd;color:#654c09;font-size:13px;white-space:nowrap}
.auto-reply-control input{width:18px!important;height:18px;margin:0;accent-color:#b57900;flex:none}
.auto-reply-control strong{font-size:11px}
[data-theme="dark"] .auto-reply-control{background:#342b18;color:#ffe4a0;border-color:#a78032}

/* Quoted-email headers become quiet system separators in the conversation. */
.mail-html .mail-thread-divider,.mail-text .mail-thread-divider{display:flex!important;align-items:center;gap:9px;width:100%;margin:15px 0 9px!important;padding:0!important;border:0!important;background:transparent!important;color:var(--muted)!important;font:700 11px/1.35 Inter,system-ui,sans-serif!important;letter-spacing:0!important;white-space:normal!important}
.mail-thread-divider:before{content:'↩ Email thread';flex:none;padding:4px 8px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:10px;font-weight:850;letter-spacing:.02em;text-transform:uppercase}
.mail-thread-divider:after{content:'';height:1px;min-width:30px;flex:1;background:color-mix(in srgb,var(--muted) 22%,transparent)}
.mail-thread-anchor{display:none!important}.mail-quoted-thread{display:block;margin:8px 0 3px;border:0;background:transparent}.mail-quoted-thread>summary{display:flex;align-items:center;justify-content:center;width:46px;height:25px;padding:0 0 5px 3px;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));border-radius:7px;background:var(--accent-soft)!important;color:var(--accent)!important;font:900 16px/1 Inter,system-ui,sans-serif;letter-spacing:3px;list-style:none;cursor:pointer;user-select:none;transition:background .16s ease,transform .16s ease,box-shadow .16s ease}.mail-quoted-thread>summary::-webkit-details-marker{display:none}.mail-quoted-thread>summary::marker{content:''}.mail-quoted-thread>summary:hover{transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--accent) 18%,transparent)}.mail-quoted-thread[open]>summary{background:color-mix(in srgb,var(--accent) 18%,transparent)!important}.mail-quoted-thread-body{margin-top:9px;padding-left:11px;border-left:2px solid color-mix(in srgb,var(--muted) 20%,transparent)}
