:root{
  --bg:#eefcf8;
  --card:rgba(255,255,255,.94);
  --text:#163635;
  --muted:#5c7b78;
  --line:#cfece5;
  --accent:#6edfc7;
  --accent-deep:#48c8af;
  --shadow:0 18px 50px rgba(41,113,98,.10);
}
*{box-sizing:border-box}
html,body{
  margin:0;
  min-height:100%;
  font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 12% 12%,rgba(167,241,221,.85) 0 8%,transparent 9%),
    radial-gradient(circle at 88% 18%,rgba(216,255,240,.95) 0 8%,transparent 9%),
    radial-gradient(circle at 20% 80%,rgba(193,250,233,.65) 0 7%,transparent 8%),
    linear-gradient(180deg,#f6fffc 0%, #eefcf8 50%, #e6faf5 100%);
}
a{color:inherit}
.shell{width:min(720px,calc(100% - 32px));margin:0 auto;padding:72px 0}
.wide-shell{width:min(980px,calc(100% - 32px))}
.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:28px;
  padding:36px;
  box-shadow:var(--shadow);
  backdrop-filter:blur(10px);
}
.hero{text-align:center;padding:70px 40px}
.hero h1,.form-card h1,.card h1{font-size:clamp(34px,7vw,58px);line-height:1;margin:10px 0 18px;letter-spacing:-.04em}
.hero p{font-size:18px;color:var(--muted)}
.eyebrow{
  display:inline-block;
  font-size:12px;
  font-weight:800;
  letter-spacing:.18em;
  background:linear-gradient(135deg,var(--accent-deep),var(--accent));
  color:white;
  padding:8px 11px;
  border-radius:999px;
  box-shadow:0 8px 22px rgba(72,200,175,.24);
}
.actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.btn{
  appearance:none;
  border:1px solid var(--line);
  background:white;
  color:var(--text);
  text-decoration:none;
  padding:12px 17px;
  border-radius:14px;
  font-weight:800;
  cursor:pointer;
  font-size:14px;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(72,200,175,.12);border-color:#b7e6da}
.btn.primary{
  background:linear-gradient(135deg,var(--accent-deep),var(--accent));
  border-color:var(--accent-deep);
  color:white;
}
.btn.wide{width:100%;margin-top:8px}
.form-card{max-width:560px;margin:auto}
.back{text-decoration:none;font-size:14px;color:var(--muted)}
form{margin-top:28px}
label{display:grid;gap:8px;font-size:13px;font-weight:800;margin-bottom:16px}
input,textarea,select{
  width:100%;
  border:1px solid var(--line);
  background:#fff;
  padding:13px 14px;
  border-radius:13px;
  font:inherit;
  outline:none;
}
input:focus,textarea:focus,select:focus{border-color:var(--accent-deep);box-shadow:0 0 0 3px rgba(72,200,175,.18)}
.muted{color:var(--muted)}
.small{font-size:13px}
.message{min-height:24px;font-size:14px;font-weight:700}
.message.error{color:#c53c58}
.message.success{color:#2d875c}
.topbar{
  height:64px;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(255,255,255,.84);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(14px);
  position:sticky;
  top:0;
  z-index:3;
}
.topbar nav{display:flex;gap:16px;align-items:center}
.topbar a,.link-button{text-decoration:none;font-weight:800;font-size:14px}
.brand{font-weight:900}
.link-button{border:0;background:none;cursor:pointer;padding:0}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.full{grid-column:1/-1}
.public-card{text-align:center}
.avatar{
  width:96px;
  height:96px;
  border-radius:50%;
  display:grid;
  place-items:center;
  margin:0 auto 20px;
  background:linear-gradient(135deg,var(--accent-deep),var(--accent));
  color:white;
  font-size:36px;
  box-shadow:0 14px 28px rgba(72,200,175,.22);
}
.handle{color:var(--muted);margin-top:-8px}
.public-bio{white-space:pre-wrap;font-size:17px;line-height:1.7;margin:28px auto;max-width:560px}
.admin-controls{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-top:24px}
.admin-controls label{margin:0;min-width:180px}
.table-wrap{overflow:auto;margin-top:16px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line);white-space:nowrap}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:800}
@media(max-width:650px){
  .shell{padding:34px 0}
  .card{padding:24px;border-radius:22px}
  .hero{padding:48px 24px}
  .two-col{grid-template-columns:1fr}
  .full{grid-column:auto}
  .topbar{padding:0 14px}
  .topbar nav{gap:10px}
}

.field-help{font-size:12px;font-weight:600;color:var(--muted);margin-top:-2px}
.url-preview{display:block;font-size:12px;font-weight:800;color:var(--accent-deep);word-break:break-all;line-height:1.45;background:#effcf8;border:1px dashed #bfe9de;border-radius:10px;padding:9px 10px}

input[readonly]{background:#f4fbf8;color:var(--muted);cursor:not-allowed}

.font-admin-card{margin-top:22px}
.font-admin-card h2{font-size:28px;margin:10px 0 12px}
.font-admin-card input[type=file]{margin:14px 0;display:block}
.font-status-grid{display:grid;gap:8px;margin-top:18px}
.font-status-row{display:flex;justify-content:space-between;gap:16px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;font-size:13px}
.font-status-row.ok b{color:#27866f}
.font-status-row.missing b{color:#c94b61}