*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#f1f5fb;color:#111827}:root{--surface: #ffffff;--surface-muted: #f8fbff;--line: #d9e3ef;--text-main: #0f172a;--text-soft: #475569;--primary: #0f766e;--primary-strong: #0c5f59;--accent: #1d4ed8;--focus: rgba(29, 78, 216, .24)}#root{width:100%}.app-shell{min-height:100vh;padding:16px;background:radial-gradient(circle at 0% 0%,#daf6ed 0%,transparent 35%),radial-gradient(circle at 100% 0%,#e8efff 0%,transparent 30%),linear-gradient(180deg,#f5f9fd,#eef4fb)}.hero,.content-grid{max-width:1080px;margin:0 auto}.hero{background:linear-gradient(180deg,#fff,#f9fcff);border:1px solid var(--line);border-radius:18px;padding:16px;margin-bottom:14px;box-shadow:0 14px 24px -22px #0f172a80}.brand{display:flex;align-items:center;gap:12px;margin-bottom:10px}.brand img{width:58px;height:58px;border-radius:14px;border:1px solid var(--line);background:#fff}.brand-kicker{margin:0;font-size:.75rem;text-transform:uppercase;letter-spacing:1.2px;color:#0f766e;font-weight:700}.hero h1{margin:2px 0 0;font-size:1.5rem;line-height:1.2}.hero p{margin:0;color:var(--text-soft)}.content-grid{display:grid;gap:14px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:0 12px 24px -24px #0f172a73}.panel-header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.panel-header h2{margin:0;font-size:1.02rem}.panel-header span{color:var(--text-soft);font-size:.86rem}.filters-grid{display:grid;grid-template-columns:1fr;gap:10px}.field{display:grid;gap:6px}.field span{color:#334155;font-size:.84rem;font-weight:600}.field input{width:100%;padding:10px 12px;border:1px solid #c6d4e4;border-radius:10px;font-size:.93rem;color:var(--text-main);background:#fff}.field input:focus-visible,.btn:focus-visible,.icon-button:focus-visible,.link-button:focus-visible{outline:0;box-shadow:0 0 0 4px var(--focus)}.user-list{display:grid;gap:10px}.user-card{border:1px solid #dbe5f1;border-radius:12px;background:var(--surface-muted);padding:11px}.user-card-header{display:flex;justify-content:space-between;align-items:center;gap:10px}.link-button{border:0;background:transparent;padding:0;color:#0f172a;font-weight:700;font-size:1rem;cursor:pointer;text-align:left}.link-button:hover{color:var(--accent);text-decoration:underline}.user-email{margin:4px 0 0;color:var(--text-soft);font-size:.88rem}.user-details{margin-top:9px;border-top:1px solid #dce6f2;padding-top:9px;display:grid;gap:5px;color:#334155}.user-details p{margin:0;font-size:.88rem}.icon-button{width:34px;height:34px;border-radius:10px;border:1px solid #bed0e4;background:#fff;cursor:pointer;color:#1f2937;font-size:1rem;font-weight:700}.feedback-card{border:1px solid #dce6f2;border-radius:12px;padding:12px;background:#fff;color:#334155;display:grid;gap:10px}.feedback-card p{margin:0}.pagination{margin-top:12px;display:flex;justify-content:center;gap:10px}.btn{border-radius:10px;border:1px solid transparent;padding:10px 12px;font-size:.9rem;font-weight:700;cursor:pointer;transition:filter .13s ease}.btn:hover{filter:brightness(.98)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-strong)}.btn-secondary{background:#eaf2ff;border-color:#bfd5f3;color:#1f3f68}.modal-overlay{position:fixed;inset:0;background:#0f172a73;display:grid;place-items:center;padding:14px;z-index:1000}.modal-card{width:100%;max-width:520px;background:#fff;border-radius:14px;border:1px solid var(--line);padding:16px}.modal-card h2{margin:0 0 8px;font-size:1.15rem}.modal-card p{margin:0;color:#334155}.modal-meta{margin-top:10px;display:grid;gap:4px;color:#475569;font-size:.9rem}.modal-actions{margin-top:14px;display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}@media(min-width:760px){.app-shell{padding:24px}.hero{padding:18px}.hero h1{font-size:1.8rem}.filters-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:1060px){.content-grid{grid-template-columns:360px minmax(0,1fr);align-items:start}.panel{padding:16px}}