:root{--navy:#071f42;--blue:#0d6efd;--ink:#12213d;--muted:#68758a;--line:#dce4ef;--bg:#f4f7fb;--white:#fff;--red:#d72c3a;--green:#07965a;--orange:#ed8514;--purple:#6948e8}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:var(--blue);text-decoration:none}button,input,textarea,select{font:inherit}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:linear-gradient(165deg,var(--navy),#012858);color:white;padding:26px 16px 20px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:12px;padding:0 8px}.brand-mark{width:46px;height:46px;border:2px solid white;border-radius:10px;display:grid;place-items:center;font-weight:900;color:#5ea0ff}.brand strong{display:block;font-size:25px}.brand span{display:block;color:#2e86ff;font-size:17px;letter-spacing:5px}.tagline{font-size:9px;letter-spacing:2.5px;padding:9px 8px 22px;border-bottom:1px solid #ffffff24;color:#dbe8fb}.sidebar nav{display:flex;flex-direction:column;gap:5px;margin-top:18px}.sidebar nav a{color:#f6f9ff;border-radius:7px;padding:13px 12px;display:flex;align-items:center;gap:14px;font-size:15px}.sidebar nav a:hover{background:#ffffff14}.sidebar nav a.active{background:linear-gradient(100deg,#1174ff,#0865e8);box-shadow:0 5px 18px #0055d259}.sidebar nav i{font-style:normal;font-size:21px;width:25px;text-align:center}.staff-box{margin-top:auto;border-top:1px solid #ffffff29;padding:17px 8px 0;display:grid;gap:5px;font-size:12px}.staff-box span{color:#b9c9df}.staff-box a{color:#73adff;margin-top:5px}.workspace{margin-left:248px;padding:28px 32px 55px;min-height:100vh;max-width:1700px}.workspace>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}.eyebrow{color:var(--blue);font-size:11px;font-weight:800;letter-spacing:1.8px;margin:0 0 5px}.workspace h1{font-size:31px;letter-spacing:-.8px;margin:0}.primary,.button{display:inline-block;border:0;border-radius:6px;padding:12px 18px;background:var(--blue);color:white;font-weight:700;min-height:43px;cursor:pointer;box-shadow:0 5px 16px #0d6efd33}.primary:hover,.button:hover{background:#075fdc;color:white}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:22px}.stat{background:white;border:1px solid var(--line);border-radius:9px;padding:20px;display:flex;gap:15px;align-items:center}.stat-icon{width:58px;height:58px;border-radius:10px;display:grid;place-items:center;font-size:29px}.stat-icon.blue{color:var(--blue);background:#e8f1ff}.stat-icon.green{color:var(--green);background:#e5f8ef}.stat-icon.orange{color:var(--orange);background:#fff2e3}.stat-icon.purple{color:var(--purple);background:#f0ebff}.stat span,.stat small{display:block}.stat strong{font-size:31px;line-height:1.05;display:block;margin:4px 0;color:#1b63d9}.stat small{color:var(--muted);font-size:12px}.quality-alert{display:grid;grid-template-columns:50px 1fr auto;gap:16px;align-items:center;border:1px solid #ff989c;background:#fffafa;border-radius:9px;padding:19px;margin-bottom:22px}.quality-alert.quiet{border-color:#b9d8c8;background:#fbfffd}.quality-alert h2{color:#b90f1d;margin:0 0 7px;font-size:18px}.quality-alert.quiet h2{color:#087645}.quality-alert p{margin:0;color:#465165;font-size:13px;line-height:1.5}.alert-icon{width:46px;height:46px;border-radius:50%;background:var(--red);color:white;display:grid;place-items:center;font-weight:900;font-size:24px}.quiet .alert-icon{background:var(--green)}.panel,.form-panel{background:white;border:1px solid var(--line);border-radius:9px;overflow:hidden;margin-bottom:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:17px 19px;border-bottom:1px solid var(--line)}.panel h2,.form-panel h2{margin:0;font-size:18px}.form-panel{padding:21px}.form-panel h2{margin-bottom:18px}.form-panel form>.primary{margin-top:18px}.panel-intro{margin:18px 20px;color:var(--muted);font-size:13px}.toolbar{display:flex;justify-content:space-between;gap:15px;margin-bottom:17px}.toolbar form{flex:1;max-width:520px}.search{display:flex;align-items:center;background:white;border:1px solid var(--line);border-radius:7px;padding:0 12px}.search input{width:100%;border:0;outline:0;padding:12px;background:transparent}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.form-grid label,.note-form label,.inline-form label,.auth-card label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:#40506a}.form-grid input,.form-grid select,.form-grid textarea,.note-form input,.note-form select,.note-form textarea,.inline-form select,.auth-card input{border:1px solid #cdd8e7;border-radius:6px;padding:10px 11px;outline:0;background:white;color:var(--ink);min-height:41px}.form-grid textarea,.note-form textarea{min-height:82px;resize:vertical}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus,.note-form input:focus,.note-form textarea:focus,.auth-card input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #0d6efd1f}.check{flex-direction:row!important;align-items:center;margin-top:25px}.check input{min-height:auto}.inline-form{padding:18px;display:flex;align-items:end;gap:12px}.inline-form label{min-width:260px}table{border-collapse:collapse;width:100%;font-size:13px}th{text-align:left;color:#657289;font-size:11px;letter-spacing:.3px;text-transform:uppercase;background:#fafcff;padding:11px 16px;border-bottom:1px solid var(--line)}td{padding:11px 16px;border-bottom:1px solid #e9edf3;color:#29364c}tbody tr:hover{background:#f8fbff}td b,td small{display:block}td small{font-size:11px;color:#78869a;margin-top:4px}.strong{font-weight:700}.status{display:inline-block;padding:5px 8px;border:1px solid #75aef8;border-radius:5px;color:#0965d9;background:#f0f7ff;font-size:11px;white-space:nowrap}.status.good{color:#078348;background:#edfbf4;border-color:#7ed8aa}.status.warn{color:#b65c00;background:#fff6ea;border-color:#f3b66e}.status.bad{color:#c32635;background:#fff1f2;border-color:#f3a1aa}.empty{text-align:center;padding:45px 20px;color:#7a879a}.empty.small{padding:20px}.empty>div{font-size:32px;color:#91a8c8}.empty h3{color:#39475c;margin:8px 0 5px}.empty p{margin:0}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:18px}.record-card{border:1px solid var(--line);border-radius:8px;padding:16px;display:flex;gap:13px;align-items:center}.record-card h3{margin:0 0 6px}.record-card p{margin:2px 0;color:var(--muted);font-size:12px}.record-card small{color:#738097}.avatar{width:50px;height:50px;border-radius:50%;background:#e7f1ff;color:#176cd7;display:grid;place-items:center;font-weight:800}.avatar.square{border-radius:8px}.customer-head,.ticket-head{display:flex;align-items:center;gap:14px;background:white;border:1px solid var(--line);border-radius:9px;padding:20px;margin-bottom:20px}.customer-head h2,.ticket-head h2{margin:0 0 5px}.customer-head p,.ticket-head p{margin:0;color:var(--muted)}.customer-head .primary,.ticket-head .status{margin-left:auto}.split{display:grid;grid-template-columns:350px 1fr;gap:22px;padding:20px}.note-form{display:grid;gap:13px;align-content:start}.timeline article{border-left:3px solid #9bc3fc;padding:0 0 18px 15px;margin-bottom:4px}.timeline article b,.timeline article span{display:block}.timeline article span{color:var(--muted);font-size:11px;margin-top:4px}.timeline article p{font-size:13px;line-height:1.5}.details-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:20px}.details-grid article{background:white;border:1px solid var(--line);border-radius:9px;padding:18px}.details-grid h3{margin:0 0 9px;font-size:14px}.details-grid p{margin:0;color:#526076;line-height:1.55}.count{display:inline-grid;place-items:center;min-width:29px;height:29px;border-radius:50%;background:#eaf2ff;color:#176cd7;font-weight:800}.count.hot{background:#fff0f1;color:#d62334}.flash{padding:12px 15px;border:1px solid #87d8b0;background:#eefbf5;color:#087645;border-radius:7px;margin-bottom:17px}.flash.error,.error-box{border-color:#f1a6ad;background:#fff2f3;color:#b61f2c}.auth-body{background:linear-gradient(135deg,#051d3d,#0b4e9e);min-height:100vh;display:grid;place-items:center;padding:20px}.auth-card{width:min(440px,100%);background:white;border-radius:14px;padding:34px;box-shadow:0 25px 70px #001c4866}.auth-card h1{font-size:25px;margin:8px 0 10px}.auth-card>p:not(.eyebrow){color:var(--muted);font-size:14px;line-height:1.5}.auth-card form{display:grid;gap:14px;margin-top:22px}.auth-brand{display:flex;align-items:center;gap:12px}.auth-brand b{background:var(--navy);color:#5ea0ff;border-radius:8px;padding:12px}.auth-brand span{font-weight:800;letter-spacing:1px}.wide{width:100%;margin-top:5px}.security-note{display:block;text-align:center;color:#8490a2;margin-top:20px}.error-box{padding:11px;border:1px solid;border-radius:6px}code{background:#edf2f8;padding:2px 5px;border-radius:4px}
@media(max-width:1050px){.stats{grid-template-columns:1fr 1fr}.card-grid{grid-template-columns:1fr 1fr}.sidebar{width:210px}.workspace{margin-left:210px;padding:24px 20px}.quality-alert{grid-template-columns:45px 1fr}.quality-alert .button{grid-column:2;justify-self:start}}
@media(max-width:760px){.sidebar{position:relative;width:100%;height:auto;padding:15px}.tagline,.staff-box{display:none}.sidebar nav{flex-direction:row;overflow-x:auto;margin-top:12px}.sidebar nav a{min-width:max-content;padding:9px 12px}.sidebar nav i{font-size:18px;width:auto}.workspace{margin-left:0;padding:20px 14px}.workspace>header{align-items:flex-start}.workspace h1{font-size:24px}.stats{gap:10px}.stat{padding:12px}.stat-icon{width:42px;height:42px;font-size:22px}.stat strong{font-size:25px}.quality-alert{padding:14px}.panel{overflow-x:auto}.panel-head{min-width:600px}table{min-width:760px}.form-grid,.details-grid,.split{grid-template-columns:1fr}.card-grid{grid-template-columns:1fr;padding:12px}.toolbar{flex-wrap:wrap}.customer-head{align-items:flex-start;flex-wrap:wrap}.customer-head .primary{margin-left:0}.inline-form{align-items:stretch;flex-direction:column}.inline-form label{min-width:0}.auth-card{padding:25px}}