
.profile-layout{
  display:grid; grid-template-columns:360px 1fr; gap:18px;
}
.profile-side{padding:22px; display:flex; flex-direction:column; gap:18px}
.avatar-stage{
  width:100%; min-height:220px;
  display:grid; place-items:center;
  border:1px solid var(--stroke); border-radius:18px;
  background:
    radial-gradient(circle at top left, rgba(114,246,255,.12), transparent 45%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
}
.avatar-stage.xl{min-height:auto; width:148px; height:148px}
.avatar-large{
  width:148px; height:148px; object-fit:cover;
  border-radius:18px; border:1px solid var(--stroke-strong);
  box-shadow:0 18px 48px rgba(114,246,255,.12);
}
.avatar-fallback.large{
  width:148px; height:148px; border-radius:18px;
  display:grid; place-items:center;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border:1px solid var(--stroke);
  font-size:44px; font-weight:800;
}
.upload-stack{display:flex; flex-direction:column; gap:10px}
.upload-btn{
  min-height:44px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:12px; border:1px dashed var(--stroke-strong);
  background:rgba(255,255,255,.02); cursor:pointer;
}
.upload-stack small{color:var(--muted); line-height:1.5}

.summary-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.direct-card{
  padding:16px; border-radius:14px; border:1px solid var(--stroke);
  background:rgba(255,255,255,.02);
}
.direct-card span{display:block; color:var(--muted); font-size:12px; margin-bottom:8px; text-transform:uppercase; letter-spacing:.08em}
.direct-card strong{font-size:16px; word-break:break-all}

.profile-main{display:flex; flex-direction:column; gap:18px}
.editor-panel,.comments-panel,.public-hero,.public-comments{padding:22px}
.editor-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.editor-grid .full{grid-column:1/-1}
.editor-actions{display:flex; gap:12px; margin-top:6px}

.comment-card{
  border:1px solid var(--stroke);
  border-radius:14px;
  background:rgba(255,255,255,.025);
  padding:14px;
}
.comment-card-top{display:flex; justify-content:space-between; gap:12px; align-items:flex-start}
.comment-author{display:flex; gap:12px; align-items:center}
.comment-avatar-mini,.comment-avatar-fallback{
  width:42px; height:42px; border-radius:12px; object-fit:cover;
}
.comment-avatar-fallback{
  display:grid; place-items:center; background:rgba(255,255,255,.05); border:1px solid var(--stroke); font-weight:800;
}
.comment-author strong{display:block}
.comment-author small{color:var(--muted)}
.comment-content{margin-top:10px; line-height:1.65; color:var(--text); white-space:pre-wrap}

.public-layout{display:flex; flex-direction:column; gap:18px}
.public-hero{display:grid; grid-template-columns:1.1fr .9fr; gap:18px; align-items:start}
.public-identity{display:grid; grid-template-columns:148px 1fr; gap:18px; align-items:center}
.public-identity h1{margin:0 0 6px; font-size:clamp(36px,4vw,56px); letter-spacing:-.06em}
.public-chips{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
.chip{
  min-height:36px; display:inline-flex; align-items:center;
  padding:0 12px; border-radius:999px; border:1px solid var(--stroke); background:rgba(255,255,255,.03); color:var(--muted)
}
.chip.strong{color:var(--text)}
.bio-card{
  padding:18px; border:1px solid var(--stroke); border-radius:14px; background:rgba(255,255,255,.02)
}
.bio-card span{display:block; color:var(--muted); font-size:12px; margin-bottom:8px; text-transform:uppercase; letter-spacing:.08em}
.bio-card strong{display:block; line-height:1.7; font-size:17px; font-weight:600}
.comment-compose{margin-top:18px}

@media (max-width: 1080px){
  .profile-layout{grid-template-columns:1fr}
  .public-hero{grid-template-columns:1fr}
}
@media (max-width: 780px){
  .summary-grid,.editor-grid,.public-identity{grid-template-columns:1fr}
}
