*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--bg: #f7f8fa;--bg2: #ffffff;--bg3: #f0f1f4;--border: #e5e7eb;--border2: #c9ccd3;--text: #1a1d23;--text2: #6b7280;--text3: #9aa1ab;--accent: #34548f;--accent2: #2a4373;--accent-tint: #e8edf6;--green: #16a34a;--red: #dc2626;--amber: #d97706;--r: 6px;--r2: 10px;--status-draft-bg: #eef0f2;--status-draft-text: #51565c;--status-info-bg: #e3ebf7;--status-info-text: #2f5fae;--status-good-bg: #e3f5ea;--status-good-text: #1f8a4c;--status-bad-bg: #fbeaea;--status-bad-text: #b3423a;--status-warn-bg: #fff7ed;--status-warn-text: #c2410c}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font-family:var(--font);cursor:pointer;border:none;outline:none;background:none}input,select{font-family:var(--font);font-size:16px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 20px;border-radius:var(--r);font-weight:600;font-size:16px;min-height:50px;transition:background .12s;white-space:nowrap}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent2)}.btn-primary:disabled{background:var(--border2);color:var(--text3);cursor:not-allowed}.btn-ghost{background:var(--bg2);color:var(--text);border:1px solid var(--border)}.btn-ghost:hover{border-color:var(--border2)}.btn-danger{background:#fff;color:var(--red);border:1px solid var(--status-bad-bg)}.btn-sm{padding:8px 14px;min-height:38px;font-size:14px}.card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r2)}.input{width:100%;padding:12px 14px;border-radius:var(--r);border:1px solid var(--border2);background:#fff;color:var(--text);font-size:16px}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #34548f1f}.tag{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:20px;font-size:12px;font-weight:600;text-transform:capitalize;white-space:nowrap}.tag-draft{background:var(--status-draft-bg);color:var(--status-draft-text)}.tag-submitted{background:var(--status-info-bg);color:var(--status-info-text)}.tag-approved{background:var(--status-good-bg);color:var(--status-good-text)}.tag-rejected{background:var(--status-bad-bg);color:var(--status-bad-text)}.page{max-width:720px;margin:0 auto;padding:20px 16px 80px}.page-wide{max-width:1100px;margin:0 auto;padding:20px 16px 80px}.topbar{background:#fff;border-bottom:1px solid var(--border);padding:14px 16px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20}.topbar-brand{font-weight:800;font-size:17px;color:var(--accent)}.topbar-user{font-size:13px;color:var(--text2);display:flex;align-items:center;gap:10px}.tabbar{display:flex;gap:4px;background:#fff;border-bottom:1px solid var(--border);padding:0 16px;overflow-x:auto}.tab{padding:12px 14px;font-weight:600;font-size:14px;color:var(--text2);border-bottom:3px solid transparent;white-space:nowrap}.tab.active{color:var(--accent);border-bottom-color:var(--accent)}.banner{padding:12px 16px;border-radius:var(--r);font-size:14px;margin-bottom:14px}.banner-error{background:var(--status-bad-bg);color:var(--status-bad-text)}.banner-warn{background:var(--status-warn-bg);color:var(--status-warn-text)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;align-items:flex-end;justify-content:center;z-index:100}@media (min-width: 640px){.modal-overlay{align-items:center}}.modal{background:#fff;border-radius:var(--r2) var(--r2) 0 0;width:100%;max-width:480px;max-height:90vh;overflow-y:auto;padding:20px}@media (min-width: 640px){.modal{border-radius:var(--r2)}}.tile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px}.name-tile{background:#fff;border:1px solid var(--border);border-radius:var(--r2);padding:24px 12px;text-align:center;font-weight:600;font-size:16px;display:flex;flex-direction:column;align-items:center;gap:10px}.name-tile-avatar{width:56px;height:56px;border-radius:50%;background:var(--accent-tint);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700}