/* Smart Khata PWA — navy + orange home (matches demo redesign) */
:root {
  --sk-navy: #0b1f3a;
  --sk-navy-2: #12325c;
  --sk-orange: #f97316;
  --sk-orange-soft: #fb923c;
  --sk-muted: #64748b;
  --sk-line: #e8ecf4;
  --sk-bg: #f4f6fb;
  --sk-ink: #0b1f3a;
  /* Ledger pair (recv/gave ↔ pay/took) — overridden by .sk-theme--* */
  --sk-recv: #ef4444;
  --sk-recv-ink: #dc2626;
  --sk-recv-soft: #ffe8e8;
  --sk-recv-pill: #ffe4e6;
  --sk-recv-pill-ink: #be123c;
  --sk-pay: #22c55e;
  --sk-pay-ink: #16a34a;
  --sk-pay-soft: #e7f8ee;
  --sk-pay-pill: #dcfce7;
  --sk-pay-pill-ink: #15803d;
}
.sk-theme--classic {
  --sk-recv: #ef4444;
  --sk-recv-ink: #dc2626;
  --sk-recv-soft: #ffe8e8;
  --sk-recv-pill: #ffe4e6;
  --sk-recv-pill-ink: #be123c;
  --sk-pay: #22c55e;
  --sk-pay-ink: #16a34a;
  --sk-pay-soft: #e7f8ee;
  --sk-pay-pill: #dcfce7;
  --sk-pay-pill-ink: #15803d;
}
.sk-theme--soft {
  --sk-recv: #f43f5e;
  --sk-recv-ink: #e11d48;
  --sk-recv-soft: #ffe4e6;
  --sk-recv-pill: #fff1f2;
  --sk-recv-pill-ink: #9f1239;
  --sk-pay: #14b8a6;
  --sk-pay-ink: #0f766e;
  --sk-pay-soft: #ccfbf1;
  --sk-pay-pill: #f0fdfa;
  --sk-pay-pill-ink: #0f766e;
}
.sk-theme--vivid {
  --sk-recv: #e11d48;
  --sk-recv-ink: #be123c;
  --sk-recv-soft: #ffe4e6;
  --sk-recv-pill: #ffe4e6;
  --sk-recv-pill-ink: #881337;
  --sk-pay: #059669;
  --sk-pay-ink: #047857;
  --sk-pay-soft: #d1fae5;
  --sk-pay-pill: #ecfdf5;
  --sk-pay-pill-ink: #064e3b;
}
.sk-theme--ocean {
  --sk-recv: #0284c7;
  --sk-recv-ink: #0369a1;
  --sk-recv-soft: #e0f2fe;
  --sk-recv-pill: #e0f2fe;
  --sk-recv-pill-ink: #075985;
  --sk-pay: #0891b2;
  --sk-pay-ink: #0e7490;
  --sk-pay-soft: #cffafe;
  --sk-pay-pill: #ecfeff;
  --sk-pay-pill-ink: #155e75;
}
.sk-theme--sunset {
  --sk-recv: #ea580c;
  --sk-recv-ink: #c2410c;
  --sk-recv-soft: #ffedd5;
  --sk-recv-pill: #ffedd5;
  --sk-recv-pill-ink: #9a3412;
  --sk-pay: #ca8a04;
  --sk-pay-ink: #a16207;
  --sk-pay-soft: #fef9c3;
  --sk-pay-pill: #fefce8;
  --sk-pay-pill-ink: #854d0e;
}
.sk-theme--midnight {
  --sk-recv: #4f46e5;
  --sk-recv-ink: #4338ca;
  --sk-recv-soft: #e0e7ff;
  --sk-recv-pill: #e0e7ff;
  --sk-recv-pill-ink: #312e81;
  --sk-pay: #9333ea;
  --sk-pay-ink: #7e22ce;
  --sk-pay-soft: #f3e8ff;
  --sk-pay-pill: #faf5ff;
  --sk-pay-pill-ink: #581c87;
}
* { box-sizing: border-box; }
html {
  margin: 0; height: 100%;
  height: -webkit-fill-available;
}
html, body { overflow: hidden; }
body {
  margin: 0;
  height: 100%;
  height: 100dvh;
  height: -webkit-fill-available;
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  background: #0b1220;
  color: var(--sk-ink);
  font-weight: 500;
}
.sk-app {
  --sk-tabbar-h: 0px;
  max-width: 430px;
  width: 100%;
  margin: 0 auto;
  height: var(--sk-app-height, 100dvh);
  max-height: var(--sk-app-height, 100dvh);
  min-height: 0;
  background: var(--sk-bg);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 40px rgba(0,0,0,.35);
  padding-bottom: var(--sk-tabbar-h);
  font-weight: 500;
}
.sk-app strong,
.sk-app b,
.sk-app h1,
.sk-app h2,
.sk-app h3 { font-weight: 500; }
.sk-app.sk-app--tabs {
  --sk-tabbar-h: calc(64px + env(safe-area-inset-bottom, 0px));
}
.sk-app > .sk-apk-overlay,
.sk-app > .sk-drawer-overlay,
.sk-app > .sk-photo-overlay { position: absolute; }
.sk-screen {
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  -webkit-overflow-scrolling: touch;
  padding-bottom: .25rem;
}
.sk-h-top {
  position: sticky; top: 0; z-index: 8;
  padding: .65rem .9rem;
  background: #eceff3; color: #334155;
  border-bottom: 1px solid #e2e8f0; flex: 0 0 auto;
}
.sk-h-top__row {
  display: grid; grid-template-columns: 42px 1fr 42px;
  align-items: center; gap: .35rem; position: relative;
}
.sk-h-top__row--simple {
  display: flex; align-items: center; justify-content: space-between;
  gap: .65rem; min-height: 40px;
}
.sk-h-top__left {
  display: flex; align-items: center; gap: .55rem; min-width: 0;
}
.sk-h-top__greet {
  font-size: .98rem; font-weight: 500; color: #475569;
  white-space: nowrap; letter-spacing: .01em;
}
.sk-h-top__wave { font-size: 1.05rem; }
.sk-h-top__title {
  font-size: .98rem; font-weight: 500; color: #334155;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sk-h-top__actions {
  display: flex; align-items: center; gap: .35rem; flex: 0 0 auto;
}
.sk-h-top__icon {
  width: 38px; height: 38px; border: 0; border-radius: 10px;
  background: transparent; color: #64748b;
  display: grid; place-items: center; cursor: pointer; padding: 0;
  -webkit-tap-highlight-color: transparent;
}
.sk-h-top__icon:hover { background: rgba(15,23,42,.05); color: #475569; }
.sk-h-top__icon svg { width: 1.35rem; height: 1.35rem; display: block; }
.sk-h-top__brand {
  display: flex; align-items: center; justify-content: center; gap: .45rem;
  min-width: 0; text-align: center;
}
.sk-h-top__brand img {
  width: 34px; height: 34px; border-radius: 0; object-fit: contain;
  background: transparent !important; box-shadow: none !important; flex: 0 0 auto;
}
.sk-h-top__brand strong {
  font-size: 1rem; font-weight: 500; color: #0b1f3a;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sk-h-top__side { display: flex; align-items: center; justify-content: flex-start; min-height: 38px; }
.sk-h-top__side--right { justify-content: flex-end; }
.sk-avatar {
  width: 40px; height: 40px; border-radius: 999px; border: 0;
  background: #0b1f3a; color: #fff; display: grid; place-items: center;
  cursor: pointer; font-size: .82rem; font-weight: 500; padding: 0;
  font-family: inherit; overflow: hidden; flex: 0 0 auto;
  position: relative;
}
.sk-avatar--soft {
  background: #c7d2fe; color: #1e293b;
}
.sk-avatar img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: block; border-radius: inherit;
}
.sk-h-top__back {
  width: 38px; height: 38px; border-radius: 999px; border: 0;
  background: #e8edf5; color: #0b1f3a; display: grid; place-items: center;
  cursor: pointer; padding: 0; flex: 0 0 auto;
  box-shadow: 0 1px 2px rgba(11,31,58,.06);
  -webkit-tap-highlight-color: transparent;
}
.sk-h-top__back:hover { background: #dbe4f0; }
.sk-h-top__back:active { transform: scale(.96); }
.sk-h-top__back svg { width: 1.25rem; height: 1.25rem; display: block; }
/* Left profile drawer */
.sk-drawer-overlay {
  position: absolute; inset: 0; z-index: 70;
  background: rgba(11, 31, 58, .45);
  display: flex; justify-content: flex-start;
}
.sk-drawer {
  width: min(86%, 320px); height: 100%; background: #fff;
  display: flex; flex-direction: column; overflow: hidden;
  box-shadow: 8px 0 28px rgba(11,31,58,.2);
  animation: skDrawerIn .22s ease-out;
}
@keyframes skDrawerIn {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}
.sk-drawer__hero {
  position: relative; background: linear-gradient(145deg, #16a34a, #15803d 55%, #166534);
  background-repeat: no-repeat;
  padding: 2.4rem 1rem 2.6rem; flex: 0 0 auto; min-height: 114px;
}
.sk-drawer__hero::after {
  content: ''; position: absolute; inset: 0; opacity: .18; pointer-events: none;
  background: radial-gradient(circle at 20% 30%, #fff 0, transparent 40%),
    radial-gradient(circle at 80% 70%, #bbf7d0 0, transparent 35%);
}
.sk-drawer__hero.has-bg::after {
  opacity: 1;
  background: linear-gradient(180deg, rgba(0,0,0,.12) 0%, rgba(0,0,0,.28) 100%);
}
.sk-drawer__back {
  position: relative; z-index: 1; border: 0; cursor: pointer; font-family: inherit;
  width: 34px; height: 34px; border-radius: 999px; background: rgba(0,0,0,.22);
  color: #fff; font-size: 1.4rem; line-height: 1; display: grid; place-items: center;
}
.sk-drawer__av-wrap {
  position: absolute; left: 50%; bottom: -36px; transform: translateX(-50%);
  width: 84px; height: 84px; z-index: 2;
}
.sk-drawer__av {
  width: 84px; height: 84px; border-radius: 999px; background: #e2e8f0;
  border: 4px solid #fff; box-shadow: 0 6px 16px rgba(11,31,58,.18);
  display: grid; place-items: center; overflow: hidden;
  font-size: 1.35rem; font-weight: 500; color: #0b1f3a;
  position: relative;
}
.sk-drawer__av img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: block; border-radius: inherit;
}
.sk-drawer__edit {
  position: absolute; right: -2px; bottom: 2px; z-index: 3;
  width: 30px; height: 30px; border-radius: 999px; padding: 0;
  border: 2px solid #fff; background: var(--sk-navy); color: #fff;
  display: grid; place-items: center; cursor: pointer;
  box-shadow: 0 3px 10px rgba(11,31,58,.25);
}
.sk-drawer__edit svg { width: 14px; height: 14px; display: block; }
.sk-drawer__edit:hover { background: #12325c; }
.sk-drawer__body {
  flex: 1 1 auto; overflow-y: auto; padding: 3rem 1rem .75rem;
  display: flex; flex-direction: column;
}
.sk-drawer__identity { text-align: center; }
.sk-drawer__name {
  text-align: center; font-size: 1.05rem; font-weight: 500; color: #111;
  text-transform: uppercase; letter-spacing: .02em;
}
.sk-drawer__phone,
.sk-drawer__email,
.sk-drawer__meta {
  text-align: center; font-size: .78rem; color: #64748b; font-weight: 500;
  margin: .28rem 0 0; line-height: 1.35; word-break: break-word;
}
.sk-drawer__email { color: #475569; font-size: .74rem; }
.sk-drawer__line { height: 1px; background: #e8ecf4; margin: .85rem 0; flex: 0 0 auto; }
.sk-drawer__menu { flex: 1 1 auto; }
.sk-drawer__item {
  display: flex; align-items: center; gap: .65rem; width: 100%;
  border: 0; background: transparent; text-align: left; padding: .72rem .15rem;
  font-size: .9rem; font-weight: 500; color: #334155; cursor: pointer; font-family: inherit;
}
.sk-drawer__item:hover { color: #0b1f3a; }
.sk-drawer__item--danger { color: #b91c1c; }
.sk-drawer__label { flex: 1 1 auto; text-align: left; }
.sk-drawer__chev { color: #94a3b8; font-size: 1.1rem; font-weight: 500; }
.sk-drawer__ico {
  width: 1.45rem; height: 1.45rem;
  display: grid; place-items: center;
  text-align: center; font-style: normal; flex: 0 0 auto;
}
.sk-drawer__ico .ico {
  width: 1.25rem; height: 1.25rem; object-fit: contain; display: block;
}
.sk-drawer__ico .fa-fallback { font-size: 1.05rem; line-height: 1; }
.sk-drawer__foot {
  display: flex; align-items: center; justify-content: flex-start; gap: .5rem;
  margin-top: auto; padding-top: .85rem;
  font-size: .68rem; color: #94a3b8; font-weight: 500;
}
.sk-drawer__ver { flex: 0 1 auto; white-space: nowrap; }
.sk-drawer__lang-cur {
  flex: 0 0 auto;
  font-size: .72rem;
  font-weight: 500;
  color: #64748b;
  max-width: 5.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sk-drawer__chev--lang {
  font-size: .95rem;
  transition: transform .22s ease;
}
.sk-drawer__lang.is-open .sk-drawer__chev--lang {
  transform: rotate(0deg);
}
.sk-drawer__lang-dd {
  margin: 0 0 0 .15rem;
  margin-left: 1.55rem;
  padding: 0;
  border-left: 2px solid #e2e8f0;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(-4px);
  transition: max-height .28s ease, opacity .22s ease, transform .22s ease, padding .22s ease, margin-bottom .22s ease;
}
.sk-drawer__lang.is-open .sk-drawer__lang-dd,
.sk-drawer__lang.is-anim .sk-drawer__lang-dd {
  max-height: 220px;
  opacity: 1;
  transform: translateY(0);
  padding: .2rem 0 .45rem;
  margin-bottom: .2rem;
}
.sk-drawer__lang-dd[hidden] {
  display: block !important;
  max-height: 0;
  opacity: 0;
  padding: 0;
  pointer-events: none;
}
.sk-drawer__lang.is-open .sk-drawer__lang-dd[hidden],
.sk-drawer__lang.is-anim .sk-drawer__lang-dd[hidden] {
  pointer-events: auto;
}
.sk-drawer__lang-opt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  padding: .45rem .55rem;
  font: inherit;
  font-size: .84rem;
  font-weight: 500;
  color: #475569;
  cursor: pointer;
  border-radius: 8px;
}
.sk-drawer__lang-opt:active { background: #f1f5f9; }
.sk-drawer__lang-opt.is-on {
  color: #0f766e;
  background: #ecfdf5;
}
.sk-drawer__lang-check {
  color: #0f766e;
  font-weight: 700;
}
.sk-about,
.sk-legal {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background: #f8fafc;
}
.sk-about-top {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .65rem .85rem;
  background: #fff;
  border-bottom: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-about-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: #0f172a;
}
.sk-pad--about,
.sk-pad--legal {
  flex: 1 1 auto;
  padding-bottom: 1rem;
}
.sk-about-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: .55rem;
  padding: 1.1rem 0 .85rem;
}
.sk-about-logo {
  width: 72px;
  height: 72px;
  object-fit: contain;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, .08);
}
.sk-about-name {
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: .01em;
}
.sk-about-desc {
  margin: 0 0 1rem;
  padding: .9rem 1rem;
  background: #fff;
  border: 1px solid #e8ecf4;
  border-radius: 14px;
  color: #475569;
  font-size: .9rem;
  line-height: 1.55;
  font-weight: 400;
}
.sk-about-links {
  display: flex;
  flex-direction: column;
  gap: .45rem;
  margin-bottom: 1.1rem;
}
.sk-about-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  width: 100%;
  border: 1px solid #e8ecf4;
  background: #fff;
  border-radius: 12px;
  padding: .85rem 1rem;
  font: inherit;
  font-size: .92rem;
  font-weight: 500;
  color: #0f172a;
  cursor: pointer;
  text-align: left;
}
.sk-about-link:active { background: #f8fafc; }
.sk-about-link__chev { color: #94a3b8; font-size: 1.1rem; }
.sk-about-social {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .65rem;
  padding: .35rem 0 .75rem;
}
.sk-about-social__btn {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #fff;
  border: 1px solid #e8ecf4;
  box-shadow: 0 4px 12px rgba(15, 23, 42, .06);
  text-decoration: none;
  transition: transform .15s ease;
}
.sk-about-social__btn:active { transform: scale(.96); }
.sk-about-copy {
  flex: 0 0 auto;
  margin-top: auto;
  padding: .7rem 1rem calc(.85rem + env(safe-area-inset-bottom, 0px));
  text-align: center;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .02em;
  background: #0f172a;
  color: #e2e8f0;
}
.sk-legal-body {
  background: #fff;
  border-radius: 14px;
  border: 1px solid #e8ecf4;
  padding: 1rem 1.05rem 1.2rem;
  margin: .75rem .85rem 1rem;
  color: #334155;
  font-size: .88rem;
  line-height: 1.55;
  font-weight: 400;
}
.sk-legal-body h3 {
  margin: 1rem 0 .35rem;
  font-size: .92rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-legal-body p { margin: 0 0 .55rem; }
.sk-legal-body p:last-child { margin-bottom: 0; }
.sk-pad--security { padding-bottom: 1.25rem; }
.sk-pad--party-add {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  padding-bottom: .85rem;
}
.sk-party-add {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--sk-line);
  border-radius: 16px;
  padding: 1rem .95rem .85rem;
  box-shadow: 0 4px 14px rgba(11,31,58,.05);
}
.sk-party-add__fields {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 1.05rem;
  min-height: 0;
}
.sk-party-add__field { display: flex; flex-direction: column; gap: .35rem; }
.sk-party-add__field .sk-label { margin: 0; font-size: .78rem; }
.sk-party-add__field .sk-input {
  min-height: 3rem;
  font-size: .95rem;
  border-radius: 12px;
}
.sk-party-add__field .sk-input-with-btn { align-items: stretch; }
.sk-party-add__field .sk-input-with-btn .sk-input { flex: 1 1 auto; }
.sk-party-add__field .sk-contact-btn {
  width: 3rem;
  min-height: 3rem;
  border-radius: 12px;
}
.sk-party-add__foot {
  flex: 0 0 auto;
  margin-top: auto;
  padding-top: 1.25rem;
}
.sk-party-add__foot .sk-btn {
  width: 100%;
  min-height: 3.1rem;
  font-size: .95rem;
  font-weight: 500;
  border-radius: 12px;
}
.sk-pad--party-update {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  background: #fff;
}
.sk-party-update {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  gap: 1rem;
}
.sk-party-update__fields {
  display: flex;
  flex-direction: column;
  gap: .85rem;
  flex: 1 1 auto;
}
.sk-party-update__field {
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.sk-party-update__field .sk-label {
  margin: 0;
  font-size: .78rem;
}
.sk-party-update__field .sk-input {
  width: 100%;
}
.sk-party-update__foot {
  flex: 0 0 auto;
  margin-top: auto;
  padding-top: 1.25rem;
  padding-bottom: calc(.35rem + env(safe-area-inset-bottom, 0px));
}
.sk-party-update__foot .sk-btn {
  width: 100%;
  min-height: 3.1rem;
  font-size: .95rem;
  font-weight: 500;
  border-radius: 12px;
}
.sk-sec-hero {
  font-size: 3.2rem; text-align: center; line-height: 1; margin: .25rem 0 .35rem;
}
.sk-sec-card {
  width: 100%; display: flex; align-items: center; gap: .7rem;
  background: #fff; border: 1px solid var(--sk-line); border-radius: 14px;
  padding: .85rem .9rem; margin-bottom: .55rem; cursor: pointer;
  font-family: inherit; text-align: left; box-shadow: 0 2px 8px rgba(11,31,58,.04);
}
.sk-sec-card--toggle,
.sk-sec-card--timer { cursor: default; }
.sk-sec-card--timer.is-disabled { opacity: .55; }
.sk-sec-timer-select {
  flex: 0 0 auto; min-width: 4.6rem; max-width: 5.5rem;
  border: 1px solid var(--sk-line); border-radius: 10px;
  background: #f8fafc; color: #0f172a; font-size: .78rem; font-weight: 500;
  padding: .4rem .35rem; outline: none;
}
.sk-sec-timer-select:disabled { opacity: .7; }
.sk-sec-card__ico {
  width: 2.2rem; height: 2.2rem; border-radius: 999px; background: #ecfdf5;
  color: #15803d; display: grid; place-items: center; flex: 0 0 auto; font-size: 1.05rem;
}
.sk-sec-card__txt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: .12rem; }
.sk-sec-card__txt strong { font-size: .9rem; color: #0f172a; font-weight: 500; }
.sk-sec-card__txt small { font-size: .72rem; color: #64748b; font-weight: 500; }
.sk-sec-card__txt small.is-ok { color: #15803d; }
.sk-sec-card__chev { color: #94a3b8; font-size: 1.2rem; }
.sk-switch { position: relative; width: 46px; height: 28px; flex: 0 0 auto; display: inline-block; }
.sk-switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.sk-switch__track {
  position: absolute; inset: 0; background: #cbd5e1; border-radius: 999px;
  transition: .2s; cursor: pointer;
}
.sk-switch__track::after {
  content: ''; position: absolute; width: 22px; height: 22px; border-radius: 999px;
  background: #fff; top: 3px; left: 3px; transition: .2s;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.sk-switch input:checked + .sk-switch__track { background: #16a34a; }
.sk-switch input:checked + .sk-switch__track::after { transform: translateX(18px); }
.sk-screen--unlock {
  background: #eef2f7 !important;
  display: flex !important; align-items: center; justify-content: center;
}
.sk-unlock-blank {
  width: 100%; min-height: 100%;
  display: flex; align-items: center; justify-content: center;
  padding: 1.25rem; background: #eef2f7;
}
.sk-bio-gate__card {
  width: min(100%, 320px); background: #fff; border-radius: 16px;
  padding: 1.25rem 1.1rem; text-align: center;
  box-shadow: 0 12px 40px rgba(11,31,58,.18);
}
.sk-bio-gate__ico {
  width: 72px; height: 72px; margin: 0 auto .45rem;
  display: grid; place-items: center;
}
.sk-bio-gate__ico .sk-sec-lock-img,
.sk-sec-hero .sk-sec-lock-img {
  width: 72px; height: 72px; object-fit: contain; display: block;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0;
}
.sk-sec-hero .sk-sec-lock-img { width: 88px; height: 88px; margin: 0 auto; }
.sk-sec-lock-fb { font-size: 2.6rem; line-height: 1; }
.sk-bio-gate__card strong { display: block; font-size: 1.05rem; color: var(--sk-navy); }
.sk-bio-gate__card p { margin: .35rem 0 .85rem; color: #64748b; font-size: .82rem; font-weight: 500; }
.sk-bio-gate__card .sk-btn { margin-top: .4rem; }
.sk-auth-bio {
  margin-top: .75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
}
.sk-bio-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .7rem;
  min-width: 7.25rem;
  height: 2.65rem;
  padding: 0 1.05rem;
  border: 0;
  border-radius: 12px;
  background: #eceff3;
  box-shadow: 0 1px 2px rgba(11,31,58,.06);
  color: #22c55e;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
}
.sk-bio-chip:hover {
  background: #e4e8ee;
  box-shadow: 0 2px 8px rgba(11,31,58,.1);
}
.sk-bio-chip:active { transform: scale(.97); }
.sk-bio-chip:disabled {
  opacity: .65;
  cursor: wait;
}
.sk-bio-chip__ico {
  display: inline-grid;
  place-items: center;
  width: 1.45rem;
  height: 1.45rem;
  color: #22c55e;
}
.sk-bio-chip__ico svg {
  width: 1.4rem;
  height: 1.4rem;
  display: block;
}
.sk-bio-chip__ico.has-img {
  color: inherit;
}
.sk-bio-chip__img {
  width: 1.4rem;
  height: 1.4rem;
  object-fit: contain;
  display: block;
}
.sk-bio-chip__div {
  width: 1.5px;
  height: 1.35rem;
  border-radius: 2px;
  background: #22c55e;
  opacity: .9;
  flex: 0 0 auto;
}
.sk-login--glass .sk-bio-chip {
  background: rgba(236,239,243,.88);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.sk-auth-bio__hint {
  margin: 0;
  font-size: .68rem;
  font-weight: 500;
  color: rgba(11,31,58,.48);
  line-height: 1.3;
  text-align: center;
}
/* Photo adjust */
.sk-photo-overlay {
  position: absolute; inset: 0; z-index: 85; background: rgba(0,0,0,.72);
  display: flex; align-items: center; justify-content: center; padding: .75rem;
}
.sk-photo-modal {
  width: 100%; max-width: 360px; background: #fff; border-radius: 16px;
  padding: .85rem; box-shadow: 0 20px 40px rgba(0,0,0,.35);
}
.sk-photo-modal__top {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: .65rem;
}
.sk-photo-modal__top button {
  border: 0; background: transparent; color: var(--sk-navy); font-weight: 500;
  font-size: .82rem; cursor: pointer; font-family: inherit; padding: .25rem .35rem;
}
.sk-photo-modal__top #sk-photo-save { color: #16a34a; }
.sk-photo-stage {
  position: relative; width: 320px; max-width: 100%; aspect-ratio: 1;
  margin: 0 auto; overflow: hidden; border-radius: 12px; touch-action: none;
  background: #111; cursor: grab;
}
.sk-photo-stage canvas { width: 100%; height: 100%; display: block; }
.sk-photo-mask {
  pointer-events: none; position: absolute; inset: 0;
  box-shadow: inset 0 0 0 999px rgba(0,0,0,.45);
  background: radial-gradient(circle at center, transparent 46%, rgba(0,0,0,.5) 47%);
}
.sk-photo-zoom {
  display: flex; align-items: center; gap: .55rem; margin: .75rem 0 .25rem;
  font-size: .75rem; font-weight: 500; color: var(--sk-muted);
}
.sk-photo-zoom input { flex: 1; }
.sk-photo-hint { margin: 0; text-align: center; font-size: .7rem; color: #94a3b8; font-weight: 500; }
.sk-pad--profile { direction: ltr; text-align: left; }
.sk-profile-card {
  background: #fff; border: 1px solid var(--sk-line); border-radius: 16px;
  padding: 1rem; box-shadow: 0 4px 14px rgba(11,31,58,.06); margin-bottom: .75rem;
  direction: ltr;
}
.sk-profile-row {
  display: grid;
  grid-template-columns: 7.25rem minmax(0, 1fr);
  align-items: start;
  gap: .65rem;
  padding: .55rem 0;
  border-bottom: 1px solid #eef2f0;
  font-size: .82rem;
  direction: ltr;
  text-align: left;
}
.sk-profile-row:last-child { border-bottom: 0; }
.sk-profile-row span {
  color: var(--sk-muted);
  font-weight: 500;
  text-align: left;
}
.sk-profile-row strong {
  color: var(--sk-navy);
  font-weight: 500;
  text-align: left;
  justify-self: start;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.sk-pad { padding: .75rem .75rem 1rem; background: var(--sk-bg); flex: 1 1 auto; }
/* Home — clean khata-style Start screen */
.sk-pad--home {
  padding: .7rem .85rem .55rem;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  background: #f4f6fb;
  gap: 0;
}
.sk-home-top {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  align-items: center;
  gap: .55rem;
  flex: 0 0 auto;
  /* Full-bleed white bar across home width */
  width: calc(100% + 1.7rem);
  max-width: none;
  margin: -.7rem -.85rem .75rem;
  padding: .65rem .85rem .7rem;
  box-sizing: border-box;
  background: #fff;
  border-bottom: 1px solid #eef2f7;
}
.sk-home-user {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font: inherit;
  width: 56px;
  height: 56px;
  flex: 0 0 auto;
}
.sk-home-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .08rem;
  min-width: 0;
  text-align: center;
}
.sk-home-brand--left {
  align-items: flex-start;
  text-align: left;
  justify-content: center;
}
.sk-home-brand strong {
  font-size: .95rem;
  font-weight: 500;
  color: #0b1f3a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.sk-home-brand small {
  font-size: .72rem;
  font-weight: 500;
  color: #64748b;
  letter-spacing: .01em;
}
.sk-home-top__right {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex: 0 0 auto;
}
.sk-home-remind {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #0f766e;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
  box-shadow: 0 2px 8px rgba(11,31,58,.06);
}
.sk-home-remind svg { width: 1.2rem; height: 1.2rem; display: block; }
.sk-home-remind:active { transform: scale(.96); }
.sk-avatar--home {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  overflow: hidden;
  background: #e2e8f0;
  color: #0b1f3a;
  display: grid;
  place-items: center;
  font-size: .78rem;
  font-weight: 500;
  flex: 0 0 auto;
  border: 2.5px solid #fff;
  box-shadow:
    0 0 0 2px #0d9488,
    0 3px 10px rgba(13, 148, 136, .28);
}
.sk-avatar--home img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: inherit;
}
/* Home header: brand logo — larger, clear, no grey/photo box */
.sk-avatar--home-logo {
  width: 56px !important;
  height: 56px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible;
  border-radius: 0;
}
.sk-avatar--home-logo .sk-avatar--home__logo,
.sk-avatar--home-logo img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  object-position: center;
  display: block;
  border-radius: 0;
  background: transparent;
  mix-blend-mode: normal;
}
#sk-avatar-btn.sk-home-user {
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  border-radius: 999px;
  -webkit-tap-highlight-color: transparent;
}
.sk-home-user__txt {
  display: flex;
  flex-direction: column;
  gap: .08rem;
  min-width: 0;
}
.sk-home-user__txt strong {
  font-size: .95rem;
  font-weight: 500;
  color: #0b1f3a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-home-user__txt small {
  font-size: .68rem;
  font-weight: 500;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.sk-home-refresh {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #16a34a;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
  box-shadow: 0 2px 8px rgba(11,31,58,.06);
}
.sk-home-refresh svg { width: 1.15rem; height: 1.15rem; }
.sk-home-refresh:disabled { opacity: .55; }
.sk-ticker {
  --sk-ticker-size: 13px;
  --sk-ticker-dur: 28s;
  margin: 0 0 .5rem;
  flex: 0 0 auto;
  border-radius: 12px;
  background: linear-gradient(90deg, #eef6ff 0%, #fff7ed 50%, #ecfdf5 100%);
  border: 1px solid #e2e8f0;
  overflow: hidden;
  min-height: 2rem;
  display: flex;
  align-items: center;
}
.sk-ticker__viewport {
  width: 100%;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.sk-ticker__track {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  gap: 0;
  font-size: var(--sk-ticker-size);
  font-weight: 500;
  line-height: 1.35;
  padding: .4rem 0;
  will-change: transform;
  animation: skTickerRtl var(--sk-ticker-dur) linear infinite;
}
.sk-ticker--ltr .sk-ticker__track {
  animation-name: skTickerLtr;
}
.sk-ticker__w { margin-right: .35em; }
.sk-ticker__gap {
  display: inline-block;
  color: #94a3b8;
  margin: 0 .65rem;
}
@keyframes skTickerRtl {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@keyframes skTickerLtr {
  from { transform: translateX(-50%); }
  to { transform: translateX(0); }
}
@media (prefers-reduced-motion: reduce) {
  .sk-ticker__track { animation: none; transform: none; }
}
.sk-home-theme--classic {
  background: linear-gradient(135deg, #ef4444 50%, #22c55e 50%);
}
.sk-home-theme--soft {
  background: linear-gradient(135deg, #f43f5e 50%, #14b8a6 50%);
}
.sk-home-theme--vivid {
  background: linear-gradient(135deg, #e11d48 50%, #059669 50%);
}
.sk-home-theme--ocean {
  background: linear-gradient(135deg, #0ea5e9 50%, #22d3ee 50%);
}
.sk-home-theme--sunset {
  background: linear-gradient(135deg, #f97316 50%, #eab308 50%);
}
.sk-home-theme--midnight {
  background: linear-gradient(135deg, #6366f1 50%, #a855f7 50%);
}
.sk-home-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .7rem;
  flex: 0 0 auto;
}
.sk-home-card {
  border-radius: 18px;
  padding: .75rem .8rem .7rem;
  display: flex;
  flex-direction: column;
  gap: .28rem;
  min-height: 102px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(15, 23, 42, .06);
}
.sk-home-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .35rem;
  margin-bottom: .1rem;
}
.sk-card-eye {
  width: 1.85rem;
  height: 1.85rem;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, .55);
  color: inherit;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  flex: 0 0 auto;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .1);
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
  animation: skEyeFloat 2.8s ease-in-out infinite;
}
.sk-card-eye__svg { width: 1.05rem; height: 1.05rem; display: block; }
.sk-card-eye.is-on .sk-card-eye__pupil {
  transform-origin: center;
  animation: skEyeBlink 3.6s ease-in-out infinite;
}
.sk-card-eye.is-off {
  background: rgba(15, 23, 42, .12);
  opacity: .85;
  animation: none;
}
.sk-card-eye.is-pulse {
  animation: skEyePulse .35s ease;
}
.sk-card-eye:active { transform: scale(.9); }
@keyframes skEyeFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
@keyframes skEyeBlink {
  0%, 42%, 48%, 100% { transform: scaleY(1); }
  45% { transform: scaleY(.12); }
}
@keyframes skEyePulse {
  0% { transform: scale(1); }
  40% { transform: scale(1.18); }
  100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .sk-card-eye,
  .sk-card-eye.is-on .sk-card-eye__pupil { animation: none; }
}
.sk-home-card__ico {
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  margin-bottom: 0;
  flex: 0 0 auto;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .12);
}
.sk-home-card__ico svg {
  width: 1.05rem;
  height: 1.05rem;
  display: block;
}
.sk-home-card strong {
  font-size: 1.18rem;
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.15;
}
.sk-home-card small {
  font-size: .72rem;
  font-weight: 500;
  opacity: .92;
}
/* Theme 1 — Classic red / green */
.sk-home-cards--classic .sk-home-card--recv {
  background: linear-gradient(160deg, #ffe4e6 0%, #fecdd3 100%);
  color: #be123c;
}
.sk-home-cards--classic .sk-home-card--recv .sk-home-card__ico {
  background: #ef4444;
  color: #fff;
}
.sk-home-cards--classic .sk-home-card--pay {
  background: linear-gradient(160deg, #dcfce7 0%, #bbf7d0 100%);
  color: #15803d;
}
.sk-home-cards--classic .sk-home-card--pay .sk-home-card__ico {
  background: #22c55e;
  color: #fff;
}
/* Theme 2 — Soft rose / teal */
.sk-home-cards--soft .sk-home-card--recv {
  background: linear-gradient(160deg, #fff1f2 0%, #fda4af 100%);
  color: #9f1239;
}
.sk-home-cards--soft .sk-home-card--recv .sk-home-card__ico {
  background: #f43f5e;
  color: #fff;
}
.sk-home-cards--soft .sk-home-card--pay {
  background: linear-gradient(160deg, #f0fdfa 0%, #99f6e4 100%);
  color: #0f766e;
}
.sk-home-cards--soft .sk-home-card--pay .sk-home-card__ico {
  background: #14b8a6;
  color: #fff;
}
/* Theme 3 — Vivid crimson / emerald */
.sk-home-cards--vivid .sk-home-card--recv {
  background: linear-gradient(160deg, #ffe4e6 0%, #fb7185 55%, #f43f5e 100%);
  color: #881337;
}
.sk-home-cards--vivid .sk-home-card--recv .sk-home-card__ico {
  background: #e11d48;
  color: #fff;
  box-shadow: 0 3px 10px rgba(225, 29, 72, .35);
}
.sk-home-cards--vivid .sk-home-card--pay {
  background: linear-gradient(160deg, #ecfdf5 0%, #34d399 55%, #10b981 100%);
  color: #064e3b;
}
.sk-home-cards--vivid .sk-home-card--pay .sk-home-card__ico {
  background: #059669;
  color: #fff;
  box-shadow: 0 3px 10px rgba(5, 150, 105, .35);
}
.sk-home-cards--vivid .sk-home-card--recv strong,
.sk-home-cards--vivid .sk-home-card--pay strong { color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.12); }
.sk-home-cards--vivid .sk-home-card--recv small,
.sk-home-cards--vivid .sk-home-card--pay small { color: rgba(255,255,255,.92); }
/* Theme 4 — Ocean blue / cyan */
.sk-home-cards--ocean .sk-home-card--recv {
  background: linear-gradient(160deg, #e0f2fe 0%, #7dd3fc 100%);
  color: #075985;
}
.sk-home-cards--ocean .sk-home-card--recv .sk-home-card__ico {
  background: #0284c7;
  color: #fff;
}
.sk-home-cards--ocean .sk-home-card--pay {
  background: linear-gradient(160deg, #ecfeff 0%, #67e8f9 100%);
  color: #155e75;
}
.sk-home-cards--ocean .sk-home-card--pay .sk-home-card__ico {
  background: #0891b2;
  color: #fff;
}
/* Theme 5 — Sunset orange / amber */
.sk-home-cards--sunset .sk-home-card--recv {
  background: linear-gradient(160deg, #ffedd5 0%, #fdba74 100%);
  color: #9a3412;
}
.sk-home-cards--sunset .sk-home-card--recv .sk-home-card__ico {
  background: #ea580c;
  color: #fff;
}
.sk-home-cards--sunset .sk-home-card--pay {
  background: linear-gradient(160deg, #fef9c3 0%, #fde047 100%);
  color: #854d0e;
}
.sk-home-cards--sunset .sk-home-card--pay .sk-home-card__ico {
  background: #ca8a04;
  color: #fff;
}
/* Theme 6 — Midnight indigo / violet */
.sk-home-cards--midnight .sk-home-card--recv {
  background: linear-gradient(160deg, #e0e7ff 0%, #818cf8 100%);
  color: #312e81;
}
.sk-home-cards--midnight .sk-home-card--recv .sk-home-card__ico {
  background: #4f46e5;
  color: #fff;
}
.sk-home-cards--midnight .sk-home-card--pay {
  background: linear-gradient(160deg, #f3e8ff 0%, #c084fc 100%);
  color: #581c87;
}
.sk-home-cards--midnight .sk-home-card--pay .sk-home-card__ico {
  background: #9333ea;
  color: #fff;
}
.sk-home-cards--midnight .sk-home-card--recv strong,
.sk-home-cards--midnight .sk-home-card--pay strong { color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.14); }
.sk-home-cards--midnight .sk-home-card--recv small,
.sk-home-cards--midnight .sk-home-card--pay small { color: rgba(255,255,255,.92); }
.sk-home-searchrow {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin-bottom: .65rem;
  flex: 0 0 auto;
}
.sk-home-search {
  display: flex;
  align-items: center;
  gap: .45rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: .55rem .75rem;
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  box-shadow: 0 2px 8px rgba(11,31,58,.04);
  cursor: text;
}
.sk-home-ico-btn {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #64748b;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
  padding: 0;
  box-shadow: 0 2px 8px rgba(11,31,58,.04);
  -webkit-tap-highlight-color: transparent;
}
.sk-home-ico-btn svg,
.sk-home-ico-btn .ico { width: 1.25rem; height: 1.25rem; display: block; object-fit: contain; }
.sk-home-ico-btn > .ico {
  width: 1.35rem;
  height: 1.35rem;
  object-fit: contain;
  display: block;
}
.sk-home-ico-btn--pdf {
  position: relative;
}
.sk-home-ico-btn--pdf span {
  position: absolute;
  left: 50%;
  top: 58%;
  transform: translate(-50%, -50%);
  font-size: .42rem;
  font-weight: 500;
  letter-spacing: .02em;
  color: currentColor;
  line-height: 1;
  pointer-events: none;
}
.sk-home-ico-btn:active { transform: scale(.96); background: #f8fafc; }
.sk-home-ico-btn.is-active {
  color: #0b1f3a;
  border-color: #cbd5e1;
  box-shadow: 0 0 0 2px rgba(11,31,58,.08);
}
.sk-home-search__ico {
  color: #94a3b8;
  font-size: 1rem;
  font-weight: 500;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  line-height: 1;
}
.sk-home-search__ico svg,
.sk-home-search__ico .ico {
  width: 1.25rem;
  height: 1.25rem;
  display: block;
  object-fit: contain;
}
.sk-home-searchrow .sk-home-ico-btn svg,
.sk-home-searchrow .sk-home-ico-btn .ico {
  width: 1.45rem;
  height: 1.45rem;
}
.sk-home-search input {
  border: 0;
  outline: 0;
  background: transparent;
  flex: 1 1 auto;
  min-width: 0;
  font: inherit;
  font-size: .88rem;
  font-weight: 500;
  color: #0b1f3a;
}
.sk-home-search input::placeholder { color: #94a3b8; font-weight: 500; }
.sk-home-search input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; display: none; }
.sk-pad--search {
  background: #fff;
  padding: 0;
  gap: 0;
}
.sk-home-search--active {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  margin: 0;
  padding: .85rem 1rem;
  border-bottom: 1px solid #e8ecf1;
  background: #fff;
}
.sk-home-search--active input {
  font-size: .95rem;
  font-weight: 500;
}
.sk-home-search__clear {
  border: 0;
  background: transparent;
  color: #94a3b8;
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  font-size: 1.45rem;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  flex: 0 0 auto;
  border-radius: 999px;
  -webkit-tap-highlight-color: transparent;
}
.sk-home-search__clear:active { background: #f1f5f9; color: #64748b; }
.sk-home-search-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: #fff;
  padding: 0 .25rem;
}
button.sk-home-searchhit {
  display: flex;
  align-items: center;
  gap: .8rem;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #f1f5f9;
  background: #fff;
  padding: .9rem .85rem;
  cursor: pointer;
  font: inherit;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
}
button.sk-home-searchhit:active { background: #f8fafc; }
.sk-home-searchhit__av {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: #eef1f6;
  color: #475569;
  display: grid;
  place-items: center;
  font-size: .95rem;
  font-weight: 500;
  flex: 0 0 auto;
}
.sk-home-searchhit__name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: .98rem;
  font-weight: 500;
  color: #1e293b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-home-searchhit__bal {
  flex: 0 0 auto;
  font-size: .95rem;
  font-weight: 500;
  color: #334155;
}
.sk-home-searchhit__bal.is-recv { color: var(--sk-recv-ink); }
.sk-home-searchhit__bal.is-pay { color: var(--sk-pay-ink); }
.sk-home-searchhit__bal.is-zero,
.sk-home-searchhit__bal.is-masked { color: #64748b; }
.sk-home-panel {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 0;
  border: 1px solid #e8ecf1;
  border-left: 0;
  border-right: 0;
  margin-left: -.85rem;
  margin-right: -.85rem;
  width: calc(100% + 1.7rem);
  max-width: none;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .03);
}
.sk-home-section {
  font-size: .68rem;
  font-weight: 500;
  color: #94a3b8;
  letter-spacing: .08em;
  margin: 0;
  padding: .7rem .9rem .35rem;
  flex: 0 0 auto;
  background: #fff;
}
.sk-home-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
  background: #fff;
}
.sk-home-empty { padding: 1.25rem .9rem; }
button.sk-home-cust {
  display: flex;
  align-items: center;
  gap: .7rem;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #eef2f7;
  border-radius: 0;
  background: #fff;
  padding: .78rem .9rem;
  cursor: pointer;
  font: inherit;
  text-align: left;
  box-shadow: none;
  -webkit-tap-highlight-color: transparent;
  transition: background .12s ease;
}
button.sk-home-cust:last-child { border-bottom: 0; }
button.sk-home-cust:active { background: #f8fafc; }
.sk-home-cust__av {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  display: grid;
  place-items: center;
  font-size: .78rem;
  font-weight: 500;
  letter-spacing: .02em;
  flex: 0 0 auto;
}
.sk-home-cust__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.sk-home-cust__name {
  display: block;
  font-size: .95rem;
  font-weight: 500;
  color: #1e293b;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-home-cust__sub {
  display: block;
  font-size: .7rem;
  font-weight: 500;
  color: #94a3b8;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-home-cust__bal {
  font-size: .9rem;
  font-weight: 500;
  white-space: nowrap;
  flex: 0 0 auto;
  text-align: right;
  letter-spacing: -.01em;
  line-height: 1.2;
}
.sk-home-cust__bal.is-recv { color: var(--sk-recv-ink); }
.sk-home-cust__bal.is-pay { color: var(--sk-pay-ink); }
.sk-home-cust__bal.is-zero,
.sk-home-cust__bal.is-masked { color: #64748b; font-weight: 500; }
.sk-home-add {
  flex: 0 0 auto;
  width: 100%;
  margin-top: .35rem;
  border: 0;
  border-radius: 14px;
  background: #0b1f3a;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 500;
  padding: .85rem 1rem;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(11,31,58,.2);
  position: sticky;
  bottom: 0;
  z-index: 6;
  text-align: center;
}
.sk-home-add:active { transform: scale(.985); }
.sk-pad--home .sk-home-panel {
  flex: 1 1 auto;
  min-height: 0;
}
.sk-pad--home .sk-home-list {
  flex: 1 1 auto;
  min-height: 0;
}
/* Themes picker page */
.sk-screen:has(> .sk-th) { overflow: hidden; padding-bottom: 0; background: #f4f6fb; }
.sk-th {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  height: 100%;
  overflow: hidden;
  background: #f4f6fb;
}
.sk-th-top {
  display: flex;
  align-items: center;
  gap: .25rem;
  padding: .55rem .55rem .25rem;
  flex: 0 0 auto;
  background: #f4f6fb;
}
.sk-th-title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 500;
  color: #0f172a;
}
.sk-pad--themes {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: #f4f6fb;
  padding: .4rem .85rem 1rem;
}
.sk-th-demo-lab,
.sk-th-list-lab {
  font-size: .7rem;
  font-weight: 500;
  color: #94a3b8;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin: .35rem 0 .5rem;
}
.sk-th-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
}
button.sk-th-opt {
  border: 1.5px solid #e2e8f0;
  background: #fff;
  border-radius: 16px;
  padding: .65rem .6rem .7rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .45rem;
  cursor: pointer;
  font: inherit;
  text-align: left;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .04);
  -webkit-tap-highlight-color: transparent;
}
button.sk-th-opt.is-on {
  border-color: #0b1f3a;
  box-shadow: 0 0 0 2px rgba(11, 31, 58, .12);
}
.sk-th-opt__swatch {
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px #cbd5e1;
  display: block;
}
.sk-th-opt__mini {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .3rem;
  width: 100%;
  margin: 0;
}
.sk-th-opt__mini .sk-home-card {
  min-height: 36px;
  padding: 0;
  border-radius: 10px;
  box-shadow: none;
}
.sk-th-opt strong {
  font-size: .82rem;
  font-weight: 500;
  color: #0f172a;
}
.sk-th-foot {
  flex: 0 0 auto;
  padding: .65rem .85rem calc(.75rem + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #eef2f7;
}
.sk-th-ok {
  width: 100%;
  border: 0;
  border-radius: 14px;
  background: #0b1f3a;
  color: #fff;
  font: inherit;
  font-size: .98rem;
  font-weight: 500;
  padding: .95rem 1rem;
  cursor: pointer;
}
.sk-th-ok:active { transform: scale(.985); }
/* Quick Actions bottom sheet */
.sk-sheet {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.sk-sheet__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(11,31,58,.45);
  cursor: pointer;
}
.sk-sheet__panel {
  position: relative;
  width: 100%;
  max-width: 430px;
  background: #fff;
  border-radius: 20px 20px 0 0;
  padding: .55rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
  box-shadow: 0 -12px 40px rgba(11,31,58,.2);
  animation: skSheetUp .28s ease-out;
}
@keyframes skSheetUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.sk-sheet__handle {
  width: 42px;
  height: 4px;
  border-radius: 999px;
  background: #cbd5e1;
  margin: .15rem auto .65rem;
}
.sk-sheet__title {
  font-size: 1.05rem;
  font-weight: 500;
  color: #0b1f3a;
  margin: 0 0 .75rem;
  text-align: center;
}
.sk-sheet__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .5rem;
  margin-bottom: .75rem;
}
.sk-sheet__done { width: 100%; }
/* Home filter bottom sheet */
.sk-filter-panel { padding-bottom: calc(1.1rem + env(safe-area-inset-bottom, 0px)); }
.sk-filter-title {
  font-size: 1.15rem;
  font-weight: 500;
  color: #0f172a;
  margin: 0 0 .85rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid #eef2f7;
}
.sk-filter-block {
  padding: .85rem 0;
  border-bottom: 1px solid #eef2f7;
}
.sk-filter-block:last-of-type { border-bottom: 0; margin-bottom: .35rem; }
.sk-filter-label {
  font-size: .72rem;
  font-weight: 500;
  color: #94a3b8;
  letter-spacing: .04em;
  margin-bottom: .55rem;
}
.sk-fchips {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
button.sk-fchip {
  border: 1px solid #d1d5db;
  background: #fff;
  color: #0f172a;
  border-radius: 999px;
  padding: .45rem .85rem;
  font: inherit;
  font-size: .84rem;
  font-weight: 500;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
button.sk-fchip.is-on {
  background: #0f172a;
  border-color: #0f172a;
  color: #fff;
}
.sk-filter-apply {
  width: 100%;
  margin-top: .85rem;
  border: 0;
  border-radius: 14px;
  background: #0f172a;
  color: #fff;
  font: inherit;
  font-size: .98rem;
  font-weight: 500;
  padding: .95rem 1rem;
  cursor: pointer;
}
.sk-filter-apply:active { transform: scale(.985); }
/* Report of your Khata */
.sk-screen:has(> .sk-kr) { overflow: hidden; padding-bottom: 0; }
.sk-kr {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  height: 100%;
  background: #fff;
  overflow: hidden;
}
.sk-kr-top {
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: .65rem .7rem .4rem;
  flex: 0 0 auto;
  background: #fff;
}
.sk-kr-back {
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  background: transparent;
  color: #0f172a;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  border-radius: 999px;
}
.sk-kr-back svg { width: 1.35rem; height: 1.35rem; }
.sk-kr-title {
  margin: 0;
  flex: 1 1 auto;
  text-align: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.2rem;
  font-weight: 500;
  color: #0f172a;
  padding-right: 2.25rem;
}
.sk-pad--kr {
  background: #fff;
  padding: .35rem .85rem .75rem;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  min-height: 0;
  flex: 1 1 auto;
}
.sk-kr-filters {
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: .85rem;
  background: #fff;
}
.sk-kr-dates {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid #e5e7eb;
}
.sk-kr-dates .sk-kr-field:first-child { border-right: 1px solid #e5e7eb; }
.sk-kr-field {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: .45rem;
  row-gap: .1rem;
  padding: .7rem .75rem;
  margin: 0;
  cursor: pointer;
  position: relative;
}
.sk-kr-field--full {
  grid-template-columns: auto 1fr;
  grid-template-rows: auto;
  align-items: center;
}
.sk-kr-field__ico {
  grid-row: 1 / span 2;
  color: #64748b;
  display: grid;
  place-items: center;
}
.sk-kr-field--full .sk-kr-field__ico { grid-row: 1; }
.sk-kr-field__ico svg { width: 1.15rem; height: 1.15rem; display: block; }
.sk-kr-field__lab {
  grid-column: 2;
  font-size: .68rem;
  font-weight: 500;
  color: #94a3b8;
  line-height: 1.1;
}
.sk-kr-field input[type="date"],
.sk-kr-field select {
  grid-column: 2;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: .9rem;
  font-weight: 500;
  color: #0f172a;
  min-width: 0;
  width: 100%;
  padding: 0;
  margin: 0;
}
.sk-kr-field--full select { font-size: .95rem; }
.sk-kr-cols,
.sk-kr-cols--table {
  display: grid;
  grid-template-columns: 2.2rem 1.35fr .95fr .95fr;
  gap: .3rem;
  align-items: end;
  padding: .15rem .15rem .55rem;
  border-bottom: 1px solid #eef2f7;
  font-size: .68rem;
  font-weight: 500;
  color: #94a3b8;
}
.sk-kr-cols__no { text-align: center; }
.sk-kr-cols__gave,
.sk-kr-cols__got {
  text-align: right;
  line-height: 1.25;
}
.sk-kr-cols__gave strong { color: var(--sk-recv-ink); font-size: .86rem; }
.sk-kr-cols__got strong { color: var(--sk-pay-ink); font-size: .86rem; }
.sk-kr-list { padding-top: .1rem; }
.sk-kr-row {
  display: grid;
  grid-template-columns: 2.2rem 1.35fr .95fr .95fr;
  gap: .3rem;
  align-items: center;
  padding: .7rem .15rem;
  border-bottom: 1px solid #eef2f7;
}
.sk-kr-row__no {
  text-align: center;
  font-size: .8rem;
  font-weight: 500;
  color: #64748b;
}
.sk-kr-row__name { min-width: 0; }
.sk-kr-row__name strong {
  font-size: .9rem;
  font-weight: 500;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}
.sk-kr-row__gave,
.sk-kr-row__got {
  text-align: right;
  font-size: .86rem;
  font-weight: 500;
  white-space: nowrap;
}
.sk-kr-row__gave { color: var(--sk-recv-ink); }
.sk-kr-row__got { color: var(--sk-pay-ink); }
.sk-kr-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  padding: .65rem .85rem calc(.75rem + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-kr-actions--3 {
  grid-template-columns: 1fr 1fr 1fr;
  gap: .4rem;
}
.sk-kr-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  border: 0;
  border-radius: 12px;
  padding: .7rem .35rem;
  font: inherit;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .02em;
  cursor: pointer;
  color: #fff;
  -webkit-tap-highlight-color: transparent;
}
.sk-kr-btn svg { width: 1.1rem; height: 1.1rem; flex: 0 0 auto; }
.sk-kr-btn--dl { background: #0f172a; }
.sk-kr-btn--print { background: #334155; }
.sk-kr-btn--share { background: #0f766e; }
.sk-kr-btn:active { transform: scale(.985); }
.sk-h-store {
  display: flex; align-items: center; gap: .7rem;
  background: #fff; border-radius: 16px; padding: .8rem .85rem;
  box-shadow: 0 6px 18px rgba(11,31,58,.08); border: 1px solid var(--sk-line);
  margin-bottom: .65rem; flex: 0 0 auto;
}
.sk-h-store__ico {
  width: 48px; height: 48px; border-radius: 14px; background: transparent;
  color: var(--sk-orange); display: grid; place-items: center; flex: 0 0 auto; font-size: 1.55rem;
}
.sk-h-store h3 { margin: 0; font-size: 1.08rem; font-weight: 500; color: var(--sk-navy); }
.sk-h-store p { margin: .2rem 0 0; font-size: .78rem; color: var(--sk-muted); font-weight: 500; }
.sk-h-store p em {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  background: #22c55e; margin-right: .35rem; vertical-align: middle; font-style: normal;
}
.sk-h-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: .55rem;
  flex: 0 0 auto;
}
.sk-h-stat {
  background: #fff; border: 1px solid var(--sk-line); border-radius: 14px;
  padding: .7rem .75rem; box-shadow: 0 4px 12px rgba(11,31,58,.05); min-height: 88px;
}
.sk-h-stat__lab {
  display: flex; align-items: center; gap: .45rem;
  font-size: .78rem; font-weight: 500; color: var(--sk-muted); margin-bottom: .4rem;
}
.sk-h-stat__val { display: block; font-size: 1.05rem; font-weight: 500; color: var(--sk-navy); letter-spacing: -.01em; }
.sk-h-stat__ico {
  width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center;
  flex: 0 0 auto; overflow: hidden; font-size: 1.15rem; background: transparent !important;
}
.sk-h-stat__ico img { width: 100%; height: 100%; object-fit: contain; }
.sk-h-stat__ico--gold,
.sk-h-stat__ico--green,
.sk-h-stat__ico--orange,
.sk-h-stat__ico--blue,
.sk-h-stat__ico--peach { background: transparent !important; }
.sk-h-stat__ico--gold { color: #f59e0b; }
.sk-h-stat__ico--green { color: #16a34a; }
.sk-h-stat__ico--orange { color: #ea580c; }
.sk-h-stat__ico--blue { color: #2563eb; }
.sk-h-stat__ico--peach { color: #f97316; }
.sk-h-stat.is-hi {
  background: #fff;
  border: 1px solid var(--sk-line);
  box-shadow: 0 4px 12px rgba(11,31,58,.05);
}
.sk-h-stat.is-hi .sk-h-stat__lab { color: var(--sk-muted); }
.sk-h-stat.is-hi .sk-h-stat__val { color: var(--sk-navy); }
.sk-h-stat.is-hi .sk-h-stat__ico { background: transparent !important; color: #f97316; }
.sk-h-meta {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  margin: .55rem 0 .1rem; padding: .25rem .15rem;
  font-size: .78rem; font-weight: 500; color: var(--sk-muted); flex: 0 0 auto;
}
.sk-h-meta span { display: inline-flex; align-items: center; gap: .35rem; }
/* Quick Actions — 3 per row */
.sk-h-qa {
  font-size: .95rem; font-weight: 500; color: var(--sk-navy);
  margin: .45rem 0 .4rem; flex: 0 0 auto;
}
.sk-h-actions {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem;
  flex: 0 0 auto;
}
.sk-h-action {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .3rem; text-align: center; border: 1px solid var(--sk-line); border-radius: 12px;
  padding: .55rem .25rem; min-height: 78px; cursor: pointer; font: inherit;
  box-shadow: 0 2px 8px rgba(11,31,58,.04); background: #fff !important;
}
.sk-h-action span.label { font-size: .72rem; font-weight: 500; color: var(--sk-navy); line-height: 1.2; }
.sk-h-action__ico {
  width: 36px; height: 36px; border-radius: 0; display: grid; place-items: center;
  overflow: visible; font-size: 1.35rem; background: transparent !important;
}
.sk-h-action__ico img { width: 100%; height: 100%; object-fit: contain; }
.sk-h-action--credit,
.sk-h-action--receive,
.sk-h-action--in,
.sk-h-action--out,
.sk-h-action--exp { background: #fff !important; }
.sk-h-action--credit .sk-h-action__ico,
.sk-h-action--receive .sk-h-action__ico,
.sk-h-action--in .sk-h-action__ico,
.sk-h-action--out .sk-h-action__ico,
.sk-h-action--exp .sk-h-action__ico { background: transparent !important; }

.sk-appbar {
  display: flex; align-items: center; gap: .45rem; padding: .55rem .75rem;
  background: #fff; color: var(--sk-navy);
  border-bottom: 1px solid var(--sk-line); min-height: 48px;
  position: sticky; top: 0; z-index: 6; flex: 0 0 auto;
}
.sk-appbar h1 {
  margin: 0; flex: 1; font-size: .95rem; font-weight: 500; color: #111;
  display: flex; align-items: center; gap: .4rem;
}
.sk-appbar h1 .ico { filter: none; }
.sk-appbar h1 .fa-fallback { color: #111; }
.sk-appbar > button[data-go] {
  border: 0; background: #f1f5f9; color: #111; width: 34px; height: 34px;
  border-radius: 999px; cursor: pointer; font-size: 1rem; font-weight: 500;
}
.sk-title { font-size: 1.05rem; font-weight: 500; color: var(--sk-navy); margin: 0; }
.sk-sub { font-size: .72rem; color: var(--sk-muted); margin: .15rem 0 .75rem; }
.sk-btn {
  display: block; width: 100%; border: 0; border-radius: 10px;
  padding: .62rem .7rem; background: var(--sk-navy); color: #fff;
  font-weight: 500; font-size: .84rem; cursor: pointer;
}
.sk-btn:disabled,
.sk-btn.is-busy { opacity: .55; cursor: not-allowed; }
.sk-btn.ghost {
  display: flex; align-items: center; justify-content: center; gap: .4rem;
  width: 100%; border: 1px solid var(--sk-line); border-radius: 10px;
  padding: .55rem .7rem; background: #fff; color: var(--sk-navy);
  font-weight: 500; font-size: .8rem; margin-top: .4rem; cursor: pointer;
}
.sk-input {
  width: 100%; border: 1px solid var(--sk-line); border-radius: 10px;
  padding: .5rem .6rem; font-size: .8rem; margin-bottom: .5rem; background: #fff;
}
.sk-input-with-btn {
  display: flex; align-items: stretch; gap: .4rem;
  margin-bottom: .5rem;
}
.sk-input-with-btn .sk-input {
  margin-bottom: 0; flex: 1 1 auto; min-width: 0;
  padding-right: .55rem;
}
.sk-contact-btn {
  flex: 0 0 auto; width: 42px; border: 1px solid var(--sk-line);
  border-radius: 10px; background: #fff; color: #0b1f3a;
  display: grid; place-items: center; cursor: pointer; padding: 0;
  -webkit-tap-highlight-color: transparent;
}
.sk-contact-btn:hover { background: #f1f5f9; border-color: #cbd5e1; }
.sk-contact-btn svg,
.sk-contact-btn .ico {
  width: 1.9rem;
  height: 1.9rem;
  display: block;
  object-fit: contain;
}
.sk-party-add__field .sk-contact-btn svg,
.sk-party-add__field .sk-contact-btn .ico {
  width: 2.35rem;
  height: 2.35rem;
}
.sk-label { font-size: .72rem; font-weight: 500; color: var(--sk-muted); margin: 0 0 .25rem; }
.sk-card { background: #fff; border: 1px solid var(--sk-line); border-radius: 14px; padding: .85rem; }
.sk-card.glass { backdrop-filter: blur(6px); border-color: rgba(255,255,255,.35); }
.sk-brand { display: flex; align-items: center; gap: .55rem; margin-bottom: .2rem; }
.sk-brand img { width: 42px; height: 42px; border-radius: 12px; object-fit: cover; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.sk-brand h2 { margin: 0; font-size: 1.35rem; font-weight: 500; line-height: 1.15; }
.sk-brand--auth {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0;
  margin: 0 0 .35rem;
  width: 100%;
  min-height: 9.5rem;
}
.sk-brand--auth img {
  width: min(92%, 320px);
  height: auto;
  max-height: 9.25rem;
  border-radius: 22px;
  object-fit: contain;
  background: transparent;
  box-shadow: none;
  flex: 0 0 auto;
  display: block;
  overflow: hidden;
  animation: skBrandIn .7s ease-out both, skBrandFloat 3.6s ease-in-out .7s infinite;
  will-change: transform, opacity;
}
@keyframes skBrandIn {
  from { opacity: 0; transform: translateY(-10px) scale(.92); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes skBrandFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
@media (prefers-reduced-motion: reduce) {
  .sk-brand--auth img { animation: none; }
}
/* Create account: smaller logo */
.sk-brand--auth-reg {
  min-height: 5.5rem;
  margin-bottom: .25rem;
}
.sk-brand--auth-reg img {
  width: min(58%, 168px);
  max-height: 5.25rem;
  border-radius: 16px;
}
.sk-brand__text {
  display: flex; flex-direction: column; justify-content: center;
  gap: .05rem; min-width: 0; line-height: 1.15;
}
.sk-auth-actions--row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin-top: .35rem;
}
.sk-auth-guest-hint {
  margin: .65rem 0 0;
  font-size: .72rem;
  line-height: 1.4;
  color: #64748b;
  text-align: center;
}
.sk-auth-guest-hint strong { color: #0b1f3a; font-weight: 700; }
.sk-auth-actions--row .sk-btn {
  margin-top: 0 !important;
  font-size: .82rem;
  padding: .62rem .45rem;
}
.sk-muted { font-size: .72rem; color: var(--sk-muted); }
.sk-row {
  background: #fff; border: 1px solid var(--sk-line); border-radius: 12px;
  padding: .65rem .7rem; margin-bottom: .45rem;
}
.sk-row strong { font-size: .8rem; color: var(--sk-navy); }
.sk-cash-row {
  display: flex; justify-content: space-between; align-items: center; gap: .5rem;
  padding: .55rem 0; border-bottom: 1px solid #eef2f0; font-size: .8rem;
}
.sk-cash-row:last-child { border-bottom: 0; }
.sk-cash-dates {
  display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; margin-bottom: .5rem;
}
.sk-cash-datebar {
  display: flex; align-items: flex-end; gap: .55rem; margin-bottom: .55rem;
}
.sk-cash-datebar--actions { align-items: stretch; }
.sk-cash-datefield { flex: 1 1 auto; min-width: 0; display: block; }
.sk-cash-datefield > span {
  display: block; font-size: .7rem; font-weight: 500; color: var(--sk-muted); margin-bottom: .25rem;
}
.sk-cash-date { margin-bottom: 0 !important; }
.sk-cash-today {
  flex: 0 0 auto; border: 1px solid var(--sk-line); border-radius: 10px;
  background: #fff; color: var(--sk-navy); font-weight: 500; font-size: .78rem;
  padding: .55rem .7rem; cursor: pointer; height: 42px; font-family: inherit;
}
.sk-cash-today:disabled { opacity: .45; cursor: default; }
.sk-cash-entries-btn {
  flex: 1 1 auto; border: 1px solid #bfdbfe; background: #eff6ff; color: #1d4ed8;
  border-radius: 10px; padding: .55rem .7rem; font-weight: 500; font-size: .78rem;
  cursor: pointer; font-family: inherit; height: 42px;
}
.sk-cash-daylabel { margin: 0 0 .55rem !important; }
.sk-cash-closed {
  margin-top: .55rem; text-align: center; font-weight: 500; color: #15803d;
  background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 10px; padding: .55rem;
}
.sk-cash-chips {
  display: flex; flex-wrap: wrap; gap: .4rem; margin: .15rem 0 .7rem;
}
.sk-cash-chip {
  border: 1px solid var(--sk-line); background: #fff; color: var(--sk-navy);
  border-radius: 999px; padding: .35rem .7rem; font-size: .72rem; font-weight: 500;
  cursor: pointer; font-family: inherit;
}
.sk-cash-chip.is-on {
  background: var(--sk-navy); color: #fff; border-color: var(--sk-navy);
}
.sk-cash-card { padding: .35rem .85rem; }
.sk-cash-qa {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .4rem;
  margin: 0 0 .65rem;
}
.sk-cash-qa__btn {
  border: 1px solid var(--sk-line); background: #fff; border-radius: 10px;
  padding: .45rem .2rem; font-size: .72rem; font-weight: 500; cursor: pointer;
  color: var(--sk-navy); font-family: inherit;
}
.sk-cash-qa__btn--in { color: #15803d; border-color: #bbf7d0; background: #f0fdf4; }
.sk-cash-qa__btn--out { color: #b91c1c; border-color: #fecaca; background: #fef2f2; }
.sk-cash-qa__btn--exp { color: #c2410c; border-color: #fed7aa; background: #fff7ed; }
.sk-cash-list-title {
  margin: .85rem 0 .45rem; font-weight: 500; font-size: .82rem; color: var(--sk-navy);
}
.sk-cash-list { display: flex; flex-direction: column; gap: .4rem; padding-bottom: .5rem; }
.sk-cash-move {
  display: flex; align-items: center; justify-content: space-between; gap: .55rem;
  background: #fff; border: 1px solid var(--sk-line); border-radius: 12px;
  padding: .55rem .7rem; box-shadow: 0 2px 8px rgba(11,31,58,.04);
}
.sk-cash-move__main { min-width: 0; }
.sk-cash-move__main strong { display: block; font-size: .88rem; color: var(--sk-navy); }
.sk-cash-move__amt { flex: 0 0 auto; font-size: .9rem; }
.sk-cash-move--in .sk-cash-move__amt { color: #15803d; }
.sk-cash-move--out .sk-cash-move__amt { color: #b91c1c; }
.sk-cash-move--exp .sk-cash-move__amt { color: #c2410c; }
.sk-cash-move--pay .sk-cash-move__amt { color: #7c3aed; }
.sk-ce-table-wrap {
  overflow-x: auto; background: #fff; border: 1px solid var(--sk-line);
  border-radius: 12px; box-shadow: 0 2px 8px rgba(11,31,58,.04);
}
.sk-ce-table { width: 100%; border-collapse: collapse; font-size: .72rem; min-width: 420px; }
.sk-ce-table th, .sk-ce-table td {
  padding: .5rem .4rem; border-bottom: 1px solid var(--sk-line);
  text-align: left; vertical-align: top; color: var(--sk-navy);
}
.sk-ce-table th {
  font-size: .68rem; font-weight: 500; color: var(--sk-muted); background: #f8fafc;
  position: sticky; top: 0; white-space: nowrap;
}
.sk-ce-no { width: 2rem; font-weight: 500; color: var(--sk-muted); }
.sk-ce-type { font-weight: 500; white-space: nowrap; }
.sk-ce-details {
  max-width: 9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: #64748b; font-weight: 500;
}
.sk-ce-date { white-space: nowrap; font-weight: 500; }
.sk-ce-amt { white-space: nowrap; font-weight: 500; text-align: right; }
.sk-ce-row--in .sk-ce-amt { color: #15803d; }
.sk-ce-row--out .sk-ce-amt { color: #b91c1c; }
.sk-ce-row--exp .sk-ce-amt { color: #c2410c; }
.sk-ce-row--pay .sk-ce-amt { color: #7c3aed; }
.sk-tabbar {
  position: fixed;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 100%;
  max-width: 430px;
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--sk-line);
  background: #fff;
  min-height: 64px;
  padding: .35rem 0 calc(.4rem + env(safe-area-inset-bottom, 0px));
  z-index: 60;
  box-shadow: 0 -4px 16px rgba(11, 31, 58, .12);
  /* Keep above Android system gesture / nav area */
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
}
.sk-tabbar--3 {
  grid-template-columns: repeat(3, 1fr);
}
.sk-tabbar-ink {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(.4rem + env(safe-area-inset-bottom, 0px) + 2px);
  height: 3px;
  pointer-events: none;
  z-index: 1;
}
.sk-tabbar-ink__bar {
  display: block;
  width: 33.333%;
  height: 100%;
  transform: translateX(0);
  transition: transform .3s cubic-bezier(.4, 0, .2, 1);
  will-change: transform;
}
.sk-tabbar-ink__bar::after {
  content: '';
  display: block;
  height: 100%;
  margin: 0 26%;
  border-radius: 999px;
  background: var(--sk-orange);
}
.sk-tabbar.no-ink-anim .sk-tabbar-ink__bar {
  transition: none;
}
.sk-tabbar button {
  border: 0; background: transparent !important; padding: .35rem .15rem .55rem;
  font-size: .72rem; font-weight: 500; color: var(--sk-muted); cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .28rem; line-height: 1.15; position: relative;
  min-height: 52px;
  z-index: 2;
  transition: color .2s ease;
}
.sk-tabbar button.active { color: var(--sk-navy); }
.sk-tabbar .ico { display: block; width: 1.7rem; height: 1.7rem; margin: 0; object-fit: contain; }
.sk-tabbar .fa-fallback { font-size: 1.45rem; color: var(--sk-navy); line-height: 1; font-style: normal; }
.sk-tabbar button.active .fa-fallback { color: var(--sk-orange); }
.sk-screen--auth {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  display: block !important;
  padding-bottom: 0;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
  /* Keep focused inputs clear of keyboard edge */
  scroll-padding-top: .75rem;
  scroll-padding-bottom: calc(1rem + var(--sk-kb-pad, 0px));
}
.sk-login {
  flex: none;
  min-height: 100%;
  height: auto;
  /* --sk-kb-pad = keyboard height so form can scroll fully above keyboard */
  padding: .45rem .8rem calc(1.25rem + env(safe-area-inset-bottom, 0px) + var(--sk-kb-pad, 0px));
  background: var(--sk-bg);
  position: relative;
  display: block;
  overflow: visible;
}
.sk-login--top {
  padding-top: calc(.4rem + env(safe-area-inset-top, 0px));
}
/* Full-page auth form (logo inside card, same top position) */
.sk-login--page {
  min-height: 100%;
  min-height: 100dvh;
  padding: 0 0 calc(var(--sk-kb-pad, 0px));
  display: flex;
  flex-direction: column;
}
.sk-login--page.sk-login--top {
  padding-top: 0;
}
.sk-login--page .sk-login__inner {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0;
  flex: 1 1 auto;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
.sk-login--page .sk-auth-flip,
.sk-login--page .sk-auth-flip__inner,
.sk-login--page .sk-auth-face {
  flex: 1 1 auto;
  width: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
.sk-login--page .sk-auth-card--page {
  flex: 1 1 auto;
  width: 100%;
  max-width: none;
  min-height: 100%;
  min-height: 100dvh;
  margin: 0;
  border-radius: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  padding:
    calc(.55rem + env(safe-area-inset-top, 0px))
    1.15rem
    calc(1.1rem + env(safe-area-inset-bottom, 0px))
    1.15rem !important;
}
.sk-login--page .sk-auth-card--page .sk-brand--auth {
  margin: 0 auto .45rem;
  width: 100%;
  max-width: 420px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.sk-login--page .sk-auth-card--page .sk-brand--auth img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: min(88%, 300px);
  max-width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center center;
}
.sk-login--page .sk-auth-card--page .sk-auth-title {
  margin-top: .1rem;
}
.sk-login--page .sk-auth-card--page > * {
  max-width: 420px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
/* Fixed layer so keyboard open does not shift/crop background */
.sk-login-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  background-color: #e8ecf4;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  transform: translateZ(0);
}
.sk-login.has-bg::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  background: rgba(11, 31, 58, .02);
  pointer-events: none;
}
.sk-login__inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 380px;
  margin: 0 auto;
  display: block;
  padding-bottom: .35rem;
}
.sk-auth-actions {
  margin-top: .35rem;
}
.sk-login.has-bg .sk-label { color: #0b1f3a; font-weight: 500; }
.sk-auth-title {
  font-size: 1.05rem; font-weight: 500; color: var(--sk-navy);
  margin: 0 0 .55rem; text-align: center;
}
.sk-auth-card {
  padding: .85rem .85rem .8rem !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.55) !important;
  box-shadow: 0 6px 20px rgba(11,31,58,.08);
  background: var(--sk-auth-card-bg, rgba(255,255,255,.72));
}
.sk-card.sk-auth-card.glass {
  background: var(--sk-auth-card-bg, rgba(255,255,255,.35)) !important;
  backdrop-filter: blur(12px) saturate(1.15);
  -webkit-backdrop-filter: blur(12px) saturate(1.15);
  border-color: rgba(255,255,255,.5) !important;
  box-shadow: 0 8px 28px rgba(11,31,58,.1);
}
.sk-auth-card .sk-label { margin-top: .1rem; font-size: .7rem; }
.sk-auth-card .sk-btn { margin-top: .25rem; padding: .65rem .75rem; font-size: .88rem; }
.sk-auth-actions .sk-btn { margin-top: .35rem; }
.sk-auth-actions .sk-btn:first-child { margin-top: 0; }
#sk-login-btn.sk-btn {
  background: #0b2a5b !important;
  color: #fff !important;
  border: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  width: 100%;
}
#sk-login-btn.sk-btn .ico {
  width: 1.05rem;
  height: 1.05rem;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
#sk-login-btn.sk-btn .fa-fallback {
  color: #fff !important;
  filter: none;
}
.sk-auth-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: .5rem; margin: .15rem 0 .45rem;
}
.sk-check {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .75rem; font-weight: 500; color: #0b1f3a; cursor: pointer;
  user-select: none;
}
.sk-check input {
  width: 1rem; height: 1rem; accent-color: var(--sk-navy); margin: 0;
}
.sk-link {
  border: 0; background: none; padding: 0; margin: 0;
  color: #0b3d91; font-size: .75rem; font-weight: 500;
  text-decoration: underline; cursor: pointer; white-space: nowrap;
}
.sk-auth-help {
  margin: 0 0 .55rem; font-size: .76rem; color: #334155; line-height: 1.35; text-align: center;
}
.sk-otp-banner {
  background: #ecfdf5; border: 1px dashed #34d399; color: #065f46;
  border-radius: 10px; padding: .55rem .65rem; font-size: .8rem;
  text-align: center; margin-bottom: .55rem;
}
.sk-auth-card .sk-btn.ghost {
  margin-top: .35rem;
  background: rgba(255,255,255,.28) !important;
  border-color: rgba(255,255,255,.5) !important;
}
.sk-btn--soft { font-size: .78rem !important; padding: .45rem .65rem !important; }
.sk-field {
  display: flex; align-items: center; gap: .45rem;
  background: #fff;
  border: 1px solid rgba(11,31,58,.16);
  border-radius: 12px;
  padding: 0 .65rem; margin-bottom: .45rem; min-height: 44px;
  box-shadow: none !important;
  outline: none !important;
  -webkit-tap-highlight-color: transparent;
  position: relative;
  z-index: 1;
  overflow: hidden;
  isolation: isolate;
  transform: translateZ(0);
}
.sk-field:focus,
.sk-field:focus-within {
  border-color: rgba(11,31,58,.28) !important;
  box-shadow: none !important;
  outline: none !important;
  background: #fff;
}
.sk-field__ico {
  flex: 0 0 auto; width: 1.2rem; height: 1.2rem;
  display: grid; place-items: center;
  color: var(--sk-navy); opacity: .85;
}
.sk-field__ico svg { width: 1.15rem; height: 1.15rem; display: block; }
.sk-field__ico .ico { width: 1.15rem; height: 1.15rem; object-fit: contain; display: block; }
.sk-eye {
  flex: 0 0 auto;
  width: 1.7rem; height: 1.7rem;
  border: 0; padding: 0; margin: 0;
  background: transparent; color: #334155;
  display: grid; place-items: center;
  cursor: pointer; border-radius: 8px;
  -webkit-tap-highlight-color: transparent;
}
.sk-eye:hover { color: var(--sk-navy); background: rgba(11,31,58,.06); }
.sk-eye svg { width: 1.15rem; height: 1.15rem; display: block; }
.sk-eye .sk-eye__off { display: none; }
.sk-eye.is-on .sk-eye__on { display: none; }
.sk-eye.is-on .sk-eye__off { display: block; }
.sk-auth-card .sk-btn .ico,
.sk-auth-card .sk-btn .fa-fallback {
  width: 1.05rem; height: 1.05rem; object-fit: contain;
  display: inline-block; vertical-align: -0.2em; margin-right: .25rem;
}
.sk-auth-card .sk-btn .fa-fallback:empty { display: none; margin: 0; }
.sk-field .sk-input {
  margin: 0 !important; border: 0 !important; outline: 0 !important;
  outline-offset: 0 !important;
  background: transparent !important;
  padding: .6rem 0 !important; box-shadow: none !important; flex: 1 1 auto;
  /* 16px+ prevents iOS Safari auto-zoom on focus */
  font-size: 16px; font-weight: 500; color: #0b1f3a;
  -webkit-appearance: none; appearance: none;
  -webkit-tap-highlight-color: transparent;
  caret-color: var(--sk-navy);
}
/* Glass login: fields clear — only light border (must follow .sk-field) */
.sk-login--glass .sk-field,
.sk-login--glass .sk-field:focus,
.sk-login--glass .sk-field:focus-within {
  background: transparent !important;
  border: 1px solid rgba(11,31,58,.2) !important;
  box-shadow: none !important;
}
.sk-login--glass .sk-field:focus,
.sk-login--glass .sk-field:focus-within {
  border-color: rgba(11,31,58,.32) !important;
  background: rgba(255,255,255,.08) !important;
}
.sk-login--glass .sk-field .sk-input,
.sk-login--glass .sk-field .sk-input:focus,
.sk-login--glass .sk-field .sk-input:focus-visible {
  background: transparent !important;
  color: #0b1f3a !important;
}
.sk-login--glass .sk-field .sk-input::placeholder {
  color: rgba(11,31,58,.42);
}
.sk-login--glass .sk-auth-card .sk-btn.ghost {
  background: rgba(255,255,255,.12) !important;
  border: 1px solid rgba(11,31,58,.18) !important;
}
.sk-login--glass .sk-eye:hover {
  background: rgba(11,31,58,.08);
}

.sk-field .sk-input:focus,
.sk-field .sk-input:focus-visible,
.sk-login input:focus,
.sk-login input:focus-visible {
  outline: 0 !important;
  outline-width: 0 !important;
  outline-offset: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  background: transparent !important;
}
.sk-login * { -webkit-tap-highlight-color: transparent; }
.sk-login input { outline: 0 !important; border-style: none !important; }
/*
 * Login ↔ Create account panel switch.
 * Avoid 3D rotateY/preserve-3d: iOS Safari paints black autofill ghosts over inputs.
 */
.sk-auth-flip {
  width: 100%;
  perspective: none;
}
.sk-auth-flip__inner {
  position: relative;
  width: 100%;
  min-height: 0;
  transform: none !important;
  transform-style: flat;
  transition: none;
}
.sk-auth-flip.is-back .sk-auth-flip__inner {
  min-height: 0;
  transform: none !important;
}
.sk-auth-face {
  position: relative;
  left: auto; right: auto; top: auto;
  width: 100%;
  backface-visibility: visible;
  -webkit-backface-visibility: visible;
  transform: none !important;
}
.sk-auth-face--front,
.sk-auth-face--back {
  display: block;
}
.sk-auth-flip:not(.is-back) .sk-auth-face--back {
  display: none !important;
}
.sk-auth-flip.is-back .sk-auth-face--front {
  display: none !important;
}
.sk-auth-card--reg .sk-field { min-height: 44px; margin-bottom: .4rem; }
.sk-auth-card--reg .sk-label { margin-bottom: .15rem; }
/* Create account: extra scroll room under form when keyboard is open */
html.sk-auth-kb--reg .sk-login {
  padding-bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px) + var(--sk-kb-pad, 0px));
}
html.sk-auth-kb--reg .sk-login__inner {
  padding-bottom: calc(2.5rem + var(--sk-kb-pad, 0px) * 0.15);
}
html.sk-auth-kb--reg .sk-screen--auth {
  scroll-padding-bottom: calc(1.5rem + var(--sk-kb-pad, 0px));
  scroll-padding-top: 1rem;
}
.sk-opt { font-weight: 500; color: var(--sk-muted); font-size: .68rem; }
.sk-label-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: .4rem; margin: .1rem 0 .15rem;
}
.sk-label-row .sk-label { margin: 0; }
.sk-info-btn {
  width: 1.35rem; height: 1.35rem; border-radius: 999px;
  border: 1.5px solid rgba(11,31,58,.4); background: rgba(255,255,255,.55);
  color: #0b1f3a; font-size: .72rem; font-weight: 500; font-style: italic;
  line-height: 1; cursor: pointer; flex: 0 0 auto;
  display: grid; place-items: center; padding: 0;
}
.sk-pass-dialog {
  position: fixed; inset: 0; z-index: 40;
  background: rgba(11,31,58,.45);
  display: grid; place-items: center; padding: 1rem;
}
.sk-pass-dialog[hidden] { display: none !important; }
.sk-pass-dialog__card {
  width: min(340px, 100%);
  background: #fff; border-radius: 16px;
  padding: 1.1rem 1rem 1rem;
  box-shadow: 0 16px 40px rgba(11,31,58,.22);
}
.sk-pass-dialog__title {
  font-size: 1rem; font-weight: 500; color: var(--sk-navy); margin-bottom: .45rem;
}
.sk-pass-dialog__text {
  margin: 0 0 .55rem; font-size: .82rem; color: #334155; line-height: 1.4;
}
.sk-pass-dialog__example {
  font-family: ui-monospace, Consolas, monospace;
  font-size: 1.15rem; font-weight: 500; letter-spacing: .04em;
  color: #0b1f3a; background: #f1f5f9; border: 1px dashed #94a3b8;
  border-radius: 10px; padding: .65rem .75rem; text-align: center; margin-bottom: .55rem;
}
.sk-pass-dialog__hint {
  margin: 0 0 .75rem; font-size: .75rem; color: var(--sk-muted); line-height: 1.35;
}
@media (max-height: 700px) {
  .sk-brand--auth { min-height: 7.25rem; margin-bottom: .3rem; }
  .sk-brand--auth img { width: min(88%, 280px); max-height: 7rem; border-radius: 18px; }
  .sk-brand--auth-reg { min-height: 4.5rem; }
  .sk-brand--auth-reg img { width: min(52%, 140px); max-height: 4.25rem; border-radius: 14px; }
  .sk-auth-card { padding: .7rem .7rem .65rem !important; }
  .sk-login--page .sk-auth-card--page {
    padding:
      calc(.4rem + env(safe-area-inset-top, 0px))
      .95rem
      calc(.85rem + env(safe-area-inset-bottom, 0px))
      .95rem !important;
  }
  .sk-field { min-height: 42px; margin-bottom: .35rem; }
  .sk-login--top:not(.sk-login--page) { padding: .4rem .7rem .4rem; }
}
.sk-login-bg,
.sk-login.has-bg::after {
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  min-height: 100%;
  min-height: -webkit-fill-available;
}
.sk-err { color: #b91c1c; font-size: .8rem; margin: .4rem 0; }
.sk-field-hint {
  font-size: .7rem; color: var(--sk-muted); font-weight: 500;
  margin: -.25rem 0 .45rem .05rem;
}
.sk-toast {
  position: absolute; left: .75rem; right: .75rem; top: .75rem; z-index: 90;
  pointer-events: none;
}
.sk-toast__card {
  display: flex; align-items: flex-start; gap: .55rem;
  background: #ecfdf5; border: 1px solid #86efac; color: #065f46;
  border-radius: 12px; padding: .7rem .85rem;
  box-shadow: 0 10px 28px rgba(11,31,58,.14);
}
.sk-toast__text { flex: 1 1 auto; font-size: .84rem; font-weight: 500; line-height: 1.35; }
.sk-field-msg {
  font-size: .72rem; font-weight: 500; line-height: 1.3;
  margin: -.15rem 0 .4rem .1rem;
}
.sk-field-msg--err { color: #b91c1c; }
.sk-field.is-invalid {
  border-color: #ef4444 !important;
  background: rgba(254, 226, 226, .35);
}
.sk-fab {
  position: absolute; right: 14px; bottom: 58px; z-index: 4;
  background: var(--sk-orange); color: #fff; border: 0; border-radius: 999px;
  padding: .55rem .85rem; font-size: .72rem; font-weight: 500; cursor: pointer;
  box-shadow: 0 6px 16px rgba(249,115,22,.35);
}
.sk-empty { text-align: center; padding: 2rem .5rem; color: var(--sk-muted); font-size: .85rem; }
/* APK install popup */
.sk-apk-overlay {
  position: absolute; inset: 0; z-index: 80;
  background: rgba(11, 31, 58, .55);
  display: flex; align-items: center; justify-content: center;
  padding: 1rem; backdrop-filter: blur(2px);
}
.sk-apk-modal {
  width: 100%; max-width: 320px; background: #fff; border-radius: 18px;
  padding: 1.2rem 1.1rem 1rem; text-align: center;
  box-shadow: 0 20px 48px rgba(11,31,58,.28); border: 1px solid var(--sk-line);
}
.sk-apk-logo {
  width: 64px; height: 64px; object-fit: contain; border-radius: 14px;
  margin: 0 auto .55rem; display: block; background: #fff;
  box-shadow: 0 4px 12px rgba(11,31,58,.1);
}
.sk-apk-modal h2 {
  margin: 0; font-size: 1.05rem; font-weight: 500; color: var(--sk-navy);
}
.sk-apk-modal p {
  margin: .4rem 0 0; font-size: .78rem; color: var(--sk-muted); font-weight: 500; line-height: 1.4;
}
.sk-apk-meta {
  margin: .55rem 0 .85rem; font-size: .7rem; font-weight: 500; color: #94a3b8;
}
.sk-apk-dl {
  display: block; width: 100%; text-decoration: none; border: 0; border-radius: 12px;
  padding: .8rem .7rem; background: var(--sk-orange); color: #fff;
  font-weight: 500; font-size: .9rem; margin-bottom: .45rem;
  box-shadow: 0 8px 18px rgba(249,115,22,.3);
}
.sk-apk-later {
  display: block; width: 100%; border: 0; border-radius: 0;
  padding: .45rem .4rem; background: transparent; color: var(--sk-muted);
  font-weight: 500; font-size: .8rem; cursor: pointer;
  text-decoration: underline; text-underline-offset: 2px;
}
.sk-searchbar {
  display: flex; align-items: center; gap: .55rem;
  margin-bottom: .75rem; flex: 0 0 auto;
}
.sk-searchbar__field {
  flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: .4rem;
  background: #fff; border: 1px solid var(--sk-line); border-radius: 12px;
  padding: .55rem .7rem; box-shadow: 0 2px 8px rgba(11,31,58,.04);
}
.sk-searchbar__ico { color: var(--sk-muted); font-size: 1rem; line-height: 1; flex: 0 0 auto; }
.sk-searchbar__input {
  flex: 1 1 auto; min-width: 0; border: 0; outline: 0; background: transparent;
  font-size: .88rem; font-weight: 500; color: var(--sk-navy); font-family: inherit;
}
.sk-searchbar__input::placeholder { color: #94a3b8; font-weight: 500; }
.sk-searchbar__add {
  flex: 0 0 auto; width: 44px; height: 44px; border-radius: 12px;
  border: 1px solid var(--sk-line); background: #fff; color: var(--sk-navy); cursor: pointer;
  display: grid; place-items: center; box-shadow: 0 2px 8px rgba(11,31,58,.04);
  padding: 0; overflow: hidden;
}
.sk-searchbar__add:active { transform: scale(.96); }
.sk-searchbar__add .ico {
  width: 1.45rem; height: 1.45rem; object-fit: contain; display: block;
  filter: none;
}
.sk-searchbar__add .fa-fallback { font-size: 1.4rem; color: var(--sk-navy); font-weight: 500; line-height: 1; }
.sk-exit-actions {
  display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; margin-top: .35rem;
}
.sk-btn--danger {
  background: #dc2626 !important; border-color: #dc2626 !important; color: #fff !important;
}
.sk-party-list { display: flex; flex-direction: column; gap: .45rem; }
.sk-party-row {
  display: flex; align-items: center; justify-content: space-between; gap: .65rem;
  margin-bottom: 0; width: 100%; text-align: left; cursor: pointer;
  font-family: inherit; appearance: none; -webkit-appearance: none;
}
button.sk-party-row { border: 1px solid var(--sk-line); background: #fff; border-radius: 12px; padding: .7rem .8rem; box-shadow: 0 2px 8px rgba(11,31,58,.04); }
button.sk-party-row:active { transform: scale(.99); }
.sk-party-row__main { min-width: 0; }
.sk-party-row__main strong {
  display: block; font-size: .9rem; color: var(--sk-navy); font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sk-party-row__bal {
  flex: 0 0 auto; white-space: nowrap; font-size: .88rem;
  font-weight: 500; color: var(--sk-navy);
}
/* Professional ledger */
.sk-pad--ledger { padding-bottom: 1.25rem; }
.sk-lg-filter {
  background: #fff; border: 1px solid var(--sk-line); border-radius: 14px;
  padding: .75rem; box-shadow: 0 4px 12px rgba(11,31,58,.05); margin-bottom: .75rem;
}
.sk-lg-dates { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }
.sk-lg-field { display: block; margin-bottom: .55rem; }
.sk-lg-field > span {
  display: block; font-size: .7rem; font-weight: 500; color: var(--sk-muted); margin-bottom: .25rem;
}
.sk-lg-input { margin-bottom: 0 !important; }
.sk-lg-filter .sk-btn { margin-top: .15rem; }
.sk-lg-hint {
  text-align: center; color: var(--sk-muted); font-size: .8rem; font-weight: 500;
  padding: 1.5rem .5rem;
}
.sk-lg-report {
  background: #fff; border: 1px solid var(--sk-line); border-radius: 14px;
  padding: .75rem; box-shadow: 0 4px 14px rgba(11,31,58,.06);
}
.sk-lg-head { margin-bottom: .75rem; }
.sk-lg-biz { font-size: .95rem; font-weight: 500; color: var(--sk-navy); }
.sk-lg-title { font-size: 1.15rem; font-weight: 500; color: var(--sk-navy); margin: .15rem 0 .35rem; }
.sk-lg-meta { font-size: .72rem; color: var(--sk-muted); font-weight: 500; line-height: 1.45; }
.sk-lg-meta strong { color: var(--sk-navy); }
.sk-lg-actions {
  display: grid; grid-template-columns: 1fr 1fr; gap: .5rem;
}
.sk-lg-btn {
  border: 0; border-radius: 10px; padding: .7rem .6rem; font-size: .8rem;
  font-weight: 500; cursor: pointer; color: #fff; white-space: nowrap; width: 100%;
}
.sk-lg-btn--pdf { background: #dc2626; }
.sk-lg-btn--print { background: #16a34a; }
.sk-install { margin: .75rem 0 0; font-size: .72rem; color: var(--sk-muted); text-align: center; }
.ico { width: 1.05rem; height: 1.05rem; object-fit: contain; vertical-align: -.15em; display: inline-block; }
.fa-fallback { font-style: normal; }
.sk-icon-act {
  width: 36px; height: 36px; border-radius: 10px; border: 1px solid var(--sk-line);
  background: #fff; cursor: pointer; display: grid; place-items: center;
  font-size: 1rem; line-height: 1; padding: 0;
}
.sk-icon-act--edit { color: #1d4ed8; border-color: #bfdbfe; background: #eff6ff; }
.sk-icon-act--del { color: #dc2626; border-color: #fecaca; background: #fef2f2; }
/* Party detail — khata style */
.sk-screen:has(> .sk-pd),
.sk-screen:has(> .sk-pp),
.sk-screen:has(> .sk-am) { overflow: hidden; padding-bottom: 0; background: #fff; }
.sk-pd, .sk-pp, .sk-am {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  height: 100%;
  background: #fff;
  overflow: hidden;
}
.sk-pd-top, .sk-pp-top, .sk-am-top {
  display: flex;
  align-items: center;
  gap: .2rem;
  padding: .55rem .55rem .35rem;
  flex: 0 0 auto;
  background: #fff;
}
.sk-pd-iconbtn {
  width: 2.35rem;
  height: 2.35rem;
  border: 0;
  background: transparent;
  color: #0f172a;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  border-radius: 999px;
  flex: 0 0 auto;
}
.sk-pd-iconbtn svg,
.sk-pd-iconbtn .ico { width: 1.35rem; height: 1.35rem; display: block; object-fit: contain; }
.sk-pd-iconbtn.is-fav { color: #e11d48; }
.sk-pd-iconbtn.is-fav .ico { filter: none; }
.sk-pd-top__txt {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.sk-pd-top__txt strong {
  font-size: 1.15rem;
  font-weight: 500;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-pd-top__txt small {
  font-size: .72rem;
  font-weight: 500;
  color: #94a3b8;
}
.sk-pad--party-detail {
  padding: .35rem .85rem .55rem;
  background: #fff;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  min-height: 0;
  flex: 1 1 auto;
}
.sk-pd-sumrow {
  display: flex;
  align-items: stretch;
  gap: .55rem;
  margin-bottom: .7rem;
}
.sk-pd-balwrap {
  flex: 0 1 48%;
  max-width: 11.5rem;
  min-width: 8.5rem;
  display: block;
  margin: 0;
  gap: 0;
}
.sk-pd-balcard {
  width: 100%;
  min-height: 92px;
  margin: 0;
}
.sk-home-cards--classic .sk-home-card--clear,
.sk-home-cards--soft .sk-home-card--clear,
.sk-home-cards--vivid .sk-home-card--clear,
.sk-home-cards--ocean .sk-home-card--clear,
.sk-home-cards--sunset .sk-home-card--clear,
.sk-home-cards--midnight .sk-home-card--clear {
  background: linear-gradient(160deg, #f1f5f9 0%, #e2e8f0 100%);
  color: #475569;
}
.sk-home-cards--classic .sk-home-card--clear .sk-home-card__ico,
.sk-home-cards--soft .sk-home-card--clear .sk-home-card__ico,
.sk-home-cards--vivid .sk-home-card--clear .sk-home-card__ico,
.sk-home-cards--ocean .sk-home-card--clear .sk-home-card__ico,
.sk-home-cards--sunset .sk-home-card--clear .sk-home-card__ico,
.sk-home-cards--midnight .sk-home-card--clear .sk-home-card__ico {
  background: #94a3b8;
  color: #fff;
}
.sk-home-cards--vivid .sk-home-card--clear strong,
.sk-home-cards--midnight .sk-home-card--clear strong {
  color: #334155;
  text-shadow: none;
}
.sk-home-cards--vivid .sk-home-card--clear small,
.sk-home-cards--midnight .sk-home-card--clear small {
  color: #64748b;
}
.sk-pd-actions3 {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .2rem;
  align-content: center;
  margin: 0;
  padding: .15rem 0;
}
button.sk-pd-act {
  border: 0;
  background: transparent;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .28rem;
  font: inherit;
  font-size: .7rem;
  font-weight: 500;
  color: #334155;
  cursor: pointer;
  padding: .2rem .1rem;
  -webkit-tap-highlight-color: transparent;
}
.sk-pd-act__ico {
  width: 2.25rem;
  height: 2.25rem;
  display: grid;
  place-items: center;
  font-size: 1.2rem;
}
.sk-pd-act__ico .ico {
  width: 1.55rem;
  height: 1.55rem;
  object-fit: contain;
  display: block;
}
.sk-pd-act__ico--sms { color: #2563eb; font-size: 1.4rem; }
.sk-pd-act__ico--wa { color: #22c55e; }
.sk-pd-act__ico--wa svg { width: 1.5rem; height: 1.5rem; }
.sk-pd-datebar {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: .45rem;
  align-items: end;
  margin-bottom: .55rem;
}
.sk-pd-datefield {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  min-width: 0;
  margin: 0;
}
.sk-pd-datefield span {
  font-size: .68rem;
  font-weight: 500;
  color: #94a3b8;
}
.sk-pd-datebar input {
  width: 100%;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: .5rem .55rem;
  font: inherit;
  font-size: .82rem;
  font-weight: 500;
  min-width: 0;
  background: #fff;
}
.sk-pd-datebar__clear {
  border: 1px solid #e2e8f0;
  background: #fff;
  border-radius: 12px;
  padding: .55rem .65rem;
  font: inherit;
  font-weight: 500;
  color: #64748b;
  cursor: pointer;
  height: 2.45rem;
}
.sk-pd-tools {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin-bottom: .55rem;
}
.sk-pd-tools .sk-home-ico-btn {
  width: 44px;
  height: 44px;
}
.sk-pd-tools .sk-home-ico-btn svg,
.sk-pd-tools .sk-home-ico-btn .ico {
  width: 1.55rem;
  height: 1.55rem;
}
.sk-pd-tools .sk-pd-live {
  height: 44px;
}
.sk-pd-tools .sk-pd-live__cal .ico {
  width: 1.35rem;
  height: 1.35rem;
}
.sk-pd-search { margin-bottom: .55rem; }
.sk-pd-live {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  height: 42px;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  border-radius: 999px;
  overflow: hidden;
  isolation: isolate;
}
.sk-pd-live__ring {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: conic-gradient(from var(--sk-live-a, 0deg), #fb923c, #f97316, transparent 40%, transparent 70%, #fdba74, #fb923c);
  animation: skLiveSpin 2.2s linear infinite;
  z-index: 0;
}
.sk-pd-live__inner {
  position: absolute;
  inset: 2px;
  border-radius: inherit;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  z-index: 1;
  font-size: .82rem;
  font-weight: 500;
  color: #0f172a;
  border: 1px solid #dbeafe;
}
.sk-pd-live__new {
  background: #2563eb;
  color: #fff;
  font-size: .58rem;
  font-weight: 500;
  padding: .12rem .35rem;
  border-radius: 6px;
  letter-spacing: .04em;
}
.sk-pd-live__chev { color: #94a3b8; font-size: .75rem; }
.sk-pd-live__cal {
  display: inline-grid;
  place-items: center;
  line-height: 1;
  font-size: 1.05rem;
}
.sk-pd-live__cal .ico {
  width: 1.15rem;
  height: 1.15rem;
  object-fit: contain;
  display: block;
}
@property --sk-live-a {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}
@keyframes skLiveSpin {
  to { --sk-live-a: 360deg; }
}
@media (prefers-reduced-motion: reduce) {
  .sk-pd-live__ring { animation: none; }
}
.sk-pd-cols {
  display: grid;
  grid-template-columns: 1.35fr .95fr .95fr;
  gap: .25rem;
  padding: .35rem .15rem .45rem 2.7rem;
  font-size: .68rem;
  font-weight: 500;
  color: #94a3b8;
  letter-spacing: .02em;
  text-transform: none;
}
.sk-pd-cols__r { text-align: right; }
.sk-pd-list { display: flex; flex-direction: column; }
.sk-pd-row {
  border-bottom: 1px solid #eef2f7;
  background: #fff;
}
button.sk-pd-row__hit {
  display: grid;
  grid-template-columns: auto 1.35fr .95fr .95fr;
  gap: .35rem;
  align-items: center;
  width: 100%;
  border: 0;
  background: transparent;
  padding: .75rem .1rem;
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.sk-pd-row:has(.sk-pd-row__media) button.sk-pd-row__hit {
  padding-bottom: .3rem;
}
button.sk-pd-row__hit:active { background: #f8fafc; }
.sk-pd-row__media {
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: 0 .1rem .65rem 2.7rem;
}
.sk-pd-row__ico {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-weight: 500;
  flex: 0 0 auto;
  line-height: 1;
}
.sk-pd-row__arrow {
  font-size: 1.35rem;
  font-weight: 500;
  line-height: 1;
  display: block;
  transform: scale(1.15);
}
.sk-pd-row__ico.is-gave { background: var(--sk-recv-soft); color: var(--sk-recv-ink); }
.sk-pd-row__ico.is-took { background: var(--sk-pay-soft); color: var(--sk-pay-ink); }
.sk-pd-row__mid {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .25rem;
}
.sk-pd-row__mid strong {
  font-size: .88rem;
  font-weight: 500;
  color: #0f172a;
}
.sk-pd-row__bal {
  display: inline-block;
  align-self: flex-start;
  background: var(--sk-recv-pill);
  color: var(--sk-recv-pill-ink);
  font-size: .68rem;
  font-weight: 500;
  padding: .15rem .4rem;
  border-radius: 999px;
}
.sk-pd-row__bal.is-pay {
  background: var(--sk-pay-pill);
  color: var(--sk-pay-pill-ink);
}
.sk-pd-row__bal.is-zero {
  background: #f1f5f9;
  color: #64748b;
}
.sk-pd-row__details {
  display: block;
  font-size: .72rem;
  font-weight: 400;
  color: #64748b;
  line-height: 1.35;
  word-break: break-word;
  max-width: 100%;
}
.sk-pd-media {
  border: 0;
  padding: 0;
  background: #f1f5f9;
  color: #0f766e;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
  overflow: hidden;
}
.sk-pd-media:active { opacity: .85; }
.sk-pd-media--voice { color: #0f766e; background: #ecfdf5; }
.sk-pd-media--bill {
  background: #fff;
  border: 1px solid #e2e8f0;
}
.sk-pd-media--bill img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.sk-media-popup {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: grid;
  place-items: center;
  padding: 1rem;
}
.sk-media-popup__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(15, 23, 42, .55);
  cursor: pointer;
}
.sk-media-popup__card {
  position: relative;
  z-index: 1;
  width: min(92vw, 360px);
  background: #fff;
  border-radius: 16px;
  padding: 1rem 1rem 1.1rem;
  box-shadow: 0 18px 40px rgba(15, 23, 42, .25);
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.sk-media-popup__card--bill { width: min(94vw, 420px); }
.sk-media-popup__title {
  font-size: 1rem;
  font-weight: 500;
  color: #0f172a;
}
.sk-media-popup__audio {
  width: 100%;
}
.sk-media-popup__img {
  width: 100%;
  max-height: min(70vh, 520px);
  object-fit: contain;
  border-radius: 10px;
  background: #f8fafc;
}
.sk-media-popup__actions {
  display: flex;
  gap: .5rem;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.sk-pd-row__gave, .sk-pd-row__took {
  text-align: right;
  font-size: .9rem;
  font-weight: 500;
  white-space: nowrap;
}
.sk-pd-row__gave { color: var(--sk-recv-ink); }
.sk-pd-row__took { color: var(--sk-pay-ink); }
.sk-pd-bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  padding: .5rem .85rem calc(.55rem + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-pd-big {
  border: 0;
  border-radius: 12px;
  padding: .55rem .65rem;
  min-height: 2.55rem;
  font: inherit;
  font-size: .9rem;
  font-weight: 500;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  line-height: 1.1;
}
.sk-pd-big__arrow {
  font-size: 1.35rem;
  font-weight: 500;
  line-height: 1;
  display: inline-block;
  transform: translateY(-1px) scale(1.2);
}
.sk-pd-big--gave { background: var(--sk-recv); }
.sk-pd-big--took { background: var(--sk-pay); }
.sk-pd-big:active { transform: scale(.985); }

/* Transaction detail (receipt) */
.sk-screen:has(> .sk-td) { overflow: hidden; padding-bottom: 0; background: #f4f6fb; }
.sk-td {
  display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto;
  background: #f4f6fb;
}
.sk-td-top {
  display: flex; align-items: center; gap: .45rem;
  padding: .65rem .85rem; background: #fff;
  border-bottom: 1px solid #eef2f7; flex: 0 0 auto;
}
.sk-td-title {
  flex: 1 1 auto; margin: 0; text-align: center;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.55rem; font-weight: 500; color: #0b1f3a; letter-spacing: -.02em;
}
.sk-td-del { color: #ef4444 !important; }
.sk-td-del svg { width: 1.25rem; height: 1.25rem; }
.sk-si-del { color: #ef4444 !important; }
.sk-si-del svg { width: 1.3rem; height: 1.3rem; }
.sk-pad--td {
  flex: 1 1 auto; min-height: 0; overflow-y: auto;
  display: flex; flex-direction: column; align-items: center;
  padding: 1.15rem .95rem 1rem;
}
.sk-td-amt {
  width: 100%; max-width: 22rem;
  background: #eceff3; border-radius: 14px;
  padding: 1.05rem 1rem; text-align: center;
  font-size: 1.55rem; font-weight: 500; color: #0f172a;
  letter-spacing: -.02em;
}
.sk-td-datechip {
  margin-top: .75rem; display: inline-flex; align-items: center; gap: .4rem;
  border: 0; background: #e8ebf0; color: #475569;
  border-radius: 999px; padding: .42rem .85rem;
  font: inherit; font-size: .82rem; font-weight: 500; cursor: pointer;
}
.sk-td-datechip svg { width: 1rem; height: 1rem; opacity: .85; }
.sk-td-sec-lab {
  width: 100%; max-width: 22rem; margin: 1.35rem 0 .45rem;
  font-size: .68rem; font-weight: 500; letter-spacing: .08em;
  color: #94a3b8; text-align: left;
}
.sk-td-receipt {
  width: 100%; max-width: 22rem;
  background: #fff; border-radius: 16px;
  box-shadow: 0 8px 28px rgba(15, 23, 42, .08);
  padding: .85rem .85rem 1rem; overflow: hidden;
}
.sk-td-receipt__head {
  display: flex; flex-direction: column; gap: .15rem; margin-bottom: .7rem;
}
.sk-td-receipt__head strong { font-size: .95rem; color: #0f172a; font-weight: 500; }
.sk-td-receipt__head span { font-size: .72rem; color: #94a3b8; font-weight: 500; }
.sk-td-banner {
  position: relative; border-radius: 12px 4px 4px 12px;
  padding: .95rem 1rem; min-height: 5.5rem;
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  overflow: hidden;
}
.sk-td-banner.is-got { background: linear-gradient(110deg, var(--sk-recv) 0%, var(--sk-recv-ink) 100%); }
.sk-td-banner.is-gave { background: linear-gradient(110deg, var(--sk-pay) 0%, var(--sk-pay-ink) 100%); }
.sk-td-banner__txt { color: #fff; display: flex; flex-direction: column; gap: .2rem; z-index: 1; }
.sk-td-banner__txt span { font-size: .85rem; font-weight: 500; opacity: .95; }
.sk-td-banner__txt strong { font-size: 1.45rem; font-weight: 500; letter-spacing: -.02em; }
.sk-td-art {
  position: relative; width: 5.2rem; height: 3.6rem; flex: 0 0 auto;
}
.sk-td-art__doc {
  position: absolute; border-radius: 6px; background: rgba(255,255,255,.92);
  box-shadow: 0 4px 10px rgba(0,0,0,.12);
}
.sk-td-art__doc--a { width: 2.4rem; height: 3rem; right: .9rem; top: .2rem; transform: rotate(8deg); }
.sk-td-art__doc--b { width: 2.2rem; height: 2.7rem; right: 0; top: .55rem; transform: rotate(18deg); background: rgba(255,255,255,.78); }
.sk-td-art__doc::after {
  content: ""; position: absolute; left: .35rem; right: .35rem; top: .45rem; height: .2rem;
  background: rgba(148,163,184,.55); border-radius: 2px;
  box-shadow: 0 .45rem 0 rgba(148,163,184,.4), 0 .9rem 0 rgba(148,163,184,.3);
}
.sk-td-art__wa {
  position: absolute; right: -.1rem; top: -.15rem; width: 1.55rem; height: 1.55rem;
  border-radius: 999px; background: #25d366; color: #fff;
  display: grid; place-items: center;
  box-shadow: 0 3px 8px rgba(0,0,0,.18);
}
.sk-td-art__wa svg { width: .95rem; height: .95rem; display: block; }
.sk-td-secure {
  margin-top: auto; padding-top: 1.5rem;
  font-size: .78rem; font-weight: 500; color: #16a34a; text-align: center;
}
.sk-td-foot {
  display: grid; grid-template-columns: 1fr 1fr; gap: .65rem;
  padding: .75rem .95rem calc(.85rem + env(safe-area-inset-bottom, 0px));
  background: #fff; border-top: 1px solid #eef2f7; flex: 0 0 auto;
}
.sk-td-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  min-height: 3.1rem; border-radius: 14px; font: inherit;
  font-size: .92rem; font-weight: 500; letter-spacing: .04em; cursor: pointer;
}
.sk-td-btn svg { width: 1.15rem; height: 1.15rem; display: block; }
.sk-td-btn--edit {
  background: #fff; color: #334155; border: 1.5px solid #cbd5e1;
}
.sk-td-btn--share {
  background: #0d9488; color: #fff; border: 1.5px solid #0d9488;
}
.sk-td-btn:active { transform: scale(.985); }
.sk-pd-sort-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .65rem;
  padding-bottom: .65rem;
  border-bottom: 1px solid #eef2f7;
}
.sk-pd-sort-x {
  border: 0;
  background: transparent;
  font-size: 1.5rem;
  color: #94a3b8;
  cursor: pointer;
  line-height: 1;
  width: 2rem;
  height: 2rem;
}
.sk-pp-title {
  margin: 0;
  flex: 1 1 auto;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.15rem;
  font-weight: 500;
  color: #0f172a;
  padding-right: .5rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-pad--pp {
  background: #fff;
  overflow-y: auto;
  min-height: 0;
  flex: 1 1 auto;
  padding: .5rem 1rem 1rem;
}
.sk-pp-avwrap {
  position: relative;
  width: 96px;
  height: 96px;
  margin: .5rem auto .35rem;
  overflow: visible;
}
.sk-pp-av-file {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}
button.sk-pp-av {
  width: 96px;
  height: 96px;
  border-radius: 999px;
  border: 0;
  background: #dbeafe;
  color: #64748b;
  display: grid;
  place-items: center;
  font-size: 2.4rem;
  padding: 0;
  cursor: pointer;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
}
button.sk-pp-av img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
button.sk-pp-av .sk-pp-av__ph {
  width: 52%;
  height: 52%;
  display: block;
}
.sk-pp-av-edit {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 2px solid #fff;
  background: #2563eb;
  color: #fff;
  cursor: pointer;
  display: grid;
  place-items: center;
  padding: 0;
  z-index: 3;
  box-shadow: 0 2px 8px rgba(37, 99, 235, .35);
  -webkit-tap-highlight-color: transparent;
}
.sk-pp-av-edit svg {
  width: 16px;
  height: 16px;
  display: block;
}
.sk-pp-av-hint {
  margin: 0 auto 1rem;
  text-align: center;
  font-size: .78rem;
  font-weight: 500;
  color: #64748b;
}
.sk-pp-field {
  padding: .85rem 0;
  border-bottom: 1px solid #eef2f7;
}
.sk-pp-field span {
  display: block;
  font-size: .72rem;
  font-weight: 500;
  color: #94a3b8;
  margin-bottom: .25rem;
}
.sk-pp-field strong {
  font-size: 1rem;
  font-weight: 500;
  color: #0f172a;
}
.sk-pp-field--row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sk-pp-chev { color: #94a3b8; font-size: 1rem; }
.sk-pp-switch {
  width: 100%;
  margin-top: 1.1rem;
  border: 0;
  border-radius: 14px;
  background: #eef2f7;
  color: #0f172a;
  font: inherit;
  font-size: .95rem;
  font-weight: 500;
  padding: .95rem 1rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
}
.sk-pp-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  padding: .65rem .85rem calc(.7rem + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-pp-btn {
  border-radius: 14px;
  padding: .9rem .75rem;
  font: inherit;
  font-size: .92rem;
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
}
.sk-pp-btn--del {
  background: #fff;
  border: 1.5px solid #ef4444;
  color: #ef4444;
}
.sk-pp-btn--edit {
  background: #0f172a;
  border: 0;
  color: #fff;
}
.sk-am-title {
  margin: 0;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.25rem;
  font-weight: 500;
  color: #0f172a;
}
.sk-am-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 0 .85rem;
  display: flex;
  flex-direction: column;
}
.sk-am-amount {
  margin: .35rem 0 .55rem;
  background: #f1f5f9;
  border-radius: 14px;
  padding: .85rem .95rem;
  display: flex;
  align-items: center;
  gap: .45rem;
  min-height: 52px;
  flex: 0 0 auto;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.sk-am-amount:active { background: #e8eef5; }
.sk-am-rs { font-size: 1.15rem; font-weight: 500; color: #0f172a; }
.sk-am-val { font-size: 1.15rem; font-weight: 500; color: #0f172a; }
.sk-am-val.is-ph { color: #94a3b8; font-weight: 500; }
.sk-am-meta {
  display: flex;
  flex-direction: column;
  gap: .55rem;
  margin-bottom: .35rem;
  flex: 0 0 auto;
}
.sk-am-details {
  display: flex;
  align-items: stretch;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  min-height: 46px;
}
.sk-am-details__input {
  flex: 1 1 auto;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: .95rem;
  color: #0f172a;
  padding: .7rem .85rem;
  min-width: 0;
}
.sk-am-details__input::placeholder { color: #94a3b8; }
.sk-am-mic {
  flex: 0 0 auto;
  width: 3rem;
  border: 0;
  border-left: 1px solid #e2e8f0;
  background: #fff;
  color: #64748b;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}
.sk-am-mic svg { width: 1.35rem; height: 1.35rem; }
.sk-am-mic.is-rec { color: #dc2626; background: #fef2f2; }
.sk-am-mic.is-ok { color: #16a34a; }
.sk-am-voice-lab {
  font-size: .78rem;
  color: #64748b;
  margin-top: -.25rem;
  padding-left: .15rem;
}
.sk-am-chips {
  display: flex;
  gap: .55rem;
  align-items: stretch;
}
.sk-am-chip {
  flex: 1 1 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #fff;
  color: #334155;
  font: inherit;
  font-size: .88rem;
  font-weight: 500;
  padding: .55rem .7rem;
  cursor: pointer;
  position: relative;
  min-height: 42px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-am-chip svg { width: 1.15rem; height: 1.15rem; flex: 0 0 auto; color: #64748b; }
.sk-am-chip.is-ok { border-color: #86efac; color: #166534; background: #f0fdf4; }
.sk-am-chip--date input[type="date"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  border: 0;
  width: 100%;
  height: 100%;
}
.sk-am-save {
  margin: auto .85rem .4rem;
  border: 0;
  border-radius: 12px;
  background: #94a3b8;
  color: #fff;
  font: inherit;
  font-size: .88rem;
  font-weight: 500;
  letter-spacing: .06em;
  padding: .55rem 1rem;
  cursor: pointer;
  flex: 0 0 auto;
  line-height: 1.2;
}
.sk-am-save.is-ready { background: var(--sk-pay); }
.sk-am--gave .sk-am-save.is-ready { background: var(--sk-recv); }
.sk-am--took .sk-am-save.is-ready { background: var(--sk-pay); }
.sk-am-save:active { transform: scale(.985); }
.sk-am-save:disabled,
.sk-am-save.is-busy { opacity: .65; cursor: not-allowed; }
.sk-am-pad {
  margin-top: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: minmax(52px, 1fr);
  gap: .4rem;
  padding: .45rem .65rem calc(.65rem + env(safe-area-inset-bottom, 0px));
  background: #eef2f7;
  flex: 0 0 auto;
}
/* Amount field left / Details focused: hide custom keypad */
.sk-am.is-pad-hidden .sk-am-pad {
  display: none !important;
}
.sk-am.is-pad-hidden .sk-am-save {
  margin-bottom: calc(.55rem + env(safe-area-inset-bottom, 0px) + var(--sk-kb-pad, 0px));
}
.sk-am.is-pad-hidden .sk-am-body {
  overflow: hidden;
}
.sk-screen:has(> .sk-am.is-pad-hidden) {
  overflow: hidden !important;
  overscroll-behavior: none;
}
.sk-am.is-pad-hidden .sk-am-details__input {
  font-size: 16px; /* iOS zoom prevent */
}
.sk-am-key {
  border: 0;
  border-radius: 14px;
  background: #fff;
  color: #334155;
  font: inherit;
  font-size: 1.2rem;
  font-weight: 500;
  cursor: pointer;
  min-height: 54px;
}
.sk-am-key--op { background: #dbe3ee; color: #334155; }
.sk-am-key--plus {
  background: #c5d0de;
  grid-row: span 2;
  min-height: 112px;
}
.sk-am-key:active { transform: scale(.97); }
.sk-empty-cell { text-align: center !important; color: var(--sk-muted); padding: 1rem .5rem !important; }

/* —— Sales tab —— */
.sk-screen:has(> .sk-sales) { overflow: hidden; padding-bottom: 0; }
.sk-sales {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background: #f3f4f6;
}
.sk-sales-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .5rem;
  padding: .75rem .85rem .55rem;
  background: #fff;
  border-bottom: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-sales-top__txt h1 {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-sales-top__txt small {
  display: block;
  margin-top: .15rem;
  font-size: .72rem;
  color: #94a3b8;
  font-weight: 500;
}
.sk-sales-period {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  background: #f1f5f9;
  border-radius: 999px;
  padding: 3px;
}
.sk-sales-chip {
  border: 0;
  background: transparent;
  color: #64748b;
  font: inherit;
  font-size: .72rem;
  font-weight: 600;
  padding: .35rem .55rem;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: .2rem;
}
.sk-sales-chip svg { width: .9rem; height: .9rem; }
.sk-sales-chip.is-on {
  background: #fff;
  color: #0f172a;
  box-shadow: 0 1px 4px rgba(15, 23, 42, .1);
}
.sk-pad--sales {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: .75rem .85rem 6.25rem;
}
.sk-sales-kpis.sk-home-cards {
  margin-bottom: .65rem;
}
.sk-sales-kpis .sk-sales-kpi.sk-home-card {
  min-height: 0;
  gap: .18rem;
  padding: .7rem .72rem .65rem;
  border: 0;
}
.sk-sales-kpi__lab {
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .04em;
  opacity: .78;
}
.sk-sales-kpis .sk-sales-kpi strong {
  font-size: 1.08rem;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.15;
}
.sk-sales-kpis .sk-sales-kpi small {
  font-size: .68rem;
  font-weight: 500;
  opacity: .88;
}
.sk-home-cards--vivid .sk-sales-kpi .sk-sales-kpi__lab,
.sk-home-cards--midnight .sk-sales-kpi .sk-sales-kpi__lab {
  color: rgba(255, 255, 255, .88);
  opacity: 1;
}
.sk-sales-manage {
  width: 100%;
  display: flex;
  align-items: center;
  gap: .65rem;
  border: 1px solid #e8ecf4;
  background: #fff;
  border-radius: 14px;
  padding: .75rem .8rem;
  margin-bottom: .65rem;
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.sk-sales-manage__ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #eff6ff;
  color: #2563eb;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}
.sk-sales-manage__ico svg { width: 1.2rem; height: 1.2rem; }
.sk-sales-manage__txt { flex: 1 1 auto; min-width: 0; }
.sk-sales-manage__txt strong {
  display: block;
  font-size: .92rem;
  font-weight: 600;
  color: #0f172a;
}
.sk-sales-manage__txt small {
  display: block;
  margin-top: .12rem;
  font-size: .72rem;
  color: #94a3b8;
}
.sk-sales-manage__chev { color: #94a3b8; font-size: 1.2rem; }
.sk-sales-tools {
  display: flex;
  gap: .45rem;
  margin-bottom: .65rem;
}
.sk-sales-search {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: .4rem;
  background: #fff;
  border: 1px solid #e8ecf4;
  border-radius: 12px;
  padding: .55rem .7rem;
  min-width: 0;
}
.sk-sales-search__ico { color: #94a3b8; display: grid; place-items: center; }
.sk-sales-search__ico svg { width: 1.05rem; height: 1.05rem; }
.sk-sales-search input {
  border: 0;
  outline: 0;
  width: 100%;
  font: inherit;
  font-size: .88rem;
  background: transparent;
  min-width: 0;
}
.sk-sales-filter {
  width: 44px;
  height: 44px;
  border: 1px solid #e8ecf4;
  border-radius: 12px;
  background: #fff;
  color: #475569;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
}
.sk-sales-filter svg { width: 1.15rem; height: 1.15rem; }
.sk-sales-list-head {
  display: flex;
  justify-content: space-between;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: #94a3b8;
  margin-bottom: .4rem;
}
.sk-sales-list {
  position: relative;
  padding-bottom: .25rem;
}
.sk-sale-row {
  display: flex;
  align-items: stretch;
  gap: .15rem;
  background: #fff;
  border: 1px solid #e8ecf4;
  border-radius: 14px;
  padding: .35rem .35rem .35rem .55rem;
  margin-bottom: .45rem;
  position: relative;
}
.sk-sale-row.is-menu { z-index: 6; }
.sk-sale-row__hit {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .65rem;
  border: 0;
  background: transparent;
  padding: .4rem .25rem .4rem .1rem;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}
.sk-sale-row__hit:active { opacity: .92; }
.sk-sale-av {
  width: 2.45rem;
  height: 2.45rem;
  border-radius: 999px;
  background: #e2e8f0;
  color: #334155;
  display: grid;
  place-items: center;
  font-size: .72rem;
  font-weight: 700;
  flex: 0 0 auto;
  letter-spacing: -.02em;
}
.sk-sale-av--person {
  color: #64748b;
}
.sk-sale-av--person svg {
  width: 1.25rem;
  height: 1.25rem;
}
.sk-sale-row__main { flex: 1 1 auto; min-width: 0; }
.sk-sale-row__main strong {
  display: block;
  font-size: .92rem;
  font-weight: 600;
  color: #0f172a;
}
.sk-sale-row__main small {
  display: block;
  margin-top: .15rem;
  font-size: .72rem;
  color: #94a3b8;
}
.sk-sale-row__right {
  text-align: right;
  flex: 0 0 auto;
}
.sk-sale-row__right strong {
  display: block;
  font-size: .92rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-sale-badge {
  display: inline-block;
  margin-top: .2rem;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .04em;
  padding: .15rem .4rem;
  border-radius: 6px;
}
.sk-sale-badge--cash { background: #dcfce7; color: #15803d; }
.sk-sale-badge--credit { background: #ffedd5; color: #c2410c; }
.sk-sale-row__menu {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  z-index: 1;
}
.sk-sale-row__menu:has(.sk-sale-pop) { z-index: 6; }
.sk-sale-dots {
  width: 2.1rem;
  height: 2.1rem;
  border: 0;
  background: transparent;
  color: #64748b;
  display: grid;
  place-items: center;
  cursor: pointer;
  border-radius: 999px;
  -webkit-tap-highlight-color: transparent;
}
.sk-sale-dots svg { width: 1.05rem; height: 1.05rem; }
.sk-sale-pop {
  position: absolute;
  right: 0;
  top: calc(100% + 2px);
  min-width: 10.8rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .14);
  padding: .3rem;
  z-index: 6;
}
.sk-sale-pop__btn {
  width: 100%;
  border: 0;
  background: transparent;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .65rem .7rem;
  border-radius: 9px;
  font: inherit;
  font-size: .9rem;
  font-weight: 500;
  color: #0f172a;
  cursor: pointer;
  text-align: left;
}
.sk-sale-pop__btn svg { width: 1rem; height: 1rem; flex: 0 0 auto; }
.sk-sale-pop__btn:active { background: #f1f5f9; }
.sk-sale-pop__btn--del {
  color: #dc2626;
  background: #fef2f2;
}
.sk-sale-pop__btn--del:active { background: #fee2e2; }
.sk-sale-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: transparent;
  z-index: 2;
  cursor: default;
}
.sk-sales { position: relative; }
.sk-empty--sales { padding: 1.5rem .5rem; }
.sk-sales-foot {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 430px;
  bottom: var(--sk-tabbar-h, 64px);
  z-index: 55;
  padding: .55rem .85rem .65rem;
  background: linear-gradient(180deg, rgba(243,244,246,0), #f3f4f6 35%);
  box-sizing: border-box;
  pointer-events: none;
}
.sk-sales-add {
  pointer-events: auto;
  width: 100%;
  border: 0;
  border-radius: 14px;
  background: #0f172a;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  padding: .9rem 1rem;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .22);
}
.sk-sales-add:active { transform: scale(.985); }

/* —— Record sale (Add Sale flow) —— */
.sk-screen:has(> .sk-rs) {
  overflow: hidden;
  padding-bottom: 0;
  background: #fff;
}
.sk-rs {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: #fff;
  color: #0f172a;
}
.sk-rs-top {
  display: flex;
  align-items: center;
  gap: .2rem;
  padding: .45rem .55rem .35rem;
  flex: 0 0 auto;
}
.sk-rs-top h1 {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -.02em;
  flex: 1 1 auto;
  min-width: 0;
}
.sk-rs-top__spacer {
  width: 2.35rem;
  height: 2.35rem;
  flex: 0 0 auto;
}
.sk-rs-cam-btn {
  flex: 0 0 auto;
  margin-left: auto;
  color: #0b1f3a;
}
.sk-rs-cam-btn.is-on {
  background: #e0e7ff !important;
  color: #3730a3;
  box-shadow: inset 0 0 0 1.5px #6366f1;
}
.sk-rs-cam-btn svg {
  width: 1.35rem;
  height: 1.35rem;
  display: block;
}
/* Hand / desktop barcode scanner panel (replaces keypad) */
.sk-rs-pad.sk-rs-pad--hand {
  display: flex;
  flex-direction: column;
  grid-template-columns: none;
  gap: 0;
  padding: .4rem .75rem .55rem;
  min-height: 220px;
  height: 243px;
  max-height: 280px;
  box-sizing: border-box;
  width: 100%;
  background: #f8fafc;
}
.sk-rs-hand {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  border-radius: 14px;
  background: #fff;
  border: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  padding: .65rem .75rem .7rem;
  box-sizing: border-box;
  gap: .45rem;
}
.sk-rs-hand__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
}
.sk-rs-hand__top strong {
  font-size: .9rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-rs-hand__close {
  width: 2rem;
  height: 2rem;
  border: 0;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}
.sk-rs-hand__close svg { width: 1rem; height: 1rem; display: block; }
.sk-rs-hand__box {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  margin: 0;
}
.sk-rs-hand__lab {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #64748b;
}
.sk-rs-hand__inp {
  border: 1.5px solid #c7d2fe;
  border-radius: 12px;
  background: #f8faff;
  font: inherit;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: #0f172a;
  padding: .85rem .9rem;
  outline: 0;
  width: 100%;
  box-sizing: border-box;
}
.sk-rs-hand__inp:focus {
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, .2);
  background: #fff;
}
.sk-rs-hand__hint {
  margin: 0;
  font-size: .72rem;
  line-height: 1.35;
  color: #64748b;
}
.sk-rs-hand__msg {
  margin-top: auto;
  font-size: .8rem;
  font-weight: 600;
  color: #4338ca;
  text-align: center;
  padding: .35rem 0 0;
}
.sk-rs-tabs {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 0;
  padding: 0 1.25rem;
  border-bottom: 1px solid #eef2f7;
  flex: 0 0 auto;
  position: relative;
}
.sk-rs-tab-ink {
  position: absolute;
  left: 1.25rem;
  right: 1.25rem;
  bottom: -1px;
  height: 2.5px;
  pointer-events: none;
  z-index: 1;
}
.sk-rs-tab-ink__bar {
  display: block;
  width: 50%;
  height: 100%;
  transform: translateX(0);
  transition: transform .3s cubic-bezier(.4, 0, .2, 1);
  will-change: transform;
}
.sk-rs-tab-ink__bar::after {
  content: '';
  display: block;
  height: 100%;
  margin: 0 18%;
  border-radius: 2px 2px 0 0;
  background: #0f172a;
}
.sk-rs-tabs--items .sk-rs-tab-ink__bar {
  transform: translateX(100%);
}
.sk-rs-tabs.no-ink-anim .sk-rs-tab-ink__bar {
  transition: none;
}
.sk-rs-tab {
  flex: 1 1 0;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: .92rem;
  font-weight: 600;
  color: #94a3b8;
  padding: .55rem .5rem .65rem;
  cursor: pointer;
  position: relative;
  text-align: center;
  transition: color .22s ease;
  z-index: 2;
}
.sk-rs-tab.is-on {
  color: #0f172a;
}
.sk-rs-body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.sk-rs-body--items { overflow: auto; -webkit-overflow-scrolling: touch; }
.sk-rs-sec-lab {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: #94a3b8;
  padding: .75rem 1rem .35rem;
  flex: 0 0 auto;
}
.sk-rs-lines {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 0 1rem;
  -webkit-overflow-scrolling: touch;
}
.sk-rs-empty {
  text-align: center;
  padding: 1.75rem 1rem 1rem;
  color: #94a3b8;
}
.sk-rs-empty strong {
  display: block;
  color: #64748b;
  font-size: .95rem;
  font-weight: 600;
}
.sk-rs-empty p {
  margin: .35rem 0 0;
  font-size: .82rem;
}
.sk-rs-empty--sm { padding: 1.25rem .5rem; }
.sk-rs-line {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .65rem 0;
  border-bottom: 1px solid #f1f5f9;
}
.sk-rs-line__num {
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 10px;
  background: #f1f5f9;
  color: #64748b;
  font-size: .78rem;
  font-weight: 700;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}
.sk-rs-line__main { flex: 1 1 auto; min-width: 0; }
.sk-rs-line__main strong {
  display: block;
  font-size: .92rem;
  font-weight: 600;
  color: #0f172a;
}
.sk-rs-line__main small {
  display: block;
  margin-top: .12rem;
  font-size: .75rem;
  color: #94a3b8;
}
.sk-rs-line__amt {
  flex: 0 0 auto;
  font-size: .92rem;
  font-weight: 700;
  color: #0f172a;
  white-space: nowrap;
  margin-left: .15rem;
}
.sk-rs-line__rm {
  width: 1.8rem;
  height: 1.8rem;
  border: 0;
  border-radius: 8px;
  background: #f1f5f9;
  color: #64748b;
  font-size: 1.1rem;
  line-height: 1;
  cursor: pointer;
  flex: 0 0 auto;
}
.sk-rs-amt {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .75rem;
  padding: .65rem 1rem .45rem;
  border-top: 1px solid #f1f5f9;
  flex: 0 0 auto;
}
.sk-rs-amt span {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .05em;
  color: #94a3b8;
}
.sk-rs-amt strong {
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: -.03em;
  color: #cbd5e1;
}
.sk-rs-amt strong.has-val { color: #0f172a; }
.sk-rs-pad {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: minmax(52px, 1fr);
  gap: .42rem;
  padding: .35rem .75rem .55rem;
  background: #f8fafc;
  flex: 0 0 auto;
}
/* Must come after .sk-rs-pad so grid doesn't shrink camera to 1 column */
.sk-rs-pad.sk-rs-pad--cam {
  display: flex;
  flex-direction: column;
  grid-template-columns: none;
  grid-auto-rows: auto;
  gap: 0;
  padding: .35rem .75rem .55rem;
  min-height: 260px;
  height: 280px;
  max-height: 320px;
  box-sizing: border-box;
  width: 100%;
}
.sk-rs-pad--cam .sk-rs-cam-inline {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  border-radius: 14px;
  overflow: hidden;
  background: #0b1220;
  color: #fff;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}
.sk-rs-cam-inline__top {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: .4rem .55rem;
  background: rgba(0,0,0,.4);
}
.sk-rs-cam-inline__top strong {
  font-size: .85rem;
  font-weight: 700;
}
.sk-rs-cam-inline__close {
  width: 2rem;
  height: 2rem;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}
.sk-rs-cam-inline__close svg {
  width: 1rem;
  height: 1rem;
  display: block;
}
.sk-rs-cam-inline__stage {
  flex: 1 1 auto;
  min-height: 150px;
  width: 100%;
  position: relative;
  overflow: hidden;
  background: #000;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.sk-rs-cam-inline__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #000;
  display: block;
}
.sk-rs-cam-inline__frame {
  position: absolute;
  left: 12%;
  right: 12%;
  top: 16%;
  bottom: 16%;
  border: 2px solid rgba(255,255,255,.9);
  border-radius: 12px;
  box-shadow: 0 0 0 999px rgba(0,0,0,.22);
  pointer-events: none;
}
.sk-rs-cam-inline__msg {
  flex: 0 0 auto;
  text-align: center;
  font-size: .72rem;
  font-weight: 600;
  padding: .35rem .5rem .45rem;
  background: #0b1220;
  color: #e2e8f0;
  line-height: 1.25;
}
.sk-rs-key {
  border: 0;
  border-radius: 12px;
  background: #fff;
  color: #0f172a;
  font: inherit;
  font-size: 1.2rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
  min-height: 52px;
}
.sk-rs-key:active { transform: scale(.97); background: #f1f5f9; }
.sk-rs-key--op {
  color: #64748b;
  display: grid;
  place-items: center;
}
.sk-rs-key--op svg { width: 1.25rem; height: 1.25rem; }
.sk-rs-additem {
  grid-column: 4;
  grid-row: 2 / span 3;
  border: 0;
  border-radius: 14px;
  background: #e8eef6;
  color: #94a3b8;
  font: inherit;
  font-size: .78rem;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: .5rem;
}
.sk-rs-additem svg { width: 1.35rem; height: 1.35rem; }
.sk-rs-additem:active { transform: scale(.98); }
.sk-rs-newitem {
  margin: .85rem 1rem .55rem;
  width: calc(100% - 2rem);
  display: flex;
  align-items: center;
  gap: .75rem;
  border: 0;
  border-radius: 16px;
  background: #0f172a;
  color: #fff;
  padding: .85rem .9rem;
  cursor: pointer;
  font: inherit;
  text-align: left;
  box-sizing: border-box;
}
.sk-rs-newitem__ico {
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 10px;
  background: rgba(255,255,255,.12);
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}
.sk-rs-newitem__ico svg { width: 1.2rem; height: 1.2rem; }
.sk-rs-newitem__txt { flex: 1 1 auto; min-width: 0; }
.sk-rs-newitem__txt strong {
  display: block;
  font-size: .95rem;
  font-weight: 700;
}
.sk-rs-newitem__txt small {
  display: block;
  margin-top: .15rem;
  font-size: .72rem;
  color: #94a3b8;
  font-weight: 500;
}
.sk-rs-newitem__chev {
  color: #fff;
  opacity: .85;
  display: grid;
  place-items: center;
}
.sk-rs-newitem__chev svg { width: 1.15rem; height: 1.15rem; }
.sk-rs-scan {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  margin: 0 1rem .65rem;
  padding: .65rem .75rem;
  background: #f8fafc;
  border: 1px solid #e8ecf4;
  border-radius: 12px;
}
.sk-rs-scan--quick {
  margin: .15rem 1rem .45rem;
  padding: .5rem .7rem;
  border-color: #c7d2fe;
  background: #f8faff;
}
.sk-rs-scan--quick .sk-rs-scan__inp:focus {
  outline: none;
}
.sk-rs-scan__lab {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: #64748b;
  text-transform: uppercase;
}
.sk-rs-scan__inp {
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  color: #0f172a;
  min-width: 0;
  width: 100%;
}
.sk-rs-searchrow {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: 0 1rem .55rem;
}
.sk-rs-search {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .4rem;
  background: #f8fafc;
  border: 1px solid #e8ecf4;
  border-radius: 12px;
  padding: .55rem .7rem;
}
.sk-rs-search__ico { color: #94a3b8; display: grid; place-items: center; }
.sk-rs-search__ico svg { width: 1.05rem; height: 1.05rem; }
.sk-rs-search input {
  border: 0;
  outline: 0;
  width: 100%;
  font: inherit;
  font-size: .88rem;
  background: transparent;
  min-width: 0;
}
.sk-rs-searchrow__n {
  flex: 0 0 auto;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: #94a3b8;
}
.sk-rs-catalog { padding: 0 1rem 1rem; }
.sk-rs-cat-row {
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .7rem 0;
  border-bottom: 1px solid #f1f5f9;
}
.sk-rs-cat-row__ico {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 10px;
  background: #f1f5f9;
  color: #94a3b8;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
}
.sk-rs-cat-row__ico svg { width: 1.2rem; height: 1.2rem; }
.sk-rs-cat-row__ico.has-img {
  background: transparent;
  border: 0;
}
.sk-rs-cat-row__ico.has-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.sk-rs-cat-row__body { flex: 1 1 auto; min-width: 0; }
.sk-rs-cat-row__body strong {
  display: block;
  font-size: .95rem;
  font-weight: 700;
}
.sk-rs-cat-row__body small {
  display: block;
  margin-top: .12rem;
  font-size: .75rem;
  color: #94a3b8;
}
.sk-rs-cat-add {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: .2rem;
  border: 1.5px solid #0f172a;
  background: #fff;
  color: #0f172a;
  border-radius: 999px;
  padding: .4rem .7rem .4rem .55rem;
  font: inherit;
  font-size: .78rem;
  font-weight: 700;
  cursor: pointer;
}
.sk-rs-cat-add svg { width: .95rem; height: .95rem; }
.sk-rs-cat-add:active { transform: scale(.97); background: #f8fafc; }
.sk-rs-qty {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: .15rem;
  border: 1.5px solid #0f172a;
  background: #fff;
  border-radius: 999px;
  padding: .18rem .22rem;
  min-width: 5.4rem;
  justify-content: space-between;
}
.sk-rs-qty__btn {
  width: 1.75rem;
  height: 1.75rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #0f172a;
  font: inherit;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  display: grid;
  place-items: center;
  padding: 0;
}
.sk-rs-qty__btn:active { background: #f1f5f9; }
.sk-rs-qty__n {
  min-width: 1.25rem;
  text-align: center;
  font-size: .9rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-rs-foot {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .7rem .9rem calc(.75rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #eef2f7;
  background: #fff;
}
.sk-rs-foot__tot { flex: 1 1 auto; min-width: 0; }
.sk-rs-foot__tot small {
  display: block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: #94a3b8;
}
.sk-rs-foot__tot strong {
  display: block;
  margin-top: .15rem;
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -.02em;
}
.sk-rs-next {
  flex: 0 0 auto;
  min-width: 42%;
  border: 0;
  border-radius: 14px;
  background: #e8eef6;
  color: #94a3b8;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  padding: .85rem 1rem;
  cursor: not-allowed;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
}
.sk-rs-next svg { width: 1.1rem; height: 1.1rem; }
.sk-rs-next.is-on {
  background: #0f172a;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(15, 23, 42, .18);
}
.sk-rs-next.is-on:active { transform: scale(.985); }

/* —— Confirm Sale —— */
.sk-screen:has(> .sk-sc),
.sk-screen:has(> .sk-scp) {
  overflow: hidden;
  padding-bottom: 0;
  background: #f3f4f6;
}
.sk-sc, .sk-scp {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: #f3f4f6;
  color: #0f172a;
}
.sk-sc-top {
  display: flex;
  align-items: center;
  gap: .25rem;
  padding: .5rem .55rem .45rem;
  background: #fff;
  border-bottom: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-sc-top__txt h1 {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -.02em;
}
.sk-sc-top__txt small {
  display: block;
  margin-top: .1rem;
  font-size: .72rem;
  color: #94a3b8;
  font-weight: 500;
}
.sk-sc-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: .75rem .85rem calc(1rem + var(--sk-kb-pad, 0px));
  scroll-padding-bottom: calc(1.25rem + var(--sk-kb-pad, 0px));
}
.sk-sc-lab {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: #94a3b8;
  margin: 0 0 .45rem;
}
.sk-sc-lab--out { margin: .85rem 0 .45rem; }
.sk-sc-lab--row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sk-sc-lab--row em {
  font-style: normal;
  font-size: .68rem;
  font-weight: 600;
  color: #cbd5e1;
  letter-spacing: .02em;
}
.sk-sc-card {
  background: #fff;
  border-radius: 16px;
  padding: .85rem .9rem .7rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
}
.sk-sc-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
  padding: .55rem 0;
  border-bottom: 1px solid #f1f5f9;
}
.sk-sc-item__l { min-width: 0; flex: 1 1 auto; }
.sk-sc-item__l strong {
  display: block;
  font-size: .92rem;
  font-weight: 600;
}
.sk-sc-item__l small {
  display: block;
  margin-top: .12rem;
  font-size: .72rem;
  color: #94a3b8;
}
.sk-sc-item__r {
  flex: 0 0 auto;
  font-size: .92rem;
  font-weight: 700;
}
.sk-sc-sub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .7rem 0 .15rem;
  margin-top: .15rem;
}
.sk-sc-sub span { font-size: .88rem; color: #64748b; font-weight: 500; }
.sk-sc-sub strong { font-size: .95rem; font-weight: 800; }
.sk-sc-pay {
  width: 100%;
  display: flex;
  align-items: center;
  gap: .7rem;
  border: 1px solid #e8ecf4;
  background: #fff;
  border-radius: 14px;
  padding: .85rem .9rem;
  margin-bottom: .5rem;
  cursor: pointer;
  font: inherit;
  text-align: left;
  color: #0f172a;
  box-sizing: border-box;
}
.sk-sc-pay__ico {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 10px;
  background: #f1f5f9;
  color: #64748b;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}
.sk-sc-pay__ico svg { width: 1.2rem; height: 1.2rem; }
.sk-sc-pay__txt { flex: 1 1 auto; min-width: 0; }
.sk-sc-pay__txt strong {
  display: block;
  font-size: .95rem;
  font-weight: 700;
}
.sk-sc-pay__txt small {
  display: block;
  margin-top: .12rem;
  font-size: .72rem;
  color: #94a3b8;
  font-weight: 500;
}
.sk-sc-pay__radio {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 999px;
  border: 2px solid #cbd5e1;
  flex: 0 0 auto;
  box-sizing: border-box;
}
.sk-sc-pay.is-on {
  background: #0f172a;
  border-color: #0f172a;
  color: #fff;
}
.sk-sc-pay.is-on .sk-sc-pay__ico {
  background: rgba(255,255,255,.12);
  color: #fff;
}
.sk-sc-pay.is-on .sk-sc-pay__txt small { color: #94a3b8; }
.sk-sc-pay.is-on .sk-sc-pay__radio {
  border-color: #fff;
  box-shadow: inset 0 0 0 3.5px #0f172a, inset 0 0 0 5.5px #fff;
}
.sk-sc-cust {
  width: 100%;
  display: flex;
  align-items: center;
  gap: .55rem;
  border: 0;
  background: #fff;
  border-radius: 14px;
  padding: .85rem .9rem;
  cursor: pointer;
  font: inherit;
  text-align: left;
  color: #94a3b8;
  box-sizing: border-box;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
}
.sk-sc-cust.has-val { color: #0f172a; }
.sk-sc-cust__ico { display: grid; place-items: center; color: #94a3b8; }
.sk-sc-cust__ico svg { width: 1.1rem; height: 1.1rem; }
.sk-sc-cust__txt {
  flex: 1 1 auto;
  min-width: 0;
  font-size: .9rem;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-sc-field {
  display: flex;
  align-items: center;
  gap: .55rem;
  background: #fff;
  border-radius: 14px;
  padding: .75rem .9rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
}
.sk-sc-field__ico { color: #94a3b8; display: grid; place-items: center; }
.sk-sc-field__ico svg { width: 1.1rem; height: 1.1rem; }
.sk-sc-field__lab {
  flex: 1 1 auto;
  font-size: .88rem;
  color: #64748b;
  font-weight: 500;
}
.sk-sc-field__inp {
  flex: 0 0 auto;
  width: 5.5rem;
  border: 0;
  outline: 0;
  background: transparent;
  text-align: right;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-sc-note {
  display: flex;
  align-items: center;
  gap: .55rem;
  background: #fff;
  border-radius: 14px;
  padding: .85rem .9rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
}
.sk-sc-note__inp {
  flex: 1 1 auto;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: .9rem;
  min-width: 0;
}
.sk-sc-change {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin: .45rem .15rem 0;
  padding: .55rem .75rem;
  border-radius: 12px;
  background: #f0fdf4;
  color: #166534;
  font-size: .88rem;
}
.sk-sc-change strong {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.sk-sc-foot {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .7rem .9rem calc(.75rem + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #eef2f7;
}
.sk-sc-foot__tot { flex: 1 1 auto; min-width: 0; }
.sk-sc-foot__tot small {
  display: block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: #94a3b8;
}
.sk-sc-foot__tot strong {
  display: block;
  margin-top: .12rem;
  font-size: 1.25rem;
  font-weight: 800;
}
.sk-sc-confirm {
  flex: 0 0 auto;
  min-width: 48%;
  border: 0;
  border-radius: 14px;
  background: #e8eef6;
  color: #94a3b8;
  font: inherit;
  font-size: .92rem;
  font-weight: 700;
  padding: .85rem 1rem;
  cursor: not-allowed;
}
.sk-sc-confirm.is-on {
  background: #0f172a;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(15, 23, 42, .18);
}
.sk-sc-confirm.is-on:active { transform: scale(.985); }
.sk-scp-search {
  margin: .75rem .85rem .45rem;
  display: flex;
  align-items: center;
  gap: .45rem;
  background: #fff;
  border-radius: 14px;
  padding: .7rem .85rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
  flex: 0 0 auto;
}
.sk-scp-search__ico { color: #94a3b8; display: grid; place-items: center; }
.sk-scp-search__ico svg { width: 1.1rem; height: 1.1rem; }
.sk-scp-search input {
  border: 0;
  outline: 0;
  width: 100%;
  font: inherit;
  font-size: .9rem;
  background: transparent;
  min-width: 0;
}
.sk-scp-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: .35rem .85rem 1rem;
  -webkit-overflow-scrolling: touch;
}
.sk-scp-row {
  width: 100%;
  display: flex;
  align-items: center;
  gap: .65rem;
  border: 1px solid #e8ecf4;
  background: #fff;
  border-radius: 14px;
  padding: .8rem .85rem;
  margin-bottom: .45rem;
  cursor: pointer;
  font: inherit;
  text-align: left;
  color: #0f172a;
  box-sizing: border-box;
}
.sk-scp-row__txt { flex: 1 1 auto; min-width: 0; }
.sk-scp-row__txt strong {
  display: block;
  font-size: .92rem;
  font-weight: 700;
}
.sk-scp-row__txt small {
  display: block;
  margin-top: .12rem;
  font-size: .75rem;
  color: #94a3b8;
}
.sk-scp-row__radio {
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 999px;
  border: 2px solid #cbd5e1;
  flex: 0 0 auto;
  box-sizing: border-box;
}
.sk-scp-row.is-on {
  border-color: #0f172a;
  background: #0f172a;
  color: #fff;
}
.sk-scp-row.is-on .sk-scp-row__txt small { color: #94a3b8; }
.sk-scp-row.is-on .sk-scp-row__radio {
  border-color: #fff;
  box-shadow: inset 0 0 0 3.5px #0f172a, inset 0 0 0 5.5px #fff;
}
.sk-scp-foot {
  flex: 0 0 auto;
  padding: .7rem .85rem calc(.75rem + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #eef2f7;
}
.sk-scp-ok {
  width: 100%;
  border: 0;
  border-radius: 14px;
  background: #e8eef6;
  color: #94a3b8;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  padding: .9rem 1rem;
  cursor: not-allowed;
}
.sk-scp-ok.is-on {
  background: #0f172a;
  color: #fff;
  cursor: pointer;
}
.sk-scp-ok.is-on:active { transform: scale(.985); }

/* —— Sale invoice (Receipt / Invoice tabs) —— */
.sk-screen:has(> .sk-si) {
  overflow: hidden;
  padding-bottom: 0;
  background: #f0f2f5;
}
.sk-si {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: #f0f2f5;
  color: #0f172a;
}
.sk-si-top {
  display: flex;
  align-items: center;
  gap: .15rem;
  padding: .45rem .55rem .4rem;
  background: #fff;
  border-bottom: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-si-top__txt {
  flex: 1 1 auto;
  min-width: 0;
}
.sk-si-top__txt h1 {
  margin: 0;
  font-size: 1.12rem;
  font-weight: 700;
  letter-spacing: -.02em;
}
.sk-si-top__txt small {
  display: block;
  margin-top: .08rem;
  font-size: .72rem;
  color: #94a3b8;
  font-weight: 500;
}
.sk-si-tabs {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 0;
  padding: 0 1.1rem;
  background: #fff;
  border-bottom: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-si-tab {
  flex: 1 1 0;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: .82rem;
  font-weight: 600;
  color: #94a3b8;
  padding: .55rem .35rem .65rem;
  cursor: pointer;
  position: relative;
  text-align: center;
  white-space: nowrap;
}
.sk-si-tab.is-on {
  color: #0f172a;
}
.sk-si-tab.is-on::after {
  content: '';
  position: absolute;
  left: 18%;
  right: 18%;
  bottom: -1px;
  height: 2.5px;
  border-radius: 2px 2px 0 0;
  background: #0f172a;
}
.sk-si-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: .75rem .75rem .5rem;
}
.sk-si-sheet {
  background: #fff;
  border-radius: 14px;
  padding: .95rem 1rem 1.1rem;
  box-shadow: 0 2px 12px rgba(15, 23, 42, .07);
  color: #0f172a;
  overflow: hidden;
}
.sk-si-sheet--invoice {
  padding: .85rem .85rem 1rem;
}
.sk-si-brand {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin-bottom: .75rem;
  color: #0f172a;
}
.sk-si-brand__logo {
  width: 1.55rem;
  height: 1.55rem;
  object-fit: contain;
  flex: 0 0 auto;
  filter: grayscale(1) contrast(1.15) brightness(.35);
}
.sk-si-brand__ico {
  display: inline-flex;
  width: 1.45rem;
  height: 1.45rem;
  color: #0f172a;
  flex: 0 0 auto;
}
.sk-si-brand__mark {
  width: 100%;
  height: 100%;
  display: block;
}
.sk-si-brand__txt {
  font-size: .88rem;
  font-weight: 700;
  letter-spacing: -.01em;
  color: #0f172a;
}

/* Receipt (thermal / monochrome — matches sales invoice print) */
.sk-si-sheet--receipt {
  font-family: "Segoe UI", Helvetica, Arial, sans-serif;
  color: #111;
  padding: 1.05rem 1rem 1.2rem;
  position: relative;
  overflow: hidden;
}
/* Thermal Receipt — admin width 58 / 80 / custom mm */
.sk-si-sheet--thermal {
  --sk-thermal-mm: 58;
  margin-left: auto;
  margin-right: auto;
  font-family: "Courier New", Courier, ui-monospace, monospace;
  letter-spacing: -.01em;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, .08);
  max-width: min(100%, calc(var(--sk-thermal-mm) * 0.302rem));
}
.sk-si-sheet--thermal-58 {
  width: 100%;
  max-width: min(100%, calc(var(--sk-thermal-mm, 58) * 0.302rem)); /* custom / 58mm preview */
  padding: .7rem .55rem .85rem;
  font-size: .78rem;
}
.sk-si-sheet--thermal-80 {
  width: 100%;
  max-width: min(100%, calc(var(--sk-thermal-mm, 80) * 0.281rem)); /* custom / 80mm preview */
  padding: .85rem .7rem 1rem;
  font-size: .84rem;
}
.sk-si-sheet--thermal .sk-si-rcpt-shop {
  font-size: 1.02rem;
}
.sk-si-sheet--thermal-58 .sk-si-rcpt-shop {
  font-size: .95rem;
}
.sk-si-sheet--thermal .sk-si-rcpt-head.has-logo {
  grid-template-columns: 3.6rem 1fr 3.6rem;
  min-height: 3.6rem;
  column-gap: .1rem;
}
.sk-si-sheet--thermal .sk-si-rcpt-headlogo,
.sk-si-sheet--thermal .sk-si-rcpt-logoimg {
  width: 3.6rem;
  height: 3.6rem;
}
.sk-si-sheet--thermal-80 .sk-si-rcpt-head.has-logo {
  grid-template-columns: 4.4rem 1fr 4.4rem;
  min-height: 4.4rem;
}
.sk-si-sheet--thermal-80 .sk-si-rcpt-headlogo,
.sk-si-sheet--thermal-80 .sk-si-rcpt-logoimg {
  width: 4.4rem;
  height: 4.4rem;
}
.sk-si-sheet--thermal .sk-si-rcpt-thead,
.sk-si-sheet--thermal .sk-si-rcpt-trow,
.sk-si-sheet--thermal .sk-si-rcpt-sums,
.sk-si-sheet--thermal .sk-si-rcpt-grid {
  font-size: inherit;
}
.sk-si-sheet--thermal .sk-si-rcpt-thead,
.sk-si-sheet--thermal .sk-si-rcpt-trow {
  grid-template-columns: minmax(0, 1.55fr) minmax(2.4em, .7fr) minmax(1.4em, .4fr) minmax(2.6em, .75fr);
  gap: .2rem .25rem;
}
.sk-si-sheet--thermal .sk-si-rcpt-trow__item {
  word-break: normal;
  overflow-wrap: anywhere;
}
.sk-si-sheet--thermal .sk-si-rcpt-trow__price,
.sk-si-sheet--thermal .sk-si-rcpt-trow__qty,
.sk-si-sheet--thermal .sk-si-rcpt-trow__tot {
  white-space: nowrap;
}
.sk-si-sheet--thermal .sk-si-rcpt-sums {
  width: 100%;
  align-items: flex-end;
}
.sk-si-sheet--thermal .sk-si-rcpt-sums > div {
  display: grid;
  grid-template-columns: max-content 7.5ch;
  column-gap: .55rem;
  width: max-content;
  max-width: 100%;
  min-width: 0;
}
.sk-si-sheet--thermal .sk-si-qr__img {
  width: 5.5rem;
  height: 5.5rem;
}
.sk-si-sheet--thermal-58 .sk-si-qr__img {
  width: 4.75rem;
  height: 4.75rem;
}
.sk-si-sheet--receipt > *:not(.sk-si-rcpt-wm) {
  position: relative;
  z-index: 1;
}
.sk-si-rcpt-wm {
  position: absolute;
  inset: 12% 8% 18%;
  display: grid;
  place-items: center;
  pointer-events: none;
  z-index: 0;
  opacity: .09;
}
.sk-si-rcpt-wm img,
.sk-si-rcpt-wm svg {
  width: min(62%, 210px);
  height: auto;
  max-height: 210px;
  object-fit: contain;
  filter: grayscale(1);
  color: #111;
}
.sk-si-rcpt-head {
  text-align: center;
  margin-bottom: .55rem;
}
.sk-si-rcpt-head.has-logo {
  display: grid;
  grid-template-columns: 5.85rem 1fr 5.85rem;
  align-items: center;
  min-height: 5.85rem;
  column-gap: .15rem;
}
.sk-si-rcpt-headlogo {
  grid-column: 1;
  width: 5.85rem;
  height: 5.85rem;
  display: grid;
  place-items: center;
  justify-self: start;
}
.sk-si-rcpt-logoimg {
  width: 5.85rem;
  height: 5.85rem;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}
.sk-si-rcpt-headtxt {
  grid-column: 2;
  text-align: center;
  width: 100%;
  justify-self: stretch;
}
.sk-si-rcpt-shop {
  font-size: 1.12rem;
  font-weight: 800;
  letter-spacing: .01em;
  text-transform: uppercase;
  line-height: 1.15;
}
.sk-si-rcpt-addr {
  font-size: .78rem;
  color: #333;
  line-height: 1.35;
  margin-top: .1rem;
}
.sk-si-rcpt-contact {
  font-size: .74rem;
  color: #444;
  margin-top: .2rem;
}
.sk-si-rcpt-rule {
  border-top: 1.5px solid #111;
  margin: .55rem 0;
}
.sk-si-rcpt-dash {
  border-top: 1px dashed #555;
  margin: .2rem 0 .35rem;
}
.sk-si-rcpt-grid {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  font-size: .78rem;
  line-height: 1.4;
}
.sk-si-rcpt-grid__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .5rem;
}
.sk-si-rcpt-grid__l { text-align: left; min-width: 0; }
.sk-si-rcpt-grid__r { text-align: right; flex: 0 0 auto; white-space: nowrap; }
.sk-si-rcpt-grid__full {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-si-rcpt-grid strong { font-weight: 700; }
.sk-si-rcpt-doctitle {
  text-align: center;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .04em;
  margin: .7rem 0 .55rem;
}
.sk-si-rcpt-thead,
.sk-si-rcpt-trow {
  display: grid;
  grid-template-columns: 1.45fr .7fr .45fr .75fr;
  gap: .3rem;
  font-size: .78rem;
  align-items: start;
}
.sk-si-rcpt-thead {
  font-weight: 700;
  padding-bottom: .15rem;
}
.sk-si-rcpt-thead span:nth-child(n+2),
.sk-si-rcpt-trow span:nth-child(n+2) { text-align: right; }
.sk-si-rcpt-trow {
  padding: .28rem 0;
}
.sk-si-rcpt-trow__item {
  text-align: left !important;
  font-weight: 500;
  word-break: break-word;
}
.sk-si-rcpt-sums {
  display: flex;
  flex-direction: column;
  gap: .28rem;
  align-items: flex-end;
  width: 100%;
  font-size: .82rem;
}
.sk-si-rcpt-sums > div {
  display: grid;
  grid-template-columns: max-content 7.5ch;
  align-items: baseline;
  column-gap: .55rem;
  width: max-content;
  min-width: 0;
  max-width: 100%;
}
.sk-si-rcpt-sums span {
  font-weight: 500;
  white-space: nowrap;
  text-align: right;
  min-width: 0;
  justify-self: end;
}
.sk-si-rcpt-sums strong {
  width: 7.5ch;
  min-width: 7.5ch;
  text-align: right;
  font-weight: 700;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  justify-self: end;
}
.sk-si-rcpt-sums--grand { margin-top: .05rem; }
.sk-si-rcpt-sums__tot span,
.sk-si-rcpt-sums__tot strong {
  font-weight: 800;
}
.sk-si-rcpt-pay {
  font-size: .82rem;
  line-height: 1.4;
}
.sk-si-rcpt-pay__lab { font-weight: 700; }
.sk-si-rcpt-pay__val { margin-top: .1rem; }
.sk-si-rcpt-thanks {
  text-align: center;
  font-style: italic;
  font-size: .88rem;
  color: #222;
  margin: .35rem 0 .75rem;
}
.sk-si-sheet--receipt .sk-si-qr {
  margin-bottom: .45rem;
}
.sk-si-rcpt-powered {
  text-align: center;
  font-size: .72rem;
  color: #555;
  font-weight: 600;
  letter-spacing: .01em;
}

/* Invoice (professional) */
.sk-si-inv-hero {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  background: #0f172a;
  color: #fff;
  border-radius: 10px;
  padding: .85rem .9rem;
  margin: 0 -.05rem .85rem;
}
.sk-si-inv-hero small {
  display: block;
  font-size: .62rem;
  letter-spacing: .08em;
  font-weight: 600;
  opacity: .72;
  margin-bottom: .2rem;
}
.sk-si-inv-hero strong {
  display: block;
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.15;
}
.sk-si-inv-hero__r {
  text-align: right;
}
.sk-si-inv-hero__r strong {
  font-size: .82rem;
  font-weight: 600;
  max-width: 9.5rem;
}
.sk-si-inv-parties {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  margin-bottom: .85rem;
}
.sk-si-inv-parties small {
  display: block;
  font-size: .62rem;
  letter-spacing: .07em;
  font-weight: 700;
  color: #94a3b8;
  margin-bottom: .25rem;
}
.sk-si-inv-parties strong {
  display: block;
  font-size: .88rem;
  font-weight: 700;
  word-break: break-word;
}
.sk-si-inv-parties em {
  display: block;
  margin-top: .15rem;
  font-style: normal;
  font-size: .75rem;
  color: #64748b;
}
.sk-si-inv-cols {
  display: grid;
  grid-template-columns: 1.6rem 1fr auto;
  gap: .5rem;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: #94a3b8;
  padding-bottom: .35rem;
  border-bottom: 1px solid #eef2f7;
}
.sk-si-inv-cols span:last-child { text-align: right; }
.sk-si-inv-row {
  display: grid;
  grid-template-columns: 1.6rem 1fr auto;
  gap: .5rem;
  align-items: start;
  padding: .55rem 0;
  border-bottom: 1px solid #f1f5f9;
}
.sk-si-inv-row__n {
  font-size: .78rem;
  color: #94a3b8;
  font-weight: 600;
  padding-top: .1rem;
}
.sk-si-inv-row__desc strong {
  display: block;
  font-size: .86rem;
  font-weight: 600;
  word-break: break-word;
}
.sk-si-inv-row__desc small {
  display: block;
  margin-top: .12rem;
  font-size: .7rem;
  color: #94a3b8;
}
.sk-si-inv-row__amt {
  font-size: .86rem;
  font-weight: 600;
  white-space: nowrap;
  text-align: right;
}
.sk-si-inv-sums {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  align-items: flex-end;
  margin-top: .75rem;
  font-size: .86rem;
}
.sk-si-inv-sums > div {
  display: flex;
  justify-content: flex-end;
  gap: 1.4rem;
  min-width: 68%;
}
.sk-si-inv-sums span { color: #64748b; }
.sk-si-inv-sums strong { min-width: 5rem; text-align: right; font-weight: 700; }
.sk-si-inv-sums__grand {
  margin-top: .15rem;
  font-size: 1rem;
}
.sk-si-inv-sums__grand span,
.sk-si-inv-sums__grand strong {
  color: #0f172a;
  font-weight: 800;
}
.sk-si-inv-pay {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: center;
  margin-top: .9rem;
  padding-top: .75rem;
  border-top: 1px solid #eef2f7;
  font-size: .82rem;
  color: #64748b;
}
.sk-si-inv-pay strong { color: #0f172a; }
.sk-si-inv-pay em {
  font-style: normal;
  color: #94a3b8;
}
.sk-si-inv-foot {
  margin-top: .85rem;
}
.sk-si-thanks {
  text-align: center;
  font-style: italic;
  font-size: .82rem;
  color: #64748b;
  margin: .35rem 0 .65rem;
}
.sk-si-qr {
  display: flex;
  justify-content: center;
  margin-bottom: .2rem;
}
.sk-si-qr__img {
  width: 130px;
  height: 130px;
  object-fit: contain;
  background: #fff;
}
.sk-si-qr__empty {
  width: 130px;
  height: 130px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  display: grid;
  place-items: center;
  text-align: center;
  font-size: .72rem;
  color: #94a3b8;
  padding: .5rem;
}
.sk-si-actions {
  flex: 0 0 auto;
  padding: .7rem .85rem calc(.75rem + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #eef2f7;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.sk-si-actions__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
}
.sk-si-actions__row--share {
  grid-template-columns: 1.35fr 1fr;
}
.sk-si-wa,
.sk-si-print,
.sk-si-pdf,
.sk-si-done {
  border-radius: 12px;
  font: inherit;
  font-size: .88rem;
  font-weight: 700;
  padding: .85rem .7rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
}
.sk-si-wa {
  border: 0;
  background: #25d366;
  color: #fff;
  box-shadow: 0 6px 14px rgba(37, 211, 102, .28);
}
.sk-si-wa svg { width: 1.2rem; height: 1.2rem; }
.sk-si-print {
  border: 0;
  background: #334155;
  color: #fff;
}
.sk-si-print svg { width: 1.15rem; height: 1.15rem; }
.sk-si-pdf {
  border: 1.5px solid #e2e8f0;
  background: #fff;
  color: #0f172a;
}
.sk-si-pdf svg { width: 1.1rem; height: 1.1rem; }
.sk-si-done {
  border: 0;
  background: #0f172a;
  color: #fff;
}
.sk-si-done svg { width: 1.1rem; height: 1.1rem; }
.sk-si-wa:active,
.sk-si-print:active,
.sk-si-pdf:active,
.sk-si-done:active { transform: scale(.985); }

/* —— My items (Manage items) —— */
.sk-screen:has(> .sk-mi),
.sk-screen:has(> .sk-mif) {
  overflow: hidden;
  padding-bottom: 0;
  background: #fff;
}
.sk-mi, .sk-mif {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  height: 100%;
  background: #fff;
  position: relative;
  overflow: hidden;
}
.sk-mi-top, .sk-mif-top {
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: .55rem .65rem .5rem;
  border-bottom: 1px solid #eef2f7;
  flex: 0 0 auto;
  background: #fff;
}
.sk-mi-top__txt, .sk-mif-top__txt {
  flex: 1 1 auto;
  min-width: 0;
}
.sk-mi-top__txt h1,
.sk-mif-top__txt h1 {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}
.sk-mi-top__txt small,
.sk-mif-top__txt small {
  display: block;
  margin-top: .1rem;
  font-size: .75rem;
  color: #94a3b8;
  font-weight: 500;
}
.sk-mi-searchbtn {
  width: 2.45rem;
  height: 2.45rem;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  color: #0f172a;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
  -webkit-tap-highlight-color: transparent;
}
.sk-mi-searchbtn svg { width: 1.15rem; height: 1.15rem; }
.sk-mi-searchbtn.is-on {
  background: #0f172a;
  border-color: #0f172a;
  color: #fff;
}
.sk-mi-searchbar {
  padding: .55rem .85rem .65rem;
  background: #fff;
  border-bottom: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-mi-searchbar input {
  width: 100%;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: .7rem .9rem;
  font: inherit;
  font-size: .92rem;
  background: #fff;
  color: #0f172a;
  outline: none;
  box-sizing: border-box;
}
.sk-mi-searchbar input:focus {
  border-color: #94a3b8;
}
.sk-pad--mi {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: #fff;
  padding: 0 0 5.5rem;
}
.sk-mi-list {
  display: flex;
  flex-direction: column;
}
.sk-mi-bcbar {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .55rem .95rem;
  background: #f8fafc;
  border-bottom: 1px solid #eef2f7;
}
.sk-mi-bcbar__all {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: .85rem;
  font-weight: 600;
  color: #334155;
  cursor: pointer;
  user-select: none;
}
.sk-mi-bcbar__all input {
  width: 1.05rem;
  height: 1.05rem;
  accent-color: #0b1f3a;
}
.sk-mi-bcbar__dl {
  border: 0;
  background: #0b1f3a;
  color: #fff;
  border-radius: 10px;
  padding: .35rem .75rem .4rem;
  font: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.15;
  min-width: 5.5rem;
}
.sk-mi-bcbar__dl-main {
  font-size: .82rem;
  font-weight: 700;
}
.sk-mi-bcbar__dl-sub {
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  opacity: .85;
  margin-top: .08rem;
}
.sk-mi-bcbar__dl:disabled {
  opacity: .4;
  cursor: default;
}
.sk-mi-check {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 1.35rem;
  margin: 0;
  cursor: pointer;
}
.sk-mi-check input {
  width: 1.05rem;
  height: 1.05rem;
  accent-color: #0b1f3a;
}
.sk-mi-row {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .85rem .95rem;
  border-bottom: 1px solid #f1f5f9;
  position: relative;
}
.sk-mi-row.is-sel {
  background: #f0f7ff;
}
.sk-mi-row__ico {
  width: 3.1rem;
  height: 3.1rem;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #94a3b8;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  box-sizing: border-box;
}
.sk-mi-row__ico svg { width: 1.25rem; height: 1.25rem; }
.sk-mi-row__ico.has-img {
  padding: 0;
  overflow: hidden;
  background: transparent;
  border: 0;
  border-radius: 10px;
}
.sk-mi-row__ico.has-img img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain !important;
  object-position: center;
  display: block;
}
.sk-mi-row__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.sk-mi-row__body strong {
  font-size: .98rem;
  font-weight: 700;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-mi-row__body small {
  font-size: .78rem;
  color: #94a3b8;
  font-weight: 500;
}
.sk-mi-row__menu {
  position: relative;
  flex: 0 0 auto;
  z-index: 1;
}
.sk-mi-row__menu:has(.sk-mi-pop) {
  z-index: 6;
}
.sk-mi-dots {
  width: 2.1rem;
  height: 2.1rem;
  border: 0;
  background: transparent;
  color: #64748b;
  display: grid;
  place-items: center;
  cursor: pointer;
  border-radius: 999px;
  -webkit-tap-highlight-color: transparent;
}
.sk-mi-dots svg { width: 1.05rem; height: 1.05rem; }
.sk-mi-pop {
  position: absolute;
  right: 0;
  top: calc(100% + 2px);
  min-width: 10.5rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .14);
  padding: .3rem;
  z-index: 6;
}
.sk-mi-pop__btn {
  width: 100%;
  border: 0;
  background: transparent;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .65rem .7rem;
  border-radius: 9px;
  font: inherit;
  font-size: .9rem;
  font-weight: 500;
  color: #0f172a;
  cursor: pointer;
  text-align: left;
}
.sk-mi-pop__btn svg { width: 1rem; height: 1rem; flex: 0 0 auto; }
.sk-mi-pop__btn:active { background: #f1f5f9; }
.sk-mi-pop__btn--del { color: #dc2626; }
.sk-mif-barcode {
  margin-top: .65rem;
  padding: .75rem;
  background: #f8fafc;
  border: 1px solid #e8ecf4;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: .55rem;
}
.sk-mif-barcode__canvas {
  width: 100%;
  max-width: 100%;
  height: auto;
  min-height: 140px;
  background: #fff;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  display: block;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}
.sk-mif-barcode__tip {
  margin: 0;
  font-size: .72rem;
  line-height: 1.35;
  color: #64748b;
  text-align: center;
}
.sk-mif-barcode__btn {
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #0f172a;
  border-radius: 10px;
  padding: .45rem .85rem;
  font: inherit;
  font-size: .85rem;
  font-weight: 600;
  cursor: pointer;
  align-self: center;
}
.sk-mif-barcode__btn:active { background: #f1f5f9; }
.sk-mi-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: transparent;
  z-index: 2;
  cursor: default;
}
.sk-mi-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 3.2rem 1.5rem 1.5rem;
  gap: .55rem;
}
.sk-mi-empty__art {
  width: 5.2rem;
  height: 5.2rem;
  border-radius: 18px;
  background: #f1f5f9;
  color: #94a3b8;
  display: grid;
  place-items: center;
  margin-bottom: .55rem;
}
.sk-mi-empty__art svg { width: 2.2rem; height: 2.2rem; }
.sk-mi-empty strong {
  font-size: 1.15rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-mi-empty p {
  margin: 0;
  max-width: 16rem;
  font-size: .88rem;
  line-height: 1.45;
  color: #94a3b8;
  font-weight: 500;
}
.sk-mi-empty__btn {
  margin-top: 1rem;
  border: 0;
  border-radius: 14px;
  background: #0f172a;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  padding: .9rem 1.35rem;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .18);
}
.sk-mi-fab {
  position: absolute;
  right: 1rem;
  bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  z-index: 3;
  border: 0;
  border-radius: 999px;
  background: #0f172a;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  padding: .85rem 1.25rem;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .28);
  -webkit-tap-highlight-color: transparent;
}
.sk-mi-fab:active { transform: scale(.97); }
.sk-pad--mif {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  scroll-padding-bottom: calc(1.25rem + var(--sk-kb-pad, 0px));
  padding: 1rem .95rem calc(.75rem + env(safe-area-inset-bottom, 0px) + var(--sk-kb-pad, 0px));
}
.sk-mif-fields {
  display: flex;
  flex-direction: column;
  gap: .95rem;
  flex: 0 0 auto;
}
html.sk-mif-kb .sk-pad--mif {
  padding-bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px) + var(--sk-kb-pad, 0px));
}
.sk-mif-field {
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.sk-mif-field .sk-label {
  margin: 0;
  font-size: .8rem;
  color: #64748b;
}
.sk-mif-field .sk-input {
  width: 100%;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  min-height: 2.85rem;
  padding: .7rem .85rem;
  background: #fff;
}
.sk-mif-pic {
  display: flex;
  align-items: center;
  gap: .85rem;
}
.sk-mif-pic__prev {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #94a3b8;
  display: grid;
  place-items: center;
  overflow: hidden;
  flex: 0 0 auto;
}
.sk-mif-pic__prev svg { width: 1.6rem; height: 1.6rem; }
.sk-mif-pic__prev.has-img {
  border-color: #cbd5e1;
  background: #fff;
  padding: 4px;
}
.sk-mif-pic__prev img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}
.sk-mif-pic__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .35rem;
  min-width: 0;
}
.sk-mif-pic__btn {
  border: 1px solid #e2e8f0;
  background: #0f172a;
  color: #fff;
  border-radius: 10px;
  font: inherit;
  font-size: .82rem;
  font-weight: 600;
  padding: .5rem .85rem;
  cursor: pointer;
}
.sk-mif-pic__btn--ghost {
  background: #fff;
  color: #64748b;
}
.sk-mif-pic__actions small {
  font-size: .7rem;
  color: #94a3b8;
  font-weight: 500;
}
.sk-mif-pic__size {
  display: block;
  min-height: 1em;
  font-size: .72rem;
  font-weight: 600;
  color: #94a3b8;
  letter-spacing: .02em;
  font-variant-numeric: tabular-nums;
}
.sk-mif-unit {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .85rem center;
  padding-right: 2.2rem;
}
.sk-mif-foot {
  flex: 0 0 auto;
  padding-top: 1.25rem;
}
.sk-mif-save {
  width: 100%;
  border: 0;
  border-radius: 14px;
  background: #475569;
  color: #fff;
  font: inherit;
  font-size: .98rem;
  font-weight: 600;
  min-height: 3.15rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  cursor: pointer;
}
.sk-mif-save svg { width: 1.15rem; height: 1.15rem; }
.sk-mif-save:active { transform: scale(.985); }
.sk-mif-save:disabled,
.sk-mif-save.is-busy { opacity: .65; cursor: not-allowed; }

/* —— Account tab —— */
.sk-screen:has(> .sk-acc) { overflow: hidden; padding-bottom: 0; }
.sk-acc {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background: #f8fafc;
}
.sk-acc-top {
  padding: .75rem .95rem .25rem;
  background: #fff;
}
.sk-acc-biz {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: #64748b;
}
.sk-pad--acc {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: .35rem 0 calc(1rem + var(--sk-tabbar-h, 64px));
}
.sk-pad--acc > .sk-acc-wa,
.sk-pad--acc > .sk-acc-legal,
.sk-pad--acc > .sk-acc-social,
.sk-pad--acc > .sk-acc-ver {
  margin-left: .85rem;
  margin-right: .85rem;
}
.sk-acc-block {
  background: #fff;
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid #eef2f7;
  padding: .95rem 1rem .4rem;
  margin: 0 0 .85rem;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  overflow: hidden;
}
.sk-acc-profile {
  display: flex;
  align-items: center;
  gap: .85rem;
  background: transparent;
  border-radius: 0;
  padding: .1rem 0 .75rem;
  margin-bottom: .35rem;
}
.sk-acc-av {
  width: 72px;
  height: 72px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #64748b;
  display: grid;
  place-items: center;
  overflow: hidden;
  flex: 0 0 auto;
  font-weight: 700;
  position: relative;
}
.sk-acc-av--logo {
  width: 80px;
  height: 80px;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
.sk-acc-av img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: inherit;
}
.sk-acc-av img.sk-acc-av__logo,
.sk-acc-av--logo img.sk-acc-av__logo {
  position: static;
  width: 80px;
  height: 80px;
  object-fit: contain;
  padding: 0;
  background: transparent;
  border-radius: 0;
}
.sk-acc-profile__txt { flex: 1 1 auto; min-width: 0; }
.sk-acc-profile__txt strong {
  display: block;
  font-size: .98rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-acc-profile__txt span {
  display: block;
  margin-top: .12rem;
  font-size: .82rem;
  color: #64748b;
}
.sk-acc-edit { display: none !important; }
.sk-acc-actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .45rem;
  margin-bottom: .55rem;
  padding: .15rem 0 .45rem;
}
.sk-acc-act {
  border: 0;
  background: transparent;
  font: inherit;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  color: #334155;
  font-size: .72rem;
  font-weight: 500;
  padding: .2rem;
}
.sk-acc-act__ico {
  width: 54px;
  height: 54px;
  border-radius: 0;
  background: transparent;
  display: grid;
  place-items: center;
  font-size: 1.25rem;
}
.sk-acc-act__ico .ico,
.sk-acc-act__ico svg {
  width: 54px;
  height: 54px;
  object-fit: contain;
  display: block;
}
.sk-acc-act__ico--visit { background: transparent; color: #ea580c; }
.sk-acc-act__ico--collect { background: transparent; color: #2563eb; }
.sk-acc-act__ico--cash { background: transparent; color: #0891b2; }
.sk-acc-menu {
  background: transparent;
  border-radius: 0;
  border: 0;
  border-top: 1px solid #f1f5f9;
  margin: 0 -.15rem;
  overflow: hidden;
}
.sk-acc-menu__item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: .7rem;
  border: 0;
  border-bottom: 1px solid #f1f5f9;
  background: transparent;
  padding: .85rem .55rem;
  font: inherit;
  font-size: .92rem;
  font-weight: 500;
  color: #0f172a;
  cursor: pointer;
  text-align: left;
}
.sk-acc-menu__item:last-child { border-bottom: 0; }
.sk-acc-menu__item:active { background: #f8fafc; }
.sk-acc-menu__item--toggle .sk-acc-menu__lab { flex: 1 1 auto; text-align: left; }
.sk-acc-menu__chev {
  flex: 0 0 auto;
  color: #94a3b8;
  font-size: .95rem;
  font-weight: 500;
  line-height: 1;
  transition: transform .22s ease;
}
.sk-acc-menu__group.is-open .sk-acc-menu__chev { color: #64748b; }
.sk-acc-menu__group { border-bottom: 1px solid #f1f5f9; }
.sk-acc-menu__group .sk-acc-menu__item { border-bottom: 0; }
.sk-acc-menu__dd {
  margin: 0 0 0 .15rem;
  margin-left: 2rem;
  padding: 0;
  border-left: 2px solid #e2e8f0;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(-4px);
  transition: max-height .28s ease, opacity .22s ease, transform .22s ease, padding .22s ease;
}
.sk-acc-menu__group.is-open .sk-acc-menu__dd {
  max-height: 160px;
  opacity: 1;
  transform: translateY(0);
  padding: .15rem 0 .55rem;
}
.sk-acc-menu__dd[hidden] {
  display: block !important;
  max-height: 0;
  opacity: 0;
  padding: 0;
  pointer-events: none;
}
.sk-acc-menu__group.is-open .sk-acc-menu__dd[hidden] { pointer-events: auto; }
.sk-acc-menu__sub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  padding: .55rem .75rem;
  font: inherit;
  font-size: .88rem;
  font-weight: 500;
  color: #334155;
  cursor: pointer;
}
.sk-acc-menu__sub:active { background: #f8fafc; color: #0b1f3a; }
.sk-acc-menu__sub-val {
  flex: 0 1 auto;
  max-width: 58%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .78rem;
  font-weight: 500;
  color: #64748b;
  text-align: right;
}
.sk-acc-menu__ico {
  width: 1.45rem;
  height: 1.45rem;
  text-align: center;
  color: #64748b;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  line-height: 1;
}
.sk-acc-menu__ico .ico,
.sk-acc-menu__ico svg {
  width: 1.25rem;
  height: 1.25rem;
  object-fit: contain;
  display: block;
}
.sk-acc-menu__ico .fa-fallback { font-size: 1.05rem; line-height: 1; }
.sk-acc-wa {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  width: 100%;
  border: 1px solid #e8ecf4;
  background: #fff;
  border-radius: 14px;
  padding: .9rem 1rem;
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  color: #0f172a;
  text-decoration: none;
  cursor: pointer;
  margin-bottom: .85rem;
}
.sk-acc-wa:active { background: #f8fafc; }
.sk-acc-legal {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: .45rem;
  margin: -.35rem 0 .85rem;
}
.sk-acc-legal__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  border: 1px solid #e8ecf4;
  background: #fff;
  border-radius: 14px;
  padding: .85rem .55rem;
  font: inherit;
  font-size: .82rem;
  font-weight: 600;
  color: #0f172a;
  cursor: pointer;
  text-align: center;
  line-height: 1.25;
}
.sk-acc-legal__btn:active { background: #f8fafc; }
.sk-acc-social {
  display: flex;
  justify-content: center;
  gap: .85rem;
  margin-bottom: .75rem;
}
.sk-acc-social__btn {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #fff;
  border: 1px solid #e8ecf4;
  text-decoration: none;
}
.sk-acc-ver {
  text-align: center;
  font-size: .72rem;
  color: #94a3b8;
  font-weight: 500;
  padding-bottom: .35rem;
}

/* —— Reminders —— */
.sk-screen:has(> .sk-rm) {
  overflow: hidden;
  padding-bottom: 0;
  background: #fff;
  display: flex;
  flex-direction: column;
}
.sk-rm {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  height: 100%;
  background: #fff;
}
.sk-pad--rm {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: .75rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
  background: #fff;
}
.sk-rm-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
  margin-bottom: .85rem;
}
.sk-rm-stat {
  display: flex;
  align-items: center;
  gap: .65rem;
  border-radius: 14px;
  padding: .85rem .8rem;
  min-height: 4.4rem;
}
.sk-rm-stat__ico {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: #fff;
}
.sk-rm-stat__ico svg { width: 1.15rem; height: 1.15rem; display: block; }
.sk-rm-stat strong {
  display: block;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.15;
}
.sk-rm-stat small {
  display: block;
  margin-top: .15rem;
  font-size: .78rem;
  font-weight: 500;
}
.sk-rm-stat--over {
  background: #fff1f2;
}
.sk-rm-stat--over .sk-rm-stat__ico { background: #ef4444; }
.sk-rm-stat--over strong,
.sk-rm-stat--over small { color: #e11d48; }
.sk-rm-stat--pend {
  background: #f1f5f9;
}
.sk-rm-stat--pend .sk-rm-stat__ico { background: #64748b; }
.sk-rm-stat--pend strong { color: #0f172a; }
.sk-rm-stat--pend small { color: #64748b; }
.sk-rm-searchrow {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .85rem;
}
.sk-rm-search {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .45rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 0 .75rem;
  min-height: 44px;
}
.sk-rm-search__ico {
  color: #94a3b8;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}
.sk-rm-search__ico svg { width: 1.1rem; height: 1.1rem; display: block; }
.sk-rm-search input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: .92rem;
  color: #0f172a;
  padding: .55rem 0;
}
.sk-rm-sort {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #475569;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
}
.sk-rm-sort svg { width: 1.2rem; height: 1.2rem; display: block; }
.sk-rm-sort:active { transform: scale(.96); }
.sk-rm-sec {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .06em;
  color: #94a3b8;
  margin: .15rem 0 .35rem;
}
.sk-rm-list {
  display: flex;
  flex-direction: column;
}
.sk-rm-row {
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .85rem 0;
  border-bottom: 1px solid #eef2f7;
}
.sk-rm-row:last-child { border-bottom: 0; }
.sk-rm-av {
  width: 2.55rem;
  height: 2.55rem;
  border-radius: 12px;
  background: #e2e8f0;
  color: #334155;
  display: grid;
  place-items: center;
  font-size: .78rem;
  font-weight: 700;
  flex: 0 0 auto;
}
.sk-rm-row__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.sk-rm-row__body strong {
  font-size: .95rem;
  font-weight: 600;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-rm-row__body span {
  font-size: .88rem;
  font-weight: 500;
  color: #475569;
}
.sk-rm-send {
  width: 2.5rem;
  height: 2.5rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #64748b;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
}
.sk-rm-send svg { width: 1.25rem; height: 1.25rem; display: block; }
.sk-rm-send:active { color: #0f766e; transform: scale(.94); }
.sk-sheet--rm .sk-rm-sheet {
  padding: .35rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
}
.sk-rm-sheet__head {
  display: flex;
  align-items: center;
  gap: .7rem;
  margin: .35rem 0 .85rem;
}
.sk-rm-sheet__meta {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .2rem;
}
.sk-rm-sheet__meta strong {
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-rm-badge {
  display: inline-flex;
  align-self: flex-start;
  font-size: .68rem;
  font-weight: 600;
  color: #64748b;
  background: #f1f5f9;
  border-radius: 999px;
  padding: .15rem .5rem;
  font-style: normal;
}
.sk-rm-badge.is-over {
  color: #e11d48;
  background: #fff1f2;
}
.sk-rm-sheet__amt {
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
  flex: 0 0 auto;
}
.sk-rm-preview {
  background: #f8fafc;
  border-radius: 14px;
  padding: .85rem .9rem;
  margin-bottom: .9rem;
}
.sk-rm-preview__lab {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: #94a3b8;
  margin-bottom: .55rem;
}
.sk-rm-preview__body {
  font-size: .9rem;
  line-height: 1.5;
  color: #334155;
  white-space: pre-wrap;
}
.sk-rm-sheet__acts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
}
.sk-rm-wa,
.sk-rm-sms {
  border-radius: 14px;
  min-height: 3.15rem;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
}
.sk-rm-wa {
  border: 0;
  background: #25d366;
  color: #fff;
}
.sk-rm-wa svg { width: 1.25rem; height: 1.25rem; display: block; }
.sk-rm-sms {
  border: 1.5px solid #cbd5e1;
  background: #fff;
  color: #0f172a;
}
.sk-rm-sms svg { width: 1.2rem; height: 1.2rem; display: block; }
.sk-rm-wa:active,
.sk-rm-sms:active { transform: scale(.985); }

@media (min-width: 500px) {
  body { padding: 1rem 0; height: auto; min-height: 100%; overflow: auto; }
  .sk-app {
    height: var(--sk-app-height, calc(100dvh - 2rem));
    max-height: var(--sk-app-height, calc(100dvh - 2rem));
    border-radius: 20px;
    overflow: hidden;
  }
  .sk-tabbar { border-radius: 0 0 20px 20px; }
}

/* Collect repayments */
.sk-cl {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  height: 100%;
  background: #fff;
  overflow: hidden;
}
.sk-cl-top {
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: .7rem .75rem .35rem;
  flex: 0 0 auto;
  background: #fff;
}
.sk-cl-back {
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  background: transparent;
  color: #0f172a;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  border-radius: 999px;
  flex: 0 0 auto;
}
.sk-cl-back svg { width: 1.35rem; height: 1.35rem; }
.sk-cl-title {
  margin: 0;
  flex: 1 1 auto;
  text-align: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: #111;
  padding-right: 2.25rem;
  letter-spacing: -.01em;
}
.sk-cl-banner {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin: .15rem .85rem .55rem;
  padding: .85rem .9rem;
  background: #f3f4f6;
  border-radius: 4px;
  flex: 0 0 auto;
}
.sk-cl-banner__txt {
  margin: 0;
  flex: 1 1 auto;
  font-size: .82rem;
  line-height: 1.4;
  color: #6b7280;
  font-weight: 400;
}
.sk-cl-banner__side {
  flex: 0 0 auto;
  width: 4.6rem;
  height: 3.4rem;
  display: grid;
  place-items: center;
}
.sk-cl-banner__side img.ico,
.sk-cl-banner__side .sk-cl-banner__art,
.sk-cl-banner__art {
  width: 4.5rem;
  height: 3.35rem;
  object-fit: contain;
  display: block;
}
.sk-cl-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid #e5e7eb;
  flex: 0 0 auto;
  background: #fff;
}
.sk-cl-tab {
  border: 0;
  background: transparent;
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  color: #9ca3af;
  padding: .7rem .5rem .75rem;
  cursor: pointer;
  position: relative;
}
.sk-cl-tab.is-on {
  color: #111;
}
.sk-cl-tab.is-on::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 3px;
  background: #111;
}
.sk-cl-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  background: #fff;
}
.sk-cl-empty {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 1.5rem 5.5rem;
  text-align: center;
  gap: .85rem;
}
.sk-cl-empty__ico {
  width: 9.5rem;
  height: 8.2rem;
  display: grid;
  place-items: center;
}
.sk-cl-empty__ico img.ico,
.sk-cl-empty__ico .sk-cl-empty__art,
.sk-cl-empty__art {
  width: 9rem;
  height: 7.8rem;
  object-fit: contain;
  display: block;
}
.sk-cl-empty__txt {
  margin: 0;
  max-width: 16rem;
  font-size: .9rem;
  line-height: 1.45;
  color: #9ca3af;
  font-weight: 400;
}
.sk-cl-list {
  padding: .35rem 0 5.5rem;
}
.sk-cl-row {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #f1f5f9;
  background: #fff;
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .85rem 1rem;
  text-align: left;
  font: inherit;
  cursor: pointer;
  color: #0f172a;
}
.sk-cl-row:active { background: #f8fafc; }
.sk-cl-av {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  background: #e2e8f0;
  color: #334155;
  display: grid;
  place-items: center;
  font-size: .78rem;
  font-weight: 700;
  flex: 0 0 auto;
}
.sk-cl-row__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .12rem;
}
.sk-cl-row__body strong {
  font-size: .95rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-cl-row__body em {
  font-style: normal;
  font-size: .72rem;
  color: #94a3b8;
}
.sk-cl-row__amt {
  flex: 0 0 auto;
  font-size: .9rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-cl-foot {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: .85rem 1.25rem calc(.95rem + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 28%, #fff 100%);
  display: flex;
  justify-content: center;
  pointer-events: none;
  z-index: 5;
}
.sk-cl { position: relative; }
.sk-cl-set {
  pointer-events: auto;
  width: min(100%, 22rem);
  border: 0;
  border-radius: 999px;
  background: #111;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .95rem 1.25rem;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .18);
}
.sk-cl-set:active { transform: scale(.985); }
.sk-sheet--cl .sk-cl-sheet {
  max-height: min(86vh, 640px);
  display: flex;
  flex-direction: column;
  padding-bottom: calc(.85rem + env(safe-area-inset-bottom, 0px));
}
.sk-cl-sheet__title {
  margin: .15rem 0 .75rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  text-align: center;
}
.sk-cl-sheet__date {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  margin: 0 0 .65rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #64748b;
}
.sk-cl-sheet__date input {
  border: 1.5px solid #e2e8f0;
  border-radius: 12px;
  font: inherit;
  font-size: 1rem;
  font-weight: 600;
  color: #0f172a;
  padding: .7rem .8rem;
  text-transform: none;
  letter-spacing: 0;
}
.sk-cl-sheet__search {
  margin: 0 0 .55rem;
}
.sk-cl-sheet__search input {
  width: 100%;
  box-sizing: border-box;
  border: 1.5px solid #e2e8f0;
  border-radius: 12px;
  font: inherit;
  font-size: .95rem;
  padding: .7rem .85rem;
  outline: 0;
}
.sk-cl-sheet__search input:focus { border-color: #94a3b8; }
.sk-cl-sheet__list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 0 .75rem;
  border: 1px solid #f1f5f9;
  border-radius: 12px;
}
.sk-cl-pick {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .7rem .75rem;
  border-bottom: 1px solid #f1f5f9;
  cursor: pointer;
  margin: 0;
}
.sk-cl-pick:last-child { border-bottom: 0; }
.sk-cl-pick.is-on { background: #f8fafc; }
.sk-cl-pick input { width: 1.05rem; height: 1.05rem; accent-color: #111; flex: 0 0 auto; }
.sk-cl-pick__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.sk-cl-pick__body strong {
  font-size: .92rem;
  font-weight: 600;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-cl-pick__body em {
  font-style: normal;
  font-size: .72rem;
  color: #94a3b8;
}
.sk-cl-sheet__save {
  width: 100%;
  border: 0;
  border-radius: 999px;
  background: #111;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  padding: .9rem 1rem;
  cursor: pointer;
}
.sk-cl-sheet__save:disabled {
  opacity: .65;
  cursor: wait;
}

/* Cashbook (Account → Cashbook) */
.sk-cb {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  height: 100%;
  background: #fff;
  overflow: hidden;
  position: relative;
}
.sk-cb-top {
  display: flex;
  align-items: center;
  gap: .25rem;
  padding: .65rem .75rem .35rem;
  flex: 0 0 auto;
  background: #fff;
}
.sk-cb-back,
.sk-cb-lock {
  width: 2.35rem;
  height: 2.35rem;
  border: 0;
  background: transparent;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  border-radius: 999px;
  flex: 0 0 auto;
}
.sk-cb-back { color: #111; }
.sk-cb-back svg,
.sk-cb-lock svg { width: 1.35rem; height: 1.35rem; display: block; }
.sk-cb-lock {
  color: var(--sk-pay-ink, #16a34a);
}
.sk-cb-lock.is-locked { color: #64748b; }
.sk-cb-title {
  margin: 0;
  flex: 1 1 auto;
  text-align: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: #111;
  letter-spacing: -.01em;
}
.sk-pad--cb {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: .35rem .9rem 5.6rem;
  background: #fff;
  display: flex;
  flex-direction: column;
}
.sk-cb-cards {
  margin: .15rem 0 .85rem;
}
.sk-cb-card {
  min-height: 4.6rem;
  justify-content: center;
  gap: .2rem;
  padding: .85rem .75rem;
}
.sk-cb-card .sk-home-card__top { display: none; }
.sk-cb-card strong {
  font-size: 1.2rem;
  font-weight: 700;
}
.sk-cb-card small {
  font-size: .78rem;
  font-weight: 500;
  opacity: .9;
}
.sk-cb-cols {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: end;
  gap: .65rem;
  padding: .15rem .1rem .55rem;
  border-bottom: 1px solid #e8ecf1;
  flex: 0 0 auto;
}
.sk-cb-cols__date {
  border: 0;
  background: transparent;
  font: inherit;
  font-size: .82rem;
  color: #94a3b8;
  font-weight: 500;
  text-align: left;
  padding: 0;
  cursor: pointer;
}
.sk-cb-cols__out,
.sk-cb-cols__in {
  font-size: .82rem;
  color: #94a3b8;
  font-weight: 500;
  min-width: 4.2rem;
  text-align: right;
}
.sk-cb-cols__out { min-width: 4.6rem; }
.sk-cb-body {
  flex: 1 1 auto;
  min-height: 12rem;
}
.sk-cb-empty {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: .85rem;
  padding: 2.2rem 1rem 1rem;
}
.sk-cb-empty__ico {
  width: 10rem;
  height: 7.8rem;
  display: grid;
  place-items: center;
}
.sk-cb-empty__ico img.ico,
.sk-cb-empty__ico .sk-cb-empty__art,
.sk-cb-empty__art {
  width: 9.5rem;
  height: 7.4rem;
  object-fit: contain;
  display: block;
}
.sk-cb-empty__txt {
  margin: 0;
  max-width: 15rem;
  font-size: .92rem;
  line-height: 1.45;
  color: #9ca3af;
  font-weight: 400;
}
.sk-cb-list { padding: .15rem 0 0; }
.sk-cb-row {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #f1f5f9;
  background: #fff;
  display: grid;
  grid-template-columns: 1fr 4.6rem 4.2rem;
  gap: .65rem;
  align-items: center;
  padding: .8rem .1rem;
  font: inherit;
  text-align: left;
  cursor: pointer;
  color: #0f172a;
}
.sk-cb-row:active { background: #f8fafc; }
.sk-cb-row__note {
  font-size: .9rem;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-cb-row__out {
  text-align: right;
  font-size: .88rem;
  font-weight: 600;
  color: var(--sk-recv-ink, #dc2626);
}
.sk-cb-row__in {
  text-align: right;
  font-size: .88rem;
  font-weight: 600;
  color: var(--sk-pay-ink, #16a34a);
}
.sk-cb-foot {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
  padding: .75rem .9rem calc(.85rem + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 22%, #fff 100%);
  z-index: 5;
}
.sk-cb-act {
  border: 0;
  border-radius: 14px;
  font: inherit;
  font-size: .88rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #fff;
  padding: .95rem .7rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .12);
}
.sk-cb-act:disabled {
  opacity: .55;
  cursor: not-allowed;
  box-shadow: none;
}
.sk-cb-act:not(:disabled):active { transform: scale(.985); }
.sk-cb-act__ico {
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1;
}
.sk-cb-act--out {
  background: var(--sk-recv, #ef4444);
  color: #fff;
}
.sk-cb-act--in {
  background: var(--sk-pay, #22c55e);
  color: #fff;
}
/* Theme-aware button ink on vivid/midnight-style soft cards still use solid CTA colors */
.sk-theme--soft .sk-cb-act--out { background: var(--sk-recv); }
.sk-theme--soft .sk-cb-act--in { background: var(--sk-pay); }
.sk-theme--vivid .sk-cb-act--out { background: var(--sk-recv); }
.sk-theme--vivid .sk-cb-act--in { background: var(--sk-pay); }
.sk-theme--ocean .sk-cb-act--out { background: var(--sk-recv); }
.sk-theme--ocean .sk-cb-act--in { background: var(--sk-pay); }
.sk-theme--sunset .sk-cb-act--out { background: var(--sk-recv); }
.sk-theme--sunset .sk-cb-act--in { background: var(--sk-pay); }
.sk-theme--midnight .sk-cb-act--out { background: var(--sk-recv); }
.sk-theme--midnight .sk-cb-act--in { background: var(--sk-pay); }

/* Cashbook — Previous record */
.sk-cb-prev {
  width: 100%;
  border: 1px solid #e5e7eb;
  background: #f3f4f6;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  padding: .85rem 1rem;
  margin: 0 0 .85rem;
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  color: #111;
  cursor: pointer;
}
.sk-cb-prev:active { transform: scale(.99); background: #eceff3; }
.sk-cb-prev__ico {
  width: 1.35rem;
  height: 1.35rem;
  color: #64748b;
  display: grid;
  place-items: center;
}
.sk-cb-prev__ico svg { width: 1.25rem; height: 1.25rem; display: block; }
.sk-cb-cols__date {
  border: 0;
  background: transparent;
  font: inherit;
  font-size: .82rem;
  color: #94a3b8;
  font-weight: 500;
  text-align: left;
  padding: 0;
}

.sk-cprev {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  height: 100%;
  background: #fff;
  overflow: hidden;
  position: relative;
}
.sk-cprev-top {
  display: flex;
  align-items: center;
  gap: .25rem;
  padding: .65rem .75rem .4rem;
  flex: 0 0 auto;
}
.sk-cprev-back {
  width: 2.35rem;
  height: 2.35rem;
  border: 0;
  background: transparent;
  color: #111;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  border-radius: 999px;
  flex: 0 0 auto;
}
.sk-cprev-back svg { width: 1.35rem; height: 1.35rem; }
.sk-cprev-title {
  margin: 0;
  flex: 1 1 auto;
  text-align: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.3rem;
  font-weight: 600;
  color: #111;
  padding-right: 2.35rem;
}
.sk-pad--cprev {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: .35rem .9rem 5.4rem;
  background: #fff;
}
.sk-cprev-dates {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: .5rem;
  align-items: stretch;
  margin-bottom: .75rem;
}
.sk-cprev-date {
  position: relative;
  display: flex;
  align-items: center;
  gap: .4rem;
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 10px;
  padding: .65rem .7rem;
  min-width: 0;
  cursor: pointer;
}
.sk-cprev-date__ico {
  width: 1.1rem;
  height: 1.1rem;
  color: #94a3b8;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
}
.sk-cprev-date__ico svg { width: 1.05rem; height: 1.05rem; display: block; }
.sk-cprev-date input[type="date"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  border: 0;
}
.sk-cprev-date em {
  font-style: normal;
  font-size: .86rem;
  font-weight: 600;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sk-cprev-filter {
  width: 2.65rem;
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 10px;
  color: #64748b;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}
.sk-cprev-filter svg { width: 1.2rem; height: 1.2rem; display: block; }
.sk-cprev-filter:active { background: #f8fafc; }
.sk-cprev-sum {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
  background: #f3f4f6;
  border-radius: 12px;
  padding: .85rem .55rem;
  margin-bottom: .85rem;
  text-align: center;
}
.sk-cprev-sum small {
  display: block;
  font-size: .72rem;
  color: #94a3b8;
  font-weight: 500;
  margin-bottom: .25rem;
}
.sk-cprev-sum strong {
  font-size: 1rem;
  font-weight: 700;
}
.sk-cprev-sum .is-in { color: var(--sk-pay-ink, #16a34a); }
.sk-cprev-sum .is-out { color: var(--sk-recv-ink, #dc2626); }
.sk-cprev-cols {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: .5rem;
  padding: .35rem .15rem .55rem;
  border-bottom: 1px solid #e8ecf1;
  color: #94a3b8;
  font-size: .8rem;
  font-weight: 500;
}
.sk-cprev-cols span:nth-child(2),
.sk-cprev-cols span:nth-child(3) { text-align: right; }
.sk-cprev-list { padding: .1rem 0 0; }
.sk-cprev-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: .5rem;
  align-items: center;
  padding: .85rem .15rem;
  border-bottom: 1px solid #f1f5f9;
  font-size: .9rem;
}
.sk-cprev-row__date { color: #0f172a; font-weight: 500; }
.sk-cprev-row__hand,
.sk-cprev-row__bal {
  text-align: right;
  font-weight: 700;
  color: var(--sk-pay-ink, #16a34a);
}
.sk-cprev-foot {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: .75rem 1.1rem calc(.9rem + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 24%, #fff 100%);
  display: flex;
  justify-content: center;
  z-index: 5;
}
.sk-cprev-dl {
  width: min(100%, 24rem);
  border: 0;
  border-radius: 999px;
  background: #111;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: .95rem 1.2rem;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .16);
}
.sk-cprev-dl:active { transform: scale(.985); }
.sk-sheet--cpf .sk-cpf-sheet {
  max-height: min(60vh, 420px);
  padding-bottom: calc(.75rem + env(safe-area-inset-bottom, 0px));
}
.sk-cpf-title {
  margin: .1rem 0 .55rem;
  text-align: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: #111;
}
.sk-cpf-list { display: flex; flex-direction: column; }
.sk-cpf-opt {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #f1f5f9;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: 1rem .35rem;
  font: inherit;
  font-size: 1rem;
  font-weight: 500;
  color: #0f172a;
  cursor: pointer;
  text-align: left;
}
.sk-cpf-opt:last-child { border-bottom: 0; }
.sk-cpf-opt.is-on {
  background: #eff6ff;
  color: #0f172a;
  margin: 0 -.5rem;
  padding-left: .85rem;
  padding-right: .85rem;
  border-radius: 10px;
  border-bottom-color: transparent;
}
.sk-cpf-opt__check {
  width: 1.25rem;
  height: 1.25rem;
  color: #2563eb;
  display: grid;
  place-items: center;
}
.sk-cpf-opt__check svg { width: 1.15rem; height: 1.15rem; display: block; }

/* Rate KB Smart Khata bottom sheet */
.sk-sheet--rate {
  z-index: 90;
}
.sk-sheet--rate .sk-rate-sheet {
  padding: .55rem 1.25rem calc(1.15rem + env(safe-area-inset-bottom, 0px));
  transition: transform .2s ease-out, padding-bottom .2s ease-out;
}
html.sk-rate-kb .sk-sheet--rate .sk-rate-sheet {
  transform: translateY(calc(-1 * var(--sk-kb-pad, 0px)));
  padding-bottom: calc(1.15rem + env(safe-area-inset-bottom, 0px));
}
.sk-rate-title {
  margin: .15rem 0 .35rem;
  text-align: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: #111;
  letter-spacing: -.01em;
}
.sk-rate-sub {
  margin: 0 0 1rem;
  text-align: center;
  font-size: .95rem;
  font-weight: 400;
  color: #64748b;
  line-height: 1.35;
}
.sk-rate-stars {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  margin: 0 0 .85rem;
}
.sk-rate-star {
  border: 0;
  background: transparent;
  padding: .2rem;
  margin: 0;
  cursor: pointer;
  line-height: 0;
  -webkit-tap-highlight-color: transparent;
}
.sk-rate-star svg {
  display: block;
  transition: transform .12s ease;
}
.sk-rate-star:active svg {
  transform: scale(.92);
}
.sk-rate-star.is-on svg {
  filter: drop-shadow(0 1px 2px rgba(245, 197, 24, .35));
}
.sk-rate-fb {
  margin: .25rem 0 .85rem;
  padding: 0 .15rem;
}
.sk-rate-input {
  width: 100%;
  border: 0;
  border-bottom: 1.5px solid #cbd5e1;
  border-radius: 0;
  background: transparent;
  padding: .55rem .1rem .45rem;
  font: inherit;
  font-size: 1rem;
  color: #0f172a;
  outline: none;
}
.sk-rate-input::placeholder {
  color: #94a3b8;
}
.sk-rate-input:focus {
  border-bottom-color: #0f172a;
}
.sk-rate-err {
  margin: 0 0 .65rem;
  text-align: center;
  font-size: .85rem;
}
.sk-rate-send {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 999px;
  background: #0f172a;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .95rem 1.2rem;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .16);
}
.sk-rate-send:active { transform: scale(.985); }
.sk-rate-send:disabled {
  opacity: .65;
  cursor: wait;
}

/* Business name bottom sheet */
.sk-sheet--bizname { z-index: 90; }
.sk-sheet--bizname .sk-bizname-sheet {
  padding: .55rem 1.25rem calc(1.15rem + env(safe-area-inset-bottom, 0px));
}
.sk-bizname-title {
  margin: .15rem 0 1.1rem;
  text-align: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: #111;
  letter-spacing: -.01em;
}
.sk-bizname-field {
  display: block;
  margin: 0 0 1.35rem;
  padding: 0 .1rem;
}
.sk-bizname-lab {
  display: block;
  font-size: .78rem;
  font-weight: 500;
  color: #94a3b8;
  margin-bottom: .2rem;
}
.sk-bizname-input {
  width: 100%;
  border: 0;
  border-bottom: 1.5px solid #cbd5e1;
  border-radius: 0;
  background: transparent;
  padding: .35rem .1rem .5rem;
  font: inherit;
  font-size: 1.05rem;
  color: #0f172a;
  outline: none;
}
.sk-bizname-input:focus { border-bottom-color: #0f172a; }
.sk-bizname-save {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 999px;
  background: #0f172a;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .95rem 1.2rem;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .16);
}
.sk-bizname-save:active { transform: scale(.985); }
.sk-bizname-save:disabled { opacity: .65; cursor: wait; }

/* Business type picker screen */
.sk-btype {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background: #fff;
}
.sk-btype-top {
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: .55rem .85rem .25rem;
  flex: 0 0 auto;
}
.sk-btype-title {
  margin: 0;
  flex: 1 1 auto;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.35rem;
  font-weight: 700;
  color: #111;
  letter-spacing: -.01em;
}
.sk-btype-search {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin: .35rem .85rem 0;
  padding: .55rem .15rem .7rem;
  border-bottom: 1px solid #e8ecf4;
  flex: 0 0 auto;
}
.sk-btype-search__ico {
  color: #94a3b8;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
}
.sk-btype-search__input {
  flex: 1 1 auto;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: .98rem;
  color: #0f172a;
  outline: none;
  min-width: 0;
}
.sk-btype-search__input::placeholder { color: #94a3b8; }
.sk-btype-list {
  flex: 1 1 auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 0 .5rem;
  min-height: 0;
}
.sk-btype-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #f1f5f9;
  background: transparent;
  text-align: left;
  padding: .95rem 1rem;
  font: inherit;
  font-size: .95rem;
  font-weight: 500;
  color: #0f172a;
  cursor: pointer;
}
.sk-btype-row.is-on { background: #f1f5f9; }
.sk-btype-row__lab { flex: 1 1 auto; min-width: 0; }
.sk-btype-row__check {
  flex: 0 0 auto;
  color: #0f172a;
  display: grid;
  place-items: center;
}
.sk-btype-empty {
  padding: 2rem 1rem;
  text-align: center;
  color: #94a3b8;
  font-size: .9rem;
}
.sk-btype-foot {
  flex: 0 0 auto;
  padding: .75rem 1rem calc(.85rem + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid #f1f5f9;
}
.sk-btype-save {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 999px;
  background: #0f172a;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .95rem 1.2rem;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .16);
}
.sk-btype-save:active { transform: scale(.985); }
.sk-btype-save:disabled { opacity: .65; cursor: wait; }

/* App settings help / how-to */
.sk-aset {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background: #f8fafc;
}
.sk-aset-top {
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: .55rem .85rem .35rem;
  background: #fff;
  border-bottom: 1px solid #eef2f7;
  flex: 0 0 auto;
}
.sk-aset-title {
  margin: 0;
  flex: 1 1 auto;
  font-size: 1.15rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-aset-body {
  flex: 1 1 auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: .85rem .85rem calc(1.25rem + env(safe-area-inset-bottom, 0px));
  min-height: 0;
}
.sk-aset-lead {
  margin: 0 0 .9rem;
  font-size: .92rem;
  line-height: 1.45;
  color: #475569;
}
.sk-aset-card {
  background: #fff;
  border: 1px solid #e8ecf4;
  border-radius: 16px;
  padding: .9rem .85rem 1rem;
  margin-bottom: .85rem;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.sk-aset-step {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .45rem;
}
.sk-aset-step span {
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 999px;
  background: #0f172a;
  color: #fff;
  font-size: .78rem;
  font-weight: 700;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
}
.sk-aset-step strong {
  font-size: .98rem;
  color: #0f172a;
}
.sk-aset-txt {
  margin: 0 0 .7rem;
  font-size: .88rem;
  line-height: 1.45;
  color: #64748b;
}
.sk-aset-fig {
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  background: #f1f5f9;
}
.sk-aset-fig img {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: top;
}
.sk-aset-fig--drawer {
  max-width: 280px;
  margin-left: auto;
  margin-right: auto;
}
.sk-aset-list {
  margin: .75rem 0 0;
  padding: 0 0 0 1.1rem;
  color: #334155;
  font-size: .86rem;
  line-height: 1.55;
}
.sk-aset-list li { margin: .15rem 0; }
.sk-aset-card--tips { background: #fffbeb; border-color: #fde68a; }
.sk-aset-tips-title {
  display: block;
  margin-bottom: .45rem;
  font-size: .95rem;
  color: #92400e;
}
.sk-aset-ol {
  margin: 0;
  padding: 0 0 0 1.15rem;
  color: #78350f;
  font-size: .88rem;
  line-height: 1.5;
}
.sk-aset-ol li { margin: .35rem 0; }
.sk-aset-cta {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 999px;
  background: #0f172a;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  padding: .95rem 1.2rem;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .16);
  margin-top: .25rem;
}
.sk-aset-cta:active { transform: scale(.985); }

/* Deleted items recycle bin */
.sk-del {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background: #fff;
}
.sk-del-top {
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: .55rem .85rem .35rem;
  flex: 0 0 auto;
  position: relative;
  z-index: 5;
}
.sk-del-title {
  margin: 0;
  flex: 1 1 auto;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.35rem;
  font-weight: 700;
  color: #111;
  letter-spacing: -.01em;
}
.sk-del-more {
  position: relative;
  flex: 0 0 auto;
  margin-left: auto;
}
.sk-del-dots {
  color: #334155;
}
.sk-del-dd {
  position: absolute;
  top: calc(100% + .2rem);
  right: 0;
  min-width: 11.5rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .14);
  padding: .35rem 0;
  z-index: 20;
  overflow: hidden;
}
.sk-del-dd__item {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  padding: .7rem .95rem;
  font: inherit;
  font-size: .9rem;
  font-weight: 500;
  color: #0f172a;
  cursor: pointer;
}
.sk-del-dd__item:active { background: #f8fafc; }
.sk-del-check {
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  border: 1.5px solid #cbd5e1;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  font-size: .75rem;
  font-weight: 700;
  color: #fff;
  background: transparent;
}
.sk-del-check.is-on {
  background: #0f172a;
  border-color: #0f172a;
}
.sk-del-row.is-checked { background: #f8fafc; }
.sk-del-foot {
  flex: 0 0 auto;
  padding: .75rem 1rem calc(.85rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #f1f5f9;
  background: #fff;
}
.sk-del-purge {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 999px;
  background: #b91c1c;
  color: #fff;
  font: inherit;
  font-size: .92rem;
  font-weight: 700;
  padding: .9rem 1.1rem;
  cursor: pointer;
}
.sk-del-purge:disabled {
  opacity: .5;
  cursor: not-allowed;
}
.sk-app.sk-rtl .sk-del-more { margin-left: 0; margin-right: auto; }
.sk-app.sk-rtl .sk-del-dd { right: auto; left: 0; }
.sk-app.sk-rtl .sk-del-dd__item { text-align: right; }
.sk-del-body {
  flex: 1 1 auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: .35rem 0 calc(1rem + env(safe-area-inset-bottom, 0px));
  min-height: 0;
}
.sk-del-banner {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin: .35rem .85rem .85rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  background: #eef4ff;
}
.sk-del-banner__txt {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .2rem;
}
.sk-del-banner__txt strong {
  font-size: .98rem;
  color: #1e3a5f;
}
.sk-del-banner__txt span {
  font-size: .82rem;
  color: #64748b;
  line-height: 1.35;
}
.sk-del-banner__art {
  flex: 0 0 auto;
  width: 3.4rem;
  height: 3.4rem;
}
.sk-del-banner__art svg { width: 100%; height: 100%; display: block; }
.sk-del-sec {
  padding: .15rem 1rem .45rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: #94a3b8;
  text-transform: uppercase;
}
.sk-del-list { padding: 0; }
.sk-del-row {
  display: flex;
  align-items: center;
  gap: .75rem;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #f1f5f9;
  background: transparent;
  text-align: left;
  padding: .85rem 1rem;
  font: inherit;
  cursor: pointer;
}
.sk-del-row:active { background: #f8fafc; }
.sk-del-row__ico {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 999px;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  background: #f1f5f9;
  color: #64748b;
}
.sk-del-row__ico svg { width: 1.15rem; height: 1.15rem; display: block; }
.sk-del-row__letter {
  font-size: .95rem;
  font-weight: 700;
  color: #334155;
}
.sk-del-row__txt {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .12rem;
}
.sk-del-row__title {
  font-size: .98rem;
  font-weight: 600;
  color: #0f172a;
}
.sk-del-row__title--in { color: #16a34a; }
.sk-del-row__title--out { color: #dc2626; }
.sk-del-row__title--party { color: #0f172a; }
.sk-del-row__sub {
  font-size: .78rem;
  color: #94a3b8;
}
.sk-del-empty {
  padding: 2.5rem 1rem;
  text-align: center;
  color: #94a3b8;
  font-size: .92rem;
}

/* Recover entry popup */
.sk-sheet--recover { z-index: 95; }
.sk-recover-panel {
  padding: 1.15rem 1.25rem calc(1.1rem + env(safe-area-inset-bottom, 0px));
  text-align: center;
}
.sk-recover-title {
  margin: .15rem 0 .55rem;
  font-size: 1.2rem;
  font-weight: 700;
  color: #0f172a;
}
.sk-recover-text {
  margin: 0 0 1.15rem;
  font-size: .95rem;
  line-height: 1.4;
  color: #334155;
}
.sk-recover-ok {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 999px;
  background: #0f172a;
  color: #fff;
  font: inherit;
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .95rem 1.2rem;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .16);
}
.sk-recover-ok:active { transform: scale(.985); }
.sk-recover-ok:disabled { opacity: .65; cursor: wait; }
.sk-recover-cancel {
  display: block;
  width: 100%;
  margin-top: .65rem;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: .92rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: #0f172a;
  padding: .55rem;
  cursor: pointer;
}
.sk-app.sk-rtl .sk-del-title,
.sk-app.sk-rtl .sk-del-banner__txt,
.sk-app.sk-rtl .sk-del-sec,
.sk-app.sk-rtl .sk-del-row,
.sk-app.sk-rtl .sk-recover-title,
.sk-app.sk-rtl .sk-recover-text { text-align: right; }
.sk-app.sk-rtl .sk-del-row { direction: rtl; }

.sk-app.sk-rtl .sk-aset-title,
.sk-app.sk-rtl .sk-aset-lead,
.sk-app.sk-rtl .sk-aset-txt,
.sk-app.sk-rtl .sk-aset-tips-title,
.sk-app.sk-rtl .sk-aset-list,
.sk-app.sk-rtl .sk-aset-ol { text-align: right; }
.sk-app.sk-rtl .sk-aset-list,
.sk-app.sk-rtl .sk-aset-ol { padding-left: 0; padding-right: 1.15rem; }
.sk-app.sk-rtl .sk-aset-step { flex-direction: row-reverse; }

/* Cashbook — Backup Information */
.sk-cback {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  height: 100%;
  background: #fff;
  overflow: hidden;
}
.sk-cback-top {
  display: flex;
  align-items: center;
  gap: .25rem;
  padding: .65rem .75rem .45rem;
  flex: 0 0 auto;
  background: #fff;
}
.sk-cback-back {
  width: 2.35rem;
  height: 2.35rem;
  border: 0;
  background: transparent;
  color: #111;
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
  border-radius: 999px;
  flex: 0 0 auto;
}
.sk-cback-back svg { width: 1.35rem; height: 1.35rem; }
.sk-cback-title {
  margin: 0;
  flex: 1 1 auto;
  text-align: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.28rem;
  font-weight: 600;
  color: #111;
  padding-right: 2.35rem;
}
.sk-cback-banner {
  display: flex;
  align-items: center;
  gap: .85rem;
  padding: 1rem 1.1rem;
  background: #e8f7ef;
  flex: 0 0 auto;
}
.sk-cback-banner__ico {
  width: 2.1rem;
  height: 2.1rem;
  color: #64748b;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}
.sk-cback-banner__ico svg { width: 1.55rem; height: 1.55rem; display: block; }
.sk-cback-banner__txt {
  display: flex;
  flex-direction: column;
  gap: .12rem;
  min-width: 0;
}
.sk-cback-banner__txt small {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: #94a3b8;
}
.sk-cback-banner__txt strong {
  font-size: 1.02rem;
  font-weight: 600;
  color: #334155;
}
.sk-cback-banner__txt em {
  font-style: normal;
  font-size: .82rem;
  color: #94a3b8;
}
.sk-pad--cback {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 1.15rem 1.25rem 1.5rem;
  background: #fff;
  display: flex;
  flex-direction: column;
}
.sk-cback-copy {
  margin: 0;
  font-size: .95rem;
  line-height: 1.55;
  color: #64748b;
  font-weight: 400;
}
.sk-cback-copy--mob {
  margin-top: .85rem;
  padding: .75rem .85rem;
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #eef2f7;
  font-size: .88rem;
  color: #475569;
}
.sk-cback-hero {
  margin-top: auto;
  padding: 2.2rem 0 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: .75rem;
}
.sk-cback-logo {
  width: min(58vw, 11.5rem);
  height: min(58vw, 11.5rem);
  object-fit: contain;
  border-radius: 28px;
  background: #f8fafc;
  box-shadow: 0 16px 40px rgba(15, 23, 42, .12);
  padding: .85rem;
}
.sk-cback-brand {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.2rem;
  font-weight: 600;
  color: #0f172a;
}
.sk-cback-tag {
  font-size: .85rem;
  color: #94a3b8;
  max-width: 16rem;
  line-height: 1.4;
}

/* —— App RTL (Urdu / Sindhi) vs LTR (English / Roman Urdu) —— */
.sk-app.sk-rtl,
.sk-app.sk-rtl .sk-screen,
.sk-app.sk-rtl .sk-pad {
  direction: rtl;
}
.sk-app:not(.sk-rtl) {
  direction: ltr;
}

/* Home header (Urdu/Sindhi): same 1-row bar as English, mirrored
   DOM = logo | brand | icons  →  visual = icons | brand | logo */
.sk-app.sk-rtl .sk-home-top {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: .55rem;
  direction: ltr; /* isolate from parent rtl — row-reverse does the mirror */
}
.sk-app.sk-rtl .sk-home-user,
.sk-app.sk-rtl .sk-home-top__right {
  flex: 0 0 auto;
}
.sk-app.sk-rtl .sk-home-brand {
  flex: 1 1 auto;
  min-width: 0;
}
.sk-app.sk-rtl .sk-home-brand--left {
  align-items: flex-end;
  text-align: right;
}
.sk-app.sk-rtl .sk-home-brand strong,
.sk-app.sk-rtl .sk-home-brand small {
  text-align: right;
  width: 100%;
}
.sk-app.sk-rtl .sk-home-searchrow {
  direction: rtl;
}
.sk-app.sk-rtl .sk-home-search input,
.sk-app.sk-rtl .sk-home-section,
.sk-app.sk-rtl .sk-home-cust__name,
.sk-app.sk-rtl .sk-home-cust__sub,
.sk-app.sk-rtl .sk-home-card small {
  text-align: right;
}
/* Full-width CTA buttons stay centered in RTL (same as English) */
.sk-app.sk-rtl .sk-home-add,
.sk-app.sk-rtl .sk-btn,
.sk-app.sk-rtl .sk-btn.ghost,
.sk-app.sk-rtl .sk-rate-send,
.sk-app.sk-rtl .sk-th-ok,
.sk-app.sk-rtl .sk-mif-save,
.sk-app.sk-rtl .sk-acc-legal__btn,
.sk-app.sk-rtl .sk-acc-wa {
  text-align: center !important;
  justify-content: center;
}
.sk-app.sk-rtl .sk-home-cust {
  direction: rtl;
}
.sk-app.sk-rtl .sk-home-cust__bal {
  direction: ltr;
  unicode-bidi: plaintext;
  text-align: left;
}
.sk-app.sk-rtl .sk-home-card strong {
  direction: ltr;
  unicode-bidi: plaintext;
  text-align: right;
  display: block;
}

/* Drawer from right; icon on right, label RTL */
.sk-app.sk-rtl .sk-drawer-overlay {
  justify-content: flex-end;
  direction: ltr; /* overlay itself stays physical so drawer docks right */
}
.sk-app.sk-rtl .sk-drawer {
  direction: rtl;
  box-shadow: -8px 0 28px rgba(11, 31, 58, .2);
  animation: skDrawerInRtl .22s ease-out;
}
@keyframes skDrawerInRtl {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}
.sk-app.sk-rtl .sk-drawer__item {
  flex-direction: row;
  text-align: right;
  direction: rtl;
}
.sk-app.sk-rtl .sk-drawer__label {
  text-align: right;
}
.sk-app.sk-rtl .sk-drawer__chev {
  transform: scaleX(-1);
}
.sk-app.sk-rtl .sk-drawer__foot {
  justify-content: flex-end;
}
.sk-app.sk-rtl .sk-drawer__lang-opt {
  text-align: right;
  direction: rtl;
}
.sk-app.sk-rtl .sk-drawer__lang-opt.is-rtl span:first-child,
.sk-drawer__lang-opt.is-rtl span:first-child {
  font-family: "Noto Nastaliq Urdu", "Segoe UI", Tahoma, sans-serif;
}

.sk-app.sk-rtl .sk-h-top__back svg,
.sk-app.sk-rtl .sk-pd-iconbtn svg,
.sk-app.sk-rtl .sk-about-top .sk-pd-iconbtn svg {
  transform: scaleX(-1);
}

/* Account / Sales / menus */
.sk-app.sk-rtl .sk-acc,
.sk-app.sk-rtl .sk-acc-profile,
.sk-app.sk-rtl .sk-acc-menu__item,
.sk-app.sk-rtl .sk-profile-row,
.sk-app.sk-rtl .sk-about-link {
  text-align: right;
}
.sk-app.sk-rtl .sk-acc-menu__item {
  direction: rtl;
}
.sk-app.sk-rtl .sk-acc-menu__item--toggle .sk-acc-menu__lab,
.sk-app.sk-rtl .sk-acc-menu__sub {
  text-align: right;
}
.sk-app.sk-rtl .sk-acc-menu__sub-val { text-align: left; }
.sk-app.sk-rtl .sk-btype-title { text-align: right; }
.sk-app.sk-rtl .sk-btype-row { text-align: right; direction: rtl; }
.sk-app.sk-rtl .sk-bizname-title,
.sk-app.sk-rtl .sk-bizname-lab,
.sk-app.sk-rtl .sk-bizname-input { text-align: right; }
.sk-app.sk-rtl .sk-acc-menu__dd {
  margin-left: 0;
  margin-right: 2rem;
  border-left: 0;
  border-right: 2px solid #e2e8f0;
}
.sk-app.sk-rtl .sk-acc-profile__txt,
.sk-app.sk-rtl .sk-acc-menu__item span:last-child,
.sk-app.sk-rtl .sk-label,
.sk-app.sk-rtl .sk-title,
.sk-app.sk-rtl .sk-about-title,
.sk-app.sk-rtl .sk-filter-title,
.sk-app.sk-rtl .sk-legal-body,
.sk-app.sk-rtl .sk-legal-body p,
.sk-app.sk-rtl .sk-legal-body h3,
.sk-app.sk-rtl .sk-acc-biz,
.sk-app.sk-rtl .sk-h-biz,
.sk-app.sk-rtl .sk-acc-ver,
.sk-app.sk-rtl .sk-acc-act span:last-child {
  text-align: right;
}
.sk-app.sk-rtl .sk-legal-body {
  direction: rtl;
}
.sk-app.sk-rtl .sk-input,
.sk-app.sk-rtl .sk-rate-input,
.sk-app.sk-rtl textarea.sk-input,
.sk-app.sk-rtl .sk-searchbar__input {
  text-align: right;
}
.sk-app.sk-rtl .sk-acc-profile__txt span,
.sk-app.sk-rtl .sk-drawer__phone,
.sk-app.sk-rtl input[inputmode="tel"],
.sk-app.sk-rtl input[inputmode="numeric"],
.sk-app.sk-rtl input[inputmode="decimal"] {
  direction: ltr;
  unicode-bidi: plaintext;
  text-align: left;
}
.sk-app.sk-rtl .sk-tabbar {
  direction: rtl;
}
.sk-app.sk-rtl .sk-tabbar button {
  direction: rtl;
}