/* br-7games-app.com · layout "ficha técnica" (datasheet) · família E, painéis com faixa de título e cartão de identificação · prefixo fk */
:root{--fk-bg:#18201D;--fk-sf:#1C2625;--fk-sf2:#222f2c;--fk-gr:#269056;--fk-gr2:#46b676;--fk-gold:#E0A92B;--fk-gold2:#f1c862;--fk-tx:#fff;--fk-mut:rgba(255,255,255,.82);--fk-line:rgba(255,255,255,.15);--fk-dk:#121917}
body.fk{margin:0;background:var(--fk-bg);color:var(--fk-tx);font:400 17px/1.7 Chivo,Roboto,"Segoe UI",Arial,sans-serif;-webkit-text-size-adjust:100%}
.fk *,.fk *::before,.fk *::after{box-sizing:border-box}
.fk img{max-width:100%;height:auto;display:block}
.fk a{color:var(--fk-gold2);text-underline-offset:3px}
.fk a:hover{color:#fff}
.fk a:focus-visible,.fk summary:focus-visible{outline:3px solid var(--fk-gold);outline-offset:2px}
.fk h1,.fk h2,.fk h3{font-family:Chivo,"Segoe UI",Arial,sans-serif;margin:0;overflow-wrap:break-word}
.fk p{margin:0 0 15px}
.fk .shell{width:min(1120px,calc(100% - 32px));margin:0 auto}
.fk code{font-family:"Roboto Mono",monospace;font-size:.9em;background:var(--fk-dk);border:1px solid var(--fk-line);padding:1px 6px;border-radius:2px}

/* ---------- topo com abas ---------- */
.fk .top{background:var(--fk-dk);border-top:4px solid var(--fk-gr);border-bottom:1px solid var(--fk-line)}
.fk .top-in{display:flex;align-items:flex-end;gap:26px;padding-top:10px}
.fk .top-in>a:first-child{align-self:center;padding-bottom:8px}
.fk .top nav{display:flex;gap:2px;margin-left:8px;align-self:flex-end}
.fk .top nav a{display:flex;align-items:center;min-height:48px;padding:0 20px;color:var(--fk-mut);text-decoration:none;font:600 15px/1 "Archivo Narrow",Arial,sans-serif;text-transform:uppercase;letter-spacing:.09em;border:1px solid transparent;border-bottom:0;border-radius:3px 3px 0 0}
.fk .top nav a:hover{background:var(--fk-sf);color:#fff;border-color:var(--fk-line)}
.fk .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;background:var(--fk-gr);color:#fff;text-decoration:none;border:1px solid var(--fk-gr2);border-radius:2px;font:700 16px/1.1 "Archivo Narrow",Arial,sans-serif;text-transform:uppercase;letter-spacing:.1em;text-align:center;transition:background .14s}
.fk .btn:hover{background:var(--fk-gr2);color:#fff}
.fk .top .btn-main{margin-left:auto;align-self:center;min-height:44px;margin-bottom:8px;padding:0 20px;background:var(--fk-gold);border-color:var(--fk-gold2);color:#17130a;font-size:15.5px}
.fk .top .btn-main:hover{background:var(--fk-gold2);color:#17130a}

/* ---------- hero com grade técnica ---------- */
.fk-hero{background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px) 0 0/100% 32px,linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) 0 0/32px 100%,var(--fk-bg);border-bottom:1px solid var(--fk-line)}
.fk-hero-in{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:38px;padding:40px 0 38px;align-items:start}
.fk-hero-sv .fk-hero-in{grid-template-columns:minmax(0,1fr);padding:30px 0 26px}
.fk-kick{display:inline-block;margin:0 0 14px;padding:4px 10px;background:var(--fk-gr);color:#fff;font:500 13px/1.3 "Roboto Mono",monospace;text-transform:uppercase;letter-spacing:.1em}
.fk-hero h1{font-size:clamp(29px,3.9vw,46px);line-height:1.1;font-weight:800;letter-spacing:-.012em;margin:0 0 16px}
.fk-hero-sv h1{font-size:clamp(26px,3.2vw,38px)}
.fk-lead{font-size:18.5px;line-height:1.6;color:var(--fk-mut);max-width:62ch}
.fk-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:20px 0 6px}
.fk-ad{font:400 13.5px/1.3 "Roboto Mono",monospace;color:rgba(255,255,255,.68)}
.fk-date{font:500 14px/1.3 "Roboto Mono",monospace;color:rgba(255,255,255,.72);margin:8px 0 0}
.fk-id{margin:0;border:1px solid var(--fk-line);background:var(--fk-sf);border-top:4px solid var(--fk-gold)}
.fk-id div{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px;padding:11px 16px;border-top:1px solid var(--fk-line)}
.fk-id .fk-id-h{display:flex;justify-content:space-between;align-items:center;border-top:0;background:var(--fk-dk)}
.fk-id .fk-id-h dt{font:600 14px/1.3 "Archivo Narrow",Arial,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--fk-gold2)}
.fk-id .fk-id-h dd{font:500 12.5px/1.3 "Roboto Mono",monospace;color:rgba(255,255,255,.7);text-align:right}
.fk-id dt{font:500 13px/1.4 "Roboto Mono",monospace;text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,.7)}
.fk-id dd{margin:0;font:700 16.5px/1.35 Chivo,Arial,sans-serif;color:#fff;overflow-wrap:anywhere}
.fk-fig-h{margin:16px 0 0;display:grid;grid-template-columns:128px minmax(0,1fr);gap:0;border:1px solid var(--fk-line);background:var(--fk-sf)}
.fk-fig-h img{width:128px;height:auto}

/* ---------- painéis (fichas) ---------- */
.fk .fk-main{margin-top:34px;display:flex;flex-direction:column;gap:26px}
.fk-p{border:1px solid var(--fk-line);background:var(--fk-sf)}
.fk-ph{display:flex;align-items:center;gap:18px;padding:0 20px 0 0;background:repeating-linear-gradient(135deg,var(--fk-dk) 0 10px,#151d1b 10px 20px);border-bottom:2px solid var(--fk-gr)}
.fk-pl{flex:none;align-self:stretch;display:flex;align-items:center;padding:0 16px;background:var(--fk-gr);color:#fff;font:600 13.5px/1.2 "Roboto Mono",monospace;text-transform:uppercase;letter-spacing:.1em}
.fk-ph h2{padding:14px 0;font-size:clamp(21px,2.3vw,28px);line-height:1.2;font-weight:700}
.fk-pb{padding:22px 24px 12px}
.fk-pb h3{font-size:20px;margin:14px 0 8px}
.fk-ul,.fk-ol{margin:0 0 16px;padding:0;list-style:none}
.fk-ul li{position:relative;padding:8px 0 8px 26px;border-bottom:1px solid var(--fk-line)}
.fk-ul li:last-child{border-bottom:0}
.fk-ul li::before{content:"";position:absolute;left:3px;top:17px;width:10px;height:10px;background:var(--fk-gold);transform:rotate(45deg)}
.fk-ol{counter-reset:fkc}
.fk-ol li{counter-increment:fkc;position:relative;padding:10px 0 10px 48px;border-bottom:1px solid var(--fk-line)}
.fk-ol li:last-child{border-bottom:0}
.fk-ol li::before{content:counter(fkc);position:absolute;left:0;top:10px;display:grid;place-items:center;width:32px;height:32px;border:2px solid var(--fk-gold);color:var(--fk-gold2);font:700 16px/1 "Roboto Mono",monospace}
.fk-note{padding:12px 16px;border-left:5px solid var(--fk-gold);background:var(--fk-sf2);margin:0 0 16px}
.fk-note p{margin:0}
.fk-tw{margin:6px 0 20px;border:1px solid var(--fk-line);background:var(--fk-bg)}
.fk-t{width:100%;border-collapse:collapse;font-size:16px;line-height:1.45}
.fk-t th{background:var(--fk-dk);color:var(--fk-gold2);font:600 14.5px/1.3 "Archivo Narrow",Arial,sans-serif;text-transform:uppercase;letter-spacing:.1em;text-align:left;padding:11px 14px;border-bottom:1px solid var(--fk-gr)}
.fk-t td{padding:11px 14px;vertical-align:top;border-top:1px solid var(--fk-line);border-left:1px solid var(--fk-line)}
.fk-t td:first-child{border-left:0;font-weight:700;background:rgba(255,255,255,.035)}
.fk-mid{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:18px 0 8px;padding:14px 16px;border:1px solid var(--fk-gold);background:rgba(224,169,43,.07)}

/* ---------- FAQ, fechamento, outras fichas ---------- */
.fk-faq{margin-top:34px;padding:32px 0 30px;background:var(--fk-dk);border-top:1px solid var(--fk-line);border-bottom:1px solid var(--fk-line)}
.fk-faq h2{font-size:clamp(23px,2.6vw,31px);font-weight:800;margin:0 0 16px}
.fk-q{border:1px solid var(--fk-line);background:var(--fk-sf);margin-bottom:8px;padding:0 18px}
.fk-q summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:8px 0;cursor:pointer;list-style:none}
.fk-q summary::-webkit-details-marker{display:none}
.fk-q h3{font:700 18px/1.35 Chivo,Arial,sans-serif}
.fk-q i{flex:none;display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--fk-gold);color:var(--fk-gold2);font:500 20px/1 "Roboto Mono",monospace;font-style:normal}
.fk-q[open] i{background:var(--fk-gold);color:#17130a}
.fk-q p{margin:0 0 15px;color:var(--fk-mut);max-width:78ch}
.fk-close{padding:30px 0 6px}
.fk-close-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 36px;padding:24px 26px;border:2px solid var(--fk-gr);background:var(--fk-sf)}
.fk-close-h{font:800 clamp(21px,2.5vw,29px)/1.15 Chivo,Arial,sans-serif;margin:0 0 6px}
.fk-close p{margin:0}
.fk-close-a{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.fk-more{padding:26px 0 6px}
.fk-more-h{font:600 14.5px/1.3 "Archivo Narrow",Arial,sans-serif;text-transform:uppercase;letter-spacing:.14em;color:var(--fk-gold2);margin:0 0 10px}
.fk-more ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.fk-more a{display:block;height:100%;padding:14px 16px;border:1px solid var(--fk-line);border-left:5px solid var(--fk-gr);background:var(--fk-sf);text-decoration:none;color:#fff}
.fk-more a:hover{background:var(--fk-sf2);border-left-color:var(--fk-gold)}
.fk-more b{display:block;font:700 18px/1.25 Chivo,Arial,sans-serif;margin-bottom:4px}
.fk-more span{display:block;font-size:15.5px;line-height:1.5;color:var(--fk-mut)}

/* ---------- rodapé ---------- */
.fk .foot{margin-top:30px;background:var(--fk-dk);border-top:4px solid var(--fk-gr);padding:26px 0 32px;font-size:15px;line-height:1.6;color:rgba(255,255,255,.78)}
.fk .foot .shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 40px}
.fk .foot-top{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-bottom:14px;margin-bottom:12px;border-bottom:1px solid var(--fk-line)}
.fk .foot-top nav{display:flex;flex-wrap:wrap;gap:4px 18px}
.fk .foot-top nav a{color:var(--fk-mut);text-decoration:none;font:600 14.5px/1.6 "Archivo Narrow",Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em;padding:4px 0}
.fk .foot-top nav a:hover{color:var(--fk-gold2)}
.fk .foot p{margin:0 0 8px}

/* ---------- telas menores ---------- */
@media (max-width:900px){
  .fk-hero-in{grid-template-columns:minmax(0,1fr);gap:24px;padding:28px 0}
  .fk .foot .shell{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:720px){
  .fk .top-in{flex-wrap:wrap;gap:0 12px;padding-top:8px}
  .fk .top-in>a:first-child{padding-bottom:8px}
  .fk .top .btn-main{margin-bottom:8px}
  .fk .top nav{order:3;width:100%;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
  .fk .top nav a{justify-content:center;text-align:center;padding:0 4px;min-height:46px;font-size:14px;letter-spacing:.05em;border-radius:0;border-top:1px solid var(--fk-line)}
  .fk-lead{font-size:17.5px}
  .fk-ph{flex-wrap:wrap;gap:0;padding:0}
  .fk-pl{align-self:auto;padding:6px 14px;width:100%}
  .fk-ph h2{padding:12px 16px}
  .fk-pb{padding:18px 16px 8px}
  .fk-id div{grid-template-columns:minmax(0,1fr);gap:2px}
  .fk-id .fk-id-h{display:flex}
  .fk-t,.fk-t tbody,.fk-t tr,.fk-t td{display:block;width:100%}
  .fk-t thead{display:none}
  .fk-t tr{border-top:3px solid var(--fk-gr);padding-bottom:6px}
  .fk-t tr:first-child{border-top:0}
  .fk-t td{border:0;padding:4px 14px}
  .fk-t td::before{content:attr(data-l);display:block;font:500 12px/1.3 "Roboto Mono",monospace;text-transform:uppercase;letter-spacing:.07em;color:var(--fk-gold2)}
  .fk-t td:first-child{background:var(--fk-sf2);padding:8px 14px;font-size:18px}
  .fk-t td:first-child::before{display:none}
  .fk-close-in{padding:20px 16px}
  .fk .btn{min-height:48px}
}
.fk-fig-h figcaption{padding:12px 14px;font:400 14.5px/1.5 "Roboto Mono",monospace;color:rgba(255,255,255,.75);align-self:center}
.fk .fk-kick,.fk .fk-date,.fk .fk-more-h{font-size:15px}
.fk .fk-ad{font-size:14.5px}