:root{--bg:#0d1017;--panel:#151a24;--panel2:#1c2230;--text:#f5f7fb;--muted:#98a2b3;--accent:#3b82f6;--line:#293142}*{box-sizing:border-box}html,body{margin:0;background:radial-gradient(circle at 20% 0,#172037 0,#0d1017 42%);color:var(--text);font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;min-height:100%}a{color:inherit;text-decoration:none}header{height:72px;display:flex;align-items:center;max-width:1380px;margin:auto;padding:0 24px;border-bottom:1px solid rgba(255,255,255,.04)}.brand{font-weight:900;letter-spacing:1px;font-size:22px}main{max-width:1380px;margin:auto;padding:42px 24px 70px}.eyebrow,.muted,.game-console{font-size:12px;letter-spacing:.1em;color:#8da2c0;font-weight:800}.lead{max-width:760px;color:#aab4c4;font-size:17px;margin-top:6px}h1{font-size:clamp(28px,4vw,48px);margin:6px 0 10px}h2{margin:4px 0 14px;font-size:19px}h3{margin-top:32px}.console-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px;margin-top:28px}.console-card{background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:16px;padding:24px;display:flex;gap:22px;align-items:center;transition:.16s}.console-card:hover,.folder:hover,.game:hover{transform:translateY(-2px);border-color:#4d6fa9}.console-short{width:72px;height:72px;border-radius:18px;background:#22304b;display:grid;place-items:center;font-weight:900;font-size:18px;color:#8bb8ff}.console-card span{color:#7fb0ff;font-weight:700}.crumb{display:flex;gap:9px;align-items:center;flex-wrap:wrap;color:#94a3b8;margin-bottom:24px}.crumb a:hover{color:#fff}.folder-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.folder{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;display:grid;gap:7px;transition:.16s}.folder-icon{color:#f2bd4e}.folder span:last-child{font-size:11px;color:#7fb0ff;font-weight:800}.back{display:inline-flex;margin:16px 0;background:#1d2738;border:1px solid #32415a;border-radius:10px;padding:10px 14px;font-weight:800}.search{margin:26px 0 8px}.search input{width:min(600px,100%);background:#101722;border:1px solid #2c3749;color:#fff;border-radius:12px;padding:14px 16px;font:inherit;outline:0}.search input:focus{border-color:#5687d5}.game-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.game{min-height:170px;background:linear-gradient(160deg,#171e2b,#111722);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;transition:.16s}.game-badge{align-self:flex-start;background:#253756;color:#91baff;border-radius:8px;padding:5px 8px;font-size:11px;font-weight:900}.game-title{font-weight:800;font-size:17px;margin:17px 0 5px}.game-console{margin-bottom:18px}.play{margin-top:auto;color:#75aaff;font-weight:900}.none,.empty,.errorbox{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:28px;margin-top:24px}.player-head{max-width:none;gap:18px;background:#0a0d13;position:relative;z-index:10}.player-head .back{margin:0}.player-head>div{display:flex;flex-direction:column;min-width:0;flex:1}.player-head>div strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-head>div span{font-size:11px;color:#8894a7}.player-head button{background:#2563eb;color:#fff;border:0;border-radius:9px;padding:10px 14px;font-weight:800;cursor:pointer}.player-main{max-width:none;padding:0;background:#05070b}.player-main #playerWrap{height:calc(100vh - 112px);min-height:480px;width:100%;background:#000}.player-main #game{height:100%;width:100%}.player-note{text-align:center;color:#78859a;font-size:12px;padding:10px}footer{text-align:center;color:#626f83;padding:24px;border-top:1px solid rgba(255,255,255,.05)}[hidden]{display:none!important}@media(max-width:640px){header{height:62px;padding:0 14px}main{padding:28px 14px 55px}.player-head{height:auto;min-height:66px;flex-wrap:wrap;padding:10px 12px}.player-main #playerWrap{height:calc(100vh - 120px);min-height:360px}.console-grid,.game-grid{grid-template-columns:1fr 1fr}.game{min-height:150px;padding:14px}.game-title{font-size:14px}.console-card{grid-column:span 2}.folder-grid{grid-template-columns:1fr 1fr}}

/* VL Games v1.5 - modo LISTA (somente visual dos jogos) */
.game-grid{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.game{
  min-height:0;
  background:linear-gradient(160deg,#171e2b,#111722);
  border:1px solid var(--line);
  border-radius:10px;
  padding:11px 14px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto auto;
  align-items:center;
  gap:14px;
  transition:.16s;
}
.game:hover{
  transform:translateX(3px);
}
.game-badge{
  align-self:center;
  margin:0;
  white-space:nowrap;
}
.game-title{
  min-width:0;
  font-weight:800;
  font-size:15px;
  margin:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-console{
  margin:0;
  white-space:nowrap;
  text-align:right;
}
.play{
  margin:0;
  white-space:nowrap;
  text-align:right;
}
@media(max-width:760px){
  .game-grid{display:flex;flex-direction:column;gap:7px}
  .game{
    min-height:0;
    padding:10px 11px;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:9px;
  }
  .game-title{font-size:14px}
  .game-console{display:none}
  .play{font-size:12px}
}
@media(max-width:420px){
  .game-badge{display:none}
  .game{grid-template-columns:minmax(0,1fr) auto}
}

/* VL_GAMES_CONSOLE_LAYOUT_V2_START
   Organiza somente a tela inicial de seleção dos emuladores.
   Não altera lista de jogos nem player. */

.console-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:28px;
  align-items:stretch;
}

.console-card{
  min-width:0;
  min-height:174px;
  padding:18px;
  gap:18px;
  align-items:center;
  border-radius:16px;
  overflow:hidden;
}

.console-card > div:last-child{
  min-width:0;
  flex:1 1 auto;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}

.console-card .muted{
  margin:0 0 3px;
  font-size:10px;
  line-height:1.2;
  letter-spacing:.12em;
}

.console-card h2{
  width:100%;
  margin:4px 0 13px;
  font-size:18px;
  line-height:1.28;
  overflow-wrap:normal;
  word-break:normal;
}

.console-card span{
  display:inline-flex;
  align-items:center;
  margin-top:auto;
  line-height:1.2;
  white-space:nowrap;
}

/* Área fixa da arte do console. Também corrige instalações em que
   o patch de lista sobrescreveu o CSS anterior das imagens. */
.console-media{
  position:relative;
  flex:0 0 126px;
  width:126px;
  height:138px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:12px;
  background:#111722;
}

.console-media .console-short{
  width:72px;
  height:72px;
  margin:0;
  border-radius:18px;
  display:grid;
  place-items:center;
}

.console-cover{
  position:absolute;
  inset:0;
  z-index:2;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  border:0;
  border-radius:10px;
  background:#f4f4f4;
  box-shadow:none;
}

.console-card:hover{
  transform:translateY(-2px);
}

@media(max-width:1080px){
  .console-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:700px){
  .console-grid{
    grid-template-columns:1fr;
    gap:12px;
  }
  .console-card{
    grid-column:auto;
    min-height:144px;
    padding:14px;
    gap:14px;
  }
  .console-media{
    flex-basis:104px;
    width:104px;
    height:116px;
  }
  .console-card h2{
    font-size:16px;
    margin-bottom:10px;
  }
}

@media(max-width:390px){
  .console-media{
    flex-basis:88px;
    width:88px;
    height:102px;
  }
  .console-card{
    gap:12px;
    padding:12px;
  }
  .console-card h2{font-size:15px}
  .console-card span{font-size:13px}
}
/* VL_GAMES_CONSOLE_LAYOUT_V2_END */

/* VL_GAMES_FOLDERS_COMPACT_V2_START
   Pastas compactas: ícone + nome na mesma linha, seta à direita. */
.folder-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:8px;
}
.folder{
  min-height:44px;
  padding:8px 11px;
  display:grid;
  grid-template-columns:18px minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  border-radius:9px;
}
.folder-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  margin:0;
  line-height:1;
  font-size:15px;
}
.folder strong{
  min-width:0;
  margin:0;
  font-size:15px;
  line-height:1.1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.folder span:last-child{
  margin:0;
  font-size:0;
  line-height:1;
  color:#7fb0ff;
}
.folder span:last-child::after{
  content:'›';
  font-size:19px;
  font-weight:900;
  line-height:1;
}
@media(max-width:700px){
  .folder-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .folder{min-height:42px;padding:8px 10px}
}
@media(max-width:390px){
  .folder-grid{grid-template-columns:1fr 1fr}
}
/* VL_GAMES_FOLDERS_COMPACT_V2_END */

/* VL_GAMES_RECENT_10_V1_START */
.recent-wrap{
  margin-top:42px;
  padding-top:26px;
  border-top:1px solid rgba(255,255,255,.07);
}
.recent-wrap h2{
  margin:0 0 16px;
  font-size:22px;
}
#recent-games{
  margin-top:0;
}
#recent-games .recent-game{
  width:100%;
}
/* VL_GAMES_RECENT_10_V1_END */

