*
{
  box-sizing:border-box
}

:root
{
  --brand-red:#ed1c24;
  --brand-red-soft:#ff6369;
  --brand-blue:#0b4ea2;
  --brand-blue-deep:#051a3a;
  --lao-red:#ce1126;
  --lao-blue:#002868;
  --deposit-green:#118943;
  --deposit-green-soft:#15a54f;
  --withdraw-red:#f04f5e;
  --withdraw-red-soft:#ff7985;
  --white:#ffffff;
  --ink:#101828;
  --muted:#d0d7e2;
  --line:#d8dfeb;
}

html,body
{
  margin:0;
  padding:0
}

body
{
  font-family:Arial,"Noto Sans Lao",sans-serif;
  color:var(--white)
}

a
{
  text-decoration:none;
  color:inherit
}

/* ===== PUBLIC ===== */
.public-body
{
  min-height:100svh;
  background:     linear-gradient(rgba(3,12,30,.48), rgba(3,12,30,.56)),     url("/assets/exchange-bg-reference.webp") center/cover no-repeat,     linear-gradient(180deg,#06224b,#04152c);
}

.topbar
{
  height:74px;
  display:flex;
  align-items:center;
  padding:14px 16px;
}

.brand img
{
  display:block;
  width:min(210px,54vw);
  max-height:44px;
  object-fit:contain;
}

.mobile-screen
{
  min-height:calc(100svh - 74px);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:4px 12px 14px;
}

.screen-panel
{
  position:relative;
  width:min(440px,100%);
  min-height:calc(100svh - 92px);
  padding:12px 14px 14px;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(4,16,40,.74),rgba(3,12,28,.86));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 50px rgba(0,0,0,.24);
  display:flex;
  flex-direction:column;
  gap:10px;
  overflow:hidden;
}

.screen-overlay
{
  position:absolute;
  inset:0;
  background:     linear-gradient(180deg,rgba(255,255,255,.05),transparent 18%,transparent 82%,rgba(255,255,255,.04)),     radial-gradient(circle at top right,rgba(42,208,230,.18),transparent 26%),     radial-gradient(circle at top left,rgba(237,28,36,.16),transparent 18%);
  pointer-events:none;
}

.page-title-box, .bank-stack, .rates-stack, .note-panel, .time-panel, .status
{
  position:relative;
  z-index:1
}

.page-title-box
{
  text-align:center;
  padding:6px 8px 10px;
}

.mini-title
{
  margin:0 0 6px;
  letter-spacing:.16em;
  font-size:10px;
  font-weight:700;
  color:rgba(255,255,255,.82);
}

.page-title-box h1
{
  margin:0;
  font-size:clamp(23px,6vw,34px);
  line-height:1.05;
  font-weight:800;
}

.subtitle
{
  margin:6px 0 0;
  font-size:clamp(14px,3.6vw,18px);
  color:rgba(255,255,255,.9);
  font-weight:700;
}

