.garage-button { font-size: 19px; padding: 9px 12px; min-width: 0; }
.garage-dialog { width: min(680px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); margin: auto; padding: 26px; border: 3px solid #fff; border-radius: 24px; background: #161a3a; color: white; box-shadow: 0 12px 0 #090d24, 0 28px 90px #0009; overflow: auto; user-select: text; }
.garage-dialog::backdrop { background: #080b21c9; backdrop-filter: blur(7px); }
.garage-dialog [hidden] { display: none !important; }
.garage-dialog h2, .garage-dialog h3, .garage-dialog h4 { font-family: var(--display); letter-spacing: .8px; font-weight: 400; }
.garage-dialog h2 { margin: 5px 0 0; font-size: 32px; color: #ffd23f; }
.garage-dialog h3 { margin: 0 0 12px; font-size: 24px; }
.garage-dialog h4 { font-size: 21px; margin: 0 0 12px; }
.garage-dialog p { line-height: 1.6; font-size: 14px; }
.garage-head { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.garage-eyebrow { color: #3de0ff; font-size: 11px; letter-spacing: 2px; }
.garage-close { border: 2px solid #7f87ba; border-radius: 50%; width: 42px; height: 42px; flex: 0 0 42px; background: #2c35a0; cursor: pointer; font-size: 20px; }
.garage-intro { color: #ced4f5; }
.onramp-mode { padding: 10px 14px; border: 1px solid #6b79ba; border-radius: 10px; font-size: 12px; letter-spacing: 1px; background: #233664; margin-bottom: 18px; }
.onramp-mode[data-environment="production"] { background: #5d331b; border-color: #ffb857; }
.garage-card { padding: 20px; border: 1px solid #586193; border-radius: 18px; background: #101430; margin: 16px 0; }
.garage-dialog .btn { min-width: 0; font-size: 19px; padding: 11px 18px; }
.garage-dialog .btn:disabled { opacity: .45; cursor: not-allowed; transform: none; filter: none; }
.garage-dialog :focus-visible { outline: 3px solid #3de0ff; outline-offset: 4px; }
.garage-dialog a { color: #7ceaff; }
.onramp-availability { color: #c0c9ee; }
.wallet-row { display: flex; gap: 12px; align-items: center; margin-top: 20px; }
.wallet-address, .order-reference { overflow-wrap: anywhere; color: #bdc9f2; font-size: 12px !important; }
.wallet-disconnect { background: transparent; border: 1px solid #919ac4; border-radius: 8px; padding: 8px 12px; cursor: pointer; }
.funding-form { margin-top: 22px; }
.funding-form label { font-size: 13px; display: block; line-height: 1.5; }
.funding-amount { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 2px solid #6377b1; background: #080e23; border-radius: 12px; margin: 10px 0 18px; font-family: var(--display); font-size: 28px; }
.funding-amount input { width: 100%; min-width: 0; background: transparent; color: white; border: 0; font: inherit; user-select: text; }
.funding-review { margin-top: 26px; border-top: 1px solid #586193; padding-top: 20px; }
.funding-review dl { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; font-size: 13px; }
.funding-review dd { margin: 0; text-align: right; overflow-wrap: anywhere; color: #ffd23f; }
.funding-consent { display: flex; align-items: flex-start; gap: 10px; margin: 20px 0; font-size: 12px; line-height: 1.7; }
.funding-consent input { width: 20px; height: 20px; flex: 0 0 20px; margin-top: 3px; accent-color: #ffcf3a; }
.continue-button { width: 100%; }
.coinbase-frame iframe { width: 100%; height: 590px; border: 0; background: white; border-radius: 12px; margin-top: 22px; }
.funding-error { color: #ffafb4; }
.funding-notice { color: #ffe184; }
.garage-back { width: 100%; margin: 10px 0; }
.new-funding { margin-top: 18px; }
@media (max-width: 600px) { .garage-dialog { padding: 18px; } .garage-dialog h2 { font-size: 25px; } .garage-card { padding: 14px; } .garage-dialog .btn { font-size: 17px; } .coinbase-frame iframe { height: 610px; } }
@media (prefers-reduced-motion: reduce) { .garage-dialog *, .garage-button { animation: none !important; transition: none !important; } }
