:root{--bg-base: #04010f;--bg-spot-1: rgba(120, 40, 200, .45);--bg-spot-2: rgba(80, 20, 180, .4);--card: #08031a;--card-head: rgba(168, 85, 247, .04);--border: rgba(168, 85, 247, .28);--text: #e9d5ff;--text-dim: rgba(233, 213, 255, .42);--text-label: rgba(233, 213, 255, .6);--purple: #a855f7;--input-bg: rgba(4, 1, 14, .92);--input-border: rgba(168, 85, 247, .18);--google-bg: rgba(233, 213, 255, .05);--google-hover: rgba(233, 213, 255, .09);--pw-empty: rgba(168, 85, 247, .1);--glow-a: rgba(168, 85, 247, .14);--glow-b: rgba(192, 38, 211, .28);--card-shadow: rgba(0, 0, 0, .88);--toggle-hover: rgba(168, 85, 247, .12);--err: #f87171;--ok: #4ade80;color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif}:root.light{--bg-base: #faf5ff;--bg-spot-1: rgba(196, 181, 253, .4);--bg-spot-2: rgba(167, 139, 250, .28);--card: #ffffff;--card-head: rgba(139, 92, 246, .04);--border: rgba(124, 58, 237, .2);--text: #1e1b4b;--text-dim: rgba(30, 27, 75, .48);--text-label: rgba(30, 27, 75, .62);--purple: #7c3aed;--input-bg: #f5f3ff;--input-border: rgba(124, 58, 237, .2);--google-bg: rgba(30, 27, 75, .04);--google-hover: rgba(30, 27, 75, .08);--pw-empty: rgba(124, 58, 237, .1);--glow-a: rgba(139, 92, 246, .1);--glow-b: rgba(167, 139, 250, .22);--card-shadow: rgba(109, 40, 217, .08);--toggle-hover: rgba(124, 58, 237, .08);color-scheme:light}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;background:radial-gradient(ellipse 75% 55% at 18% 12%,var(--bg-spot-1) 0%,transparent 58%),radial-gradient(ellipse 65% 50% at 82% 88%,var(--bg-spot-2) 0%,transparent 58%),var(--bg-base);color:var(--text);font-size:15px;line-height:1.5}button,input{font:inherit}.app-shell{min-height:100vh;display:grid;place-items:center;padding:24px}@keyframes cardGlow{0%,to{box-shadow:0 0 24px var(--glow-a),0 24px 80px var(--card-shadow)}50%{box-shadow:0 0 44px var(--glow-b),0 24px 80px var(--card-shadow)}}.auth-card{width:min(460px,100%);background:var(--card);border:1.5px solid var(--border);border-radius:20px;overflow:hidden;animation:cardGlow 3.5s ease-in-out infinite}.card-header{display:flex;align-items:center;gap:16px;padding:26px 36px;border-bottom:1.5px solid var(--border);background:var(--card-head)}.logo-text h1{font-size:1.5rem;font-weight:800;letter-spacing:-.3px;background:linear-gradient(135deg,#e879f9,#a855f7,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.15}.logo-text p{font-size:.78rem;color:var(--text-dim);margin-top:2px}.theme-toggle{margin-left:auto;width:36px;height:36px;border-radius:50%;background:transparent;border:1.5px solid var(--border);color:var(--purple);flex-shrink:0;transition:background .2s;padding:0}.theme-toggle:hover{background:var(--toggle-hover)}.card-body{padding:28px 36px 36px}@keyframes formEnter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.view-wrap{animation:formEnter .28s ease-out}.form{display:grid;gap:14px}.form-head{display:grid;gap:3px;margin-bottom:2px}.form-title{font-size:1.18rem;font-weight:700;color:var(--purple)}.form-subtitle{font-size:.8rem;color:var(--text-dim)}.field{display:grid;gap:6px}.field-label{font-size:.82rem;font-weight:500;color:var(--text-label);letter-spacing:.2px}.field input{width:100%;padding:12px 15px;border-radius:10px;border:1.5px solid var(--input-border);background:var(--input-bg);color:var(--text);outline:none;transition:border-color .17s,box-shadow .17s}.field input::placeholder{color:var(--text-dim)}.field input:focus{border-color:var(--purple);box-shadow:0 0 0 3px #a855f729}:root.light .field input:focus{box-shadow:0 0 0 3px #7c3aed24}.field input.has-error{border-color:var(--err)}.field input.has-error:focus{box-shadow:0 0 0 3px #f8717124}.field-err{display:flex;align-items:center;gap:4px;font-size:.76rem;color:var(--err)}.pw-strength{display:grid;gap:5px;margin-top:2px}.pw-bars{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.pw-bar{height:3px;border-radius:2px;background:var(--pw-empty);transition:background .3s}.pw-bar.s0{background:#f87171}.pw-bar.s1{background:#fb923c}.pw-bar.s2{background:#facc15}.pw-bar.s3{background:#4ade80}.pw-label{font-size:.73rem;color:var(--text-dim)}.checkbox-row{display:flex;align-items:center;gap:8px;font-size:.84rem;color:var(--text-dim);cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-row input[type=checkbox]{width:15px;height:15px;accent-color:var(--purple);cursor:pointer}button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer;transition:opacity .15s,transform .1s;border-radius:10px}button:active{transform:scale(.97)}@keyframes shimmer{0%{background-position:0% center}to{background-position:200% center}}.btn-primary{width:100%;padding:13px;font-size:.95rem;font-weight:700;letter-spacing:.3px;color:#fff;background:linear-gradient(135deg,#e879f9,#a855f7,#6366f1,#a855f7,#e879f9);background-size:300% auto;animation:shimmer 4s linear infinite;text-shadow:0 1px 4px rgba(0,0,0,.25)}.btn-primary:hover{opacity:.87}.btn-google{width:100%;padding:12px;font-size:.87rem;font-weight:500;background:var(--google-bg);border:1.5px solid var(--border);color:var(--text)}.btn-google:hover{background:var(--google-hover)}.divider{display:flex;align-items:center;gap:12px;font-size:.74rem;color:var(--text-dim)}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--border)}.link-btn{background:transparent;border-radius:0;padding:0;font-size:.82rem;font-weight:500;color:var(--purple);text-decoration:underline;text-underline-offset:2px}.link-btn:hover{opacity:.7}.form-footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding-top:2px}.form-footer-center{text-align:center;padding-top:2px}.success-box{text-align:center;padding:12px 0 4px;display:grid;gap:10px}.success-icon{font-size:2.8rem}.success-msg{font-size:.95rem;font-weight:600;color:var(--ok)}.success-sub{font-size:.82rem;color:var(--text-dim)}.api-error{padding:10px 14px;border-radius:8px;background:#f871711a;border:1px solid rgba(248,113,113,.3);color:var(--err);font-size:.84rem}.boot-spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--purple);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.lobby-shell{min-height:100vh;display:flex;flex-direction:column}.lobby-nav{display:flex;align-items:center;gap:16px;padding:14px 32px;border-bottom:1.5px solid var(--border);background:var(--card);position:sticky;top:0;z-index:10}.lobby-brand{display:flex;align-items:center;gap:12px}.lobby-brand-name{font-size:1.2rem;font-weight:800;letter-spacing:-.3px;background:linear-gradient(135deg,#e879f9,#a855f7,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.lobby-nav-right{margin-left:auto;display:flex;align-items:center;gap:12px}.lobby-user{display:flex;align-items:center;gap:8px}.lobby-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#e879f9,#a855f7);display:grid;place-items:center;font-size:.85rem;font-weight:800;color:#fff;flex-shrink:0;overflow:hidden}.lobby-avatar-btn{border:none;padding:0;cursor:pointer}.lobby-avatar-btn img{width:100%;height:100%;object-fit:cover}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:grid;place-items:center;z-index:100}.avatar-picker{width:min(480px,90vw);max-height:80vh;overflow-y:auto;background:var(--card, #1a1a2e);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:16px}.avatar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:12px}.avatar-option{position:relative;width:100%;aspect-ratio:1;border-radius:12px;overflow:hidden;border:2px solid transparent;padding:0;cursor:pointer;background:#ffffff0f}.avatar-option img{width:100%;height:100%;object-fit:cover}.avatar-option-selected{border-color:#a855f7}.avatar-option-loading{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080}.lobby-username{font-size:.85rem;font-weight:600;color:var(--text)}.lobby-badge{padding:3px 9px;border-radius:20px;background:#a855f724;border:1px solid rgba(168,85,247,.3);font-size:.68rem;font-weight:600;color:var(--purple);letter-spacing:.5px;text-transform:uppercase}.lobby-elo{display:flex;align-items:center;gap:5px;padding:3px 9px;border-radius:20px;background:#facc151a;border:1px solid rgba(250,204,21,.35);font-size:.72rem;font-weight:700;color:#facc15;white-space:nowrap}.lobby-rank-badge{width:16px;height:16px;object-fit:contain}.sala-ranked-badge{padding:2px 7px;border-radius:12px;background:#facc151a;border:1px solid rgba(250,204,21,.35);font-size:.62rem;font-weight:700;color:#facc15;letter-spacing:.6px}.btn-nav-logout{padding:6px 14px;font-size:.8rem;font-weight:500;background:transparent;border:1.5px solid var(--border);color:var(--text-dim);border-radius:8px}.btn-nav-logout:hover{border-color:var(--err);color:var(--err)}.lobby-body{flex:1;max-width:980px;width:100%;margin:0 auto;padding:48px 24px 60px}.lobby-greeting{margin-bottom:40px}.lobby-greeting h2{font-size:1.8rem;font-weight:800;color:var(--text);line-height:1.2}.greeting-name{background:linear-gradient(135deg,#e879f9,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.lobby-greeting p{font-size:.95rem;color:var(--text-dim);margin-top:6px}.mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:36px}@keyframes modeGlow{0%,to{box-shadow:0 0 18px var(--glow-a),0 8px 32px var(--card-shadow)}50%{box-shadow:0 0 32px var(--glow-b),0 8px 32px var(--card-shadow)}}.mode-card{position:relative;background:var(--card);border:1.5px solid var(--border);border-radius:18px;padding:32px 28px 28px;display:flex;flex-direction:column;gap:18px;transition:border-color .2s,transform .2s;animation:modeGlow 4s ease-in-out infinite}.mode-card:hover{border-color:var(--purple);transform:translateY(-3px)}.mode-casual{--card-accent: #a855f7}.mode-ranked{--card-accent: #f59e0b}.mode-salas{--card-accent: #6366f1}.mode-ranked{--glow-a: rgba(245, 158, 11, .1);--glow-b: rgba(245, 158, 11, .22);border-color:#f59e0b40}.mode-ranked:hover{border-color:#f59e0b}.mode-salas{--glow-a: rgba(99, 102, 241, .12);--glow-b: rgba(99, 102, 241, .24);border-color:#6366f140}.mode-salas:hover{border-color:#6366f1}.mode-soon{position:absolute;top:14px;right:14px;padding:3px 9px;border-radius:20px;background:#a855f71f;border:1px solid var(--border);font-size:.68rem;font-weight:600;color:var(--text-dim);letter-spacing:.3px}.mode-icon-wrap{color:var(--card-accent, var(--purple));display:flex;align-items:center;gap:10px}.mode-info{flex:1}.mode-title{font-size:1.1rem;font-weight:800;color:var(--text);margin-bottom:8px}.mode-desc{font-size:.84rem;color:var(--text-dim);line-height:1.55}.mode-btn{width:100%;padding:12px;font-size:.88rem;font-weight:700;letter-spacing:.2px;color:#fff;background:linear-gradient(135deg,var(--card-accent, #a855f7),var(--purple));border-radius:10px;transition:opacity .15s;display:flex;align-items:center;justify-content:center;gap:8px}.mode-ranked .mode-btn{background:linear-gradient(135deg,#f59e0b,#d97706)}.mode-salas .mode-btn{background:linear-gradient(135deg,#818cf8,#6366f1)}.mode-btn:hover:not(:disabled){opacity:.85}.mode-btn:disabled{opacity:.38;cursor:not-allowed;animation:none}.lobby-modes-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.lobby-modes-label{font-size:.78rem;font-weight:600;color:var(--text-label);letter-spacing:.3px;text-transform:uppercase}.lobby-mode-chip{padding:4px 12px;border-radius:20px;background:#a855f71a;border:1px solid var(--border);font-size:.8rem;font-weight:500;color:var(--text);text-transform:capitalize}@media (max-width: 500px){.card-header{padding:20px 22px}.card-body{padding:20px 22px 28px}}@media (max-width: 720px){.mode-grid{grid-template-columns:1fr}.lobby-nav{padding:12px 16px}.lobby-body{padding:28px 16px 40px}.lobby-greeting h2{font-size:1.4rem}.lobby-username{display:none}}@media (max-width: 900px) and (min-width: 721px){.mode-grid{grid-template-columns:1fr 1fr}.mode-grid .mode-card:last-child{grid-column:1 / -1;max-width:50%;margin:0 auto;width:100%}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.salas-page{min-height:100vh;background:var(--bg-base);display:flex;flex-direction:column}.salas-nav{display:flex;align-items:center;gap:12px;padding:14px 28px;border-bottom:1px solid var(--border);background:#08031ad9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0;z-index:10}.btn-back{display:flex;align-items:center;gap:6px;background:none;border:none;color:var(--text-dim);font-size:.875rem;cursor:pointer;padding:6px 10px;border-radius:8px;transition:color .15s,background .15s}.btn-back:hover{color:var(--text);background:var(--toggle-hover)}.salas-nav-title{flex:1;font-size:1.1rem;font-weight:600;color:var(--text);margin:0}.btn-icon-round{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:none;color:var(--text-dim);cursor:pointer;transition:color .15s,background .15s}.btn-icon-round:hover:not(:disabled){color:var(--purple);background:var(--toggle-hover)}.btn-icon-round:disabled{opacity:.5;cursor:default}.salas-content{width:100%;max-width:1000px;margin:0 auto;padding:28px 24px 60px}.salas-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}.btn-create-sala{padding:9px 18px;border-radius:10px;border:1.5px solid var(--purple);background:#a855f714;color:var(--purple);font-size:.9rem;font-weight:600;cursor:pointer;transition:background .15s;white-space:nowrap}.btn-create-sala:hover,.btn-create-sala.active{background:#a855f72e}.search-code-form{display:flex;gap:8px;flex:1;min-width:220px}.search-code-input{flex:1;padding:9px 14px;border-radius:10px;border:1.5px solid var(--input-border);background:var(--input-bg);color:var(--text);font-size:.9rem;font-family:JetBrains Mono,ui-monospace,monospace;letter-spacing:.08em;outline:none;transition:border-color .15s}.search-code-input:focus{border-color:var(--purple)}.search-code-input::placeholder{color:var(--text-dim);font-family:Inter,sans-serif;letter-spacing:0}.search-code-btn{padding:9px 18px;border-radius:10px;border:none;background:var(--purple);color:#fff;font-size:.875rem;font-weight:600;cursor:pointer;transition:opacity .15s}.search-code-btn:disabled{opacity:.5;cursor:default}.create-form{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px 22px;margin-bottom:20px;display:flex;flex-direction:column;gap:16px}.create-form-grid{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field-label{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-label)}.field input{padding:9px 14px;border-radius:10px;border:1.5px solid var(--input-border);background:var(--input-bg);color:var(--text);font-size:.9rem;outline:none;transition:border-color .15s}.field input:focus{border-color:var(--purple)}.create-options{display:flex;flex-wrap:wrap;gap:16px}.option-group{display:flex;flex-direction:column;gap:6px}.toggle-row{display:flex;gap:6px;flex-wrap:wrap}.toggle-btn{padding:6px 14px;border-radius:8px;border:1.5px solid var(--border);background:none;color:var(--text-dim);font-size:.82rem;font-weight:500;cursor:pointer;text-transform:capitalize;transition:border-color .15s,color .15s,background .15s}.toggle-btn.active{border-color:var(--purple);color:var(--purple);background:#a855f71f}.toggle-btn:hover:not(.active):not(:disabled){border-color:#a855f780;color:var(--text)}.toggle-btn:disabled{opacity:.5;cursor:default}.create-submit-btn{align-self:flex-start;padding:10px 24px;border-radius:10px;border:none;background:var(--purple);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;transition:opacity .15s}.create-submit-btn:disabled{opacity:.5;cursor:default}.salas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.sala-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px;transition:border-color .2s,transform .15s}.sala-card:hover{border-color:#a855f780;transform:translateY(-2px)}.sala-card-full{opacity:.6}.sala-card-full:hover{transform:none}.sala-card-top{display:flex;align-items:center;justify-content:space-between}.sala-codigo{font-family:JetBrains Mono,ui-monospace,monospace;font-size:1rem;font-weight:700;letter-spacing:.1em;color:var(--text)}.sala-badges{display:flex;gap:6px}.sala-tipo-badge{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:3px 8px;border-radius:6px}.tipo-casual{background:#a855f726;color:#c084fc}.tipo-ranked{background:#f59e0b26;color:#f59e0b}.sala-card-body{display:flex;flex-direction:column;gap:4px}.sala-nombre{font-size:.9rem;color:var(--text);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sala-modo{font-size:.8rem;color:var(--text-dim);margin:0;text-transform:capitalize}.sala-players-row{display:flex;align-items:center;gap:8px;margin-top:2px}.player-dots{display:flex;gap:3px}.dot-on{color:var(--purple);font-size:.75rem}.dot-off{color:var(--border);font-size:.75rem}.sala-players-text{font-size:.78rem;color:var(--text-label)}.sala-join-btn{margin-top:auto;padding:8px 0;width:100%;border-radius:9px;border:1.5px solid var(--purple);background:#a855f714;color:var(--purple);font-size:.875rem;font-weight:600;cursor:pointer;transition:background .15s}.sala-join-btn:hover:not(:disabled){background:#a855f733}.sala-join-btn:disabled{opacity:.4;cursor:default}.salas-loading{display:flex;flex-direction:column;align-items:center;gap:14px;padding:60px 0;color:var(--text-dim)}.salas-empty{text-align:center;padding:60px 0}.salas-empty-icon{font-size:3rem;margin-bottom:8px}.salas-empty-msg{font-size:1.05rem;color:var(--text);margin:0 0 6px}.salas-empty-sub{font-size:.875rem;color:var(--text-dim);margin:0}.api-error{background:#f871711a;border:1px solid rgba(248,113,113,.3);border-radius:10px;color:var(--err);font-size:.875rem;padding:10px 14px}.waiting-room{display:flex;flex-direction:column;gap:28px;max-width:700px;margin:0 auto;padding-top:12px}.waiting-header{display:flex;flex-direction:column;gap:10px}.waiting-code-wrap{display:flex;flex-direction:column;gap:6px}.waiting-code-label{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-label);font-weight:600}.waiting-code-row{display:flex;align-items:center;gap:12px}.waiting-code{font-family:JetBrains Mono,ui-monospace,monospace;font-size:2rem;font-weight:800;letter-spacing:.18em;color:var(--purple)}.btn-copy{display:flex;align-items:center;gap:5px;padding:6px 12px;border-radius:8px;border:1px solid var(--border);background:none;color:var(--text-dim);font-size:.8rem;cursor:pointer;transition:color .15s,background .15s}.btn-copy:hover{color:var(--text);background:var(--toggle-hover)}.waiting-meta{display:flex;align-items:center;gap:8px;font-size:.875rem;color:var(--text-dim)}.waiting-meta-sep{color:var(--border)}.waiting-nombre{font-size:1.1rem;font-weight:600;color:var(--text);margin:0}.slot-grid{display:grid;gap:14px}.slot{background:var(--card);border:1.5px solid var(--border);border-radius:14px;padding:20px 16px;display:flex;flex-direction:column;align-items:center;gap:8px;min-height:120px;justify-content:center;text-align:center}.slot-empty{border-style:dashed;opacity:.55}.slot-clickable{cursor:pointer;background:transparent;border:1.5px dashed var(--border);border-radius:14px;color:inherit;font:inherit;transition:opacity .15s,border-color .15s}.slot-clickable:hover{opacity:1;border-color:var(--purple)}.teams-hint{font-size:.78rem;color:var(--text-dim);text-align:center;margin-bottom:10px}.slot-filled{border-color:#a855f759}.slot-me{border-color:var(--purple);background:#a855f712}.slot-pos{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-label)}.slot-waiting{font-size:.82rem;color:var(--text-dim)}.slot-avatar{width:44px;height:44px;border-radius:50%;background:#a855f733;color:var(--purple);font-size:1.2rem;font-weight:700;display:flex;align-items:center;justify-content:center}.slot-username{font-size:.875rem;font-weight:600;color:var(--text)}.slot-host-badge{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;background:#a855f726;color:var(--purple);padding:2px 8px;border-radius:6px}.waiting-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.btn-primary{padding:11px 24px;border-radius:10px;border:none;background:var(--purple);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;transition:opacity .15s}.btn-primary:disabled{opacity:.4;cursor:default}.waiting-start-btn{flex:1}.btn-salir{padding:10px 20px;border-radius:10px;border:1.5px solid rgba(248,113,113,.4);background:#f8717112;color:var(--err);font-size:.875rem;font-weight:600;cursor:pointer;transition:background .15s}.btn-salir:hover:not(:disabled){background:#f8717124}.btn-salir:disabled{opacity:.5;cursor:default}:root.light .sala-card{box-shadow:0 2px 8px #6d28d90f}:root.light .slot-avatar{background:#7c3aed1f}:root.light .tipo-casual{background:#7c3aed1a;color:#7c3aed}:root.light .tipo-ranked{background:#d977061f;color:#d97706}.dp{display:block;flex-shrink:0;transition:transform .15s,filter .15s}.dp.dp-clickable{cursor:pointer}.dp.dp-clickable:hover{transform:translateY(-4px)}.dp.dp-selected{filter:drop-shadow(0 0 8px rgba(168,85,247,.9));transform:translateY(-4px)}.dp.dp-playable{filter:drop-shadow(0 0 6px rgba(74,222,128,.7))}.dp.dp-disabled{opacity:.35}.piece-demo{min-height:100vh;background:var(--bg-base);padding:32px 24px}.piece-demo h2{color:var(--text);font-size:1.3rem;margin:0 0 24px}.piece-demo-section{margin-bottom:36px}.piece-demo-section h3{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-label);margin:0 0 14px}.piece-demo-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}.game-shell{min-height:100vh;width:100%;background:var(--bg-base);display:flex;flex-direction:column;overflow-x:hidden}.game-nav{display:flex;align-items:center;gap:14px;padding:14px 28px;border-bottom:1px solid var(--border);background:#08031ad9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.game-room-code{font-family:JetBrains Mono,ui-monospace,monospace;font-size:.85rem;letter-spacing:.08em;color:var(--text-dim)}.game-turn-indicator{margin-left:auto;font-size:.9rem;font-weight:600;color:var(--purple);padding:6px 14px;border-radius:20px;background:#a855f71f}.game-table{flex:1;display:grid;grid-template-areas:".    top    ." "left center right" ".    .      .";grid-template-columns:140px 1fr 140px;grid-template-rows:auto 1fr auto;gap:16px;padding:20px 24px;align-items:center;justify-items:center}.table-2p{grid-template-columns:1fr;grid-template-areas:"top" "center"}.seat-top{grid-area:top}.seat-left{grid-area:left}.seat-right{grid-area:right}.seat-top,.seat-left,.seat-right,.board-center{min-width:0;min-height:0;max-width:100%}.opponent-seat{display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px;border-radius:12px;transition:background .2s}.opponent-seat.seat-active{background:#a855f71a;box-shadow:0 0 0 1.5px #a855f766}.opponent-name{font-size:.8rem;font-weight:600;color:var(--text-dim)}.opponent-pieces{display:flex;flex-direction:row;gap:3px;flex-wrap:nowrap;align-items:center;justify-content:center;width:100%}.opponent-pieces.pieces-side{flex-direction:column;gap:2px}.board-center{grid-area:center;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:160px;width:100%}.board-empty-hint{color:var(--text-dim);font-size:.9rem;text-align:center}.board-track{display:flex;flex-wrap:wrap;gap:4px;align-items:center;justify-content:center;max-width:100%}.board-side-prompt{display:flex;gap:10px;margin-top:16px;align-items:center}.side-btn{padding:8px 16px;border-radius:9px;border:1.5px solid var(--purple);background:#a855f71f;color:var(--purple);font-size:.85rem;font-weight:600;cursor:pointer;transition:background .15s}.side-btn:hover{background:#a855f73d}.side-cancel{width:28px;height:28px;border-radius:50%;border:1px solid var(--border);background:none;color:var(--text-dim);cursor:pointer;font-size:.8rem}.my-hand-zone{display:flex;flex-direction:column;align-items:center;gap:14px;padding:18px 24px 28px;border-top:1px solid var(--border);background:#08031a99}.my-hand{display:flex;gap:6px;flex-wrap:nowrap;justify-content:center;align-items:flex-end;width:100%}.btn-pasar{padding:9px 22px;border-radius:10px;border:1.5px solid rgba(248,113,113,.4);background:#f8717112;color:var(--err);font-size:.875rem;font-weight:600;cursor:pointer;transition:background .15s,opacity .15s}.btn-pasar:hover:not(:disabled){background:#f8717124}.btn-pasar:disabled{opacity:.35;cursor:default}.game-result-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#04010fd1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:50}.game-result-card{background:var(--card);border:1.5px solid var(--purple);border-radius:18px;padding:36px 44px;text-align:center;box-shadow:0 0 40px #a855f740}.game-result-card h2{font-size:1.5rem;margin:0 0 12px;color:var(--text)}.result-points{font-size:2.2rem;font-weight:800;color:#c084fc;margin:0 0 8px}.result-detail{color:var(--text-dim);font-size:.9rem;margin:0 0 24px}.game-result-card .btn-salir{width:100%;margin-top:10px}@keyframes piece-place{0%{opacity:0;transform:scale(.55) translateY(-14px)}60%{opacity:1;transform:scale(1.08) translateY(2px)}to{opacity:1;transform:scale(1) translateY(0)}}.dp.dp-placing{animation:piece-place .38s cubic-bezier(.34,1.56,.64,1) forwards}.game-turn-indicator.my-turn{background:#16a34a26;color:#4ade80}.game-error-banner{background:#f871711f;border-bottom:1px solid rgba(248,113,113,.3);color:var(--err);font-size:.85rem;padding:8px 28px;text-align:center}.score-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 16px;border-bottom:1px solid var(--border);background:var(--card-head);font-size:.82rem}.score-team{color:var(--text-dim);white-space:nowrap}.score-team strong{font-size:1.05rem;color:var(--text);padding:0 3px}.score-nos strong{color:#4ade80}.score-ellos strong{color:var(--err)}.score-target{font-size:.72rem;color:var(--text-dim);text-align:center;white-space:nowrap}.game-event-banner{background:#16a34a24;border-bottom:1px solid rgba(22,163,74,.35);color:#4ade80;font-size:.85rem;font-weight:600;padding:8px 28px;text-align:center;animation:formEnter .25s ease-out}.result-marcador{font-size:.95rem;color:var(--text-dim);margin:6px 0}.result-marcador strong{color:var(--text);font-size:1.15rem}.result-marcador-obj{font-size:.78rem}.game-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;gap:16px;color:var(--text-dim);font-size:.9rem}.board-track-wrap{display:flex;align-items:center;gap:8px;max-width:100%;overflow-x:auto;padding:12px 4px}.board-track{display:flex;gap:4px;align-items:center;flex-wrap:wrap;justify-content:center}.drop-zone{flex-shrink:0;width:52px;height:52px;border-radius:10px;border:2px dashed rgba(168,85,247,.4);background:#a855f70d;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#a855f780;transition:border-color .15s,background .15s,color .15s,transform .15s}.drop-zone.dz-sobre{border-color:#4ade80;background:#4ade801f;color:#4ade80;transform:scale(1.1)}.drop-zone-open{margin-top:12px;padding:14px 28px;border-radius:12px;border:2px dashed rgba(168,85,247,.5);background:#a855f70f;color:var(--text-dim);font-size:.85rem;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}.drop-zone-open.dz-sobre{border-color:#4ade80;background:#4ade801a;color:#4ade80}.dp.dp-draggable{cursor:grab}.dp.dp-draggable:active{cursor:grabbing;opacity:.75}.dp.dp-playable:hover{transform:translateY(-6px);filter:drop-shadow(0 4px 8px rgba(22,163,74,.4))}.snake-board-wrap{position:relative;flex-shrink:0}.snake-board-wrap .dp{overflow:visible}.snake-drop-zone{position:absolute;width:40px;height:52px;border-radius:10px;border:2px dashed rgba(168,85,247,.5);background:#a855f70f;display:flex;align-items:center;justify-content:center;font-size:1rem;color:#a855f799;transition:border-color .15s,background .15s,transform .15s;cursor:pointer;z-index:5}.snake-drop-zone.dz-sobre{border-color:#16a34a;background:#16a34a24;color:#4ade80;transform:scale(1.12)}.board-center{aspect-ratio:1 / 1;overflow:hidden;padding:0;display:flex;align-items:center;justify-content:center;max-width:min(100%,max(260px,calc(100dvh - 440px)));margin-inline:auto}.board-empty-wrap{display:flex;flex-direction:column;align-items:center;gap:12px}@media (max-width: 640px){.my-hand{overflow-x:visible}.game-table{grid-template-columns:50px 1fr 50px;gap:6px;padding:8px 4px}.table-2p{grid-template-columns:1fr;padding:8px}.opponent-name{font-size:.7rem;max-width:48px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}.game-nav{padding:10px 12px;gap:6px}.game-room-code{font-size:.72rem}.game-turn-indicator{font-size:.75rem;padding:4px 8px}}.ranked-content{display:flex;flex-direction:column;align-items:center;gap:20px;padding-top:20px}.ranked-menu{display:flex;flex-direction:column;gap:14px;width:min(420px,100%)}.ranked-mode-card{text-align:left;padding:18px 20px;border-radius:14px;border:1.5px solid var(--border);background:var(--card);cursor:pointer;transition:border-color .15s,transform .1s}.ranked-mode-card:hover{border-color:var(--purple)}.ranked-mode-card h3{font-size:1rem;color:var(--text);margin-bottom:4px}.ranked-mode-card p{font-size:.82rem;color:var(--text-dim)}.ranked-mode-team{border-color:#facc1559}.ranked-mode-team:hover{border-color:#facc15}.ranked-cola{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 20px;text-align:center}.ranked-cola h3{font-size:1.1rem;color:var(--text)}.ranked-cola-meta{font-size:.82rem;color:var(--text-dim)}.party-lobby{display:flex;flex-direction:column;align-items:center;gap:16px;width:min(380px,100%)}.party-code-label{font-size:.78rem;color:var(--text-label);text-transform:uppercase;letter-spacing:.05em}.party-code-row{display:flex;align-items:center;gap:10px}.party-code{font-size:1.3rem;font-weight:700;color:var(--purple);letter-spacing:.05em}.party-slots{display:flex;flex-direction:column;gap:8px;width:100%}.party-slot{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:12px;border:1.5px dashed var(--border);color:var(--text-dim);font-size:.88rem}.party-slot-filled{border-style:solid;border-color:#a855f759;color:var(--text)}.login-screen{--pl-bg: #0b100e;--pl-ink: #f2ede3;--pl-muted: #b6beb4;--pl-input-bg: #121815;--pl-input-bd: rgba(242, 237, 227, .15);--pl-border: rgba(242, 237, 227, .1);--pl-link: #34d3b4;--pl-err: #ff8080;--amber: #ef9f2e;--amber-hi: #f7ad3f;--amber-ink: #201400;position:fixed;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:1.12fr 1fr;background:var(--pl-bg);color:var(--pl-ink);overflow:auto}.login-screen.is-light{--pl-bg: #f6f6f4;--pl-ink: #16211d;--pl-muted: #566159;--pl-input-bg: #ffffff;--pl-input-bd: rgba(20, 30, 26, .18);--pl-border: rgba(20, 30, 26, .1);--pl-link: #0f8f78;--pl-err: #cf3838}.lg-theme{position:fixed;top:20px;right:20px;z-index:5;width:40px;height:40px;display:grid;place-items:center;border-radius:12px;border:1px solid var(--pl-border);background:color-mix(in srgb,var(--pl-bg) 70%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--pl-ink);cursor:pointer;transition:border-color .18s ease,transform .18s ease}.lg-theme:hover{border-color:var(--amber);transform:translateY(-1px)}.lg-theme:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.lg-scene{--px: 0;--py: 0;position:relative;overflow:hidden;display:grid;place-items:center;padding:48px;color:#f4ecdd;background:radial-gradient(120% 90% at 22% 8%,rgba(239,159,46,.2) 0%,transparent 46%),radial-gradient(90% 80% at 88% 96%,rgba(23,165,138,.16) 0%,transparent 50%),radial-gradient(140% 120% at 50% 40%,#0f221c,#081511 58%,#050d0a)}.lg-scene:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(120% 100% at 50% 45%,transparent 55%,rgba(0,0,0,.45) 100%)}.lg-scene-inner{position:relative;z-index:1;width:min(460px,100%);display:flex;flex-direction:column;gap:40px}.lg-tiles{position:relative;height:320px;margin:0 auto;width:100%;max-width:420px}.lg-tile{position:absolute;filter:drop-shadow(0 26px 34px rgba(0,0,0,.55));transition:transform .35s cubic-bezier(.2,.7,.2,1)}.lg-tile-1{width:150px;left:50%;top:8%;z-index:3;transform:translate(-52%) rotate(-8deg)}.lg-tile-2{width:118px;left:66%;top:30%;z-index:2;opacity:.96;transform:rotate(15deg)}.lg-tile-3{width:104px;left:8%;top:44%;z-index:1;opacity:.9;transform:rotate(-19deg)}.lg-bone-body{fill:#f1e8d6;stroke:#0000001a;stroke-width:1.5}.lg-bone-divider{stroke:#1e160c38;stroke-width:3;stroke-linecap:round}.lg-pip{fill:#20180f}.lg-brand{text-align:center}.lg-wordmark{font-family:Space Grotesk,Inter,sans-serif;font-weight:700;font-size:clamp(3rem,6vw,4.4rem);letter-spacing:-.03em;line-height:1;color:#f4ecdd}.lg-wordmark span{color:var(--amber)}.lg-tagline{margin-top:14px;font-family:Space Grotesk,Inter,sans-serif;font-weight:600;font-size:1rem;letter-spacing:.02em;color:var(--amber-hi)}.lg-blurb{margin:10px auto 0;max-width:34ch;font-size:.92rem;line-height:1.55;color:#f4ecddb8;text-wrap:pretty}.lg-panel{display:grid;place-items:center;padding:48px 40px;background:var(--pl-bg)}.lg-form{width:min(380px,100%);display:flex;flex-direction:column;gap:18px}.lg-form-head{margin-bottom:4px}.lg-mini-mark{display:inline-flex;margin-bottom:16px}.lg-mini-bone{width:26px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.lg-form-head h2{font-family:Space Grotesk,Inter,sans-serif;font-size:1.7rem;font-weight:700;letter-spacing:-.02em;color:var(--pl-ink)}.lg-form-head p{margin-top:6px;font-size:.95rem;color:var(--pl-muted)}.lg-alert{padding:11px 14px;border-radius:10px;font-size:.86rem;font-weight:500;color:var(--pl-err);background:color-mix(in srgb,var(--pl-err) 12%,transparent);border:1px solid color-mix(in srgb,var(--pl-err) 34%,transparent)}.lg-field{display:flex;flex-direction:column;gap:7px}.lg-field label{font-size:.8rem;font-weight:600;color:var(--pl-muted);letter-spacing:.01em}.lg-field input{width:100%;padding:12px 14px;border-radius:11px;background:var(--pl-input-bg);border:1.5px solid var(--pl-input-bd);color:var(--pl-ink);transition:border-color .16s ease,box-shadow .16s ease}.lg-field input::placeholder{color:var(--pl-muted);opacity:.7}.lg-field input:hover{border-color:color-mix(in srgb,var(--amber) 40%,var(--pl-input-bd))}.lg-field input:focus{outline:none;border-color:var(--amber);box-shadow:0 0 0 3px color-mix(in srgb,var(--amber) 24%,transparent)}.lg-field input.has-error{border-color:var(--pl-err);box-shadow:0 0 0 3px color-mix(in srgb,var(--pl-err) 20%,transparent)}.lg-field-err{font-size:.78rem;color:var(--pl-err);font-weight:500}.lg-pw{display:flex;align-items:center;gap:10px;margin-top:3px}.lg-pw-bars{display:flex;gap:4px;flex:1}.lg-pw-bar{height:4px;flex:1;border-radius:2px;background:var(--pl-input-bd);transition:background .2s ease}.lg-pw-bar.s1{background:#e0603a}.lg-pw-bar.s2{background:var(--amber)}.lg-pw-bar.s3{background:#34d3b4}.lg-pw-label{font-size:.74rem;font-weight:600;color:var(--pl-muted);min-width:44px;text-align:right}.lg-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.lg-check{display:inline-flex;align-items:center;gap:9px;font-size:.86rem;color:var(--pl-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.lg-check input{position:absolute;opacity:0;width:0;height:0}.lg-check-box{width:18px;height:18px;border-radius:6px;border:1.5px solid var(--pl-input-bd);background:var(--pl-input-bg);display:grid;place-items:center;transition:background .15s ease,border-color .15s ease}.lg-check-box:after{content:"";width:9px;height:9px;border-radius:2px;background:var(--amber-ink);transform:scale(0);transition:transform .15s cubic-bezier(.2,.7,.2,1)}.lg-check input:checked+.lg-check-box{background:var(--amber);border-color:var(--amber)}.lg-check input:checked+.lg-check-box:after{transform:scale(1)}.lg-check input:focus-visible+.lg-check-box{outline:2px solid var(--amber);outline-offset:2px}.lg-link{background:none;border:none;padding:0;font-size:.86rem;color:var(--pl-link);font-weight:500;cursor:pointer}.lg-link:hover{text-decoration:underline}.lg-link:disabled{opacity:.5;cursor:default}.lg-link-strong{font-weight:700}.lg-link:focus-visible{outline:2px solid var(--pl-link);outline-offset:2px;border-radius:3px}.lg-submit{margin-top:4px;width:100%;padding:13px;border:none;border-radius:11px;background:var(--amber);color:var(--amber-ink);font-weight:700;font-size:.95rem;cursor:pointer;transition:transform .16s ease,box-shadow .2s ease,background .16s ease;box-shadow:0 8px 22px -8px color-mix(in srgb,var(--amber) 70%,transparent)}.lg-submit:hover:not(:disabled){background:var(--amber-hi);transform:translateY(-1px);box-shadow:0 12px 28px -8px color-mix(in srgb,var(--amber) 80%,transparent)}.lg-submit:active:not(:disabled){transform:translateY(0)}.lg-submit:focus-visible{outline:2px solid var(--pl-ink);outline-offset:2px}.lg-submit:disabled{opacity:.7;cursor:default}.lg-divider{display:flex;align-items:center;gap:14px;color:var(--pl-muted);font-size:.78rem}.lg-divider:before,.lg-divider:after{content:"";flex:1;height:1px;background:var(--pl-border)}.lg-google{width:100%;padding:12px;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:11px;border:1.5px solid var(--pl-input-bd);background:transparent;color:var(--pl-ink);font-weight:600;font-size:.9rem;cursor:not-allowed;opacity:.55}.lg-foot{margin-top:4px;text-align:center;font-size:.88rem;color:var(--pl-muted)}.lg-sent{text-align:center}.lg-sent-icon{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 4px;border-radius:16px;font-size:1.6rem;background:color-mix(in srgb,var(--amber) 16%,transparent);border:1px solid color-mix(in srgb,var(--amber) 34%,transparent)}.lg-sent h2{font-family:Space Grotesk,Inter,sans-serif;font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:var(--pl-ink)}.lg-sent-sub{font-size:.92rem;line-height:1.55;color:var(--pl-muted);max-width:34ch;margin:0 auto;text-wrap:pretty}.lg-sent strong{color:var(--pl-ink);font-weight:600}@keyframes lgRise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: no-preference){.lg-form>*{animation:lgRise .5s cubic-bezier(.2,.7,.2,1) both}.lg-form>*:nth-child(1){animation-delay:.04s}.lg-form>*:nth-child(2){animation-delay:.09s}.lg-form>*:nth-child(3){animation-delay:.14s}.lg-form>*:nth-child(4){animation-delay:.19s}.lg-form>*:nth-child(5){animation-delay:.24s}.lg-form>*:nth-child(6){animation-delay:.29s}.lg-form>*:nth-child(7){animation-delay:.34s}.lg-brand{animation:lgRise .6s cubic-bezier(.2,.7,.2,1) both .1s}@media (pointer: fine){.lg-tile-1{transform:translate(-52%) rotate(-8deg) translate(calc(var(--px) * 26px),calc(var(--py) * 20px))}.lg-tile-2{transform:rotate(15deg) translate(calc(var(--px) * 40px),calc(var(--py) * 30px))}.lg-tile-3{transform:rotate(-19deg) translate(calc(var(--px) * 16px),calc(var(--py) * 12px))}}}@media (max-width: 860px){.login-screen{position:static;display:flex;flex-direction:column;min-height:100vh}.lg-scene{flex:none;padding:46px 32px 30px}.lg-scene-inner{gap:22px;width:min(420px,100%)}.lg-tiles{height:168px;max-width:300px}.lg-tile-1{width:100px;top:4%}.lg-tile-2{width:80px}.lg-tile-3{width:72px}.lg-wordmark{font-size:clamp(2.6rem,12vw,3.4rem)}.lg-blurb{display:none}.lg-panel{flex:1;padding:34px 28px 44px;align-items:start}}@media (max-width: 480px){.lg-tiles{display:none}.lg-scene{padding:40px 26px 26px}.lg-scene-inner{gap:14px}.lg-mini-mark{display:none}}.dash{--d-bg: #0a0f0d;--d-surface: #111815;--d-surface-2: #0e1512;--d-ink: #f2ede3;--d-muted: #b6beb4;--d-border: rgba(242, 237, 227, .1);--d-border-hi: rgba(242, 237, 227, .18);--amber: #ef9f2e;--amber-hi: #f7ad3f;--amber-ink: #201400;--teal: #34d3b4;min-height:100vh;background:radial-gradient(120% 70% at 12% -8%,rgba(239,159,46,.1) 0%,transparent 46%),radial-gradient(90% 60% at 96% 4%,rgba(23,165,138,.08) 0%,transparent 50%),var(--d-bg);color:var(--d-ink)}.dash.is-light{--d-bg: #f4f4f2;--d-surface: #ffffff;--d-surface-2: #fbfbfa;--d-ink: #16211d;--d-muted: #566159;--d-border: rgba(20, 30, 26, .1);--d-border-hi: rgba(20, 30, 26, .16);--teal: #0f8f78}.dash-nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;padding:12px 24px;border-bottom:1px solid var(--d-border);background:color-mix(in srgb,var(--d-bg) 82%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.dash-brand{display:flex;align-items:center;gap:10px}.dash-brand-tile{width:17px;filter:drop-shadow(0 2px 5px rgba(0,0,0,.35))}.dash-wordmark{font-family:Space Grotesk,Inter,sans-serif;font-weight:700;font-size:1.25rem;letter-spacing:-.02em;color:var(--d-ink)}.dash-wordmark span{color:var(--amber)}.dash-nav-right{margin-left:auto;display:flex;align-items:center;gap:10px}.dash-icon-btn{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;border:1px solid var(--d-border);background:var(--d-surface);color:var(--d-ink);cursor:pointer;transition:border-color .16s ease,transform .16s ease}.dash-icon-btn:hover{border-color:var(--amber);transform:translateY(-1px)}.dash-icon-btn:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.dash-pieces-tile{width:15px}.dash-user{display:flex;align-items:center;gap:9px;padding:5px 12px 5px 5px;border-radius:30px;border:1px solid var(--d-border);background:var(--d-surface);color:var(--d-ink);cursor:pointer;transition:border-color .16s ease}.dash-user:hover{border-color:var(--amber)}.dash-user:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.dash-avatar{width:30px;height:30px;border-radius:50%;overflow:hidden;flex-shrink:0;display:grid;place-items:center;font-size:.82rem;font-weight:800;color:var(--amber-ink);background:linear-gradient(135deg,var(--amber-hi),var(--amber))}.dash-avatar img{width:100%;height:100%;object-fit:cover}.dash-user-meta{display:flex;flex-direction:column;line-height:1.15;text-align:left}.dash-username{font-size:.82rem;font-weight:600;color:var(--d-ink)}.dash-segmento{font-size:.62rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--d-muted)}.dash-logout{padding:8px 15px;font-size:.82rem;font-weight:600;border-radius:10px;border:1px solid var(--d-border);background:transparent;color:var(--d-muted);cursor:pointer;transition:border-color .16s ease,color .16s ease}.dash-logout:hover{border-color:#e06060;color:#e06060}.dash-body{max-width:1000px;margin:0 auto;padding:44px 24px 64px}.dash-hero{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;margin-bottom:44px}.dash-hello{font-size:.95rem;color:var(--d-muted)}.dash-greeting h1{font-family:Space Grotesk,Inter,sans-serif;font-size:clamp(2rem,4vw,2.7rem);font-weight:700;letter-spacing:-.03em;line-height:1.05;color:var(--d-ink);margin:2px 0 8px}.dash-sub{font-size:.95rem;color:var(--d-muted)}.dash-rank{display:flex;align-items:center;gap:16px;padding:16px 22px;border-radius:16px;border:1px solid var(--d-border);background:var(--d-surface);min-width:280px}.dash-rank-badge{width:66px;height:66px;flex-shrink:0;display:grid;place-items:center;filter:drop-shadow(0 6px 14px rgba(0,0,0,.3))}.dash-rank-badge img{width:100%;height:100%;object-fit:contain}.dash-rank-badge-empty,.dash-rank-fallback{font-size:1.8rem;color:var(--d-muted);opacity:.5}.dash-rank-info{display:flex;flex-direction:column;gap:3px;min-width:0}.dash-rank-name{font-family:Space Grotesk,Inter,sans-serif;font-size:1.1rem;font-weight:700;color:var(--d-ink)}.dash-rank-elo{font-size:.95rem;font-weight:700;color:var(--amber)}.dash-rank-elo em{font-style:normal;font-size:.7rem;color:var(--d-muted);font-weight:600}.dash-rank-prog{margin-top:5px;display:flex;flex-direction:column;gap:4px}.dash-rank-track{width:168px;max-width:100%;height:6px;border-radius:3px;background:var(--d-border-hi);overflow:hidden}.dash-rank-fill{height:100%;border-radius:3px;background:linear-gradient(90deg,var(--amber),var(--amber-hi))}.dash-rank-next{font-size:.74rem;color:var(--d-muted)}.dash-rank-empty{display:flex;align-items:center;gap:14px}.dash-section-title{font-family:Space Grotesk,Inter,sans-serif;font-size:1.2rem;font-weight:700;letter-spacing:-.01em;color:var(--d-ink);margin-bottom:16px}.dash-featured{position:relative;overflow:hidden;width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:30px 32px;margin-bottom:20px;border-radius:20px;border:1px solid rgba(239,159,46,.32);cursor:pointer;color:#f4ecdd;background:radial-gradient(120% 140% at 8% 0%,rgba(239,159,46,.22) 0%,transparent 48%),radial-gradient(120% 160% at 100% 100%,rgba(23,165,138,.14) 0%,transparent 55%),linear-gradient(135deg,#10221c,#0a1612 60%,#081210);transition:transform .18s ease,box-shadow .2s ease,border-color .18s ease}.dash-featured:hover{transform:translateY(-2px);border-color:var(--amber);box-shadow:0 18px 40px -18px #ef9f2e80}.dash-featured:focus-visible{outline:2px solid var(--amber);outline-offset:3px}.dash-featured-tile{position:absolute;opacity:.14;pointer-events:none;filter:drop-shadow(0 10px 20px rgba(0,0,0,.4))}.dash-featured-tile-a{width:120px;right:8%;top:-24px;transform:rotate(18deg)}.dash-featured-tile-b{width:90px;right:20%;bottom:-34px;transform:rotate(-12deg)}.dash-featured-content{position:relative;z-index:1;max-width:42ch}.dash-featured-kicker{display:inline-flex;align-items:center;gap:7px;font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--amber-hi)}.dash-featured-kicker svg{width:15px;height:15px}.dash-featured h3{font-family:Space Grotesk,Inter,sans-serif;font-size:1.7rem;font-weight:700;letter-spacing:-.02em;margin:8px 0}.dash-featured p{font-size:.92rem;line-height:1.55;color:#f4ecddc7}.dash-featured-action{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-end;gap:12px}.dash-featured-rank{display:flex;align-items:center;gap:8px;font-size:.82rem;font-weight:700;color:#f4ecdd}.dash-featured-rank img{width:30px;height:30px;object-fit:contain}.dash-featured-cta{padding:12px 22px;border-radius:12px;background:var(--amber);color:var(--amber-ink);font-weight:700;font-size:.92rem;white-space:nowrap;box-shadow:0 8px 20px -8px #ef9f2eb3}.dash-featured:hover .dash-featured-cta{background:var(--amber-hi)}.dash-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-bottom:40px}.dash-card{text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:24px;border-radius:16px;border:1px solid var(--d-border);background:var(--d-surface);color:var(--d-ink);cursor:pointer;transition:transform .18s ease,border-color .18s ease}.dash-card-body{display:flex;flex-direction:column;gap:6px;flex:1}.dash-card:hover{transform:translateY(-2px)}.dash-card:focus-visible{outline:2px solid var(--teal);outline-offset:2px}.dash-card-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px}.dash-card-icon svg{width:22px;height:22px}.dash-card-teal .dash-card-icon{background:color-mix(in srgb,var(--teal) 16%,transparent);color:var(--teal)}.dash-card-neutral .dash-card-icon{background:var(--d-border-hi);color:var(--d-muted)}.dash-card-teal:hover{border-color:var(--teal)}.dash-card-neutral:hover{border-color:var(--d-border-hi)}.dash-card-title{font-family:Space Grotesk,Inter,sans-serif;font-size:1.05rem;font-weight:700;color:var(--d-ink)}.dash-card-desc{font-size:.86rem;line-height:1.5;color:var(--d-muted);flex:1}.dash-card-cta{font-size:.86rem;font-weight:700;color:var(--d-ink)}.dash-card-teal .dash-card-cta{color:var(--teal)}.dash-modes{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.dash-modes-label{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--d-muted);margin-right:4px}.dash-chip{padding:5px 13px;border-radius:20px;border:1px solid var(--d-border);background:var(--d-surface);font-size:.8rem;font-weight:500;color:var(--d-ink);text-transform:capitalize}@media (prefers-reduced-motion: no-preference){@keyframes dashRise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.dash-hero,.dash-section-title,.dash-featured,.dash-row,.dash-modes{animation:dashRise .5s cubic-bezier(.2,.7,.2,1) both}.dash-section-title{animation-delay:.05s}.dash-featured{animation-delay:.1s}.dash-row{animation-delay:.15s}.dash-modes{animation-delay:.2s}}@media (max-width: 720px){.dash-nav{padding:10px 14px;gap:8px}.dash-user-meta{display:none}.dash-body{padding:32px 16px 48px}.dash-hero{gap:20px}.dash-rank{min-width:0;width:100%}.dash-featured{padding:24px}.dash-featured-action{align-items:flex-start;width:100%}.dash-featured-tile-a{width:90px}.dash-featured-tile-b{display:none}}.pdemo{--d-bg: #0a0f0d;--d-surface: #111815;--d-ink: #f2ede3;--d-muted: #b6beb4;--d-border: rgba(242, 237, 227, .1);--amber: #ef9f2e;--teal: #34d3b4;min-height:100vh;background:radial-gradient(120% 70% at 12% -8%,rgba(239,159,46,.1) 0%,transparent 46%),var(--d-bg);color:var(--d-ink)}:root.light .pdemo{--d-bg: #f4f4f2;--d-surface: #ffffff;--d-ink: #16211d;--d-muted: #566159;--d-border: rgba(20, 30, 26, .1);--teal: #0f8f78}.pdemo-inner{max-width:1000px;margin:0 auto;padding:40px 24px 64px}.pdemo-back{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;margin-bottom:28px;border-radius:10px;border:1px solid var(--d-border);background:var(--d-surface);color:var(--d-muted);font-size:.85rem;font-weight:600;cursor:pointer;transition:border-color .16s ease,color .16s ease}.pdemo-back:hover{border-color:var(--amber);color:var(--d-ink)}.pdemo-back svg{width:15px;height:15px}.pdemo-head{margin-bottom:40px}.pdemo-head h1{font-family:Space Grotesk,Inter,sans-serif;font-size:clamp(1.9rem,4vw,2.5rem);font-weight:700;letter-spacing:-.03em;color:var(--d-ink)}.pdemo-head p{margin-top:8px;font-size:.95rem;color:var(--d-muted)}.pdemo-section{margin-bottom:40px}.pdemo-section h2{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;font-family:Space Grotesk,Inter,sans-serif;font-size:1.15rem;font-weight:700;letter-spacing:-.01em;color:var(--d-ink);margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--d-border)}.pdemo-section h2 span{font-family:Inter,sans-serif;font-size:.78rem;font-weight:600;letter-spacing:0;color:var(--d-muted)}.pdemo-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}.pdemo-states{gap:22px}.pdemo-state{display:flex;flex-direction:column;gap:8px}.pdemo-state-label{font-size:.72rem;font-weight:600;letter-spacing:.02em;color:var(--d-muted)}.pdemo-rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.pdemo-rule{display:flex;align-items:flex-start;gap:13px;padding:16px 18px;border-radius:14px;border:1px solid var(--d-border);background:var(--d-surface)}.pdemo-rule-icon{flex-shrink:0;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;font-size:1.05rem;background:color-mix(in srgb,var(--amber) 14%,transparent)}.pdemo-rule p{font-size:.9rem;line-height:1.55;color:var(--d-muted)}.pdemo-rule strong{color:var(--d-ink);font-weight:700}.pdemo-rule em{font-style:normal;font-weight:700;color:var(--amber)}@media (max-width: 720px){.pdemo-inner{padding:28px 16px 48px}}