/* VL_GAMES_FOLDER_COUNT_DISCREET_V1_START */
.folder-count{
  margin-left:4px;
  font-size:12px;
  font-weight:400;
  color:#75aaff;
  white-space:nowrap;
}
/* VL_GAMES_FOLDER_COUNT_DISCREET_V1_END */

/* VL_GAMES_RECENT_CONTROLS_V1_START */
.recent-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}
.recent-heading h2{
  margin:0;
}
.recent-clear{
  appearance:none;
  border:1px solid #2a3548;
  background:#151c28;
  color:#75aaff;
  border-radius:8px;
  padding:7px 11px;
  font:inherit;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  white-space:nowrap;
}
.recent-clear:hover{
  background:#1c2635;
}
#recent-games{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.recent-game-row{
  display:flex;
  align-items:stretch;
  gap:6px;
  min-width:0;
}
.recent-game-row .recent-game-link{
  flex:1 1 auto;
  min-width:0;
  margin:0;
}
.recent-delete{
  flex:0 0 42px;
  width:42px;
  border:1px solid #2a3548;
  background:#151c28;
  color:#75aaff;
  border-radius:8px;
  cursor:pointer;
  font-size:16px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
}
.recent-delete:hover{
  background:#1c2635;
}
@media (max-width:640px){
  .recent-heading{
    align-items:center;
  }
  .recent-clear{
    padding:6px 9px;
    font-size:11px;
  }
  .recent-delete{
    flex-basis:38px;
    width:38px;
  }
}
/* VL_GAMES_RECENT_CONTROLS_V1_END */

