:root{--primary-dark:#0d0d1a;--surface-dark:#141428;--card-dark:#1c1c3a;--accent-purple:#7c5cfc;--accent-blue:#4ea8de;--accent-cyan:#56cfe1;--accent-pink:#ff6b9d;--text-primary:#f0f0f8;--text-secondary:#9090b0;--text-muted:#606080;--success-green:#4ade80;--error-red:#ff6b6b;--border-color:#2a2a50;--gradient-accent:linear-gradient(135deg, var(--accent-purple), var(--accent-blue));--gradient-button:linear-gradient(90deg, var(--accent-purple), #6b4fe0, var(--accent-blue));--gradient-glass:linear-gradient(135deg, #ffffff1a, #ffffff08);--gradient-bg:linear-gradient(135deg, #0d0d1a, #121230, #0d0d1a);--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-round:100px;--shadow-glow:0 0 20px -2px #7c5cfc4d;--shadow-soft:0 8px 16px #0000004d;--font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--transition-fast:.2s cubic-bezier(.4, 0, .2, 1);--transition-normal:.3s cubic-bezier(.4, 0, .2, 1);--transition-slow:.5s cubic-bezier(.4, 0, .2, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-family);background:var(--primary-dark);color:var(--text-primary);min-height:100dvh;line-height:1.5;overflow-x:hidden}#app{min-height:100dvh;position:relative}input,button,select,textarea{font-family:inherit;font-size:inherit}button{cursor:pointer;color:inherit;background:0 0;border:none}a{color:inherit;text-decoration:none}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:var(--radius-round)}.bg-canvas{z-index:0;pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0}.screen{z-index:1;min-height:100dvh;animation:.6s ease-out fadeSlideIn;position:relative}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.glass-card{background:var(--gradient-glass);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);border:1px solid #ffffff14}.input-field{border:1px solid var(--border-color);border-radius:var(--radius-md);width:100%;color:var(--text-primary);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);background:#1c1c3a99;outline:none;padding:16px 20px;font-size:14px}.input-field::placeholder{color:var(--text-muted)}.input-field:focus{border-color:var(--accent-purple);box-shadow:0 0 0 3px #7c5cfc1f}.input-field.error{border-color:var(--error-red)}.input-with-icon{position:relative}.input-with-icon .input-icon{color:var(--text-muted);pointer-events:none;font-size:18px;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.input-with-icon .input-field{padding-left:48px}.btn-gradient{border-radius:var(--radius-md);background:var(--gradient-button);color:#fff;letter-spacing:.5px;width:100%;height:56px;box-shadow:var(--shadow-glow);transition:transform var(--transition-fast), opacity var(--transition-fast), box-shadow var(--transition-fast);justify-content:center;align-items:center;gap:8px;font-size:16px;font-weight:600;display:flex;position:relative;overflow:hidden}.btn-gradient:before{content:"";background:linear-gradient(90deg,#0000,#ffffff1a,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.btn-gradient:hover:before{left:100%}.btn-gradient:hover{transform:translateY(-1px);box-shadow:0 0 30px -2px #7c5cfc66}.btn-gradient:active{transform:translateY(0)}.btn-gradient:disabled{opacity:.5;cursor:not-allowed;background:var(--card-dark);box-shadow:none}.sport-chip{border-radius:var(--radius-round);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-normal);white-space:nowrap;-webkit-user-select:none;user-select:none;background:#ffffff0d;border:1px solid #ffffff1a;padding:8px 14px;font-size:13px;font-weight:400}.sport-chip:hover{background:#ffffff14}.sport-chip.active{background:var(--gradient-button);color:#fff;border-color:#0000;font-weight:600;box-shadow:0 0 12px -2px #7c5cfc40}.badge{letter-spacing:.3px;border-radius:6px;align-items:center;padding:3px 10px;font-size:11px;font-weight:600;display:inline-flex}.badge-pending{color:var(--accent-blue);background:#4ea8de26}.badge-won{color:var(--success-green);background:#4ade8026}.badge-lost{color:var(--error-red);background:#ff6b6b26}.badge-void{color:var(--text-muted);background:#60608026}.stat-mini{border-radius:var(--radius-md);transition:transform var(--transition-fast);flex-direction:column;flex:1;align-items:center;gap:6px;padding:14px 12px;display:flex}.stat-mini:hover{transform:translateY(-2px)}.stat-mini .stat-icon{font-size:20px}.stat-mini .stat-value{font-size:16px;font-weight:700}.stat-mini .stat-label{color:var(--text-muted);font-size:11px}.toast{background:var(--card-dark);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);z-index:1000;opacity:0;transition:all var(--transition-normal);pointer-events:none;box-shadow:var(--shadow-soft);padding:14px 24px;font-size:14px;font-weight:500;position:fixed;bottom:100px;left:50%;transform:translate(-50%)translateY(100px)}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}.modal-overlay{-webkit-backdrop-filter:blur(4px);z-index:900;background:#0009;justify-content:center;align-items:center;width:100%;height:100%;padding:24px;animation:.2s ease-out fadeIn;display:flex;position:fixed;top:0;left:0}.modal-content{background:var(--card-dark);border-radius:var(--radius-lg);width:100%;max-width:360px;padding:28px;animation:.3s ease-out scaleIn}.modal-title{margin-bottom:10px;font-size:18px;font-weight:600}.modal-message{color:var(--text-secondary);margin-bottom:24px;font-size:14px;line-height:1.5}.modal-actions{justify-content:flex-end;gap:12px;display:flex}.modal-btn{border-radius:var(--radius-sm);transition:background var(--transition-fast);padding:10px 20px;font-size:14px;font-weight:500}.modal-btn-cancel{color:var(--text-muted)}.modal-btn-cancel:hover{background:#ffffff0d}.modal-btn-danger{color:var(--error-red)}.modal-btn-danger:hover{background:#ff6b6b1a}.modal-btn-accent{color:var(--accent-pink)}.modal-btn-accent:hover{background:#ff6b9d1a}.error-box{border-radius:var(--radius-sm);background:#ff6b6b1a;border:1px solid #ff6b6b4d;align-items:center;gap:10px;margin-bottom:18px;padding:12px 14px;animation:.3s ease-out fadeIn;display:flex}.error-box .error-icon{color:var(--error-red);flex-shrink:0;font-size:18px}.error-box .error-text{color:var(--error-red);font-size:13px}.spinner{border:2.5px solid #0000;border-top-color:var(--accent-purple);border-radius:50%;width:24px;height:24px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-screen{justify-content:center;align-items:center;min-height:100dvh;display:flex}.text-gradient{background:var(--gradient-accent);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.profit-positive{color:var(--success-green)}.profit-negative{color:var(--error-red)}.profit-neutral{color:var(--text-secondary)}.login-screen{justify-content:center;align-items:center;min-height:100dvh;padding:28px;display:flex}.login-container{text-align:center;width:100%;max-width:420px}.login-logo{background:var(--gradient-accent);border-radius:var(--radius-xl);width:80px;height:80px;box-shadow:var(--shadow-glow);justify-content:center;align-items:center;margin:0 auto 16px;font-size:40px;display:flex}.login-title{letter-spacing:-.5px;margin-bottom:8px;font-size:32px;font-weight:800}.login-subtitle{color:var(--text-secondary);margin-bottom:40px;font-size:16px}.login-form{text-align:left;padding:28px}.login-form .input-group{margin-bottom:18px}.login-form .btn-gradient{margin-top:10px}.login-footer{color:var(--text-secondary);margin-top:32px;font-size:14px}.login-footer .link{cursor:pointer;transition:opacity var(--transition-fast);font-weight:600}.login-footer .link:hover{opacity:.8}.home-screen{padding-bottom:100px}.home-header{align-items:center;gap:14px;padding:16px 24px 8px;display:flex}.home-avatar{background:var(--gradient-accent);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;font-size:22px;font-weight:700;display:flex;box-shadow:0 0 12px -2px #7c5cfc4d}.home-greeting{flex:1;min-width:0}.home-greeting h2{white-space:nowrap;text-overflow:ellipsis;font-size:18px;font-weight:700;overflow:hidden}.home-greeting p{color:var(--text-muted);font-size:13px}.home-logout-btn{color:var(--text-muted);border-radius:var(--radius-sm);transition:background var(--transition-fast), color var(--transition-fast);padding:8px;font-size:22px}.home-logout-btn:hover{color:var(--text-secondary);background:#ffffff0d}.stats-section{padding:16px 24px 8px}.stats-balance{border-radius:var(--radius-lg);border:1px solid;width:100%;margin-bottom:12px;padding:22px}.stats-balance.positive{background:linear-gradient(135deg,#4ade801f,#56cfe10f);border-color:#4ade8033}.stats-balance.negative{background:linear-gradient(135deg,#ff6b6b1f,#ff6b9d0f);border-color:#ff6b6b33}.stats-balance-label{color:var(--text-secondary);margin-bottom:6px;font-size:13px;font-weight:500}.stats-balance-value{letter-spacing:-.5px;font-size:32px;font-weight:800;line-height:1.2}.stats-balance-sub{color:var(--text-muted);margin-top:4px;font-size:12px}.stats-row{gap:10px;display:flex}.bets-section{padding:20px 24px 0}.bets-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.bets-header h3{font-size:20px;font-weight:700}.bets-count{border-radius:var(--radius-round);color:var(--accent-purple);background:#7c5cfc26;padding:4px 10px;font-size:13px;font-weight:600}.bets-list{flex-direction:column;gap:10px;display:flex}.bet-card{border-radius:var(--radius-md);cursor:pointer;transition:transform var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast);background:linear-gradient(135deg,#ffffff0f,#ffffff05);border:1px solid #ffffff12;padding:16px;animation:.4s ease-out backwards slideUp}.bet-card:hover{background:linear-gradient(135deg,#ffffff14,#ffffff08);border-color:#ffffff1f;transform:translateY(-2px)}.bet-card-top{align-items:center;gap:8px;margin-bottom:10px;display:flex}.bet-card-sport{white-space:nowrap;background:#4ea8de1f;border-radius:6px;padding:3px 8px;font-size:12px}.bet-card-event{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-size:15px;font-weight:600;overflow:hidden}.bet-card-selection{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;margin-bottom:10px;font-size:13px;overflow:hidden}.bet-card-bottom{align-items:center;gap:6px;display:flex}.bet-card-date{color:var(--text-muted);font-size:12px}.bet-card-spacer{flex:1}.bet-card-odds{color:var(--accent-cyan);font-size:12px;font-weight:500}.bet-card-stake{color:var(--text-secondary);font-size:12px;font-weight:500}.bet-card-profit{font-size:14px;font-weight:700}.empty-state{text-align:center;margin:20px 0;padding:40px}.empty-state-icon{background:#7c5cfc1a;border-radius:50%;justify-content:center;align-items:center;width:72px;height:72px;margin:0 auto 20px;font-size:36px;display:flex}.empty-state-title{margin-bottom:8px;font-size:18px;font-weight:600}.empty-state-text{color:var(--text-muted);font-size:14px}.fab{background:var(--gradient-button);color:#fff;z-index:100;width:60px;height:60px;transition:transform var(--transition-fast), box-shadow var(--transition-fast);border-radius:50%;justify-content:center;align-items:center;font-size:30px;animation:.3s ease-out .3s backwards scaleIn;display:flex;position:fixed;bottom:30px;right:30px;box-shadow:0 4px 16px -2px #7c5cfc66}.fab:hover{transform:scale(1.08);box-shadow:0 6px 24px -2px #7c5cfc80}.fab:active{transform:scale(.95)}.add-bet-screen{padding-bottom:40px}.screen-appbar{align-items:center;gap:8px;padding:12px 8px;display:flex}.back-btn{color:var(--text-primary);border-radius:var(--radius-sm);transition:background var(--transition-fast);padding:8px;font-size:22px}.back-btn:hover{background:#ffffff0d}.screen-appbar h2{font-size:20px;font-weight:700}.sport-selector{margin-bottom:24px;padding:0 24px}.sport-selector-label{color:var(--text-secondary);margin-bottom:10px;font-size:14px;font-weight:500}.sport-chips{flex-wrap:wrap;gap:8px;display:flex}.add-bet-form{margin:0 24px;padding:24px}.form-row{gap:12px;display:flex}.form-row>*{flex:1}.form-group{margin-bottom:14px}.form-group label{color:var(--text-muted);margin-bottom:6px;font-size:12px;font-weight:500;display:block}.date-picker-btn{border:1px solid var(--border-color);border-radius:var(--radius-md);width:100%;color:var(--text-primary);text-align:left;transition:border-color var(--transition-fast);background:#1c1c3a99;align-items:center;gap:14px;padding:16px 20px;font-size:14px;display:flex}.date-picker-btn:hover{border-color:var(--accent-purple)}.date-picker-btn .date-icon{color:var(--text-muted);font-size:18px}.date-picker-btn .date-text{flex:1}.date-picker-btn .date-arrow{color:var(--text-muted);font-size:20px}textarea.input-field{resize:none;min-height:72px;line-height:1.5}.potential-win{border-radius:var(--radius-sm);background:#4ade8014;border:1px solid #4ade8033;justify-content:center;align-items:center;gap:8px;margin-bottom:20px;padding:14px;animation:.3s ease-out fadeIn;display:flex}.potential-win .pw-icon{color:var(--success-green);font-size:18px}.potential-win .pw-text{color:var(--success-green);font-size:14px;font-weight:600}.detail-screen{padding-bottom:40px}.detail-status-header{border-radius:var(--radius-lg);text-align:center;border:1px solid;margin:0 24px 20px;padding:28px;animation:.4s ease-out scaleIn}.detail-status-badge{border-radius:var(--radius-round);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:16px;padding:6px 16px;font-size:12px;font-weight:700;display:inline-block}.detail-profit{letter-spacing:-.5px;font-size:36px;font-weight:800;line-height:1.2}.detail-profit-label{color:var(--text-muted);margin-top:4px;font-size:13px}.detail-card{margin:0 24px 20px;padding:22px}.detail-row{align-items:flex-start;gap:12px;padding:10px 0;display:flex}.detail-row-icon{color:var(--text-muted);margin-top:2px;font-size:18px}.detail-row-content{flex:1;min-width:0}.detail-row-label{color:var(--text-muted);margin-bottom:2px;font-size:11px;font-weight:500}.detail-row-value{font-size:15px;font-weight:500}.detail-divider{background:#2a2a504d;height:1px}.detail-row-pair{gap:0;display:flex}.detail-row-pair>.detail-row{flex:1}.detail-row-pair>.detail-pair-divider{background:#2a2a5080;align-self:stretch;width:1px}.detail-notes{margin:0 24px 20px;padding:20px}.detail-notes-header{color:var(--text-muted);align-items:center;gap:8px;margin-bottom:10px;font-size:13px;font-weight:500;display:flex}.detail-notes-text{color:var(--text-secondary);font-size:14px;line-height:1.5}.detail-actions{margin:0 24px 16px}.detail-actions-label{color:var(--text-secondary);margin-bottom:12px;font-size:14px;font-weight:500}.detail-actions-row{gap:10px;display:flex}.detail-action-btn{border-radius:var(--radius-md);transition:transform var(--transition-fast), background var(--transition-fast);border:1px solid;flex-direction:column;flex:1;align-items:center;gap:6px;padding:16px;display:flex}.detail-action-btn:hover{transform:translateY(-2px)}.detail-action-btn.won-btn{color:var(--success-green);background:#4ade801a;border-color:#4ade8040}.detail-action-btn.won-btn:hover{background:#4ade8026}.detail-action-btn.lost-btn{color:var(--error-red);background:#ff6b6b1a;border-color:#ff6b6b40}.detail-action-btn.lost-btn:hover{background:#ff6b6b26}.detail-action-btn.void-btn{color:var(--text-muted);background:#6060801a;border-color:#60608040}.detail-action-btn.void-btn:hover{background:#60608026}.detail-action-icon{font-size:28px}.detail-action-label{font-size:13px;font-weight:600}.detail-delete-btn{border-radius:var(--radius-md);color:#ff6b6bb3;width:calc(100% - 48px);height:48px;transition:background var(--transition-fast), color var(--transition-fast);border:1px solid #ff6b6b33;justify-content:center;align-items:center;gap:8px;margin:0 24px;font-size:14px;font-weight:500;display:flex}.detail-delete-btn:hover{color:var(--error-red);background:#ff6b6b14}@media (width>=640px){.login-container{max-width:440px}.home-screen,.add-bet-screen,.detail-screen{max-width:560px;margin:0 auto}}@media (width>=1024px){.home-screen{max-width:640px}}input[type=date]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.6);cursor:pointer}