/* Shared only with the visualizer. Keep every selector scoped to account UI so
   account-page button/layout rules cannot collapse product swatches. */
.account-gate{position:fixed;inset:0;background:#142737c4;z-index:1000;overflow:auto;display:flex;padding:26px 16px;align-items:flex-start;justify-content:center;font:16px/1.55 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#21313f}
.account-gate .gate-card{background:white;border-radius:18px;width:100%;max-width:660px;padding:30px;margin:auto;box-shadow:0 20px 70px #0003}
.account-gate h1{font-size:28px;line-height:1.2;letter-spacing:-.7px;margin:10px 0 15px}
.account-gate p{margin:0 0 14px}
.account-gate a{color:#245b80}
.account-gate .eyebrow{font-size:12px;letter-spacing:1.6px;text-transform:uppercase;color:#657789;font-weight:700}
.account-gate .hint{color:#627180;font-size:14px}
.account-gate form{display:grid;gap:18px}
.account-gate label{display:block;font-size:14px;font-weight:600}
.account-gate input:not([type=checkbox]){display:block;box-sizing:border-box;width:100%;font:inherit;padding:11px 12px;margin-top:6px;border:1px solid #cbd4de;border-radius:8px;background:white;color:inherit}
.account-gate label.check{display:flex;align-items:flex-start;gap:10px;font-weight:450;line-height:1.5}
.account-gate label.check input{flex:none;width:18px;height:18px;margin:3px 0 0;accent-color:var(--accent)}
.account-gate button{font:inherit;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid #d5dce3;border-radius:9px;padding:11px 17px;min-height:44px;background:white;color:#21313f;cursor:pointer}
.account-gate button.primary{background:var(--accent);color:white;border-color:var(--accent)}
.account-gate button:disabled{opacity:.5;cursor:default}
.account-gate button:focus-visible,.account-gate a:focus-visible,.account-gate input:focus-visible{outline:3px solid #659ac6;outline-offset:3px}
.account-gate .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.account-gate .message{min-height:24px;white-space:pre-wrap}
.account-gate .message.error{color:#a52336}
.account-banner{padding:14px 18px;background:#eaf1f7;border:1px solid #c9dae8;border-radius:10px;margin-bottom:20px}
.account-banner a{font-weight:650}
@media(max-width:760px){.account-gate .gate-card{padding:23px}.account-gate .actions>*{flex:1}}