/* Personal dashboard: compact groups, visible session control, readable Vietnamese type. */
.web-page.genar-account-page { display:block; width:100%; max-width:1240px; box-sizing:border-box; padding:40px 32px 64px; font-family:var(--sans); }
.account-welcome { background:#111318; color:#f6f3ee; padding:30px 36px 36px; }
.account-welcome-top { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.account-logout { display:inline-flex; align-items:center; gap:14px; min-height:44px; border:1px solid #777; color:inherit; padding:8px 16px; white-space:nowrap; flex:none; }
.account-logout:hover { background:#303238; }
.account-identity { display:flex; gap:24px; align-items:center; margin-top:26px; }
.account-avatar { flex:none; width:76px; height:76px; display:grid; place-items:center; border:1px solid #967d5e; color:#d6b88e; font:32px var(--serif); }
.account-identity > div { min-width:0; }
.account-identity h1 { font:400 clamp(32px,4vw,58px)/1.12 var(--serif); margin:12px 0; overflow-wrap:anywhere; }
.account-identity p { color:#ccc8c0; margin:0; overflow-wrap:anywhere; }
.account-balances { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 0 28px; background:#eae1d4; border:1px solid #d2c4b2; }
.account-balances > button { display:flex; flex-direction:column; align-items:stretch; text-align:left; gap:18px; padding:26px; border-right:1px solid #d2c4b2; min-width:0; }
.account-balances > button:last-child { border-right:0; }
.account-balances strong { font:400 36px/1.1 var(--serif); overflow-wrap:anywhere; }
.account-balances strong small { font:12px var(--sans); margin-left:12px; }
.account-balances .account-plan { font-size:26px; }
.account-balances button > span:last-child { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:auto; font-size:12px; }
.account-balances button:hover { background:#dfd2bf; }
.account-content { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.account-panel { background:#f8f6f2; border:1px solid #d8d3ca; padding:28px; display:flex; flex-direction:column; min-width:0; }
.account-section-title { display:flex; justify-content:space-between; gap:12px; color:#816746; }
.genar-account-page h2 { font:400 30px/1.15 var(--serif); margin:20px 0 12px; }
.account-panel > p { font-size:14px; line-height:1.7; color:#5f605f; margin:0 0 20px; max-width:48ch; }
.account-visit-actions { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:20px; }
.account-panel-links { margin-top:auto; }
.account-link { width:100%; display:flex; align-items:center; text-align:left; gap:14px; padding:17px 0; min-height:72px; border-top:1px solid #d8d3ca; }
.account-link:hover strong { text-decoration:underline; text-underline-offset:4px; }
.account-link-icon { flex:none; color:#816746; }
.account-link > span:nth-child(2) { flex:1; min-width:0; }
.account-link strong { display:block; font-size:14px; font-weight:600; }
.account-link small { display:block; margin-top:5px; font-size:12px; line-height:1.5; color:#656663; }
.account-link > svg:last-child { flex:none; width:16px; }
.account-settings { display:grid; grid-template-columns:1fr 2fr; align-items:start; gap:28px; padding:28px; margin-top:24px; background:#e9e7e2; border:1px solid #d8d3ca; }
.account-settings > div:last-child { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.account-settings .account-link { border:0; padding:0; }
@media(max-width:760px) { .web-page.genar-account-page { padding:24px 18px 40px; } .account-welcome { padding:22px; } .account-welcome-top { align-items:flex-start; } .account-welcome-top .micro { max-width:145px; line-height:1.6; } .account-identity { gap:16px; } .account-avatar { width:52px; height:52px; font-size:24px; } .account-balances { grid-template-columns:1fr; } .account-balances > button { padding:20px 22px; border-right:0; border-bottom:1px solid #d2c4b2; gap:12px; } .account-balances > button:last-child { border-bottom:0; } .account-content,.account-settings,.account-settings > div:last-child { grid-template-columns:1fr; } .account-panel,.account-settings { padding:22px; } .account-settings { gap:12px; } }

.account-navigation { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 28px; padding:0 0 16px; border-bottom:1px solid #d8d3ca; }
.account-navigation a { display:inline-flex; align-items:center; min-height:44px; padding:10px 14px; font:12px/1.5 var(--sans); text-decoration:none; border:1px solid #cfc4b5; color:#111318; background:#f8f6f2; }
.account-navigation a:hover, .account-navigation a[aria-current="page"] { color:#fff; background:#111318; border-color:#111318; }
.account-rank { display:inline-flex; align-items:center; flex-wrap:wrap; gap:12px; padding:0; min-height:32px; color:inherit; text-align:left; }
.account-rank:hover { text-decoration:underline; }
.account-memberships { margin:32px 0; }
.account-memberships > .account-section-title { align-items:center; margin-bottom:22px; flex-wrap:wrap; }
.account-memberships > .account-section-title a { display:inline-flex; gap:12px; align-items:center; min-height:44px; color:inherit; font-size:12px; }
.account-atelier-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.account-atelier-card { display:flex; flex-direction:column; min-width:0; padding:26px 22px; border:1px solid #d0c4b4; background:#f8f6f2; color:#111318; }
.account-atelier-card > .flex { flex-wrap:wrap; gap:10px; min-height:32px; }
.account-atelier-card h3 { margin:24px 0 18px; min-height:2.3em; font:400 clamp(26px,2.5vw,36px)/1.15 var(--serif); }
.account-atelier-card .account-atelier-price { margin:0 0 12px; font:400 26px/1.3 var(--serif); }
.account-atelier-card .check-list { margin:18px 0 24px; font-size:13px; line-height:1.7; }
.account-atelier-card .check-list li { overflow-wrap:anywhere; }
.account-atelier-actions { margin-top:auto; padding-top:16px; }
.account-atelier-actions .btn { min-height:52px; padding-inline:14px; gap:10px; white-space:normal; text-align:center; }
.account-atelier-detail { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; padding-top:12px; font-size:12px; color:inherit; text-underline-offset:4px; }
.account-atelier-note { margin:28px 0 0; max-width:950px; color:#656663; font:13px/1.8 var(--sans); }
.genar-atelier-card-actions { margin-top:auto; padding-top:20px; }
.genar-public-site .genar-atelier-card-actions .btn { width:100%; min-height:52px; padding:16px 14px; font-size:11px; gap:12px; white-space:normal; }
.genar-atelier-card-actions .genar-text-link { padding-top:18px; }
@media(max-width:1100px) { .account-atelier-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) {
  .account-atelier-grid, .genar-atelier-grid { grid-template-columns:1fr; }
  .account-atelier-card h3 { min-height:0; }
  .account-navigation a { padding-inline:12px; }
  .account-atelier-card { padding:24px; }
}