:root{--bg:#f5f7fb;--dark:#172033;--blue:#4f7cff;--violet:#7b61ff;--green:#18b981;--red:#ef4444;--text:#253047;--muted:#7b8497;--card:#fff;--line:#e8edf7;}
*{box-sizing:border-box} body{margin:0;font-family:Arial,Helvetica,sans-serif;background:linear-gradient(135deg,#f7f9ff,#eef4ff);color:var(--text)}
a{text-decoration:none;color:inherit}.app{min-height:100vh;display:flex}.sidebar{width:270px;background:linear-gradient(180deg,#172033,#263451);color:white;padding:24px;position:fixed;top:0;bottom:0;left:0;z-index:10;box-shadow:12px 0 35px rgba(23,32,51,.18);transition:.3s}.brand{font-size:25px;font-weight:800;margin-bottom:25px}.brand span{color:#8fd3ff}.userbox{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:14px;margin-bottom:20px}.userbox small{display:block;color:#cbd5e1;margin-top:4px}nav a{display:block;padding:13px 14px;margin:7px 0;border-radius:14px;color:#e8eefc;transition:.2s}nav a:hover{background:rgba(255,255,255,.13);transform:translateX(5px)}nav .logout{margin-top:20px;color:#ffd2d2}.content{margin-left:270px;width:calc(100% - 270px);padding:28px}.menuBtn{display:none;border:0;background:var(--dark);color:white;border-radius:12px;padding:10px 14px;margin-bottom:15px}.hero{background:linear-gradient(135deg,var(--blue),var(--violet));border-radius:28px;padding:28px;color:white;box-shadow:0 18px 45px rgba(79,124,255,.25);position:relative;overflow:hidden}.hero:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.13);right:-60px;top:-70px}.hero h1{margin:0;font-size:33px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px}.stat,.card,.table-card{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:0 14px 35px rgba(32,45,74,.07)}.stat b{font-size:33px;display:block;color:var(--blue)}.stat span,.muted{color:var(--muted)}.table-card{overflow:auto;margin-top:20px}table{width:100%;border-collapse:collapse;min-width:760px}th,td{text-align:left;padding:14px;border-bottom:1px solid var(--line)}th{font-size:13px;color:var(--muted);text-transform:uppercase}.btn{display:inline-block;border:0;border-radius:12px;padding:10px 14px;background:var(--blue);color:white;cursor:pointer;transition:.2s;font-weight:700}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(79,124,255,.25)}.btn.red{background:var(--red)}.btn.gray{background:#64748b}.btn.green{background:var(--green)}.actions{display:flex;gap:8px;flex-wrap:wrap}.form{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.field label{font-weight:700;font-size:14px}.field input,.field select,.field textarea{width:100%;margin-top:7px;border:1px solid var(--line);border-radius:14px;padding:12px 13px;font-size:15px;background:#fbfcff;outline:none;transition:.2s}.field.focus input,.field.focus select,.field.focus textarea{border-color:var(--blue);box-shadow:0 0 0 4px rgba(79,124,255,.12)}.full{grid-column:1/-1}.alert{padding:13px 16px;border-radius:14px;margin:15px 0;font-weight:700}.alert.ok{background:#dcfce7;color:#166534}.alert.errore{background:#fee2e2;color:#991b1b}.login-wrap{width:100%;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.login-card{width:420px;background:white;padding:32px;border-radius:28px;box-shadow:0 22px 60px rgba(23,32,51,.15)}.login-card h1{margin-top:0}.badge{display:inline-block;padding:6px 10px;border-radius:999px;background:#eef2ff;color:#4f46e5;font-size:12px;font-weight:800}.fade-in{opacity:0;animation:fadeIn .5s ease forwards}@keyframes fadeIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:900px){.sidebar{transform:translateX(-105%)}.sidebar.open{transform:translateX(0)}.content{margin-left:0;width:100%;padding:18px}.menuBtn{display:inline-block}.grid{grid-template-columns:1fr}.form{grid-template-columns:1fr}.hero h1{font-size:25px}table{font-size:14px}.login-card{width:100%}}
.badge.ok{background:#dcfce7;color:#166534}.badge.warn{background:#fef3c7;color:#92400e}.badge.red{background:#fee2e2;color:#991b1b}.search-form{align-items:end}.chat-badge{float:right;background:#ef4444;color:#fff;border-radius:999px;min-width:22px;height:22px;line-height:22px;text-align:center;font-size:12px;padding:0 6px}.chat-page{display:grid;grid-template-columns:330px 1fr;gap:20px;margin-top:20px}.chat-list{max-height:720px;overflow:auto}.chat-row{display:block;border:1px solid var(--line);border-radius:16px;padding:13px;margin:10px 0;background:#fbfcff;transition:.2s}.chat-row:hover,.chat-row.active{border-color:var(--blue);transform:translateY(-2px);box-shadow:0 12px 25px rgba(79,124,255,.12)}.chat-row small{display:block;color:var(--muted);margin-top:4px}.mini-form input,.mini-form textarea,.reply-form textarea{width:100%;border:1px solid var(--line);border-radius:14px;padding:12px;margin:6px 0;background:#fbfcff}.chat-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:14px}.messages{height:430px;overflow:auto;padding:10px;background:linear-gradient(135deg,#fbfcff,#f1f5ff);border-radius:20px}.message{max-width:78%;padding:12px 14px;border-radius:18px;margin:10px 0;box-shadow:0 8px 18px rgba(32,45,74,.06);animation:fadeIn .25s ease}.message p{margin:7px 0}.message em{font-size:11px;color:var(--muted);font-style:normal}.message.mine{margin-left:auto;background:#e0e7ff}.message.other{background:white}.reply-form{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:12px}.reply-form textarea{margin:0}.chat-popup{position:fixed;right:24px;bottom:24px;width:330px;background:white;border:1px solid var(--line);border-radius:22px;padding:18px;z-index:50;box-shadow:0 22px 60px rgba(23,32,51,.22);animation:popChat .25s ease}.chat-popup p{color:var(--muted)}.chat-close{position:absolute;right:12px;top:10px;border:0;background:#f1f5f9;border-radius:50%;width:28px;height:28px;cursor:pointer}@keyframes popChat{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:900px){.chat-page{grid-template-columns:1fr}.messages{height:360px}.reply-form{grid-template-columns:1fr}.chat-popup{left:14px;right:14px;width:auto;bottom:14px}}