.bank-stack
{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.bank-panel
{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:94px;
  padding:12px 14px;
  background:rgba(3,18,47,.76);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

.bank-panel + .bank-panel
{
  border-top:1px solid rgba(255,255,255,.16);
}

.bank-details
{
  flex:1;
  min-width:0;
  text-align:center;
}

.bank-account-name
{
  margin:0;
  font-size:clamp(13px,3.5vw,18px);
  font-weight:800;
  line-height:1.2;
  color:#fff;
}

.bank-account-number
{
  margin:4px 0;
  font-size:clamp(12px,3.4vw,17px);
  font-weight:800;
  line-height:1.15;
  color:#fff;
}

.bank-name
{
  margin:0;
  font-size:clamp(12px,3vw,16px);
  line-height:1.22;
  color:rgba(255,255,255,.92);
}

.bank-logo-wrap
{
  width:70px;
  height:70px;
  border-radius:50%;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px;
  border:4px solid rgba(255,255,255,.18);
  flex:0 0 70px;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}

.bank-logo
{
  width:100%;
  height:100%;
  object-fit:contain;
}

.bank-logo-fallback
{
  color:var(--brand-blue);
  font-weight:900;
  font-size:28px;
}

.rates-stack
{
  display:flex;
  flex-direction:column;
  gap:0;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 12px 24px rgba(0,0,0,.18);
}

.rate-strip
{
  min-height:66px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 18px;
}

.deposit-strip
{
  background:linear-gradient(135deg,var(--deposit-green),var(--deposit-green-soft));
}

.withdraw-strip
{
  background:linear-gradient(135deg,var(--withdraw-red),var(--withdraw-red-soft));
}

.rate-strip-label
{
  font-size:clamp(16px,4.4vw,22px);
  font-weight:800;
  color:#fff;
}

.rate-strip-value
{
  display:flex;
  align-items:baseline;
  gap:8px;
  font-size:clamp(18px,5vw,28px);
  line-height:1;
  color:#fff;
}

.rate-strip-value small
{
  font-size:clamp(14px,3.5vw,18px);
  font-weight:800;
}

.note-panel
{
  padding:14px 16px;
  border-radius:18px;
  background:rgba(5,24,58,.82);
  border:1px solid rgba(255,255,255,.12);
  text-align:center;
}

.note-panel[hidden]
{
  display:none
}

.note-label
{
  margin:0 0 6px;
  font-style:italic;
  font-size:clamp(16px,4vw,20px);
  color:rgba(255,255,255,.88);
}

.note-text
{
  margin:0;
  font-style:italic;
  line-height:1.42;
  font-size:clamp(13px,3.5vw,18px);
  color:#fff;
}

.time-panel
{
  margin-top:auto;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(5,24,58,.76);
  border:1px solid rgba(255,255,255,.12);
  text-align:center;
}

.time-panel span
{
  display:block;
  font-size:clamp(16px,4vw,22px);
  color:#fff;
}

.time-panel strong
{
  display:block;
  margin-top:8px;
  font-size:clamp(18px,4.8vw,30px);
  color:#fff;
  line-height:1.15;
}

.status
{
  text-align:center;
  color:#ffd6da;
  font-size:13px;
  min-height:16px;
}

/* ===== ADMIN (kept working) ===== */
.admin-page
{
  max-width:860px;
  color:#101828
}

.page
{
  width:min(1080px,calc(100% - 32px));
  margin:0 auto;
  padding:64px 0
}

.card
{
  background:#fff;
  border:1px solid rgba(11,78,162,.10);
  border-radius:20px;
  box-shadow:0 14px 40px rgba(6,27,60,.08);
  padding:28px
}

.hero
{
  text-align:center;
  margin-bottom:36px
}

.admin-hero
{
  text-align:left
}

.hero h1
{
  font-size:clamp(32px,6vw,54px);
  margin:8px 0;
  color:#0b254f
}

.admin-form
{
  display:grid;
  gap:18px
}

.form-section h2
{
  margin-top:0;
  color:#082b5f
}

.form-section label
{
  display:grid;
  gap:7px;
  margin:14px 0;
  font-weight:700;
  font-size:14px;
  color:#101828
}

.form-section input,.form-section textarea
{
  width:100%;
  border:1px solid #d8dce2;
  border-radius:10px;
  padding:12px 13px;
  font:inherit;
  font-weight:400;
  background:#fff;
  color:#111
}

.form-section input:focus,.form-section textarea:focus
{
  outline:2px solid rgba(11,78,162,.18);
  border-color:#0b4ea2
}

.form-section .check
{
  display:flex;
  grid-template-columns:none;
  align-items:center;
  gap:9px
}

.form-section .check input
{
  width:auto
}

.two-col
{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 16px
}

.save-bar
{
  position:sticky;
  bottom:12px;
  background:rgba(255,255,255,.95);
  border:1px solid #e1e4e8;
  border-radius:14px;
  padding:12px;
  display:flex;
  align-items:center;
  gap:14px;
  box-shadow:0 8px 28px rgba(19,25,35,.10);
  color:#101828
}

button
{
  border:0;
  border-radius:10px;
  padding:12px 20px;
  font-weight:700;
  cursor:pointer;
  background:linear-gradient(135deg,#082b5f,#0b4ea2);
  color:#fff
}

@media(max-width:760px)
{
  .page
  {
    width:min(100% - 20px,1080px);
    padding-top:28px
  }
  .topbar
  {
    height:66px;
    padding:12px 14px
  }
  .brand img
  {
    width:min(170px,52vw);
    max-height:34px
  }
  .mobile-screen
  {
    padding:2px 10px 10px
  }
  .screen-panel
  {
    min-height:calc(100svh - 78px);
    padding:10px 10px 12px;
    border-radius:20px
  }
  .bank-panel
  {
    padding:10px 10px;
    min-height:88px
  }
  .bank-logo-wrap
  {
    width:60px;
    height:60px;
    flex-basis:60px
  }
  .rate-strip
  {
    min-height:58px;
    padding:12px 14px
  }
  .note-panel
  {
    padding:12px
  }
  .time-panel
  {
    padding:12px
  }
  .two-col
  {
    grid-template-columns:1fr
  }
}

/* Exchange V2: interactive account numbers, QR popover */
.bank-actions
{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  flex:0 0 70px
}

.account-copy
{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  background:transparent;
  border:1px solid transparent;
  padding:3px 4px;
  border-radius:8px;
  cursor:pointer;
  font:inherit;
  color:inherit;
  overflow-wrap:anywhere;
  word-break:break-word;
  max-width:100%;
  margin:3px auto
}

.account-copy:hover,.account-copy:focus-visible
{
  background:#ffffff1f;
  border-color:#ffffff55
}

.copy-glyph
{
  font-size:13px;
  opacity:.76
}

.bank-qr-button
{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border:2px solid #d6e7ff;
  background:#fff;
  color:#084e9a;
  box-shadow:0 5px 15px #0004;
  border-radius:50%;
  cursor:pointer
}

.bank-qr-button:hover,.bank-qr-button:focus-visible
{
  transform:scale(1.05);
  outline:2px solid #69b7ff;
  outline-offset:2px
}

.qr-overlay[hidden]
{
  display:none!important
}

.qr-overlay
{
  position:fixed;
  inset:0;
  z-index:999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px;
  background:#031329b5;
  backdrop-filter:blur(6px)
}

.qr-balloon
{
  width:min(420px,calc(100vw - 24px));
  max-height:calc(100dvh - 24px);
  padding:18px 15px 16px;
  border:1px solid #d2e7ff;
  border-radius:22px;
  background:#fff;
  color:#102844;
  box-shadow:0 20px 70px #0009;
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:center;
  position:relative;
  overflow:auto
}

.qr-balloon h2
{
  margin:0;
  padding:0 26px;
  text-align:center;
  font-size:19px;
  line-height:1.3
}

.qr-balloon img
{
  display:block;
  width:auto;
  max-width:100%;
  max-height:min(65dvh,520px);
  object-fit:contain;
  border-radius:12px
}

.qr-balloon p
{
  margin:0;
  color:#42536a;
  font-weight:700;
  overflow-wrap:anywhere;
  text-align:center
}

.qr-close
{
  position:absolute;
  right:9px;
  top:8px;
  border:0;
  border-radius:50%;
  width:34px;
  height:34px;
  background:#edf3fa;
  color:#173557;
  font-size:24px;
  cursor:pointer
}

.qr-copy
{
  border:0;
  border-radius:10px;
  background:#0b4ea2;
  color:white;
  min-height:42px;
  padding:9px 16px;
  cursor:pointer;
  font-weight:700
}

.qr-open
{
  overflow:hidden
}

/* ============================================================
 EXCHANGE V3 / VISUAL CONTROLS — all public-only; admin unaffected
 Adjust font sizes here and in GUIDE-EXCHANGE-V3-TEXT-SIZES-TH.txt
 ============================================================ */
.public-body
{
  --ex-account-font:clamp(19px,5.2vw,25px);
  /* bank account name AND account number */
  --ex-bank-font:clamp(15px,3.8vw,19px);
  /* bank name, smaller than account name */
  --ex-rate-label-font:clamp(15px,3.8vw,19px);
  --ex-rate-value-font:clamp(23px,6.3vw,33px);
  --ex-qr-size:51px;
}

.public-body .bank-panel
{
  padding:15px 11px;
  min-height:128px;
  gap:7px;
  background:linear-gradient(145deg,rgba(4,22,52,.91),rgba(5,31,73,.84));
  border:1px solid rgba(200,226,255,.24);
  box-shadow:inset 0 1px rgba(255,255,255,.1),0 11px 24px rgba(0,0,0,.17);
}

.public-body .bank-account-name
{
  font-size:var(--ex-account-font);
  font-weight:800;
  line-height:1.27;
  overflow-wrap:anywhere;
}

.public-body .bank-account-number
{
  font-size:var(--ex-account-font);
  font-weight:800;
  line-height:1.25;
}

.public-body .bank-name
{
  font-size:var(--ex-bank-font);
  font-weight:700;
  line-height:1.28;
  margin-top:3px;
  overflow-wrap:anywhere;
  color:#d6e7fb;
}

/* floating copy chip. Keep specificity over original button and .account-copy */
.public-body button.account-copy
{
  display:inline-flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  width:fit-content;
  max-width:100%;
  margin:8px auto 6px;
  padding:9px 13px;
  gap:9px;
  color:#fff;
  background:linear-gradient(140deg,#214d80,#0d2c53);
  border:1px solid rgba(196,227,255,.63);
  border-radius:12px;
  box-shadow:0 7px 0 rgba(0,10,28,.33),0 11px 22px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.15);
  transform:translateY(-2px);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
  white-space:normal;
  word-break:break-word;
}

.public-body button.account-copy:hover, .public-body button.account-copy:focus-visible
{
  transform:translateY(-5px);
  border-color:#fff;
  box-shadow:0 9px 0 rgba(0,10,28,.3),0 15px 27px rgba(0,0,0,.39);
}

.public-body button.account-copy:active
{
  transform:translateY(0);
  box-shadow:0 3px 6px rgba(0,0,0,.4)
}

.public-body .copy-glyph
{
  font-size:.67em;
  line-height:1;
  opacity:.82
}

.public-body .bank-actions
{
  flex:0 0 65px;
  gap:11px
}

.public-body .bank-logo-wrap
{
  width:62px;
  height:62px;
  flex-basis:62px;
  padding:8px;
  border-width:3px
}

.public-body .bank-qr-button
{
  position:relative;
  width:var(--ex-qr-size);
  height:var(--ex-qr-size);
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:2px solid rgba(243,251,255,.94);
  background:linear-gradient(150deg,#49b0ff 0%,#0d62c7 44%,#092957 100%);
  box-shadow:0 5px 0 #03152b,0 10px 20px rgba(0,0,0,.4),inset 0 1px 2px rgba(255,255,255,.52);
  color:#fff;
  cursor:pointer;
  transition:transform .22s ease,box-shadow .22s ease;
  isolation:isolate;
  animation:qr-soft-pulse 3.4s ease-in-out infinite;
}

.public-body .bank-qr-button .qr-glyph
{
  display:block;
  width:26px;
  height:26px;
  transform:translateY(-5px);
  flex-shrink:0
}

.public-body .qr-button-caption
{
  position:absolute;
  left:0;
  right:0;
  bottom:3px;
  text-align:center;
  font:800 8px/1 Arial,sans-serif;
  letter-spacing:.12em;
  color:#f5fbff
}

.public-body .bank-qr-button:hover,.public-body .bank-qr-button:focus-visible
{
  outline:2px solid #a6dbff;
  outline-offset:3px;
  transform:translateY(-3px) scale(1.07);
  box-shadow:0 8px 0 #03152b,0 15px 24px #0007;
  animation-play-state:paused;
}

.public-body .bank-qr-button:active
{
  transform:scale(.95)
}

@keyframes qr-soft-pulse
{
  0%,100%
  {
    box-shadow:0 5px 0 #03152b,0 10px 20px #0006,0 0 0 0 rgba(90,183,255,.2)
  }
  50%
  {
    box-shadow:0 5px 0 #03152b,0 10px 20px #0006,0 0 0 7px rgba(90,183,255,0)
  }
}

/* Independent rate cards (green deposit and light red withdraw preserved) */
.public-body .rates-stack
{
  display:grid;
  gap:12px;
  border-radius:0;
  overflow:visible;
  box-shadow:none
}

.public-body .rate-strip
{
  position:relative;
  min-height:76px;
  padding:14px 17px;
  gap:12px;
  border-radius:17px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.33);
  box-shadow:0 8px 0 rgba(0,9,24,.22),0 17px 28px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.19);
  animation:rate-enter .55s both;
  transition:transform .2s,box-shadow .2s;
}

.public-body .withdraw-strip
{
  animation-delay:.13s
}

.public-body .rate-strip:before
{
  content:"";
  position:absolute;
  inset:0;
  width:42%;
  transform:translateX(-140%) skewX(-24deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
  animation:rate-shine 5.7s ease-in-out 1.4s infinite;
  pointer-events:none;
}

.public-body .rate-strip:hover
{
  transform:translateY(-3px);
  box-shadow:0 11px 0 rgba(0,9,24,.16),0 21px 31px #0005
}

.public-body .rate-strip-label
{
  font-size:var(--ex-rate-label-font);
  line-height:1.2
}

.public-body .rate-strip-value
{
  font-size:var(--ex-rate-value-font);
  line-height:1.1;
  flex-wrap:wrap;
  justify-content:flex-end;
  overflow-wrap:anywhere;
  min-width:0
}

.public-body .rate-strip-value small
{
  font-size:.54em
}

@keyframes rate-enter
{
  from
  {
    opacity:0;
    transform:translateY(15px) scale(.98)
  }
  to
  {
    opacity:1;
    transform:translateY(0) scale(1)
  }
}

@keyframes rate-shine
{
  0%,70%,100%
  {
    transform:translateX(-140%) skewX(-24deg)
  }
  88%
  {
    transform:translateX(450%) skewX(-24deg)
  }
}

/* QR overlay: responsive image + save-photo action */
.public-body .qr-balloon
{
  max-width:calc(100vw - 24px);
  max-height:calc(100dvh - 24px);
  gap:11px
}

.public-body .qr-balloon img
{
  max-width:100%;
  width:auto;
  max-height:min(62dvh,480px);
  object-fit:contain
}

.public-body .qr-save
{
  width:100%;
  min-height:48px;
  border-radius:12px;
  background:linear-gradient(135deg,#0b63bf,#06418b);
  color:#fff;
  font-weight:800;
  box-shadow:0 6px 17px #083a7a36
}

.public-body .qr-save:disabled
{
  opacity:.66;
  cursor:wait
}

.public-body .qr-hint
{
  margin:0;
  min-height:0;
  font-size:12px;
  font-weight:400;
  color:#586b7d
}

@media(max-width:420px)
{
  .public-body .screen-panel
  {
    padding:10px 9px 13px
  }
  .public-body .bank-panel
  {
    padding:12px 8px
  }
  .public-body .bank-actions
  {
    flex-basis:55px
  }
  .public-body .bank-logo-wrap
  {
    width:55px;
    height:55px;
    flex-basis:55px
  }
  .public-body .rate-strip
  {
    padding:13px 12px;
    gap:8px
  }
}

@media(prefers-reduced-motion:reduce)
{
  .public-body .bank-qr-button,.public-body .rate-strip,.public-body .rate-strip:before
  {
    animation:none!important;
    transition:none!important
  }
}

/* STP Laos Exchange V2 — admin AUTO/MANUAL management */
.rate-control h3
{
  margin:18px 0 10px
}

.rate-helper
{
  font-size:13px;
  line-height:1.6;
  color:#64748b;
  overflow-wrap:anywhere
}

.rate-error-alert[hidden],.rate-pending-alert[hidden]
{
  display:none!important
}

.rate-error-alert
{
  background:#fff0f0;
  border:3px solid #c91d1d;
  border-radius:14px;
  color:#b00020;
  padding:18px;
  margin:15px 0;
  box-shadow:0 0 0 2px rgba(220,38,38,.10)
}

.rate-error-alert strong
{
  display:block;
  font-size:clamp(25px,5vw,37px);
  line-height:1.2;
  color:#c91d1d;
  font-weight:900
}

.rate-error-alert p
{
  font-size:15px;
  font-weight:700;
  color:#b91c1c;
  margin:9px 0 0;
  overflow-wrap:anywhere
}

.rate-pending-alert
{
  background:#fff8e6;
  border:1px solid #d97706;
  border-radius:10px;
  padding:12px;
  font-weight:700;
  color:#92400e
}

.rate-auto-panel
{
  margin-top:16px;
  border:1px solid #cad8ec;
  border-radius:14px;
  background:#f7faff;
  padding:16px
}

.rate-preview-grid
{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:14px 0
}

.rate-preview-grid>div
{
  padding:12px 8px;
  background:#fff;
  border:1px solid #e0e9f7;
  border-radius:10px;
  min-width:0
}

.rate-preview-grid small
{
  display:block;
  font-size:11px;
  color:#64748b
}

.rate-preview-grid strong
{
  display:block;
  margin-top:6px;
  font-size:clamp(16px,3.5vw,23px);
  color:#132e55;
  overflow-wrap:anywhere
}

.refresh-html-btn
{
  background:#0b4ea2
}

.rate-control select
{
  min-height:43px;
  width:100%;
  border:1px solid #cbd5e1;
  border-radius:8px;
  background:white;
  padding:8px
}

/* STP Laos Exchange V3 — Admin-controlled bank card rotation */
.public-body .bank-stack.rotating
{
  min-height:128px
}

.public-body .bank-stack.bank-swap .bank-panel
{
  animation:bank-card-swap .38s ease both
}

@keyframes bank-card-swap
{
  from
  {
    opacity:0;
    transform:translateY(8px) scale(.985)
  }
  to
  {
    opacity:1;
    transform:translateY(0) scale(1)
  }
}

@media(prefers-reduced-motion:reduce)
{
  .public-body .bank-stack.bank-swap .bank-panel
  {
    animation:none!important
  }
}

/* STP Laos Exchange V4 — two bank sets with admin time schedule */
.set-account-heading
{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:8px
}

.set-account-heading h2
{
  margin:0
}

.set-badge
{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:4px 10px;
  border-radius:999px;
  background:#0b4ea2;
  color:#fff;
  font-weight:800;
  font-size:12px;
  letter-spacing:.02em
}

.bank-set-account[data-set="2"] .set-badge
{
  background:#7a4b00
}

.bank-set-intro
{
  border-style:dashed
}

.schedule-box
{
  display:grid;
  gap:15px
}

.schedule-grid
{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px
}

.schedule-set-card
{
  border:1px solid #cad8ec;
  border-radius:14px;
  padding:14px;
  background:#f7faff
}

.schedule-set-card h3
{
  margin:0 0 12px;
  color:#173557
}

.schedule-set-card label
{
  margin-top:9px
}

.schedule-box select
{
  min-height:43px;
  width:100%;
  border:1px solid #cbd5e1;
  border-radius:8px;
  background:white;
  padding:8px
}

@media(max-width:680px)
{
  .schedule-grid
  {
    grid-template-columns:1fr
  }
}

/* ============================================================
   STP LAOS EXCHANGE V5 — ADMIN DASHBOARD UI
   Visual/UX upgrade only. Keeps existing field names + API flow.
   ============================================================ */
.admin-body
{
  min-height:100vh;
  background:     radial-gradient(circle at 10% 0%,rgba(32,111,218,.16),transparent 28%),     radial-gradient(circle at 92% 10%,rgba(237,28,36,.08),transparent 22%),     linear-gradient(180deg,#f5f8fc 0%,#edf2f8 100%);
  color:#14213a;
}

.admin-body .admin-page
{
  max-width:1320px;
  width:min(1320px,calc(100% - 36px));
  padding:28px 0 120px
}

.admin-topbar
{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:0 0 20px;
  padding:17px 20px;
  border-radius:22px;
  background:linear-gradient(135deg,#071a36 0%,#0a315f 72%,#0b4ea2 100%);
  box-shadow:0 18px 45px rgba(5,29,67,.18);
  color:#fff;
}

.admin-brand-block
{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0
}

.admin-brand-mark,.login-brand-icon
{
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:50px;
  height:50px;
  border-radius:15px;
  background:linear-gradient(145deg,#fff,#eaf2ff);
  color:#0b4ea2;
  font-weight:950;
  letter-spacing:-.05em;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.8),0 10px 24px rgba(0,0,0,.18)
}

.admin-topbar .eyebrow
{
  margin:0 0 3px;
  color:#a9c7ef;
  font-size:10px;
  letter-spacing:.16em;
  font-weight:800
}

.admin-topbar h1
{
  margin:0;
  color:#fff;
  font-size:clamp(24px,3vw,34px);
  line-height:1.08
}

.admin-status-line
{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-top:8px
}

.status-pill
{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.14);
  font-size:11px;
  font-weight:800;
  color:#e7f0ff;
  overflow-wrap:anywhere
}

.load-status
{
  font-size:11px;
  color:#b8cbe6
}

.ghost-danger-btn
{
  background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(255,255,255,.22)!important;
  color:#fff!important;
  box-shadow:none!important;
  white-space:nowrap
}

.ghost-danger-btn:hover
{
  background:rgba(237,28,36,.28)!important;
  border-color:rgba(255,255,255,.4)!important
}

/* Login */
.admin-body #loginBalloon[hidden],.admin-body #logoutBtn[hidden],.admin-body #accessDenied[hidden],.admin-body #adminManagement[hidden],.admin-body #ownerNavItem[hidden]
{
  display:none!important
}

.admin-body .login-overlay
{
  position:fixed;
  inset:0;
  z-index:950;
  background:rgba(3,13,31,.82);
  display:grid;
  place-items:center;
  padding:18px;
  backdrop-filter:blur(10px)
}

.admin-body .admin-login-card
{
  width:min(470px,100%);
  padding:30px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.6);
  box-shadow:0 34px 95px rgba(0,0,0,.34)
}

.admin-body .login-brand-icon
{
  margin:0 auto 12px;
  width:58px;
  height:58px
}

.login-kicker
{
  text-align:center;
  margin:0 0 7px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.18em;
  color:#7290b4
}

.admin-body .admin-login-card h2
{
  text-align:center;
  margin:0;
  color:#0a2b56;
  font-size:27px
}

.admin-body .login-note
{
  max-width:380px;
  margin:10px auto 20px;
  text-align:center;
  font-size:13px;
  line-height:1.65;
  color:#68788e
}

.admin-body .credential-grid
{
  display:grid;
  gap:12px
}

.admin-body .credential-grid label
{
  display:grid;
  gap:7px;
  font-size:13px;
  font-weight:800;
  color:#233a59
}

.admin-body .credential-grid input
{
  width:100%;
  min-height:48px;
  border:1px solid #ccd6e4;
  border-radius:13px;
  padding:11px 13px;
  font:inherit;
  background:#fafdff;
  color:#12243d;
  transition:.18s
}

.admin-body .credential-grid input:focus
{
  outline:3px solid rgba(11,78,162,.1);
  border-color:#0b4ea2;
  background:#fff
}

.admin-body .credential-actions
{
  display:grid;
  gap:10px;
  margin-top:15px
}

.admin-body .credential-actions button
{
  min-height:48px;
  border-radius:13px
}

.admin-body .line-login-btn
{
  background:#06c755!important
}

.admin-body .login-divider
{
  display:flex;
  align-items:center;
  gap:10px;
  color:#98a6b8;
  font-size:11px;
  font-weight:800
}

.admin-body .login-divider:before,.admin-body .login-divider:after
{
  content:"";
  height:1px;
  background:#dfe6ee;
  flex:1
}

.admin-body #credentialStatus
{
  min-height:20px;
  margin-top:10px;
  text-align:center;
  font-size:12px;
  color:#63748b;
  overflow-wrap:anywhere
}

/* Access denied */
.admin-body .access-denied-wrap
{
  position:fixed;
  inset:0;
  z-index:999;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(3,13,31,.84);
  backdrop-filter:blur(8px)
}

.admin-body .access-denied-card
{
  width:min(440px,100%);
  padding:28px;
  border-radius:24px;
  background:#fff;
  text-align:center;
  box-shadow:0 28px 80px rgba(0,0,0,.35)
}

.access-denied-icon
{
  width:52px;
  height:52px;
  border-radius:50%;
  display:grid;
  place-items:center;
  margin:0 auto 12px;
  background:#fff0f0;
  color:#c91d1d;
  font-size:28px;
  font-weight:900
}

.admin-body .access-denied-card h2
{
  margin:0 0 9px;
  color:#112a4a
}

.admin-body .access-denied-card p
{
  color:#607189;
  line-height:1.6
}

.admin-body .access-denied-actions
{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:18px
}

.admin-body #requestClose
{
  background:#e8edf4;
  color:#24364b
}

/* Main workspace */
.admin-workspace
{
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:18px;
  align-items:start
}

.admin-sidebar
{
  position:sticky;
  top:16px;
  z-index:30;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(14px);
  border:1px solid #dfe7f1;
  border-radius:20px;
  padding:14px;
  box-shadow:0 13px 38px rgba(21,46,83,.08)
}

.sidebar-title
{
  padding:4px 9px 10px;
  color:#8291a4;
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase
}

.admin-nav
{
  display:grid;
  gap:5px
}

.admin-nav-item
{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  min-height:42px;
  padding:8px 10px;
  border-radius:11px;
  background:transparent;
  color:#3d4e65;
  text-align:left;
  font-size:13px;
  box-shadow:none;
  transition:.16s
}

.admin-nav-item:hover
{
  background:#f0f5fb;
  color:#0a376f
}

.admin-nav-item.is-active
{
  background:linear-gradient(135deg,#e8f2ff,#f4f8ff);
  color:#0b4ea2;
  box-shadow:inset 0 0 0 1px #cfe1f7
}

.nav-icon
{
  display:grid;
  place-items:center;
  flex:0 0 28px;
  height:28px;
  border-radius:8px;
  background:#edf2f8;
  color:#49637f;
  font-size:12px;
  font-weight:900
}

.admin-nav-item.is-active .nav-icon
{
  background:#0b4ea2;
  color:#fff
}

.sidebar-tip
{
  margin-top:13px;
  padding:11px;
  border-radius:12px;
  background:#f7f9fc;
  color:#738196;
  font-size:11px;
  line-height:1.55
}

.admin-content
{
  display:grid;
  gap:16px;
  min-width:0
}

.admin-section-card
{
  scroll-margin-top:16px;
  background:#fff;
  border:1px solid #dde6f0;
  border-radius:22px;
  padding:22px;
  box-shadow:0 10px 32px rgba(15,39,72,.055);
  min-width:0
}

.section-heading
{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:17px;
  padding-bottom:15px;
  border-bottom:1px solid #edf1f6
}

.section-heading h2
{
  margin:2px 0 4px;
  color:#102c52;
  font-size:21px;
  line-height:1.18
}

.section-heading p
{
  margin:0;
  color:#728198;
  font-size:12.5px;
  line-height:1.55
}

.section-kicker
{
  display:block;
  color:#0b4ea2;
  font-size:9px;
  font-weight:950;
  letter-spacing:.17em
}

.section-kicker.gold
{
  color:#9a6800
}

.section-kicker.green
{
  color:#0a7a3d
}

.section-kicker.purple
{
  color:#6f42c1
}

.section-kicker.red
{
  color:#c31c2d
}

.section-kicker.blue
{
  color:#0b4ea2
}

.admin-body .set-badge
{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-height:29px;
  padding:5px 11px;
  border-radius:999px;
  background:#0b4ea2;
  color:#fff;
  font-size:11px;
  font-weight:900
}

.admin-body .set-badge-gold
{
  background:#8a5c00
}

/* Overview */
.overview-grid
{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:11px;
  margin-bottom:17px
}

.overview-tile
{
  min-width:0;
  padding:14px;
  border:1px solid #e4eaf2;
  border-radius:15px;
  background:linear-gradient(145deg,#fbfdff,#f6f9fd)
}

.overview-tile span
{
  display:block;
  color:#8190a2;
  font-size:10px;
  font-weight:800
}

.overview-tile strong
{
  display:block;
  margin-top:5px;
  color:#12365f;
  font-size:17px;
  overflow-wrap:anywhere
}

.overview-tile small
{
  display:block;
  margin-top:4px;
  color:#8a98aa;
  font-size:10px;
  overflow-wrap:anywhere
}

.admin-body .compact-fields label,.admin-section-card label
{
  display:grid;
  gap:6px;
  margin:0;
  font-size:12px;
  font-weight:800;
  color:#31455f
}

.admin-body .two-col,.admin-body .field-grid
{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}

.admin-body .field-full
{
  grid-column:1/-1
}

.admin-body .admin-section-card input:not([type="checkbox"]):not([type="file"]),.admin-body .admin-section-card textarea,.admin-body .admin-section-card select
{
  width:100%;
  min-height:43px;
  border:1px solid #cfd9e6;
  border-radius:10px;
  padding:9px 11px;
  background:#fbfdff;
  color:#14243a;
  font:inherit;
  font-weight:500;
  transition:.15s
}

.admin-body .admin-section-card textarea
{
  min-height:110px;
  resize:vertical
}

.admin-body .admin-section-card input:focus,.admin-body .admin-section-card textarea:focus,.admin-body .admin-section-card select:focus
{
  outline:3px solid rgba(11,78,162,.09);
  border-color:#4c83bf;
  background:#fff
}

/* Bank editor */
.account-grid
{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px
}

.bank-editor-card
{
  min-width:0;
  border:1px solid #e2e9f1;
  border-radius:17px;
  padding:15px;
  background:#fcfdff
}

.bank-editor-card[data-set="2"]
{
  background:#fffdf8;
  border-color:#eee4cf
}

.bank-editor-head
{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:14px
}

.bank-editor-head>div:first-child
{
  display:flex;
  align-items:center;
  gap:10px
}

.bank-editor-head h3
{
  margin:0;
  color:#183656;
  font-size:16px
}

.bank-editor-head small
{
  color:#8a98aa;
  font-size:10px
}

.account-letter
{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:11px;
  background:#e8f2ff;
  color:#0b4ea2;
  font-weight:950
}

.gold-letter
{
  background:#fff2d5;
  color:#8a5c00
}

.switch-label
{
  display:inline-flex!important;
  grid-template-columns:none!important;
  align-items:center;
  gap:7px!important;
  cursor:pointer;
  white-space:nowrap;
  color:#53647a!important;
  font-size:11px!important;
  font-weight:800!important
}

.switch-label input
{
  position:absolute;
  opacity:0;
  pointer-events:none
}

.switch-ui
{
  position:relative;
  display:inline-block;
  width:38px;
  height:22px;
  border-radius:999px;
  background:#cbd5e1;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.1);
  transition:.18s
}

.switch-ui:after
{
  content:"";
  position:absolute;
  left:3px;
  top:3px;
  width:16px;
  height:16px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 2px 5px rgba(0,0,0,.18);
  transition:.18s
}

.switch-label input:checked + .switch-ui
{
  background:#0b7a47
}

.switch-label input:checked + .switch-ui:after
{
  transform:translateX(16px)
}

.media-editor-grid
{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:12px
}

.media-editor-box
{
  min-width:0;
  padding:11px;
  border:1px solid #e4e9f0;
  border-radius:13px;
  background:#fff
}

.media-editor-title
{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:7px;
  margin-bottom:9px
}

.media-editor-title strong
{
  font-size:11px;
  color:#304661
}

.media-editor-title span
{
  font-size:9px;
  color:#9aa6b6
}

.media-preview-row
{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:54px;
  margin-bottom:8px
}

.admin-body .logo-preview
{
  width:52px;
  height:52px;
  border-radius:11px;
  object-fit:contain;
  background:#fff;
  border:1px solid #e0e6ee;
  padding:5px
}

.admin-body .logo-preview.empty
{
  display:none
}

.admin-body .qr-admin-preview
{
  width:62px;
  height:62px;
  object-fit:contain;
  border:1px solid #e0e6ee;
  border-radius:10px;
  padding:4px;
  background:#fff
}

.current-logo-url
{
  min-width:0;
  color:#8a97a8;
  font-size:9px;
  line-height:1.35;
  word-break:break-all;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden
}

.file-action-row
{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap
}

.file-action-row input[type=file]
{
  max-width:100%;
  font-size:9px;
  color:#6e7e91
}

.file-action-row button
{
  padding:8px 9px;
  border-radius:8px;
  font-size:10px
}

.upload-status
{
  min-height:14px;
  margin:6px 0 0;
  color:#6a7c92;
  font-size:10px;
  line-height:1.4;
  overflow-wrap:anywhere
}

.secondary-btn
{
  background:#eef4fb!important;
  color:#174a82!important;
  border:1px solid #d5e2f0!important;
  box-shadow:none!important
}

.secondary-btn:hover
{
  background:#e2edf9!important
}

.subtle-danger-btn
{
  background:#fff1f1!important;
  color:#b3232d!important;
  border:1px solid #f1d5d7!important;
  box-shadow:none!important
}

/* Schedule */
.schedule-master-switch
{
  padding:8px 10px!important;
  border:1px solid #dce5ef;
  border-radius:12px;
  background:#f8fbff
}

.schedule-grid-v5
{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}

.admin-body .schedule-set-card
{
  padding:15px;
  border-radius:16px;
  border:1px solid #dbe6f1;
  background:#f9fbff
}

.admin-body .set-two-card
{
  background:#fffdf8;
  border-color:#eee4cf
}

.schedule-card-title
{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:14px
}

.schedule-card-title h3
{
  margin:0;
  color:#183656;
  font-size:14px
}

.schedule-card-title small
{
  color:#8b99aa;
  font-size:10px
}

.time-pair
{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:end;
  gap:8px
}

.time-arrow
{
  align-self:center;
  margin-top:19px;
  color:#98a4b4;
  font-weight:900
}

.schedule-fallback-box
{
  margin-top:12px;
  padding:14px;
  border-radius:14px;
  background:#f6f8fb;
  border:1px solid #e3e8ef
}

.schedule-fallback-box p
{
  margin:9px 0 0;
  color:#718096;
  font-size:11px;
  line-height:1.55
}

/* Rate */
.rate-mode-grid
{
  display:grid;
  grid-template-columns:1.4fr .8fr;
  gap:12px;
  margin-bottom:13px
}

.featured-field
{
  padding:12px;
  border:1px solid #dde6ef;
  border-radius:14px;
  background:#f8fbff
}

.featured-field small
{
  margin-top:3px;
  color:#8b98a9;
  font-size:10px
}

.admin-body .rate-auto-panel
{
  margin:0;
  padding:15px;
  border-radius:16px;
  border:1px solid #d9e5f1;
  background:#f8fbff
}

.panel-inline-heading
{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px
}

.panel-inline-heading h3
{
  margin:0;
  color:#173759;
  font-size:14px
}

.panel-inline-heading p
{
  margin:4px 0 0
}

.panel-inline-heading button
{
  flex:0 0 auto;
  padding:9px 12px;
  font-size:11px
}

.admin-body .rate-preview-grid
{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:12px 0
}

.admin-body .rate-preview-grid>div
{
  padding:10px;
  border-radius:11px
}

.admin-body .rate-preview-grid .auto-result
{
  background:#effaf4;
  border-color:#d2ecdF
}

.admin-body .rate-preview-grid small
{
  font-size:9px
}

.admin-body .rate-preview-grid strong
{
  font-size:clamp(14px,2vw,19px)
}

.manual-rate-box
{
  margin-top:12px;
  padding:14px;
  border:1px solid #e4e9ef;
  border-radius:14px
}

.mini-section-head
{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:12px
}

.mini-section-head h3
{
  margin:0;
  color:#173759;
  font-size:14px
}

.mini-section-head span
{
  font-size:9px;
  color:#8997a9
}

.three-col-rate
{
  display:grid;
  grid-template-columns:1fr 1fr .65fr;
  gap:10px
}

.admin-body .rate-error-alert
{
  margin:0 0 13px;
  padding:15px;
  border-width:2px
}

.admin-body .rate-error-alert strong
{
  font-size:clamp(21px,3vw,28px)
}

.admin-body .rate-error-alert p
{
  font-size:12px
}

.admin-body .rate-pending-alert
{
  margin-bottom:12px
}

/* Display / Owner */
.display-settings-grid,.owner-grid
{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}

.sub-panel,.request-box
{
  min-width:0;
  padding:14px;
  border:1px solid #e3e9f0;
  border-radius:15px;
  background:#fafcff
}

.sub-panel-title
{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-bottom:12px
}

.sub-panel-title h3,.request-box h3
{
  margin:0;
  color:#183656;
  font-size:14px
}

.owner-add-row
{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px
}

.owner-add-row button
{
  white-space:nowrap
}

.helper-text
{
  margin:7px 0 12px;
  color:#7a8899;
  font-size:10px;
  line-height:1.5
}

.admin-body .request-entry
{
  padding:10px 0;
  border-bottom:1px solid #e6ebf0
}

.admin-body .request-id
{
  font-size:9px
}

.admin-body .request-actions button
{
  padding:7px 9px;
  font-size:10px
}

.admin-body .admin-entry
{
  padding:9px 0;
  border-bottom:1px solid #e6ebf0;
  font-size:10px
}

.admin-body .admin-entry button
{
  padding:7px 9px;
  font-size:10px
}

/* Save toolbar */
.save-bar-v5
{
  position:fixed;
  left:50%;
  bottom:14px;
  z-index:70;
  transform:translateX(-50%);
  width:min(900px,calc(100% - 26px));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid rgba(205,216,229,.95);
  border-radius:16px;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(16px);
  box-shadow:0 18px 50px rgba(6,31,67,.18);
  color:#14243a
}

.save-state
{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0
}

.save-state>div
{
  display:grid;
  gap:2px
}

.save-state strong
{
  font-size:11px;
  color:#52647a
}

.save-state #saveStatus
{
  font-size:10px;
  color:#7b8898;
  min-height:12px
}

.change-dot
{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#9ba8b7;
  box-shadow:0 0 0 4px rgba(155,168,183,.12)
}

.admin-dirty .change-dot
{
  background:#e89a13;
  box-shadow:0 0 0 4px rgba(232,154,19,.13)
}

.admin-dirty #changeState
{
  color:#9a6300
}

.save-actions
{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  justify-content:flex-end
}

.save-actions button
{
  min-height:38px;
  padding:8px 12px;
  font-size:11px;
  border-radius:9px
}

.muted-btn
{
  background:#eef1f5!important;
  color:#5e6c7d!important;
  box-shadow:none!important
}

.primary-save-btn
{
  background:linear-gradient(135deg,#0b4ea2,#0d68ca)!important;
  box-shadow:0 7px 16px rgba(11,78,162,.2)!important
}

@media(max-width:1040px)
{
  .admin-workspace
  {
    grid-template-columns:1fr
  }
  .admin-sidebar
  {
    position:sticky;
    top:0;
    padding:8px;
    overflow:hidden;
    border-radius:14px
  }
  .sidebar-title,.sidebar-tip
  {
    display:none
  }
  .admin-nav
  {
    display:flex;
    gap:6px;
    overflow-x:auto;
    padding-bottom:2px;
    scrollbar-width:none
  }
  .admin-nav::-webkit-scrollbar
  {
    display:none
  }
  .admin-nav-item
  {
    flex:0 0 auto;
    width:auto;
    min-height:36px;
    padding:6px 9px
  }
  .nav-icon
  {
    width:24px;
    height:24px;
    flex-basis:24px
  }
}

@media(max-width:760px)
{
  .admin-body .admin-page
  {
    width:min(100% - 18px,1320px);
    padding:12px 0 110px
  }
  .admin-topbar
  {
    padding:13px 14px;
    border-radius:17px
  }
  .admin-brand-mark
  {
    width:42px;
    height:42px;
    border-radius:12px
  }
  .admin-topbar h1
  {
    font-size:22px
  }
  .admin-topbar .eyebrow
  {
    font-size:8px
  }
  .admin-status-line
  {
    margin-top:5px
  }
  .load-status
  {
    display:none
  }
  .ghost-danger-btn
  {
    padding:8px 9px!important;
    font-size:10px!important
  }
  .admin-content
  {
    gap:11px
  }
  .admin-section-card
  {
    padding:15px;
    border-radius:17px
  }
  .section-heading
  {
    margin-bottom:13px;
    padding-bottom:12px
  }
  .section-heading h2
  {
    font-size:18px
  }
  .section-heading p
  {
    font-size:11px
  }
  .overview-grid
  {
    grid-template-columns:1fr 1fr
  }
  .overview-tile:last-child
  {
    grid-column:1/-1
  }
  .overview-tile
  {
    padding:11px
  }
  .overview-tile strong
  {
    font-size:15px
  }
  .admin-body .two-col,.account-grid,.schedule-grid-v5,.display-settings-grid,.owner-grid,.rate-mode-grid
  {
    grid-template-columns:1fr
  }
  .account-grid
  {
    gap:10px
  }
  .bank-editor-card
  {
    padding:12px
  }
  .media-editor-grid
  {
    grid-template-columns:1fr
  }
  .three-col-rate
  {
    grid-template-columns:1fr 1fr
  }
  .three-col-rate label:nth-child(3),.three-col-rate label:nth-child(6)
  {
    grid-column:1/-1
  }
  .admin-body .rate-preview-grid
  {
    grid-template-columns:1fr 1fr
  }
  .panel-inline-heading
  {
    align-items:center;
    flex-wrap:wrap
  }
  .save-bar-v5
  {
    bottom:8px;
    width:calc(100% - 16px);
    padding:8px
  }
  .save-state
  {
    display:none
  }
  .save-actions
  {
    display:grid;
    grid-template-columns:auto auto 1fr;
    width:100%;
    gap:5px
  }
  .save-actions button
  {
    padding:7px 8px;
    font-size:10px
  }
  .primary-save-btn
  {
    min-width:0
  }
}

@media(max-width:430px)
{
  .admin-brand-block
  {
    gap:9px
  }
  .admin-brand-mark
  {
    width:38px;
    height:38px
  }
  .admin-topbar h1
  {
    font-size:19px
  }
  .status-pill
  {
    font-size:9px;
    max-width:180px
  }
  .admin-topbar .hero-actions
  {
    margin:0
  }
  .admin-nav-item span:last-child
  {
    font-size:10px
  }
  .nav-icon
  {
    display:none
  }
  .admin-nav-item
  {
    padding:7px 9px
  }
  .overview-grid
  {
    grid-template-columns:1fr
  }
  .overview-tile:last-child
  {
    grid-column:auto
  }
  .time-pair
  {
    grid-template-columns:1fr
  }
  .time-arrow
  {
    display:none
  }
  .three-col-rate
  {
    grid-template-columns:1fr
  }
  .three-col-rate label:nth-child(3),.three-col-rate label:nth-child(6)
  {
    grid-column:auto
  }
  .save-actions
  {
    grid-template-columns:1fr 1fr
  }
  .primary-save-btn
  {
    grid-column:1/-1;
    grid-row:1
  }
  .muted-btn,.save-actions .secondary-btn
  {
    grid-row:2
  }
}

/* ============================================================
 EXCHANGE V6 — LAK → USD realtime deposit-rate calculator
 ============================================================ */
.exchange-calculator
{
  position:relative;
  z-index:1;
  padding:14px;
  border-radius:18px;
  background:linear-gradient(145deg,rgba(7,28,62,.94),rgba(7,45,84,.84));
  border:1px solid rgba(195,226,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 26px rgba(0,0,0,.18);
}

.calculator-head
{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px
}

.calculator-kicker
{
  margin:0 0 3px;
  font-size:9px;
  font-weight:800;
  letter-spacing:.16em;
  color:#8fc6ff
}

.calculator-head h2
{
  margin:0;
  font-size:clamp(18px,4.8vw,23px);
  line-height:1.15;
  color:#fff
}

.calculator-pair
{
  flex:0 0 auto;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:999px;
  background:rgba(255,255,255,.07);
  font-size:11px;
  font-weight:800;
  color:#d8ecff
}

.calculator-grid
{
  display:grid;
  grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);
  align-items:end;
  gap:7px
}

.calculator-field
{
  display:grid;
  gap:6px;
  min-width:0
}

.calculator-label
{
  font-size:11px;
  font-weight:800;
  color:#cfe5fb
}

.calculator-input-wrap
{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  padding:0 10px;
  border:1px solid rgba(200,228,255,.28);
  border-radius:13px;
  background:rgba(2,15,36,.65);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease
}

.calculator-input-wrap:focus-within
{
  border-color:#8bc8ff;
  box-shadow:0 0 0 3px rgba(80,166,255,.14);
  background:rgba(3,20,47,.82)
}

.calculator-input-wrap input
{
  width:100%;
  min-width:0;
  height:48px;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  font:inherit;
  font-size:clamp(16px,4.4vw,20px);
  font-weight:800;
  text-align:right
}

.calculator-input-wrap input::placeholder
{
  color:rgba(216,234,250,.42);
  font-weight:700
}

.calculator-input-wrap>span
{
  flex:0 0 auto;
  font-size:10px;
  font-weight:900;
  color:#9ec8ec
}

.calculator-output-wrap
{
  background:rgba(12,91,67,.24);
  border-color:rgba(102,225,176,.28)
}

.calculator-output-wrap input
{
  color:#95f1ca
}

.calculator-arrow
{
  align-self:center;
  padding-top:18px;
  text-align:center;
  font-size:20px;
  font-weight:900;
  color:#8fc6ff
}

.calculator-note
{
  margin:10px 2px 0;
  text-align:center;
  font-size:10px;
  line-height:1.4;
  color:rgba(223,237,251,.72)
}

.calculator-note strong
{
  color:#fff
}

@media(max-width:370px)
{
  .calculator-grid
  {
    grid-template-columns:1fr;
    gap:7px
  }
  .calculator-arrow
  {
    padding:0;
    transform:rotate(90deg);
    line-height:1
  }
}

/* ===== Exchange V6.1 compact calculator + 1-bank no-scroll tuning ===== */
.exchange-calculator
{
  position:relative;
  z-index:1;
  padding:10px 12px 9px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(7,28,66,.92),rgba(6,22,54,.88));
  border:1px solid rgba(140,205,255,.22);
  box-shadow:0 10px 22px rgba(0,0,0,.18);
}

.calculator-head
{
  margin-bottom:8px
}

.calculator-head-simple
{
  display:block
}

.calculator-head-simple h2
{
  font-size:clamp(17px,4.3vw,21px);
  line-height:1.1
}

.calculator-grid
{
  grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);
  gap:6px;
  align-items:center
}

.calculator-field,.calculator-field-compact
{
  gap:0
}

.calculator-label,.calculator-kicker,.calculator-pair
{
  display:none!important
}

.calculator-input-wrap
{
  padding:0 10px;
  border-radius:12px
}

.calculator-input-wrap input
{
  height:44px;
  font-size:clamp(15px,4vw,18px)
}

.calculator-input-wrap>span
{
  font-size:10px
}

.calculator-arrow
{
  padding-top:0;
  font-size:18px
}

.calculator-note,.calculator-note-compact
{
  margin:7px 2px 0;
  font-size:8.5px;
  line-height:1.28;
  color:rgba(223,237,251,.64)
}

.calculator-note strong
{
  font-size:inherit
}

.public-body .screen-panel
{
  gap:8px
}

.public-body .page-title-box
{
  padding:4px 8px 8px
}

.public-body .mini-title
{
  margin-bottom:4px;
  font-size:9px
}

.public-body .page-title-box h1
{
  font-size:clamp(21px,5.6vw,30px)
}

.public-body .subtitle
{
  margin-top:4px;
  font-size:clamp(13px,3.3vw,16px)
}

.public-body .bank-stack
{
  gap:8px
}

.public-body .rates-stack
{
  gap:10px
}

.public-body .rate-strip
{
  min-height:66px;
  padding:12px 15px
}

.public-body .note-panel
{
  padding:10px 12px
}

.public-body .time-panel
{
  padding:10px 12px
}

.public-body .time-panel span
{
  font-size:clamp(14px,3.6vw,18px)
}

.public-body .time-panel strong
{
  margin-top:5px;
  font-size:clamp(16px,4.2vw,23px)
}

.public-body .status
{
  font-size:11px;
  min-height:13px
}

body.single-bank-view .screen-panel
{
  padding:10px 12px 12px;
  gap:7px
}

body.single-bank-view .page-title-box
{
  padding:2px 8px 6px
}

body.single-bank-view .mini-title
{
  font-size:8px;
  margin-bottom:3px
}

body.single-bank-view .page-title-box h1
{
  font-size:clamp(20px,5.1vw,27px)
}

body.single-bank-view .subtitle
{
  font-size:clamp(12px,3vw,15px);
  margin-top:3px
}

body.single-bank-view .bank-panel
{
  min-height:104px;
  padding:10px 10px;
  gap:6px
}

body.single-bank-view .bank-logo-wrap
{
  width:56px;
  height:56px;
  flex-basis:56px
}

body.single-bank-view .bank-actions
{
  flex-basis:58px;
  gap:8px
}

body.single-bank-view .bank-qr-button
{
  width:46px;
  height:46px
}

body.single-bank-view .bank-qr-button .qr-glyph
{
  width:23px;
  height:23px
}

body.single-bank-view button.account-copy
{
  margin:6px auto 4px;
  padding:7px 10px;
  gap:7px
}

body.single-bank-view .rates-stack
{
  gap:8px
}

body.single-bank-view .rate-strip
{
  min-height:60px;
  padding:10px 14px
}

body.single-bank-view .exchange-calculator
{
  padding:8px 10px 8px;
  border-radius:16px
}

body.single-bank-view .calculator-head
{
  margin-bottom:6px
}

body.single-bank-view .calculator-head-simple h2
{
  font-size:clamp(16px,4vw,19px)
}

body.single-bank-view .calculator-input-wrap input
{
  height:40px;
  font-size:clamp(14px,3.7vw,17px)
}

body.single-bank-view .calculator-arrow
{
  font-size:16px
}

body.single-bank-view .calculator-note
{
  margin-top:5px;
  font-size:8px
}

body.single-bank-view .note-panel
{
  padding:9px 11px
}

body.single-bank-view .note-label
{
  font-size:clamp(14px,3.5vw,16px);
  margin-bottom:4px
}

body.single-bank-view .note-text
{
  font-size:clamp(11px,3vw,14px);
  line-height:1.3
}

body.single-bank-view .time-panel
{
  padding:8px 10px
}

body.single-bank-view .time-panel span
{
  font-size:clamp(13px,3.3vw,16px)
}

body.single-bank-view .time-panel strong
{
  font-size:clamp(14px,3.8vw,20px);
  margin-top:4px
}

body.single-bank-view .status
{
  font-size:10px;
  min-height:12px
}

@media (max-width:760px)
{
  .public-body .topbar
  {
    height:60px;
    padding:10px 12px
  }
  .public-body .brand img
  {
    width:min(158px,50vw);
    max-height:31px
  }
  .public-body .mobile-screen
  {
    min-height:calc(100svh - 60px);
    padding:1px 8px 8px
  }
  .public-body .screen-panel
  {
    min-height:calc(100svh - 68px);
    padding:9px 10px 10px;
    border-radius:18px;
    gap:7px
  }
  .public-body .page-title-box
  {
    padding:3px 6px 7px
  }
  .public-body .bank-panel
  {
    min-height:114px;
    padding:11px 10px
  }
  .public-body .rate-strip
  {
    min-height:60px;
    padding:10px 12px
  }
  .exchange-calculator
  {
    padding:9px 10px 8px
  }
  .calculator-grid
  {
    grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr)
  }
  .calculator-input-wrap input
  {
    height:42px
  }
  body.single-bank-view .screen-panel
  {
    padding:8px 9px 10px;
    gap:6px
  }
  body.single-bank-view .bank-panel
  {
    min-height:96px;
    padding:9px 9px
  }
}


/* ===== Exchange V7: bidirectional calculators + hourly rate history ===== */
.calc-page-screen{padding-bottom:26px}
.calc-screen-panel{gap:12px}
.rate-health-card{position:relative;z-index:1;display:flex;align-items:center;gap:11px;padding:12px 14px;border:1px solid rgba(255,255,255,.16);border-radius:16px;background:rgba(5,22,48,.88);color:#fff}
.health-light{width:12px;height:12px;border-radius:50%;flex:0 0 12px;background:#8b97a7;box-shadow:0 0 0 4px rgba(139,151,167,.12)}
.rate-health-card.is-ok .health-light{background:#39d98a;box-shadow:0 0 0 4px rgba(57,217,138,.13),0 0 16px rgba(57,217,138,.48)}
.rate-health-card.is-error .health-light{background:#ff5252;box-shadow:0 0 0 4px rgba(255,82,82,.14),0 0 16px rgba(255,82,82,.48)}
.rate-health-card strong{display:block;font-size:13px}.rate-health-card p{margin:3px 0 0;font-size:10px;color:rgba(230,240,250,.7)}
.calc-rate-card{position:relative;z-index:1;padding:14px;border-radius:18px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(180deg,rgba(7,28,66,.94),rgba(6,22,54,.9));box-shadow:0 12px 26px rgba(0,0,0,.18)}
.calc-card-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}.calc-card-head small{font-size:9px;font-weight:900;letter-spacing:.12em;color:#9ec8ec}.calc-card-head h2{margin:2px 0 0;color:#fff;font-size:19px}.calc-card-head>strong{color:#fff;font-size:17px;text-align:right}.calc-card-head>strong small{letter-spacing:0;font-size:9px}
.deposit-calc-card{border-color:rgba(57,217,138,.26)}.withdraw-calc-card{border-color:rgba(255,185,90,.26)}
.calc-back-link{position:relative;z-index:1;display:block;text-align:center;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.13);color:#dcebfa;text-decoration:none;font-size:12px;background:rgba(255,255,255,.05)}

.rate-history-toolbar{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin-bottom:10px}.rate-history-toolbar label{min-width:190px}.rate-history-toolbar button{min-height:42px}
.rate-history-table-wrap{overflow:auto;border:1px solid #e0e8f1;border-radius:14px;background:#fff}.rate-history-table{width:100%;border-collapse:collapse;min-width:760px}.rate-history-table th,.rate-history-table td{padding:11px 12px;border-bottom:1px solid #edf1f5;text-align:right;font-size:12px;white-space:nowrap}.rate-history-table th{position:sticky;top:0;background:#f6f9fc;color:#4d617a;font-weight:900}.rate-history-table th:first-child,.rate-history-table td:first-child{text-align:left}.rate-history-table tbody tr:last-child td{border-bottom:0}.rate-history-table tbody tr:hover{background:#f9fbfd}

/* ===== Exchange V8 — currency tabs / multi-currency banksets ===== */
[hidden]{display:none!important}
.currency-tabs{
  position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
  margin:0 0 12px;padding:5px;border:1px solid rgba(255,255,255,.16);border-radius:15px;
  background:rgba(4,20,43,.72);backdrop-filter:blur(8px)
}
.currency-tab{
  appearance:none;border:1px solid transparent;border-radius:11px;padding:10px 8px;
  background:transparent;color:rgba(255,255,255,.7);font:800 14px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.06em;cursor:pointer;transition:.18s ease
}
.currency-tab:hover,.currency-tab:focus-visible{color:#fff;border-color:rgba(255,255,255,.2);outline:none}
.currency-tab.is-active{color:#fff;background:linear-gradient(135deg,rgba(20,130,255,.92),rgba(22,196,127,.82));box-shadow:0 5px 16px rgba(0,0,0,.22)}
.public-body .note-text{white-space:pre-wrap;overflow-wrap:anywhere}
.currency-set-block{margin-top:22px;padding-top:4px}
.currency-set-block+.currency-set-block{border-top:1px solid rgba(148,163,184,.18);padding-top:24px}
.currency-schedule-box{margin-top:26px}
.note-format-controls{display:grid;grid-template-columns:minmax(150px,1fr) minmax(120px,.7fr) auto auto;gap:12px;align-items:end;margin-top:14px}
.note-format-controls .format-toggle{min-height:46px;display:flex!important;align-items:center;gap:8px;padding:0 12px;border:1px solid rgba(148,163,184,.25);border-radius:12px;background:rgba(15,23,42,.35)}
.note-format-controls input[type="color"]{min-height:46px;padding:5px!important}
.note-preview-admin{margin-top:14px;padding:14px 16px;border:1px dashed rgba(148,163,184,.3);border-radius:12px;background:rgba(2,6,23,.3)}
.note-preview-admin>span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;opacity:.65;margin-bottom:8px}
.note-preview-admin p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:720px){.note-format-controls{grid-template-columns:1fr 1fr}.currency-tab{padding:9px 6px}}


/* ===== Exchange V8.2 — USD note/time, single-line account name, calculator colors ===== */
.public-body .bank-account-name{
  display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:clip;overflow-wrap:normal;line-height:1.18;
}
.calc-page-body .deposit-calc-card{
  border-color:rgba(57,217,138,.62);
  background:linear-gradient(180deg,rgba(10,92,61,.94),rgba(7,58,43,.92));
  box-shadow:0 12px 26px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.08);
}
.calc-page-body .withdraw-calc-card{
  border-color:rgba(255,82,82,.62);
  background:linear-gradient(180deg,rgba(111,28,39,.94),rgba(73,19,31,.92));
  box-shadow:0 12px 26px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.08);
}

/* V8.3 — account names stay on one line and shrink to fit; never ellipsis */
.public-body .bank-account-name{white-space:nowrap;overflow:hidden;text-overflow:clip;}