:root{
  --ink:#15191e; --sub:#5b6470; --line:#e6e8ec; --bg:#f4f6f9;
  --accent:#0a66c2; --accent-d:#084b8f; --ok:#1a8a4a; --okbg:#e8f6ee;
  --danger:#c0392b; --warn:#8a5a00; --warnbg:#fff6e0; --errbg:#fdecea;
  --card:#ffffff; --radius:14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink); background:var(--bg); line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
.muted{color:var(--sub)}
.tiny{font-size:12.5px}
.strong{font-weight:600}
.center{text-align:center}
.ar{text-align:right}
.nowrap{white-space:nowrap}

.wrap{max-width:760px; margin:0 auto; padding:22px 18px 60px}
.wrap.wide{max-width:1080px}
.centered{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px}

.site-head{display:flex; align-items:center; margin-bottom:18px}
.site-head.between{justify-content:space-between}
.head-actions{display:flex; gap:8px}
.brand{font-weight:800; letter-spacing:.3px; font-size:20px}
.brand.big{font-size:26px; margin-bottom:6px}
.site-foot{margin-top:26px; text-align:center}

.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:26px; box-shadow:0 1px 2px rgba(20,25,30,.04)}
.card.narrow{max-width:420px; width:100%}
h1{font-size:24px; margin:0 0 6px}
.card > .muted{margin-top:0}

label{display:block; font-weight:600; font-size:14px; margin:14px 0 0}
input[type=text],input[type=email],input[type=password],textarea,select{
  width:100%; margin-top:6px; padding:11px 12px; font-size:15px; font-weight:400;
  border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--ink);
}
input:focus,textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(10,102,194,.12)}
input[type=file]{margin-top:8px; font-weight:400}
textarea{resize:vertical}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
label.check{display:flex; align-items:flex-start; gap:8px; font-weight:400; font-size:14px}
label.check input{width:auto; margin-top:2px}
@media (max-width:560px){ .grid2{grid-template-columns:1fr} }

.btn{display:inline-block; cursor:pointer; border:1px solid var(--line); background:#fff;
  color:var(--ink); padding:10px 16px; border-radius:10px; font-size:14px; font-weight:600;
  text-align:center; line-height:1.2}
.btn:hover{text-decoration:none; border-color:#cfd4da}
.btn.primary{background:var(--accent); border-color:var(--accent); color:#fff}
.btn.primary:hover{background:var(--accent-d); border-color:var(--accent-d)}
.btn.ok{background:var(--ok); border-color:var(--ok); color:#fff}
.btn.ok:hover{filter:brightness(.95)}
.btn.danger{background:#fff; border-color:#e6b8b2; color:var(--danger)}
.btn.danger:hover{background:#fdecea}
.btn.ghost{background:#fff}
.btn.big{padding:13px 20px; font-size:15px}
.btn.small{padding:7px 11px; font-size:12.5px; border-radius:8px}
.btn.block{display:block; width:100%; margin-top:14px}
form.inline{display:inline}
.big-gap{margin-top:18px}
button.primary,button.ok,button.ghost,button.danger{cursor:pointer}
.badge-actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; align-items:center}

.notice{padding:12px 14px; border-radius:10px; margin:14px 0; font-size:14px}
.notice.ok{background:var(--okbg); color:var(--ok)}
.notice.err{background:var(--errbg); color:var(--danger)}
.notice.warn{background:var(--warnbg); color:var(--warn)}
.notice ol{margin:6px 0 0 18px}

.tabs{display:flex; gap:8px; margin-bottom:16px}
.tab{padding:9px 14px; border:1px solid var(--line); background:#fff; border-radius:10px;
  font-weight:600; font-size:14px; color:var(--sub)}
.tab.active{color:var(--ink); border-color:#cfd4da; background:#fff}
.tab:hover{text-decoration:none}
.pill{display:inline-block; min-width:20px; padding:1px 7px; margin-left:4px; border-radius:20px;
  background:var(--accent); color:#fff; font-size:12px; text-align:center}
.tab:not(.active) .pill{background:#aeb6bf}

.table-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden}
table.grid{width:100%; border-collapse:collapse; font-size:14px}
table.grid th{ text-align:left; padding:12px 14px; background:#fafbfc; border-bottom:1px solid var(--line);
  font-size:12px; text-transform:uppercase; letter-spacing:.4px; color:var(--sub)}
table.grid td{padding:13px 14px; border-bottom:1px solid var(--line); vertical-align:middle}
table.grid tr:last-child td{border-bottom:none}
.urlcell{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px}
td.ar form.inline{margin-left:6px}
td.ar .btn{margin-left:6px; margin-bottom:4px}
.badge.gray{display:inline-block; margin-left:8px; padding:1px 8px; border-radius:6px; background:#eef0f3; color:#6b7480; font-size:11px}

/* Public profile */
.profile-card{max-width:420px; width:100%; background:#fff; border:1px solid var(--line);
  border-radius:20px; padding:28px 24px 22px; box-shadow:0 8px 30px rgba(20,25,30,.08)}
.profile-top{text-align:center}
.avatar{width:96px; height:96px; border-radius:50%; object-fit:cover; margin:0 auto 14px; display:block;
  border:3px solid #fff; box-shadow:0 2px 10px rgba(0,0,0,.12)}
.avatar.placeholder{display:flex; align-items:center; justify-content:center; background:var(--accent);
  color:#fff; font-size:40px; font-weight:800}
.profile-top h1{font-size:24px; margin:0}
.profile-top .role{color:var(--sub); margin-top:2px}
.profile-top .biz{font-weight:700; margin-top:6px}
.bio{text-align:center; color:var(--sub); margin:16px 4px}
.contact-rows{margin-top:18px; display:flex; flex-direction:column; gap:8px}
.contact-rows .row{display:flex; justify-content:space-between; align-items:center; gap:12px;
  padding:12px 14px; border:1px solid var(--line); border-radius:12px; color:var(--ink)}
.contact-rows .row:hover{border-color:#cfd4da; text-decoration:none; background:#fafbfc}
.contact-rows .k{font-weight:700; font-size:13px; color:var(--sub)}
.contact-rows .v{font-size:14px; text-align:right; word-break:break-all}
.profile-foot{text-align:center; margin-top:18px}