/* VL_GAMES_ROM_SEARCH_V1_START */
.rom-search-wrap{
  margin:26px 0 10px;
}
.console-grid + .rom-search-wrap{
  margin-top:24px;
}
.folder-grid + .rom-search-wrap{
  margin-top:18px;
}
.rom-search-box{
  margin:0;
}
.rom-search-box input{
  width:min(720px,100%);
}
.rom-search-status{
  margin:8px 2px 9px;
  color:#8da2c0;
  font-size:12px;
}
.rom-search-results{
  max-height:548px;
  overflow-y:auto;
  overflow-x:hidden;
  padding-right:4px;
  scrollbar-gutter:stable;
}
.rom-search-results .rom-search-item{
  flex:0 0 auto;
}
.rom-search-results::-webkit-scrollbar{
  width:9px;
}
.rom-search-results::-webkit-scrollbar-track{
  background:#0f1520;
  border-radius:8px;
}
.rom-search-results::-webkit-scrollbar-thumb{
  background:#2c3b52;
  border-radius:8px;
}
.rom-search-results::-webkit-scrollbar-thumb:hover{
  background:#3a4e6d;
}
@media(max-width:760px){
  .rom-search-results{
    max-height:510px;
  }
}
/* VL_GAMES_ROM_SEARCH_V1_END */

/* VL_GAMES_SEARCH_FULL_WIDTH_V1_START */
.rom-search-wrap{
  width:100%;
  max-width:none;
}
.rom-search-box{
  width:100%;
  max-width:none;
}
.rom-search-box input,
.rom-search-input{
  display:block;
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box;
}
/* VL_GAMES_SEARCH_FULL_WIDTH_V1_END */
