.auth-wrap{position:relative;padding:clamp(1.25rem,5vw,4rem) 0;background:radial-gradient(50% 50% at 100% 0%,rgba(242,169,59,.16),transparent 70%)}
.auth-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:1.25rem;align-items:stretch}
@media (min-width:900px){.auth-grid{grid-template-columns:1fr 1fr;gap:2rem}}
.auth-side{display:none;padding:2.5rem;border-radius:var(--radius-lg);overflow:hidden}
@media (min-width:900px){.auth-side{display:block}}
.auth-side .auth-ph{border-radius:var(--radius);margin-top:1.5rem;max-height:220px;width:100%}
.benefits{list-style:none;display:grid;gap:.8rem;margin-top:1.25rem}.benefits li{display:flex;gap:.7rem;align-items:center}
.auth-card{padding:clamp(1.25rem,4vw,2.5rem);border-radius:var(--radius-lg)}
.auth-card h1{font-size:clamp(1.8rem,1.3rem + 2vw,2.4rem)}
.auth-alt{text-align:center;margin:1.25rem 0 0;color:var(--muted)}
.google-wrap #g-btn{display:flex;justify-content:center;min-height:44px}
.form-note{font-size:.875rem;color:var(--muted)}
.account-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1.25rem;align-items:start}
@media (min-width:900px){.account-grid{grid-template-columns:250px minmax(0,1fr);gap:2rem}}
.account-nav{display:flex;flex-direction:row;overflow-x:auto;scrollbar-width:none;gap:.25rem;padding:.35rem}
.account-nav::-webkit-scrollbar{display:none}
@media (min-width:900px){.account-nav{flex-direction:column;position:sticky;top:calc(var(--header-h) + 20px);padding:.5rem}}
.account-nav a{white-space:nowrap;padding:.65rem 1rem;border-radius:10px;text-decoration:none;color:var(--text);min-height:44px;display:flex;align-items:center;font-size:.9375rem}
.account-nav a:hover{background:var(--bg-alt)}
.account-nav a.is-active{background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);font-weight:600}
.account-panel{padding:clamp(1.25rem,3vw,2rem);min-width:0}
.account-panel>h2{margin-bottom:1rem}
.stats-mini{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.75rem;margin:1rem 0 1.5rem}
.stats-mini li{padding:1rem;border-radius:var(--radius-sm);background:var(--bg-alt);display:grid}
.stats-mini strong{font-family:var(--font-head);font-size:1.6rem}.stats-mini span{color:var(--muted);font-size:.875rem}
.avatar-row{display:flex;gap:1rem;align-items:center;margin-bottom:1rem}
.my-comments{list-style:none;display:grid;gap:.75rem}.my-comments li{padding:1rem 1.25rem}
.auth-form{max-width:520px}
/* Khối trong tab tài khoản */
.acc-section{padding:1.5rem 0;border-top:1px solid var(--line)}
.acc-section:first-of-type{border-top:0;padding-top:0}
.acc-section h3{margin-bottom:.35rem}
.acc-section>p{color:var(--muted);font-size:.9375rem;max-width:60ch}
.acc-section .auth-form{margin-top:1rem}
.avatar-edit{display:flex;gap:1.25rem;align-items:center;flex-wrap:wrap;margin-bottom:1.25rem}
.avatar-edit .avatar{width:88px;height:88px;border:3px solid var(--surface);box-shadow:var(--shadow-md)}
.avatar-edit form{display:grid;gap:.6rem;flex:1;min-width:220px}
.avatar-actions{display:flex;gap:.5rem;flex-wrap:wrap}
.status-pill{display:inline-flex;align-items:center;gap:.4rem;padding:.2rem .7rem;border-radius:999px;font-size:.8125rem;font-weight:600;background:var(--bg-alt);color:var(--muted)}
.status-pill.is-on{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
.danger-zone{border:1px solid color-mix(in srgb,var(--err) 40%,var(--line));border-radius:var(--radius);padding:1.25rem;background:color-mix(in srgb,var(--err) 4%,var(--surface));margin-top:.5rem}
.danger-zone h3{color:var(--err)}
