/* WARM-UP · URBANA Coquetelaria — preto, azul-marinho e branco */
:root{
  --black:#000000; --navy:#192542; --navy-deep:#0E1730; --navy-2:#24345C; --navy-line:#34467A;
  --white:#FFFFFF; --mist:#B9C3DA; --warm:#FFDCA0; --bad:#FF6B76;
  --page:#000000;
  --font:"Jersey 10", "Press Start 2P", ui-monospace, Menlo, Consolas, monospace;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%}
body{letter-spacing:.04em;background:var(--page);color:var(--white);font-family:var(--font);overflow:hidden;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-text-size-adjust:100%}
#app{position:relative;margin:0 auto;max-width:460px;height:100vh;height:100dvh;background:var(--navy-deep);overflow:hidden}
.screen{position:absolute;inset:0;display:flex;flex-direction:column}
.screen[hidden]{display:none}
button{font-family:var(--font);cursor:pointer;color:inherit}
button:focus-visible,input:focus-visible{outline:3px solid var(--warm);outline-offset:2px}
p{margin:0}

/* botões em pixel */
.px{font-size:16px;line-height:1.1;color:var(--white);background:var(--navy-2);border:0;border-radius:0;padding:10px 6px;
  box-shadow:inset -3px -3px 0 rgba(0,0,0,.35),inset 3px 3px 0 rgba(255,255,255,.08),0 0 0 2px var(--black)}
