#account-account.luna-account-shell,
#account-edit,
#account-register { --luna-ink:#172238; --luna-orange:#f58a18; --luna-cream:#fff8ee; --luna-muted:#687386; }
.luna-profile-hero { display:grid; grid-template-columns:132px minmax(0,1fr) auto; align-items:center; gap:28px; padding:34px; margin:12px 0 28px; border-radius:30px; color:#fff; background:radial-gradient(circle at 85% 15%,rgba(255,190,75,.38),transparent 34%),linear-gradient(135deg,#14213a,#263655); box-shadow:0 18px 45px rgba(18,31,53,.18); }
.luna-profile-avatar,.luna-avatar-preview { width:124px; height:124px; border-radius:50%; object-fit:cover; background:#fff; box-shadow:0 0 0 5px rgba(255,255,255,.18); }
.luna-profile-identity span { display:block; margin-bottom:5px; color:#ffc875; font-weight:700; letter-spacing:.05em; text-transform:uppercase; font-size:.75rem; }
.luna-profile-identity h1 { margin:0; color:#fff; font-size:clamp(1.75rem,4vw,2.65rem); line-height:1.08; }
.luna-profile-identity p { margin:9px 0 0; color:rgba(255,255,255,.72); font-size:1rem; overflow-wrap:anywhere; }
.luna-profile-actions { display:flex; flex-direction:column; align-items:center; gap:5px; min-width:156px; }
.luna-avatar-primary { width:100%; color:#172238; background:#ffad32; border:0; border-radius:999px; padding:11px 18px; font-weight:800; }
.luna-avatar-primary:hover { color:#172238; background:#ffc263; }
.luna-profile-actions .btn-link { color:rgba(255,255,255,.72); text-decoration:none; }
.luna-profile-actions small { min-height:20px; max-width:210px; color:#fff; text-align:center; }
.luna-account-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:26px; }
.luna-account-card { display:grid; grid-template-columns:48px 1fr auto; align-items:center; gap:15px; min-height:100px; padding:21px 22px; color:var(--luna-ink); text-decoration:none; border-radius:22px; background:#fff; box-shadow:0 9px 28px rgba(27,39,61,.09); transition:transform .2s ease,box-shadow .2s ease; }
.luna-account-card:hover { color:var(--luna-ink); transform:translateY(-2px); box-shadow:0 14px 34px rgba(27,39,61,.14); }
.luna-account-card>i:first-child { display:grid; place-items:center; width:48px; height:48px; border-radius:16px; color:#df7000; background:#fff1da; font-size:1.2rem; }
.luna-account-card span { display:flex; min-width:0; flex-direction:column; gap:3px; }
.luna-account-card strong { font-size:1.08rem; }
.luna-account-card small { color:var(--luna-muted); }
.luna-account-card>i:last-child { color:#a4adba; font-size:.8rem; }
.luna-account-card--featured { background:linear-gradient(135deg,#fff5e5,#fff); }
.luna-account-card--logout>i:first-child { color:#ad3744; background:#fff0f1; }
.luna-avatar-field { display:grid; grid-template-columns:minmax(160px,1fr) 112px auto; align-items:center; gap:18px; padding:22px; margin:18px 0 28px; border-radius:22px; background:var(--luna-cream); }
.luna-avatar-field .luna-avatar-preview { width:104px; height:104px; box-shadow:0 0 0 4px #fff; }
.luna-avatar-copy { display:flex; flex-direction:column; gap:5px; }
.luna-avatar-copy strong { color:var(--luna-ink); font-size:1.1rem; }
.luna-avatar-copy span { color:var(--luna-muted); font-size:.9rem; }
.luna-avatar-button { border-radius:999px; white-space:nowrap; }
.luna-avatar-field .invalid-feedback,.luna-avatar-field #avatar-message { grid-column:1/-1; }
@media (max-width:767.98px) {
  #account-account.luna-account-shell,#account-edit,#account-register { padding-left:16px; padding-right:16px; }
  .luna-profile-hero { grid-template-columns:92px 1fr; gap:16px; padding:24px 20px; border-radius:24px; }
  .luna-profile-avatar { width:88px; height:88px; }
  .luna-profile-actions { grid-column:1/-1; width:100%; align-items:stretch; }
  .luna-profile-actions small { max-width:none; }
  .luna-account-grid { grid-template-columns:1fr; gap:12px; }
  .luna-account-card { min-height:86px; padding:17px; border-radius:19px; }
  .luna-avatar-field { grid-template-columns:96px 1fr; padding:18px; }
  .luna-avatar-field .luna-avatar-copy { grid-column:1/-1; }
  .luna-avatar-field .luna-avatar-preview { width:90px; height:90px; }
  .luna-avatar-field .luna-avatar-button { white-space:normal; }
}
@media (max-width:380px) {
  .luna-profile-hero { grid-template-columns:76px 1fr; padding:20px 16px; }
  .luna-profile-avatar { width:72px; height:72px; }
  .luna-profile-identity h1 { font-size:1.55rem; }
  .luna-account-card { grid-template-columns:44px 1fr auto; gap:11px; }
}
