/*
    Archivo: assets/css/style.css
    Versión: 1.0.2
    Fecha: 2026-06-08 07:05 hrs.
    Descripción: Estilos responsive estilo Juego del UNO para acceso, lobby, enlace, IA y arena emoji de KIMUS Kombat.
*/
:root{
    --bg:#070814;
    --panel:rgba(13,18,38,.88);
    --panel2:rgba(18,24,46,.92);
    --line:rgba(100,255,225,.48);
    --neon:#64ffe1;
    --gold:#ffe66d;
    --orange:#ffbc4a;
    --red:#ff4f6d;
    --blue:#54b8ff;
    --green:#69ff9c;
    --text:#ffffff;
    --muted:#cfe2ff;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;background:radial-gradient(circle at 12% 8%,rgba(255,230,109,.16),transparent 25%),radial-gradient(circle at 88% 14%,rgba(100,255,225,.16),transparent 28%),linear-gradient(160deg,#0b0615,#090814 55%,#030409);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
a{color:inherit;text-decoration:none}.hidden{display:none!important}.anti-bot-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}.page-inicio,.page-salas,.lobby-page,.kk-page{background:radial-gradient(circle at 12% 8%,rgba(255,230,109,.16),transparent 25%),radial-gradient(circle at 88% 14%,rgba(100,255,225,.16),transparent 28%),linear-gradient(160deg,#0b0615,#090814 55%,#030409)}
body.kk-fight-page{overflow:hidden;touch-action:none}
.app-shell,.kk-shell{width:min(1280px,100%);margin:0 auto;padding:18px;display:flex;flex-direction:column;gap:18px}.fight-app-shell{height:100dvh;overflow:hidden}.hero-card,.kk-hero{position:relative;display:flex;align-items:center;gap:18px;border:2px solid var(--line);background:linear-gradient(145deg,rgba(18,27,55,.94),rgba(5,8,18,.9));border-radius:28px;padding:24px;box-shadow:0 0 28px rgba(100,255,225,.14)}.compact-hero{padding:20px 22px}.room-lobby-hero{padding:16px 20px}.hero-logo,.brand-mark,.kk-logo{width:100px;height:100px;display:grid;place-items:center;border-radius:26px;background:radial-gradient(circle,rgba(255,230,109,.24),rgba(100,255,225,.11));border:2px solid rgba(255,230,109,.48);box-shadow:0 0 22px rgba(255,230,109,.18)}.emoji-logo{font-size:56px;line-height:1}.eyebrow,.kk-eyebrow{margin:0 0 6px;color:var(--neon);font-weight:1000;text-transform:uppercase;letter-spacing:.1em;font-size:13px}.hero-card h1,.kk-hero h1,.brand-row h1,.kk-fight-top h1{margin:0;color:var(--gold);text-shadow:0 4px #000,0 0 18px rgba(255,230,109,.50);font-size:clamp(38px,6vw,72px);line-height:.95}.hero-subtitle,.hint{margin:8px 0 0;color:var(--muted);font-size:clamp(15px,2.2vw,20px);line-height:1.35}.panel,.kk-panel{border:2px solid var(--line);background:var(--panel);border-radius:24px;padding:20px;box-shadow:0 0 24px rgba(100,255,225,.10)}.section-title-row,.kk-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.section-title-row.compact{margin-bottom:12px}.section-title-row h2,.kk-title-row h2,.panel h2{margin:0;color:#fff;font-size:clamp(24px,3vw,31px);text-shadow:0 2px #000}.pill,.kk-pill{border:2px solid var(--neon);border-radius:999px;padding:8px 13px;background:rgba(0,0,0,.25);font-weight:1000;white-space:nowrap;box-shadow:0 0 12px rgba(100,255,225,.12)}.btn,.kk-btn{border:2px solid var(--line);background:linear-gradient(145deg,#111b35,#050812);color:#fff;border-radius:17px;padding:12px 18px;font-weight:1000;cursor:pointer;box-shadow:0 0 12px rgba(100,255,225,.13);display:inline-flex;align-items:center;justify-content:center;gap:8px;text-align:center;min-height:48px;font-size:17px}.btn:hover,.kk-btn:hover{filter:brightness(1.07)}.btn:active,.kk-btn:active{transform:scale(.98)}.btn-primary,.kk-btn-primary{border-color:var(--gold);background:linear-gradient(145deg,var(--gold),var(--orange));color:#111}.btn-danger,.kk-btn-danger{border-color:var(--red);background:linear-gradient(145deg,#541022,#16050b);color:#fff}.btn-ghost{background:linear-gradient(145deg,#101932,#050812)}.btn-bot{border-color:#caa6ff;background:linear-gradient(145deg,#342253,#0a0712)}.btn-block{width:100%}.btn-small{min-height:40px;padding:8px 12px;font-size:14px}.top-home-btn{align-self:flex-start}.top-mini-btn{position:absolute;left:16px;top:50%;transform:translateY(-50%);z-index:2}.page-salas .hero-card{padding-left:160px}input,select{width:100%;border:2px solid rgba(255,255,255,.16);border-radius:16px;background:rgba(0,0,0,.28);color:#fff;padding:14px 15px;font-weight:900;outline:none;font-size:16px}input:focus,select:focus{border-color:var(--neon);box-shadow:0 0 14px rgba(100,255,225,.16)}label{display:block;font-weight:1000;color:#eafaff;margin:8px 0 7px}.name-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}.message-box{border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.20);border-radius:15px;padding:10px 12px;color:var(--muted);margin-top:10px}.message-box.good{color:var(--green);border-color:rgba(105,255,156,.35)}.message-box.danger,.message-box.bad{color:var(--red);border-color:rgba(255,79,109,.40)}.profile-avatar-pick,.avatar-selector{margin:12px 0}.avatar-preview-btn{border:2px solid rgba(255,230,109,.42);background:rgba(255,255,255,.05);color:#fff;border-radius:24px;min-height:76px;padding:12px 18px;display:flex;gap:12px;align-items:center;justify-content:center;font-weight:1000;cursor:pointer}.big-avatar-picker{width:224px;min-height:224px;flex-direction:column}.avatar-preview-slot{display:grid;place-items:center}.emoji-avatar-preview{font-size:58px}.big-avatar-picker .emoji-avatar-preview{font-size:96px}.avatar-picker-grid{display:grid;grid-template-columns:repeat(4,minmax(74px,1fr));gap:10px;margin-top:10px;max-width:820px}.avatar-choice{border:2px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);color:#fff;border-radius:17px;min-height:78px;display:grid;place-items:center;gap:3px;cursor:pointer}.avatar-choice.active{border-color:var(--neon);box-shadow:0 0 18px rgba(100,255,225,.22)}.avatar-choice span{font-size:34px}.avatar-choice small{font-weight:900}.profile-setup-panel{display:grid;grid-template-columns:224px 1fr;column-gap:22px;align-items:start}.profile-setup-panel .section-title-row,.profile-setup-panel .hint{grid-column:1/-1}.profile-setup-panel label,.profile-setup-panel .name-row,.profile-setup-panel .message-box{grid-column:2}.profile-menu-card{display:flex;gap:18px;align-items:center}.emoji-profile-avatar{width:112px;height:112px;display:grid;place-items:center;font-size:76px;border-radius:26px;border:2px solid rgba(255,230,109,.45);background:radial-gradient(circle,rgba(255,255,255,.12),rgba(0,0,0,.18))}.profile-title-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.profile-title-row h2{margin:0;font-size:clamp(28px,4vw,42px)}.profile-inline-edit-btn{border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#fff;border-radius:999px;padding:8px 12px;font-weight:900;cursor:pointer}.profile-rich-stats{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}.profile-rich-stats span{border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.2);border-radius:999px;padding:7px 10px;color:var(--muted);font-weight:800}.main-menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.home-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.salas-current-profile{display:flex;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.22);border-radius:18px;padding:12px;margin:10px 0 14px}.mini-emoji-avatar{width:54px;height:54px;display:grid;place-items:center;font-size:34px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,230,109,.35)}.salas-current-profile small,.player-row small,.room-list-card small{display:block;color:var(--muted);font-weight:700}.salas-create-actions{margin-top:10px}.rooms-list{display:flex;flex-direction:column;gap:10px}.room-list-card{display:flex;align-items:center;justify-content:space-between;gap:12px;border:2px solid rgba(255,255,255,.12);border-radius:18px;padding:12px;background:rgba(0,0,0,.22)}.room-list-card.lobby{border-color:rgba(105,255,156,.45)}.room-list-card.playing{border-color:rgba(255,79,109,.45)}.room-list-card.finished{border-color:rgba(255,230,109,.45)}.brand-home-link{display:block}.brand-row{display:flex;gap:14px;align-items:center}.brand-row-compact .brand-mark{width:82px;height:82px;font-size:48px}.room-panel-compact{padding:14px 18px}.players-list{display:flex;flex-direction:column;gap:10px;margin-top:12px}.player-row{display:flex;align-items:center;gap:12px;border:2px solid rgba(255,255,255,.12);background:rgba(0,0,0,.22);border-radius:18px;padding:12px}.player-row.bot-player{border-color:rgba(202,166,255,.45)}.emoji-player-avatar{width:62px;height:62px;display:grid;place-items:center;font-size:42px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,230,109,.35)}.player-info strong{font-size:18px}.lobby-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}.room-share-after-players{margin-top:14px;border-top:1px solid rgba(255,255,255,.10);padding-top:12px}.share-row-3{display:grid;grid-template-columns:1fr auto auto;gap:10px}.whatsapp-share-btn{border-color:#35d366;background:linear-gradient(145deg,#0e582f,#06150c)}.fk-stage{flex:1;min-height:0;position:relative;border:3px solid rgba(100,255,225,.7);border-radius:20px;overflow:hidden;background:radial-gradient(circle at 50% 25%,rgba(255,255,255,.12),transparent 25%),linear-gradient(180deg,rgba(18,18,42,.96),rgba(2,3,9,.98));box-shadow:0 0 28px rgba(100,255,225,.22),inset 0 0 45px rgba(255,255,255,.04)}.fk-bg-emoji{position:absolute;font-size:64px;opacity:.16;filter:blur(.2px);animation:floatBg 5s ease-in-out infinite}.fk-bg-emoji.e1{left:6%;top:18%}.fk-bg-emoji.e2{right:10%;top:20%;animation-delay:.8s}.fk-bg-emoji.e3{left:47%;top:9%;animation-delay:1.3s}.fk-bg-emoji.e4{right:38%;top:36%;animation-delay:2s}@keyframes floatBg{50%{transform:translateY(-12px) rotate(4deg)}}.fk-hud{position:absolute;top:8px;left:8px;right:8px;display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:start;z-index:8}.fk-hpbox{background:rgba(0,0,0,.42);border:2px solid rgba(255,255,255,.18);border-radius:16px;padding:8px}.fk-hpbox.right{text-align:right}.fk-name{font-weight:1000;color:#fff;text-shadow:0 2px #000}.fk-hp{height:16px;border-radius:999px;background:#250713;border:2px solid #000;overflow:hidden;margin-top:5px}.fk-hp i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--green),var(--gold),var(--red));transition:width .16s}.fk-hpbox span{display:block;min-height:18px;color:#cfe5ff;font-size:12px;font-weight:800}.fk-round{min-width:88px;text-align:center;background:var(--gold);color:#111;border:3px solid #000;border-radius:999px;padding:8px;font-weight:1000;box-shadow:0 3px #000}.fk-floor{position:absolute;left:0;right:0;bottom:0;height:28%;background:linear-gradient(180deg,rgba(255,230,109,.08),rgba(0,0,0,.34)),repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 18px,rgba(0,0,0,.03) 18px 36px);border-top:3px solid rgba(255,230,109,.55)}.fk-world-line{position:absolute;left:0;right:0;bottom:28%;height:3px;background:rgba(100,255,225,.45);box-shadow:0 0 16px rgba(100,255,225,.42)}.fk-layer{position:absolute;left:0;right:0;bottom:28%;height:1px;z-index:6}.fk-fighter{position:absolute;bottom:28%;left:0;width:92px;height:92px;display:grid;place-items:center;font-size:72px;z-index:7;filter:drop-shadow(0 12px 8px rgba(0,0,0,.55));transition:filter .08s}.fk-fighter.hit{animation:hitShake .16s linear 1;filter:drop-shadow(0 0 16px var(--red))}.fk-fighter.guard{filter:drop-shadow(0 0 16px var(--blue))}.fk-fighter.guard::after{content:'🛡️';position:absolute;font-size:32px;right:-10px;top:16px}.fk-fighter.dead{filter:grayscale(1) brightness(.6);transform-origin:center bottom}@keyframes hitShake{25%{margin-left:-7px}75%{margin-left:7px}}.fk-entity{position:absolute;bottom:0;left:0;font-size:38px;z-index:9;filter:drop-shadow(0 6px 6px rgba(0,0,0,.5))}.fk-entity.projectile{animation:spin .5s linear infinite}.fk-entity.effect{font-size:32px;font-weight:1000;color:#fff;text-shadow:0 2px #000;display:flex;align-items:center;gap:3px}.fk-entity.effect small{font-size:18px;color:var(--gold)}@keyframes spin{to{rotate:360deg}}.fk-combo{position:absolute;left:50%;top:24%;transform:translate(-50%,-50%) scale(.5);opacity:0;color:var(--gold);font-size:70px;font-weight:1000;text-shadow:0 5px #000,0 0 22px rgba(255,230,109,.8);z-index:20}.fk-combo.show{animation:comboPop .45s ease-out 1}@keyframes comboPop{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}30%{opacity:1;transform:translate(-50%,-50%) scale(1.25)}100%{opacity:0;transform:translate(-50%,-50%) scale(1)}}.fk-endmenu{position:absolute;inset:0;z-index:50;display:grid;place-items:center;background:rgba(0,0,0,.62);padding:14px}.fk-endbox{width:min(430px,94vw);background:linear-gradient(145deg,#161d39,#060814);border:3px solid var(--gold);border-radius:24px;padding:18px;text-align:center;box-shadow:0 0 30px rgba(255,230,109,.28)}.fk-endbox h2{margin:0;color:var(--gold);font-size:32px}.fk-endactions{display:grid;gap:9px;margin-top:12px}.fk-controls{display:grid;grid-template-columns:1fr 1.3fr;gap:8px;z-index:30}.fk-pad,.fk-actions{display:grid;gap:6px}.fk-pad{grid-template-columns:repeat(3,1fr)}.fk-actions{grid-template-columns:repeat(4,1fr)}.fk-controls button{min-height:56px;border:2px solid rgba(255,255,255,.20);border-radius:16px;background:linear-gradient(145deg,#111b35,#050812);color:#fff;font-size:22px;font-weight:1000;touch-action:none}.fk-controls button small{display:block;font-size:10px;color:#cfe5ff}.fk-controls button.hold{border-color:var(--gold);box-shadow:0 0 18px rgba(255,230,109,.32);transform:translateY(1px)}.kk-ranking{display:flex;flex-direction:column;gap:7px}.kk-rank-head,.kk-rank-row{display:grid;grid-template-columns:44px 1fr 80px 55px 55px 90px;gap:8px;align-items:center;padding:10px;border-radius:14px}.kk-rank-head{background:rgba(255,255,255,.10);font-weight:900;color:var(--neon)}.kk-rank-row{background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.08)}.kk-rank-player{font-weight:900}.kk-center-panel{text-align:center}.kk-good{color:var(--green)}.kk-bad{color:var(--red)}pre{white-space:pre-wrap;text-align:left;background:rgba(0,0,0,.35);border-radius:14px;padding:12px;color:#ffd4dc}
@media (max-width:820px){.app-shell,.kk-shell{padding:10px;gap:12px}.hero-card,.kk-hero{padding:14px;align-items:flex-start}.hero-logo,.brand-mark,.kk-logo{width:68px;height:68px;border-radius:20px}.emoji-logo{font-size:40px}.hero-card h1,.kk-hero h1,.brand-row h1{font-size:clamp(30px,9vw,48px)}.hero-subtitle,.hint{font-size:15px}.profile-setup-panel{display:block}.big-avatar-picker{width:100%;min-height:126px}.big-avatar-picker .emoji-avatar-preview{font-size:66px}.avatar-picker-grid{grid-template-columns:repeat(4,1fr)}.name-row{grid-template-columns:1fr}.main-menu-grid,.home-grid,.lobby-actions{grid-template-columns:1fr}.page-salas .hero-card{padding-left:14px;padding-top:70px}.top-mini-btn{left:14px;top:14px;transform:none}.share-row-3{grid-template-columns:1fr}.profile-menu-card{align-items:flex-start}.emoji-profile-avatar{width:78px;height:78px;font-size:54px}.room-list-card{align-items:flex-start;flex-direction:column}.fk-hud{grid-template-columns:1fr 62px 1fr;gap:4px}.fk-round{min-width:62px;padding:6px 4px;font-size:12px}.fk-name{font-size:12px}.fk-hpbox{padding:6px}.fk-fighter{width:76px;height:76px;font-size:60px}.fk-controls{grid-template-columns:1fr;gap:6px}.fk-actions{grid-template-columns:repeat(4,1fr)}.fk-controls button{min-height:50px;font-size:20px}.fk-stage{border-radius:16px}.fight-app-shell .hero-card,.fight-app-shell .room-panel{display:none}.top-home-btn{display:none}}
@media (max-height:660px){.fight-app-shell .hero-card,.fight-app-shell .room-panel{display:none}.top-home-btn{display:none}.fk-controls button{min-height:44px}.fk-hud{top:5px}.fk-fighter{font-size:58px}}
/* Fin archivo: assets/css/style.css */


/* Parche 1.0.4: controles arcade tipo emulador */
.fk-controls-arcade{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding:10px 4px 0}.fk-pad-arcade{position:relative;flex:0 0 178px;width:178px;height:178px;display:block}.fk-pad-arcade .fk-pad-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:18px;background:radial-gradient(circle,rgba(255,255,255,.14),rgba(17,27,53,.94));border:2px solid rgba(255,255,255,.14);box-shadow:0 0 16px rgba(100,255,225,.10) inset}.fk-pad-arcade button{position:absolute;width:66px;height:66px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:2px solid rgba(100,180,255,.45);border-radius:18px;background:linear-gradient(145deg,#111b35,#050812);color:#fff;font-size:28px;font-weight:1000;box-shadow:0 0 18px rgba(0,0,0,.25);touch-action:none}.fk-pad-arcade button small{display:block;font-size:10px;line-height:1;color:#cfe5ff}.fk-pad-arcade .up{left:56px;top:0}.fk-pad-arcade .left{left:0;top:56px}.fk-pad-arcade .right{right:0;top:56px}.fk-pad-arcade .down{left:56px;bottom:0}.fk-actions-arcade{display:grid;grid-template-columns:repeat(2,84px);grid-auto-rows:84px;gap:14px;justify-content:end;align-content:end;margin-left:auto}.fk-actions-arcade .arcade-btn,.fk-actions-arcade button{width:84px;height:84px;border-radius:999px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:0 6px;border:2px solid rgba(255,255,255,.24);background:linear-gradient(145deg,#111b35,#050812);color:#fff;font-size:31px;font-weight:1000;box-shadow:0 0 16px rgba(0,0,0,.25);touch-action:none}.fk-actions-arcade button small{display:block;font-size:11px;line-height:1.05;color:#fff}.fk-actions-arcade .attack-punch{border-color:rgba(255,210,92,.85);box-shadow:0 0 18px rgba(255,210,92,.18)}.fk-actions-arcade .attack-throw{border-color:rgba(255,120,92,.85);box-shadow:0 0 18px rgba(255,120,92,.18)}.fk-actions-arcade .attack-special{border-color:rgba(96,214,255,.9);box-shadow:0 0 18px rgba(96,214,255,.18)}.fk-actions-arcade .attack-guard{border-color:rgba(154,116,255,.9);box-shadow:0 0 18px rgba(154,116,255,.18)}.fk-controls-arcade button.hold{border-color:var(--gold)!important;box-shadow:0 0 18px rgba(255,230,109,.38);transform:translateY(1px) scale(.98)}
@media (max-width:820px){.fk-controls-arcade{gap:14px;align-items:flex-end}.fk-pad-arcade{flex-basis:148px;width:148px;height:148px}.fk-pad-arcade button{width:56px;height:56px;font-size:24px}.fk-pad-arcade .up{left:46px;top:0}.fk-pad-arcade .left{left:0;top:46px}.fk-pad-arcade .right{right:0;top:46px}.fk-pad-arcade .down{left:46px;bottom:0}.fk-pad-arcade .fk-pad-core{width:42px;height:42px}.fk-actions-arcade{grid-template-columns:repeat(2,72px);grid-auto-rows:72px;gap:10px}.fk-actions-arcade .arcade-btn,.fk-actions-arcade button{width:72px;height:72px;font-size:26px}.fk-actions-arcade button small{font-size:10px}}
@media (max-width:560px){.fk-controls-arcade{position:sticky;bottom:0;left:0;right:0;padding:8px 0 max(6px,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.28) 22%,rgba(0,0,0,.48));z-index:35}.fk-pad-arcade{flex-basis:136px;width:136px;height:136px}.fk-pad-arcade button{width:52px;height:52px;font-size:22px}.fk-pad-arcade .up{left:42px}.fk-pad-arcade .left{top:42px}.fk-pad-arcade .right{top:42px}.fk-pad-arcade .down{left:42px}.fk-actions-arcade{grid-template-columns:repeat(2,68px);grid-auto-rows:68px;gap:9px}.fk-actions-arcade .arcade-btn,.fk-actions-arcade button{width:68px;height:68px;font-size:24px}}
