/* Account: a financial working sheet, with a compact access form. */
:root { --account-field:#fff; --account-edge:#c9cac5; --account-error:#a04043; }
.account-page { margin:0; min-width:280px; color:var(--brand-ink,#202a30); background:#fff; font:15px/1.6 var(--font-body,"Golos Text",sans-serif); }
.account-page *, .account-page *::before,.account-page *::after { box-sizing:border-box; }
.account-page .shell { width:min(1280px,calc(100% - 96px)); margin-inline:auto; }
.account-page .nav { display:flex; justify-content:space-between; align-items:center; min-height:116px; gap:24px; border-bottom:1px solid #d9dbd7; }
.account-page .account-brand { display:flex; flex-direction:column; align-items:flex-start; gap:7px; padding:0; color:var(--brand-ink,#202a30); text-decoration:none; }
.account-brand>span { font:650 12px/1.2 var(--font-body,sans-serif); letter-spacing:.18em; }
.account-brand>strong { font:800 42px/.9 var(--font-display,"Manrope",sans-serif); letter-spacing:-.075em; }
.account-brand>strong span { color:#7c343a; }
.account-page .account-back { display:flex; align-items:center; gap:15px; min-height:44px; color:#586268; font-size:13px; text-decoration:none; }
.account-back span { font-size:22px; color:#7c343a; }
.account-back:hover { color:#7c343a; }
.account-page a:focus-visible,.account-page button:focus-visible,.account-page input:focus-visible { outline:2px solid #7c343a; outline-offset:4px; }
.account-layout { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(350px,.8fr); gap:clamp(50px,7vw,120px); align-items:start; padding-block:60px 84px; }
.account-intro { min-width:0; padding:0; }
.account-edition { margin:0 0 22px; color:#6b7478; font-size:12px; line-height:1.5; }
.account-pitch { margin:0; font:600 clamp(34px,3.5vw,50px)/1.16 var(--font-display,"Manrope",sans-serif); letter-spacing:-.055em; }
.account-pitch em { color:#7c343a; font-style:normal; }
.account-ledger { margin:35px 0 0; padding:22px 24px 20px; border:1px solid #ddded7; border-top:3px solid #202a30; background:#f6f5f1; }
.account-ledger figcaption { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding-bottom:18px; border-bottom:1px solid #d6d7ce; }
.account-ledger figcaption span:first-child { color:#303b40; font-size:13px; font-weight:600; }
.account-ledger figcaption span:last-child { color:#74796e; font-size:12px; }
.account-product { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.06fr); gap:18px; align-items:center; padding-top:12px; }
.account-product-art { min-width:0; position:relative; }
.account-product-art svg { display:block; width:100%; height:auto; max-height:260px; }
.account-art-label { display:block; text-align:center; color:#70766e; font-size:12px; line-height:1.5; }
.account-breakdown { margin:0; }
.account-breakdown>div { padding:17px 0; border-bottom:1px solid #d6d7ce; }
.account-breakdown dt { color:#6d7472; font-size:12px; }
.account-breakdown dd { margin:5px 0 0; font:600 clamp(24px,2.5vw,34px)/1.1 var(--font-display,sans-serif); letter-spacing:-.045em; font-variant-numeric:tabular-nums; }
.account-breakdown dd span { font-size:.7em; font-weight:500; }
.account-breakdown>div.account-breakdown-result { border:0; }
.account-breakdown-result dd { color:#7c343a; font-size:clamp(36px,3.7vw,52px); }
.account-ledger-note { margin:20px 0 0; padding-top:17px; border-top:1px solid #d6d7ce; color:#646c66; font-size:12px; line-height:1.6; }
.account-private { margin:18px 0 0; color:#65706b; font-size:12px; line-height:1.65; }
.account-sources { display:flex; gap:16px; flex-wrap:wrap; margin:15px 0 0; padding:0; list-style:none; color:#727a77; font-size:12px; }
.account-sources li+li { padding-left:16px; border-left:1px solid #d6d8d2; }
.account-card { min-width:0; padding-top:7px; color:var(--brand-ink,#202a30); }
.account-card-label { margin:0 0 27px; padding-bottom:16px; border-bottom:1px solid #7c343a; color:#7c343a; font-size:12px; }
.account-card h1 { margin:0; font:600 clamp(28px,2.8vw,38px)/1.15 var(--font-display,sans-serif); letter-spacing:-.05em; }
.account-description { margin:13px 0 0; color:#657177; font-size:13px; line-height:1.7; max-width:350px; }
.account-mode { display:grid; grid-template-columns:1fr 1fr; gap:0; margin-top:28px; border-bottom:1px solid #d5d9d5; background:transparent; }
.account-mode button { min-height:43px; border:0; border-bottom:2px solid transparent; padding:9px 10px; color:#6c7678; background:transparent; font:500 13px/1.4 var(--font-body,sans-serif); cursor:pointer; }
.account-mode button[aria-pressed="true"] { color:#7c343a; border-bottom-color:#7c343a; font-weight:600; }
.account-mode button:hover:not(:disabled) { color:#7c343a; background:#faf7f5; }
.account-mode button:disabled { cursor:not-allowed; opacity:.55; }
.account-status { min-height:2.8em; margin:14px 0 18px; color:#6b7477; font-size:12px; line-height:1.6; }
.account-field { display:grid; gap:7px; margin:0 0 13px; }
.account-field label { color:#37444a; font-size:12px; font-weight:550; }
.account-field input { min-height:49px; min-width:0; width:100%; padding:12px 13px; border:1px solid var(--account-edge); border-radius:3px; background:#fff; color:var(--brand-ink,#202a30); font:400 14px/1.4 var(--font-body,sans-serif); }
.account-field input:hover:not(:disabled) { border-color:#9faaa7; }
.account-field input:focus-visible { outline:2px solid #7c343a; outline-offset:3px; }
.account-field input[aria-invalid="true"] { border-color:var(--account-error); }
.account-field input:disabled { background:#f1f2ee; cursor:not-allowed; }
.account-password { display:flex; gap:7px; }
.password-toggle { flex:0 0 77px; min-height:49px; padding:0 8px; border:1px solid var(--account-edge); border-radius:3px; color:#53626a; background:#fff; font:500 12px/1.4 var(--font-body,sans-serif); cursor:pointer; }
.password-toggle:hover:not(:disabled) { color:#7c343a; border-color:#b49191; background:#faf7f5; }
.password-toggle:disabled { opacity:.55; cursor:not-allowed; }
.field-help,.field-error,.account-feedback { font-size:12px; line-height:1.55; }
.field-help { color:#687477; }
.field-error { min-height:1.55em; color:var(--account-error); }
.account-feedback { min-height:3.1em; margin:4px 0 8px; color:#687477; overflow-wrap:anywhere; }
.account-feedback[data-tone="error"] { color:var(--account-error); }
.account-feedback[data-tone="success"] { color:#526859; }
.account-page .account-submit { display:flex; justify-content:space-between; align-items:center; width:100%; min-height:51px; padding:13px 18px; border:1px solid #202a30; border-radius:3px; background:#202a30; color:#fff; font:600 13px/1.4 var(--font-body,sans-serif); cursor:pointer; }
.account-page .account-submit::after { content:"→"; font-size:19px; font-weight:400; }
.account-page .account-submit:hover:not(:disabled) { background:#7c343a; border-color:#7c343a; }
.account-page .account-submit:active:not(:disabled) { translate:0 1px; }
.account-page .account-submit:disabled { color:#6f7771; background:#e5e8e0; border-color:#e5e8e0; cursor:not-allowed; }
.account-links { display:flex; gap:12px; flex-wrap:wrap; margin-top:16px; }
.text-button { min-height:40px; padding:7px 0; border:0; background:transparent; color:#6b5556; font:500 12px/1.5 var(--font-body,sans-serif); text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
.text-button:hover { color:#7c343a; }
.account-terms { margin:6px 0 14px; color:#687477; font-size:12px; line-height:1.7; }
.account-terms label { display:flex; align-items:flex-start; gap:10px; }
.account-terms input { flex:none; width:17px; height:17px; margin:2px 0 0; accent-color:#7c343a; }
.account-terms a { color:#7c343a; }
.account-page .account-footer { display:flex; justify-content:space-between; gap:18px; padding-block:24px; border-top:1px solid #d9dbd7; color:#727b7d; font-size:12px; }
[hidden] { display:none !important; }
@media(max-width:1050px) { .account-page .shell { width:calc(100% - 56px); } .account-layout { gap:48px; grid-template-columns:minmax(0,1fr) minmax(320px,.9fr); } .account-pitch { font-size:38px; } .account-ledger { padding-inline:18px; } .account-product { gap:10px; } }
@media(max-width:740px) { .account-page .shell { width:calc(100% - 36px); } .account-page .nav { min-height:86px; gap:16px; } .account-brand>span { font-size:12px; letter-spacing:.12em; } .account-brand>strong { font-size:34px; } .account-page .account-brand { gap:5px; } .account-page .account-back { font-size:12px; gap:9px; } .account-layout { display:flex; flex-direction:column; gap:50px; padding-block:31px 44px; } .account-card { order:-1; width:100%; max-width:500px; margin-inline:auto; padding-top:0; } .account-card-label { margin-bottom:22px; } .account-card h1 { font-size:32px; } .account-mode { margin-top:23px; } .account-intro { width:100%; } .account-edition { margin-bottom:12px; } .account-pitch { font-size:32px; } .account-ledger { margin-top:25px; } .account-product { grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:12px; } .account-product-art svg { max-height:210px; } .account-breakdown dd { font-size:27px; } .account-breakdown-result dd { font-size:39px; } .account-ledger-note { font-size:12px; } .account-page .account-footer { flex-direction:column; gap:4px; padding-block:20px; } }
@media(max-width:360px) { .account-brand>span { max-width:60px; font-size:12px; } .account-brand>strong { font-size:30px; } .account-page .account-back { max-width:105px; line-height:1.4; } .account-ledger { padding-inline:13px; } .account-ledger figcaption span:last-child { font-size:12px; } .account-art-label { font-size:12px; } }
@media(prefers-reduced-motion:reduce) { .account-page *, .account-page *::before,.account-page *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }
@media(forced-colors:active) { .account-mode button[aria-pressed="true"] { border-color:ButtonText; } .account-ledger { border-color:CanvasText; } }
