/* SubStock shared UI components. Tokens are the same design system the pages already use;
   pages that define their own :root tokens simply override these with identical values. */
:root{
--bg:#0E0E10;--card:#141416;--nav:#1C1C1F;--card2:#1E1E21;--rowh:#1A1A1D;
--line2:#1F1F22;--line:#232326;--border:#2A2A2E;--border2:#3A3A3E;
--fg:#F4F4F2;--fgh:#D6D6D3;
--label:#C8C8CC;--sub0:#B4B4B8;--sub:#9A9A9F;--sub2:#8C8C91;--muted:#77777C;--muted2:#646468;--dim:#5A5A5E;
--ok:#56D08A;--warn:#E7B64B;--bad:#EC6A64;
--b07:rgba(255,255,255,.07);--b08:rgba(255,255,255,.08);--b06:rgba(255,255,255,.06);--b22:rgba(255,255,255,.22);
--headbg:rgba(12,12,14,.72);
}
html[data-ss-theme="light"]{
--bg:#ECECE9;--card:#FFFFFF;--nav:#E4E4E0;--card2:#EDEDEA;--rowh:#F5F5F2;
--line2:#E8E8E4;--line:#E0E0DC;--border:#D4D4CF;--border2:#C2C2BC;
--fg:#17181C;--fgh:#2E2F34;
--label:#36373B;--sub0:#4A4B4F;--sub:#5A5B5F;--sub2:#6C6D71;--muted:#86878B;--muted2:#9A9B9F;--dim:#A6A7AB;
--ok:#0F7D45;--warn:#8A5E00;--bad:#B5362F;
--b07:rgba(0,0,0,.08);--b08:rgba(0,0,0,.05);--b06:rgba(0,0,0,.07);--b22:rgba(0,0,0,.22);
--headbg:rgba(255,255,255,.72);
}
@keyframes ssSpin{to{transform:rotate(360deg)}}
@keyframes ssFadeIn{from{opacity:0}to{opacity:1}}
@keyframes ssFadeAway{from{opacity:1}to{opacity:0}}
@keyframes ssDialogIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes ssDialogOut{from{opacity:1;transform:none}to{opacity:0;transform:translateY(10px) scale(.98)}}
@keyframes ssUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- main navigation ---------- */
.ss-nav{display:flex;align-items:center;gap:2px;padding:4px;background:var(--nav);border-radius:999px;max-width:100%;min-width:0;
  overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ss-nav::-webkit-scrollbar{display:none}
.ss-nav a.ss-nav__item{flex:none;display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 15px;border-radius:999px;
  font-size:14px;font-weight:500;line-height:1;white-space:nowrap;text-decoration:none;color:var(--sub0);
  transition:color .25s ease,background .25s ease,box-shadow .25s ease}
.ss-nav a.ss-nav__item:hover{color:var(--fg);background:var(--b06)}
.ss-nav a.ss-nav__item:focus-visible{outline:2px solid var(--fg);outline-offset:-2px}
.ss-nav a.ss-nav__item.is-active,.ss-nav a.ss-nav__item.is-active:hover{background:var(--fg);color:var(--card);box-shadow:0 2px 8px rgba(0,0,0,.18)}
.ss-nav--fill a.ss-nav__item{flex:1 0 auto}
@media (max-width:640px){.ss-nav a.ss-nav__item{padding:0 12px}}
@media (max-width:420px){.ss-nav{gap:0}.ss-nav a.ss-nav__item{padding:0 9px;font-size:13px}}

/* header slot used by the plain pages: inline on wide screens, own row on narrow ones */
.ss-nav-slot{flex:1 1 auto;min-width:0;display:flex;justify-content:center}
.ss-nav-slot + .spacer{display:none}
@media (max-width:899px){
  .hwrap{flex-wrap:wrap;row-gap:10px}
  .ss-nav-slot{order:99;flex:1 0 100%}
  .ss-nav-slot + .spacer{display:block}
  .ss-nav-slot .ss-nav{flex:1}
  .ss-nav-slot a.ss-nav__item{flex:1 0 auto}
}
/* headers with extra actions (account) move the nav to its own row earlier */
@media (min-width:900px) and (max-width:1023px){
  .hwrap.ss-hdr-lg{flex-wrap:wrap;row-gap:10px}
  .ss-hdr-lg .ss-nav-slot{order:99;flex:1 0 100%}
  .ss-hdr-lg .ss-nav-slot + .spacer{display:block}
  .ss-hdr-lg .ss-nav-slot .ss-nav{flex:1}
  .ss-hdr-lg .ss-nav-slot a.ss-nav__item{flex:1 0 auto}
}

/* ---------- tones ---------- */
.ss-tone-ok{--tone:var(--ok)}
.ss-tone-warn{--tone:var(--warn)}
.ss-tone-bad{--tone:var(--bad)}
.ss-tone-canceled{--tone:color-mix(in srgb,var(--bad) 30%,var(--sub2))}
.ss-tone-neutral{--tone:var(--sub2)}

/* product availability — rounded pill with a dot */
.ss-badge{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 11px;border-radius:999px;flex:none;
  font-size:12px;font-weight:500;line-height:1;white-space:nowrap;color:var(--tone,var(--sub2));
  border:1px solid var(--border2);border-color:color-mix(in srgb,var(--tone,var(--sub2)) 34%,transparent);
  background:color-mix(in srgb,var(--tone,var(--sub2)) 9%,transparent)}
.ss-badge__dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.ss-badge--sm{height:22px;padding:0 9px;font-size:11px;gap:6px}

/* activation / payment status — squarer tag with a glyph, visually distinct from stock pills */
.ss-op{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px 0 8px;border-radius:8px;flex:none;
  font-size:12px;font-weight:600;line-height:1;white-space:nowrap;color:var(--tone,var(--sub2));
  border:1px solid var(--border2);border-color:color-mix(in srgb,var(--tone,var(--sub2)) 30%,transparent);
  background:color-mix(in srgb,var(--tone,var(--sub2)) 8%,transparent)}
.ss-op--sm{height:22px;font-size:11px;padding:0 8px 0 6px;gap:5px}
.ss-op__icon{width:14px;height:14px;flex:none;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.ss-op--sm .ss-op__icon{width:12px;height:12px}
.ss-op--activated{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
.ss-op--pending{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E")}
.ss-op--error{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E")}
.ss-op--canceled{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M6.5 6.5l11 11'/%3E%3C/svg%3E")}
.ss-op--unused{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-dasharray='3 3'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3C/svg%3E")}
.ss-op--none{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E")}

/* ---------- info rows (label → value) ---------- */
.ss-info{border:1px solid var(--line);border-radius:18px;overflow:hidden;text-align:left}
.ss-info__row{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:50px;padding:11px 16px;border-top:1px solid var(--line2);font-size:14px;line-height:1.4}
.ss-info__row:first-child{border-top:0}
.ss-info__k{flex:none;color:var(--sub2);min-width:96px}
.ss-info__v{min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;text-align:right;font-weight:500;overflow-wrap:anywhere;word-break:break-word}
.ss-info__v > span{min-width:0}
.ss-mono{font-family:'Geist Mono',monospace;font-size:13px;letter-spacing:.02em}
.ss-wrap{overflow-wrap:anywhere;word-break:break-all}
.ss-strong{font-weight:600}
.ss-muted{color:var(--muted)}
@media (max-width:520px){
  .ss-info__row{flex-direction:column;align-items:flex-start;gap:6px;padding:12px 14px}
  .ss-info__k{font-size:12px;min-width:0}
  .ss-info__v{width:100%;justify-content:space-between;text-align:left}
  .ss-info__v.has-copy > span:first-child{flex:1 1 0}
}

/* ---------- copy / reveal buttons ---------- */
.ss-copy,.ss-reveal{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;min-width:32px;padding:0 10px;border-radius:10px;
  border:1px solid var(--border);background:var(--card);color:var(--label);font:inherit;font-size:12px;font-weight:500;line-height:1;white-space:nowrap;cursor:pointer;
  transition:border-color .2s,color .2s,background .2s}
.ss-copy:hover,.ss-reveal:hover{border-color:var(--fg);color:var(--fg)}
.ss-copy:focus-visible,.ss-reveal:focus-visible{outline:2px solid var(--fg);outline-offset:2px}
.ss-copy__icon,.ss-reveal__icon{width:14px;height:14px;flex:none;background:currentColor;
  -webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat;
  --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2.5'/%3E%3Cpath d='M5 15V5a2 2 0 0 1 2-2h10'/%3E%3C/svg%3E")}
.ss-copy.is-copied{color:var(--ok);border-color:var(--ok);border-color:color-mix(in srgb,var(--ok) 45%,transparent)}
.ss-copy.is-copied .ss-copy__icon{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
.ss-reveal__icon{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")}
.ss-reveal.is-on .ss-reveal__icon,.ss-eye.is-on .ss-reveal__icon{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3l18 18M10.6 5.6A9.7 9.7 0 0 1 12 5.5c6 0 9.5 6.5 9.5 6.5a17 17 0 0 1-3 3.8M6.5 6.6C3.9 8.4 2.5 12 2.5 12S6 18.5 12 18.5c1.6 0 3-.4 4.2-1M9.9 9.9a3 3 0 0 0 4.2 4.2'/%3E%3C/svg%3E")}
@media (max-width:520px){
  .ss-copy:not(.is-copied) .ss-copy__label,.ss-reveal .ss-reveal__label{display:none}
  .ss-copy,.ss-reveal{height:36px;min-width:36px}
}
.ss-actions{display:inline-flex;gap:6px;flex:none}

/* ---------- small pieces ---------- */
.ss-tag{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:6px;border:1px dashed var(--border2);
  font-size:11px;font-weight:500;color:var(--muted);white-space:nowrap;letter-spacing:.01em}
.ss-block-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.ss-block-title{font-size:13px;font-weight:600;color:var(--label)}
.ss-link{display:inline-flex;align-items:center;gap:6px;color:var(--fg);font-weight:500;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--border2);transition:text-decoration-color .2s}
.ss-link:hover{color:var(--fg);text-decoration-color:var(--fg)}
.ss-link__icon{width:13px;height:13px;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat}
.ss-spin{width:16px;height:16px;flex:none;animation:ssSpin .8s linear infinite}

/* buttons */
.ss-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;height:50px;padding:0 18px;border:0;border-radius:14px;
  background:var(--fg);color:var(--card);font:inherit;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s,transform .15s,opacity .2s}
.ss-btn:hover{background:var(--fgh)}
.ss-btn:active{transform:scale(.985)}
.ss-btn:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
.ss-btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.ss-btn--sec{background:var(--card);color:var(--fg);border:1px solid var(--border)}
.ss-btn--sec:hover{background:var(--card);border-color:var(--fg)}
.ss-btn--auto{width:auto}

/* alerts (not found / server error / notices) */
.ss-alert{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid var(--b22);border-radius:16px;font-size:14px;line-height:1.45;color:var(--fg);animation:ssUp .35s cubic-bezier(.22,.8,.24,1) both}
.ss-alert__icon{width:18px;height:18px;flex:none;margin-top:1px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E") center/contain no-repeat}
.ss-alert__t{font-weight:600}
.ss-alert__s{margin-top:2px;color:var(--sub)}
.ss-alert.ss-tone-bad,.ss-alert.ss-tone-warn{border-color:color-mix(in srgb,var(--tone) 40%,transparent);background:color-mix(in srgb,var(--tone) 6%,transparent)}
.ss-alert.ss-tone-bad .ss-alert__icon,.ss-alert.ss-tone-warn .ss-alert__icon{color:var(--tone)}

/* result card (Check page) */
.ss-result{margin-top:22px;border:1px solid var(--line);border-radius:22px;overflow:hidden;animation:ssUp .45s cubic-bezier(.22,.8,.24,1) both}
.ss-result__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;background:var(--bg);border-bottom:1px solid var(--line)}
.ss-result__title{font-family:'Manrope',sans-serif;font-weight:800;font-size:18px;letter-spacing:-.03em}
.ss-result .ss-info{border:0;border-radius:0}
.ss-result__foot{display:flex;flex-wrap:wrap;gap:10px;padding:14px 18px 18px;border-top:1px solid var(--line2)}
.ss-result__foot .ss-btn{height:46px;font-size:14px}
@media (min-width:521px){.ss-result__foot .ss-btn{width:auto}}

/* ---------- form fields (Заявка; reusable) ---------- */
.ss-form{display:flex;flex-direction:column;gap:20px}
.ss-form fieldset{margin:0;padding:0;border:0;min-width:0;display:flex;flex-direction:column;gap:20px}
.ss-field{display:flex;flex-direction:column;gap:8px;min-width:0}
.ss-label{font-size:13px;font-weight:500;color:var(--label)}
.ss-input,.ss-select,.ss-textarea{width:100%;min-width:0;height:50px;padding:0 16px;border-radius:14px;border:1px solid var(--border);background:var(--bg);color:var(--fg);
  font:inherit;font-size:15px;outline:none;transition:border-color .2s,background .2s,box-shadow .2s}
.ss-input:focus,.ss-select:focus,.ss-textarea:focus{border-color:var(--fg);background:var(--card);box-shadow:0 0 0 4px var(--b08)}
.ss-input::placeholder,.ss-textarea::placeholder{color:var(--muted2)}
.ss-input.is-mono,.ss-textarea.is-mono{font-family:'Geist Mono',monospace;font-size:14px;letter-spacing:.03em}
.ss-input.is-mono::placeholder,.ss-textarea.is-mono::placeholder{font-family:'Geist',system-ui,sans-serif;font-size:15px;letter-spacing:0}
.ss-input[aria-invalid="true"],.ss-select[aria-invalid="true"]{border-color:var(--bad)}
.ss-input:disabled,.ss-select:disabled,.ss-textarea:disabled{opacity:.6;cursor:not-allowed}
.ss-select-wrap{position:relative}
.ss-select{appearance:none;-webkit-appearance:none;padding-right:44px;cursor:pointer;text-overflow:ellipsis}
.ss-select.is-empty{color:var(--muted2)}
.ss-select option{color:var(--fg);background:var(--card)}
.ss-select-wrap::after{content:"";position:absolute;right:16px;top:50%;width:12px;height:12px;margin-top:-6px;pointer-events:none;background:var(--sub2);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat}
.ss-textarea{height:auto;min-height:124px;max-height:320px;padding:13px 16px;line-height:1.55;resize:vertical}
.ss-input-wrap{position:relative}
.ss-input-wrap .ss-input{padding-right:56px}
.ss-eye{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:40px;height:40px;border:0;border-radius:10px;background:transparent;color:var(--sub2);
  display:grid;place-items:center;cursor:pointer;transition:color .2s,background .2s}
.ss-eye:hover{color:var(--fg);background:var(--b06)}
.ss-eye:focus-visible{outline:2px solid var(--fg);outline-offset:-2px}
.ss-eye .ss-reveal__icon{width:18px;height:18px}
.ss-field__hint{font-size:12px;line-height:1.45;color:var(--muted)}
.ss-field__err{display:flex;align-items:center;gap:6px;font-size:13px;line-height:1.4;color:var(--bad)}
.ss-field__err:empty{display:none}
.ss-field__meta{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.ss-counter{font-family:'Geist Mono',monospace;font-size:12px;color:var(--muted2);white-space:nowrap}
.ss-counter.is-near{color:var(--warn)}
.ss-input-wrap .ss-textarea{padding-right:56px}
.ss-eye--top{top:6px;transform:none}
/* secret text in a multi-line field (session keys): masked like a password input */
.ss-textarea.is-masked{-webkit-text-security:disc;text-security:disc;word-break:break-all}
/* segmented choice (same look as the account Sign in / Register tabs) */
.ss-seg{display:flex;gap:4px;padding:4px;border:1px solid var(--border);border-radius:14px;background:var(--bg);max-width:100%}
.ss-seg button{flex:1 1 0;min-width:0;height:40px;padding:0 12px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--muted);
  font:inherit;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;transition:color .2s,background .2s,border-color .2s}
.ss-seg button:hover{color:var(--fg)}
.ss-seg button[aria-checked="true"]{background:var(--card);color:var(--fg);border-color:var(--b07);box-shadow:0 1px 3px rgba(0,0,0,.1)}
.ss-seg button:focus-visible{outline:2px solid var(--fg);outline-offset:-2px}
.ss-seg[aria-invalid="true"]{border-color:var(--bad)}
.ss-seg[aria-disabled="true"] button{cursor:not-allowed;opacity:.6}
.ss-group{padding-top:20px;border-top:1px solid var(--line2);display:flex;flex-direction:column;gap:16px}
.ss-group__t{margin:0;font-size:15px;font-weight:600;letter-spacing:-.01em}
.ss-group__s{margin:4px 0 0;font-size:13px;line-height:1.45;color:var(--sub2)}

/* ---------- modal (receipt) ---------- */
.ss-ov{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:16px;animation:ssFadeIn .22s ease both}
.ss-ov.is-out{animation:ssFadeAway .18s ease both}
.ss-modal{width:100%;max-width:460px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);display:flex;flex-direction:column;
  background:var(--card);color:var(--fg);border:1px solid var(--b07);border-radius:26px;box-shadow:0 40px 80px -30px rgba(0,0,0,.4);
  font-family:'Geist',system-ui,sans-serif;animation:ssDialogIn .28s cubic-bezier(.22,.8,.24,1) both}
.ss-ov.is-out .ss-modal{animation:ssDialogOut .18s ease both}
.ss-modal__head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:24px 24px 0}
.ss-modal__titles{display:flex;align-items:center;gap:10px;min-width:0}
.ss-modal__title{margin:0;font-family:'Manrope',sans-serif;font-weight:800;font-size:24px;letter-spacing:-.04em}
.ss-modal__body{padding:18px 24px;overflow:auto;min-height:0}
.ss-modal__foot{padding:0 24px 24px}
.ss-x{width:36px;height:36px;flex:none;border-radius:50%;border:1px solid var(--border);background:var(--card);color:var(--fg);display:grid;place-items:center;cursor:pointer;transition:border-color .2s}
.ss-x:hover{border-color:var(--fg)}
.ss-x:focus-visible{outline:2px solid var(--fg);outline-offset:2px}
@media (max-width:520px){
  .ss-ov{padding:12px}
  .ss-modal{border-radius:22px;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}
  .ss-modal__head{padding:20px 18px 0}.ss-modal__body{padding:16px 18px}.ss-modal__foot{padding:0 18px 18px}
}

/* ---------- page chrome for docs.html / request.html (same look as stock.html) ---------- */
.ssp *{box-sizing:border-box}
/* `clip` on body (not `hidden`): hidden on both html and body turns body into its own scroll container,
   which silently breaks position:sticky (header, docs contents). */
html.ssp{overflow-x:hidden}
html.ssp body{margin:0;overflow-x:clip}
html.ssp{background:var(--bg);color-scheme:dark}
html.ssp[data-ss-theme="light"]{color-scheme:light}
.ssp body{background:var(--bg);color:var(--fg);font-family:'Geist',system-ui,sans-serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
/* :where() keeps these resets weaker than component classes (.ss-btn, .ss-link, …) */
:where(.ssp) a{color:inherit;text-decoration:none}
:where(.ssp) button{cursor:pointer;font:inherit;color:inherit}
:where(.ssp) [hidden]{display:none!important}
.ssp ::selection{background:var(--fg);color:var(--card)}
.ssp ::view-transition-old(root),.ssp ::view-transition-new(root){animation:none;mix-blend-mode:normal}
.ssp .webs{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;opacity:.06}
.ssp .wrap{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column}
.ssp header{position:sticky;top:0;z-index:20;background:var(--headbg);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line)}
.ssp .hwrap{max-width:1160px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:16px}
.ssp .brand{display:flex;align-items:center;gap:10px;flex:none}
.ssp .logo{width:32px;height:32px;border-radius:50%;background:var(--fg);color:var(--card);display:grid;place-items:center;font-family:'Manrope',sans-serif;font-weight:800;font-size:16px}
.ssp .bname{font-family:'Manrope',sans-serif;font-weight:800;font-size:18px;letter-spacing:-.03em}
.ssp .spacer{flex:1}
.ssp .langs{position:relative;flex:none;display:grid;grid-template-columns:1fr 1fr 1fr;padding:3px;border:1px solid var(--border);border-radius:999px;background:var(--card)}
.ssp .langs .ind{position:absolute;top:3px;bottom:3px;left:3px;width:calc((100% - 6px)/3);border-radius:999px;background:var(--nav);transition:transform .4s cubic-bezier(.65,0,.25,1)}
.ssp .langs button{position:relative;z-index:1;height:26px;width:34px;border:0;background:transparent;font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--muted);transition:color .3s}
.ssp .langs button.on{color:var(--fg)}
.ssp main{flex:1;width:100%;max-width:1160px;margin:0 auto;padding:0 24px}
.ssp .hero{text-align:center;padding:56px 0 24px;animation:ssUp .5s cubic-bezier(.22,.8,.24,1) both}
.ssp .hero h1{margin:0;font-family:'Manrope',sans-serif;font-weight:800;font-size:56px;line-height:1;letter-spacing:-.045em;text-wrap:balance}
.ssp .hero p{margin:14px auto 0;max-width:560px;font-size:17px;line-height:1.5;color:var(--sub)}
.ssp .card{background:var(--card);border:1px solid var(--b07);border-radius:24px;box-shadow:0 1px 2px rgba(0,0,0,.03),0 24px 48px -32px rgba(0,0,0,.16)}
.ssp footer{max-width:1160px;width:100%;margin:0 auto;padding:24px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.ssp .fab{position:fixed;left:20px;bottom:20px;z-index:45;width:46px;height:46px;border-radius:50%;border:1px solid var(--border);background:var(--card);color:var(--fg);display:grid;place-items:center;box-shadow:0 10px 30px -12px rgba(0,0,0,.5);transition:transform .15s,border-color .2s}
.ssp .fab:hover{border-color:var(--fg)}
.ssp .fab:active{transform:scale(.9)}
@media (max-width:640px){.ssp .hero{padding-top:40px}.ssp .hero h1{font-size:40px}.ssp .hwrap,.ssp main,.ssp footer{padding-left:16px;padding-right:16px}}