.checkout-dialog{
  width:min(540px,calc(100% - 32px));
  max-height:calc(100dvh - 40px);
  padding:0;
  background:#152329;
  border-color:#42545c;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:#70878a transparent;
}
.flow-header{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 28px 12px;background:#152329}
.flow-brand{margin:0;gap:10px}
.flow-brand strong{font-size:24px}
.checkout-dialog .dialog-close{position:static;flex:none;width:40px;height:40px;border:0;background:transparent;color:#bdcfce}
.checkout-dialog .dialog-close:hover{background:#ffffff0a;color:var(--white)}
.checkout-dialog .dialog-close .icon{width:20px;height:20px}
.checkout-dialog [data-flow-panel]{padding:0 32px 28px}
.checkout-dialog h2{font-size:28px;letter-spacing:-.045em;line-height:1.25;margin:20px 0 30px}
.checkout-plans{border:0;min-width:0;padding:0;margin:0}
.checkout-plans legend{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0;margin-bottom:16px;font-size:12px;color:#aabcbf}
.checkout-jump{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:5px 0 5px 10px;background:none;border:0;font-size:12px;color:var(--mint)}
.checkout-jump .icon{width:15px;height:15px}
.checkout-plan-grid{display:grid;gap:8px}
.checkout-option{position:relative;isolation:isolate;overflow:clip;display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:13px;min-height:72px;padding:12px 15px;border:1px solid #374e53;border-radius:12px;background:#16282a;cursor:pointer;transition:border-color .25s,background .25s,box-shadow .25s}
.checkout-option:hover{background:#1c3232;border-color:#7a9d8a}
.checkout-option:has(input:checked){background:#2d473b;border-color:var(--mint);box-shadow:inset 0 0 0 1px #b9ddc417}
.checkout-option:has(input:focus-visible){outline:2px solid var(--mint);outline-offset:3px}
.checkout-option input{position:relative;z-index:1;width:17px;height:17px;margin:0;accent-color:var(--mint);cursor:pointer}
.checkout-option input:focus-visible{outline:none}
.checkout-option-copy{position:relative;z-index:1;min-width:0;display:grid;gap:3px}
.checkout-option-copy strong{font-size:14px;line-height:1.5;font-weight:550;color:#ebf3ee}
.checkout-option-copy small{font-size:11px;line-height:1.5;color:#a8bdb4}
.checkout-option-price{position:relative;z-index:1;white-space:nowrap;font-size:18px;line-height:1.5;font-weight:550;letter-spacing:-.035em;color:#e6f2e9}
.checkout-option-long .checkout-option-price{padding:3px 7px;border:1px solid #b9ddc426;border-radius:7px;background:#b9ddc410;color:var(--mint)}
.checkout-option-year .checkout-option-price{color:#d5dfff;border-color:#b9caff30;background:#b9caff10}
.checkout-option-year:has(input:checked){background:#2d3d4d;border-color:var(--lavender)}
.checkout-option-long:has(input:checked):after{content:"";position:absolute;inset:0 auto 0 -50%;width:45%;z-index:0;background:linear-gradient(90deg,transparent,#b9ddc426,transparent);animation:checkout-selection 5s ease-in-out infinite;pointer-events:none}
.checkout-option-year:has(input:checked):after{background:linear-gradient(90deg,transparent,#b9caff30,transparent)}
.checkout-summary{display:flex;align-items:center;justify-content:space-between;gap:18px;border-block:1px solid #3d5156;margin-top:10px;padding:21px 0;font-size:15px}
.checkout-summary>span{line-height:1.5}
.checkout-summary>strong{display:grid;gap:3px;white-space:nowrap;text-align:right;font:600 25px/1.4 Manrope,Inter,sans-serif;letter-spacing:-.035em}
.checkout-summary small{font:400 10px/1.5 Inter,sans-serif;color:#9eafb8;letter-spacing:0}
.checkout-seller{font-size:10px;line-height:1.8;color:#a0afb6;margin:14px 0 24px}
.checkout-email{font-size:12px;color:#d4dfe2}
.checkout-email input{min-height:46px;background:#101b24;border-color:#3c515b;border-radius:11px;padding:11px 13px;font-size:14px}
.email-caption{font-size:12px;line-height:1.7;color:#a4b6be;margin-top:8px}
.checkout-methods{margin:24px 0 16px}
.checkout-methods>p{font-size:12px;color:#bdccd2;margin:0 0 9px}
.checkout-methods>div{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.checkout-methods button{min-height:49px;border:1px solid #40565b;border-radius:12px;background:transparent;color:#e1ebef;font-size:13px;font-weight:600;transition:background .2s,color .2s,border-color .2s}
.checkout-methods button[aria-pressed=true]{background:var(--mint);border-color:var(--mint);color:#19382b}
.checkout-methods button:hover{border-color:var(--mint)}
.checkout-conditions,.checkout-consent{font-size:12px;line-height:1.8;color:#a9b9c1;margin:14px 0}
.checkout-conditions a,.checkout-consent a{color:#c1d8cb;text-decoration:underline;text-underline-offset:3px}
.checkout-pay{min-height:50px;margin-top:7px;opacity:.78;font-size:14px}
.flow-demo-note{font-size:11px}
.flow-preview-link{font-size:12px;min-height:40px;margin-top:13px}
.checkout-dialog [data-flow-panel=connection] h2{margin-bottom:18px}
@keyframes checkout-selection{0%,15%{transform:translateX(0) skewX(-25deg)}85%,100%{transform:translateX(360%) skewX(-25deg)}}
@media(max-width:600px){
  .checkout-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);border-radius:20px;padding:0}
  .flow-header{padding:14px 17px 8px;gap:12px}
  .flow-brand{margin:0}
  .checkout-dialog [data-flow-panel]{padding:0 21px 23px}
  .checkout-dialog h2{font-size:26px;margin:18px 0 23px}
  .checkout-email input{font-size:16px}
  .checkout-option{gap:11px;padding:12px;min-height:70px}
  .checkout-option-price{font-size:17px}
}
@media(max-width:360px){
  .checkout-dialog [data-flow-panel]{padding-inline:16px}
  .checkout-option{gap:9px;padding:11px 9px;grid-template-columns:17px minmax(0,1fr) auto}
  .checkout-option-copy strong{font-size:13px}
  .checkout-option-copy small{font-size:10px}
  .checkout-option-price{font-size:16px}
  .checkout-option-long .checkout-option-price{padding-inline:4px}
  .checkout-summary{font-size:13px;gap:10px}
  .checkout-summary>strong{font-size:23px}
  .checkout-jump,.checkout-plans legend{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.checkout-option,.checkout-methods button{transition:none}.checkout-option-long:has(input:checked):after{animation:none}}

#connection-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0 18px;
}
#connection-title .icon { width: 27px; height: 27px; flex: none; color: var(--mint); }
.access-key {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid #587767;
  border-radius: 13px;
  background: linear-gradient(120deg, #263e34, #1b3033 70%, #1f3340);
}
.access-key div { display: grid; gap: 4px; min-width: 0; }
.access-key span, .device-choice label, .client-choice legend { font-size: 13px; color: #c5d5d5; }
.access-key code { color: #e0f6e6; font: 600 18px/1.4 ui-monospace, monospace; letter-spacing: .025em; user-select: all; }
.access-key button, .device-choice select {
  min-height: 44px;
  padding: 0 10px;
  color: var(--mint);
  border: 1px solid #546c64;
  border-radius: 8px;
  background: #17292a;
  font: inherit;
  font-size: 12px;
}
.key-feedback { font-size: 12px; color: var(--mint); margin: 6px 0 0; }
.key-feedback:empty { margin: 0; }
.device-choice { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 14px 0; }
.device-picker { position: relative; display: inline-flex; min-width: 0; }
.device-picker select {
  appearance: none;
  padding-inline: 12px 40px;
  max-width: 100%;
  color: var(--white);
  background: #18262f;
  cursor: pointer;
}
.device-picker .icon {
  position: absolute;
  top: 50%;
  inset-inline-end: 14px;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  pointer-events: none;
  color: #c5d5d5;
}
.client-choice { border: 0; margin: 0; padding: 0; min-width: 0; }
.client-choice legend { margin: 0 0 7px; padding: 0; }
.client-choice label {
  display: grid;
  align-items: center;
  grid-template-columns: 30px 1fr 18px;
  gap: 12px;
  min-height: 47px;
  margin-bottom: 5px;
  padding: 7px 12px;
  border: 1px solid #364b53;
  border-radius: 10px;
  background: #16262e;
  color: var(--white);
  cursor: pointer;
  transition: border-color .2s, background .2s;
}
.client-choice label:has(:checked) { border-color: var(--mint); background: #274037; }
.client-choice label:has(:focus-visible) { outline: 2px solid var(--lavender); outline-offset: 1px; }
.client-choice img { width: 30px; height: 30px; border-radius: 8px; }
.client-choice input { width: 17px; height: 17px; margin: 0; accent-color: var(--mint); }
.connection-actions { display: grid; gap: 7px; margin-top: 13px; }
.connection-actions .button, .import-preview { min-height: 46px; padding: 10px 16px; font-size: 14px; }
.import-preview { display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid #445662; border-radius: 12px; background: #1b2b34; color: #c1cbd3; }
.import-preview .icon { width: 17px; height: 17px; }
.connection-actions p { margin: 3px 0 0; font-size: 12px; line-height: 1.6; color: #b1bfc9; }
.connection-actions [hidden] { display: none; }

.checkout-dialog [hidden] { display: none !important; }
.checkout-pay:enabled { opacity: 1; cursor: pointer; }
.checkout-pay:disabled { cursor: wait; }
.access-key code { overflow-wrap: anywhere; font-size: 14px; }
[data-checkout-status]:empty { display: none; }
[data-open-bank] { color: var(--mint, #b9ddc4); text-decoration: underline; }
.bank-wait { min-height: 100dvh; display: grid; align-content: center; justify-items: center; gap: 24px; text-align: center; padding: 24px; }
.bank-wait h1 { font-size: clamp(26px, 5vw, 46px); }