.px:active{transform:translateY(1px)}
.px[aria-pressed="true"]{background:var(--white);color:var(--black);box-shadow:inset -3px -3px 0 #C3CAD8,0 0 0 2px var(--black)}
.px:disabled{opacity:.4;cursor:default;transform:none}
.px.primary{background:var(--white);color:var(--black);font-size:20px;padding:14px 10px;box-shadow:inset -3px -3px 0 #C3CAD8,0 0 0 2px var(--black),4px 4px 0 var(--black)}
.px.ghost{background:transparent;box-shadow:inset 0 0 0 2px rgba(255,255,255,.3)}
.px.dimmed{opacity:.5}
.px.voucher{background:var(--warm);color:var(--black);box-shadow:inset -3px -3px 0 #D9A85A,0 0 0 2px var(--black)}

/* splash */
#splash{background:var(--navy);align-items:center;justify-content:center}
#splashCv{width:min(86vw,380px);height:min(86vw,380px)}
#splashCap{position:absolute;left:0;right:0;bottom:22%;text-align:center;font-size:18px;letter-spacing:2px;opacity:0;transition:opacity .25s steps(3)}
#splashSkip{position:absolute;left:0;right:0;bottom:calc(24px + env(safe-area-inset-bottom));text-align:center;font-size:13px;opacity:.6}

/* telas de acesso e menu */
.form-screen{background:var(--navy);align-items:center;justify-content:flex-start;gap:18px;padding:calc(24px + env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom));overflow-y:auto}
.form-screen > :first-child{margin-top:auto}
.form-screen > :last-child{margin-bottom:auto}
.brand{display:flex;flex-direction:column;align-items:center;gap:16px}
.urb{display:block;width:44px;height:43px;color:var(--white)}
.urb.big-urb{width:64px;height:62px}
.urb svg{width:100%;height:100%;display:block}
.wu{width:min(70vw,270px);height:auto;display:block}
.title{font-size:20px;line-height:1.25;text-align:center;text-shadow:3px 3px 0 var(--black)}
.card{width:100%;max-width:340px;background:var(--navy-deep);padding:16px;box-shadow:0 0 0 3px var(--black),6px 6px 0 var(--black);display:flex;flex-direction:column;gap:12px}
.card-title{font-size:20px;line-height:1.2}
.field{display:flex;flex-direction:column;gap:7px;font-size:15px;color:var(--mist)}
.field input{font-family:var(--font);font-size:22px;padding:11px 10px;background:var(--black);color:var(--white);border:0;border-radius:0;box-shadow:inset 0 0 0 2px var(--navy-line);width:100%;-webkit-user-select:text;user-select:text}
.field input:-webkit-autofill{-webkit-text-fill-color:var(--white);box-shadow:inset 0 0 0 2px var(--navy-line),0 0 0 1000px var(--black) inset}
.msg{font-size:15px;line-height:1.2;color:var(--mist)}
.msg:empty{display:none}
.msg.bad{color:var(--bad)}
.note{font-size:13px;line-height:1.25;color:var(--mist)}
.note:empty{display:none}
.hello{font-size:22px;line-height:1.2}
.day-line{font-size:15px;line-height:1.25;color:var(--mist);padding:8px;background:var(--black)}
.day-line.live{color:var(--black);background:var(--white)}
.best{font-size:15px;line-height:1.25;color:var(--mist)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.legal{font-size:13px;line-height:1.25;text-align:center;color:var(--mist);max-width:340px}

.rank{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:15px;position:relative;max-height:min(46vh,380px);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.rank li{display:grid;grid-template-columns:26px 1fr auto;gap:6px;align-items:center;background:var(--black);padding:8px}
.rank li.me{box-shadow:inset 0 0 0 2px var(--white)}
.rank .pos{color:var(--mist)}
.rank .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank .sc{color:var(--white)}
.rank .empty{display:block;text-align:center;color:var(--mist);line-height:1.25}

/* jogo */
#game{background:var(--black)}
.hud{display:flex;align-items:center;gap:8px;padding:6px 8px;padding-top:max(6px,env(safe-area-inset-top));background:var(--navy);font-size:16px;box-shadow:0 3px 0 var(--black);position:relative;z-index:2}
.hud .grow{flex:1}
.hud .prog{padding:4px 5px;background:var(--black)}
.hud .prog.done{background:var(--white);color:var(--black)}
.hud .time{color:var(--mist)}
.hearts{display:flex;gap:3px}
.hearts img{width:18px;height:16px;image-rendering:pixelated;display:block}
.hud .px{padding:6px;font-size:15px}
.icon-btn img{width:18px;height:16px;image-rendering:pixelated;display:block}
#quitBtn img{width:18px;height:14px}
.hud .book{display:flex;align-items:center;gap:6px}
.hud .book img{width:18px;height:14px;image-rendering:pixelated}
@media (max-width:399px){.hud .book span{display:none}.hud{font-size:15px;gap:6px}}

.scene{position:relative;flex:1 1 auto;min-height:120px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;background-color:var(--wall,var(--navy));
  background-image:linear-gradient(var(--wall-grout,#121C36) var(--lw,1px),transparent var(--lw,1px)),linear-gradient(90deg,var(--wall-grout,#121C36) var(--lw,1px),transparent var(--lw,1px));
  background-size:var(--u,9px) var(--u,9px),var(--u,9px) var(--u,9px)}
#sceneLogo{position:absolute;left:50%;transform:translateX(-50%);width:auto;max-width:60%;object-fit:contain;image-rendering:auto;pointer-events:none}
#sceneLogo[hidden]{display:none}
#sceneCv{display:block;image-rendering:pixelated;touch-action:manipulation}

.panel{flex:0 0 auto;background:var(--navy-deep);padding:8px 8px calc(8px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:7px;box-shadow:0 -3px 0 var(--black)}
.ticket{display:flex;align-items:center;gap:8px;background:var(--black);color:var(--white);padding:8px;min-height:34px;border:0;width:100%;text-align:left}
.ticket .lbl{font-size:13px;color:var(--mist)}
.ticket .name{font-size:18px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ticket .bar{width:60px;height:8px;background:var(--navy-2);flex:0 0 auto}
.ticket .bar i{display:block;height:100%;width:0}

.tile{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;padding:4px 2px 5px;font-size:14px;min-width:0}
.tile img{image-rendering:pixelated;width:38px;height:38px;display:block}
.tile span{line-height:1.1;text-align:center;word-break:break-word}
.glasses{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.glasses .tile{flex-direction:row;justify-content:center;gap:6px;padding:3px 2px;font-size:15px}
.glasses .tile img{width:32px;height:32px}
.ings{display:grid;grid-template-columns:repeat(6,1fr);gap:5px}
.ings .tile span{min-height:2.2em;display:flex;align-items:center;justify-content:center}
.prep{display:grid;grid-template-columns:3fr 4fr;gap:8px}
.methods,.garnish{display:grid;gap:5px}
.methods{grid-template-columns:repeat(3,1fr)}
.garnish{grid-template-columns:repeat(4,1fr)}
.methods .tile{justify-content:center;font-size:13px;padding:9px 2px}
.garnish .tile{padding:4px 1px}
.garnish .tile img{width:20px;height:20px}

.bottom{display:grid;grid-template-columns:64px 1fr 100px;gap:8px;align-items:center}
#previewCv{width:64px;height:64px;image-rendering:pixelated;background:var(--black);display:block}
.contents{font-size:13px;line-height:1.25;color:var(--mist);min-width:0;display:flex;flex-direction:column;gap:3px}
.contents .hint{color:var(--white);font-size:15px;line-height:1.2}
.contents .hint.warn{color:var(--bad)}
.contents .hint.good,.contents .hint.go{color:var(--warm)}
.actions{display:flex;flex-direction:column;gap:7px}
.actions .px{padding:10px 4px}
.actions .px.primary{padding:12px 4px}
#serveBtn:not(:disabled){animation:pulse 1s steps(2) infinite}
@keyframes pulse{50%{background:var(--warm)}}

@media (max-height:740px){
  .ings .tile img{width:24px;height:24px}
  .ings .tile span{min-height:2.2em}
  .glasses .tile img{width:22px;height:22px}
  .panel{gap:6px}
}
@media (max-width:359px){.tile{font-size:12px}.glasses .tile{font-size:13px}.hud{font-size:15px;gap:5px}}
@media (prefers-reduced-motion: reduce){#serveBtn:not(:disabled){animation:none}}

/* modal */
.modal{position:absolute;inset:0;background:rgba(0,0,0,.72);display:flex;align-items:flex-end;justify-content:center;z-index:20}
.modal[hidden]{display:none}
.sheet{width:100%;max-height:92%;background:var(--navy-deep);box-shadow:0 -3px 0 var(--black),0 -6px 0 var(--white);display:flex;flex-direction:column;min-height:0}
.mhead{flex:0 0 auto;padding:18px 16px 14px;display:flex;flex-direction:column;gap:10px;background:var(--navy);box-shadow:0 3px 0 var(--black);position:relative;z-index:1}
.mhead h2{margin:0;font-size:28px;line-height:1.4;text-align:center;text-shadow:3px 3px 0 var(--black);font-weight:400}
.msub{font-size:16px;line-height:1.25;text-align:center}
.msub[hidden],.mtop[hidden],.mactions[hidden]{display:none}
.msub .dim{color:var(--mist)}
.mtop{display:flex;flex-direction:column;gap:8px}
.mscroll{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
.mbody{font-size:16px;line-height:1.25;text-align:center;display:flex;flex-direction:column;gap:8px}
.mbody .big{font-size:34px;line-height:1.4}
.mbody .ok{color:var(--warm)} .mbody .bad{color:var(--bad)} .mbody .dim{color:var(--mist)}
.mbody .lead{font-size:15px;line-height:1.25;color:var(--mist);text-align:left;margin-bottom:4px}
.mactions{flex:0 0 auto;display:flex;flex-direction:column;gap:9px;padding:14px 16px calc(16px + env(safe-area-inset-bottom));box-shadow:0 -3px 0 var(--black)}

/* livro de receitas */
.recipes{display:flex;flex-direction:column;gap:8px;text-align:left}
.recipe{background:var(--black);padding:10px;display:flex;flex-direction:column;gap:8px;font-size:15px;line-height:1.2;touch-action:manipulation;-webkit-touch-callout:none}
.rhead{display:flex;align-items:center;gap:10px}
.rglass{width:32px;height:32px;image-rendering:pixelated;flex:0 0 auto}
.recipe .rn{font-size:18px;color:var(--white)}
.recipe .how{color:var(--mist);font-size:13px;margin-top:4px}
.ring{display:flex;flex-wrap:wrap;gap:6px}
.ring span{display:flex;align-items:center;gap:4px;background:var(--navy);padding:3px 6px 3px 3px;font-size:13px}
.ring img{width:20px;height:20px;image-rendering:pixelated}
.recipe .spec{color:var(--white)}
.recipe .story{color:var(--mist);font-size:13px;line-height:1.25}

/* desconto */
.voucher-art{display:block;width:280px;max-width:100%;height:auto;margin:0 auto;image-rendering:pixelated}
.code-box{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--black);padding:12px;box-shadow:inset 0 0 0 2px var(--white)}
.code-box .dim{font-size:13px}
.code-box .code{font-size:40px;letter-spacing:4px;line-height:1.2}

/* painel admin */
.nw-admin{display:flex;flex-direction:column;gap:14px;text-align:left}
.nw-admin .nwa-box{background:var(--black);padding:12px;display:flex;flex-direction:column;gap:9px}
.nw-admin h3{margin:0;font:inherit;font-size:18px;line-height:1.2;color:var(--white)}
.nw-admin label{font-size:15px;line-height:1.25;color:var(--mist)}
.nw-admin input[type=number],.nw-admin input[type=search],.nw-admin input[type=date]{width:100%;height:42px;padding:0 10px;border:0;border-radius:0;box-shadow:inset 0 0 0 2px var(--navy-line);background:var(--navy-deep);color:var(--white);font:400 20px/1 var(--font);-webkit-appearance:none;appearance:none;outline:0;margin:0;color-scheme:dark}
.nw-admin .nwa-row{display:flex;align-items:center;gap:8px}
.nw-admin .nwa-row input{flex:1;min-width:0}
.nw-admin .nwa-row span{font-size:16px}
.nw-admin .nwa-check{display:flex;align-items:center;gap:10px;cursor:pointer}
.nw-admin .nwa-check input{width:20px;height:20px;margin:0;flex:0 0 auto;accent-color:#FFFFFF}
.nw-admin .nwa-hint,.nw-admin .nwa-stats,.nw-admin .nwa-empty{font-size:15px;line-height:1.25;color:var(--mist);margin:0}
.nw-admin .nwa-msg{font-size:15px;line-height:1.25;margin:0}
.nw-admin .nwa-msg:empty{display:none}
.nw-admin .nwa-msg.ok{color:var(--warm)}
.nw-admin .nwa-msg.bad{color:var(--bad)}
.nw-admin .nwa-filters{display:flex;gap:6px;flex-wrap:wrap}
.nw-admin .nwa-filters button{flex:1 1 auto;min-height:34px;padding:6px 8px;border:0;border-radius:0;background:var(--navy-2);color:var(--white);font:400 15px/1.2 var(--font);box-shadow:0 0 0 2px var(--black)}
.nw-admin .nwa-filters button[aria-pressed="true"]{background:var(--white);color:var(--black)}
.nw-admin .nwa-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.nw-admin .nwa-p{background:var(--navy-deep);padding:9px;display:flex;flex-direction:column;gap:6px}
.nw-admin .nwa-top{display:flex;justify-content:space-between;gap:8px;font-size:16px;line-height:1.2}
.nw-admin .nwa-top .nm{overflow-wrap:anywhere}
.nw-admin .nwa-top .code{font-size:22px;letter-spacing:2px}
.nw-admin .nwa-sub{font-size:13px;line-height:1.25;color:var(--mist)}
.nw-admin .nwa-prize{font-size:13px;line-height:1.25}
.nw-admin .nwa-prize.redeemed{color:var(--mist)}

/* tutorial */
.tut{position:absolute;inset:0;z-index:30}
.tut[hidden]{display:none}
.tut-hole{position:absolute;box-shadow:0 0 0 9999px rgba(0,0,0,.78);outline:3px solid var(--white);pointer-events:none;transition:top .18s steps(3),left .18s steps(3),width .18s steps(3),height .18s steps(3)}
.tut-card{position:absolute;left:12px;right:12px;background:var(--navy);box-shadow:0 0 0 3px var(--black),5px 5px 0 var(--black);padding:14px;display:flex;flex-direction:column;gap:10px}
.tut-step{font-size:15px;color:var(--mist)}
.tut-text{font-size:16px;line-height:1.25}
@media (prefers-reduced-motion: reduce){.tut-hole{transition:none}}

/* celulares baixos (iPhone SE e afins): painel mais compacto para sobrar cena */
@media (max-height:700px){
  .panel{gap:5px;padding-top:6px}
  .ticket{min-height:30px;padding:6px 8px}
  .ings{gap:4px}
  .ings .tile{padding:3px 1px 4px;gap:2px}
  .ings .tile img{width:22px;height:22px}
  .ings .tile span{min-height:0;display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .bottom{grid-template-columns:48px 1fr 92px}
  #previewCv{width:48px;height:48px}
  #cLine1{display:none}
  .actions .px,.actions .px.primary{padding:8px 4px}
}

/* ================= painel admin: site normal, fora do estilo pixel ================= */
.adm{position:fixed;inset:0;z-index:100;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#EEF1F6;color:#141B2D;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:15px;line-height:1.5;letter-spacing:0;
  -webkit-user-select:text;user-select:text;touch-action:auto}
.adm[hidden]{display:none}
.adm *{font-family:inherit;letter-spacing:0}
.adm button,.adm input,.adm select,.adm textarea{font-size:15px}
.adm-wrap{max-width:1080px;margin:0 auto;padding-left:20px;padding-right:20px}
.adm-top{position:sticky;top:0;z-index:2;background:#192542;color:#fff;box-shadow:0 1px 0 rgba(0,0,0,.2);padding-top:env(safe-area-inset-top)}
.adm-top-in{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:14px;padding-bottom:10px}
.adm-brand{display:flex;align-items:center;gap:12px}
.adm-brand strong{display:block;font-size:18px;line-height:1.2}
.adm-brand span{font-size:13px;color:#B9C3DA}
.adm-u{width:34px;height:33px;color:#fff;display:block}
.adm-u svg{width:100%;height:100%;display:block}
.adm-top-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.adm-state{font-size:13px;color:#B9C3DA}
.adm-state.warn{color:#FFDCA0}
.adm-state.bad{color:#FF9AA2}
.adm-sub{display:flex;gap:18px;flex-wrap:wrap;padding-bottom:8px}
.adm-sub .adm-link{color:#DCE3F2}
.adm-tabs{display:flex;gap:4px;overflow-x:auto;padding-bottom:0;scrollbar-width:none}
.adm-tabs button{border:0;background:transparent;color:#B9C3DA;padding:10px 14px;border-radius:8px 8px 0 0;font-weight:600;white-space:nowrap;cursor:pointer}
.adm-tabs button[aria-selected="true"]{background:#EEF1F6;color:#192542}
.adm-main{padding-top:20px;padding-bottom:calc(48px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:18px}
.adm-card{background:#fff;border-radius:12px;padding:20px;box-shadow:0 1px 2px rgba(20,27,45,.08),0 0 0 1px rgba(20,27,45,.06)}
.adm-card h2{margin:0 0 6px;font-size:18px;color:#192542}
.adm-note{margin:0 0 14px;color:#56627D;font-size:14px}
.adm-empty{color:#56627D}
.adm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px 18px;margin-bottom:14px}
.adm-grid-2{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.adm-field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.adm-grid .adm-field{margin-bottom:0}
.adm-field > span{font-size:13px;font-weight:600;color:#33405C}
.adm-field small,.adm-logo-ctl small{color:#6A7690;font-size:12px}
.adm-input{display:flex;align-items:center;border:1px solid #CBD2E0;border-radius:8px;background:#fff;overflow:hidden}
.adm-input:focus-within{border-color:#192542;box-shadow:0 0 0 3px rgba(25,37,66,.15)}
.adm-input em{font-style:normal;color:#6A7690;padding:0 10px;font-size:14px}
.adm-input input,.adm-input select{flex:1;min-width:0;border:0;outline:0;padding:10px 12px;background:transparent;color:#141B2D}
.adm-input em + input{padding-left:0}
.adm textarea{width:100%;border:1px solid #CBD2E0;border-radius:8px;padding:10px 12px;resize:vertical;color:#141B2D;line-height:1.45}
.adm textarea:focus{outline:0;border-color:#192542;box-shadow:0 0 0 3px rgba(25,37,66,.15)}
.adm-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid #192542;background:#fff;color:#192542;border-radius:8px;padding:9px 16px;font-weight:600;cursor:pointer;line-height:1.2}
.adm-btn:hover{background:#F2F4F9}
.adm-btn.primary{background:#fff;color:#000;border-color:#fff}
.adm-main .adm-btn.primary{background:#192542;color:#fff;border-color:#192542}
.adm-btn.ghost{background:transparent;border-color:rgba(255,255,255,.4);color:#fff}
.adm-main .adm-btn.ghost{border-color:#CBD2E0;color:#33405C}
.adm-btn.danger{border-color:#D23B4A;color:#D23B4A}
.adm-btn.small{padding:6px 10px;font-size:13px}
.adm-btn:disabled{opacity:.5;cursor:default}
.adm-link{border:0;background:none;padding:0;color:#192542;text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-size:14px}
.adm-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.adm-chips{display:flex;gap:8px;flex-wrap:wrap}
.adm-chip input{position:absolute;opacity:0;pointer-events:none}
.adm-chip span{display:inline-block;padding:8px 14px;border:1px solid #CBD2E0;border-radius:999px;cursor:pointer;font-weight:600;color:#33405C;user-select:none}
.adm-chip input:checked + span{background:#192542;border-color:#192542;color:#fff}
.adm-chip input:focus-visible + span{box-shadow:0 0 0 3px rgba(25,37,66,.25)}
.adm-table{width:100%;border-collapse:collapse;font-size:14px}
.adm-table th{text-align:left;font-size:12px;text-transform:none;color:#6A7690;font-weight:600;padding:8px;border-bottom:1px solid #E1E6EF}
.adm-table td{padding:10px 8px;border-bottom:1px solid #EEF1F6;vertical-align:middle}
.adm-table .mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:15px;font-weight:700;letter-spacing:1px}
.adm-tag{display:inline-block;background:#EEF1F6;color:#56627D;border-radius:6px;padding:3px 8px;font-size:13px}
#admVList,#admPList{overflow-x:auto}
.adm-recs{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.adm-rec{border:1px solid #E1E6EF;border-radius:10px;background:#FAFBFD}
.adm-rec[open]{background:#fff;box-shadow:0 2px 8px rgba(20,27,45,.06)}
.adm-rec summary{display:flex;align-items:center;gap:12px;padding:10px 14px;cursor:pointer;list-style:none}
.adm-rec summary::-webkit-details-marker{display:none}
.adm-rec summary img{width:28px;height:28px;image-rendering:pixelated;background:#192542;border-radius:6px;padding:2px}
.adm-rec summary strong{font-size:15px}
.adm-meta{color:#6A7690;font-size:13px;margin-left:auto;text-align:right}
.adm-rec-body{padding:6px 14px 14px;border-top:1px solid #EEF1F6}
.adm-ings{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
.adm-ing{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid #E1E6EF;border-radius:8px;cursor:pointer;font-size:13px}
.adm-ing:has(input:checked){border-color:#192542;background:#F2F4F9}
.adm-ing img{width:24px;height:24px;image-rendering:pixelated;background:#192542;border-radius:4px}
.adm-switch{position:relative;display:inline-block;width:38px;height:22px;flex:0 0 auto}
.adm-switch input{opacity:0;width:0;height:0;position:absolute}
.adm-switch span{position:absolute;inset:0;background:#CBD2E0;border-radius:999px;transition:background .15s}
.adm-switch span::after{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s}
.adm-switch input:checked + span{background:#192542}
.adm-switch input:checked + span::after{transform:translateX(16px)}
.adm-logo{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.adm-logo-prev{width:140px;height:140px;border-radius:12px;background:#192542;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.adm-logo-prev img{max-width:96px;max-height:96px}
.adm-logo-ctl{display:flex;flex-direction:column;gap:10px;align-items:flex-start;max-width:420px}
.adm-check{display:flex;align-items:center;gap:8px;cursor:pointer}
.adm-theme{display:grid;grid-template-columns:minmax(240px,1fr) minmax(260px,1.3fr);gap:20px;align-items:start}
.adm-colors{display:flex;flex-direction:column;gap:8px}
.adm-color{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:10px;cursor:pointer}
.adm-color input{width:44px;height:32px;border:1px solid #CBD2E0;border-radius:6px;padding:2px;background:#fff;cursor:pointer}
.adm-color code{font-size:12px;color:#6A7690}
.adm-prev{display:flex;flex-direction:column;gap:8px;align-items:flex-start;position:sticky;top:170px}
.adm-prev canvas{width:100%;height:auto;image-rendering:pixelated;border-radius:10px;background:#000}
@media (max-width:700px){.adm-theme{grid-template-columns:1fr}.adm-prev{position:static}.adm-meta{display:none}.adm-card{padding:16px}}

.text-link{background:none;border:0;color:var(--mist);font-size:13px;text-decoration:underline;text-underline-offset:3px;padding:6px}
/* resgate: regras e CPF */
.rules{text-align:left;display:flex;flex-direction:column;gap:10px}
.rules .main{background:var(--white);color:var(--black);padding:12px;font-size:17px;line-height:1.25;box-shadow:4px 4px 0 var(--black)}
.rules ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:8px;font-size:15px;line-height:1.25;color:var(--white)}
.rules ol li::marker{color:var(--mist)}
.agree{display:flex;align-items:flex-start;gap:10px;text-align:left;font-size:16px;line-height:1.2;cursor:pointer;padding:10px;background:var(--black)}
.agree input{width:22px;height:22px;flex:0 0 auto;margin:0;accent-color:#FFFFFF}
.cpf-input{font-family:var(--font);font-size:30px;letter-spacing:2px;text-align:center;width:100%;padding:12px;background:var(--black);color:var(--white);border:0;border-radius:0;box-shadow:inset 0 0 0 2px var(--navy-line);-webkit-user-select:text;user-select:text}
.cpf-input:focus{outline:3px solid var(--warm)}
.cpf-line{font-size:15px;color:var(--mist)}

/* aceite das regras e CPF antes de jogar */
.wu.wu-sm{width:min(48vw,190px)}
.rules-card{max-width:400px}
.rules-card .rules ol{max-height:none}
.me-box{display:flex;flex-direction:column;gap:6px;background:var(--black);padding:10px}
.me-row{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:15px}
.me-row .text-link{padding:0;font-size:13px}
.plays{font-size:16px;line-height:1.2}
.plays.none{color:var(--bad)}
.lives-line{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--mist)}
.lives-line:empty{display:none}
.lives-line img{width:16px;height:14px;image-rendering:pixelated}
#playBtn:disabled{opacity:.45}
