/* The account experience: a maker's world beside a focused, accessible form. */
.auth-screen{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);margin-block:36px 64px;border:1px solid var(--line);border-radius:28px;overflow:hidden;background:var(--surface)}
.auth-story{display:flex;flex-direction:column;background:#171717;color:#fff;padding:44px 40px 32px;min-inline-size:0;position:relative}
.auth-copy{position:relative;z-index:1}
.auth-eyebrow{font-size:11px;font-weight:600;letter-spacing:.14em;line-height:1.5;text-transform:uppercase;color:var(--muted)}
.auth-copy .auth-eyebrow{color:var(--accent);margin-block-end:24px}
.auth-copy h1{font-size:clamp(38px,4.4vw,60px);font-weight:600;letter-spacing:-.055em;line-height:1.06;text-wrap:initial}
.auth-copy h1 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--accent);letter-spacing:-.055em}
.auth-copy>p:not(.auth-eyebrow){font-size:16px;line-height:1.65;color:#c9c1b9;max-inline-size:36ch;margin-block-start:22px}
.auth-points{display:flex;flex-direction:column;gap:10px;list-style:none;padding:0;margin:24px 0 32px}
.auth-points li{display:flex;gap:10px;font-size:13px;line-height:1.5;color:#eee7e0}
.auth-points .icon{inline-size:16px;block-size:16px;margin-block-start:2px;color:var(--accent)}
.auth-product{margin-block-start:8px;flex:1;position:relative;border-radius:16px;min-block-size:245px;overflow:hidden;background:#453b2d;isolation:isolate}
.auth-product>img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;object-position:50% 60%;z-index:-2}
.auth-product::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0000 20%,#111a 100%);z-index:-1}
.auth-product figcaption{padding:24px;position:absolute;inset-block-end:0;inset-inline:0;display:flex;flex-direction:column;gap:3px}
.auth-product figcaption>span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#ffffffc9}
.auth-product figcaption>strong{font-size:23px;line-height:1.15;font-weight:500;letter-spacing:-.025em;max-inline-size:16ch}
.auth-order{position:relative;margin:16px 16px 0 auto;inline-size:fit-content;max-inline-size:calc(100% - 32px);display:flex;gap:10px;align-items:center;background:#faf7f2f5;color:#171717;padding:12px 14px;border-radius:10px;box-shadow:0 8px 24px #0002}
.auth-order>.icon{color:var(--accent-ink);inline-size:26px;block-size:26px}
.auth-order strong,.auth-order span{display:block}.auth-order strong{font-size:12px;font-weight:600}.auth-order span{font-size:10px;color:#68615b;margin-block-start:2px}
.auth-panel{display:flex;flex-direction:column;justify-content:center;min-inline-size:0;padding:36px clamp(24px,4.8vw,68px) 32px;gap:22px}
.auth-back{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;font-size:12px;min-block-size:32px;color:var(--muted)}
.auth-back .icon{inline-size:14px;block-size:14px;transform:rotate(180deg)}
[dir=rtl] .auth-back .icon{transform:none}
.auth-back:hover{color:var(--text)}
.auth-card{display:flex;flex-direction:column;gap:17px;min-inline-size:0;margin:0}
.auth-form-heading{margin-block-end:6px}
.auth-form-heading .auth-eyebrow{margin-block-end:12px}
.auth-card h2{font-size:clamp(28px,2.8vw,38px);line-height:1.1;font-weight:600;letter-spacing:-.045em}
.auth-form-heading>p:not(.auth-eyebrow){font-size:14px;line-height:1.65;margin-block-start:12px;max-inline-size:34ch}
.auth-card label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:500;color:var(--text)}
.auth-card input:not([type=radio]){inline-size:100%;min-inline-size:0;min-block-size:50px;padding:12px 14px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--text);font:inherit;font-size:16px;transition:border-color .15s,box-shadow .15s}
.auth-card input:not([type=radio]):hover{border-color:var(--muted)}
.auth-card input:focus-visible{outline:2px solid var(--accent-ink);outline-offset:2px;border-color:transparent}
.auth-card .button{inline-size:100%;border-radius:9px;min-block-size:50px;font-size:14px;justify-content:space-between;cursor:pointer}
.auth-card .button:only-child{justify-content:center}
.auth-card .button:focus-visible,.auth-card button:focus-visible{outline:2px solid var(--accent-ink);outline-offset:4px}
.auth-card .button .icon{inline-size:17px;block-size:17px}
.auth-card .button:disabled{opacity:.65;cursor:wait;transform:none}
.auth-card[aria-busy=true] .button::after{content:'';inline-size:14px;block-size:14px;border:2px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:auth-spin .7s linear infinite}
.auth-card[aria-busy=true] .button>.icon{display:none}
.auth-switch{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;font-size:13px}
.auth-switch a,.auth-switch .text-link,.auth-legal a{min-block-size:32px;display:inline-flex;align-items:center;color:var(--text);font-size:13px;font-weight:500;text-decoration:underline;text-underline-offset:4px;background:none;border:0;padding:0;cursor:pointer;white-space:normal}
.auth-switch a:hover,.auth-legal a:hover{color:var(--accent-ink)}
.auth-legal{font-size:11px;line-height:1.65}.auth-legal a{font-size:11px;min-block-size:24px}
.field-hint{font-size:11px;line-height:1.5;margin-block-start:-10px}
.address-note{margin-block-start:-6px}
.address-suggestions{display:flex;flex-wrap:wrap;gap:8px}
.address-suggestions button{font:inherit;font-size:12px;line-height:1.3;padding:6px 10px;border-radius:9px;border:1px solid var(--line);background:var(--bg);color:var(--text);cursor:pointer}
.form-error{margin:0;padding:12px 14px;border:1px solid var(--line);border-inline-start:3px solid var(--accent);border-radius:8px;background:var(--soft);color:var(--text);font-size:13px;line-height:1.6;overflow-wrap:anywhere}
.auth-help{display:flex;align-items:center;justify-content:center;gap:7px;padding-block-start:14px;border-block-start:1px solid var(--line);font-size:11px;line-height:1.5;text-align:center}
.auth-help .icon{inline-size:13px;block-size:13px}
.auth-state-icon{display:inline-flex;padding:12px;border:1px solid var(--line);background:var(--soft);border-radius:12px;margin-block-end:22px;color:var(--text)}
.auth-state-icon .icon{inline-size:26px;block-size:26px}
.auth-progress{display:flex;gap:12px;list-style:none;margin:0;padding:0}
.auth-progress li{display:flex;align-items:center;gap:6px;flex:1;font-size:10px;line-height:1.3;color:var(--muted)}
.auth-progress li>span{display:grid;place-items:center;inline-size:24px;block-size:24px;border:1px solid var(--line);border-radius:50%;font-size:9px;flex:none}
.auth-progress li[aria-current=step]{color:var(--text);font-weight:600}
.auth-progress li[aria-current=step]>span{color:#111;background:var(--accent);border-color:var(--accent)}
.auth-selected-plan{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:9px;background:var(--bg)}
.auth-selected-plan>.icon{inline-size:20px;block-size:20px;color:var(--muted)}
.auth-selected-plan>div{min-inline-size:0;flex:1}.auth-selected-plan span{display:block;font-size:10px;color:var(--muted)}
.auth-selected-plan strong{display:block;font-size:12px;font-weight:600;line-height:1.5}.auth-selected-plan small{display:block;font-size:11px;font-weight:400;color:var(--muted)}
.auth-selected-plan>a{font-size:11px;text-decoration:underline;text-underline-offset:3px;min-block-size:36px;display:flex;align-items:center}
.plan-choice{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;border:0;min-inline-size:0}
.plan-choice legend{font-size:13px;font-weight:500;margin-block-end:10px}
.auth-card .plan-choice-option{display:flex;flex-direction:row;align-items:center;gap:12px;min-block-size:60px;padding:12px;border:1px solid var(--line);border-radius:9px;cursor:pointer}
.plan-choice-option:has(:checked){border-color:var(--accent-ink);box-shadow:0 0 0 1px var(--accent-ink);background:color-mix(in srgb,var(--accent) 7%,var(--surface))}
.plan-choice-option input{inline-size:16px;block-size:16px;margin:0;flex:none;accent-color:var(--accent-ink)}
.plan-choice-option>span{display:flex;flex-direction:column;gap:2px}.plan-choice-option small{font-size:11px;color:var(--muted)}
.org-list{display:flex;flex-direction:column;gap:10px}
@keyframes auth-spin{to{transform:rotate(360deg)}}
@media(prefers-color-scheme:dark){.auth-story{background:#211a16}.auth-card input:focus-visible,.auth-card button:focus-visible{outline-color:var(--accent)}.auth-switch a:hover,.auth-legal a:hover{color:var(--accent)}}
@media(max-width:1050px){.auth-story{padding:32px 28px 28px}.auth-panel{padding:28px 32px}.auth-copy h1{font-size:44px}.auth-points{margin-block-end:24px}}
@media(max-width:767px){.auth-screen{grid-template-columns:1fr;margin-block:24px 40px;border-radius:20px}.auth-story{padding:28px}.auth-copy .auth-eyebrow{margin-block-end:16px}.auth-copy h1{font-size:38px}.auth-copy>p:not(.auth-eyebrow){font-size:14px;margin-block-start:15px;max-inline-size:45ch}.auth-points,.auth-product{display:none}.auth-panel{padding:24px 28px 28px;gap:20px}.auth-back{display:none}.auth-card h2{font-size:30px}.auth-form-heading .auth-eyebrow{display:none}}
@media(max-width:389px){.auth-story{padding:24px 20px}.auth-panel{padding:24px 20px}.auth-copy h1{font-size:34px}.auth-progress{gap:6px}.auth-progress li{gap:4px;font-size:9px}.auth-card h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){.auth-card[aria-busy=true] .button::after{animation:none}}
@media(max-width:767px){.auth-story{padding-block:24px}.auth-copy .auth-eyebrow,.auth-copy>p:not(.auth-eyebrow){display:none}.auth-copy h1{font-size:36px}}
