:root{
  --bg: #f6f7f3;
  --ink: #202a24;
  --muted: #7d8873;
  --line: #e2e7df;
  --green: #315c40;
  --lime: #d9efb8;
  --purple: #315c40;
}
.experience-heading{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 25px;
}
.experience-heading .eyebrow{
  margin-bottom: 12px;
}
.experience-heading h1{
  max-width: 620px;
}
.experience-heading p{
  font-size: 14px;
  color: #676f5e;
  line-height: 1.7;
  margin-top: 14px;
  max-width: 450px;
}
.catalog-switch{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  padding: 5px;
  background: #e9eee3;
  border: 1px solid #e3e9dc;
  border-radius: 14px;
  margin-bottom: 16px;
}
.catalog-switch button{
  font-size: 13px;
  min-height: 42px;
  color: #65705a;
  border-radius: 10px;
  font-weight: 500;
}
.catalog-switch button.selected{
  background: #fff;
  color: #4c673b;
  box-shadow: 0 2px 5px #526f3b09;
}
.product-choice-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
.product-choice{
  min-width: 0;
  padding: 24px;
  background: #fff;
  border: 1px solid #e0e7d8;
  border-radius: 23px;
  box-shadow: 0 10px 30px #506b3304;
}
.product-choice-top{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 20px;
}
.product-choice-top h2{
  font-size: 22px;
  font-weight: 650;
  letter-spacing: -0.7px;
}
.product-choice-top p{
  font-size: 12px;
  color: #686e5f;
  line-height: 1.65;
  margin-top: 7px;
}
.product-category{
  display: flex;
  align-items: center;
  justify-content: center;
  background: #eef3e7;
  border: 1px solid #e2e9d9;
  border-radius: 7px;
  padding: 4px 7px;
  min-width: 36px;
  font-size: 10px;
  color: #637053;
  flex-shrink: 0;
}
.product-card-visual{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 1.586/1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  padding: 25px;
  border-radius: 17px;
  border: 1px solid #d3ddca;
  background: linear-gradient(115deg, #f3f7ed, #d9e3cf);
  color: #42553a;
  box-shadow: 0 13px 23px -20px #40583360;
}
.product-choice .product-card-visual{
  max-width: 350px;
  margin-inline: auto;
}
.product-card-visual.is-ink{
  background: linear-gradient(115deg, #243b2f, #344d37);
  border-color: #3b5540;
  color: #e6f1d9;
}
.card-brand-row,.card-footer{
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  z-index: 1;
}
.card-brand-row strong{
  font-size: 31px;
  line-height: 1.05;
  letter-spacing: -1.7px;
  font-weight: 800;
}
.card-brand-row .card-network{
  font-size: 12px;
  font-weight: 650;
  letter-spacing: -0.2px;
  opacity: 0.8;
}
.card-hardware{
  position: absolute;
  right: 9%;
  top: 48%;
  display: flex;
  align-items: center;
  gap: 10px;
  transform: translateY(-50%);
  pointer-events: none;
  color: #7b8c6c;
}
.card-hardware .plata-icon{
  width: 20px;
  height: 27px;
  opacity: 0.7;
}
.wallet-chip{
  position: relative;
  display: block;
  width: 34px;
  height: 26px;
  border: 1px solid #a7aa82;
  border-radius: 6px;
  background: linear-gradient(125deg, #e3e2ba, #bdbf93 55%, #d5d6ab);
  opacity: 0.9;
}
.wallet-chip:before{
  content: "";
  position: absolute;
  inset: 7px -1px;
  border-top: 1px solid #90976c88;
  border-bottom: 1px solid #90976c88;
}
.wallet-chip:after{
  content: "";
  position: absolute;
  inset: -1px 9px;
  border-left: 1px solid #90976c88;
  border-right: 1px solid #90976c88;
  border-radius: 4px;
}
.is-ink .card-hardware{
  color: #c2d2ad;
}
.visual-purpose{
  font-size: 12px;
  line-height: 1.5;
  max-width: 53%;
  position: relative;
  z-index: 1;
  color: #647059;
}
.is-ink .visual-purpose{
  color: #a5b998;
}
.visual-account{
  max-width: 60%;
  position: relative;
  z-index: 1;
  container-type: inline-size;
}
.visual-account > span{
  display: block;
  font-size: 11px;
  color: #64705a;
  margin-bottom: 6px;
}
.is-ink .visual-account > span{
  color: #a5b998;
}
.visual-balance{
  display: block;
  font-size: clamp(19px, 18cqw, 37px);
  line-height: 1.1;
  letter-spacing: -1px;
  font-weight: 550;
  white-space: nowrap;
}
.card-footer .card-number{
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 10px;
  letter-spacing: 1.8px;
  line-height: 1.4;
  white-space: nowrap;
  opacity: 0.8;
}
.card-footer small{
  font-size: 10px;
  letter-spacing: 1px;
  line-height: 1.4;
  opacity: 0.7;
}
.product-cost{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin: 24px 0 23px;
}
.product-cost > div + div{
  padding-left: 18px;
  border-left: 1px solid #e5eadd;
}
.product-cost span{
  font-size: 11px;
  color: #696e61;
  display: block;
}
.product-cost strong{
  display: block;
  white-space: nowrap;
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -1px;
  line-height: 1.25;
  margin-top: 8px;
}
.product-cost small{
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  color: #686e5f;
  margin-left: 3px;
  white-space: nowrap;
}
.product-footnote{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 11px;
  font-size: 10px;
  color: #696e62;
}
.product-footnote button{
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 36px;
  padding: 0;
  font-size: 10px;
  color: #647056;
}
.product-footnote svg{
  width: 14px;
  height: 14px;
}
.service-promise{
  display: flex;
  flex-wrap: wrap;
  gap: 13px 25px;
  padding: 20px 2px;
  font-size: 11px;
  color: #657059;
}
.service-promise > span{
  display: flex;
  gap: 8px;
  align-items: center;
}
.service-promise svg{
  width: 17px;
  height: 17px;
  flex-shrink: 0;
  color: #627152;
}
.support-row{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 20px 2px;
  border-top: 1px solid #e0e7d7;
  margin-top: 5px;
  color: #627154;
  font-size: 13px;
}
.support-row > span{
  display: flex;
  align-items: center;
  gap: 10px;
}
.support-row svg{
  width: 20px;
  height: 20px;
}
.wallet-layout{
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(220px, 1fr);
  gap: 26px;
}
.wallet-main{
  background: #fff;
  border: 1px solid #e0e7d8;
  border-radius: 23px;
  padding: 24px;
  min-width: 0;
}
.wallet-tabs{
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.wallet-tabs button{
  min-height: 38px;
  min-width: 56px;
  padding: 8px 11px;
  border: 1px solid #e3e9da;
  background: #f6f9f0;
  border-radius: 9px;
  font-size: 12px;
  color: #666f5b;
}
.wallet-tabs button.selected{
  background: #eaf2df;
  border-color: #d4e1c1;
  color: #597443;
}
.wallet-caption{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 13px;
  color: #627154;
  margin: 20px 0 10px;
}
.service-badge{
  font-size: 10px;
  background: #edf5e1;
  color: #637153;
  border-radius: 6px;
  padding: 5px 7px;
}
.wallet-actions{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin-top: 20px;
}
.wallet-actions button{
  font-size: 12px;
  padding-inline: 10px;
}
.membership-tile{
  border: 1px solid #dce5ce;
  border-radius: 21px;
  background: #ecf2e3;
  padding: 25px;
  align-self: start;
}
.membership-tile h2{
  font-size: 25px;
  margin: 15px 0;
}
.membership-price{
  font-size: 35px;
  letter-spacing: -1.2px;
}
.membership-price span{
  font-size: 12px;
  letter-spacing: 0;
  color: #647056;
  margin-left: 4px;
}
.membership-tile > p{
  font-size: 13px;
  color: #647055;
  line-height: 1.7;
  margin: 12px 0;
}
.paid-until{
  border-top: 1px solid #dae4ca;
  padding-top: 18px;
  margin: 22px 0;
  font-size: 11px;
  color: #667058;
}
.paid-until strong{
  display: block;
  font-size: 16px;
  font-weight: 550;
  color: #5e7248;
  margin-top: 6px;
}
.membership-tile .secondary-button{
  width: 100%;
  background: #f6f9f1;
  font-size: 12px;
}
.plan-benefits{
  display: flex;
  flex-wrap: wrap;
  gap: 11px 24px;
  padding: 21px 3px;
  font-size: 11px;
  color: #666f5b;
}
.plan-benefits > span{
  display: flex;
  align-items: center;
  gap: 8px;
}
.plan-benefits svg{
  width: 16px;
  height: 16px;
  color: #627152;
}
.plan-continue{
  margin-top: 3px;
}
.purchase-presets{
  display: flex;
  gap: 9px;
  margin-top: 11px;
}
.purchase-presets button{
  border: 1px solid #e0e7d5;
  background: #f4f8ed;
  border-radius: 9px;
  min-width: 55px;
  min-height: 40px;
  font-size: 13px;
  padding: 9px 15px;
  color: #627150;
}
.condition-list,.checkout-lines{
  margin: 20px 0;
  padding: 12px 0;
  border-block: 1px solid #e5ecdb;
}
.condition-list > div,.checkout-lines > div{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  font-size: 13px;
  padding: 10px 0;
}
.condition-list span,.checkout-lines span{
  color: #666f59;
  line-height: 1.6;
}
.condition-list b,.checkout-lines b{
  font-weight: 500;
  white-space: nowrap;
  color: #5e724b;
}
.checkout-product{
  font-size: 13px !important;
  color: #676f5d !important;
  margin: 0 0 19px !important;
}
.checkout-total{
  padding: 10px 0 19px;
}
.checkout-total > span{
  display: block;
  font-size: 12px;
  color: #637057;
  margin-bottom: 7px;
}
.checkout-total strong{
  font-size: 42px;
  letter-spacing: -1.6px;
  font-weight: 600;
  line-height: 1.2;
  color: #4d6d39;
  font-variant-numeric: tabular-nums;
}
.modal .checkout-lines{
  margin: 0 0 6px;
}
.checkout-breakdown > summary{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  min-height: 46px;
  font-size: 12px;
  color: #627153;
}
.checkout-breakdown > summary::-webkit-details-marker{
  display: none;
}
.checkout-breakdown > summary svg{
  width: 16px;
  height: 16px;
}
.checkout-breakdown[open] > summary svg{
  transform: rotate(180deg);
}
.exchange-rate{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 0;
  border-top: 1px solid #e5ecdb;
  font-size: 12px;
}
.exchange-rate span{
  color: #666f5d;
}
.exchange-rate strong{
  font-weight: 500;
  white-space: nowrap;
  color: #5e724c;
}
.modal .checkout-following{
  font-size: 12px;
  line-height: 1.75;
  color: #676f5d;
  margin: 14px 0 20px;
}
.checkout-consent{
  display: flex;
  align-items: flex-start;
  gap: 11px;
  font-size: 12px;
  color: #637056;
  line-height: 1.7;
  margin: 13px 0;
}
.checkout-consent input{
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  margin: 0;
  accent-color: #7c9a5e;
}
.checkout-consent button{
  font-size: inherit;
  color: #5d734a;
  text-decoration: underline;
  text-underline-offset: 3px;
  padding: 0;
}
.checkout-consent:last-of-type{
  margin-bottom: 23px;
}
.inline-document{
  white-space: pre-wrap;
  background: #f7faf1;
  border: 1px solid #e4ecd7;
  border-radius: 12px;
  padding: 15px;
  max-height: 43vh;
  overflow: auto;
  font-size: 12px;
  line-height: 1.8;
  color: #666f58;
  margin: 20px 0;
}
.bank-details{
  display: flex;
  flex-direction: column;
  gap: 7px;
  border: 1px solid #e0e9d4;
  border-radius: 14px;
  background: #f8faf4;
  padding: 18px;
  margin: 20px 0;
  overflow-wrap: anywhere;
}
.bank-details > span{
  font-size: 10px;
  color: #666f5a;
}
.bank-details > strong,.bank-details code{
  font-size: 13px;
  color: #5f724f;
  font-weight: 500;
}
.bank-details > .secondary-button{
  font-size: 12px;
  margin: 7px 0 11px;
}
.bank-details code{
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}
.profile-identity{
  display: flex;
  flex-direction: column;
  gap: 7px;
  background: #f4f8ec;
  border: 1px solid #e4ecd8;
  border-radius: 14px;
  padding: 18px;
  margin: 20px 0;
}
.profile-identity strong{
  font-size: 19px;
  color: #5e724d;
}
.profile-identity > span{
  font-size: 13px;
  color: #657058;
}
.order-banner{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 13px;
  text-align: left;
  border: 1px solid #d9e7c6;
  border-radius: 14px;
  background: #eef5e3;
  padding: 16px 17px;
  margin-bottom: 17px;
  color: #5f7249;
}
.order-banner strong{
  display: block;
  font-size: 14px;
}
.order-banner small{
  display: block;
  font-size: 12px;
  color: #657056;
  margin-top: 5px;
}
.order-chevron{
  margin-left: auto;
  flex-shrink: 0;
}
.order-chevron svg{
  height: 23px;
  width: 23px;
}
.order-dot{
  display: none;
}
.commerce-notice{
  padding: 15px 17px;
  border: 1px solid #e5e6c6;
  border-radius: 12px;
  background: #f5f5e8;
  font-size: 13px;
  line-height: 1.75;
  color: #6f6d54;
  margin-bottom: 18px;
}
.public-page,.legal-page{
  background: #f6f7f3;
  color: #35452c;
}
.public-page main,.legal-page main{
  max-width: 1070px;
  margin: auto;
  padding: 25px 35px 65px;
}
.public-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.public-brand{
  font-size: 34px;
  font-weight: 800;
  letter-spacing: -2px;
}
.public-header > a:last-child{
  font-size: 12px;
  color: #657057;
}
.public-hero{
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 60px;
  align-items: center;
  margin: 80px 0;
}
.public-hero > div > span{
  font-size: 10px;
  letter-spacing: 1.5px;
  color: #657056;
}
.public-hero h1{
  font-size: 48px;
  margin: 18px 0;
}
.public-hero p{
  font-size: 15px;
  color: #676f5d;
  line-height: 1.8;
  margin: 20px 0;
}
.public-hero .primary-button{
  max-width: 290px;
}
.public-page .product-choice-grid{
  grid-template-columns: 1fr 1fr;
}
.public-page .product-choice h2{
  font-size: 24px;
}
.public-page .product-choice > p{
  font-size: 13px;
  line-height: 1.8;
  color: #666f5b;
  margin: 12px 0;
}
.public-page .minimum-note{
  font-size: 11px !important;
}
.public-steps{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin: 40px 0;
}
.public-steps > div{
  border: 1px solid #e1e9d5;
  border-radius: 15px;
  background: #fff;
  padding: 22px;
}
.public-steps strong{
  font-size: 14px;
  color: #627152;
}
.public-steps p{
  font-size: 12px;
  color: #657059;
  line-height: 1.8;
  margin-top: 12px;
}
.service-plans{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.service-plan{
  border: 1px solid #dde8ce;
  border-radius: 18px;
  background: #fff;
  padding: 22px;
}
.plan-slot{
  font-size: 37px;
  color: #607150;
  margin-bottom: 16px;
}
.plan-slot span{
  font-size: 11px;
  margin-left: 8px;
}
.service-plan h2{
  font-size: 20px;
}
.service-plan p{
  font-size: 12px;
  line-height: 1.8;
  color: #657059;
  margin-top: 12px;
}
.service-plan-price{
  font-size: 30px;
  color: #5e7349;
  margin-top: 19px;
}
.service-plan-price > span{
  font-size: 10px;
  margin-left: 5px;
}
.public-page footer{
  margin-top: 45px;
  border-top: 1px solid #e0e9d4;
  padding-top: 25px;
  color: #666f5a;
}
.public-page footer p{
  max-width: 680px;
  font-size: 12px;
  line-height: 1.9;
}
.legal-page nav{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 17px;
  margin: 30px 0;
  font-size: 12px;
  color: #657059;
}
.legal-page h1{
  font-size: 35px;
}
.legal-text{
  white-space: pre-wrap;
  font-size: 14px;
  line-height: 1.95;
  color: #647056;
  margin: 25px 0;
}
.legal-version{
  font-size: 11px;
  color: #666f5c;
  margin: 14px 0;
}
.legal-page aside{
  font-size: 12px;
  background: #f1f2dc;
  border: 1px solid #e5e5c6;
  border-radius: 12px;
  padding: 14px;
  margin: 20px 0;
  color: #706d53;
}
.admin-body{
  background: #f6f8f2;
}
.admin-body .primary-button{
  background: #344c35;
  color: #fff;
  border-radius: 11px;
}
.admin-body .secondary-button{
  border-radius: 10px;
}
.admin-body .brand-dot,.environment-badge i{
  display: none;
}
.admin-body .modal-backdrop{
  position: fixed;
  inset: 0;
  background: #243b2b50;
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  padding: 18px;
}
.admin-body .modal{
  position: relative;
  background: #fff;
  border-radius: 22px;
  padding: 28px;
  width: 100%;
  max-width: 480px;
  max-height: calc(100dvh - 36px);
  overflow: auto;
}
.admin-body .modal h2{
  font-size: 25px;
  margin: 0 30px 15px 0;
}
.admin-body .modal p{
  font-size: 13px;
  line-height: 1.8;
}
.admin-body .modal-close{
  position: absolute;
  right: 12px;
  top: 12px;
  border-radius: 50%;
  background: #f2f5ec;
  width: 35px;
  height: 35px;
  font-size: 25px;
}
.admin-body .modal-field{
  font-size: 13px;
  display: block;
  margin: 20px 0;
}
.admin-body .modal-input{
  font-size: 16px;
  display: block;
  width: 100%;
  min-height: 49px;
  background: #f7faf1;
  border: 1px solid #dce6ce;
  border-radius: 10px;
  padding: 12px;
  margin-top: 8px;
}
.admin-body .modal-error{
  font-size: 13px;
  color: #86654d;
  line-height: 1.8;
}
.admin-body .checkout-consent{
  font-size: 12px;
}
.admin-body .checkout-consent input{
  min-width: 20px;
}
.connection-form input:not([type="checkbox"]),.connection-form textarea,.connection-form select{
  font-size: 16px !important;
}
.commerce-config-blockers{
  font-size: 13px;
  line-height: 1.8;
}
.commerce-config-blockers li{
  margin-bottom: 6px;
}
.queue-intro p,.request-hint,.request-meta{
  font-size: 12px !important;
  line-height: 1.8;
}
.request-amounts strong{
  font-size: 21px !important;
}
.admin-panel,.request-card{
  box-shadow: none;
}
.admin-body .modal-field select{
  width: 100%;
  min-height: 48px;
  margin-top: 9px;
  font-size: 16px;
}
@media (min-width: 851px) {
  #commerce-home:has(.catalog-switch){
    max-width: 650px;
  }
  .plan-benefits,.plan-continue{
    max-width: 650px;
  }
}
@media (max-width: 850px) {
  .wallet-layout{
    grid-template-columns: minmax(0, 1fr) minmax(210px, 0.8fr);
    gap: 18px;
  }
  .public-hero{
    gap: 30px;
  }
  .public-hero h1{
    font-size: 40px;
  }
}
@media (max-width: 600px) {
  .experience-heading{
    margin-bottom: 21px;
  }
  .experience-heading .eyebrow{
    display: none;
  }
  .experience-heading .eyebrow{
    font-size: 8px;
    letter-spacing: 1.4px;
    margin-bottom: 10px;
  }
  .experience-heading p{
    font-size: 14px;
    line-height: 1.7;
    margin-top: 13px;
    max-width: 320px;
  }
  .catalog-switch{
    margin-bottom: 14px;
    padding: 4px;
    border-radius: 12px;
  }
  .catalog-switch button{
    min-height: 38px;
    font-size: 12px;
    border-radius: 9px;
  }
  .product-choice{
    padding: 19px;
    border-radius: 20px;
  }
  .product-choice-top{
    margin-bottom: 17px;
    gap: 8px;
  }
  .product-choice-top h2{
    font-size: 19px;
  }
  .product-choice-top p{
    font-size: 11px;
    margin-top: 6px;
  }
  .product-category{
    font-size: 9px;
    padding: 4px 6px;
  }
  .product-card-visual{
    padding: 22px;
    border-radius: 15px;
    gap: 9px;
  }
  .product-choice .product-card-visual{
    max-width: 280px;
  }
  .card-brand-row strong{
    font-size: 29px;
  }
  .card-brand-row .card-network{
    font-size: 11px;
  }
  .visual-purpose{
    font-size: 11px;
  }
  .card-footer .card-number{
    font-size: 9px;
    letter-spacing: 1px;
  }
  .card-footer small{
    font-size: 9px;
  }
  .product-cost{
    gap: 12px;
    margin: 21px 0;
  }
  .product-cost > div + div{
    padding-left: 13px;
  }
  .product-cost span{
    font-size: 10px;
  }
  .product-cost strong{
    font-size: 26px;
    margin-top: 7px;
  }
  .product-cost small{
    font-size: 10px;
  }
  .product-footnote{
    font-size: 11px;
    gap: 6px;
  }
  .product-footnote button{
    font-size: 11px;
  }
  .service-promise{
    gap: 10px;
    padding: 18px 2px;
    flex-direction: column;
    font-size: 12px;
  }
  .wallet-layout{
    display: block;
  }
  .wallet-main{
    padding: 19px;
    border-radius: 20px;
  }
  .wallet-main .product-card-visual{
    padding: 22px;
  }
  .wallet-main .visual-balance{
    font-size: clamp(19px, 17cqw, 34px);
  }
  .membership-tile{
    padding: 22px;
    margin-top: 20px;
  }
  .wallet-caption{
    font-size: 12px;
  }
  .membership-tile h2{
    font-size: 23px;
  }
  .membership-tile .eyebrow{
    font-size: 9px;
  }
  .plan-benefits{
    padding: 18px 2px;
    gap: 10px;
    font-size: 12px;
    flex-direction: column;
  }
  .public-page main,.legal-page main{
    padding: 22px 20px 50px;
  }
  .public-hero{
    grid-template-columns: 1fr;
    margin: 45px 0;
    gap: 26px;
  }
  .public-hero h1{
    font-size: 38px;
  }
  .public-hero p{
    font-size: 14px;
  }
  .public-hero .product-card-visual{
    max-width: 390px;
  }
  .public-page .product-choice-grid,.public-steps,.service-plans{
    grid-template-columns: 1fr;
  }
  .public-header > a:last-child{
    font-size: 11px;
  }
  .public-steps{
    gap: 12px;
  }
  .legal-page h1{
    font-size: 29px;
  }
  .admin-body .modal-backdrop{
    align-items: flex-end;
    padding: 0;
  }
  .admin-body .modal{
    border-radius: 23px 23px 0 0;
    max-height: calc(100dvh - 12px);
    padding: 27px 22px;
  }
  .checkout-total strong{
    font-size: 39px;
  }
  .condition-list > div,.checkout-lines > div{
    font-size: 12px;
  }
}
@media (max-width: 359px) {
  .product-choice{
    padding: 16px;
  }
  .product-choice-top h2{
    font-size: 17px;
  }
  .product-choice-top p{
    font-size: 10px;
  }
  .product-card-visual{
    padding: 18px;
  }
  .card-brand-row strong{
    font-size: 25px;
  }
  .visual-purpose{
    font-size: 10px;
  }
  .card-footer .card-number{
    font-size: 8px;
  }
  .product-cost strong{
    font-size: 23px;
  }
  .product-cost small{
    font-size: 9px;
  }
  .product-cost span{
    font-size: 9px;
  }
  .checkout-total strong{
    font-size: 35px;
  }
  .wallet-actions{
    grid-template-columns: 1fr;
  }
  .wallet-main .visual-balance{
    font-size: clamp(18px, 17cqw, 30px);
  }
}

@media (max-width: 600px) {
  .telegram-fullscreen .experience-heading h1{
    font-size: 30px;
    line-height: 1.08;
    letter-spacing: -1.2px;
  }
  .telegram-fullscreen .experience-heading{
    margin-bottom: 18px;
  }
  .telegram-fullscreen .experience-heading p{
    font-size: 13px;
    line-height: 1.55;
    margin-top: 11px;
  }
  .telegram-fullscreen .catalog-switch{
    padding: 3px;
    margin-bottom: 12px;
  }
  .telegram-fullscreen .catalog-switch button{
    min-height: 34px;
  }
  .telegram-fullscreen .product-choice{
    padding: 16px;
  }
  .telegram-fullscreen .product-choice-top{
    margin-bottom: 13px;
  }
  .telegram-fullscreen .product-choice .product-card-visual{
    max-width: 250px;
  }
  .telegram-fullscreen .product-cost{
    margin: 16px 0;
  }
  .telegram-fullscreen .product-cost strong{
    font-size: 25px;
    margin-top: 6px;
  }
  .telegram-fullscreen .product-footnote{
    margin-top: 7px;
  }
  .telegram-fullscreen .product-footnote button{
    min-height: 32px;
  }
  .telegram-fullscreen .product-choice-top p{
    margin-top: 5px;
  }
}
.wallet-layout{
  grid-template-columns: minmax(0, 650px);
}
.wallet-main{
  padding: 28px;
}
.wallet-card-button{
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  border-radius: 18px;
}
.wallet-card-button:focus-visible{
  outline: 3px solid #315c40;
  outline-offset: 5px;
}
.wallet-main .product-card-visual{
  min-height: 220px;
}
.card-reveal-hint{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  color: #73816c;
  font-size: 11px;
  padding: 15px 0 0;
}
.card-reveal-hint svg{
  width: 14px;
  height: 14px;
}
.wallet-tabs button:last-child{
  margin-left: auto;
  background: transparent;
  color: #315c40;
  border-color: transparent;
}
.wallet-caption{
  margin-top: 22px;
}
.wallet-actions{
  margin-top: 20px;
}
.wallet-actions .primary-button svg,.new-card-arrow svg{
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}
.wallet-tabs{
  gap: 8px;
}
.wallet-tabs button{
  border-radius: 11px;
  padding: 10px 14px;
}
.wallet-tabs button.selected{
  color: #fff;
  background: #315c40;
  border-color: #315c40;
}
.new-card-choices{
  display: grid;
  gap: 12px;
  margin: 26px 0 18px;
}
.new-card-choice{
  display: flex;
  width: 100%;
  align-items: center;
  text-align: left;
  gap: 17px;
  padding: 18px 16px;
  border: 1px solid #e0e7da;
  background: #fbfcf9;
  border-radius: 18px;
  transition:
    background 0.15s,
    border-color 0.15s;
}
.new-card-choice:hover{
  background: #f0f5e9;
  border-color: #b7cba6;
}
.new-card-preview{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-shrink: 0;
  width: 94px;
  height: 65px;
  border-radius: 9px;
  padding: 10px;
  background: linear-gradient(130deg, #e8f1db, #bdcda9);
  color: #385334;
  border: 1px solid #c7d4bb;
  box-shadow: 0 8px 16px -12px #273d27;
}
.new-card-preview b{
  font-size: 20px;
  letter-spacing: -1px;
}
.new-card-preview small{
  font-size: 8px;
  text-align: right;
  line-height: 1;
}
.new-card-preview.is-dark{
  background: linear-gradient(130deg, #203a2e, #486548);
  border-color: #385b42;
  color: #ecf4e4;
}
.new-card-copy{
  display: grid;
  gap: 7px;
  min-width: 0;
}
.new-card-copy > strong{
  font-size: 15px;
  line-height: 1.4;
  color: #263c2e;
}
.new-card-copy > small{
  font-size: 11px;
  line-height: 1.4;
  color: #7d8775;
}
.new-card-copy > b{
  font-size: 15px;
  color: #315c40;
  font-weight: 600;
}
.new-card-copy b small{
  font-size: 10px;
  font-weight: 400;
  color: #7d8775;
}
.new-card-arrow{
  margin-left: auto;
  flex-shrink: 0;
  color: #315c40;
}
.new-card-arrow svg{
  width: 21px;
  height: 21px;
}
.issued-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 19px;
  aspect-ratio: 1.586;
  min-height: 210px;
  padding: 25px;
  border-radius: 19px;
  border: 1px solid #bcccae;
  background:
    radial-gradient(ellipse at 100% 0, #f3f9ec 0, transparent 60%),
    linear-gradient(125deg, #dceacb, #b4c79c);
  color: #28432e;
  box-shadow: 0 18px 32px -25px #20362899;
  margin: 25px 0;
}
.issued-card-dark{
  color: #eef6e7;
  border-color: #49694d;
  background:
    radial-gradient(ellipse at 100% 0, #56774c 0, transparent 65%),
    linear-gradient(125deg, #18382c, #31543b);
}
.issued-card-top{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.issued-card-top strong{
  font-size: 31px;
  letter-spacing: -1.8px;
  line-height: 1;
}
.issued-card-top > span{
  font-size: 13px;
  font-weight: 650;
}
.issued-card-chip{
  width: 31px;
  height: 23px;
  border: 1px solid #9b9c6e;
  border-radius: 5px;
  background: linear-gradient(135deg, #deddb2, #b6b58a);
  opacity: 0.8;
}
.issued-card-pan{
  font:
    clamp(14px, 4.7vw, 25px)/1.4 ui-monospace,
    SFMono-Regular,
    monospace;
  letter-spacing: 1.4px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.issued-card-bottom{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 19px;
  margin-top: auto;
}
.issued-card-bottom > div{
  display: grid;
  gap: 5px;
  min-width: 0;
}
.issued-card-bottom small{
  font-size: 7px;
  letter-spacing: 1.6px;
  opacity: 0.65;
}
.issued-card-bottom span{
  font:
    12px/1.3 ui-monospace,
    SFMono-Regular,
    monospace;
  overflow-wrap: anywhere;
}
.reveal-actions{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
.reveal-actions button{
  padding-inline: 12px;
  font-size: 12px;
}
.reveal-actions svg{
  width: 16px;
  height: 16px;
}
.recurring-panel{
  padding: 20px;
  background: #f1f5eb;
  border: 1px solid #dce6d2;
  border-radius: 16px;
  margin: 24px 0;
}
.recurring-panel .eyebrow{
  display: block;
  margin-bottom: 13px;
}
.recurring-panel strong{
  font-size: 17px;
  display: block;
}
.recurring-panel p{
  font-size: 12px;
  margin: 9px 0 16px;
}
.recurring-panel .text-button{
  padding-left: 0;
}
.admin-metrics .metric small{
  display: block;
  font-size: 11px;
  line-height: 1.5;
  color: #7b8773;
  margin-top: 10px;
}
.analytics-grid{
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 20px;
  margin-bottom: 20px;
}
.analytics-grid .admin-panel{
  margin: 0;
  min-width: 0;
}
.analytics-heading{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}
.analytics-heading > span,.analytics-heading > small{
  font-size: 11px;
  color: #77856e;
}
.registration-chart{
  display: flex;
  height: 180px;
  align-items: stretch;
  gap: 9px;
  margin-top: 25px;
}
.registration-column{
  display: flex;
  flex: 1;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.registration-column > b{
  font-size: 10px;
  min-height: 12px;
  font-weight: 500;
  color: #617855;
}
.registration-track{
  height: 125px;
  width: 100%;
  display: flex;
  align-items: flex-end;
  border-radius: 5px;
  background: #f3f6ee;
}
.registration-bar{
  width: 100%;
  min-height: 2px;
  border-radius: 4px;
  background: #88a575;
}
.registration-column small{
  font-size: 9px;
  color: #7e8a73;
}
.users-toolbar{
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  margin-bottom: 20px;
}
.users-toolbar .admin-search{
  margin: 0;
  flex: 1;
  min-width: 180px;
}
.users-toolbar .queue-filters{
  margin: 0;
}
.admin-body .user-detail-modal{
  max-width: 670px;
}
.user-detail-heading .eyebrow{
  margin-bottom: 10px;
  display: block;
}
.user-detail-heading p{
  margin: 8px 0 15px;
  color: #73806b;
}
.user-mini-metrics{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
  background: #f2f6ec;
  border-radius: 15px;
  padding: 20px;
  margin: 25px 0;
}
.user-mini-metrics small{
  display: block;
  font-size: 10px;
  color: #798770;
  line-height: 1.5;
}
.user-mini-metrics strong{
  display: block;
  font-size: 20px;
  margin-top: 8px;
  color: #2c4831;
  letter-spacing: -0.6px;
}
.user-section{
  padding: 22px 0;
  border-top: 1px solid #e5ebdd;
}
.user-section h3{
  font-size: 15px;
  margin-bottom: 12px;
}
.user-section h3 > span{
  font-size: 11px;
  color: #798770;
  margin-left: 5px;
}
.user-section .analytics-heading h3{
  margin: 0;
}
.user-section .analytics-heading{
  margin-bottom: 12px;
}
.user-section p{
  color: #78856e;
}
.admin-user-cards{
  display: grid;
  gap: 10px;
}
.admin-user-card{
  display: flex;
  gap: 13px;
  align-items: center;
  background: #fafbf8;
  padding: 14px;
  border: 1px solid #e4eadc;
  border-radius: 12px;
}
.admin-user-card > div{
  display: grid;
  gap: 7px;
  flex: 1;
}
.admin-user-card strong{
  font-size: 13px;
}
.admin-user-card small{
  font-size: 11px;
  color: #7b8873;
}
.admin-card-icon{
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: #edf3e5;
  color: #527144;
}
.admin-card-icon svg{
  width: 21px;
  height: 21px;
}
.admin-user-card .text-button{
  font-size: 12px;
  padding: 6px;
}
.user-operation{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #eff2eb;
}
.user-operation div{
  display: grid;
  gap: 6px;
}
.user-operation strong{
  font-size: 12px;
  font-weight: 500;
}
.user-operation small{
  font-size: 10px;
  color: #849079;
}
.user-operation b{
  font-size: 13px;
  font-weight: 500;
}
.user-account-actions{
  padding-top: 20px;
  border-top: 1px solid #e5ebdd;
}
.credentials-fields{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.card-admin-divider{
  border-top: 1px solid #e3eadb;
  margin: 26px 0;
}
.credentials-editor summary{
  font-size: 13px;
  cursor: pointer;
  padding: 18px 0;
  color: #436139;
}
.admin-body .user-detail-modal > .text-button{
  margin-top: 20px;
}
.admin-body .modal input:not([type="checkbox"]),.admin-body .modal select{
  min-width: 0;
}
.admin-body table td .secondary-button{
  white-space: nowrap;
  min-height: 36px;
  padding: 8px 12px;
  font-size: 11px;
}
.admin-body table td .secondary-button svg{
  width: 15px;
  height: 15px;
}
@media (max-width: 700px) {
  .analytics-grid{
    grid-template-columns: 1fr;
  }
  .registration-chart{
    gap: 6px;
  }
  .admin-metrics{
    grid-template-columns: 1fr 1fr;
  }
  .admin-metrics .metric{
    padding: 18px;
  }
  .admin-metrics .metric strong{
    font-size: 26px;
  }
  .admin-metrics .metric small{
    font-size: 10px;
  }
  .users-toolbar .queue-filters{
    width: 100%;
    overflow-x: auto;
  }
  .admin-body .user-detail-modal{
    border-radius: 24px 24px 0 0;
  }
  .user-mini-metrics{
    gap: 10px;
    padding: 16px;
  }
  .user-mini-metrics strong{
    font-size: 17px;
  }
  .user-mini-metrics small{
    font-size: 9px;
  }
  .admin-card-icon{
    display: none;
  }
  .admin-user-card{
    padding: 12px;
  }
  .issued-card{
    padding: 22px;
    min-height: 200px;
    gap: 17px;
  }
  .issued-card-pan{
    font-size: clamp(13px, 4.3vw, 22px);
  }
  .issued-card-bottom{
    gap: 14px;
  }
  .issued-card-bottom span{
    font-size: 11px;
  }
  .new-card-choice{
    gap: 13px;
    padding: 16px 13px;
  }
  .new-card-preview{
    width: 78px;
    height: 55px;
    padding: 9px;
  }
  .new-card-copy > strong{
    font-size: 13px;
  }
  .new-card-copy > small{
    font-size: 10px;
  }
  .new-card-copy > b{
    font-size: 14px;
  }
  .new-card-copy b small{
    font-size: 9px;
  }
  .new-card-arrow svg{
    width: 18px;
  }
  .wallet-main{
    padding: 20px;
  }
  .wallet-main .product-card-visual{
    min-height: 190px;
  }
  .reveal-actions{
    grid-template-columns: 1fr;
  }
  .credentials-fields{
    gap: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .new-card-choice{
    transition: none;
  }
}
.new-card-arrow{
  font:
    24px/1 ui-sans-serif,
    system-ui,
    sans-serif;
}
.commerce-config-blockers summary,.connection-form > summary,.connection-form details > summary{
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  min-height: 30px;
  line-height: 1.5;
}
.connection-form[open] > summary{
  margin-bottom: 20px;
}
.connection-form details[open] > summary{
  margin-bottom: 20px;
}
.connection-form > details{
  padding-bottom: 20px;
}
@media (max-width: 600px) {
  .users-table{
    overflow: visible;
    background: transparent;
    border: 0;
    padding: 0;
  }
  .users-table table,.users-table tbody{
    display: block;
    min-width: 0;
    width: 100%;
  }
  .users-table thead{
    display: none;
  }
  .users-table tbody tr{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    padding: 20px;
    border: 1px solid #e1e8d9;
    background: #fff;
    border-radius: 17px;
    margin-bottom: 12px;
  }
  .users-table tbody td{
    display: block;
    border: 0;
    padding: 0;
    white-space: normal;
    text-align: left;
    font-size: 13px;
  }
  .users-table tbody td:first-child{
    grid-column: 1/-1;
  }
  .users-table tbody td:first-child strong{
    font-size: 17px;
  }
  .users-table tbody td:nth-child(4){
    display: flex;
    align-items: center;
  }
  .users-table tbody td:last-child{
    display: flex;
    justify-content: flex-end;
  }
  .users-table table td .secondary-button{
    font-size: 12px;
  }
  .user-detail-modal .user-mini-metrics{
    margin-top: 20px;
  }
  .admin-title h1{
    font-size: 27px;
  }
}

.condition-list > div{
  align-items: flex-start;
}
.condition-list > div > b{
  white-space: normal;
  text-align: right;
  flex-shrink: 0;
  max-width: 45%;
}
.condition-list small{
  display: block;
  font-size: 11px;
  line-height: 1.6;
  color: #78876b;
  margin-top: 4px;
}
.checkout-heading{
  margin: 0 0 22px;
}
.checkout-heading .eyebrow{
  display: block;
  font-size: 9px;
  letter-spacing: 1.6px;
  color: #84917c;
  margin-bottom: 10px;
}
.modal .checkout-heading h2{
  margin-bottom: 0;
  font-size: 27px;
  letter-spacing: -1px;
}
.checkout-payment-card{
  position: relative;
  overflow: hidden;
  border-radius: 23px;
  padding: 24px 26px;
  background:
    radial-gradient(ellipse at 100% 0, #577a4d66, transparent 65%), #244534;
  color: #f0f6e9;
}
.checkout-card-brand{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}
.checkout-card-brand > span{
  font-size: 26px;
  letter-spacing: -1.5px;
  font-weight: 750;
}
.checkout-card-brand small{
  font-size: 12px;
  color: #c4d6b9;
}
.checkout-payment-card .checkout-total{
  margin: 28px 0 18px;
  padding: 0;
}
.checkout-payment-card .checkout-total > span{
  font-size: 12px;
  color: #b8cbb0;
  margin-bottom: 9px;
}
.checkout-payment-card .checkout-total strong{
  color: #e4f5cb;
  font-size: clamp(32px, 9vw, 46px);
  font-weight: 550;
  line-height: 1.12;
  letter-spacing: -1.5px;
  overflow-wrap: anywhere;
}
.checkout-card-caption{
  font-size: 11px;
  color: #bdceb3;
}
.checkout-renewal{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: #edf3e6;
  border: 0;
  border-radius: 14px;
  padding: 15px 17px;
  margin: 11px 0 0;
}
.checkout-renewal > span{
  font-size: 12px;
  color: #687d5c;
  line-height: 1.5;
}
.checkout-renewal > strong{
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 5px;
  justify-content: flex-end;
  align-items: flex-end;
  font-size: 15px;
  font-weight: 600;
  color: #34573b;
  white-space: nowrap;
}
.checkout-renewal small{
  white-space: normal;
  text-align: right;
  font-size: 10px;
  font-weight: 400;
  color: #7d8c71;
}
.checkout-calculation{
  margin: 20px 0 22px;
  border: 0;
  background: #f5f6f1;
  border-radius: 17px;
  overflow: hidden;
}
.checkout-calculation > summary{
  padding: 17px;
  min-height: 74px;
  justify-content: flex-start;
  gap: 13px;
  list-style: none;
}
.checkout-calculation > summary > span:nth-child(2){
  display: grid;
  gap: 5px;
  flex: 1;
}
.checkout-calculation summary strong{
  font-size: 13px;
  font-weight: 600;
  color: #3c5137;
}
.checkout-calculation summary small{
  font-size: 10px;
  color: #829077;
}
.checkout-calculation summary > svg{
  width: 17px;
  height: 17px;
  color: #7d8c71;
  flex-shrink: 0;
}
.calculation-symbol{
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 35px;
  height: 35px;
  border-radius: 11px;
  background: #e3eadb;
  color: #647d53;
  font-size: 25px;
  line-height: 1;
  font-weight: 400;
}
.calculation-content{
  padding: 0 12px 12px;
}
.cost-sheet,.cost-funding{
  border-radius: 13px;
  background: #fff;
  padding: 12px 14px;
}
.cost-funding{
  margin-top: 9px;
  background: #eaf0e3;
}
.cost-row{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 18px;
  padding: 8px 0;
  font-size: 12px;
  line-height: 1.5;
}
.cost-row > span{
  color: #7a866f;
}
.cost-row > b{
  font-size: 12px;
  font-weight: 550;
  color: #3b5335;
  white-space: nowrap;
}
.funding-credit{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 0 13px;
}
.funding-credit > span{
  font-size: 11px;
  color: #718164;
}
.funding-credit > strong{
  font-size: 22px;
  letter-spacing: -0.6px;
  font-weight: 550;
  color: #436039;
}
.checkout-calculation .exchange-rate{
  border: 0;
  padding: 11px 0 8px;
  margin: 0;
  gap: 10px;
  font-size: 10px;
}
.checkout-calculation .exchange-rate strong{
  font-size: 11px;
}
.modal .calculation-note{
  font-size: 10px;
  line-height: 1.7;
  color: #859078;
  margin: 13px 3px 1px;
}
.checkout-confirmation .checkout-consent{
  font-size: 11px;
  margin: 11px 0;
  gap: 9px;
  align-items: center;
  min-height: 25px;
}
.checkout-confirmation .checkout-consent:last-of-type{
  margin-bottom: 22px;
}
.checkout-confirmation .checkout-consent input{
  height: 18px;
  width: 18px;
}
.checkout-confirmation .primary-button{
  border-radius: 14px;
  min-height: 53px;
}
.checkout-confirmation button[type="submit"]{
  font-size: 14px;
  font-weight: 600;
}
@media (max-width: 359px) {
  .checkout-payment-card{
    padding: 22px;
  }
  .checkout-renewal{
    padding: 13px 15px;
    gap: 8px;
  }
  .checkout-renewal > strong{
    font-size: 13px;
  }
  .checkout-renewal small{
    font-size: 9px;
  }
  .checkout-renewal > span{
    font-size: 11px;
  }
  .cost-row{
    gap: 12px;
    font-size: 11px;
  }
  .cost-row > b{
    font-size: 11px;
  }
  .checkout-confirmation .checkout-consent{
    font-size: 10px;
  }
}
@media (max-width: 600px) and (max-height: 700px) {
  .modal:has(.checkout-payment-card){
    padding: 22px 22px 18px;
  }
  .checkout-heading{
    margin-bottom: 14px;
  }
  .checkout-heading .eyebrow{
    display: none;
  }
  .modal .checkout-heading h2{
    font-size: 24px;
    line-height: 1.2;
  }
  .checkout-payment-card{
    padding: 20px;
    border-radius: 19px;
  }
  .checkout-card-brand > span{
    font-size: 21px;
    line-height: 1;
  }
  .checkout-card-brand small{
    font-size: 10px;
  }
  .checkout-payment-card .checkout-total{
    margin: 16px 0 0;
  }
  .checkout-payment-card .checkout-total > span{
    font-size: 11px;
    margin-bottom: 6px;
  }
  .checkout-payment-card .checkout-total strong{
    font-size: 34px;
    line-height: 1.1;
  }
  .checkout-card-caption{
    display: none;
  }
  .checkout-renewal{
    margin-top: 8px;
    padding: 11px 14px;
  }
  .checkout-calculation{
    margin: 14px 0 16px;
  }
  .checkout-calculation > summary{
    padding: 12px 14px;
    min-height: 62px;
  }
  .calculation-symbol{
    width: 32px;
    height: 32px;
  }
  .checkout-confirmation .checkout-consent{
    min-height: 21px;
    margin: 8px 0;
  }
  .checkout-confirmation .checkout-consent:last-of-type{
    margin-bottom: 17px;
  }
  .checkout-confirmation .primary-button{
    min-height: 48px;
  }
}
.admin-body input.card-number-input{
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-variant-numeric: tabular-nums;
  letter-spacing: 1.2px;
  font-size: 16px !important;
}
.admin-body input.card-number-input::placeholder{
  letter-spacing: 0.6px;
  color: #a0aa97;
}
.wallet-card-select{
  min-width: 0;
  max-width: 65%;
  border: 0;
  background: #f5f7f1;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 11px;
  color: #697a5b;
  text-overflow: ellipsis;
}
.service-badge[data-state="suspended"]{
  background: #f7efe1;
  color: #94774c;
}
.purchase-presets + .primary-button{
  margin-top: 20px;
}
.checkout-payment-card:has(.checkout-credit) .checkout-total{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0 14px;
  container-type: inline-size;
}
.checkout-payment-card:has(.checkout-credit) .checkout-total > strong{
  grid-column: 1;
  font-size: clamp(23px, 11.5cqw, 42px);
  white-space: nowrap;
  letter-spacing: -1px;
}
.checkout-credit{
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 9px;
  text-align: right;
}
.checkout-credit > span{
  font-size: 11px;
  color: #b8cbb0;
  line-height: 1.5;
}
.checkout-payment-card .checkout-total .checkout-credit > strong{
  color: #e4f5cb;
  font-size: clamp(18px, 6cqw, 22px);
  line-height: 1.12;
  font-weight: 550;
  letter-spacing: -0.6px;
  white-space: nowrap;
}
.issued-card-bottom small{
  font-size: 11px;
  letter-spacing: 1.1px;
  opacity: 0.8;
}
.issued-card-bottom span{
  font-size: 16px;
  line-height: 1.4;
  min-height: 22px;
}
.issued-card-bottom{
  gap: 16px;
}
.reveal-actions{
  grid-template-columns: 1fr;
}
@media (max-width: 700px) {
  .issued-card{
    min-height: 220px;
  }
  .issued-card-bottom small{
    font-size: 10px;
  }
  .issued-card-bottom span{
    font-size: 15px;
  }
  .issued-card-bottom{
    gap: 13px;
  }
}
.cost-funding .cost-row > span{
  max-width: 75%;
  line-height: 1.6;
}
.plata-icon{
  display: block;
  flex-shrink: 0;
}
.modal-close,.admin-body .modal-close{
  display: grid;
  place-items: center;
  padding: 0;
  line-height: 1;
  font-size: 0;
}
.modal-close > .plata-icon,.admin-body .modal-close > .plata-icon{
  display: block;
  width: 18px;
  height: 18px;
  margin: 0;
  stroke-width: 1.8;
}
.calculation-symbol > .plata-icon{
  display: block;
  width: 21px;
  height: 21px;
  margin: 0;
  stroke-width: 1.8;
}


.plata-lockup{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:inherit;
  line-height:1;
  white-space:nowrap;
}
.plata-mark{
  position:relative;
  display:inline-grid;
  place-items:center;
  width:29px;
  height:29px;
  flex:0 0 29px;
  border-radius:9px;
  overflow:hidden;
  background:linear-gradient(145deg,#1769ff 0%,#1b7ef0 54%,#18b86a 100%);
  box-shadow:0 5px 14px #1769ff24;
}
.plata-mark i{
  position:absolute;
  display:block;
}
.plata-mark i:nth-child(1){
  inset:6px;
  border:4px solid #fff;
  border-radius:50%;
}
.plata-mark i:nth-child(2){
  width:14px;
  height:4px;
  border-radius:999px;
  background:#d9ffe9;
  transform:rotate(-31deg);
}
.plata-mark i:nth-child(3){display:none}
.plata-word{
  display:inline-block;
  font-weight:790;
  letter-spacing:-1.2px;
}
.public-brand .plata-word{font-size:32px}
.admin-sidebar .brand .plata-word{font-size:24px}
.legal-page .brand .plata-word{font-size:28px}


/* Legal pages use the same neutral fintech language as the current Mini App. */
.legal-page{
  background:#f6f7f9;
  color:#15171b;
}
.legal-page main{
  max-width:820px;
  padding:34px 28px 72px;
}
.legal-page .brand{
  display:inline-flex;
  margin-bottom:24px;
}
.legal-page nav{
  gap:7px 16px;
  margin:10px 0 44px;
  padding:14px 0;
  border-top:1px solid #e5e8ed;
  border-bottom:1px solid #e5e8ed;
  color:#737982;
}
.legal-page nav a{
  color:#737982;
  font-size:11px;
  text-decoration:none;
}
.legal-page nav a:hover{color:#2563eb}
.legal-page h1{
  max-width:680px;
  margin:0;
  color:#15171b;
  font-size:clamp(32px,6vw,48px);
  line-height:1.02;
  letter-spacing:-1.9px;
}
.legal-page .legal-version{
  margin:14px 0 30px;
  color:#9aa0a8;
  font-size:10px;
}
.legal-page .legal-text{
  max-width:720px;
  margin:0 0 34px;
  color:#555c65;
  font-size:14px;
  line-height:1.85;
}
.legal-page aside{
  border:0;
  border-radius:12px;
  background:#f0f3f7;
  color:#68717c;
}
.legal-page main>a:last-child{
  display:inline-flex;
  padding-top:14px;
  border-top:1px solid #e5e8ed;
  color:#2563eb;
  font-size:12px;
  text-decoration:none;
}
@media(max-width:600px){
  .legal-page main{padding:24px 20px 56px}
  .legal-page nav{margin-bottom:34px}
  .legal-page h1{font-size:34px;letter-spacing:-1.4px}
  .legal-page .legal-text{font-size:13px;line-height:1.8}
}


/* Legal document pages are intentionally single-document views. */
.legal-page main>a:last-child{
  padding-top:0;
  border-top:0;
}
