:root{--primary:#6c5ce7;--primary-hover:#5a4bd1;--secondary:#00cec9;--secondary-hover:#00b5b0;--accent:#fdcb6e;--danger:#e17055;--background:#fafafa;--surface:#fff;--surface-hover:#f5f5f5;--text-primary:#2d3436;--text-secondary:#636e72;--text-muted:#b2bec3;--border:#e0e0e0;--win:#00b894;--loss:#d63031;--pending:#fdcb6e;--neutral:#636e72;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:2rem;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;--radius-sm:6px;--radius-md:12px;--radius-lg:16px;--radius-full:9999px;--shadow-soft:0 1px 3px #00000014}*{box-sizing:border-box}html{background:var(--background);font-size:16px}body{color:var(--text-primary);background:radial-gradient(circle at top right, #6c5ce72e, transparent 25%), linear-gradient(180deg, #fcfcff 0%, var(--background) 100%);margin:0;font-family:Inter,sans-serif}body,button,input,textarea,select{font:inherit}a{color:var(--primary);text-decoration:none}button{cursor:pointer;background:0 0;border:0}img{max-width:100%}#root{min-height:100vh}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@keyframes fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(8px)}}@keyframes slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slide-down{0%{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes slide-in-right{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse-gentle{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes wiggle{0%,to{transform:translate(0)}20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}@keyframes badge-bounce{0%,to{transform:scale(1)}30%{transform:scale(1.3)}60%{transform:scale(.9)}}@keyframes toast-in{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes toast-out{0%{opacity:1;max-height:200px;transform:translateY(0)}to{opacity:0;max-height:0;margin:0;padding-top:0;padding-bottom:0;transform:translateY(-8px)}}@keyframes scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}@keyframes card-in{0%{opacity:0;transform:translate(16px)scale(.98)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fade-in-backdrop{0%{opacity:0}to{opacity:1}}.anim-fade-in{animation:.2s ease-out both fade-in}.anim-scale-in{animation:.5s ease-out both scale-in}.anim-slide-in{animation:.25s ease-out both slide-in-right}.anim-card-in{animation:.3s ease-out both card-in}.anim-pulse{animation:1s ease-in-out infinite pulse-gentle}.anim-shimmer{background:linear-gradient(90deg, var(--surface-hover) 25%, #ffffffb3 50%, var(--surface-hover) 75%);background-size:200% 100%;animation:1.5s ease-in-out infinite shimmer}.card-interactive{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .1s,box-shadow .1s}.card-interactive:active{box-shadow:none;transform:scale(.98)}.bottom-sheet-enter{animation:.3s ease-out both slide-up}.bottom-sheet-exit{animation:.25s ease-in both slide-down}.stagger>:first-child{animation-delay:0s}.stagger>:nth-child(2){animation-delay:40ms}.stagger>:nth-child(3){animation-delay:80ms}.stagger>:nth-child(4){animation-delay:.12s}.stagger>:nth-child(5){animation-delay:.16s}.stagger>:nth-child(n+6){animation-delay:.2s}.app-shell{min-height:100vh;padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}.screen{width:min(100%,480px);padding:var(--space-4);gap:var(--space-4);margin:0 auto;display:grid}.group-screen{gap:var(--space-4);width:min(100%,480px);padding:var(--space-4);margin:0 auto;padding-top:0;display:grid}.eyebrow{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);margin-bottom:var(--space-1)}.page-title,.hero-title,.section-title,.card-title{margin:0;font-family:Plus Jakarta Sans,sans-serif}.page-title{font-size:var(--text-2xl);font-weight:800}.hero-title{font-size:var(--text-3xl);font-weight:800}.section-title{font-size:var(--text-xl);font-weight:700}.card-title{font-size:var(--text-lg);font-weight:700}.page-subtitle,.muted{color:var(--text-secondary);font-size:var(--text-sm)}.mono{font-family:JetBrains Mono,monospace;font-weight:700}.brand-mark{border-radius:var(--radius-full);background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;width:40px;height:40px;font-family:Plus Jakarta Sans,sans-serif;font-weight:800;font-size:var(--text-lg);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.brand-mark.xl{width:80px;height:80px;font-size:var(--text-3xl)}.app-header{z-index:10;width:min(100%,480px);height:56px;padding:0 var(--space-4);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:var(--space-3);background:#fafafaeb;margin:0 auto;display:flex;position:sticky;top:0}.app-header-left{align-items:center;gap:var(--space-3);flex:1;min-width:0;display:flex}.app-header-title{font-family:Plus Jakarta Sans,sans-serif;font-size:var(--text-lg);white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.app-header-right{align-items:center;gap:var(--space-2);flex-shrink:0;display:flex}.bottom-nav{width:100%;max-width:480px;height:calc(64px + env(safe-area-inset-bottom,0px));padding-top:var(--space-2);padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom,0px));padding-left:var(--space-2);padding-right:var(--space-2);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--border);z-index:10;background:#fafafaf2;grid-template-columns:repeat(5,1fr);margin-left:auto;margin-right:auto;display:grid;position:fixed;bottom:0;left:0;right:0}.nav-item{color:var(--text-muted);border-radius:var(--radius-md);align-content:center;justify-items:center;gap:2px;min-height:44px;font-size:10px;font-weight:500;text-decoration:none;transition:color .15s;display:grid;position:relative}.nav-item.active{color:var(--primary)}.nav-item.active:before{content:"";background:var(--primary);border-radius:0 0 2px 2px;height:2px;position:absolute;top:0;left:25%;right:25%}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-soft)}.card.interactive{cursor:pointer;-webkit-tap-highlight-color:transparent;color:inherit;text-decoration:none;transition:transform .1s,box-shadow .15s;display:block}.card.interactive:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.card.interactive:active{box-shadow:none;transform:scale(.98)}.card-body{padding:var(--space-4);gap:var(--space-3);display:grid}.card.hero{background:linear-gradient(145deg, #6c5ce714, #00cec914), var(--surface)}.btn{justify-content:center;align-items:center;gap:var(--space-2);border-radius:var(--radius-sm);padding:0 var(--space-4);min-height:44px;font-weight:600;font-size:var(--text-base);cursor:pointer;-webkit-tap-highlight-color:transparent;border:0;transition:background .15s,transform 80ms;display:inline-flex}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:disabled:active{transform:none}.btn.full{width:100%}.btn.primary{background:var(--primary);color:#fff}.btn.primary:hover:not(:disabled){background:var(--primary-hover)}.btn.secondary{border:1.5px solid var(--primary);color:var(--primary);background:0 0}.btn.secondary:hover:not(:disabled){background:#6c5ce70f}.btn.ghost{color:var(--text-primary);background:0 0}.btn.ghost:hover:not(:disabled){background:var(--surface-hover)}.btn.danger{background:var(--danger);color:#fff}.btn.danger:hover:not(:disabled){background:#c9643d}.btn.sm{min-height:36px;padding:0 var(--space-3);font-size:var(--text-sm)}.icon-btn{border-radius:var(--radius-full);width:44px;height:44px;color:var(--text-primary);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s;display:inline-flex;position:relative}.icon-btn:hover{background:var(--surface-hover)}.icon-btn:active{background:var(--border)}.icon-btn.badge:after{content:attr(data-count);background:var(--danger);color:#fff;border-radius:var(--radius-full);justify-content:center;align-items:center;width:16px;height:16px;font-size:9px;font-weight:700;display:flex;position:absolute;top:4px;right:4px}.fab{bottom:calc(64px + env(safe-area-inset-bottom,0px) + var(--space-4));right:calc(50% - min(50%, 240px) + var(--space-4));border-radius:var(--radius-full);background:var(--primary);color:#fff;cursor:pointer;z-index:8;border:0;justify-content:center;align-items:center;width:56px;height:56px;transition:transform .15s,box-shadow .15s;display:flex;position:fixed;box-shadow:0 4px 16px #6c5ce766}.fab:hover{transform:scale(1.05);box-shadow:0 6px 20px #6c5ce780}.fab:active{transform:scale(.95)}.avatar{border-radius:var(--radius-full);color:#fff;-webkit-user-select:none;user-select:none;flex-shrink:0;justify-content:center;align-items:center;font-family:Plus Jakarta Sans,sans-serif;font-weight:700;display:inline-flex}.avatar.sm{width:28px;height:28px;font-size:11px}.avatar.md{width:36px;height:36px;font-size:var(--text-sm)}.avatar.lg{width:48px;height:48px;font-size:var(--text-lg)}.avatar.xl{width:64px;height:64px;font-size:var(--text-xl)}.pill{align-items:center;gap:var(--space-1);padding:2px var(--space-2);border-radius:var(--radius-full);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;font-weight:600;display:inline-flex}.pill.open,.pill.primary{color:var(--primary);background:#6c5ce724}.pill.pending{color:#7a5500;background:#fdcb6e47}.pill.resolved,.pill.win{color:var(--win);background:#00b89424}.pill.cancelled,.pill.neutral{color:var(--neutral);background:#636e721f}.pill.loss{color:var(--loss);background:#d630311f}.pill.closed{color:#7a5500;background:#fdcb6e47}.pill-row{gap:var(--space-2);scrollbar-width:none;-webkit-overflow-scrolling:touch;display:flex;overflow-x:auto}.pill-row::-webkit-scrollbar{display:none}.pill-filter-btn{padding:var(--space-2) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-sm);white-space:nowrap;cursor:pointer;min-height:36px;color:var(--text-secondary);background:#636e721a;border:0;justify-content:center;align-items:center;font-weight:600;transition:background .15s,color .15s;display:inline-flex}.pill-filter-btn.active{color:var(--primary);background:#6c5ce724}.field{gap:var(--space-2);display:grid}.field label{font-size:var(--text-sm);color:var(--text-primary);font-weight:600}.input,.select,.textarea{width:100%;min-height:44px;padding:0 var(--space-3);border-radius:var(--radius-sm);border:1.5px solid var(--border);background:var(--surface);color:var(--text-primary);font-size:var(--text-base);transition:border-color .15s}.input:focus,.select:focus,.textarea:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #6c5ce71f}.input.error,.select.error,.textarea.error{border-color:var(--danger)}.textarea{min-height:96px;padding:var(--space-3);resize:vertical;line-height:1.5}.field-hint{font-size:var(--text-xs);color:var(--text-muted)}.field-error{font-size:var(--text-xs);color:var(--danger)}.input-suffix-wrapper{position:relative}.input-suffix-wrapper .input{padding-right:2.5rem}.input-suffix{right:var(--space-3);color:var(--text-muted);font-weight:600;font-size:var(--text-sm);pointer-events:none;line-height:1;position:absolute;top:50%;transform:translateY(-50%)}.password-wrapper{position:relative}.password-wrapper .input{padding-right:48px}.password-toggle{cursor:pointer;width:44px;height:44px;color:var(--text-secondary);background:0 0;border:0;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;right:0;transform:translateY(-50%)}.row{align-items:center;gap:var(--space-3);display:flex}.row.between{justify-content:space-between}.row.center{justify-content:center}.row.wrap{flex-wrap:wrap}.stack{gap:var(--space-3);display:grid}.stack.sm{gap:var(--space-2)}.stack.lg{gap:var(--space-4)}.grid-2{gap:var(--space-3);grid-template-columns:repeat(2,1fr);display:grid}.section-header{justify-content:space-between;align-items:flex-start;gap:var(--space-3);display:flex}.metric-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3);gap:4px;display:grid}.metric-label{font-size:var(--text-xs);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.08em}.metric-value{font-family:JetBrains Mono,monospace;font-weight:700;font-size:var(--text-lg)}.metric-value.win{color:var(--win)}.metric-value.loss{color:var(--loss)}.metric-value.warn{color:var(--accent)}.empty-state{gap:var(--space-3);padding:var(--space-6) var(--space-4);text-align:center;justify-items:center;display:grid}.empty-state-icon{border-radius:var(--radius-full);background:var(--surface-hover);width:48px;height:48px;color:var(--text-muted);justify-content:center;align-items:center;display:flex}.skeleton{border-radius:var(--radius-md);background:linear-gradient(90deg, var(--surface-hover) 25%, #fff9 50%, var(--surface-hover) 75%);background-size:200% 100%;animation:1.5s ease-in-out infinite shimmer}.skeleton.text{border-radius:var(--radius-sm);height:16px}.skeleton.text.sm{height:12px}.skeleton.text.lg{height:20px}.skeleton.avatar{border-radius:var(--radius-full);flex-shrink:0;width:36px;height:36px}.skeleton.card{height:100px}.bottom-sheet-backdrop{z-index:20;background:#00000073;animation:.2s both fade-in;position:fixed;inset:0}.bottom-sheet-wrapper{bottom:calc(72px + env(safe-area-inset-bottom,0px));z-index:21;padding:0 var(--space-3);pointer-events:none;justify-content:center;display:flex;position:fixed;left:0;right:0}.bottom-sheet{background:var(--surface);border-radius:var(--radius-lg);pointer-events:auto;flex-direction:column;width:100%;max-width:480px;max-height:calc(85dvh - 72px);animation:.3s ease-out both slide-up;display:flex;overflow:hidden;box-shadow:0 -4px 24px #0000001f}.bottom-sheet-handle{padding:var(--space-3) var(--space-4) var(--space-2);flex-shrink:0;justify-content:center;display:flex}.bottom-sheet-handle-bar{border-radius:var(--radius-full);background:var(--border);width:36px;height:4px}.bottom-sheet-header{padding:0 var(--space-4) var(--space-3);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.bottom-sheet-title{font-family:Plus Jakarta Sans,sans-serif;font-size:var(--text-xl);font-weight:700}.bottom-sheet-body{-webkit-overflow-scrolling:touch;padding:0 var(--space-4) var(--space-6);gap:var(--space-4);flex:1;align-content:start;display:grid;overflow-y:auto}.confirm-dialog-backdrop{z-index:40;padding:var(--space-4);background:#0000008c;justify-content:center;align-items:center;animation:.15s both fade-in;display:flex;position:fixed;inset:0}.confirm-dialog{background:var(--surface);border-radius:var(--radius-lg);padding:var(--space-6);gap:var(--space-4);width:min(100%,360px);animation:.2s ease-out both scale-in;display:grid;box-shadow:0 8px 32px #0003}.confirm-dialog.exiting,.confirm-dialog-backdrop.exiting{animation:.15s ease-in both fade-out}.confirm-dialog-title{font-family:Plus Jakarta Sans,sans-serif;font-size:var(--text-xl);font-weight:700}.confirm-dialog-message{color:var(--text-secondary);font-size:var(--text-base);line-height:1.5}.confirm-dialog-actions{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.countdown{font-family:JetBrains Mono,monospace;font-weight:700;font-size:var(--text-sm);color:var(--text-secondary)}.countdown.warning{color:var(--accent)}.countdown.danger{color:var(--danger);animation:1s ease-in-out infinite pulse-gentle}.toast-viewport-wrapper{top:var(--space-4);z-index:40;padding:0 var(--space-4);pointer-events:none;justify-content:center;display:flex;position:fixed;left:0;right:0}.toast-viewport{gap:var(--space-2);pointer-events:none;width:100%;max-width:420px;display:grid}.toast{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);pointer-events:all;align-items:flex-start;gap:var(--space-3);animation:.25s ease-out both toast-in;display:flex;box-shadow:0 4px 16px #0000001f}.toast.dismissing{animation:.3s ease-in both toast-out}.toast.success{border-left:3px solid var(--win)}.toast.error{border-left:3px solid var(--danger)}.toast-content{flex:1;min-width:0}.toast-title{font-weight:700;font-size:var(--text-sm)}.toast-message{color:var(--text-secondary);font-size:var(--text-sm);margin-top:2px}.toast-close{border-radius:var(--radius-full);width:28px;height:28px;color:var(--text-muted);cursor:pointer;background:0 0;border:0;flex-shrink:0;justify-content:center;align-items:center;margin:-2px -4px 0 0;transition:background .15s;display:flex}.toast-close:hover{background:var(--surface-hover)}.group-card,.porra-card{gap:var(--space-3);padding:var(--space-4);color:inherit;text-decoration:none;display:grid}.debt-card{padding:var(--space-4)}.podium{justify-content:center;align-items:flex-end;gap:var(--space-3);padding:var(--space-4) 0;display:flex}.podium-item{justify-items:center;gap:var(--space-2);flex:1;display:grid}.podium-item.first{order:2}.podium-item.second{order:1}.podium-item.third{order:3}.podium-bar{border-radius:var(--radius-sm) var(--radius-sm) 0 0;color:#fff;width:100%;font-family:JetBrains Mono,monospace;font-weight:800;font-size:var(--text-sm);justify-content:center;align-items:center;display:flex}.podium-bar.first{background:linear-gradient(#f9ca24,#f0932b);height:72px}.podium-bar.second{background:linear-gradient(#b2bec3,#636e72);height:52px}.podium-bar.third{background:linear-gradient(#e17055,#c0392b);height:40px}.podium-name{font-size:var(--text-xs);text-align:center;text-overflow:ellipsis;white-space:nowrap;max-width:80px;font-weight:600;overflow:hidden}.podium-value{font-family:JetBrains Mono,monospace;font-size:var(--text-xs);color:var(--text-secondary)}.step-indicator{align-items:center;gap:var(--space-2);justify-content:center;display:flex}.step-dot{border-radius:var(--radius-full);background:var(--border);width:8px;height:8px;transition:background .2s,width .2s}.step-dot.active{background:var(--primary);width:24px}.step-dot.done{background:var(--win)}.auth-page{min-height:100dvh;padding:var(--space-6) var(--space-4);justify-content:center;align-items:center;gap:var(--space-6);flex-direction:column;width:min(100%,400px);margin:0 auto;display:flex}.auth-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;box-shadow:var(--shadow-soft);padding:var(--space-6);gap:var(--space-4);display:grid}.auth-back-btn{align-self:flex-start;align-items:center;gap:var(--space-2);color:var(--text-secondary);font-size:var(--text-sm);cursor:pointer;padding:var(--space-2) 0;background:0 0;border:0;min-height:44px;font-weight:600;display:flex}.auth-back-btn:hover{color:var(--text-primary)}.auth-links{gap:var(--space-2);text-align:center;flex-direction:column;display:flex}.auth-link{font-size:var(--text-sm);color:var(--text-secondary)}.auth-link a,.auth-link button{color:var(--primary);cursor:pointer;background:0 0;border:0;font-weight:600;text-decoration:none}.toggle-wrapper{justify-content:space-between;align-items:center;gap:var(--space-3);min-height:44px;display:flex}.toggle-label{flex:1;gap:2px;display:grid}.toggle-label-text{font-weight:600;font-size:var(--text-sm)}.toggle-label-desc{font-size:var(--text-xs);color:var(--text-secondary)}.toggle{flex-shrink:0;width:50px;height:28px;position:relative}.toggle input{opacity:0;width:0;height:0;position:absolute}.toggle-track{border-radius:var(--radius-full);background:var(--border);cursor:pointer;transition:background .2s;position:absolute;inset:0}.toggle input:checked+.toggle-track{background:var(--primary)}.toggle-track:after{content:"";border-radius:var(--radius-full);background:#fff;width:22px;height:22px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 4px #0003}.toggle input:checked+.toggle-track:after{transform:translate(22px)}.balance-banner{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-4);gap:var(--space-1);text-align:center;display:grid}.balance-banner.positive{background:#00b8940d;border-color:#00b8944d}.balance-banner.negative{background:#e170550d;border-color:#e170554d}.balance-amount{font-family:JetBrains Mono,monospace;font-size:var(--text-3xl);font-weight:800}.balance-amount.positive{color:var(--win)}.balance-amount.negative{color:var(--danger)}.list-item{align-items:center;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--border);display:flex}.list-item:last-child{border-bottom:none}.list-item-content{flex:1;min-width:0}.list-item-title{font-weight:700;font-size:var(--text-base);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.list-item-sub{font-size:var(--text-sm);color:var(--text-secondary)}.list-item-end{align-items:center;gap:var(--space-2);flex-shrink:0;display:flex}.invite-card{background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius-md);padding:var(--space-4);gap:var(--space-2);word-break:break-all;display:grid}.history-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4)}@media (width>=768px){.screen,.group-screen{width:min(100% - 32px,480px)}.app-header,.bottom-nav{width:min(100%,480px)}.fab{right:calc(50% - min(50%, 240px) + var(--space-4))}}