/* ExactReceipt: approved Gram-inspired interface, 2026-11. */
html[data-appearance] {
  --er-text: #071834; --er-muted: #53627d; --er-link: #047ba6;
  --er-accent: #0593c6; --er-surface: #fcffff; --er-bg: #f7fbfd;
  --er-line: #d9e6ef; --er-soft: #eaf4f9;
}
html[data-appearance] body#mini-app-body { background: #fcffff !important; color: #071834 !important; }
html[data-appearance] body#mini-app-body .app-header { background: #fcffff !important; border-bottom: 0 !important; box-shadow: none !important; }
html[data-appearance] body#mini-app-body .app-shell { background: #fcffff !important; }
html[data-appearance] body#mini-app-body :is(h1,h2,h3) { color: #071834; letter-spacing: -.025em; }
html[data-appearance] body#mini-app-body .gram-profile-link { border: 0; background: #edf5fa; color: #047ba6; border-radius: 50%; width: 36px; height: 36px; font-size: 21px; }
html[data-appearance] body#mini-app-body .language-control:not([hidden]) { display: inline-flex !important; }
html[data-appearance] body#mini-app-body .language-control select { color: #047ba6; background: #edf5fa; border: 0; border-radius: 18px; padding: 7px; font-weight: 700; }
html[data-appearance] body#mini-app-body #home-view:not([hidden]) { display: flex !important; flex-direction: column; gap: 12px; }
html[data-appearance] body#mini-app-body #home-view .home-onboarding { display: block !important; order: 0; padding: 5px 0 0 !important; margin: 0 !important; min-height: 0 !important; }
html[data-appearance] body#mini-app-body #home-view .home-onboarding-copy { display: block !important; }
html[data-appearance] body#mini-app-body #home-view .home-onboarding-copy h1 { display: block !important; margin: 0 0 4px !important; font-size: 23px !important; line-height: 1.2; }
html[data-appearance] body#mini-app-body #home-view .home-onboarding-copy p { display: block !important; margin: 0; color: #53627d !important; font-size: 13px; line-height: 1.45; }
html[data-appearance] body#mini-app-body #home-view .home-balance-card:not([hidden]) { order: 1; display: flex !important; width: 100%; min-height: 110px; margin: 2px 0 0 !important; padding: 18px !important; border: 0 !important; border-radius: 18px !important; background: #0593c6 !important; color: #fff !important; box-shadow: none !important; align-items: center; }
html[data-appearance] body#mini-app-body #home-view .home-balance-card :is(small,em,b,i) { color: #fff !important; }
html[data-appearance] body#mini-app-body #home-view .home-balance-card .c3-account-copy { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 3px; }
html[data-appearance] body#mini-app-body #home-view .home-balance-amount { display: flex; flex-direction: row-reverse; justify-content: flex-end; align-items: center; gap: 8px; }
html[data-appearance] body#mini-app-body #home-view .home-balance-amount b { font-size: 34px !important; line-height: 1.05; font-weight: 750; }
html[data-appearance] body#mini-app-body #home-view .home-balance-amount img { width: 28px; height: 28px; }
html[data-appearance] body#mini-app-body #home-view .home-balance-coin { display: none !important; }
html[data-appearance] body#mini-app-body #home-view .home-balance-action { opacity: .8; }
html[data-appearance] body#mini-app-body #home-view .gram-held { order: 2; display: flex; align-items: center; justify-content: space-between; min-height: 50px; padding: 0 15px; background: #edf4f9; border-radius: 14px; color: #53627d; font-size: 13px; }
html[data-appearance] body#mini-app-body #home-view .gram-held span { display: flex; align-items: center; gap: 9px; }
html[data-appearance] body#mini-app-body #home-view .gram-held i { font-size: 21px; }
html[data-appearance] body#mini-app-body #home-view .gram-held strong { color: #071834; font-size: 15px; font-variant-numeric: tabular-nums; }
html[data-appearance] body#mini-app-body #home-view .gram-home-actions { order: 3; display: grid !important; grid-template-columns: 1fr !important; gap: 9px; margin: 0 !important; padding: 0 !important; }
html[data-appearance] body#mini-app-body #home-view .gram-home-actions button { width: 100%; min-height: 49px !important; border: 0 !important; border-radius: 14px !important; display: flex; align-items: center; justify-content: center; gap: 10px; font-weight: 700 !important; }
html[data-appearance] body#mini-app-body #home-view .gram-home-actions .home-primary { background: #db3996 !important; color: white !important; }
html[data-appearance] body#mini-app-body #home-view .gram-home-actions .home-secondary { background: #d9f2fa !important; color: #07547a !important; }
html[data-appearance] body#mini-app-body #home-view .gram-home-actions .ph-caret-right { margin-left: auto; }
html[data-appearance] body#mini-app-body #home-view .c3-activity-section { order: 4; margin-top: 6px !important; }
html[data-appearance] body#mini-app-body #home-view .section-header h2 { font-size: 17px; }
html[data-appearance] body#mini-app-body #home-view .section-header button { color: #047ba6; font-weight: 700; }
html[data-appearance] body#mini-app-body #home-view .c3-filter-chips { display: none !important; }
html[data-appearance] body#mini-app-body .app-nav.app-nav-capsule:not([hidden]) { width: 100% !important; max-width: 560px; bottom: 0 !important; padding: 5px 8px calc(5px + var(--safe-bottom)) !important; border-radius: 0 !important; border-top: 1px solid #e4eef4 !important; box-shadow: none !important; background: #fcffff !important; }
html[data-appearance] body#mini-app-body .app-nav.app-nav-capsule button { color: #5c6c86 !important; background: transparent !important; }
html[data-appearance] body#mini-app-body .app-nav.app-nav-capsule button[aria-current="page"] { color: #047ba6 !important; background: transparent !important; }
html[data-appearance] body#mini-app-body :is(.fallback-primary,.result-primary,.journal-create,.wallet-add-primary) { background: #0593c6 !important; color: #fff !important; border-radius: 14px !important; }
html[data-appearance] body#mini-app-body :is(.settings-group,.wallet-account-summary,.payout-balance-card,.amount-composer,.ledger-tabs) { border-radius: 16px !important; }
html[data-appearance] body#mini-app-body :is(.ledger-tabs [aria-selected="true"], .payout-balance-tabs [aria-selected="true"]) { background: #0593c6 !important; color: #fff !important; }
html[data-appearance] body#mini-app-body :is(button,a,input,select):focus-visible { outline: 3px solid #db3996 !important; outline-offset: 3px; }
html[data-appearance] body#mini-app-body ::selection { background: #bfeaf8; color: #071834; }
@media (prefers-reduced-motion: no-preference) {
 html[data-appearance] body#mini-app-body :is(.gram-home-actions button,.app-nav button,.settings-row,.activity-row) { transition: transform 180ms cubic-bezier(.2,.8,.2,1), background-color 180ms ease, color 180ms ease; }
 html[data-appearance] body#mini-app-body :is(.gram-home-actions button,.activity-row):active { transform: scale(.985); }
}
@media (prefers-reduced-motion: reduce) { html[data-appearance] body#mini-app-body * { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }
html[data-appearance] body#mini-app-body #home-view .home-balance-card :is(small,em) { color: #042a42 !important; font-weight: 650; }
html[data-appearance] body#mini-app-body #home-view .gram-home-actions .home-primary { font-size: 19px !important; }
html[data-appearance] body#mini-app-body :is(.fallback-primary,.result-primary,.journal-create,.wallet-add-primary) { background: #047ba6 !important; }
html[data-appearance] body#mini-app-body :is(.ledger-tabs [aria-selected="true"], .payout-balance-tabs [aria-selected="true"]) { background: #047ba6 !important; }
html[data-appearance] body#mini-app-body .gram-ledger-heading { margin: 0 0 12px; }
html[data-appearance] body#mini-app-body .gram-ledger-heading h1 { font-size: 23px; }
html[data-appearance] body#mini-app-body :is(.ledger-search,.ledger-tabs,.payout-summary-list,.wallet-connection-info) { background: #edf4f9 !important; border-color: #d9e6ef !important; }
html[data-appearance] body#mini-app-body :is(.ledger-tabs button,.payout-balance-tabs button) { border-radius: 12px; }
html[data-appearance] body#mini-app-body :is(.activity-row,.settings-row,.sheet-option) { min-height: 56px; }
/* Payout and wallet screens: values remain supplied by the production ledger. */
html[data-appearance] body#mini-app-body {
  --er-text: #071834; --er-muted: #53627d; --er-link: #047ba6;
  --er-accent: #0593c6; --er-surface: #fcffff; --er-bg: #fcffff;
  --er-line: #d9e6ef; --er-soft: #eaf4f9;
}
html[data-appearance] body#mini-app-body :is(.gram-payout-heading,.wallet-page-heading) { margin-bottom: 15px !important; }
html[data-appearance] body#mini-app-body :is(.gram-payout-heading,.wallet-page-heading) h1 { font-size: 23px !important; line-height: 1.2; margin: 0 0 5px; }
html[data-appearance] body#mini-app-body :is(.gram-payout-heading,.wallet-page-heading) p { color: #53627d !important; font-size: 13px; line-height: 1.4; }
html[data-appearance] body#mini-app-body .gram-payout-steps { display: flex; justify-content: space-between; gap: 8px; padding: 7px 8px 14px; margin-bottom: 8px; }
html[data-appearance] body#mini-app-body .gram-payout-steps span { display: grid; justify-items: center; gap: 5px; color: #53627d; min-width: 0; flex: 1; }
html[data-appearance] body#mini-app-body .gram-payout-steps b { display: grid; place-items: center; height: 28px; width: 28px; border: 1px solid #bdcddd; border-radius: 50%; font-size: 13px; background: #f5f9fc; }
html[data-appearance] body#mini-app-body .gram-payout-steps .is-current b { background: #047ba6; color: #fff; border-color: #047ba6; }
html[data-appearance] body#mini-app-body .gram-payout-steps small { font-size: 11px; text-align: center; }
html[data-appearance] body#mini-app-body .gram-payout-caption { margin: 0 0 8px; color: #53627d; font-size: 13px; line-height: 1.4; }
html[data-appearance] body#mini-app-body .gram-section-title { margin: 20px 0 9px; font-size: 15px; }
html[data-appearance] body#mini-app-body #payouts-view .payout-balance-card { background: #edf4f9 !important; border: 1px solid #d9e6ef !important; color: #071834 !important; box-shadow: none !important; }
html[data-appearance] body#mini-app-body #payouts-view .payout-balance-card strong { color: #071834 !important; font-variant-numeric: tabular-nums; }
html[data-appearance] body#mini-app-body #payouts-view .payout-balance-card small { color: #53627d !important; }
html[data-appearance] body#mini-app-body #payouts-view .payout-summary-list { overflow: hidden; padding: 0; }
html[data-appearance] body#mini-app-body #payouts-view .payout-wallet-card { width: 100%; min-height: 66px; background: #fcffff; }
html[data-appearance] body#mini-app-body #payouts-view .payout-methods:not([hidden]) { background: transparent !important; }
html[data-appearance] body#mini-app-body #payouts-view #request-ton-payout { background: #047ba6 !important; border-radius: 14px; color: #fff !important; min-height: 55px; }
html[data-appearance] body#mini-app-body #payouts-view #request-ton-payout :is(b,small,i) { color: inherit !important; }
html[data-appearance] body#mini-app-body #payouts-view #request-ton-payout:disabled { background: #d9e6ef !important; color: #53627d !important; }
html[data-appearance] body#mini-app-body #wallet-view .wallet-account-summary { margin: 0; padding: 18px !important; background: #edf7fb !important; border: 1px solid #d9e6ef !important; border-radius: 16px !important; box-shadow: none !important; }
html[data-appearance] body#mini-app-body #wallet-view .wallet-account-summary h2 { color: #071834 !important; }
html[data-appearance] body#mini-app-body #wallet-view .wallet-add-primary { background: #db3996 !important; color: white !important; font-size: 19px; font-weight: 700; }
html[data-appearance] body#mini-app-body .gram-wallet-trust { display: flex; gap: 12px; margin: 14px 0; padding: 14px; background: #e8f7ef; color: #15573a; border-radius: 14px; }
html[data-appearance] body#mini-app-body .gram-wallet-trust > i { font-size: 23px; flex: none; }
html[data-appearance] body#mini-app-body .gram-wallet-trust span { display: grid; gap: 4px; }
html[data-appearance] body#mini-app-body .gram-wallet-trust strong { font-size: 14px; }
html[data-appearance] body#mini-app-body .gram-wallet-trust small { font-size: 12px; line-height: 1.4; }
html[data-appearance] body#mini-app-body #receipts-view .ledger-item { border-bottom: 1px solid #e4eef4; min-height: 68px; }
/* The app-owned brand, language and profile controls must remain reachable in Telegram. */
html[data-appearance] body#mini-app-body.telegram-host .app-header { display: flex !important; }
html[data-appearance] body#mini-app-body.telegram-host .app-header .brand { display: inline-flex !important; }
/* The former skin hid all header actions, including the language selector. */
html[data-appearance] body#mini-app-body .app-header .header-actions { display: flex !important; align-items: center; gap: 8px; }
html[data-appearance] body#mini-app-body .app-header .brand { flex: 1 1 auto; min-width: 0; }
html[data-appearance] body#mini-app-body .app-header .header-actions { flex: 0 0 auto; }
/* Honor the existing dark appearance setting with readable equivalents. */
html[data-appearance="dark"] body#mini-app-body {
  --er-page: #111d29; --er-bg: #111d29; --er-header: #172936;
  --er-surface: #1a2a38; --er-soft: #243b4a; --er-line: #385062;
  --er-text: #f3fbff; --er-muted: #bfced8; --er-link: #8adaf4;
  --text: #f3fbff; --muted: #bfced8; --line: #385062; --section: #1a2a38;
  --surface: #1a2a38; --control: #243b4a; --ref-text: #f3fbff; --ref-muted: #bfced8;
  --ref-line: #385062; --ref-soft: #243b4a; --ref-blue: #8adaf4;
  background: #111d29 !important; color: #f3fbff !important;
}
html[data-appearance="dark"] body#mini-app-body :is(.app-header,.app-shell,.app-nav.app-nav-capsule:not([hidden])) { background: #111d29 !important; }
html[data-appearance="dark"] body#mini-app-body :is(h1,h2,h3) { color: #f3fbff !important; }
html[data-appearance="dark"] body#mini-app-body :is(.gram-payout-heading,.wallet-page-heading) p,
html[data-appearance="dark"] body#mini-app-body #home-view .home-onboarding-copy p,
html[data-appearance="dark"] body#mini-app-body .gram-payout-caption { color: #bfced8 !important; }
html[data-appearance="dark"] body#mini-app-body #home-view .gram-held,
html[data-appearance="dark"] body#mini-app-body :is(.ledger-search,.ledger-tabs,.payout-summary-list,.wallet-connection-info),
html[data-appearance="dark"] body#mini-app-body #payouts-view .payout-balance-card,
html[data-appearance="dark"] body#mini-app-body #wallet-view .wallet-account-summary { background: #1a2a38 !important; border-color: #385062 !important; color: #f3fbff !important; }
html[data-appearance="dark"] body#mini-app-body #payouts-view .payout-wallet-card { background: #1a2a38 !important; }
html[data-appearance="dark"] body#mini-app-body #home-view .gram-held strong,
html[data-appearance="dark"] body#mini-app-body #payouts-view .payout-balance-card strong,
html[data-appearance="dark"] body#mini-app-body #wallet-view .wallet-account-summary h2 { color: #f3fbff !important; }
html[data-appearance="dark"] body#mini-app-body #payouts-view .payout-balance-card small { color: #bfced8 !important; }
html[data-appearance="dark"] body#mini-app-body .app-nav.app-nav-capsule button { color: #bfced8 !important; }
html[data-appearance="dark"] body#mini-app-body .app-nav.app-nav-capsule button[aria-current="page"] { color: #8adaf4 !important; }
html[data-appearance="dark"] body#mini-app-body .gram-payout-steps span { color: #bfced8; }
html[data-appearance="dark"] body#mini-app-body .gram-payout-steps b { background: #243b4a; border-color: #516b7c; }
html[data-appearance="dark"] body#mini-app-body .gram-payout-steps .is-current b { background: #047ba6; border-color: #047ba6; }
html[data-appearance="dark"] body#mini-app-body .gram-wallet-trust { background: #163d32; color: #d2f9df; }
html[data-appearance="dark"] body#mini-app-body .gram-profile-link,
html[data-appearance="dark"] body#mini-app-body .language-control select { background: #243b4a; color: #a6e3f9; }
/* Shared design language for every Mini App screen and dialog. */
html[data-appearance] body#mini-app-body {
  --er-page: #fcffff; --er-header: #fcffff; --er-buttonText: #fff;
  --bg: #fcffff; --surface: #fcffff; --section: #fcffff; --control: #edf5f9;
  --text: #071834; --muted: #53627d; --line: #d9e6ef; --blue: #0593c6; --link: #047ba6;
  --ref-bg: #fcffff; --ref-text: #071834; --ref-muted: #53627d; --ref-line: #d9e6ef;
  --ref-soft: #edf5f9; --ref-blue: #047ba6; --ref-blue-soft: #d9f2fa;
  --hy-bg: #fcffff; --hy-surface: #fcffff; --hy-surface-soft: #edf5f9;
  --hy-text: #071834; --hy-muted: #53627d; --hy-line: #d9e6ef; --hy-blue: #047ba6;
}
html[data-appearance] body#mini-app-body :is(.screen-heading h1,.screen-title-row h1,.result-page-head h1) { color: var(--er-text) !important; font-size: 23px !important; font-weight: 700; }
html[data-appearance] body#mini-app-body :is(.screen-heading p,.result-page-head p,.section-header small,.composer-trust) { color: var(--er-muted) !important; line-height: 1.45; }
html[data-appearance] body#mini-app-body :is(.settings-group,.composer-group,.sheet-group,.plan-checkout-sheet,.plan-checkout-payment,.invoice-composer-tools,.settlement-preview,.seller-access-conversation,.faq-list,.result-evidence) { border-radius: 16px !important; border-color: var(--er-line) !important; }
html[data-appearance] body#mini-app-body :is(.settings-row,.composer-row,.sheet-option,.faq-list > details > summary,.ledger-item) { color: var(--er-text) !important; border-color: var(--er-line) !important; }
html[data-appearance] body#mini-app-body :is(.settings-icon,.row-icon,.channel-connect-icon) { background: var(--er-soft) !important; color: var(--er-link) !important; border-radius: 11px !important; }
html[data-appearance] body#mini-app-body :is(.bottom-sheet,.system-panel,.plan-checkout-sheet,.plan-checkout-payment) { background: var(--er-surface) !important; color: var(--er-text) !important; }
html[data-appearance] body#mini-app-body .bottom-sheet { border-radius: 20px 20px 0 0 !important; }
html[data-appearance] body#mini-app-body :is(.sheet-header p,.sheet-option small,.form-help,.faq-independent,.rail-boundary) { color: var(--er-muted) !important; }
html[data-appearance] body#mini-app-body :is(.sheet-form input,.sheet-form select,.surface-form input,.recipient-manual input,.account-stars-form input,.account-stars-form select,.account-stars-form textarea) { border-color: var(--er-line) !important; color: var(--er-text) !important; background: var(--er-surface) !important; caret-color: var(--er-accent); }
html[data-appearance] body#mini-app-body :is(.fallback-primary,.result-primary,.journal-create,.plan-checkout-pay,.dispute-send,.account-stars-primary) { background: #047ba6 !important; color: #fff !important; border-color: transparent !important; border-radius: 14px !important; }
html[data-appearance] body#mini-app-body :is(.fallback-primary,.result-primary,.journal-create,.plan-checkout-pay,.dispute-send,.account-stars-primary):disabled { opacity: .55; }
html[data-appearance] body#mini-app-body :is(.amount-composer,.settlement-preview,.composer-progress,.seller-template-trigger,.faq-hero,.faq-search,.channel-connect-card,.profile-trust) { background: var(--er-soft) !important; border-color: var(--er-line) !important; color: var(--er-text) !important; border-radius: 16px !important; }
html[data-appearance] body#mini-app-body :is(.amount-composer input,.faq-search input) { color: var(--er-text) !important; }
html[data-appearance] body#mini-app-body :is(.text-action,.sheet-manual-wallet summary,.faq-list summary,.account-stars-link) { color: var(--er-link) !important; }
html[data-appearance] body#mini-app-body #account-stars-view { --account-blue: #047ba6; --account-ink: var(--er-text); --account-muted: var(--er-muted); background: var(--er-page); color: var(--er-text); }
html[data-appearance] body#mini-app-body #account-stars-view :is(.account-stars-connection,.account-stars-record) { border-color: var(--er-line); }
html[data-appearance] body#mini-app-body #account-stars-view :is(.account-stars-notice,.account-stars-connection button) { background: var(--er-soft); color: var(--er-text); }
html[data-appearance] body#mini-app-body #account-stars-view .account-stars-error { background: #fff1ee; color: #8c2818; }
html[data-appearance] body#mini-app-body :is(#plan-view .seller-plan-card.start,#plan-view .seller-plan-card.pro,#plan-view .seller-plan-card.business,#plan-checkout-view .plan-detail-cover) { background-color: #047ba6 !important; border-radius: 18px !important; }
html[data-appearance] body#mini-app-body #plan-view .seller-plan-card.business { background-color: #9f226e !important; }
html[data-appearance] body#mini-app-body :is(#plan-view .seller-plan-card h2,#plan-view .seller-plan-card small,#plan-checkout-view .plan-detail-cover h1,#plan-checkout-view .plan-detail-cover p) { color: #fff !important; }
@media (prefers-reduced-motion: no-preference) {
 html[data-appearance] body#mini-app-body .bottom-sheet:not([hidden]) { animation: gram-sheet-in 180ms cubic-bezier(.2,.8,.2,1) both; }
 @keyframes gram-sheet-in { from { opacity: .75; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
}
/* In dark mode apply the same hierarchy with dark surfaces. */
html[data-appearance="dark"] body#mini-app-body {
  --er-page: #111d29; --er-header: #172936; --er-surface: #1a2a38;
  --er-soft: #243b4a; --er-line: #385062; --er-text: #f3fbff; --er-muted: #bfced8; --er-link: #8adaf4;
  --bg: #111d29; --surface: #1a2a38; --section: #1a2a38; --control: #243b4a;
  --text: #f3fbff; --muted: #bfced8; --line: #385062; --link: #8adaf4;
  --ref-bg: #111d29; --ref-text: #f3fbff; --ref-muted: #bfced8; --ref-line: #385062; --ref-soft: #243b4a; --ref-blue: #8adaf4; --ref-blue-soft: #243b4a;
  --hy-bg: #111d29; --hy-surface: #1a2a38; --hy-surface-soft: #243b4a; --hy-text: #f3fbff; --hy-muted: #bfced8; --hy-line: #385062; --hy-blue: #8adaf4;
}
html[data-appearance="dark"] body#mini-app-body #account-stars-view { --account-blue: #8adaf4; }
html[data-appearance] body#mini-app-body #wallet-view .wallet-add-primary { font-size: 19px !important; }
