.trial-banner{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:12px;margin-bottom:24px;padding:20px;box-shadow:0 4px 12px #667eea33}.trial-banner.warning{background:linear-gradient(135deg,#ff9800 0%,#f57c00 100%);box-shadow:0 4px 12px #ff980033}.trial-banner.critical{background:linear-gradient(135deg,#f44336 0%,#d32f2f 100%);box-shadow:0 4px 12px #f4433633}.trial-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.trial-info{flex:1;align-items:center;gap:12px;display:flex}.trial-icon{font-size:24px}.trial-text{flex-direction:column;gap:4px;display:flex}.trial-title{font-size:16px;font-weight:600}.trial-subtitle{opacity:.9;font-size:12px}.convert-btn{color:#667eea;cursor:pointer;white-space:nowrap;background:#fff;border:none;border-radius:8px;padding:10px 20px;font-size:13px;font-weight:600;transition:all .2s}.convert-btn:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003}.trial-banner.warning .convert-btn{color:#ff9800}.trial-banner.critical .convert-btn{color:#f44336}.trial-usage{flex-direction:column;gap:12px;display:flex}.usage-item{flex-direction:column;gap:6px;display:flex}.usage-label{justify-content:space-between;align-items:center;font-size:13px;font-weight:500;display:flex}.usage-count{opacity:.9;font-size:12px}.usage-progress-bar{background:#ffffff4d;border-radius:3px;height:6px;overflow:hidden}.usage-progress-fill{background:#fff;border-radius:3px;height:100%;transition:width .3s}.usage-progress-fill.warning{background:#ffeb3b}.usage-progress-fill.critical{background:#ff5252}@media (max-width:768px){.trial-header{flex-direction:column;align-items:flex-start;gap:12px}.convert-btn{width:100%}.trial-icon{font-size:20px}.trial-title{font-size:14px}.trial-subtitle{font-size:11px}}
.plans-page{background:#fafafa;min-height:100vh;padding:30px 20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Inter,Roboto,sans-serif}.plans-container{max-width:1100px;margin:0 auto}.loading-state{text-align:center;padding:40px 20px}.spinner{border:4px solid #e0e0e0;border-top-color:#000;border-radius:50%;width:48px;height:48px;margin:0 auto 20px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.plans-header{text-align:center;margin-bottom:30px}.plans-logo{color:#2c2c2c;margin-bottom:20px;font-size:22px;font-weight:600}.plans-title{color:#2c2c2c;margin-bottom:10px;font-size:28px;font-weight:600}.plans-subtitle{color:#666;font-size:15px;line-height:1.5}.billing-toggle{justify-content:center;align-items:center;gap:12px;margin-bottom:28px;display:flex}.toggle-label{color:#666;font-size:13px;transition:all .2s}.toggle-label.active{color:#2c2c2c;font-weight:600}.toggle-switch{cursor:pointer;background:#e5e5e5;border-radius:13px;width:48px;height:26px;transition:background .3s;position:relative}.toggle-switch.annual{background:#7fa69c}.toggle-slider{background:#fff;border-radius:50%;width:20px;height:20px;transition:transform .3s;position:absolute;top:3px;left:3px;box-shadow:0 2px 4px #0003}.toggle-switch.annual .toggle-slider{transform:translate(22px)}.save-badge{color:#7fa69c;text-transform:uppercase;letter-spacing:.5px;background:#7fa69c1a;border-radius:20px;padding:5px 12px;font-size:11px;font-weight:600}.plans-grid{flex-wrap:wrap;justify-content:center;align-items:stretch;gap:16px;margin-bottom:40px;display:flex}.plans-grid>*{flex:0 0 340px;width:340px;min-width:340px;max-width:340px}.comparison-section{text-align:center;margin-bottom:40px}.comparison-link{color:#06c;cursor:pointer;font-size:13px;text-decoration:none;transition:all .2s}.comparison-link:hover{text-decoration:underline}@media (max-width:768px){.plans-grid{flex-direction:column;align-items:center}.plans-grid>*{flex:0 0 340px;width:340px;min-width:340px;max-width:340px}.plans-title{font-size:24px}.plans-page{padding:20px 10px}}@media (max-width:380px){.plans-grid>*{flex:none;width:calc(100vw - 40px);min-width:280px;max-width:340px}}@media (max-width:1024px) and (min-width:769px){.plans-grid>*{flex:0 0 340px;width:340px;min-width:340px;max-width:340px}}.modal-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:#fff;border-radius:12px;width:90%;max-width:400px;padding:24px;box-shadow:0 8px 32px #0003}.modal-title{color:#000;margin-bottom:12px;font-size:18px;font-weight:600}.modal-message{color:#333;margin-bottom:20px;font-size:14px;line-height:1.5}.modal-btn{color:#fff;cursor:pointer;background:#000;border:none;border-radius:6px;width:100%;padding:10px;font-size:14px;font-weight:500;transition:background .2s}.modal-btn:hover{background:#333}