.account-page { background: var(--paper); }
.nav-account.is-current { border-color: var(--sun); }
.account-shell { min-height: 720px; background: linear-gradient(135deg,#fff8e8 0 55%,#f3eee1 55%); }
.account-layout { display:grid; grid-template-columns:minmax(0,.85fr) minmax(420px,.7fr); gap:clamp(3rem,7vw,7rem); align-items:start; }
.account-intro { position:sticky; top:150px; padding-top:1rem; }
.account-intro h1 { margin:0; font-family:var(--display); font-size:clamp(3.6rem,7vw,7rem); line-height:.84; letter-spacing:-.065em; text-transform:uppercase; }
.account-intro h1 em { color:var(--coral); font-family:var(--serif); font-weight:400; text-transform:none; }
.account-intro > p:not(.eyebrow) { max-width:620px; margin-top:1.5rem; color:rgba(7,63,66,.68); font-size:1.05rem; line-height:1.75; }
.account-powered { margin-top:2rem; display:inline-flex; align-items:center; gap:.65rem; color:rgba(7,63,66,.5); font-size:.74rem; font-weight:800; }
.account-powered svg { width:34px; height:auto; }
.account-card { border:2px solid var(--ink); background:#fffdf8; box-shadow:16px 16px 0 var(--sun); }
.account-tabs { display:grid; grid-template-columns:1fr 1fr; border-bottom:2px solid var(--ink); }
.account-tabs button { padding:1rem; border:0; border-right:1px solid var(--ink); background:#fffdf8; color:rgba(7,63,66,.55); cursor:pointer; font-weight:900; }
.account-tabs button:last-child { border-right:0; }
.account-tabs button.is-active { background:var(--ink); color:#fff; }
.account-form { padding:clamp(1.5rem,3vw,2.4rem); }
.account-form[hidden] { display:none; }
.account-form h2,.account-confirm h2,.account-dashboard h2 { margin:0; font-family:var(--serif); font-size:clamp(2rem,4vw,3.3rem); font-weight:400; line-height:1; }
.account-form > p:not(.account-message),.account-confirm > p,.account-dashboard > p { margin:.8rem 0 1.5rem; color:rgba(7,63,66,.62); line-height:1.6; }
.account-form label { display:block; margin-top:1rem; }
.account-form label > span:first-child { display:block; margin-bottom:.45rem; font-size:.74rem; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.account-form input[type="email"],.account-form input[type="text"],.account-form input[type="password"] { width:100%; min-height:48px; padding:.8rem .9rem; border:1px solid rgba(7,63,66,.22); background:#fff; color:var(--ink); font:inherit; outline:none; }
.account-form input:focus { border-color:var(--ink); box-shadow:0 0 0 3px rgba(7,63,66,.08); }
.account-password { display:flex!important; position:relative; margin:0!important; }
.account-password input { padding-right:3rem!important; }
.account-password button { position:absolute; right:.35rem; top:50%; width:38px; height:38px; transform:translateY(-50%); border:0; background:transparent; cursor:pointer; }
.account-name-row { display:grid; grid-template-columns:1fr 1fr; gap:.8rem; }
.account-password-rules { margin-top:.8rem; display:grid; gap:.35rem; color:rgba(7,63,66,.52); font-size:.72rem; }
.account-password-rules span.is-valid { color:#1a7b50; }
.account-check { display:flex!important; gap:.65rem; align-items:flex-start; }
.account-check input { margin-top:.25rem; }
.account-check span { margin:0!important; font-size:.76rem!important; font-weight:600!important; letter-spacing:0!important; text-transform:none!important; }
.account-message { margin:.9rem 0 0; padding:.8rem; border-left:4px solid var(--coral); background:rgba(232,111,75,.09); color:var(--coral-deep); font-size:.8rem; }
.account-message.is-info { border-color:#71a7c8; background:rgba(113,167,200,.12); color:var(--ink); }
.account-submit { width:100%; margin-top:1.2rem; }
.account-confirm { padding:clamp(2rem,4vw,3rem); text-align:center; }
.account-confirm__icon { width:58px; height:58px; margin:0 auto 1rem; display:grid; place-items:center; border-radius:50%; background:#dff4e7; color:#1a7b50; font-size:1.6rem; font-weight:900; }
.account-dashboard { padding:clamp(1.5rem,3vw,2.5rem); }
.account-dashboard__top { margin-bottom:2rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-bottom:1rem; border-bottom:1px solid rgba(7,63,66,.12); }
.account-dashboard__top span { display:block; color:rgba(7,63,66,.5); font-size:.66rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.account-dashboard__top strong { display:block; margin-top:.2rem; word-break:break-word; }
.account-dashboard__top button { border:0; background:transparent; color:var(--coral-deep); cursor:pointer; font-weight:900; }
.account-stats { margin-top:1.7rem; display:grid; grid-template-columns:1fr 1fr; border:1px solid rgba(7,63,66,.15); }
.account-stats article { min-height:120px; padding:1rem; display:flex; flex-direction:column; justify-content:flex-end; border-right:1px solid rgba(7,63,66,.15); }
.account-stats article:last-child { border-right:0; }
.account-stats strong { font-family:var(--display); font-size:2.2rem; }
.account-stats span { margin-top:.25rem; color:rgba(7,63,66,.55); font-size:.72rem; }
.account-actions { margin-top:1rem; display:grid; }
.account-action { min-height:64px; display:flex; align-items:center; justify-content:space-between; padding:.9rem 1rem; border:1px solid rgba(7,63,66,.15); border-top:0; background:#fff; transition:background .2s ease; }
.account-action:first-child { border-top:1px solid rgba(7,63,66,.15); }
.account-action:hover { background:var(--sun); }
@media(max-width:900px){.account-layout{grid-template-columns:1fr}.account-intro{position:static}.account-shell{background:var(--paper)}}
@media(max-width:560px){.account-intro h1{font-size:clamp(3.2rem,15vw,4.7rem)}.account-name-row,.account-stats{grid-template-columns:1fr}.account-stats article{border-right:0;border-bottom:1px solid rgba(7,63,66,.15)}.account-stats article:last-child{border-bottom:0}.account-card{box-shadow:8px 8px 0 var(--sun)}}

.account-login-options { margin-top:.8rem; display:grid; grid-template-columns:1fr auto; gap:.65rem; align-items:center; }
.account-login-options button { min-height:42px; border:1px solid rgba(7,63,66,.18); background:#fff; color:var(--ink); cursor:pointer; font:inherit; font-size:.78rem; font-weight:900; }
.account-login-options button:first-child { display:flex; align-items:center; justify-content:center; gap:.55rem; }
.account-login-options button:last-child { border:0; background:transparent; color:rgba(7,63,66,.65); text-decoration:underline; text-underline-offset:3px; }
.account-login-options button:disabled { opacity:.55; cursor:wait; }
.account-login-hint { margin:.8rem 0 0!important; padding:.75rem .85rem; border-left:3px solid #71a7c8; background:rgba(113,167,200,.1); color:rgba(7,63,66,.67)!important; font-size:.75rem!important; line-height:1.55!important; }
.account-form--utility { min-height:420px; }
.account-form__back { margin:0 0 1.2rem; padding:0; border:0; background:transparent; color:rgba(7,63,66,.58); cursor:pointer; font-weight:900; }
@media(max-width:560px){.account-login-options{grid-template-columns:1fr}.account-login-options button:last-child{min-height:36px}}

.account-message { position:relative; display:grid; gap:.22rem; margin:.95rem 0 0; padding:.9rem 1rem .9rem 3rem; border:1px solid rgba(232,111,75,.22); border-left:5px solid var(--coral); background:#fff0eb; color:var(--coral-deep); font-size:.8rem; line-height:1.5; }
.account-message::before { content:"!"; position:absolute; left:1rem; top:.92rem; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:var(--coral); color:#fff; font-size:.75rem; font-weight:900; }
.account-message strong { display:block; font-size:.82rem; color:var(--coral-deep); }
.account-message span { display:block; color:rgba(137,46,30,.82); }
.account-message.is-info { border-color:rgba(113,167,200,.28); border-left-color:#71a7c8; background:#eef8fa; color:var(--ink); }
.account-message.is-info::before { content:"✓"; background:#71a7c8; }
.account-message.is-info strong { color:var(--ink); }
.account-message.is-info span { color:rgba(7,63,66,.7); }
.account-message[data-kind="rate"]::before { content:"⏱"; }
.account-message[data-kind="expired"]::before { content:"↻"; }
.account-message[data-kind="service"]::before { content:"…"; }
