:root{color-scheme:dark;font-family:Inter,sans-serif;--bg: #071018;--bg-soft: #0d1721;--panel: rgba(15, 23, 33, .88);--panel-strong: rgba(10, 18, 27, .96);--panel-alt: rgba(19, 30, 44, .82);--line: rgba(255, 255, 255, .08);--line-strong: rgba(0, 201, 109, .3);--text: #eef3f8;--muted: #9aa9bb;--accent: #00c96d;--accent-soft: #00b4d8;--danger: #ef4444;--warning: #f59e0b;--radius: 18px;--radius-sm: 12px;--shadow: 0 20px 60px rgba(0, 0, 0, .34)}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-height:100vh;background:radial-gradient(circle at top left,rgba(0,201,109,.16),transparent 28%),radial-gradient(circle at top right,rgba(0,180,216,.16),transparent 24%),linear-gradient(180deg,#071018,#0a131c);color:var(--text)}img{display:block;max-width:100%}button,input,textarea,select{font:inherit}button{cursor:pointer}.marketing-shell,.app-shell{position:relative;overflow:hidden}.marketing-shell{min-height:100vh;padding:1.5rem clamp(1rem,2vw,2rem) 2rem}.marketing-nav,.marketing-hero,.feature-strip,.server-rail,.left-sidebar,.main-stage,.right-panel{position:relative;z-index:1}.marketing-nav{max-width:1360px;margin:0 auto 1.5rem;padding:1rem 1.2rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid var(--line);border-radius:18px;background:#080f17eb;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand-block,.marketing-actions,.hero-cta-row,.section-title-row,.message-meta,.row-actions,.voice-actions,.header-actions,.profile-dock,.modal-inline,.row-inline-block{display:flex;align-items:center}.brand-block{gap:.9rem}.brand-block img,.sidebar-hero img,.brand-orb img{width:48px;height:48px;object-fit:cover;border-radius:14px}.brand-block strong,.hero-copy-panel h1,.auth-heading h2,.stage-header h2,.detail-hero h3,.voice-stage-card h3{font-family:Poppins,sans-serif;letter-spacing:0}.brand-block span,.hero-text,.stage-subcopy,.muted-copy,.channel-banner p,.detail-hero p,.voice-stage-card p,.feature-strip p{color:var(--muted);line-height:1.6}.hero-text{font-size:1.08rem;color:#b8c9d8}.marketing-actions,.hero-cta-row,.header-actions{gap:.75rem;flex-wrap:wrap}.marketing-hero{max-width:1360px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(360px,460px);gap:1.4rem;align-items:stretch}.hero-copy-panel,.auth-card-surface,.sidebar-hero,.sidebar-nav-card,.sidebar-section,.profile-dock,.main-stage,.detail-card,.detail-hero,.friends-card,.channel-banner,.message-card,.composer,.empty-card,.inline-error,.voice-stage-card,.voice-user-card,.modal-card,.loading-screen{border:1px solid var(--line);background:var(--panel-strong);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.hero-copy-panel{min-height:620px;padding:clamp(1.5rem,3vw,3rem);border-radius:28px;background:linear-gradient(145deg,#00c96d1f,#041018eb),url(/brand-mark.jpg) center/cover;display:flex;flex-direction:column;justify-content:center;gap:1.2rem}.eyebrow{margin:0;font-size:.75rem;color:#7ed5ff;text-transform:uppercase;letter-spacing:.24em}.hero-copy-panel h1{margin:0;font-size:clamp(2.6rem,5vw,5rem);line-height:1;max-width:11ch}.hero-text{max-width:60ch;font-size:1.02rem}.hero-stats,.feature-strip,.friends-grid,.voice-grid,.swatch-grid,.field-grid{display:grid}.hero-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.hero-stats article,.feature-strip article{padding:1rem 1.1rem;border-radius:16px;background:#071018d9;border:1px solid rgba(255,255,255,.08)}.hero-stats strong,.feature-strip span,.section-title-row span,.voice-stage-card h3{display:block;margin-bottom:.35rem}.auth-card-surface{padding:1rem;border-radius:28px;display:flex;flex-direction:column;justify-content:center;background:#0a121bf5}.auth-tabs,.sidebar-nav-card{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;padding:.45rem;border-radius:16px;background:#ffffff0a;border:1px solid var(--line)}.auth-form,.friend-list,.request-list,.leaderboard-list,.mod-feed,.member-list,.result-list,.server-channel-groups,.sidebar-scroll,.message-stream{display:flex;flex-direction:column}.auth-form{gap:1rem;padding:1.5rem}.auth-heading h2,.stage-header h2,.detail-hero h3,.voice-stage-card h3{margin:0}.auth-heading p,.stage-subcopy,.section-title-row small,.profile-dock small,.dm-row small,.friend-row small,.request-row small,.result-row small,.member-row small,.voice-user-card small{color:var(--muted)}.field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}label{display:flex;flex-direction:column;gap:.5rem;font-weight:600}input,textarea,select{width:100%;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:#040b12f2;color:var(--text);padding:.9rem 1rem;outline:none}textarea{min-height:110px;resize:vertical}input:focus,textarea:focus,select:focus{border-color:#00c96d99;box-shadow:0 0 0 3px #00c96d1f}.turnstile-box{min-height:66px}.form-error,.inline-error{color:#fecaca}.inline-error{padding:.9rem 1rem;border-radius:14px}.primary-button,.ghost-button,.mini-button,.rail-slot,.rail-add,.auth-tabs button,.sidebar-nav-card button,.channel-row,.dm-row,.voice-row button:first-child,.swatch{border:0;transition:.18s ease}.primary-button,.ghost-button,.mini-button{padding:.88rem 1rem;border-radius:12px;font-weight:700}.primary-button{background:linear-gradient(135deg,var(--accent),#00a057);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3)}.ghost-button,.mini-button,.rail-slot,.rail-add,.auth-tabs button,.sidebar-nav-card button,.channel-row,.dm-row,.voice-row button:first-child{background:#ffffff12;color:var(--text);border:1px solid rgba(255,255,255,.1)}.compact{padding:.6rem .85rem}.auth-tabs button.active,.sidebar-nav-card button.active,.rail-slot.active,.channel-row.active,.dm-row.active,.voice-row.active>button:first-child{background:linear-gradient(135deg,#00c96d38,#00b4d826);box-shadow:inset 0 0 0 1px #7ed5ff29}.feature-strip{max-width:1360px;margin:1.4rem auto 0;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.app-shell{min-height:100vh;padding:1rem;display:grid;grid-template-columns:88px 320px minmax(0,1fr) 320px;gap:1rem}.ambient-grid{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:34px 34px;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.3),transparent 100%);mask-image:linear-gradient(180deg,rgba(0,0,0,.3),transparent 100%);pointer-events:none}.server-rail,.left-sidebar,.right-panel{min-height:calc(100vh - 2rem)}.server-rail{border:1px solid var(--line);border-radius:24px;background:var(--panel-strong);display:flex;flex-direction:column;align-items:center;gap:.9rem;padding:1rem .75rem}.brand-orb{width:58px;height:58px;border-radius:18px;overflow:hidden}.rail-slot,.rail-add{width:56px;min-height:56px;border-radius:18px;font-weight:800}.left-sidebar,.right-panel{display:flex;flex-direction:column;gap:1rem}.sidebar-hero,.detail-hero{padding:1.2rem;border-radius:20px;min-height:160px;display:flex;gap:1rem;align-items:flex-end}.sidebar-hero span{color:#fffc}.sidebar-section,.detail-card,.friends-card,.voice-stage-card{border-radius:20px;padding:1rem}.fill{flex:1}.sidebar-section{display:flex;flex-direction:column;gap:.85rem}.sidebar-scroll,.server-channel-groups,.member-list,.result-list,.message-stream{gap:.7rem}.channel-heading{margin:0 0 .55rem;font-size:.82rem;color:var(--muted);text-transform:uppercase;letter-spacing:.12em}.channel-row,.dm-row,.friend-row,.request-row,.result-row,.member-row,.leaderboard-row,.mod-row,.voice-row,.message-card,.composer{border-radius:14px}.channel-row,.dm-row,.friend-row,.request-row,.result-row,.member-row,.leaderboard-row,.mod-row{padding:.85rem .95rem;border:1px solid var(--line);background:#ffffff0a}.channel-row,.dm-row{text-align:left}.dm-row,.friend-row,.request-row,.result-row,.member-row,.leaderboard-row,.voice-row,.mod-row{display:flex;align-items:center;gap:.85rem}.friend-row,.request-row,.result-row,.leaderboard-row,.member-row{justify-content:space-between}.friend-row>div:first-of-type,.request-row>div:first-of-type,.result-row>div:first-of-type,.member-row>div:first-of-type,.leaderboard-row>div:first-of-type,.dm-row>div{flex:1}.voice-row{justify-content:space-between;border:1px solid var(--line);background:#ffffff06;padding:.35rem}.voice-row button:first-child{display:flex;align-items:center;gap:.65rem;flex:1;padding:.65rem .8rem;border-radius:12px;text-align:left}.profile-dock{gap:.85rem;padding:.9rem;border-radius:18px}.profile-dock-text{flex:1}.avatar{width:42px;height:42px;flex:0 0 42px;display:inline-flex;align-items:center;justify-content:center;border-radius:14px;color:#fff;font-weight:800;object-fit:cover}.avatar.large{width:58px;height:58px;flex-basis:58px;border-radius:18px}.main-stage{min-height:calc(100vh - 2rem);border-radius:28px;padding:1rem;display:flex;flex-direction:column;gap:1rem}.stage-header{padding:.5rem .25rem 0;display:flex;justify-content:space-between;gap:1rem}.stage-subcopy{margin:.4rem 0 0}.message-stream{flex:1;min-height:0;overflow:auto;padding-right:.35rem}.channel-banner,.message-card,.composer,.empty-card,.voice-user-card{padding:1rem}.message-card{display:flex;gap:.9rem;background:#0c141eb3;border:1px solid rgba(255,255,255,.06)}.message-body{flex:1}.attachment-list{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:.7rem}.attachment-card{min-width:180px;padding:.75rem .85rem;border-radius:12px;border:1px solid rgba(0,201,109,.18);background:#00c96d14;display:flex;flex-direction:column;gap:.2rem}.attachment-card small{color:var(--muted)}.message-meta{gap:.55rem;margin-bottom:.25rem;flex-wrap:wrap}.message-meta span,.typing-indicator,.stat-list span{color:var(--muted)}.typing-indicator{margin:0;padding:0 .2rem}.composer{gap:.8rem}.composer-attachment-pill{display:flex;align-items:center;gap:.8rem;padding:.75rem .85rem;border-radius:12px;background:#ffffff0a;border:1px solid var(--line);flex-wrap:wrap}.composer-attachment-pill small{color:var(--muted)}.composer input{flex:1}.right-panel{gap:1rem}.stat-list{display:flex;flex-direction:column;gap:.9rem}.stat-list div{display:flex;justify-content:space-between;gap:1rem}.friends-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.friends-card.wide,.voice-stage{grid-column:1 / -1}.voice-stage{display:flex;flex-direction:column;gap:1rem}.voice-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}.voice-user-card{border-radius:18px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:.55rem}.voice-actions{gap:.9rem;flex-wrap:wrap}.role-pill{display:inline-flex;align-items:center;justify-content:center;padding:.3rem .55rem;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:#ffffff14;color:var(--text);font-size:.76rem;white-space:nowrap}.role-pill.subtle{background:#ffffff0a}.role-admin,.role-owner{background:#00c96d29;border-color:#00c96d47}.role-mod,.role-staff{background:#00b4d829;border-color:#00b4d847}.role-soporte{background:#f59e0b29;border-color:#f59e0b47}.role-banned,.role-suspended{background:#ef444429;border-color:#ef444447}.presence-dot{width:10px;height:10px;border-radius:999px;background:#475569}.presence-dot.online{background:var(--accent)}.presence-dot.offline{background:#64748b}.leaderboard-list,.mod-feed{gap:.65rem}.audit-list{margin-top:.5rem}.mod-row{align-items:flex-start;justify-content:space-between}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;padding:2rem 1rem;background:#02060bad;display:grid;place-items:center;z-index:20}.modal-card{width:min(100%,640px);max-height:calc(100vh - 4rem);overflow:auto;border-radius:24px;padding:1.25rem;display:flex;flex-direction:column;gap:1rem}.modal-card h3{margin:0;font-family:Poppins,sans-serif}.modal-inline{gap:.8rem}.modal-inline input{flex:1}.stacked-row{align-items:stretch;flex-direction:column}.row-inline-block{gap:.8rem}.swatch-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}.banner-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.swatch{min-height:58px;border-radius:14px;border:1px solid rgba(255,255,255,.08)}.swatch.active{box-shadow:inset 0 0 0 2px #fff}.swatch.banner{min-height:88px}.right-tabs{display:flex;gap:.35rem;padding:.4rem;border-radius:14px;background:#ffffff0a;border:1px solid var(--line)}.right-tab{flex:1;padding:.6rem .5rem;border-radius:10px;border:0;background:transparent;color:var(--muted);font-weight:600;font-size:.82rem;cursor:pointer;transition:.15s ease}.right-tab:hover{background:#ffffff0d;color:var(--text)}.right-tab.active{background:linear-gradient(135deg,#00c96d38,#00b4d826);color:var(--text);box-shadow:inset 0 0 0 1px #7ed5ff29}.swatch-section{display:flex;flex-direction:column;gap:.5rem}.swatch-label{font-size:.82rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.swatch{min-height:64px;border-radius:14px;border:2px solid rgba(255,255,255,.08);cursor:pointer;transition:.15s ease}.swatch:hover{border-color:#fff3;transform:scale(1.03)}.swatch.active{border-color:var(--accent);box-shadow:0 0 0 2px #00c96d4d}.swatch.banner{min-height:96px}.theme-grid{display:flex;flex-wrap:wrap;gap:.45rem}.theme-chip{padding:.5rem .85rem;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;color:var(--muted);font-size:.82rem;font-weight:600;cursor:pointer;transition:.15s ease}.theme-chip:hover{background:#ffffff14;color:var(--text)}.theme-chip.active{background:linear-gradient(135deg,#00c96d38,#00b4d826);border-color:var(--accent);color:var(--text)}.server-settings-form{display:flex;flex-direction:column;gap:.85rem}.loading-screen{min-height:100vh;display:grid;place-items:center;text-align:center}.stacked{gap:.8rem;padding:2rem}@media (max-width: 1280px){.app-shell{grid-template-columns:80px 280px minmax(0,1fr)}.right-panel{display:none}}@media (max-width: 1040px){.marketing-hero,.app-shell,.friends-grid,.hero-stats,.feature-strip{grid-template-columns:1fr}.marketing-shell{padding-inline:1rem}.app-shell{padding:.75rem}.server-rail{flex-direction:row;min-height:auto;overflow:auto}.left-sidebar,.main-stage{min-height:auto}}@media (max-width: 720px){.marketing-nav,.stage-header,.profile-dock,.friend-row,.request-row,.result-row,.member-row,.leaderboard-row,.mod-row,.voice-actions,.modal-inline{flex-direction:column;align-items:stretch}.field-grid,.swatch-grid,.banner-grid{grid-template-columns:1fr}.server-rail{gap:.6rem}.rail-slot,.rail-add{width:52px;min-height:52px}.hero-copy-panel h1{max-width:none;font-size:2.4rem}}