/* Account page: sign in / create account, then a small dashboard. */
[hidden]{display:none!important}
.account-page{padding:0 44px 96px}
.account-head{padding:72px 0 36px}
.account-head h2{margin:0;font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:clamp(46px,5.4vw,72px);line-height:1.04;letter-spacing:-.6px;word-spacing:1px;color:#2f362c}
.account-head h2 em{color:#737f4e}
.account-head p{max-width:520px;margin:20px 0 0;font-size:14px;line-height:1.8;color:#6f7562}

.account-card{padding:32px;border:1px solid #dedfcd;border-radius:16px;background:#fffdf7b3;color:#34442f}
.account-dashboard{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.account-dashboard .account-card{display:flex;flex-direction:column;align-items:flex-start}
.account-label{margin:0 0 14px;font-size:10px;letter-spacing:1.4px;color:#7e876d}
.account-dashboard h3{margin:0;font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:30px;line-height:1.15;letter-spacing:-.2px;color:#2f362c;overflow-wrap:anywhere}
.account-dashboard p:not(.account-label){margin:10px 0 0;font-size:13px;line-height:1.7;color:#6f7562;overflow-wrap:anywhere}
.account-link{margin-top:auto;padding-top:18px;font-size:13px;color:#34442f;text-decoration:underline;text-underline-offset:4px}
.account-link:hover{color:#73804f}
.account-signout{margin-top:auto;padding:8px 16px;border:1px solid #a9b093;border-radius:30px;background:transparent;font:inherit;font-size:12px;color:#34442f;cursor:pointer}
.account-dashboard .account-signout{margin-top:18px}
.account-signout:hover{background:#ecebd7}

/* Email verification notice (with the code field) above the dashboard. */
.account-notice{display:flex;align-items:flex-start;gap:20px;margin-bottom:20px;padding:22px 26px;border:1px solid #e1e4c8;border-radius:16px;background:#f6f7ec;color:#34442f}
.account-notice-icon{display:grid;flex:none;place-items:center;width:44px;height:44px;border:1px solid #dedfcd;border-radius:50%;background:#fffdf7}
.account-notice-icon svg{width:20px;height:20px;fill:none;stroke:#5d6b3f;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.account-notice .icon-check,.account-notice.is-success .icon-mail{display:none}
.account-notice.is-success .icon-check{display:block}
.account-notice-body{flex:1;min-width:0}
.account-notice h3{margin:0;font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:24px;line-height:1.2;color:#2f362c}
.account-notice p{margin:6px 0 0;font-size:13px;line-height:1.7;color:#6f7562;overflow-wrap:anywhere}
.account-notice .account-notice-status{color:#4d5a3b;font-weight:500}
.account-notice .account-notice-status:empty{display:none}
.account-notice .account-notice-status.is-error{color:#8c3933}
.account-code-form{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}
.account-code-input{width:156px;height:40px;padding:0 8px 0 16px;border:1px solid #cfd2bd;border-radius:8px;background:#fffdf7;font-family:'SF Mono',SFMono-Regular,Menlo,Consolas,monospace;font-size:18px;font-weight:600;letter-spacing:6px;text-align:center;color:#2f362c}
.account-code-input::placeholder{color:#d3d6cb}
.account-code-input:focus{outline:2px solid #a3ae8d;outline-offset:2px}
.account-code-submit{height:40px;padding:0 22px;border:0;border-radius:30px;background:#2f362c;font:inherit;font-size:13px;color:#fbf3e5;cursor:pointer}
.account-code-submit:hover{background:#4f6041}
.account-text-button{padding:0 4px;border:0;background:none;font:inherit;font-size:12px;color:#34442f;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.account-code-form button:disabled{opacity:.55;cursor:default}

@media(max-width:1050px){.account-page{padding:0 30px 80px}}
@media(max-width:900px){.account-dashboard{grid-template-columns:minmax(0,1fr)}}
@media(max-width:760px){.account-notice{align-items:flex-start;gap:14px;padding:20px 18px}.account-page{padding:0 22px 56px}.account-head{padding:52px 0 28px}.account-head p{font-size:13px}.account-card{padding:22px}}

/* Invoicing plan: choose, pay on Creem, see until when it runs. */
.plan-picker{display:grid;gap:8px;width:100%;margin-top:16px}
.plan-option{display:flex;align-items:baseline;justify-content:space-between;gap:10px;width:100%;padding:11px 14px;border:1px solid #d5d9c2;border-radius:10px;background:#fffdf7;font:inherit;text-align:start;color:#34442f;cursor:pointer}
.plan-option strong{font-size:13px;font-weight:600}
.plan-option span{font-size:12px;color:#6f7562;white-space:nowrap}
.plan-option.is-selected{border-color:#5d7048;background:#f1f3e3;box-shadow:inset 0 0 0 1px #5d7048}
.account-pay{width:100%;margin-top:12px;padding:12px 16px;border:0;border-radius:30px;background:#2f362c;font:inherit;font-size:13px;font-weight:600;color:#fbf5e9;cursor:pointer}
.account-pay:hover{background:#4f6041}
.account-pay:disabled{opacity:.6;cursor:default}
.account-error{width:100%;margin:10px 0 0!important;padding:9px 12px;border:1px solid #e6c8ba;border-radius:8px;background:#f6e9df;font-size:12px!important;color:#8c3933!important}
.billing-notice{margin:0 0 20px;padding:14px 18px;border:1px solid #c5d1ad;border-radius:12px;background:#eef2df;font-size:13px;line-height:1.6;color:#526538}
.billing-notice.is-waiting{border-color:#e5dcb4;background:#f5efda;color:#7d7c60}
.billing-notice.is-failed{border-color:#e6c8ba;background:#f6e9df;color:#8c3933}

/* My purchases */
.account-dashboard .purchases{grid-column:1/-1}
.purchases #purchases-body{width:100%;margin-top:14px}
.purchase{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 18px;padding:14px 0;border-top:1px solid #e3e5d3}
.purchase-main strong{font-size:14px;font-weight:600;color:#2f362c}
.purchase-meta{display:block;margin-top:2px;font-size:12px;color:#6f7562}
.purchase-price{font-size:14px;font-weight:600;white-space:nowrap;color:#2f362c}
.purchase-code{display:flex;flex-wrap:wrap;align-items:center;gap:8px;grid-column:1/-1}
.purchase-code code{padding:6px 10px;border:1px solid #e1e4c8;border-radius:8px;background:#f6f7ec;font-family:'SF Mono',SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;color:#2f362c;overflow-wrap:anywhere}
.purchase-actions{display:flex;flex-wrap:wrap;gap:14px;grid-column:1/-1}
.purchase-actions button,.purchase-code button{padding:0;border:0;background:none;font:inherit;font-size:12px;color:#5d6b3f;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.purchase-status{grid-column:1/-1;font-size:12px;color:#526538}
.purchase-test{display:inline-block;margin-inline-start:6px;padding:1px 7px;border:1px solid #e5dcb4;border-radius:30px;background:#f5efda;font-size:10px;font-weight:500;color:#7d7c60;vertical-align:middle}
.purchases-empty{margin:0;font-size:13px;color:#6f7562}
.purchases-note{margin:12px 0 0;font-size:12px;color:#8a927b}