/* Profile-specific art direction. Shared account behaviors remain unchanged. */
body.app-mode .profile-page { max-width:1120px; padding:40px 24px 64px; --profile-radius:24px; }
.profile-page .account-page-heading { align-items:center; margin-bottom:28px; }
.profile-page .account-page-heading h1 { font-size:clamp(2rem,4vw,3.4rem); letter-spacing:-.055em; line-height:1.12; font-weight:550; }
.profile-page .account-page-heading h1 strong { color:var(--text); font-weight:850; }
.profile-page .account-kicker { letter-spacing:.16em; font-size:.65rem; font-weight:800; color:var(--brand,#087a3e); }
.profile-page .account-page-heading p { margin-top:12px; font-size:.95rem; line-height:1.6; }
.profile-page .account-security { border-radius:100px; padding:10px 16px; background:var(--surface); border:1px solid var(--border); }
body.app-mode .profile-page .profile-head { position:relative; overflow:hidden; isolation:isolate; display:flex; gap:24px; padding:36px; border:0; border-radius:28px; color:#fff; background:radial-gradient(ellipse at 100% 0%,#087a3e 0%,transparent 60%),linear-gradient(120deg,#092f26,#087a3e); box-shadow:0 18px 45px #073a241f; }
.profile-page .profile-head::after { content:''; position:absolute; width:280px; height:280px; right:-75px; top:-130px; border:45px solid #d6ff841a; border-radius:50%; pointer-events:none; z-index:-1; }
body.app-mode .profile-page .profile-avatar { flex:0 0 88px; width:88px; height:88px; display:grid; place-items:center; border-radius:26px; background:#dbf9a5; color:#172116; font-size:2rem; font-weight:850; letter-spacing:-.06em; border:5px solid #ffffff24; box-shadow:0 8px 24px #0002; transform:rotate(-5deg); }
.profile-page .profile-user-copy h2 { color:#fff; font-size:1.5rem; font-weight:750; letter-spacing:-.035em; }
.profile-page .profile-contact { color:#d3e6dd; font-size:.87rem; overflow-wrap:anywhere; }
.profile-page .profile-badges { margin-top:14px; flex-wrap:wrap; gap:8px; }
.profile-page .profile-badges .badge { background:#ffffff12; color:#e7f7dc; border:1px solid #ffffff24; border-radius:100px; padding:7px 12px; font-size:.7rem; }
body.app-mode .profile-page .profile-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:20px 0 36px; }
body.app-mode .profile-page .profile-stats .stat-box { display:flex; gap:18px; text-align:left; align-items:center; background:var(--surface); border:1px solid var(--border); border-radius:22px; padding:24px; box-shadow:0 4px 16px #142c1705; }
.profile-page .stat-box > i { width:48px; height:48px; border-radius:16px; background:#ebf7ef; color:#172116; }
.profile-page .stat-box:nth-child(2)>i { background:#fff3d7; color:#996112; }
.profile-page .stat-box:nth-child(3)>i { background:#f3edff; color:#7351b7; }
.profile-page .stat-box b { font-size:2rem; line-height:1.1; letter-spacing:-.055em; font-variant-numeric:tabular-nums; }
.profile-page .stat-box span { font-size:.61rem; letter-spacing:.1em; line-height:1.6; }
.profile-page .section-head h2 { font-size:1.4rem; letter-spacing:-.035em; }
.profile-page .section-head .sub { font-size:.85rem; margin-top:6px; }
.profile-page .profile-menu-card { padding:0; border:0; background:transparent; box-shadow:none; }
.profile-page .profile-menu-card .plist { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.profile-page .profile-menu-card .plist-item { position:relative; display:flex; align-items:flex-start; flex-wrap:wrap; gap:14px; min-height:170px; padding:22px; border-radius:22px; background:var(--surface); box-shadow:none; transition:transform 220ms ease,border-color 220ms ease,box-shadow 220ms ease; animation:profile-arrive 500ms both; animation-delay:var(--entry-delay,0ms); }
.profile-page .profile-menu-card .plist-emoji { width:46px; height:46px; border-radius:15px; box-shadow:0 5px 12px color-mix(in srgb,var(--profile-icon) 10%,transparent); }
.profile-page .profile-menu-card .plist-emoji::before { display:none; }
.profile-page .profile-menu-card .plist-emoji .fc-icon { width:23px; height:23px; stroke-width:1.7; transition:transform 250ms ease; }
.profile-page .profile-menu-card .pl-label { flex-basis:100%; font-size:.97rem; font-weight:750; letter-spacing:-.025em; }
.profile-page .profile-menu-card .pl-sub { font-size:.77rem; font-weight:400; line-height:1.5; margin-top:5px; letter-spacing:0; }
.profile-page .profile-menu-card .chev { position:absolute; right:18px; top:23px; border-radius:50%; width:30px; height:30px; color:var(--text-2); background:transparent; }
.profile-page a:focus-visible,.profile-page button:focus-visible { outline:3px solid #69b990; outline-offset:4px; }
.profile-page .profile-detail-head { padding:28px; border-radius:24px; background:var(--surface); border:1px solid var(--border); gap:20px; }
.profile-page .profile-detail-head h1 { font-size:clamp(1.7rem,3vw,2.5rem); letter-spacing:-.045em; }
.profile-page .profile-detail-icon { border-radius:20px; background:#e7f4ec; color:#172116; }
.profile-page .account-subnav { gap:8px; padding:18px 0; }
.profile-page .account-subnav a { border-radius:100px; font-size:.78rem; padding:10px 16px; }
.profile-page .profile-detail-card,.profile-page .profile-settings-card,.profile-page .profile-option { border-radius:24px; box-shadow:0 8px 32px #102d1706; }
.profile-page .profile-form { gap:22px; padding:30px; }
.profile-page .profile-form label { gap:9px; font-size:.84rem; font-weight:650; }
.profile-page .profile-form .input { border-radius:13px; min-height:48px; transition:border-color 180ms,box-shadow 180ms; }
.profile-page .profile-form .input:focus { box-shadow:0 0 0 4px #18845b18; }
.profile-page .detail-info-banner,.profile-page .account-completion { border-radius:18px; }
.profile-page .profile-toggle { padding:22px; }
.profile-page .btn { border-radius:13px; }
.profile-signoff { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:28px; margin-top:28px; border-top:1px solid var(--border); }
.profile-signoff > span { font-size:.8rem; color:var(--text-2); }
.profile-signoff #logoutBtn { background:transparent; color:var(--text-2); border:1px solid var(--border); padding:12px 20px; }
@keyframes profile-arrive { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:translateY(0); } }
@media (hover:hover) { .profile-page .profile-menu-card .plist-item:hover { transform:translateY(-4px); border-color:color-mix(in srgb,var(--profile-icon) 45%,var(--border)); box-shadow:0 12px 30px #163e1610; } .profile-page .plist-item:hover .plist-emoji .fc-icon { transform:rotate(-8deg) scale(1.1); } }
html[data-theme="dark"] .profile-page .stat-box>i,html[data-theme="dark"] .profile-page .profile-detail-icon { background:#ffffff0c; color:#aad9bd; }
@media(max-width:850px) { .profile-page .profile-menu-card .plist { grid-template-columns:repeat(2,minmax(0,1fr)); } body.app-mode .profile-page .profile-stats .stat-box { padding:18px; gap:12px; } }
@media(max-width:540px) { body.app-mode .profile-page { padding:24px 16px 40px; } .profile-page .account-page-heading { gap:16px; } .profile-page .account-security { align-self:flex-start; } body.app-mode .profile-page .profile-head { padding:24px; gap:18px; flex-direction:column; } body.app-mode .profile-page .profile-avatar { flex-basis:72px; width:72px; height:72px; font-size:1.7rem; } body.app-mode .profile-page .profile-stats { gap:8px; } body.app-mode .profile-page .profile-stats .stat-box { flex-direction:column; align-items:flex-start; padding:14px; } .profile-page .stat-box b { font-size:1.55rem; } .profile-page .stat-box span { font-size:.52rem; } .profile-page .profile-menu-card .plist { gap:10px; } .profile-page .profile-menu-card .plist-item { padding:16px; min-height:172px; } .profile-page .profile-menu-card .pl-label { font-size:.86rem; } .profile-page .profile-menu-card .chev { right:8px; width:24px; } .profile-page .profile-form { padding:20px; } .profile-page .profile-detail-head { padding:20px; } .profile-signoff { align-items:flex-start; flex-direction:column; } }
@media(prefers-reduced-motion:reduce) { .profile-page *, .profile-page *::before,.profile-page *::after { animation:none!important; transition:none!important; } }