/* Native billing dialog: existing panel, type, actions, focus and paper palette. */
#cardTrialDialog { width:min(460px,calc(100vw - 24px)); max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); margin:auto; padding:0; overflow:auto; border:1px solid var(--border); border-radius:14px; background:var(--surface); color:var(--text); box-shadow:0 24px 70px rgba(20,17,14,.24); font:15px/1.5 var(--ui-font); zoom:calc(1 / var(--app-scale,1)); }
#cardTrialDialog::backdrop { background:rgba(26,26,24,.58); }
#cardTrialDialog .billing-membership-close { width:44px; height:44px; min-height:44px; padding:0; }
.card-trial-panel { position:relative; text-align:center; padding:28px; }
#cardTrialTitle { margin:8px 0; font:400 28px/1.12 var(--card-title-font); letter-spacing:-.025em; outline:none; }
.card-trial-intro { margin:0 0 18px; color:var(--text2); font-size:14px; }
.card-trial-search { display:flex; align-items:center; justify-content:center; gap:8px; padding:10px 12px; border:1px solid var(--border); border-radius:4px; font-size:13px; overflow-wrap:anywhere; }
.card-trial-check { color:var(--green); font-weight:700; }
.card-trial-price { text-align:left; padding:20px 0 8px; color:var(--green); }
.card-trial-price strong { font:400 38px/1 var(--card-title-font); letter-spacing:-.03em; }
.card-trial-price strong span { font:400 16px var(--ui-font); letter-spacing:0; }
.card-trial-renewal { margin:0; text-align:left; font-size:13px; color:var(--text2); }
.card-trial-renewal strong { color:var(--text); font-weight:600; }
.card-trial-actions { display:grid; grid-template-columns:1fr; gap:8px; margin-top:22px; }
.card-trial-actions button { min-height:44px; }
.card-trial-secure { margin:12px 0 0; font-size:11px; color:var(--text2); }
.card-trial-panel [data-card-trial-error] { margin:14px 0 0; text-align:left; }
.card-trial-scout { position:relative; display:block; width:132px; height:112px; margin:0 auto 14px; animation:card-trial-hello 900ms ease-out both; }
.card-trial-scout img { display:block; width:116px; height:112px; }
.card-trial-card { position:absolute; width:64px; height:42px; right:-2px; bottom:12px; background:var(--green); border:1px solid var(--text); border-radius:5px; transform:rotate(-12deg); animation:card-trial-present 1200ms ease-out both; }
.card-trial-chip { position:absolute; width:12px; height:10px; top:9px; left:8px; border:1px solid #fffdf8; border-radius:2px; }
.card-trial-card-line { position:absolute; bottom:9px; left:8px; width:25px; height:3px; background:#fffdf8; opacity:.8; border-radius:2px; }
.card-trial-card-dot { position:absolute; bottom:8px; right:8px; width:9px; height:9px; border:1px solid #fffdf8; border-radius:50%; }
.card-trial-hand { position:absolute; width:20px; height:12px; right:45px; bottom:22px; background:var(--accent); border:1px solid var(--surface); border-radius:9px; transform:rotate(-18deg); }
.card-trial-spark { position:absolute; top:8px; right:-4px; color:var(--green); font-size:22px; animation:card-trial-spark 1400ms ease-out both; }
@keyframes card-trial-hello { 0% { transform:translateY(10px) rotate(-5deg); opacity:0; } 60% { transform:translateY(-3px) rotate(2deg); opacity:1; } 100% { transform:none; } }
@keyframes card-trial-present { 0%,25% { transform:translateY(8px) rotate(5deg); } 65% { transform:translateY(-4px) rotate(-16deg); } 100% { transform:rotate(-12deg); } }
@keyframes card-trial-spark { 0%,45% { opacity:0; transform:scale(.5); } 70% { opacity:1; transform:scale(1.2); } 100% { opacity:1; transform:scale(1); } }
@media(max-width:520px) { .card-trial-panel { padding:24px 20px; } #cardTrialTitle { font-size:26px; } }
@media(prefers-reduced-motion:reduce) { .card-trial-scout,.card-trial-card,.card-trial-spark { animation:none; } }
