:root { --account-ink:#20212a; --account-line:#e5e1ec; --account-soft:#f7f3fa; --account-coral:#f17f70; }
.account-page { background:radial-gradient(circle at 16% 12%,rgba(235,207,232,.72),transparent 31rem),linear-gradient(145deg,#fbfafc 0%,#f5f3f7 52%,#faf8f5 100%); color:var(--account-ink); min-height:100vh; }
.account-dashboard-page { background:radial-gradient(circle at 84% 4%,rgba(232,224,242,.42),transparent 30rem),linear-gradient(145deg,#f8f7f4 0%,#f4f3f0 55%,#f8f7f5 100%); }
.account-auth { min-height:calc(100vh - 5rem); display:grid; place-items:center; padding:clamp(2.5rem,7vw,6rem) 1.25rem; }
.account-auth-card { width:min(100%,36rem); background:rgba(255,255,255,.94); border:1px solid rgba(43,39,50,.1); border-radius:2rem; box-shadow:0 2rem 5rem rgba(54,39,66,.13); padding:clamp(1.6rem,5vw,3rem); }
.account-auth-card--register { width:min(100%,44rem); }
.account-auth-intro { display:grid; justify-items:start; gap:1.15rem; margin-bottom:1.2rem; }
.account-auth-brand { display:flex; align-items:center; gap:.65rem; color:inherit; text-decoration:none; font-size:1.2rem; line-height:1; }
.account-auth-brand .brand-mark { display:grid; place-items:center; width:2.35rem; height:2.35rem; border-radius:.8rem; background:var(--account-ink); color:#fff; font-weight:800; }
.account-auth .eyebrow { display:inline-flex; align-items:center; min-height:1.8rem; padding:.36rem .65rem; border:1px solid #eadfea; border-radius:999px; background:#f8f2f8; color:#805374; font-size:.68rem; line-height:1.15; letter-spacing:.1em; text-transform:uppercase; font-weight:800; }
.account-auth h1 { margin:.55rem 0 .7rem; font-size:clamp(2rem,6vw,3.25rem); line-height:1.02; letter-spacing:-.05em; }
.account-auth h1 + p { color:#696672; line-height:1.65; margin:0 0 1.7rem; max-width:38rem; }
.account-form { display:grid; gap:1rem; }
.account-form label:not(.account-check) { display:grid; gap:.45rem; font-weight:750; font-size:.88rem; }
.account-form label small { color:#85818d; font-weight:550; margin-left:.35rem; }
.account-form input[type=email],.account-form input[type=password] { width:100%; min-height:3.35rem; border:1px solid #d8d3df; border-radius:.95rem; background:#fff; color:var(--account-ink); padding:.75rem .95rem; font:inherit; outline:none; }
.account-form input:focus { border-color:#8e5c84; box-shadow:0 0 0 4px rgba(142,92,132,.12); }
.account-password-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.account-check { display:flex; align-items:flex-start; gap:.65rem; color:#65616c; font-size:.87rem; line-height:1.45; }
.account-check input { margin-top:.16rem; accent-color:#8e5c84; }
.account-check a,.account-auth-switch a,.account-auth-back { color:#744968; font-weight:750; }
.account-form .button { width:100%; justify-content:center; min-height:3.4rem; margin-top:.2rem; border:0; }
.account-alert { background:#fff1ef; color:#8b3831; border:1px solid #f1c4bf; border-radius:1rem; padding:.85rem 1rem; margin:0 0 1rem; font-size:.9rem; line-height:1.5; }
.account-alert--success { background:#eff9f1; color:#31693e; border-color:#cce7d2; }
.account-alert ul { margin:0; padding-left:1.15rem; }
.account-auth-switch { text-align:center; border-top:1px solid var(--account-line); margin-top:1.5rem; padding-top:1.35rem; color:#706c77; font-size:.9rem; }
.account-auth-back { display:block; text-align:center; margin-top:1rem; font-size:.86rem; text-decoration:none; }
.account-session-note { display:block; text-align:center; color:#8c8991; margin-top:1.25rem; }
@media (max-width:640px) { .account-password-grid { grid-template-columns:1fr; } .account-auth-card { border-radius:1.45rem; padding:1.35rem; } }
.account-dashboard { padding:clamp(2.5rem,6vw,5.5rem) 0 4rem; }
.account-dashboard-head { display:flex; justify-content:space-between; gap:2rem; align-items:flex-end; margin-bottom:2rem; }
.account-dashboard-head h1 { font-size:clamp(2.3rem,6vw,4.6rem); letter-spacing:-.06em; line-height:.95; margin:.45rem 0 .7rem; }
.account-dashboard-head p { color:#6e6974; max-width:44rem; margin:0; }
.account-dashboard-actions { display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; }
.account-dashboard-actions form button { border:0; background:transparent; color:#6f6874; text-decoration:underline; cursor:pointer; }
.account-allowance { display:flex; align-items:center; gap:1.1rem; background:#292832; color:#fff; padding:1.15rem 1.35rem; border-radius:1.4rem; margin:0 0 1.7rem; box-shadow:0 1rem 2.5rem rgba(40,35,49,.12); }
.account-allowance>span { display:grid; place-items:center; flex:0 0 4rem; height:4rem; border-radius:1.1rem; background:#4a4655; font-weight:850; }
.account-allowance.is-available>span { background:#d9f2df; color:#275d34; }
.account-allowance small { display:block; color:#c7c2ce; font-weight:700; text-transform:uppercase; letter-spacing:.08em; font-size:.67rem; }
.account-allowance strong { display:block; margin:.15rem 0; }
.account-allowance p { color:#bbb6c2; margin:0; font-size:.83rem; }
.account-history-organizer { display:block; }
.account-history-filters { display:flex; align-items:center; gap:.45rem; margin:0 0 1rem; padding:.25rem 0; overflow-x:auto; scrollbar-width:none; }.account-history-filters::-webkit-scrollbar{display:none}.account-history-filters button{display:inline-flex;align-items:center;gap:.42rem;min-height:2.25rem;flex:none;padding:.35rem .75rem;border:1px solid #ded9e2;border-radius:999px;background:rgba(255,255,255,.72);color:#66616b;font:inherit;font-size:.76rem;font-weight:750;cursor:pointer}.account-history-filters button span{display:grid;place-items:center;min-width:1.3rem;height:1.3rem;padding:0 .3rem;border-radius:999px;background:#eeebf0;color:#77717b;font-size:.63rem}.account-history-filters button:hover{border-color:#c9c2cd;background:#fff}.account-history-filters button.is-active{border-color:#332f3a;background:#2b2932;color:#fff}.account-history-filters button.is-active span{background:#4b4653;color:#fff}
.account-history-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.account-history-card { position:relative; display:grid; grid-template-columns:4.4rem minmax(0,1fr) auto; align-items:center; gap:1rem; background:rgba(255,255,255,.93); border:1px solid rgba(47,42,54,.1); border-radius:1.4rem; padding:1.15rem 3.1rem 1.15rem 1.15rem; box-shadow:0 .8rem 2rem rgba(62,48,68,.07); }
.account-history-icon { width:4.2rem; height:5rem; border-radius:.7rem; background:#f5eef6; border:1px solid #e3d9e6; padding:.8rem .55rem; }
.account-history-icon span { display:block; color:#8a557c; font-size:.7rem; font-weight:900; margin-bottom:.65rem; }
.account-history-icon i { display:block; height:2px; background:#cfc3d1; margin:.42rem 0; width:100%; }.account-history-icon i:last-child{width:65%}
.account-history-copy { min-width:0; }.account-history-copy small{color:#8a557c;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.account-history-copy h2{font-size:1rem;margin:.32rem 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.account-history-copy p{font-size:.78rem;color:#817c86;margin:0}
.account-history-actions { display:grid; gap:.35rem; text-align:right; }.account-history-actions a{font-size:.78rem;color:#5f5863;font-weight:750;text-decoration:none}.account-history-actions a.is-primary{color:#834d75}
.account-history-organize { display:flex; grid-column:2/-1; align-items:center; flex-wrap:wrap; gap:.55rem; min-width:0; padding-top:.15rem; }
.account-card-tags { display:flex; flex-wrap:wrap; gap:.35rem; }.account-card-tags:empty{display:none}.account-card-tags>span{display:inline-flex;align-items:center;min-height:1.8rem;padding-left:.62rem;border:1px solid #ded7e1;border-radius:999px;background:#f7f3f8;color:#645260}.account-card-tags b{font-size:.67rem;font-weight:750}.account-card-tags button{display:grid;place-items:center;width:1.65rem;height:1.65rem;border:0;background:transparent;color:#928994;cursor:pointer}.account-card-tags button:hover{color:#3c3841}
.account-tag-form { position:relative; display:inline-flex; align-items:center; gap:.35rem; }.account-tag-form label{display:block}.account-tag-form input[type=text]{width:8.8rem;height:1.9rem;border:1px solid #d8d3dc;border-radius:.6rem;background:#fff;padding:.25rem .55rem;color:#46414a;font:inherit;font-size:.68rem;outline:none}.account-tag-form input[type=text]:focus{border-color:#8e6585;box-shadow:0 0 0 3px rgba(142,101,133,.1)}.account-tag-form>button{height:1.9rem;border:0;border-radius:.6rem;background:#efebf1;color:#5f5360;padding:0 .58rem;font:inherit;font-size:.66rem;font-weight:800;white-space:nowrap;cursor:pointer}.account-tag-form>button:hover{background:#e6dfe8}.account-tag-form>button:disabled{opacity:.55;cursor:wait}.account-tag-form>small{position:absolute;top:calc(100% + .3rem);left:0;z-index:2;width:max-content;max-width:15rem;padding:.35rem .5rem;border-radius:.45rem;background:#34313a;color:#fff;font-size:.62rem}.account-history-no-match{padding:3rem 1rem;text-align:center;color:#77717b;font-size:.9rem}
.account-history-delete { position:absolute; top:.65rem; right:.65rem; }.account-history-delete button{display:grid;place-items:center;width:1.9rem;height:1.9rem;border:0;border-radius:.55rem;background:transparent;color:#99929c;cursor:pointer}.account-history-delete button:hover{background:#fff0ee;color:#9e423b}
.account-history-card.is-unavailable { opacity:.68; }.account-history-warning{font-size:.78rem;color:#8a4a45}
.account-empty { text-align:center; background:rgba(255,255,255,.9); border:1px dashed #d5cbd8; border-radius:1.7rem; padding:4rem 1.5rem; }.account-empty>span{display:grid;place-items:center;width:4.5rem;height:5.5rem;margin:0 auto 1.2rem;background:#f1e9f2;color:#865579;border-radius:.8rem;font-weight:900}.account-empty h2{margin:0 0 .5rem}.account-empty p{color:#746f79;margin:0 auto 1.4rem;max-width:34rem}
.account-deactivation { margin-top:3rem; padding:1.2rem 1.3rem; border:1px solid #dedbe1; border-radius:1.1rem; background:rgba(255,255,255,.7); display:flex; align-items:center; justify-content:space-between; gap:1rem; }.account-deactivation strong{font-size:.9rem}.account-deactivation p{font-size:.8rem;color:#77727c;margin:.25rem 0 0}.account-deactivation button{border:1px solid #cbc7cf;background:#fff;color:#55515b;border-radius:.7rem;padding:.65rem .8rem;font-weight:700;cursor:pointer}.account-deactivation button:hover{border-color:#aaa4b0;background:#f8f7f9}
.account-forgot-link{justify-self:end;margin-top:-8px;color:#6251b5;font-size:.82rem;font-weight:750;text-decoration:none}.account-forgot-link:hover{text-decoration:underline}.account-auth-primary{display:block;width:100%;margin-top:1.4rem;text-align:center}
@media(max-width:900px){.account-history-grid{grid-template-columns:1fr}.account-dashboard-head{align-items:flex-start;flex-direction:column}.account-dashboard-actions{width:100%}}
@media(max-width:580px){.account-history-card{grid-template-columns:3.5rem minmax(0,1fr);}.account-history-icon{width:3.4rem;height:4.2rem}.account-history-actions{grid-column:1/-1;display:flex;text-align:left}.account-history-organize{grid-column:1/-1}.account-tag-form{width:100%}.account-tag-form label{flex:1}.account-tag-form input[type=text]{width:100%}.account-deactivation{align-items:flex-start;flex-direction:column}.account-allowance{align-items:flex-start}.account-allowance>span{flex-basis:3.3rem;height:3.3rem}}
