:root {
    --sh-navy: #0A2350;
    --sh-navy-2: #0F2E66;
    --sh-blue: #0C4091;
    --sh-blue-tint: #E6ECF7;
    --sh-amber: #F5A524;
    --sh-amber-hover: #E8961A;
    --sh-ground: #F4F6FA;
    --sh-surface: #FFFFFF;
    --sh-ink: #0E1B33;
    --sh-muted: #5A6782;
    --sh-line: #E2E7F0;
    --sh-on-navy-soft: #C8D2E6;
    --sh-on-navy-muted: #8FA0C2;
    --sh-font-display: "Sora", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --sh-font-text: "Manrope", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --sh-radius: 14px;
    --sh-radius-sm: 9px;
    --sh-shadow: 0 1px 2px rgba(10, 35, 80, .05), 0 14px 34px -18px rgba(10, 35, 80, .3);
    --sh-container: 1200px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
[hidden] { display: none !important; }

body.sh-site {
    margin: 0;
    background: var(--sh-ground);
    color: var(--sh-ink);
    font: 500 16px/1.6 var(--sh-font-text);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
.sh-site img { max-width: 100%; height: auto; }
:where(body.sh-site:not(.sh-app-body)) a { color: inherit; }
.sh-site h1, .sh-site h2, .sh-site h3 { font-family: var(--sh-font-display); text-wrap: balance; margin: 0; }
.sh-site :focus-visible { outline: 3px solid var(--sh-amber); outline-offset: 2px; }

.sh-container { width: 100%; max-width: var(--sh-container); margin-inline: auto; padding-inline: 20px; }

.sh-skip {
    position: absolute; left: -9999px; top: 0; z-index: 100;
    background: var(--sh-amber); color: var(--sh-navy);
    padding: 10px 14px; border-radius: 0 0 8px 0; font-weight: 700; text-decoration: none;
}
.sh-skip:focus { left: 0; }

/* Buttons */
.sh-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    font: 700 15px/1 var(--sh-font-text);
    padding: 14px 22px; border-radius: var(--sh-radius-sm);
    border: 1.5px solid transparent; text-decoration: none; cursor: pointer; white-space: nowrap;
    transition: background-color .15s, border-color .15s, color .15s;
}
.sh-btn--sm { font-size: 14px; padding: 10px 16px; }
.sh-btn--amber { background: var(--sh-amber); color: var(--sh-navy); }
.sh-btn--amber:hover { background: var(--sh-amber-hover); color: var(--sh-navy); }
.sh-btn--navy { background: var(--sh-navy); color: #FFFFFF; }
.sh-btn--navy:hover { background: var(--sh-blue); color: #FFFFFF; }
.sh-btn--ghost { background: transparent; color: var(--sh-navy); border-color: var(--sh-line); }
.sh-btn--ghost:hover { border-color: var(--sh-navy); color: var(--sh-navy); }
.sh-btn--ghost-light { background: transparent; color: #FFFFFF; border-color: rgba(255, 255, 255, .35); }
.sh-btn--ghost-light:hover { border-color: #FFFFFF; color: #FFFFFF; }
.sh-btn-row { display: flex; flex-wrap: wrap; gap: 12px; }

/* Top bar */
.sh-topbar { position: sticky; top: 0; z-index: 50; background: var(--sh-surface); border-bottom: 1px solid var(--sh-line); }
.sh-topbar__row { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 72px; }
.sh-logo { display: inline-flex; align-items: center; flex: none; }
.sh-logo img { height: 48px; width: auto; display: block; }
.sh-topbar__actions { display: flex; align-items: center; gap: 10px; }

/* Hero */
.sh-hero { background: var(--sh-navy); color: #FFFFFF; overflow: hidden; }
.sh-hero__grid {
    display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    align-items: center; gap: 48px; padding-block: 72px 64px;
}
.sh-values { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0 0 20px; padding: 0; list-style: none; }
.sh-values li {
    display: inline-flex; align-items: center; gap: 7px;
    font: 600 14px/1.3 var(--sh-font-text); color: var(--sh-on-navy-soft); white-space: nowrap;
}
.sh-values li i { color: var(--sh-amber); font-size: 13px; }
.sh-hero h1 {
    font-size: clamp(34px, 5.2vw, 58px); line-height: 1.06; letter-spacing: -.03em;
    font-weight: 700; color: #FFFFFF; max-width: 20ch;
}
.sh-hero__lede { margin: 18px 0 32px; font-size: clamp(17px, 1.6vw, 19px); color: var(--sh-on-navy-soft); max-width: 46ch; }
.sh-hero__art { display: flex; justify-content: center; }
.sh-hero__halo { position: relative; display: block; width: 100%; max-width: 440px; }
.sh-hero__halo::before {
    content: ""; position: absolute; left: 5%; right: 5%; top: 52%; aspect-ratio: 1;
    transform: translateY(-50%); border-radius: 50%; background: var(--sh-navy-2);
}
.sh-hero__halo img { position: relative; display: block; width: 100%; }

/* Sections */
.sh-section { padding-block: 88px; }
.sh-eyebrow {
    margin: 0 0 12px; font: 700 12.5px/1.2 var(--sh-font-text);
    letter-spacing: .14em; text-transform: uppercase; color: var(--sh-blue);
}
.sh-h2 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.12; letter-spacing: -.025em; font-weight: 700; color: var(--sh-ink); }
.sh-body { margin: 16px 0 28px; color: var(--sh-muted); font-size: 17px; max-width: 48ch; }

/* About */
.sh-about__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 56px; align-items: center; }
.sh-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.sh-card { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: var(--sh-radius); padding: 26px 24px; }
.sh-card__icon {
    width: 46px; height: 46px; border-radius: 12px; margin-bottom: 18px;
    background: var(--sh-blue-tint); color: var(--sh-blue);
    display: grid; place-items: center; font-size: 19px;
}
.sh-card h3 { font-size: 18px; font-weight: 600; letter-spacing: -.01em; margin-bottom: 8px; }
.sh-card p { margin: 0; color: var(--sh-muted); font-size: 15px; line-height: 1.6; }
.sh-card--navy { background: var(--sh-navy); border-color: var(--sh-navy); color: #FFFFFF; }
.sh-card--navy .sh-card__icon { background: rgba(245, 165, 36, .16); color: var(--sh-amber); }
.sh-card--navy p { color: var(--sh-on-navy-soft); }

/* Solutions */
.sh-solutions { background: var(--sh-surface); border-top: 1px solid var(--sh-line); }
.sh-solutions__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px 32px; flex-wrap: wrap; margin-bottom: 36px; }
.sh-platforms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.sh-platform {
    display: flex; align-items: center; gap: 16px; padding: 20px;
    border: 1px solid var(--sh-line); border-radius: var(--sh-radius); background: var(--sh-surface);
}
.sh-platform__icon {
    width: 52px; height: 52px; border-radius: 14px; flex: none;
    background: var(--sh-navy); color: #FFFFFF; display: grid; place-items: center; font-size: 22px;
}
.sh-platform h3 { font-size: 17px; font-weight: 600; margin-bottom: 2px; }
.sh-platform p { margin: 0; color: var(--sh-muted); font-size: 14.5px; }

/* Section surfaces */
.sh-section--white { background: var(--sh-surface); }
.sh-section--line { border-top: 1px solid var(--sh-line); }
.sh-eyebrow--amber { color: var(--sh-amber); }
.sh-h2--light { color: #FFFFFF; }
.sh-body--light { color: var(--sh-on-navy-soft); }

/* Virtual numbers */
.sh-numbers__panel {
    background: var(--sh-navy); color: #FFFFFF; border-radius: 22px; padding: 56px;
    display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 48px; align-items: center;
}
.sh-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 30px; padding: 0; list-style: none; }
.sh-tags li {
    display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px;
    background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14);
    font: 600 13.5px/1.2 var(--sh-font-text); color: #E4EAF5;
}
.sh-tags li i { color: var(--sh-amber); }
.sh-otp-stack { display: flex; flex-direction: column; gap: 14px; width: 100%; max-width: 360px; margin-inline: auto; }
.sh-otp { background: #FFFFFF; color: var(--sh-ink); border-radius: 16px; padding: 18px 20px; box-shadow: 0 18px 40px -22px rgba(0, 0, 0, .55); }
.sh-otp__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 14px; font-weight: 700; }
.sh-otp__svc { display: inline-flex; align-items: center; gap: 10px; }
.sh-otp__svc i {
    width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center;
    background: var(--sh-blue-tint); color: var(--sh-blue); font-size: 16px;
}
.sh-otp__state { font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px; white-space: nowrap; }
.sh-otp__state--wait { background: #FFF4DE; color: #8A5A00; }
.sh-otp__state--ok { background: #E3F4EC; color: #0F6B45; }
.sh-otp__num { margin: 12px 0 0; font: 600 18px/1.2 var(--sh-font-display); font-variant-numeric: tabular-nums; }
.sh-otp__code {
    margin: 12px 0 0; padding-top: 12px; border-top: 1px dashed var(--sh-line);
    display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
    font-size: 13px; font-weight: 600; color: var(--sh-muted);
}
.sh-otp__code b { font: 700 24px/1 var(--sh-font-display); color: var(--sh-navy); letter-spacing: .08em; }

/* How it works */
.sh-steps { list-style: none; margin: 56px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 28px; }
.sh-step { position: relative; padding-top: 34px; border-top: 2px solid var(--sh-line); }
.sh-step__n {
    position: absolute; top: -21px; left: 0; width: 40px; height: 40px; border-radius: 50%;
    background: var(--sh-navy); color: #FFFFFF; display: grid; place-items: center;
    font: 700 16px/1 var(--sh-font-display); box-shadow: 0 0 0 6px var(--sh-surface);
}
.sh-step h3 { font-size: 19px; font-weight: 600; letter-spacing: -.01em; margin-bottom: 8px; }
.sh-step p { margin: 0; color: var(--sh-muted); font-size: 15.5px; max-width: 34ch; }

/* Sell with us + community */
.sh-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.sh-panel { border: 1px solid var(--sh-line); border-radius: 20px; padding: 40px; background: var(--sh-surface); }
.sh-panel--navy { background: var(--sh-navy); border-color: var(--sh-navy); color: #FFFFFF; }
.sh-panel__title { font-size: clamp(24px, 2.6vw, 30px); line-height: 1.15; font-weight: 700; letter-spacing: -.02em; margin-bottom: 10px; }
.sh-panel__lede { margin: 0 0 28px; color: var(--sh-muted); max-width: 44ch; }
.sh-panel--navy .sh-panel__lede { color: var(--sh-on-navy-soft); }
.sh-offers { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 22px; }
.sh-offer { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 16px; align-items: start; }
.sh-offer__icon {
    width: 46px; height: 46px; border-radius: 12px; background: var(--sh-blue-tint); color: var(--sh-blue);
    display: grid; place-items: center; font-size: 19px;
}
.sh-offer h3 { font-size: 17px; font-weight: 600; margin-bottom: 4px; }
.sh-offer p { margin: 0 0 8px; color: var(--sh-muted); font-size: 15px; }
.sh-link { color: var(--sh-blue); font-weight: 700; font-size: 15px; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.sh-link:hover { text-decoration: underline; color: var(--sh-blue); }
.sh-joins { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.sh-join {
    display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 12px; text-decoration: none;
    background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); color: #FFFFFF;
    transition: background-color .15s, border-color .15s;
}
.sh-join:hover { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .3); color: #FFFFFF; }
.sh-join__icon { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; font-size: 19px; background: rgba(245, 165, 36, .16); color: var(--sh-amber); flex: none; }
.sh-join strong { display: block; font-weight: 700; font-size: 15.5px; }
.sh-join small { display: block; color: var(--sh-on-navy-muted); font-size: 13px; }
.sh-join__go { margin-left: auto; color: var(--sh-on-navy-muted); }

/* Auth */
.sh-auth { display: grid; grid-template-columns: minmax(0, 44fr) minmax(0, 56fr); min-height: 100vh; min-height: 100dvh; }
.sh-auth__aside { background: var(--sh-navy); color: #FFFFFF; display: flex; align-items: center; justify-content: center; padding: 48px 40px; }
.sh-auth__aside-inner { width: 100%; max-width: 420px; }
.sh-auth__pitch { font: 700 clamp(26px, 2.6vw, 34px)/1.12 var(--sh-font-display); letter-spacing: -.025em; margin: 0 0 12px; color: #FFFFFF; text-wrap: balance; }
.sh-auth__pitch-sub { margin: 0 0 32px; color: var(--sh-on-navy-soft); max-width: 36ch; }
.sh-auth__art { background: #FFFFFF; border-radius: 24px; padding: 10px; max-width: min(340px, 42vh); }
.sh-auth__art img { display: block; width: 100%; height: auto; border-radius: 16px; }
.sh-auth__main { display: flex; align-items: center; justify-content: center; padding: 40px 20px; }
.sh-auth__card {
    width: 100%; max-width: 440px; background: var(--sh-surface);
    border: 1px solid var(--sh-line); border-radius: 20px; padding: 36px 32px; box-shadow: var(--sh-shadow);
}
.sh-auth__logo { display: inline-block; margin-bottom: 26px; }
.sh-auth__logo img { height: 48px; width: auto; display: block; }
.sh-auth__title { font: 700 26px/1.2 var(--sh-font-display); letter-spacing: -.02em; margin: 0 0 6px; color: var(--sh-ink); }
.sh-auth__sub { margin: 0 0 24px; color: var(--sh-muted); font-size: 15px; }
.sh-auth__alt { margin: 24px 0 0; padding-top: 20px; border-top: 1px solid var(--sh-line); font-size: 14.5px; color: var(--sh-muted); text-align: center; }
.sh-auth__alt a, .sh-note a { color: var(--sh-blue); font-weight: 700; text-decoration: none; }
.sh-auth__alt a:hover, .sh-note a:hover { text-decoration: underline; }
.sh-closed { text-align: center; }
.sh-closed__img { display: block; width: 100%; max-width: 180px; margin: 0 auto 20px; }
.sh-reason { text-align: left; background: var(--sh-ground); border-radius: 12px; padding: 14px 16px; margin-bottom: 20px; }
.sh-reason p { margin: 0; }
.sh-reason .sh-label { margin-bottom: 4px; }
.sh-resend { margin-top: 16px; text-align: center; }

/* Forms */
.sh-form { display: flex; flex-direction: column; gap: 16px; }
.sh-field { display: flex; flex-direction: column; gap: 7px; }
.sh-label { font-weight: 700; font-size: 14px; color: var(--sh-ink); }
.sh-label-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.sh-label-row a { font-size: 13.5px; font-weight: 700; color: var(--sh-blue); text-decoration: none; }
.sh-label-row a:hover { text-decoration: underline; }
.sh-input {
    width: 100%; height: 50px; padding: 0 14px; border: 1.5px solid var(--sh-line); border-radius: 10px;
    background: #FFFFFF; color: var(--sh-ink); font: 500 15.5px var(--sh-font-text);
    transition: border-color .15s, box-shadow .15s;
}
.sh-input::placeholder { color: #98A2B6; }
.sh-input:focus { outline: none; border-color: var(--sh-blue); box-shadow: 0 0 0 4px rgba(12, 64, 145, .12); }
.sh-input[readonly] { background: var(--sh-ground); color: var(--sh-muted); }
.sh-pass { position: relative; }
.sh-pass .sh-input { padding-right: 52px; }
.sh-pass__toggle {
    position: absolute; right: 5px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px;
    border: 0; border-radius: 8px; background: transparent; color: var(--sh-muted); font-size: 16px; cursor: pointer;
}
.sh-pass__toggle:hover { color: var(--sh-navy); background: var(--sh-ground); }
.sh-check { display: flex; align-items: flex-start; gap: 10px; font-size: 14.5px; color: var(--sh-muted); cursor: pointer; }
.sh-check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--sh-navy); flex: none; }
.sh-btn--block { width: 100%; padding-block: 16px; }
.sh-btn:disabled { opacity: .7; cursor: progress; }
.sh-code { height: 60px; text-align: center; font: 700 26px/1 var(--sh-font-display); letter-spacing: .5em; padding-left: .5em; }
.sh-note { font-size: 14px; color: var(--sh-muted); margin: 0; }
.sh-alert { border: 1px solid; border-radius: 10px; padding: 12px 14px; margin-bottom: 16px; font-size: 14.5px; font-weight: 600; }
.sh-alert--error { background: #FDECEC; border-color: #F6C9C9; color: #9B1C1C; }
.sh-alert--success { background: #E3F4EC; border-color: #BFE3D0; color: #0F6B45; }
.sh-alert--warning { background: #FFF4DE; border-color: #F5DDA6; color: #8A5A00; }
.sh-alert--info { background: var(--sh-blue-tint); border-color: #C9D6EE; color: var(--sh-blue); }

/* Footer */
.sh-footer { background: var(--sh-navy); color: var(--sh-on-navy-soft); font-size: 14px; }
.sh-footer__row { display: flex; justify-content: space-between; align-items: center; gap: 12px 24px; flex-wrap: wrap; min-height: 72px; padding-block: 18px; }
.sh-footer p { margin: 0; }
.sh-footer a { color: #FFFFFF; text-decoration: none; font-weight: 600; }
.sh-footer a:hover { text-decoration: underline; }
.sh-footer__links { display: flex; flex-wrap: wrap; gap: 8px 20px; }

/* Cookie notice */
.sh-cookie {
    position: fixed; left: 16px; bottom: 16px; z-index: 60; max-width: 380px;
    background: var(--sh-surface); color: var(--sh-ink);
    border: 1px solid var(--sh-line); border-radius: var(--sh-radius); box-shadow: var(--sh-shadow);
    padding: 18px 18px 16px; font-size: 14.5px;
}
.sh-cookie p { margin: 0 0 14px; color: var(--sh-muted); }
.sh-cookie a { color: var(--sh-blue); font-weight: 700; }

@media (max-width: 980px) {
    .sh-about__grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }
}
@media (max-width: 900px) {
    .sh-numbers__panel { grid-template-columns: minmax(0, 1fr); padding: 36px 28px; gap: 36px; }
    .sh-duo { grid-template-columns: minmax(0, 1fr); }
    .sh-hero__grid { grid-template-columns: minmax(0, 1fr); gap: 28px; padding-block: 48px 40px; }
    .sh-hero__halo { max-width: 320px; }
    .sh-platforms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
    .sh-section { padding-block: 64px; }
    .sh-cards, .sh-platforms, .sh-steps { grid-template-columns: minmax(0, 1fr); }
    .sh-numbers__panel { padding: 30px 20px; border-radius: 18px; }
    .sh-panel { padding: 28px 22px; }
    .sh-logo img { height: 40px; }
    .sh-topbar__row { min-height: 64px; }
}
@media (max-width: 480px) {
    .sh-cookie { left: 12px; right: 12px; max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .sh-btn { transition: none; }
}

@media (max-width: 960px) {
    .sh-auth { grid-template-columns: minmax(0, 1fr); }
    .sh-auth__aside { display: none; }
}
@media (max-width: 480px) {
    .sh-auth__main { padding: 24px 16px; align-items: flex-start; }
    .sh-auth__card { padding: 28px 20px; border-radius: 16px; }
    .sh-auth__logo img { height: 42px; }
}

/* App shell */
.sh-app { --sh-top-h: 68px; --sh-side-w: 256px; min-height: 100vh; }
.sh-app.is-rail { --sh-side-w: 76px; }
.sh-lock, .sh-lock body { overflow: hidden; }

.sh-top {
    position: sticky; top: 0; z-index: 40; height: var(--sh-top-h);
    display: flex; align-items: center; gap: 12px; padding: 0 20px;
    background: var(--sh-surface); border-bottom: 1px solid var(--sh-line);
}
.sh-top__menu {
    width: 42px; height: 42px; flex: none; border: 1px solid var(--sh-line); border-radius: 10px;
    background: var(--sh-surface); color: var(--sh-navy); font-size: 17px; cursor: pointer;
    display: grid; place-items: center; transition: background-color .15s, border-color .15s;
}
.sh-top__menu:hover { background: var(--sh-ground); border-color: #CBD3E1; }
.sh-top__logo { display: inline-flex; align-items: center; flex: none; }
.sh-top__logo img { height: 44px; width: auto; display: block; }
.sh-top__right { margin-left: auto; display: flex; align-items: center; gap: 10px; }

.sh-wallet {
    display: inline-flex; align-items: center; gap: 12px; text-decoration: none;
    background: var(--sh-navy); color: #FFFFFF; border-radius: 12px; padding: 6px 6px 6px 14px;
    transition: background-color .15s;
}
.sh-wallet:hover { background: var(--sh-blue); color: #FFFFFF; }
.sh-wallet__text { display: flex; flex-direction: column; line-height: 1.15; }
.sh-wallet__label { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--sh-on-navy-muted); }
.sh-wallet b { font: 600 15.5px/1.2 var(--sh-font-display); font-variant-numeric: tabular-nums; color: #FFFFFF; }
.sh-wallet__fund {
    display: inline-flex; align-items: center; gap: 5px; background: var(--sh-amber); color: var(--sh-navy);
    font-weight: 800; font-size: 13px; padding: 8px 11px; border-radius: 8px;
}

.sh-app__body { display: grid; grid-template-columns: var(--sh-side-w) minmax(0, 1fr); align-items: start; }
.sh-side {
    position: sticky; top: var(--sh-top-h); height: calc(100vh - var(--sh-top-h)); overflow-y: auto; overscroll-behavior: contain;
    background: var(--sh-navy); color: var(--sh-on-navy-soft); padding: 14px 12px 28px;
    display: flex; flex-direction: column; gap: 16px; scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .2) transparent;
}
.sh-side__top { display: none; justify-content: space-between; align-items: center; gap: 12px; }
.sh-side__logo { display: inline-flex; align-items: center; background: #FFFFFF; border-radius: 10px; padding: 5px 10px; }
.sh-side__logo img { height: 34px; width: auto; display: block; }
.sh-side__close {
    width: 38px; height: 38px; border: 0; border-radius: 9px; background: rgba(255, 255, 255, .08);
    color: #FFFFFF; font-size: 17px; cursor: pointer;
}
.sh-side__user {
    display: flex; align-items: center; gap: 11px; padding: 10px; border-radius: 12px; text-decoration: none;
    background: rgba(255, 255, 255, .06); color: #FFFFFF;
}
.sh-side__user:hover { background: rgba(255, 255, 255, .1); color: #FFFFFF; }
.sh-avatar {
    width: 38px; height: 38px; border-radius: 50%; flex: none; display: grid; place-items: center;
    background: var(--sh-amber); color: var(--sh-navy); font: 700 13.5px/1 var(--sh-font-display);
}
.sh-side__who { min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.sh-side__who strong { font-size: 14px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sh-side__who small { font-size: 12px; color: var(--sh-on-navy-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sh-nav { display: flex; flex-direction: column; gap: 14px; }
.sh-nav__group { display: flex; flex-direction: column; gap: 2px; }
.sh-nav__label { margin: 0 0 4px; padding: 0 10px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--sh-on-navy-muted); }
.sh-nav__link {
    display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 9px;
    color: var(--sh-on-navy-soft); text-decoration: none; font-size: 14.5px; font-weight: 600;
    transition: background-color .12s, color .12s;
}
.sh-nav__link i { width: 20px; text-align: center; font-size: 15.5px; color: var(--sh-on-navy-muted); flex: none; }
.sh-nav__link:hover { background: rgba(255, 255, 255, .07); color: #FFFFFF; }
.sh-nav__link.is-active { background: rgba(255, 255, 255, .11); color: #FFFFFF; }
.sh-nav__link.is-active i { color: var(--sh-amber); }
.sh-side__guest { display: flex; flex-direction: column; gap: 10px; padding: 6px 4px; }
.sh-side__guest p { margin: 0 0 6px; font-size: 14px; }

.sh-app__main { min-width: 0; display: flex; flex-direction: column; min-height: calc(100vh - var(--sh-top-h)); }
.sh-app__content { flex: 1; padding: 28px; min-width: 0; }
.sh-app__footer { padding: 18px 28px 24px; font-size: 13px; color: var(--sh-muted); }
.sh-app__overlay { display: none; }

@media (min-width: 1024px) {
    .sh-app.is-rail .sh-side { padding-inline: 10px; }
    .sh-app.is-rail .sh-side__user { justify-content: center; padding: 8px 0; background: transparent; }
    .sh-app.is-rail .sh-side__who,
    .sh-app.is-rail .sh-nav__link span,
    .sh-app.is-rail .sh-nav__label { display: none; }
    .sh-app.is-rail .sh-nav__group + .sh-nav__group { border-top: 1px solid rgba(255, 255, 255, .1); padding-top: 12px; }
    .sh-app.is-rail .sh-nav__link { justify-content: center; padding: 11px 0; }
    .sh-app.is-rail .sh-nav__link i { font-size: 17px; }
    .sh-app.is-rail .sh-side__guest { display: none; }
}

@media (max-width: 1023.98px) {
    .sh-app__body { grid-template-columns: minmax(0, 1fr); }
    .sh-side {
        position: fixed; z-index: 60; top: 0; bottom: 0; left: 0; height: auto; width: min(300px, 86vw);
        transform: translateX(-100%); transition: transform .22s ease;
    }
    .sh-side__top { display: flex; }
    .sh-app.is-open .sh-side { transform: none; box-shadow: 0 0 40px rgba(0, 0, 0, .25); }
    .sh-app__overlay { display: block; position: fixed; inset: 0; z-index: 55; background: rgba(10, 35, 80, .5); opacity: 0; pointer-events: none; transition: opacity .2s; }
    .sh-app.is-open .sh-app__overlay { opacity: 1; pointer-events: auto; }
    .sh-app__content { padding: 20px 16px; }
    .sh-app__footer { padding: 16px; }
}
@media (max-width: 560px) {
    .sh-top { padding: 0 12px; gap: 10px; }
    .sh-top__logo img { height: 36px; }
    .sh-wallet { padding-left: 10px; gap: 8px; }
    .sh-wallet__label { display: none; }
    .sh-wallet b { font-size: 14px; }
    .sh-wallet__fund span { display: none; }
    .sh-wallet__fund { padding: 8px 9px; }
}
@media (prefers-reduced-motion: reduce) {
    .sh-side, .sh-app__overlay, .sh-nav__link, .sh-wallet, .sh-top__menu { transition: none; }
}

/* Compatibility for pages not yet redesigned */
.sh-app {
    --bs-primary: #0C4091; --bs-primary-rgb: 12, 64, 145;
    --bs-link-color: #0C4091; --bs-link-color-rgb: 12, 64, 145; --bs-link-hover-color: #0A2350;
    --bs-body-font-family: var(--sh-font-text); --bs-body-bg: var(--sh-ground); --bs-body-color: var(--sh-ink);
}
.sh-app .pc-container { position: static; margin: 0; top: auto; min-height: 0; padding: 0; background: transparent; }
.sh-app .pc-container .pc-content { padding: 0; }
.sh-app h1, .sh-app h2, .sh-app h3, .sh-app h4, .sh-app h5, .sh-app h6 { font-family: var(--sh-font-display); color: var(--sh-ink); }
.sh-app .card { border: 1px solid var(--sh-line); border-radius: 14px; box-shadow: none; }
:where(.sh-app__content) :is(h1, h2, h3, h4, h5, h6) { margin-top: 0; margin-bottom: .5rem; }
.sh-app .btn-primary {
    --bs-btn-color: #FFFFFF; --bs-btn-hover-color: #FFFFFF; --bs-btn-active-color: #FFFFFF; --bs-btn-disabled-color: #FFFFFF;
    --bs-btn-bg: #0C4091; --bs-btn-border-color: #0C4091;
    --bs-btn-hover-bg: #0A2350; --bs-btn-hover-border-color: #0A2350;
    --bs-btn-active-bg: #0A2350; --bs-btn-active-border-color: #0A2350;
    --bs-btn-disabled-bg: #0C4091; --bs-btn-disabled-border-color: #0C4091;
}
.sh-app .text-primary { color: #0C4091 !important; }
.sh-app .bg-primary { background-color: #0C4091 !important; }
.sh-app .table { --bs-table-bg: transparent; }

/* Shop */
.sh-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sh-shop { display: flex; flex-direction: column; gap: 22px; max-width: 1180px; }

.sh-promo { position: relative; border-radius: 16px; overflow: hidden; background: var(--sh-surface); border: 1px solid var(--sh-line); }
.sh-promo__viewport { overflow: hidden; }
.sh-promo__track { display: flex; transition: transform .5s ease; }
.sh-promo__slide { flex: 0 0 100%; }
.sh-promo__slide img { display: block; width: 100%; height: auto; aspect-ratio: 1404 / 403; object-fit: cover; }
.sh-promo__nav {
    position: absolute; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; border-radius: 50%;
    border: 0; background: rgba(10, 35, 80, .75); color: #FFFFFF; cursor: pointer; display: grid; place-items: center;
}
.sh-promo__nav:hover { background: var(--sh-navy); }
.sh-promo__nav--prev { left: 12px; }
.sh-promo__nav--next { right: 12px; }
.sh-promo__dots { position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: center; gap: 6px; }
.sh-promo__dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: rgba(10, 35, 80, .3); cursor: pointer; transition: width .2s, background-color .2s; }
.sh-promo__dot[aria-current="true"] { width: 22px; background: var(--sh-navy); }

.sh-quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.sh-quick__item {
    display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; text-decoration: none;
    background: var(--sh-surface); border: 1px solid var(--sh-line); color: var(--sh-ink);
    transition: border-color .15s, box-shadow .15s;
}
.sh-quick__item:hover { border-color: #C9D3E6; box-shadow: 0 6px 18px -12px rgba(10, 35, 80, .35); color: var(--sh-ink); }
.sh-quick__icon {
    width: 42px; height: 42px; border-radius: 11px; flex: none; display: grid; place-items: center;
    background: var(--sh-navy); color: #FFFFFF; font-size: 17px;
}
.sh-quick__icon--wa { background: #E7F6EE; color: #128C4B; font-size: 20px; }
.sh-quick__item strong { display: block; font-size: 14.5px; font-weight: 700; line-height: 1.25; }
.sh-quick__item small { display: block; font-size: 12.5px; color: var(--sh-muted); line-height: 1.3; }

.sh-shop__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-top: 6px; }
.sh-app .sh-shop__title { font: 700 26px/1.2 var(--sh-font-display); letter-spacing: -.02em; margin: 0; }
.sh-shop__sub { margin: 2px 0 0; color: var(--sh-muted); font-size: 14.5px; }
.sh-jump { min-width: 320px; }

.sh-dd { position: relative; width: 100%; }
.sh-dd__native { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0 !important; pointer-events: none; }
.sh-dd__btn {
    width: 100%; height: 50px; display: flex; align-items: center; gap: 10px; padding: 0 14px;
    border: 1.5px solid var(--sh-line); border-radius: 10px; background: #FFFFFF; color: var(--sh-ink);
    font: 600 15px var(--sh-font-text); text-align: left; cursor: pointer; transition: border-color .15s, box-shadow .15s;
}
.sh-dd__btn:hover { border-color: #C5CFE0; }
.sh-dd__btn:focus-visible, .sh-dd.is-open .sh-dd__btn { outline: none; border-color: var(--sh-blue); box-shadow: 0 0 0 4px rgba(12, 64, 145, .12); }
.sh-dd__btn:disabled { background: var(--sh-ground); color: #98A2B6; cursor: not-allowed; border-color: var(--sh-line); }
.sh-dd.is-invalid .sh-dd__btn { border-color: #D64545; }
.sh-dd__icon { color: var(--sh-blue); flex: none; }
.sh-dd__value { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sh-dd__value.is-placeholder { color: var(--sh-muted); font-weight: 500; }
.sh-dd__btn:disabled .sh-dd__value { color: #98A2B6; }
.sh-dd__chev { flex: none; font-size: 12px; color: var(--sh-muted); transition: transform .15s; }
.sh-dd__spin { display: none; flex: none; width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--sh-blue-tint); border-top-color: var(--sh-blue); animation: sh-spin .7s linear infinite; }
.sh-dd.is-loading .sh-dd__spin { display: block; }
.sh-dd.is-loading .sh-dd__chev { display: none; }
.sh-dd.is-loading .sh-dd__btn:disabled { background: #FFFFFF; cursor: progress; }
.sh-bal-flash { animation: shBalFlash 1.4s ease-out; }
@keyframes shBalFlash { 0%, 35% { color: var(--sh-amber); } 100% { color: inherit; } }
@media (prefers-reduced-motion: reduce) { .sh-bal-flash { animation: none; } }
.sh-dd.is-open .sh-dd__chev { transform: rotate(180deg); color: var(--sh-blue); }
.sh-dd__panel {
    position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 45; padding: 6px;
    background: #FFFFFF; border: 1px solid var(--sh-line); border-radius: 14px;
    box-shadow: 0 24px 48px -20px rgba(10, 35, 80, .35), 0 2px 6px rgba(10, 35, 80, .06);
    animation: shDdIn .12s ease-out;
}
.sh-dd--up .sh-dd__panel { top: auto; bottom: calc(100% + 8px); }
@keyframes shDdIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.sh-dd__search { position: relative; margin: 0 0 6px; }
.sh-dd__search i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--sh-muted); font-size: 13px; pointer-events: none; }
.sh-dd__search input {
    width: 100%; height: 42px; padding: 0 12px 0 34px; border: 1.5px solid var(--sh-line); border-radius: 9px;
    background: var(--sh-ground); color: var(--sh-ink); font: 500 14.5px var(--sh-font-text);
}
.sh-dd__search input:focus { outline: none; border-color: var(--sh-blue); background: #FFFFFF; }
.sh-dd__list { list-style: none; margin: 0; padding: 0; max-height: 288px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #D5DCE8 transparent; }
.sh-dd__opt {
    display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 9px; cursor: pointer;
    font: 500 14.5px/1.35 var(--sh-font-text); color: var(--sh-ink);
}
.sh-dd__opt[hidden] { display: none; }
.sh-dd__opt span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.sh-dd__opt.is-active { background: var(--sh-blue-tint); }
.sh-dd__opt[aria-selected="true"] { font-weight: 700; color: var(--sh-navy); }
.sh-dd__opt[aria-disabled="true"] { color: #98A2B6; cursor: not-allowed; }
.sh-dd__tick { flex: none; font-size: 12px; color: var(--sh-blue); }
.sh-dd__none { margin: 0; padding: 14px 12px; text-align: center; color: var(--sh-muted); font-size: 14px; }
@media (max-width: 620px) {
    .sh-dd__list { max-height: 50vh; }
}
@media (prefers-reduced-motion: reduce) {
    .sh-dd__panel { animation: none; }
    .sh-dd__chev { transition: none; }
}

.sh-cat { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; overflow: hidden; }
.sh-cat__head { display: flex; align-items: baseline; gap: 10px 14px; flex-wrap: wrap; padding: 16px 20px 12px; }
.sh-app .sh-cat__name { font: 700 17px/1.3 var(--sh-font-display); letter-spacing: -.01em; margin: 0; color: var(--sh-ink); }
.sh-cat__count { font-size: 12.5px; font-weight: 700; color: var(--sh-blue); background: var(--sh-blue-tint); padding: 3px 9px; border-radius: 999px; }
.sh-cat__all { margin-left: auto; font-size: 14px; font-weight: 700; color: var(--sh-blue); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.sh-cat__all:hover { color: var(--sh-navy); text-decoration: underline; }

.sh-rows { padding: 0 20px 6px; }
.sh-rows__head, .sh-row {
    display: grid; grid-template-columns: 36px minmax(0, 1fr) 110px 132px 96px; gap: 16px; align-items: center;
}
.sh-rows__head {
    padding: 8px 0; border-top: 1px solid var(--sh-line); border-bottom: 1px solid var(--sh-line);
    font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--sh-muted);
}
.sh-rows__head span:nth-child(3), .sh-rows__head span:nth-child(4) { text-align: right; }
.sh-row { padding: 12px 0; border-bottom: 1px solid var(--sh-line); }
.sh-row:last-child { border-bottom: 0; }
.sh-row__img img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; display: block; background: var(--sh-ground); }
.sh-row__initial { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--sh-blue-tint); color: var(--sh-blue); font: 700 14px/1 var(--sh-font-display); }
.sh-row__name { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.sh-row__title { font-weight: 700; font-size: 14.5px; line-height: 1.35; color: var(--sh-ink); text-decoration: none; overflow-wrap: anywhere; }
a.sh-row__title:hover { color: var(--sh-blue); text-decoration: underline; }
.sh-row__tags { display: flex; flex-wrap: wrap; gap: 4px; }
.sh-row__tags span { font-size: 11.5px; font-weight: 600; color: #3B4A66; background: var(--sh-ground); border: 1px solid var(--sh-line); padding: 1px 7px; border-radius: 6px; }
.sh-row__price { text-align: right; font: 700 15.5px/1.2 var(--sh-font-display); color: var(--sh-navy); font-variant-numeric: tabular-nums; white-space: nowrap; }
.sh-row__stock { text-align: right; font-size: 13px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sh-stock--in { color: #0F7A4F; }
.sh-stock--low { color: #8A5A00; }
.sh-stock--out { color: #B42318; }
.sh-row__act { display: flex; justify-content: flex-end; }
.sh-row__act .sh-btn { min-width: 76px; }
.sh-btn--off { background: #EEF1F6; color: #8C97AB; cursor: not-allowed; }
.sh-row--out .sh-row__title, .sh-row--out .sh-row__price { color: var(--sh-muted); }

.sh-tile {
    display: flex; align-items: center; gap: 16px; padding: 16px 20px; border-radius: 16px;
}
.sh-tile--navy { background: var(--sh-navy); color: #FFFFFF; }
.sh-tile--light { background: var(--sh-blue-tint); color: var(--sh-ink); border: 1px solid #D3DDF0; }
.sh-tile__icon { width: 44px; height: 44px; border-radius: 12px; flex: none; display: grid; place-items: center; font-size: 18px; }
.sh-tile--navy .sh-tile__icon { background: rgba(245, 165, 36, .16); color: var(--sh-amber); }
.sh-tile--light .sh-tile__icon { background: var(--sh-navy); color: #FFFFFF; }
.sh-tile__body { flex: 1; min-width: 0; }
.sh-app .sh-tile__body h3 { font: 700 16.5px/1.3 var(--sh-font-display); margin: 0 0 2px; color: inherit; }
.sh-tile__body p { margin: 0; font-size: 14px; }
.sh-tile--navy p { color: var(--sh-on-navy-soft); }
.sh-tile--light p { color: var(--sh-muted); }
.sh-tile > .sh-btn { flex: none; }
.sh-tile__more { margin-top: 6px; font-size: 13.5px; }
.sh-tile__more summary { cursor: pointer; font-weight: 700; color: var(--sh-blue); width: max-content; }
.sh-tile__chips { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.sh-tile__chips li { background: var(--sh-surface); border: 1px solid #D3DDF0; border-radius: 999px; padding: 3px 10px; font-size: 12.5px; font-weight: 600; }

.sh-empty { text-align: center; padding: 48px 20px; background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; }
.sh-empty img { max-width: 200px; margin: 0 auto 18px; display: block; }
.sh-app .sh-empty h2 { font: 700 20px/1.3 var(--sh-font-display); margin: 0 0 6px; }
.sh-empty p { margin: 0; color: var(--sh-muted); }
.sh-empty .sh-btn { margin-top: 18px; }

.sh-modal {
    position: fixed; inset: 0; z-index: 90; display: grid; grid-template-columns: minmax(0, 1fr); place-items: center; padding: 16px;
    background: rgba(10, 35, 80, .55);
}
.sh-modal__card {
    position: relative; width: 100%; max-width: 440px; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow-y: auto;
    background: var(--sh-surface); border-radius: 20px;
    padding: 32px 28px 26px; text-align: center; box-shadow: 0 30px 60px -20px rgba(10, 35, 80, .5);
}
.sh-modal .sh-btn { white-space: normal; line-height: 1.3; }
@media (max-width: 480px) {
    .sh-modal__card { padding: 28px 20px 22px; border-radius: 18px; }
}
.sh-modal__close {
    position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 0; border-radius: 9px;
    background: var(--sh-ground); color: var(--sh-muted); font-size: 16px; cursor: pointer;
}
.sh-modal__close:hover { color: var(--sh-navy); }
.sh-modal__icon {
    width: 56px; height: 56px; border-radius: 16px; margin: 0 auto 14px; display: grid; place-items: center;
    background: #E6F3FB; color: #229ED9; font-size: 28px;
}
.sh-app .sh-modal__title { font: 700 22px/1.25 var(--sh-font-display); margin: 0 0 12px; }
.sh-modal__note {
    display: inline-flex; align-items: center; gap: 7px; margin: 0 0 12px; padding: 6px 12px; border-radius: 999px;
    background: #FFF4DE; color: #8A5A00; font-size: 13.5px; font-weight: 700;
}
.sh-modal__text { margin: 0 0 20px; color: var(--sh-muted); font-size: 15px; }

@media (max-width: 1100px) {
    .sh-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .sh-rows__head { display: none; }
    .sh-rows { padding: 0 16px 4px; }
    .sh-cat__head { padding: 14px 16px 10px; }
    .sh-row {
        grid-template-columns: 36px minmax(0, 1fr) auto; grid-template-areas: "img name name" "img price act" "img stock act";
        gap: 4px 12px; align-items: start;
    }
    .sh-row__img { grid-area: img; }
    .sh-row__name { grid-area: name; margin-bottom: 4px; }
    .sh-row__price { grid-area: price; text-align: left; }
    .sh-row__stock { grid-area: stock; text-align: left; }
    .sh-row__act { grid-area: act; align-self: center; }
    .sh-tile { flex-wrap: wrap; padding: 16px; }
    .sh-tile > .sh-btn { width: 100%; }
    .sh-jump { min-width: 0; width: 100%; }
    .sh-promo { border-radius: 12px; }
    .sh-promo__nav { width: 30px; height: 30px; font-size: 12px; }
}
@media (max-width: 480px) {
    .sh-quick { gap: 8px; }
    .sh-quick__item { padding: 8px 10px; gap: 8px; border-radius: 12px; }
    .sh-quick__item > span:last-child { min-width: 0; }
    .sh-quick__icon { width: 30px; height: 30px; font-size: 13px; border-radius: 8px; }
    .sh-quick__icon--wa { font-size: 15px; }
    .sh-quick__item strong { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .sh-quick__item small { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .sh-promo__track, .sh-promo__dot, .sh-quick__item { transition: none; }
}

/* Product pages */
.sh-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--sh-muted); }
.sh-crumbs a { color: var(--sh-blue); text-decoration: none; }
.sh-crumbs a:hover { text-decoration: underline; }
.sh-crumbs i { font-size: 10px; color: #A3AEC2; }
.sh-crumbs [aria-current] { color: var(--sh-ink); }

.sh-search {
    position: relative; display: flex; align-items: center; min-width: 280px;
    background: var(--sh-surface); border: 1.5px solid var(--sh-line); border-radius: 10px;
}
.sh-search > i { position: absolute; left: 13px; color: var(--sh-muted); pointer-events: none; }
.sh-search input {
    width: 100%; height: 46px; border: 0; background: transparent; padding: 0 40px 0 38px;
    font: 500 14.5px var(--sh-font-text); color: var(--sh-ink);
}
.sh-search input:focus { outline: none; }
.sh-search:focus-within { border-color: var(--sh-blue); box-shadow: 0 0 0 4px rgba(12, 64, 145, .12); }
.sh-search__clear { position: absolute; right: 8px; width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; color: var(--sh-muted); text-decoration: none; }
.sh-search__clear:hover { background: var(--sh-ground); color: var(--sh-navy); }
.sh-rows--top { padding-top: 0; }
.sh-rows--top .sh-rows__head { border-top: 0; }
.sh-empty--flat { border: 0; border-radius: 0; }
.sh-empty a { color: var(--sh-blue); font-weight: 700; }

.sh-pd { display: flex; flex-direction: column; gap: 20px; max-width: 1180px; }
.sh-pd__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; grid-template-areas: "top buy" "info buy"; grid-template-rows: auto 1fr; gap: 20px; align-items: start; }
.sh-pd__top { grid-area: top; }
.sh-pd__info { grid-area: info; }
.sh-pd__grid > .sh-buy { grid-area: buy; }
.sh-pd__info > .sh-pd__desc:first-child { border-top: 0; padding-top: 0; }
.sh-pd__main { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; padding: 26px; display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.sh-pd__head { display: flex; gap: 16px; align-items: flex-start; }
.sh-pd__img { flex: none; }
.sh-pd__img img { width: 64px; height: 64px; max-width: none; border-radius: 16px; object-fit: cover; display: block; background: var(--sh-ground); }
.sh-pd__initial { width: 64px; height: 64px; border-radius: 16px; font-size: 24px; }
.sh-pd__titles { min-width: 0; }
.sh-pd__cat { margin: 0 0 4px; font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--sh-blue); }
.sh-app .sh-pd__title { font: 700 clamp(20px, 2.2vw, 26px)/1.25 var(--sh-font-display); letter-spacing: -.015em; margin: 0; overflow-wrap: anywhere; }
.sh-pd__desc { color: var(--sh-ink); font-size: 15px; line-height: 1.7; overflow-wrap: anywhere; border-top: 1px solid var(--sh-line); padding-top: 20px; }
.sh-pd__desc img { max-width: 100%; height: auto; }
.sh-pd__desc p { margin: 0 0 10px; }
.sh-pd__desc a { color: var(--sh-blue); }
.sh-pd__rules { display: flex; gap: 14px; background: var(--sh-ground); border-radius: 12px; padding: 16px 18px; }
.sh-pd__rules-icon { width: 38px; height: 38px; border-radius: 10px; flex: none; display: grid; place-items: center; background: var(--sh-navy); color: #FFFFFF; font-size: 15px; }
.sh-app .sh-pd__rules h2 { font: 700 15px/1.3 var(--sh-font-display); margin: 0 0 4px; }
.sh-pd__rules p { margin: 0 0 6px; color: var(--sh-muted); font-size: 14px; }
.sh-textbtn { border: 0; background: none; padding: 0; font: inherit; font-weight: 700; color: var(--sh-blue); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.sh-textbtn:hover { color: var(--sh-navy); }

.sh-buy {
    position: sticky; top: calc(var(--sh-top-h) + 20px);
    background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; padding: 22px;
    box-shadow: 0 14px 34px -24px rgba(10, 35, 80, .45);
}
.sh-buy .sh-form { gap: 14px; }
.sh-buy__price { display: flex; flex-direction: column; gap: 2px; }
.sh-buy__price span { font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--sh-muted); }
.sh-buy__price b { font: 700 30px/1.1 var(--sh-font-display); color: var(--sh-navy); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.sh-buy__stock { margin: 0; font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 7px; }
.sh-qty { display: grid; grid-template-columns: 48px minmax(0, 1fr) 48px; border: 1.5px solid var(--sh-line); border-radius: 10px; overflow: hidden; background: #FFFFFF; }
.sh-qty button { border: 0; background: var(--sh-ground); color: var(--sh-navy); font-size: 14px; cursor: pointer; height: 48px; }
.sh-qty button:hover { background: #E4E9F2; }
.sh-qty input {
    border: 0; border-inline: 1.5px solid var(--sh-line); text-align: center; height: 48px; min-width: 0;
    font: 700 17px var(--sh-font-display); color: var(--sh-ink); -moz-appearance: textfield; appearance: textfield;
}
.sh-qty input::-webkit-outer-spin-button, .sh-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.sh-qty input:focus { outline: none; background: #F8FAFE; }
.sh-qty:focus-within { border-color: var(--sh-blue); box-shadow: 0 0 0 4px rgba(12, 64, 145, .12); }
.sh-buy__total { display: flex; justify-content: space-between; align-items: baseline; padding: 12px 0; border-top: 1px dashed var(--sh-line); border-bottom: 1px dashed var(--sh-line); }
.sh-buy__total span { font-weight: 700; color: var(--sh-muted); }
.sh-buy__total b { font: 700 22px/1.1 var(--sh-font-display); color: var(--sh-ink); font-variant-numeric: tabular-nums; }
.sh-buy__wallet { margin: 0; font-size: 14px; color: var(--sh-muted); }
.sh-buy__wallet b { color: var(--sh-ink); font-variant-numeric: tabular-nums; }
.sh-buy__short { margin: 0; padding: 10px 12px; border-radius: 10px; background: #FFF4DE; color: #8A5A00; font-size: 14px; font-weight: 600; }
.sh-buy__short a { color: var(--sh-navy); font-weight: 800; }
.sh-buy__note { margin: 0; text-align: center; font-size: 14px; color: var(--sh-muted); }
.sh-buy__note a { color: var(--sh-blue); font-weight: 700; }
.sh-buy__terms { margin: 0; text-align: center; font-size: 13px; color: var(--sh-muted); }

.sh-modal__card--left { text-align: left; }
.sh-modal__warn { margin: 0 0 20px; padding: 12px 14px; border-radius: 10px; background: #FDECEC; color: #9B1C1C; font-weight: 700; font-size: 14px; }

@media (max-width: 1100px) {
    .sh-pd__grid { grid-template-columns: minmax(0, 1fr) 320px; }
}
@media (max-width: 900px) {
    .sh-pd__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "top" "buy" "info"; grid-template-rows: none; }
    .sh-buy { position: static; }
    .sh-search { min-width: 0; width: 100%; }
}
@media (max-width: 560px) {
    .sh-pd { gap: 14px; }
    .sh-pd__grid { gap: 14px; }
    .sh-pd__main { padding: 16px; gap: 16px; }
    .sh-pd__head { gap: 12px; align-items: center; }
    .sh-pd__img img, .sh-pd__initial { width: 44px; height: 44px; border-radius: 11px; font-size: 18px; }
    .sh-pd__cat { display: none; }
    .sh-app .sh-pd__title { font-size: 18px; line-height: 1.3; }
    .sh-pd__desc { font-size: 14px; line-height: 1.6; }
    .sh-pd__rules { padding: 14px; gap: 12px; }
    .sh-pd__rules-icon { display: none; }
    .sh-pd__rules p { font-size: 13.5px; }
    .sh-buy { padding: 18px; }
}

/* Wallet menu */
.sh-walletmenu { position: relative; }
button.sh-wallet { border: 0; cursor: pointer; font: inherit; text-align: left; }
.sh-walletpanel {
    position: absolute; right: 0; top: calc(100% + 10px); z-index: 70; width: min(340px, calc(100vw - 24px));
    background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; padding: 14px;
    box-shadow: 0 24px 48px -20px rgba(10, 35, 80, .45); display: flex; flex-direction: column; gap: 8px;
}
.sh-walletpanel__title { margin: 0 0 2px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--sh-muted); }
.sh-wrow {
    display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 12px; align-items: center;
    padding: 12px; border-radius: 12px; border: 1px solid var(--sh-line);
}
.sh-wrow.is-current { background: var(--sh-blue-tint); border-color: #C9D6EE; }
.sh-wrow__icon { width: 38px; height: 38px; border-radius: 10px; background: var(--sh-navy); color: #FFFFFF; display: grid; place-items: center; font-size: 15px; }
.sh-wrow__text { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.sh-wrow__text strong { font-size: 14.5px; font-weight: 700; color: var(--sh-ink); }
.sh-wrow__text small { font-size: 12px; color: var(--sh-muted); }
.sh-wrow__text b { margin-top: 3px; font: 700 16px/1.2 var(--sh-font-display); color: var(--sh-navy); font-variant-numeric: tabular-nums; }
.sh-walletpanel__link { display: inline-flex; align-items: center; gap: 6px; padding: 6px 4px 2px; font-size: 13.5px; font-weight: 700; color: var(--sh-blue); text-decoration: none; }
.sh-walletpanel__link:hover { text-decoration: underline; color: var(--sh-navy); }

/* Account pages */
.sh-page { display: flex; flex-direction: column; gap: 20px; max-width: 1180px; }
.sh-page__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.sh-app .sh-page__title { font: 700 clamp(22px, 2.4vw, 28px)/1.2 var(--sh-font-display); letter-spacing: -.02em; margin: 0; }
.sh-page__sub { margin: 4px 0 0; color: var(--sh-muted); font-size: 14.5px; }
.sh-back { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--sh-blue); text-decoration: none; width: max-content; }
.sh-back:hover { text-decoration: underline; color: var(--sh-navy); }

.sh-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.sh-stat { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.sh-stat--navy { background: var(--sh-navy); border-color: var(--sh-navy); color: #FFFFFF; }
.sh-stat__label { margin: 0; font-size: 13px; font-weight: 700; color: var(--sh-muted); display: flex; align-items: center; gap: 8px; }
.sh-stat__label i { color: var(--sh-blue); }
.sh-stat--navy .sh-stat__label { color: var(--sh-on-navy-soft); }
.sh-stat--navy .sh-stat__label i { color: var(--sh-amber); }
.sh-stat__value { margin: 0 0 6px; font: 700 clamp(20px, 2vw, 26px)/1.15 var(--sh-font-display); font-variant-numeric: tabular-nums; letter-spacing: -.02em; overflow-wrap: anywhere; }
.sh-stat__actions { display: flex; flex-direction: column; gap: 8px; margin-top: auto; }
.sh-stat__actions .sh-btn { width: 100%; padding-inline: 14px; }
.sh-stat .sh-link { margin-top: auto; }

.sh-merchant { display: flex; align-items: center; gap: 16px; background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; padding: 16px 18px; flex-wrap: wrap; }
.sh-merchant__icon { width: 46px; height: 46px; border-radius: 12px; flex: none; display: grid; place-items: center; background: var(--sh-blue-tint); color: var(--sh-blue); font-size: 19px; }
.sh-merchant__body { flex: 1; min-width: 220px; }
.sh-app .sh-merchant__body h2 { font: 700 16.5px/1.3 var(--sh-font-display); margin: 0 0 2px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sh-merchant__body p { margin: 0; color: var(--sh-muted); font-size: 14px; }
@media (max-width: 560px) {
    .sh-merchant { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px 14px; padding: 16px; }
    .sh-merchant__icon { width: 40px; height: 40px; border-radius: 11px; font-size: 17px; }
    .sh-merchant__body { min-width: 0; }
    .sh-app .sh-merchant__body h2 { font-size: 16px; gap: 6px 8px; min-height: 40px; }
    .sh-merchant__body p { margin-top: 2px; }
    .sh-merchant > .sh-btn { grid-column: 1 / -1; width: 100%; }
}

.sh-box { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; overflow: hidden; }
.sh-box--pad { padding: 22px; overflow: visible; }
.sh-box__head { display: flex; justify-content: space-between; align-items: center; gap: 12px 16px; flex-wrap: wrap; padding: 16px 20px; border-bottom: 1px solid var(--sh-line); }
.sh-app .sh-box__title { font: 700 17px/1.3 var(--sh-font-display); margin: 0; }
.sh-box__note { margin: 3px 0 0; font-size: 13.5px; color: var(--sh-muted); }
.sh-pager { padding: 14px 20px; border-top: 1px solid var(--sh-line); }
.sh-pager nav { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sh-pager nav > .d-sm-none { display: none; }
.sh-pager nav > .d-sm-flex { display: flex; flex: 1; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.sh-pager nav p.small { margin: 0; font-size: 13.5px; color: var(--sh-muted); }
.sh-pager nav p.small .fw-semibold { font-weight: 700; color: var(--sh-ink); }
.sh-pager .pagination { display: flex; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; gap: 6px; }
.sh-pager .page-item { margin: 0; }
.sh-pager .page-link {
    display: grid; place-items: center; min-width: 38px; height: 38px; padding: 0 12px; margin: 0 !important;
    border: 1px solid var(--sh-line) !important; border-radius: 9px !important; background: var(--sh-surface);
    color: var(--sh-navy); font: 700 14px/1 var(--sh-font-text); text-decoration: none; box-shadow: none !important;
}
.sh-pager a.page-link:hover { border-color: var(--sh-navy) !important; color: var(--sh-navy); background: var(--sh-surface); }
.sh-pager .page-item.active .page-link { background: var(--sh-navy); border-color: var(--sh-navy) !important; color: #FFFFFF; }
.sh-pager .page-item.disabled .page-link { background: var(--sh-ground); color: #A9B3C6; cursor: default; }
@media (max-width: 575.98px) {
    .sh-pager nav > .d-sm-none { display: flex; flex: 1; }
    .sh-pager nav > .d-sm-flex { display: none; }
    .sh-pager nav > .d-sm-none .pagination { width: 100%; justify-content: space-between; }
    .sh-pager nav > .d-sm-none .page-link { padding: 0 16px; }
}

.sh-txlist { display: flex; flex-direction: column; }
.sh-tx {
    display: grid; grid-template-columns: 40px minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr) 118px 44px; gap: 14px; align-items: center;
    padding: 14px 20px; border-bottom: 1px solid var(--sh-line);
}
.sh-tx:last-child { border-bottom: 0; }
.sh-tx--order { grid-template-columns: 40px minmax(0, 1.8fr) minmax(0, 1fr) minmax(0, 1fr) 118px; }
.sh-tx__icon { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; font-size: 15px; }
.sh-tx__icon.is-in { background: #E3F4EC; color: #0F7A4F; }
.sh-tx__icon.is-out { background: var(--sh-blue-tint); color: var(--sh-blue); }
.sh-tx__main { min-width: 0; display: flex; flex-direction: column; line-height: 1.35; }
.sh-tx__main strong { font-size: 14.5px; font-weight: 700; overflow-wrap: anywhere; }
.sh-tx__main small, .sh-tx__when small, .sh-tx__amt small { display: block; font-size: 12.5px; color: var(--sh-muted); font-weight: 500; overflow-wrap: anywhere; }
.sh-tx__main small a { color: var(--sh-blue); font-weight: 700; }
.sh-tx__when { font-size: 13.5px; line-height: 1.35; }
.sh-tx__amt { text-align: right; font: 700 15px/1.3 var(--sh-font-display); font-variant-numeric: tabular-nums; }
.sh-tx__amt.is-in { color: #0F7A4F; }
.sh-tx__amt small { font-family: var(--sh-font-text); }
.sh-tx__status { display: flex; justify-content: flex-end; }
.sh-tx__act, .sh-tx__open { display: flex; justify-content: flex-end; gap: 6px; }
.sh-iconbtn {
    width: 36px; height: 36px; border-radius: 9px; border: 1px solid var(--sh-line); background: var(--sh-surface);
    color: var(--sh-navy); display: grid; place-items: center; cursor: pointer; text-decoration: none;
}
.sh-iconbtn:hover { background: var(--sh-ground); color: var(--sh-navy); }
.sh-status { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.sh-status--ok { background: #E3F4EC; color: #0F6B45; }
.sh-status--wait { background: #FFF4DE; color: #8A5A00; }
.sh-status--bad { background: #FDECEC; color: #9B1C1C; }
.sh-status--idle { background: #EEF1F6; color: #5A6782; }
.sh-badge { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 6px; background: var(--sh-blue-tint); color: var(--sh-blue); font-size: 11px; font-weight: 800; }

.sh-balance { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.2; background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 12px; padding: 10px 16px; }
.sh-balance span { font-size: 12px; font-weight: 700; color: var(--sh-muted); }
.sh-balance b { font: 700 19px/1.2 var(--sh-font-display); color: var(--sh-navy); font-variant-numeric: tabular-nums; }
.sh-fund-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; }
.sh-help { background: var(--sh-blue-tint); border: 1px solid #D3DDF0; border-radius: 16px; padding: 20px; }
.sh-app .sh-help h2 { font: 700 16px/1.3 var(--sh-font-display); margin: 0 0 10px; }
.sh-help ol { margin: 0 0 14px; padding-left: 20px; display: flex; flex-direction: column; gap: 8px; font-size: 14.5px; }
.sh-help ol:last-child { margin-bottom: 0; }

.sh-fund { display: flex; flex-direction: column; gap: 18px; }
.sh-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.sh-tab {
    display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 12px; cursor: pointer; text-align: left;
    background: var(--sh-surface); border: 1.5px solid var(--sh-line); color: var(--sh-ink); font: inherit;
}
.sh-tab i { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: var(--sh-ground); color: var(--sh-navy); font-size: 16px; flex: none; }
.sh-tab strong { display: block; font-size: 15px; font-weight: 800; }
.sh-tab small { display: block; font-size: 12.5px; color: var(--sh-muted); }
.sh-tab[aria-selected="true"] { border-color: var(--sh-navy); background: var(--sh-blue-tint); box-shadow: 0 0 0 1px var(--sh-navy); }
.sh-tab[aria-selected="true"] i { background: var(--sh-navy); color: #FFFFFF; }
.sh-amount { display: flex; align-items: center; border: 1.5px solid var(--sh-line); border-radius: 12px; background: #FFFFFF; overflow: hidden; }
.sh-amount:focus-within { border-color: var(--sh-blue); box-shadow: 0 0 0 4px rgba(12, 64, 145, .12); }
.sh-amount__unit { padding: 0 4px 0 16px; font: 700 20px var(--sh-font-display); color: var(--sh-muted); }
.sh-amount__unit--end { padding: 0 16px 0 4px; font-size: 14px; letter-spacing: .04em; }
.sh-amount input {
    flex: 1; min-width: 0; height: 58px; border: 0; background: transparent; padding: 0 12px;
    font: 700 24px var(--sh-font-display); color: var(--sh-ink); font-variant-numeric: tabular-nums; -moz-appearance: textfield; appearance: textfield;
}
.sh-amount input::-webkit-outer-spin-button, .sh-amount input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.sh-amount input:focus { outline: none; }
.sh-hint { margin: 0; font-size: 13.5px; color: var(--sh-muted); }
.sh-presets { display: flex; flex-wrap: wrap; gap: 8px; }
.sh-preset { border: 1px solid var(--sh-line); background: var(--sh-ground); color: var(--sh-navy); font: 700 13.5px var(--sh-font-text); padding: 7px 12px; border-radius: 999px; cursor: pointer; }
.sh-preset:hover { border-color: var(--sh-navy); }
.sh-networks { border: 0; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.sh-networks legend { grid-column: 1 / -1; margin-bottom: 7px; padding: 0; float: left; width: 100%; }
.sh-network { position: relative; display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1.5px solid var(--sh-line); border-radius: 12px; cursor: pointer; }
.sh-network input { margin: 3px 0 0; accent-color: var(--sh-navy); width: 17px; height: 17px; flex: none; }
.sh-network strong { display: block; font-size: 14.5px; }
.sh-network small { display: block; font-size: 12.5px; color: var(--sh-muted); }
.sh-network:has(input:checked) { border-color: var(--sh-navy); background: var(--sh-blue-tint); }
.sh-callout { margin: 0; padding: 12px 14px; border-radius: 12px; background: #FFF4DE; color: #6B4700; font-size: 13.5px; font-weight: 600; display: flex; gap: 9px; }
.sh-callout i { margin-top: 2px; color: #B7791F; }

.sh-od__tools { display: flex; gap: 8px; flex-wrap: wrap; }
.sh-accounts { list-style: none; margin: 0; padding: 0; }
.sh-account { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 14px; align-items: start; padding: 14px 20px; border-bottom: 1px solid var(--sh-line); }
.sh-account:last-child { border-bottom: 0; }
.sh-account__n { width: 30px; height: 30px; border-radius: 8px; background: var(--sh-ground); display: grid; place-items: center; font: 700 13px var(--sh-font-display); color: var(--sh-muted); }
.sh-account__text {
    margin: 0; padding: 10px 12px; border-radius: 10px; background: #F7F9FC; border: 1px solid var(--sh-line);
    font: 500 13.5px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--sh-ink);
    white-space: pre-wrap; overflow-wrap: anywhere; max-height: 240px; overflow: auto;
}
.sh-copy.is-done, #odCopyAll.is-done { border-color: #0F7A4F; color: #0F7A4F; }

@media (max-width: 1100px) {
    .sh-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sh-fund-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
    .sh-tx, .sh-tx--order {
        grid-template-columns: 40px minmax(0, 1fr) auto; grid-template-areas: "icon main amt" "icon when status" "icon act act";
        gap: 4px 12px; padding: 14px 16px; align-items: start;
    }
    .sh-tx__icon { grid-area: icon; }
    .sh-tx__main { grid-area: main; }
    .sh-tx__when { grid-area: when; font-size: 12.5px; color: var(--sh-muted); }
    .sh-tx__when small { display: inline; }
    .sh-tx__amt { grid-area: amt; }
    .sh-tx__status { grid-area: status; align-self: center; }
    .sh-tx__act, .sh-tx__open { grid-area: act; justify-content: flex-start; }
    .sh-tx__act:empty { display: none; }
    .sh-tx--order .sh-tx__open { margin-top: 6px; }
    .sh-tx--order .sh-tx__open .sh-btn { width: 100%; }
    .sh-box__head, .sh-account { padding-inline: 16px; }
}
@media (max-width: 560px) {
    .sh-stats { grid-template-columns: minmax(0, 1fr); }
    .sh-networks, .sh-tabs { grid-template-columns: minmax(0, 1fr); }
    .sh-balance { align-items: flex-start; }
    .sh-account { grid-template-columns: minmax(0, 1fr) auto; }
    .sh-account__n { display: none; }
}

/* SMS pages */
.sh-stats--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sh-link--sm { font-size: 13px; margin-top: 4px; }
.sh-balance .sh-link--sm { align-self: flex-end; }
@media (max-width: 560px) {
    .sh-balance { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 12px; row-gap: 2px; padding: 14px 16px; }
    .sh-balance span, .sh-balance b { grid-column: 1; }
    .sh-balance b { font-size: 22px; }
    .sh-balance .sh-link--sm { grid-column: 2; grid-row: 1 / span 2; align-self: center; margin-top: 0; font-size: 14px; }
}
.sh-tx--sms { grid-template-columns: 40px minmax(0, 1.4fr) minmax(0, 1.2fr) minmax(0, .8fr) 118px; }
.sh-tx__code { min-width: 0; }
.sh-tx__muted { color: var(--sh-muted); font-size: 13.5px; }
.sh-code-chip {
    display: inline-block; max-width: 100%; padding: 4px 10px; border-radius: 8px; background: #E3F4EC; color: #0F5A3B;
    font: 700 14.5px/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; overflow-wrap: anywhere;
}

.sh-picks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.sh-app .select2-container .select2-selection--single {
    height: 50px; border: 1.5px solid var(--sh-line); border-radius: 10px; background: #FFFFFF; display: flex; align-items: center;
}
.sh-app .select2-container .select2-selection--single .select2-selection__rendered { padding-left: 14px; padding-right: 36px; font: 600 15px var(--sh-font-text); color: var(--sh-ink); line-height: 1.3; }
.sh-app .select2-container .select2-selection--single .select2-selection__arrow { height: 48px; right: 8px; }
.sh-app .select2-container--default.select2-container--disabled .select2-selection--single { background: var(--sh-ground); }
.sh-app .select2-container--focus .select2-selection, .sh-app .select2-container--open .select2-selection { border-color: var(--sh-blue) !important; box-shadow: 0 0 0 4px rgba(12, 64, 145, .12); }
.sh-app .select2-dropdown { border-color: var(--sh-line); border-radius: 10px; overflow: hidden; box-shadow: 0 18px 40px -20px rgba(10, 35, 80, .4); }
.sh-app .select2-results__option--highlighted[aria-selected], .sh-app .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background: var(--sh-navy); color: #FFFFFF; }
.sh-app .select2-search--dropdown .select2-search__field { border-radius: 8px; border: 1.5px solid var(--sh-line); padding: 8px 10px; }

.sh-price { margin: 18px 0; }
.sh-price__text { font-weight: 700; font-size: 15px; color: var(--sh-ink); display: flex; align-items: center; gap: 8px; }
.sh-price__text b { font: 700 20px var(--sh-font-display); color: var(--sh-navy); }
.sh-routes { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin-top: 12px; }
.sh-routes:empty { display: none; }
.sh-route {
    display: flex; flex-direction: column; gap: 4px; text-align: left; padding: 12px 14px; border-radius: 12px; cursor: pointer;
    background: var(--sh-surface); border: 1.5px solid var(--sh-line); font: inherit; color: var(--sh-ink);
}
.sh-route:hover { border-color: #C9D3E6; }
.sh-route__top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.sh-route__top b { font: 700 16px var(--sh-font-display); color: #0F7A4F; }
.sh-route small { color: var(--sh-muted); font-size: 12.5px; }
.sh-route.is-selected { border-color: var(--sh-navy); background: var(--sh-blue-tint); box-shadow: 0 0 0 1px var(--sh-navy); }

.sh-numlist { display: flex; flex-direction: column; }
.sh-num {
    display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.4fr) 100px 110px 90px 96px; gap: 14px; align-items: center;
    padding: 14px 20px; border-bottom: 1px solid var(--sh-line);
}
.sh-num:last-child { border-bottom: 0; }
.sh-num__main { min-width: 0; }
.sh-num__phone { display: flex; align-items: center; gap: 8px; }
.sh-num__phone strong { font: 700 16px var(--sh-font-display); font-variant-numeric: tabular-nums; }
.sh-num__main small { display: block; color: var(--sh-muted); font-size: 12.5px; }
.sh-num__code { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.sh-num__full { flex-basis: 100%; color: var(--sh-muted); font-size: 12px; overflow-wrap: anywhere; }
.sh-num__wait { display: inline-flex; align-items: center; gap: 8px; color: var(--sh-muted); font-size: 13.5px; font-weight: 600; }
.sh-num__none { color: #98A2B6; font-size: 13.5px; font-weight: 600; }
.sh-num__amt { font: 700 15px var(--sh-font-display); text-align: right; font-variant-numeric: tabular-nums; }
.sh-num__status { display: flex; justify-content: flex-end; }
.sh-num__timer { text-align: right; font: 600 13.5px var(--sh-font-text); font-variant-numeric: tabular-nums; color: var(--sh-navy); }
.sh-num__timer .is-expired { color: var(--sh-muted); }
.sh-num__act { display: flex; justify-content: flex-end; }
.sh-iconbtn--sm { width: 30px; height: 30px; border-radius: 8px; font-size: 13px; flex: none; }
.sh-btn--danger { background: #FDECEC; color: #9B1C1C; border-color: #F6C9C9; }
.sh-btn--danger:hover { background: #FAD5D5; color: #9B1C1C; }
.sh-spinner { width: 14px; height: 14px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; display: inline-block; animation: sh-spin .7s linear infinite; }
@keyframes sh-spin { to { transform: rotate(360deg); } }

.sh-toasts { position: fixed; top: calc(var(--sh-top-h, 68px) + 12px); right: 16px; z-index: 95; display: flex; flex-direction: column; gap: 8px; width: min(360px, calc(100vw - 32px)); }
.sh-toast {
    padding: 12px 14px; border-radius: 12px; font-size: 14px; font-weight: 600; box-shadow: 0 16px 30px -16px rgba(10, 35, 80, .45);
    border: 1px solid; background: #FFFFFF; transition: opacity .3s, transform .3s;
}
.sh-toast--ok { border-color: #BFE3D0; color: #0F6B45; background: #F1FAF5; }
.sh-toast--bad { border-color: #F6C9C9; color: #9B1C1C; background: #FEF5F5; }
.sh-toast--info { border-color: #C9D6EE; color: var(--sh-blue); background: #F4F7FC; }
.sh-toast.is-out { opacity: 0; transform: translateY(-6px); }

.sh-modal__icon--info { background: var(--sh-blue-tint); color: var(--sh-blue); }
.sh-tips { margin: 0 0 20px; padding: 0; list-style: none; counter-reset: tip; display: flex; flex-direction: column; gap: 10px; }
.sh-tips li { counter-increment: tip; display: flex; gap: 12px; align-items: flex-start; font-size: 14.5px; }
.sh-tips li::before {
    content: counter(tip); width: 26px; height: 26px; border-radius: 50%; flex: none; display: grid; place-items: center;
    background: var(--sh-navy); color: #FFFFFF; font: 700 13px var(--sh-font-display);
}
.sh-modal__actions { display: flex; flex-direction: column; gap: 8px; }
.sh-modal__card--left .sh-modal__icon { margin-left: 0; }

@media (max-width: 1100px) {
    .sh-num { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; grid-template-areas: "main code act" "amt status timer"; row-gap: 8px; }
    .sh-num__main { grid-area: main; } .sh-num__code { grid-area: code; } .sh-num__act { grid-area: act; }
    .sh-num__amt { grid-area: amt; text-align: left; } .sh-num__status { grid-area: status; justify-content: flex-start; } .sh-num__timer { grid-area: timer; }
}
@media (max-width: 860px) {
    .sh-picks, .sh-stats--3 { grid-template-columns: minmax(0, 1fr); }
    .sh-tx--sms { grid-template-areas: "icon main amt" "icon code status"; }
    .sh-tx--sms .sh-tx__code { grid-area: code; }
}
@media (max-width: 600px) {
    .sh-num { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "main act" "code code" "amt timer" "status status"; padding: 14px 16px; }
    .sh-num__timer { text-align: right; }
}
@media (prefers-reduced-motion: reduce) {
    .sh-spinner { animation-duration: 1.6s; }
    .sh-toast { transition: none; }
}

/* Account settings, support, docs, merchant */
.sh-page--narrow { max-width: 820px; }
.sh-status--info { background: var(--sh-blue-tint); color: var(--sh-blue); }
.sh-stats--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sh-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.sh-grid2__full { grid-column: 1 / -1; }
.sh-select {
    appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer;
    background: #FFFFFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235A6782' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 16px center;
}
.sh-textarea { height: auto; min-height: 120px; padding: 12px 14px; line-height: 1.55; resize: vertical; }
.sh-file { height: auto; padding: 10px; font-size: 14px; cursor: pointer; }
.sh-file::file-selector-button {
    margin-right: 12px; padding: 7px 12px; border: 1px solid var(--sh-line); border-radius: 8px;
    background: var(--sh-ground); color: var(--sh-navy); font: 700 13.5px var(--sh-font-text); cursor: pointer;
}
.sh-field__error { font-size: 13px; font-weight: 600; color: #9B1C1C; }
.sh-field__error:empty { display: none; }
.sh-phone { display: flex; align-items: stretch; }
.sh-phone__code {
    display: grid; place-items: center; min-width: 64px; padding: 0 12px; border: 1.5px solid var(--sh-line); border-right: 0;
    border-radius: 10px 0 0 10px; background: var(--sh-ground); font-weight: 700; color: var(--sh-navy);
}
.sh-phone .sh-input { border-radius: 0 10px 10px 0; }
.sh-phone .sh-phone__code:empty { display: none; }
.sh-phone .sh-phone__code:empty + input, .sh-phone .sh-phone__code:empty ~ .sh-input { border-radius: 10px; }
.sh-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 14px; letter-spacing: .02em; }
.sh-mono-inline {
    font: 500 13px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--sh-ink);
    background: #F7F9FC; border: 1px solid var(--sh-line); border-radius: 8px; padding: 4px 8px; overflow-wrap: anywhere; display: inline-block; max-width: 100%;
}

.sh-profile { display: flex; align-items: center; gap: 18px; background: var(--sh-navy); color: #FFFFFF; border-radius: 16px; padding: 22px; }
.sh-profile__avatar {
    width: 64px; height: 64px; border-radius: 16px; flex: none; display: grid; place-items: center;
    background: var(--sh-amber); color: var(--sh-navy); font: 800 22px var(--sh-font-display); letter-spacing: .02em;
}
.sh-profile__who { min-width: 0; }
.sh-app .sh-profile .sh-page__title { color: #FFFFFF; overflow-wrap: anywhere; }
.sh-profile .sh-page__sub { color: var(--sh-on-navy-soft); overflow-wrap: anywhere; }
.sh-profile__since { margin: 6px 0 0; font-size: 13px; font-weight: 700; color: var(--sh-amber); }

.sh-menu { display: flex; flex-direction: column; }
.sh-menu__item {
    display: grid; grid-template-columns: 42px minmax(0, 1fr) 16px; gap: 14px; align-items: center;
    padding: 14px 20px; border-bottom: 1px solid var(--sh-line); text-decoration: none; color: var(--sh-ink);
}
.sh-menu__item:last-child { border-bottom: 0; }
.sh-menu__item:hover { background: var(--sh-ground); color: var(--sh-ink); }
.sh-menu__item strong { display: block; font-size: 15px; font-weight: 700; }
.sh-menu__item small { display: block; font-size: 13px; color: var(--sh-muted); }
.sh-menu__icon { width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; background: var(--sh-blue-tint); color: var(--sh-blue); font-size: 16px; }
.sh-menu__go { color: #98A2B6; font-size: 13px; }
.sh-menu__item--danger .sh-menu__icon { background: #FDECEC; color: #9B1C1C; }
.sh-menu__item--danger strong { color: #9B1C1C; }

.sh-tx--ticket { grid-template-columns: 40px minmax(0, 1fr) 140px 130px 72px; }
.sh-tx__link { color: var(--sh-ink); text-decoration: none; }
.sh-tx__link:hover { color: var(--sh-blue); text-decoration: underline; }
.sh-tx--ticket:hover { background: #FAFBFD; }

.sh-attach { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.sh-attach__list { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.sh-attach__list:empty { display: none; }
.sh-attach__row { display: grid; grid-template-columns: minmax(0, 1fr) 36px; gap: 8px; align-items: center; }

.sh-thread { display: flex; flex-direction: column; gap: 12px; }
.sh-msg { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; padding: 16px 18px; }
.sh-msg--staff { background: var(--sh-blue-tint); border-color: #D3DDF0; }
.sh-msg__head { display: flex; gap: 12px; align-items: center; margin-bottom: 10px; }
.sh-msg__head strong { font-size: 14.5px; }
.sh-msg__head small { display: block; font-size: 12.5px; color: var(--sh-muted); }
.sh-msg__avatar {
    width: 36px; height: 36px; border-radius: 10px; flex: none; display: grid; place-items: center;
    background: var(--sh-ground); color: var(--sh-navy); font: 800 14px var(--sh-font-display);
}
.sh-msg--staff .sh-msg__avatar { background: var(--sh-navy); color: #FFFFFF; }
.sh-msg__text { margin: 0; white-space: pre-line; overflow-wrap: anywhere; font-size: 15px; line-height: 1.6; }
.sh-msg__files { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.sh-msg__files a {
    display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border-radius: 8px; border: 1px solid var(--sh-line);
    background: var(--sh-surface); color: var(--sh-navy); font-size: 13.5px; font-weight: 700; text-decoration: none;
}
.sh-msg__files a:hover { border-color: var(--sh-navy); }

.sh-doc { display: flex; flex-direction: column; gap: 22px; }
.sh-doc__item h2 { font: 700 16.5px/1.35 var(--sh-font-display); margin: 0 0 6px; color: var(--sh-ink); }
.sh-doc__item p { margin: 0; color: #36435C; font-size: 15px; line-height: 1.65; }
.sh-rules { margin: 0; padding: 0; list-style: none; counter-reset: rule; display: flex; flex-direction: column; gap: 14px; }
.sh-rules li { counter-increment: rule; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; font-size: 15px; line-height: 1.6; color: #36435C; }
.sh-rules li::before {
    content: counter(rule); width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center;
    background: var(--sh-blue-tint); color: var(--sh-blue); font: 700 13px var(--sh-font-display);
}

.sh-apikey { display: flex; flex-direction: column; gap: 12px; }
.sh-keyfield { display: flex; gap: 8px; align-items: center; }
.sh-keyfield .sh-input { flex: 1; min-width: 0; height: 44px; }
.sh-keyfield .sh-input[readonly] { background: #F7F9FC; color: var(--sh-ink); }
.sh-keyactions { display: flex; gap: 8px; flex-wrap: wrap; }
.sh-keyactions form { margin: 0; }
.sh-app .sh-docs .card { border: 1px solid var(--sh-line); border-radius: 16px; box-shadow: none; overflow: hidden; }
.sh-app .sh-docs .card-header { background: var(--sh-surface); border-bottom: 1px solid var(--sh-line); padding: 16px 20px; }
.sh-app .sh-docs .card-title { font: 700 16.5px/1.3 var(--sh-font-display); }
.sh-app .sh-docs pre.bg-dark { background: #0B1830 !important; border-radius: 10px !important; font-size: 13px; line-height: 1.55; overflow-x: auto; }
.sh-app .sh-docs code { color: #A33A12; font-size: 13px; }
.sh-app .sh-docs pre code { color: inherit; }
.sh-app .sh-docs .table { font-size: 14px; }
.sh-app .sh-docs .table th { background: var(--sh-ground); font-weight: 700; }
.sh-app .sh-docs .nav-pills .nav-link { border-radius: 999px; font-weight: 700; color: var(--sh-navy); }
.sh-app .sh-docs .nav-pills .nav-link.active { background: var(--sh-navy); color: #FFFFFF; }
.sh-app .sh-docs pre.bg-dark, .sh-app .sh-docs pre.bg-dark code { color: #E6ECF7 !important; }
.sh-app .sh-docs .p-4 { padding: 22px !important; }
.sh-app .sh-docs .p-3 { padding: 16px !important; }
.sh-app .sh-docs .p-0 { padding: 0 !important; }
.sh-app .sh-docs .border-bottom { border-bottom: 1px solid var(--sh-line) !important; }
.sh-app .sh-docs .border-bottom:last-child { border-bottom: 0 !important; }
.sh-app .sh-docs .rounded { border-radius: 10px !important; }
.sh-app .sh-docs .text-white { color: #FFFFFF !important; }
.sh-app .sh-docs .text-white-50 { color: rgba(255, 255, 255, .72) !important; }
.sh-app .sh-docs > .card { margin-bottom: 0 !important; }
.sh-app .sh-docs .d-flex { display: flex !important; }
.sh-app .sh-docs .align-items-center { align-items: center !important; }
.sh-app .sh-docs .me-2 { margin-right: 8px !important; }
.sh-app .sh-docs .mb-2 { margin-bottom: 8px !important; }
.sh-app .sh-docs .mb-3 { margin-bottom: 16px !important; }
.sh-app .sh-docs .mt-1 { margin-top: 4px !important; }
.sh-app .sh-docs .mt-3 { margin-top: 16px !important; }
.sh-app .sh-docs .fs-6 { font-size: 14px !important; }
.sh-app .sh-docs .nav-pills { display: flex; gap: 6px; list-style: none; padding: 0; }
.sh-app .sh-docs .badge { display: inline-block; padding: 3px 8px; border-radius: 6px; font: 700 12px/1.3 var(--sh-font-text); }
.sh-app .sh-docs .badge.bg-success { background: #E3F4EC !important; color: #0F6B45 !important; }
.sh-app .sh-docs .badge.bg-danger { background: #FDECEC !important; color: #9B1C1C !important; }
.sh-app .sh-docs .badge.bg-warning { background: #FFF4DE !important; color: #8A5A00 !important; }
.sh-app .sh-docs .badge.bg-secondary, .sh-app .sh-docs .badge.bg-info, .sh-app .sh-docs .badge.bg-primary { background: var(--sh-blue-tint) !important; color: var(--sh-blue) !important; }

.sh-tx--sale { grid-template-columns: 40px minmax(0, 1fr) auto auto; }
.sh-tx--mprod { grid-template-columns: 40px minmax(0, 1.6fr) minmax(0, .8fr) 130px auto; }
.sh-tx--acct { grid-template-columns: 64px minmax(0, 1fr) 96px 124px 84px; }
.sh-tx--acct .sh-account__n { width: auto; min-width: 30px; padding: 0 8px; justify-self: start; }
.sh-tx--wd { grid-template-columns: 40px minmax(0, 1fr) auto 110px; }
.sh-tx__thumb { width: 40px; height: 40px; border-radius: 10px; overflow: hidden; display: grid; place-items: center; background: var(--sh-ground); }
.sh-tx__thumb img { width: 100%; height: 100%; object-fit: cover; }
.sh-tx__thumb .sh-row__initial { width: 40px; height: 40px; }
.sh-tx__note { grid-column: 2 / -1; margin: 0; padding: 8px 12px; border-radius: 10px; background: #FDECEC; color: #7A1A1A; font-size: 13.5px; }

.sh-steps--compact { margin: 0 0 20px; gap: 18px; }
.sh-steps--compact .sh-step { padding-top: 0; border-top: 0; display: grid; grid-template-columns: 36px minmax(0, 1fr); column-gap: 12px; align-content: start; }
.sh-steps--compact .sh-step__n { position: static; grid-row: span 2; width: 36px; height: 36px; font-size: 14px; box-shadow: none; }
.sh-app .sh-steps--compact .sh-step h3 { font: 700 15.5px/1.3 var(--sh-font-display); margin: 0 0 4px; }
.sh-steps--compact .sh-step p { font-size: 13.5px; }
.sh-fee {
    display: flex; flex-direction: column; gap: 4px; text-align: center; margin-bottom: 18px;
    padding: 20px; border-radius: 14px; background: var(--sh-blue-tint); border: 1px solid #D3DDF0;
}
.sh-fee span { font-size: 13.5px; font-weight: 700; color: var(--sh-muted); }
.sh-fee b { font: 800 clamp(26px, 4vw, 34px)/1.15 var(--sh-font-display); color: var(--sh-navy); font-variant-numeric: tabular-nums; }
.sh-fee small { font-size: 13px; color: var(--sh-muted); }

.sh-statuscard { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.sh-app .sh-statuscard h2 { font: 700 20px/1.3 var(--sh-font-display); margin: 6px 0 0; }
.sh-statuscard p { margin: 0 0 10px; color: var(--sh-muted); max-width: 46ch; }
.sh-statuscard__icon { width: 64px; height: 64px; border-radius: 18px; display: grid; place-items: center; font-size: 26px; }
.sh-statuscard__icon.is-idle { background: var(--sh-blue-tint); color: var(--sh-blue); }
.sh-statuscard__icon.is-wait { background: #FFF4DE; color: #B7791F; }
.sh-statuscard__icon.is-ok { background: #E3F4EC; color: #0F7A4F; }
.sh-statuscard__icon.is-bad { background: #FDECEC; color: #9B1C1C; }

.sh-pform { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px; align-items: start; }
.sh-upload {
    position: relative; display: grid; place-items: center; aspect-ratio: 1; border-radius: 14px; overflow: hidden; cursor: pointer;
    border: 1.5px dashed #B8C4DA; background: var(--sh-ground);
}
.sh-upload:hover { border-color: var(--sh-navy); }
.sh-upload img { width: 100%; height: 100%; object-fit: cover; }
.sh-upload__empty { display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; padding: 16px; color: var(--sh-muted); }
.sh-upload__empty i { font-size: 28px; color: var(--sh-blue); margin-bottom: 4px; }
.sh-upload__empty strong { color: var(--sh-navy); font-size: 14.5px; }
.sh-upload__empty small { font-size: 12.5px; }
.sh-upload__empty[hidden], .sh-upload img[hidden] { display: none; }
.sh-upload__change {
    position: absolute; left: 10px; right: 10px; bottom: 10px; padding: 7px; border-radius: 9px; text-align: center;
    background: rgba(10, 35, 80, .86); color: #FFFFFF; font-size: 13px; font-weight: 700;
}
.sh-upload:has(img[hidden]) .sh-upload__change { display: none; }
.sh-upload:focus-within { box-shadow: 0 0 0 4px rgba(12, 64, 145, .18); }
.sh-hint code { color: var(--sh-navy); background: var(--sh-ground); padding: 1px 5px; border-radius: 5px; font-size: 12.5px; }

@media (max-width: 860px) {
    .sh-tx--ticket, .sh-tx--sale, .sh-tx--mprod, .sh-tx--wd {
        grid-template-columns: 40px minmax(0, 1fr) auto; grid-template-areas: "icon main amt" "icon when status" "icon act act";
    }
    .sh-tx--ticket { grid-template-columns: 40px auto minmax(0, 1fr); grid-template-areas: "icon main main" "icon s1 s2" "icon act act"; }
    .sh-tx--ticket .sh-tx__open { margin-top: 6px; }
    .sh-tx--ticket .sh-tx__status { justify-content: flex-start; }
    .sh-tx--ticket .sh-tx__status:nth-of-type(2), .sh-tx--acct .sh-tx__status:nth-of-type(2) { grid-area: s1; }
    .sh-tx--ticket .sh-tx__status:nth-of-type(3), .sh-tx--acct .sh-tx__status:nth-of-type(3) { grid-area: s2; }
    .sh-tx__thumb { grid-area: icon; }
    .sh-tx--mprod .sh-tx__status, .sh-tx--wd .sh-tx__status { grid-area: status; }
    .sh-tx--mprod .sh-tx__open { margin-top: 6px; }
    .sh-tx--acct { grid-template-columns: 30px auto minmax(0, 1fr); grid-template-areas: "n main main" "n s1 s2" "n act act"; }
    .sh-tx--acct .sh-account__n { grid-area: n; }
    .sh-tx--acct .sh-tx__status { justify-content: flex-start; }
    .sh-tx--acct .sh-tx__open:empty { display: none; }
    .sh-tx__note { grid-column: 2 / -1; }
    .sh-menu__item { padding-inline: 16px; }
    .sh-pform { grid-template-columns: minmax(0, 1fr); }
    .sh-pform > div:first-child { max-width: 240px; }
}
@media (max-width: 620px) {
    .sh-grid2 { grid-template-columns: minmax(0, 1fr); }
    .sh-stats--2 { grid-template-columns: minmax(0, 1fr); }
    .sh-steps--compact { grid-template-columns: minmax(0, 1fr); }
    .sh-profile { padding: 18px; gap: 14px; }
    .sh-profile__avatar { width: 52px; height: 52px; font-size: 18px; }
    .sh-keyfield { flex-wrap: wrap; }
    .sh-keyfield .sh-input { flex-basis: 100%; }
}
@media (max-width: 560px) {
    .sh-tx--acct { grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "main main" "s1 s2" "act act"; }
}

/* Public info pages, payment screens */
.sh-pagehead { background: var(--sh-navy); color: #FFFFFF; padding: 56px 0 50px; }
.sh-site .sh-pagehead h1 { font-size: clamp(30px, 4vw, 44px); line-height: 1.1; letter-spacing: -.025em; color: #FFFFFF; }
.sh-pagehead__lede { margin: 14px 0 0; max-width: 56ch; color: var(--sh-on-navy-soft); font-size: 17px; }
.sh-section--tight { padding-block: 44px 72px; }

.sh-prose { color: #36435C; font-size: 16px; line-height: 1.7; overflow-wrap: anywhere; }
.sh-prose * { font-family: inherit !important; color: inherit !important; background: transparent !important; }
.sh-prose > :first-child, .sh-prose > :first-child > :first-child { margin-top: 0 !important; }
.sh-prose h1, .sh-prose h2, .sh-prose h3, .sh-prose h4, .sh-prose h5 {
    font-family: var(--sh-font-display) !important; color: var(--sh-ink) !important; line-height: 1.3;
    margin: 28px 0 10px !important; font-size: 19px !important; font-weight: 700 !important; letter-spacing: -.01em;
}
.sh-prose p { margin: 0 0 14px !important; }
.sh-prose ul, .sh-prose ol { margin: 0 0 14px; padding-left: 22px; }
.sh-prose li { margin-bottom: 6px; }
.sh-prose a { color: var(--sh-blue) !important; font-weight: 700; }
.sh-prose img { max-width: 100%; height: auto; border-radius: 12px; }
.sh-prose div[class*="mb-5"] { margin-bottom: 18px !important; }
.sh-prose blockquote { margin: 0 !important; padding: 0 !important; }

.sh-legal { padding-block: 44px 72px; }
.sh-legal__grid { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 32px; align-items: start; }
.sh-legal__nav { position: sticky; top: 96px; }
.sh-legal__nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.sh-legal__nav a { display: block; padding: 9px 12px; border-radius: 9px; color: var(--sh-ink); font-weight: 600; font-size: 15px; text-decoration: none; }
.sh-legal__nav a:hover { background: var(--sh-surface); }
.sh-legal__nav a[aria-current] { background: var(--sh-navy); color: #FFFFFF; }
.sh-legal__body { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; padding: clamp(22px, 4vw, 44px); min-width: 0; }
.sh-site .sh-legal__title { font-size: clamp(26px, 3vw, 34px); letter-spacing: -.02em; margin-bottom: 20px; }

.sh-contact { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 28px; align-items: start; }
.sh-contact__ways { display: flex; flex-direction: column; gap: 12px; }
.sh-way {
    display: grid; grid-template-columns: 46px minmax(0, 1fr) 16px; gap: 14px; align-items: center; padding: 16px 18px;
    background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 14px; color: var(--sh-ink); text-decoration: none;
}
.sh-way:hover { border-color: var(--sh-navy); color: var(--sh-ink); }
.sh-way__icon { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: var(--sh-blue-tint); color: var(--sh-blue); font-size: 19px; }
.sh-way strong { display: block; font-size: 15.5px; }
.sh-way small { display: block; font-size: 13.5px; color: var(--sh-muted); overflow-wrap: anywhere; }
.sh-way__go { color: #98A2B6; font-size: 13px; }
.sh-site .sh-contact__title { font-size: 21px; margin-bottom: 4px; }
.sh-contact .sh-note { margin-bottom: 18px; }
.sh-captcha:not(:has(*)) { display: none; }
.sh-captcha .form-group, .sh-viser .form-group { display: flex; flex-direction: column; gap: 7px; margin: 0; }
.sh-captcha .form-label, .sh-viser .form-label { font-weight: 700; font-size: 14px; color: var(--sh-ink); margin: 0; }
.sh-captcha .form--control, .sh-viser .form--control {
    width: 100%; min-height: 50px; padding: 12px 14px; border: 1.5px solid var(--sh-line); border-radius: 10px;
    background: #FFFFFF; color: var(--sh-ink); font: 500 15.5px var(--sh-font-text); box-shadow: none;
}
.sh-captcha .form--control:focus, .sh-viser .form--control:focus { outline: none; border-color: var(--sh-blue); box-shadow: 0 0 0 4px rgba(12, 64, 145, .12); }
.sh-viser > .row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin: 0; }
.sh-viser > .row > [class*="col-"] { width: auto; max-width: none; padding: 0; }

.sh-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.sh-post { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.sh-post__img { display: block; aspect-ratio: 410 / 275; background: var(--sh-ground); }
.sh-post__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sh-post__body { padding: 18px 20px 22px; }
.sh-post__date { margin: 0 0 6px; font-size: 13px; font-weight: 700; color: var(--sh-muted); }
.sh-site .sh-post__title { font-size: 18px; line-height: 1.35; letter-spacing: -.01em; margin-bottom: 8px; }
.sh-post__title a { color: var(--sh-ink); text-decoration: none; }
.sh-post__title a:hover { color: var(--sh-blue); }
.sh-post__text { margin: 0; color: var(--sh-muted); font-size: 15px; }
.sh-pager--plain { border: 0; padding: 24px 0 0; }
.sh-pager--plain .pagination { display: flex; list-style: none; padding: 0; gap: 6px; }
.sh-pager--plain .page-link { display: grid; place-items: center; min-width: 40px; height: 40px; padding: 0 10px; border: 1px solid var(--sh-line); border-radius: 9px; background: var(--sh-surface); color: var(--sh-navy); font-weight: 700; text-decoration: none; }
.sh-pager--plain .active .page-link { background: var(--sh-navy); border-color: var(--sh-navy); color: #FFFFFF; }

.sh-article { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 36px; align-items: start; }
.sh-article__main { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 16px; padding: clamp(20px, 4vw, 40px); min-width: 0; }
.sh-site .sh-article__title { font-size: clamp(26px, 3.2vw, 36px); line-height: 1.15; letter-spacing: -.02em; margin: 16px 0 6px; }
.sh-article__img { width: 100%; border-radius: 12px; margin: 14px 0 24px; display: block; }
.sh-share { display: flex; align-items: center; gap: 8px; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--sh-line); font-weight: 700; font-size: 14px; }
.sh-share span { margin-right: 4px; }
.sh-share a { width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--sh-line); display: grid; place-items: center; color: var(--sh-navy); text-decoration: none; }
.sh-share a:hover { border-color: var(--sh-navy); }
.sh-article__side { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 10px; }
.sh-site .sh-article__sidehead { font-size: 16px; margin-bottom: 4px; }
.sh-mini { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px; background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 12px; color: var(--sh-ink); text-decoration: none; }
.sh-mini:hover { border-color: var(--sh-navy); color: var(--sh-ink); }
.sh-mini img { width: 72px; height: 54px; object-fit: cover; border-radius: 8px; }
.sh-mini strong { display: block; font-size: 14px; line-height: 1.35; }
.sh-mini small { display: block; font-size: 12.5px; color: var(--sh-muted); }

.sh-maint { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr); place-items: center; padding: 24px 16px; }
.sh-maint__card { background: var(--sh-surface); border: 1px solid var(--sh-line); border-radius: 20px; padding: clamp(24px, 5vw, 44px); max-width: 560px; width: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.sh-maint__logo { height: 48px; width: auto; }
.sh-maint__img { max-width: 260px; }
.sh-site .sh-maint h1 { font-size: clamp(24px, 3vw, 30px); letter-spacing: -.02em; }
.sh-maint .sh-prose { text-align: center; }

.sh-page--pay { max-width: 560px; }
.sh-pay { text-align: center; display: flex; flex-direction: column; gap: 4px; }
.sh-pay__via { align-self: center; margin: 0 0 12px; padding: 6px 12px; border-radius: 999px; background: var(--sh-ground); font-size: 13.5px; color: var(--sh-muted); }
.sh-pay__via b { color: var(--sh-ink); }
.sh-pay__label { margin: 0; font-size: 13.5px; font-weight: 700; color: var(--sh-muted); }
.sh-pay__amount { margin: 0 0 14px; font: 800 clamp(30px, 5vw, 40px)/1.15 var(--sh-font-display); color: var(--sh-navy); font-variant-numeric: tabular-nums; letter-spacing: -.02em; overflow-wrap: anywhere; }
.sh-pay__amount span { font-size: 16px; font-weight: 700; color: var(--sh-muted); letter-spacing: .04em; }
.sh-pay form { margin: 0; text-align: left; }
.sh-pay__center { text-align: center; margin-top: 6px; }
.sh-pay__secure { margin: 16px 0 0; font-size: 13px; color: var(--sh-muted); }
.sh-pay__secure .fa-lock { color: #0F7A4F; }
.sh-pay__secure .fa-triangle-exclamation { color: #B7791F; }
.sh-pay__help { margin-top: 12px; font-size: 14px; font-weight: 700; color: var(--sh-blue); text-decoration: none; }
.sh-pay__help:hover { text-decoration: underline; }
.sh-pay__steps { text-align: left; margin: 14px 0 18px; padding: 16px 18px; border-radius: 12px; background: var(--sh-ground); border: 1px solid var(--sh-line); }
.sh-app .sh-pay__steps h2 { font: 700 15px/1.3 var(--sh-font-display); margin: 0 0 8px; }
.sh-pay__steps .sh-prose { font-size: 15px; }
.sh-pay__qr { align-self: center; padding: 12px; border: 1px solid var(--sh-line); border-radius: 14px; margin-bottom: 16px; }
.sh-pay__qr img { display: block; width: 200px; height: 200px; }
.sh-pay .sh-field { text-align: left; }

@media (max-width: 960px) {
    .sh-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sh-article { grid-template-columns: minmax(0, 1fr); }
    .sh-article__side { position: static; }
}
@media (max-width: 860px) {
    .sh-legal__grid, .sh-contact { grid-template-columns: minmax(0, 1fr); }
    .sh-legal__nav { position: static; }
    .sh-legal__nav ul { flex-direction: row; flex-wrap: wrap; gap: 6px; }
    .sh-legal__nav a { background: var(--sh-surface); border: 1px solid var(--sh-line); padding: 7px 12px; font-size: 14px; }
}
@media (max-width: 620px) {
    .sh-posts { grid-template-columns: minmax(0, 1fr); }
    .sh-pagehead { padding: 40px 0 36px; }
}