/* One size picker, shared by the plan window, claims and registration. */
.claim-plans { display:block; }
#account-page .brand-registration .registration-plans { display:block; margin-top:16px; }
.brand-size-picker { min-width:0; }
.brand-size-picker .brand-size-heading { margin-bottom:14px; }
.brand-size-picker .brand-size-heading h2 { margin:0 0 8px; font-size:25px; line-height:1.2; letter-spacing:-.7px; }
.brand-size-picker .brand-size-heading p { margin:0; color:var(--ui-muted); font-size:12px; }
.brand-size-workspace { display:block; }
.brand-size-preview { container-type:inline-size; display:grid; grid-template-columns:1fr 3fr; gap:12px; height:148px; padding:12px 14px; min-width:0; overflow:hidden; border:1px solid var(--ui-border); border-radius:7px; background:var(--theme-input,#171717); }
.brand-size-preview figure { display:grid; grid-template-rows:minmax(0,1fr) auto; min-width:0; margin:0; }
.brand-size-reference { --brand-scale:1; }
.brand-size-sample { display:flex; align-items:center; justify-content:center; min-width:0; min-height:0; }
.brand-size-logo { display:flex; align-items:center; justify-content:center; flex:none; width:calc(16cqw * var(--brand-scale)); min-width:0; max-height:calc(26px * var(--brand-scale)); overflow:hidden; font-size:calc(3cqw * var(--brand-scale)); font-weight:600; line-height:1.12; letter-spacing:-.04em; text-align:center; overflow-wrap:anywhere; color:var(--theme-accent,#c9b2ef); }
.brand-size-reference .brand-size-logo { color:var(--ui-muted); }
.brand-size-logo img { display:block; width:100%; height:calc(24px * var(--brand-scale)); object-fit:contain; }
.brand-size-preview figcaption { margin-top:8px; color:var(--ui-muted); font-size:10px; line-height:1.4; text-align:center; white-space:nowrap; }
.brand-size-preview:has(img) { background:#191919; }
.brand-size-preview:has(img) figcaption { color:#bdbbc2; }
.brand-size-controls { display:grid; grid-template-columns:140px minmax(0,1fr); gap:0 20px; min-width:0; margin-top:16px; }
.brand-size-budget-label { grid-column:1; grid-row:1; display:block; font-size:11px; color:var(--ui-muted); }
.brand-size-price { grid-column:1; grid-row:2 / 4; display:flex; align-items:center; gap:2px; margin:0; color:var(--ui-text); font-size:36px; font-weight:500; line-height:1.15; letter-spacing:-1.5px; font-variant-numeric:tabular-nums; }
.brand-size-price .brand-size-period { margin-left:3px; color:var(--ui-muted); font-size:11px; font-weight:400; letter-spacing:0; white-space:nowrap; }
.brand-size-picker .brand-size-price input[data-size-budget],
#claim-page .brand-size-price input[data-size-budget],
#account-page .brand-size-price input[data-size-budget] { appearance:textfield; width:2.25ch; min-width:0; min-height:0; padding:0 2px; margin:0; border:0; border-radius:3px; background:transparent; color:inherit; box-shadow:none; font:inherit; line-height:inherit; letter-spacing:inherit; text-align:left; }
.brand-size-price input::-webkit-inner-spin-button,
.brand-size-price input::-webkit-outer-spin-button { appearance:none; margin:0; }
.brand-size-price input:hover { background:var(--theme-accent-wash,#c9b2ef0b); }
.brand-size-range-label { grid-column:2; grid-row:1; display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:11px; color:var(--ui-text); }
.brand-size-picker input[data-size-range],
#claim-page .brand-size-picker input[data-size-range],
#account-page .brand-size-picker input[data-size-range] { grid-column:2; grid-row:2; appearance:none; display:block; width:100%; min-width:0; height:32px; min-height:32px; padding:0; margin:0; border:0; border-radius:0; background:transparent; box-shadow:none; cursor:pointer; }
.brand-size-picker input[data-size-range]::-webkit-slider-runnable-track { height:5px; border-radius:5px; background:linear-gradient(to right,var(--theme-accent,#c9b2ef) var(--brand-progress),var(--ui-border) var(--brand-progress)); }
.brand-size-picker input[data-size-range]::-webkit-slider-thumb { appearance:none; width:19px; height:19px; margin-top:-7px; border:3px solid var(--theme-surface,#1c1c1e); border-radius:50%; background:var(--theme-accent,#c9b2ef); box-shadow:0 0 0 1px var(--theme-accent,#c9b2ef); }
.brand-size-picker input[data-size-range]::-moz-range-track { height:5px; border-radius:5px; background:linear-gradient(to right,var(--theme-accent,#c9b2ef) var(--brand-progress),var(--ui-border) var(--brand-progress)); }
.brand-size-picker input[data-size-range]::-moz-range-thumb { width:14px; height:14px; border:3px solid var(--theme-surface,#1c1c1e); border-radius:50%; background:var(--theme-accent,#c9b2ef); }
.brand-size-picker input:focus-visible { outline:2px solid var(--theme-accent,#c9b2ef); outline-offset:4px; }
.brand-size-limits { grid-column:2; grid-row:3; display:flex; justify-content:space-between; gap:12px; color:var(--ui-muted); font-size:10px; }
.brand-size-picker .brand-size-help { grid-column:1 / -1; grid-row:4; margin:8px 0 0; color:var(--ui-muted); font-size:10px; line-height:1.5; }
.brand-size-picker .brand-size-coverage { padding-top:14px; margin:16px 0 0; border-top:1px solid var(--ui-border); color:var(--ui-muted); font-size:12px; line-height:1.6; }
.brand-plan-actions { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand-plan-actions small { display:block; color:var(--ui-muted); font-size:11px; }
.brand-plan-continue { display:inline-flex; align-items:center; justify-content:space-between; gap:24px; min-height:44px; padding:11px 20px; border:1px solid var(--theme-accent,#c9b2ef); border-radius:6px; background:var(--theme-accent,#c9b2ef); color:var(--theme-on-accent,#1c1427); font-weight:500; text-decoration:none; }
.brand-plan-continue:hover { background:var(--theme-accent-hover,#d3bdf5); border-color:var(--theme-accent-hover,#d3bdf5); }
.brand-plan-continue:focus-visible { outline:2px solid var(--theme-accent,#c9b2ef); outline-offset:4px; }

.brand-action-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:22px 0 18px; }
.brand-action-grid :is(a,button) { display:flex; align-items:center; justify-content:center; min-width:0; min-height:58px; margin:0; padding:12px 10px; border:1px solid var(--ui-border); border-radius:9px; background:var(--theme-input,#171717); font:500 14px/1.4 var(--ui-font); text-align:center; cursor:pointer; }
#page-window .brand-action-grid :is(a,button) { color:var(--brand-action-color); text-decoration:none; }
#page-window .brand-action-grid :is(a,button):hover { border-color:var(--brand-action-color); background:var(--theme-raised,#252527); }
.brand-action--pink { --brand-action-color:var(--theme-pink,#eda2bb); }
.brand-action--mint { --brand-action-color:var(--theme-mint,#66c7a7); }
.brand-action--purple { --brand-action-color:var(--theme-accent,#c9b2ef); }
.brand-action--cyan { --brand-action-color:var(--theme-blue,#91c6d5); }
.brand-action--gold { --brand-action-color:var(--theme-gold,#e7bb61); }
.brand-action--coral { --brand-action-color:var(--theme-orange,#ed9c78); }
html[data-theme="light"] .brand-action--pink { --brand-action-color:#8c3e5c; }
html[data-theme="light"] .brand-action--mint { --brand-action-color:#246c54; }
html[data-theme="light"] .brand-action--purple { --brand-action-color:#705092; }
html[data-theme="light"] .brand-action--cyan { --brand-action-color:#2d697d; }
html[data-theme="light"] .brand-action--gold { --brand-action-color:#825b12; }
html[data-theme="light"] .brand-action--coral { --brand-action-color:#994d31; }
.brand-size-section .brand-plan-actions { margin:18px 0 4px; }
.page-window-content .brand-help-link { margin-top:20px; font-size:11px; }

/* Keep the next step outside the scrolling content. */
#page-window.plan-window { width:520px; }
.plan-window .page-window-content { padding:22px 24px 18px; }
.plan-window .page-window-content h1 { margin-bottom:8px; font-size:25px; }
.plan-window .page-window-content>.lead { margin:0 0 16px; font-size:12px; }
.page-window-actions { flex:none; padding:12px 24px; border-top:1px solid var(--ui-border); background:var(--theme-surface,#1c1c1e); }
.page-window-actions[hidden] { display:none; }
#claim-page.claim-page--plans[open] { display:flex; flex-direction:column; overflow:hidden; width:520px; }
.claim-page--plans .claim-header { flex:none; padding-bottom:6px; }
.claim-page--plans .claim-body { min-height:0; overflow:auto; padding-bottom:18px; }
.claim-page--plans .claim-bottom { flex:none; margin:0; padding:12px 30px; background:var(--ui-surface); }
.claim-page--plans .claim-subtitle { margin-bottom:16px; font-size:12px; }
.claim-page--plans .claim-steps { margin-bottom:20px; }
.claim-page--plans .claim-review-note { margin:16px 0 0; }

@media(max-width:640px) {
  .brand-action-grid { margin-top:18px; }
  .brand-action-grid :is(a,button) { min-height:56px; padding:10px 7px; font-size:12px; }
  .brand-size-preview { height:140px; padding:10px 12px; }
  .brand-size-controls { grid-template-columns:120px minmax(0,1fr); gap:0 16px; margin-top:14px; }
  .brand-size-price { font-size:32px; }
  .brand-size-price .brand-size-period { font-size:10px; }
  .plan-window .page-window-content { padding:22px 20px 16px; }
  .plan-window .page-window-content h1 { font-size:24px; }
  .page-window-actions { padding:12px 20px; }
  .brand-plan-actions { gap:14px; }
  .brand-plan-continue { gap:18px; padding:10px 16px; font-size:12px; }
  .claim-page--plans .claim-bottom { flex-direction:row; align-items:center; padding:12px 18px; gap:12px; }
  .claim-page--plans .claim-bottom>span { max-width:92px; }
  .claim-page--plans .brand-size-heading { margin-bottom:16px; }
  .claim-page--plans .claim-steps { gap:12px; font-size:10px; }
}
#page-window .billing-email-field{display:grid;gap:8px;margin:24px 0 16px;font-size:12px}
#page-window .billing-email-field input{width:100%;min-width:0;padding:12px;border:1px solid var(--ui-border);border-radius:6px;background:var(--ui-surface);color:var(--ui-text);font:inherit;font-size:16px}
#page-window .page-button{display:inline-flex;align-items:center;justify-content:center;max-width:100%;min-height:44px;padding:11px 16px;border:1px solid var(--ui-border);border-radius:6px;background:var(--theme-accent,#c9b2ef);color:var(--theme-on-accent,#18131e);font:500 13px/1.5 var(--ui-font);white-space:normal;overflow-wrap:anywhere;cursor:pointer}
#page-window .page-button:disabled{opacity:.6;cursor:wait}
#page-window #billing-message:empty{display:none}
#page-window .billing-links{margin-top:24px;font-size:12px;line-height:2}