:root{
  --bg:#0b0c0e;--panel:#111317;--panel2:#17191e;--line:#3a3020;--gold:#c89a46;--gold2:#e3bd72;
  --text:#eee6d7;--muted:#a69b88;--green:#6ecb78;--red:#da6e68;--blue:#79a9d8;
}
*{box-sizing:border-box} body{margin:0;background:radial-gradient(circle at top,#15171a 0,#0b0c0e 45%,#08090a 100%);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;min-height:100vh}
button,input{font:inherit}.shell{min-height:100vh;display:flex;flex-direction:column}.topbar{height:72px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 24px;background:#0b0c0ee8;position:sticky;top:0;z-index:10;backdrop-filter:blur(8px)}
.brand{font-family:Georgia,serif;color:var(--gold2);font-size:28px;letter-spacing:.08em}.tag{margin-left:16px;color:var(--muted);font-size:12px;letter-spacing:.15em;text-transform:uppercase}.stats{margin-left:auto;display:flex;gap:24px;font-size:13px;color:var(--muted)}.stats b{color:var(--text)}
.main{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 72px)}.sidebar{border-right:1px solid var(--line);padding:20px 14px;background:#0d0f12}.navbtn{width:100%;text-align:left;background:transparent;border:1px solid transparent;color:#d7ccba;padding:12px 14px;border-radius:8px;margin-bottom:8px;cursor:pointer}.navbtn:hover,.navbtn.active{border-color:#6f5427;background:#1d1810;color:var(--gold2)}
.content{padding:28px;max-width:1480px;width:100%;margin:0 auto}.hero{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:40px}.hero-card{width:min(980px,94vw);border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#16181d,#0d0f12);padding:64px;box-shadow:0 30px 80px #0008}.eyebrow{color:var(--gold);text-transform:uppercase;letter-spacing:.16em;font-size:12px}.hero h1{font-family:Georgia,serif;font-size:58px;margin:12px 0 10px;color:var(--gold2)}.hero p{max-width:620px;color:#c9c0b2;font-size:18px;line-height:1.6}.cta{display:flex;gap:12px;margin-top:28px}
.btn{border:1px solid #775b2b;background:#17130d;color:var(--gold2);padding:11px 16px;border-radius:8px;cursor:pointer}.btn:hover{background:#241b0f}.btn.primary{background:linear-gradient(180deg,#d4a64e,#a9792d);color:#111;border-color:#d7ad60;font-weight:700}.btn.danger{border-color:#7a3835;color:#f3a39d}.btn.success{border-color:#376c3c;color:#8ee398}.btn:disabled{opacity:.45;cursor:not-allowed}
.grid{display:grid;gap:18px}.grid.two{grid-template-columns:1.1fr .9fr}.grid.three{grid-template-columns:repeat(3,1fr)}.panel{border:1px solid var(--line);background:linear-gradient(180deg,#14171b,#0f1114);border-radius:12px;padding:18px}.panel h2,.panel h3{font-family:Georgia,serif;color:#e9d3aa;margin-top:0}.subtle{color:var(--muted);font-size:13px}.section-title{font-family:Georgia,serif;color:var(--gold2);font-size:30px;margin:0 0 6px}.section-sub{color:var(--muted);margin:0 0 24px}.list{display:flex;flex-direction:column;gap:10px}.card{border:1px solid #34302a;background:#111317;border-radius:10px;padding:14px}.card.selected{border-color:#b88636;background:#1b160f}.row{display:flex;align-items:center;justify-content:space-between;gap:14px}.badge{display:inline-block;padding:3px 8px;border-radius:999px;border:1px solid #4a4235;color:#cabb9f;font-size:11px;margin-right:6px}.badge.gold{border-color:#8a642b;color:#e1b96b}.badge.green{border-color:#315e38;color:#78d584}.badge.blue{border-color:#34536e;color:#8bbce5}.money{color:var(--green);font-weight:700}.muted{color:var(--muted)}
.tabs{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}.tab{border:1px solid #373028;background:#111;color:#cfc3ae;border-radius:7px;padding:8px 11px;cursor:pointer}.tab.active{border-color:#a87a31;color:#f0c66d;background:#1c160e}.columns{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.choice{border:1px solid #3b342a;background:#111317;padding:12px;border-radius:8px;cursor:pointer}.choice:hover{border-color:#73582f}.choice.selected{border-color:#c18b35;background:#21180d}.choice.locked{opacity:.38;cursor:not-allowed}.paper{background:#e9dfcb;color:#2e2a25;border-radius:8px;padding:28px;min-height:420px;box-shadow:inset 0 0 0 1px #c6b99f;line-height:1.5}.paper h3{color:#2e2a25;font-family:Georgia,serif;text-align:center}.timeline{display:flex;flex-direction:column;gap:12px}.event{border-left:3px solid #8d6a32;padding:10px 14px;background:#121419;border-radius:0 8px 8px 0}.question{display:block;width:100%;text-align:left;margin:8px 0}.result{font-size:18px;line-height:1.6}.gain{color:#86d98d}.loss{color:#e1847e}.divider{height:1px;background:#30291f;margin:16px 0}.small{font-size:12px}.note{background:#221b10;border:1px solid #6f5326;color:#e2c68f;border-radius:8px;padding:12px}.empty{padding:30px;text-align:center;color:var(--muted);border:1px dashed #3b342a;border-radius:10px}
@media(max-width:900px){.main{grid-template-columns:1fr}.sidebar{display:none}.grid.two,.grid.three,.columns{grid-template-columns:1fr}.content{padding:18px}.hero-card{padding:32px}.hero h1{font-size:42px}.stats{gap:10px;font-size:11px}}

/* ---------------------------------------------------------------- Ciclo 1 */
/* .grid.four era usado pela Progressão mas nunca existiu: os quatro estágios
   empilhavam em coluna única. */
.grid.four{grid-template-columns:repeat(4,1fr)}
/* Fase de carreira / tese ainda bloqueada. */
.panel.locked{opacity:.45}
.panel.locked h3{color:#c3b498}
.tab:disabled{opacity:.38;cursor:not-allowed}
.tab:disabled:hover{border-color:#373028;color:#cfc3ae;background:#111}
@media(max-width:1200px){.grid.four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.grid.four{grid-template-columns:1fr}}

/* =============================================== Ciclo 4 — Mesa física */
.ico{vertical-align:-4px;flex:none}
:root{--st-aberta:#a69b88;--st-sustentada:#6ecb78;--st-contestada:#e0a64a;
      --st-enfraquecida:#da6e68;--st-superada:#e3bd72}

.aviso{display:flex;align-items:center;gap:9px;min-height:46px;padding:0 15px;border-radius:9px;margin-bottom:16px;font-size:16px;border:1px solid transparent}
.aviso.vazio{background:transparent;border-color:transparent}
.aviso.bom{background:#122016;border-color:#2f5c37;color:#9fe0a7}
.aviso.ruim{background:#201414;border-color:#6b3733;color:#efaaa4}
.st{display:inline-flex;align-items:center;gap:6px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:3px 9px;border-radius:999px;border:1px solid currentColor}
.st .pt{width:7px;height:7px;border-radius:50%;background:currentColor;display:block}
.st-aberta{color:var(--st-aberta)}.st-sustentada{color:var(--st-sustentada)}
.st-contestada{color:var(--st-contestada)}.st-enfraquecida{color:var(--st-enfraquecida)}
.st-superada{color:var(--st-superada)}

/* ------------------------------------------------------------- a madeira */
.mesa-madeira{position:relative;border-radius:14px;padding:20px;border:1px solid #241509;
  background:
    repeating-linear-gradient(91deg,rgba(60,30,10,.22) 0 3px,transparent 3px 11px),
    repeating-linear-gradient(89deg,rgba(255,232,190,.07) 0 1px,transparent 1px 16px),
    repeating-linear-gradient(90.5deg,rgba(0,0,0,.10) 0 1px,transparent 1px 47px),
    radial-gradient(100% 70% at 45% -10%,#9a6a3c 0,#7b5029 45%,#5d3a1c 100%);
  box-shadow:inset 0 0 90px rgba(40,18,4,.45),inset 0 2px 0 rgba(255,232,190,.14),0 26px 60px #000a}
.mesa-madeira::after{content:"";position:absolute;inset:0;border-radius:14px;pointer-events:none;
  background:radial-gradient(58% 44% at 50% 8%,rgba(255,238,205,.13) 0,transparent 62%),
             radial-gradient(95% 78% at 50% 45%,transparent 0,rgba(35,16,4,.34) 100%)}

.mesa-grade{position:relative;z-index:1;display:grid;gap:13px;align-items:start;
  grid-template-columns:215px 1fr 1fr 210px;
  grid-template-areas:"pilha fatos provas contra" "pilha teses pedidos contra"
                      "pilha maleta maleta fund" "peca peca peca peca"}
.a-pilha{grid-area:pilha}.a-fatos{grid-area:fatos}.a-provas{grid-area:provas}
.a-contradicoes{grid-area:contra}.a-teses{grid-area:teses}.a-pedidos{grid-area:pedidos}
.a-peca{grid-area:peca;position:relative}
.a-maleta{grid-area:maleta}.a-fundamento{grid-area:fund}

/* áreas marcadas no tampo, como fita crepe na madeira */
.area{border:1px dashed rgba(255,232,196,.34);border-radius:11px;padding:8px 10px 10px;
  background:rgba(40,20,6,.20);min-height:96px;box-shadow:inset 0 1px 0 rgba(255,240,210,.07)}
.area h4{margin:0 0 8px;display:flex;align-items:center;gap:8px;font-family:Georgia,serif;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#f2ddb4;
  text-shadow:0 1px 2px rgba(0,0,0,.6)}
.area h4 .conta{margin-left:auto;font-family:inherit;font-style:normal;font-size:11px;
  min-width:19px;height:19px;display:flex;align-items:center;justify-content:center;
  border-radius:999px;background:rgba(0,0,0,.42);color:#e6d3aa}
.area.alvo{border-color:#e3bd72;border-style:solid;background:rgba(227,189,114,.09)}
.area.nega{border-color:#a35a54;background:rgba(163,90,84,.12)}
.area.sob{box-shadow:inset 0 0 0 2px #f0cf8a,0 0 26px rgba(240,207,138,.25)}
.tampo{display:flex;flex-wrap:wrap;align-items:flex-start;gap:11px 10px}
.tampo.pilha{gap:9px}
.vazio-area{display:block;width:100%;min-height:46px;border-radius:8px;
  background:repeating-linear-gradient(45deg,rgba(255,235,200,.05) 0 7px,transparent 7px 14px)}

/* ------------------------------------------------------------- os papéis */
.doc{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:3px;
  flex:1 1 154px;max-width:100%;min-height:72px;padding:10px 12px;border:0;border-radius:2px;text-align:left;
  font:inherit;cursor:grab;color:#2e2a25;transform:rotate(var(--gira));
  box-shadow:0 1px 0 rgba(0,0,0,.22),0 7px 15px rgba(0,0,0,.45);
  transition:transform .13s ease,box-shadow .13s ease,filter .13s}
.doc:hover{transform:rotate(var(--gira)) translateY(-4px) scale(1.03);
  box-shadow:0 2px 0 rgba(0,0,0,.22),0 15px 26px rgba(0,0,0,.55);z-index:3}
.doc:focus-visible{outline:2px solid #f0cf8a;outline-offset:3px}
.doc .tit{font-size:14px;line-height:1.22;font-weight:600}
.doc .res{font-size:12px;opacity:.72;line-height:1.25}
.doc .marca-forma{position:absolute;right:8px;bottom:7px;opacity:.32}
.doc.namao{transform:rotate(0deg) translateY(-6px) scale(1.05);
  box-shadow:0 3px 0 rgba(0,0,0,.25),0 20px 34px rgba(0,0,0,.6),0 0 0 2px #f0cf8a;z-index:5}
.doc.arrastando{pointer-events:none;z-index:60;cursor:grabbing;opacity:.95}
.doc.travado{cursor:default;filter:saturate(.75) brightness(.93)}
.doc.travado:hover{transform:rotate(var(--gira))}
.doc.fechado{color:#6a5c45;min-height:62px;flex-basis:104px;align-items:center;justify-content:center}
.doc .verso{display:flex;align-items:center;justify-content:center;width:100%;min-height:42px;opacity:.55}
.doc.fechado::before{content:"";position:absolute;inset:5px;border:1px dashed rgba(0,0,0,.20);border-radius:2px}
.doc .selinho{position:absolute;top:-6px;right:-6px;width:19px;height:19px;border-radius:50%;
  background:#2f5c37;color:#dff5e2;display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 5px rgba(0,0,0,.4)}
/* clipe de metal */
.doc .clipe{position:absolute;top:-9px;left:14px;width:13px;height:26px;border:2px solid #b9bcc2;
  border-radius:7px 7px 5px 5px;border-bottom-color:transparent;
  box-shadow:0 1px 2px rgba(0,0,0,.5);z-index:4}

/* formas de papel */
.f-postit{background:linear-gradient(160deg,#f4e485,#e6d158);color:#3b3411;
  box-shadow:0 1px 0 rgba(0,0,0,.18),0 8px 14px rgba(0,0,0,.42)}
.f-postit::after{content:"";position:absolute;right:0;bottom:0;border-width:0 0 15px 15px;
  border-style:solid;border-color:transparent transparent rgba(0,0,0,.12) transparent}
.f-papel{background:linear-gradient(180deg,#f7f2e6,#e9e1cf);
  background-image:repeating-linear-gradient(180deg,transparent 0 17px,rgba(70,90,130,.10) 17px 18px),
    linear-gradient(180deg,#f7f2e6,#e9e1cf)}
.f-pasta{background:linear-gradient(180deg,#dcaf68,#c4924c);color:#3c2a0e;border-radius:2px 8px 2px 2px}
.f-pasta::before{content:"";position:absolute;top:-8px;right:14px;width:56px;height:9px;
  border-radius:4px 4px 0 0;background:linear-gradient(180deg,#e2b972,#cf9f57)}
.f-testemunha{background:linear-gradient(180deg,#f1e8d6,#ded2ba);padding-left:56px}
.f-testemunha::before{content:"";position:absolute;left:11px;top:12px;width:34px;height:40px;
  border-radius:2px;background:linear-gradient(180deg,#8e9aa6,#5f6a75);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.55)}
.f-ficha{background:#fdfaf1;border-top:3px solid #b4483f}
.f-ficha .tit{font-family:Georgia,serif;font-size:15px}

/* ------------------------------------------------------- leitura do papel */
.lupa-fundo{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:24px;
  background:rgba(6,4,2,.72);backdrop-filter:blur(3px)}
.folha{position:relative;width:min(720px,94vw);max-height:88vh;overflow:auto;padding:30px 34px;
  border-radius:3px;color:#2e2a25;background:linear-gradient(180deg,#f8f3e7,#ece4d2);
  box-shadow:0 30px 70px #000c,0 0 0 1px rgba(0,0,0,.25);transform:rotate(-.4deg)}
.folha h3{margin:0 0 6px;font-family:Georgia,serif;font-size:25px;color:#2b2620}
.folha .res{margin:0 0 16px;font-size:16px;color:#6a604e}
.folha .det{margin:16px 0 0;font-size:16px;line-height:1.5}
.folha .fecha{position:absolute;top:12px;right:12px;border:0;background:transparent;color:#7a6c56;cursor:pointer}
.folha .fecha:hover{color:#b4483f}

/* gráfico dentro da pasta de cartões */
.pista{margin-top:8px;padding:12px 14px;border-radius:6px;background:#efe7d6;border:1px solid #d5c9ae}
.raia{display:flex;align-items:center;gap:11px;margin:5px 0}
.raia .nome{width:120px;flex:none;text-align:right;font-size:11px;color:#6a604e}
.trilho{position:relative;flex:1;height:24px;border-radius:4px;background:#ded3ba;overflow:hidden}
.marca{position:absolute;top:0;bottom:0;width:1px;background:rgba(0,0,0,.12)}
.barra{position:absolute;top:3px;bottom:3px;border-radius:3px;display:flex;align-items:center;
  justify-content:space-between;padding:0 7px;font-size:10px;font-variant-numeric:tabular-nums}
.b-relato{background:linear-gradient(180deg,#d4a64e,#a9792d);color:#241a08}
.b-cartao{background:#fbf7ec;color:#4a4237;box-shadow:inset 0 0 0 1px #c9bda2}

/* ------------------------------------------------------------- a peça */
.a-peca{min-height:auto}
.folha-peca{position:relative;padding:20px 24px;border-radius:2px;color:#2e2a25;
  background:linear-gradient(180deg,#f8f3e7,#eee6d5);box-shadow:0 8px 20px rgba(0,0,0,.4);
  transform:rotate(-.25deg)}
.folha-peca h5{margin:0 0 12px;text-align:center;font-family:Georgia,serif;font-size:15px;
  letter-spacing:.14em}
.folha-peca p{margin:6px 0;font-size:14px;line-height:1.45}
.folha-peca .det{color:#6a604e;font-style:italic}
.folha-peca.protocolada{filter:saturate(.95)}
.carimbo{position:absolute;right:26px;bottom:14px;transform:rotate(-11deg);
  padding:7px 16px;border:3px double #a8443c;border-radius:4px;color:#a8443c;
  font-family:Georgia,serif;font-size:19px;letter-spacing:.2em;opacity:.82;
  text-shadow:0 0 2px rgba(168,68,60,.35)}
.a-peca .falta{list-style:none;margin:12px 0 10px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.a-peca .falta li{display:flex;align-items:center;gap:6px;font-size:12px;color:#e0a49e;
  border:1px solid #6b3733;border-radius:999px;padding:4px 11px;background:rgba(107,55,51,.18)}
.a-peca .pronta{margin:12px 0 4px;display:flex;align-items:center;gap:8px;color:#9fe0a7;font-size:14px}
.a-peca .risco{margin:0 0 10px;font-size:12px;color:#e0c48d;opacity:.85}
.a-peca > .btn{margin-top:4px}

/* --------------------------------------------------------------- arena */
.arena{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:20px}
.minha{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:15px 18px;border-radius:12px;
  background:#141019;border:1px solid #4a3a1e}
.minha .rot{display:flex;align-items:center;gap:10px;font-family:Georgia,serif;font-size:19px;color:var(--gold2)}
.minha .st{margin-left:auto}
.ritmo{display:flex;gap:9px;justify-content:center}
.passo{width:11px;height:11px;border-radius:50%;border:1px solid #3a3228;display:flex;align-items:center;justify-content:center}
.passo.agora{width:34px;border-radius:999px;background:linear-gradient(90deg,#a9792d,#d4a64e);border-color:#d7ad60}
.passo.ok{width:22px;height:22px;border-color:#2f5c37;color:#78d584}
.passo.nao{width:22px;height:22px;border-color:#6b3733;color:#e1847e}
.fala-adv{position:relative;padding:24px 28px;border-radius:16px;
  background:linear-gradient(180deg,#221619,#170f11);border:1px solid #6b3733;box-shadow:0 18px 44px #0007}
.fala-adv .quem{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#c98a84}
.fala-adv p{margin:10px 0 0;font-family:Georgia,serif;font-size:26px;line-height:1.25;color:#f0ddd9}
.fala-adv::after{content:"";position:absolute;left:44px;bottom:-11px;width:20px;height:20px;background:#1c1315;
  border-right:1px solid #6b3733;border-bottom:1px solid #6b3733;transform:rotate(45deg)}
.alvo{display:flex;flex-direction:column;align-items:center;gap:9px}
.alvo .etq{display:flex;align-items:center;gap:6px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--st-contestada)}
.peca-alvo{display:flex;align-items:center;gap:11px;padding:15px 22px;border-radius:12px;
  border:1px solid var(--st-contestada);background:#1e1710;color:#f0d9a8;font-size:17px;
  box-shadow:0 0 0 4px #7a5c2522,0 0 34px #7a5c2540}
.mao-mesa .etq-mao{display:block;text-align:center;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);margin-bottom:11px}
.mao{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.elem{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:16px;border-radius:12px;
  border:1px solid #3b342a;background:#111317;color:#e7dcc7;font:inherit;cursor:pointer;text-align:left}
.elem span{font-size:14px;line-height:1.25}
.elem:hover{border-color:#b88636;background:#1b160f}

/* --------------------------------------------------------------- fecho */
.fecho{max-width:900px;margin:0 auto;border:1px solid var(--line);border-radius:16px;padding:26px;
  background:linear-gradient(180deg,#14171b,#0f1114)}
.fecho h2{display:flex;align-items:center;gap:14px;margin:0 0 20px;font-family:Georgia,serif;font-size:26px;line-height:1.2}
.fecho.bom h2{color:#9fe0a7}.fecho.meio h2{color:#e0a64a}.fecho.ruim h2{color:#efaaa4}
.recap{display:grid;gap:10px;margin-bottom:18px}
.tira{display:flex;align-items:center;gap:16px;padding:13px 16px;border-radius:10px;background:#111317;border:1px solid #2b2620}
.tira .rot{width:180px;flex:none;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tira .val{display:flex;align-items:center;gap:10px;font-size:16px;color:#e7dcc7}
.trocas{margin-bottom:18px}
.trocas .rot{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.troca{display:flex;align-items:center;gap:11px;padding:12px 15px;border-radius:10px;margin-bottom:8px;
  border:1px solid #2b2620;background:#111317;font-size:15px;flex-wrap:wrap}
.troca .q{flex:1;min-width:180px}
.troca .a{flex:1;min-width:180px;color:var(--muted)}
.troca.ok{border-color:#2f5c37}.troca.ok .q{color:#9fe0a7}
.fecho .troca.ok .q{text-decoration:line-through}
.troca.nao{border-color:#6b3733}.troca.nao .q{color:#efaaa4}
.traducao{padding:17px;border-radius:12px;background:#17130d;border:1px solid #4a3a1e;margin-bottom:18px}
.traducao .rot{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#a89570;margin-bottom:10px}
.jur{display:flex;align-items:center;gap:10px;font-family:Georgia,serif;font-size:19px;color:var(--gold2)}

@media(max-width:1200px){
  .mesa-grade{grid-template-columns:1fr 1fr;
    grid-template-areas:"pilha pilha" "fatos provas" "contra contra" "teses pedidos"
                        "maleta maleta" "fund fund" "peca peca"}
}
@media(max-width:900px){
  .mesa-grade{grid-template-columns:1fr;
    grid-template-areas:"pilha" "fatos" "provas" "contra" "teses" "pedidos" "maleta" "fund" "peca"}
  .mao{grid-template-columns:1fr}.fala-adv p{font-size:21px}
  .tira{flex-direction:column;align-items:flex-start;gap:6px}.tira .rot{width:auto}
  .raia .nome{width:74px}
}
.area:focus-visible{outline:2px solid #f0cf8a;outline-offset:2px}

/* ================================================ Ciclo 5 — abertura e mundo */
/* §49 — mesa vazia, cenário e a pasta chegando */
.mesa-madeira.vazia{min-height:460px;display:grid;place-items:center;position:relative}
.cenario{position:absolute;inset:0;pointer-events:none}
.obj{position:absolute;border-radius:4px;box-shadow:0 6px 14px rgba(0,0,0,.45)}
.o-luminaria{left:6%;top:8%;width:78px;height:52px;border-radius:40px 40px 8px 8px;
  background:linear-gradient(180deg,#3f4a52,#232b31);box-shadow:0 0 60px rgba(255,225,170,.22),0 6px 14px #0007}
.o-xicara{right:9%;top:14%;width:36px;height:32px;border-radius:5px 5px 16px 16px;
  background:linear-gradient(180deg,#efe6d4,#cdbfa4)}
.o-caneta{left:12%;bottom:14%;width:96px;height:8px;border-radius:4px;transform:rotate(-8deg);
  background:linear-gradient(90deg,#1d232a,#39434c 70%,#c8a45a)}
.o-clipes{right:14%;bottom:20%;width:26px;height:26px;border-radius:50%;
  border:3px solid #b9bcc2;background:transparent;box-shadow:0 4px 9px #0007}
.o-bloco{left:44%;bottom:8%;width:84px;height:60px;transform:rotate(3deg);
  background:linear-gradient(180deg,#f4edda,#ded3b8)}

@keyframes pousa{0%{transform:translateY(-38px) rotate(-5deg);opacity:0}100%{transform:none;opacity:1}}
.pasta-caso{position:relative;z-index:2;display:flex;flex-direction:column;gap:5px;align-items:flex-start;
  width:min(390px,86%);padding:26px 28px 22px;border:0;border-radius:4px 12px 4px 4px;text-align:left;
  font:inherit;color:#3c2a0e;cursor:pointer;animation:pousa .5s cubic-bezier(.2,.9,.3,1) both;
  background:linear-gradient(180deg,#dcaf68,#c08c42);
  box-shadow:0 3px 0 rgba(0,0,0,.25),0 26px 50px rgba(0,0,0,.55)}
.pasta-caso::before{content:"";position:absolute;top:-11px;right:24px;width:96px;height:12px;
  border-radius:5px 5px 0 0;background:linear-gradient(180deg,#e6bd76,#d0a259)}
.pasta-caso:hover{transform:translateY(-4px)}
.pasta-caso .etiqueta{font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  background:#3c2a0e;color:#f0d8a4;padding:3px 10px;border-radius:3px}
.pasta-caso .cliente{font-family:Georgia,serif;font-size:29px;line-height:1.1}
.pasta-caso .contra{font-size:14px;opacity:.75}
.pasta-caso .abrir{margin-top:10px;display:flex;align-items:center;gap:8px;font-size:14px;
  border-top:1px dashed rgba(60,42,14,.4);padding-top:10px;width:100%}

/* §49 — fatos em destaque no centro */
.destaque-fatos{position:relative;z-index:2;width:min(620px,92%);padding:34px 38px;border-radius:3px;
  color:#2e2a25;background:linear-gradient(180deg,#f8f3e7,#eee6d5);transform:rotate(-.3deg);
  box-shadow:0 30px 66px #000b;animation:pousa .45s ease both}
.destaque-fatos h3{margin:0 0 16px;font-family:Georgia,serif;font-size:25px;text-align:center;
  letter-spacing:.06em}
.destaque-fatos p{margin:0 0 11px;font-size:17px;line-height:1.5;padding-left:18px;position:relative}
.destaque-fatos p::before{content:"";position:absolute;left:0;top:10px;width:7px;height:7px;
  border-radius:50%;background:#a9792d}
.destaque-fatos .btn{margin-top:18px;width:100%;justify-content:center}

/* fatos prontos na área fixa */
.area.derivada{background:rgba(28,14,4,.34)}
.fatos-prontos p{margin:0 0 7px;font-size:13px;line-height:1.35;color:#efe3cb;padding-left:13px;position:relative}
.fatos-prontos p::before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:50%;background:#c8a45a}
.fatos-prontos .nota{display:block;margin-top:9px;font-size:11px;color:#a9997a;font-style:italic}

/* contradições descobertas */
.contradicao{display:flex;flex-direction:column;gap:3px;width:100%;padding:11px 13px;border-radius:9px;
  border:1px solid #7a5c25;background:rgba(122,92,37,.16);color:#f0d9a8;position:relative}
.contradicao .tit{font-size:14px;line-height:1.25;font-weight:600}
.contradicao .det{font-size:12px;color:#c9b48a;line-height:1.3}
.contradicao .ico{position:absolute;right:10px;top:10px;opacity:.5}

/* papel recém-chegado do mundo */
@keyframes chega{0%{transform:translateY(-16px) rotate(var(--gira)) scale(.96);opacity:0}
  100%{transform:rotate(var(--gira));opacity:1}}
.doc.recem{animation:chega .4s ease both;box-shadow:0 1px 0 rgba(0,0,0,.22),0 7px 15px rgba(0,0,0,.45),0 0 0 2px #6ecb78}

/* §51 — classificar de dentro da folha ampliada */
.classificar{margin-top:20px;padding-top:16px;border-top:1px dashed #c6b99f;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.classificar .rot{width:100%;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#7a6c56;margin-bottom:2px}
.destino{display:flex;align-items:center;gap:7px;padding:8px 13px;border-radius:7px;font:inherit;font-size:14px;
  border:1px solid #c2b192;background:#f2ebda;color:#3c352a;cursor:pointer}
.destino:hover:not(:disabled){border-color:#a9792d;background:#e8dcbd}
.destino:disabled{opacity:.35;cursor:not-allowed}
.destino.aqui{border-color:#2f5c37;background:#e2efdc}
.destino .tecla{font-style:normal;font-size:11px;min-width:17px;height:17px;display:flex;align-items:center;
  justify-content:center;border-radius:3px;background:#3c352a;color:#f2ebda}

/* ------------------------------------------------------- §54 lacunas */
.lacunas{margin-bottom:16px}
.lacunas .rot{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.lacuna{display:flex;align-items:center;gap:13px;padding:14px 17px;border-radius:11px;margin-bottom:8px;
  border:1px solid #7a5c25;background:linear-gradient(180deg,#221a10,#181109);color:#f0d9a8}
.lacuna.feita{border-color:#2f5c37;background:linear-gradient(180deg,#122016,#0e1811);color:#9fe0a7}
.lacuna .o-que{display:flex;flex-direction:column;gap:2px}
.lacuna .o-que b{font-family:Georgia,serif;font-size:18px}
.lacuna .o-que i{font-style:normal;font-size:13px;color:var(--muted)}
.lacuna .btn{margin-left:auto;flex:none}
.lacunas.na-mesa{margin-bottom:18px}

/* --------------------------------------------------------- §56 mapa */
.mapa{position:relative;height:min(60vh,470px);border-radius:14px;border:1px solid #24303a;overflow:hidden;
  background:
    repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 34px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 1px,transparent 1px 34px),
    radial-gradient(120% 100% at 40% 0%,#1b2630 0,#131a21 55%,#0d1217 100%)}
.ruas{position:absolute;inset:0;width:100%;height:100%}
.ruas line{stroke:#2c3a46;stroke-width:1.6;stroke-linecap:round}
.bussola{position:absolute;left:16px;bottom:14px;font-size:12px;color:#6f7d89;font-style:italic}
.pino{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:10px;
  padding:9px 14px 9px 9px;border-radius:999px;border:1px solid #3b4c59;background:#131b22;
  color:#d7ccba;font:inherit;cursor:pointer;white-space:nowrap;
  box-shadow:0 8px 18px rgba(0,0,0,.5)}
.pino:hover{border-color:#b88636;background:#1c1710;transform:translate(-50%,-50%) scale(1.04);z-index:4}
.pino .marcador{display:flex;align-items:center;justify-content:center;width:32px;height:32px;flex:none;
  border-radius:50%;background:#0e141a;border:1px solid #3b4c59;color:#8fa2b0}
.pino:hover .marcador{color:var(--gold2);border-color:#8a642b}
.pino .etq{display:flex;flex-direction:column;gap:1px;text-align:left}
.pino .etq b{font-size:14px}
.pino .etq i{font-style:normal;font-size:11px;color:#7d8b97}
.pino.p-base{border-color:#8a642b;background:#1c1710}
.pino.p-base .marcador{color:var(--gold2);border-color:#8a642b}
.pino.p-fechado{opacity:.62}
.pino.p-fechado .marcador{color:#8a6f6c;border-color:#5a4340}
.pino.visitado .marcador{color:#78d584;border-color:#2f5c37}

/* --------------------------------------------------- microárea jogável */
.micro{border-radius:14px;overflow:hidden;border:1px solid #24303a;background:#0d1217}
.piso{position:relative;height:min(58vh,450px);
  background:
    repeating-linear-gradient(90deg,rgba(0,0,0,.14) 0 2px,transparent 2px 30px),
    linear-gradient(180deg,#5b4a38 0 22%,#4a3c2e 22%,#3a2f24 68%,#2b231a 100%)}
.piso::after{content:"";position:absolute;left:0;right:0;top:22%;height:3px;
  background:linear-gradient(180deg,rgba(0,0,0,.45),transparent)}
.movel{position:absolute;transform:translate(-50%,-50%);border-radius:5px;box-shadow:0 8px 16px rgba(0,0,0,.45)}
.m-sofa{background:linear-gradient(180deg,#5d4a63,#43354a);border-radius:9px 9px 5px 5px}
.m-mesa{background:linear-gradient(180deg,#8a6a41,#6b5132);border-radius:4px}
.m-caixa{background:linear-gradient(180deg,#b58b52,#8e6a3c);border-radius:2px}
.m-quadro{background:linear-gradient(180deg,#2f3a44,#1e262d);border:2px solid #6b5132}
.m-tapete{background:radial-gradient(circle,#6b4a52,#4a333a);border-radius:50%;opacity:.7;box-shadow:none}
.m-parede{background:linear-gradient(180deg,#6a5540,#5b4a38);box-shadow:none;border-radius:0}
.m-estante{background:repeating-linear-gradient(180deg,#7a5c3a 0 6px,#5e4529 6px 9px);border-radius:2px}
.m-balcao{background:linear-gradient(180deg,#7d5a34,#5c4126);border-radius:6px}
.m-janela{background:linear-gradient(180deg,#8fb2c4,#5f8298);border:2px solid #4a3c2e;opacity:.55}
.eu,.npc{position:absolute;transform:translate(-50%,-100%);width:34px;display:flex;flex-direction:column;
  align-items:center;transition:left .45s cubic-bezier(.3,.8,.4,1),top .45s cubic-bezier(.3,.8,.4,1);z-index:3}
.eu .cabeca,.npc .cabeca{width:19px;height:19px;border-radius:50%;display:block;
  box-shadow:inset -3px -3px 0 rgba(0,0,0,.14)}
.eu .corpo,.npc .corpo{width:26px;height:34px;border-radius:9px 9px 5px 5px;display:block;margin-top:-3px;
  box-shadow:inset -4px 0 0 rgba(0,0,0,.16)}
.eu .cabeca{background:#e8d4b0}.eu .corpo{background:#2f4a63}
.npc .cabeca{background:#d8bb9a}.npc .corpo{background:#6b4a52}
.eu::after,.npc::after{content:"";position:absolute;bottom:-6px;width:30px;height:9px;border-radius:50%;
  background:rgba(0,0,0,.42);filter:blur(1px)}
.npc .nome{position:absolute;top:-22px;font-size:11px;color:#e8d4b0;white-space:nowrap;
  background:rgba(0,0,0,.5);padding:2px 7px;border-radius:999px}
.ponto{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:7px;
  padding:7px 12px;border-radius:999px;border:1px solid #7a5c25;background:rgba(28,20,10,.85);
  color:#f0d9a8;font:inherit;font-size:13px;cursor:pointer;white-space:nowrap;z-index:4}
.ponto:hover{border-color:#e3bd72;background:rgba(48,34,14,.95);transform:translate(-50%,-50%) scale(1.05)}
.ponto .halo{width:9px;height:9px;border-radius:50%;background:#e3bd72;flex:none;
  box-shadow:0 0 0 4px rgba(227,189,114,.18)}
.ponto.feito{opacity:.5}
.ponto.feito .halo{background:#78d584;box-shadow:none}
.ponto.pt-objeto{border-style:dashed}
.micro-rodape{display:flex;align-items:center;gap:14px;padding:12px 16px;background:#0f151b;border-top:1px solid #24303a}
.micro-rodape .onde{font-size:13px;color:var(--muted)}
.micro-rodape .btn{margin-left:auto}

/* o que o mundo entregou */
.achado{margin-top:16px;padding:16px 18px;border-radius:12px;border:1px solid #2f5c37;background:#101a13}
.achado .rot{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:#9fe0a7;margin-bottom:11px}
.achado-doc{position:relative;display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:2px;
  color:#2e2a25;margin-bottom:9px;box-shadow:0 6px 14px rgba(0,0,0,.45);transform:rotate(-.6deg)}
.achado-doc .tit{font-size:15px;font-weight:600}
.achado-doc .res{font-size:12px;opacity:.72}
.achado .para-mesa{display:block;font-size:12px;color:var(--muted);font-style:italic}
.f-print{background:linear-gradient(180deg,#dfe7ee,#c3cfd9);color:#20272e}
.f-print::before{content:"";position:absolute;left:9px;right:9px;top:7px;height:3px;border-radius:2px;background:rgba(0,0,0,.18)}

@media(max-width:900px){
  .mapa{height:66vh}.pino .etq{display:none}.pino{padding:9px}
  .piso{height:52vh}.ponto{font-size:11px;padding:5px 9px}
}

/* ============================================================ CICLO 6
   Processo vivo na Mesa: maleta da audiência, ponto perdido e recurso.
   Tudo em placeholder: quando o Work entregar arte, o slot ganha
   `background-image` e a classe `.com-asset` desliga o desenho CSS. */
.doc.levando{outline:2px solid #7fb0e0;outline-offset:2px}
.selinho.maleta{background:#2f4a63;right:auto;left:6px}
.doc.com-asset{background-size:cover;background-position:center}
.doc.com-asset .marca-forma{display:none}
.movel.com-asset,.pino.com-asset,.piso[style*="background-image"],
.mesa-madeira[style*="background-image"],.mapa[style*="background-image"]{
  background-size:cover;background-position:center}

.a-maleta .instr{margin:2px 0 8px;font-size:12px;color:var(--muted)}
.tampo.maleta{display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;min-height:64px}
.levado{display:flex;align-items:center;gap:8px;padding:7px 11px;border-radius:9px;
  border:1px solid #4a3a22;background:rgba(40,30,16,.82);color:#f0e2c8;
  font-size:12.5px;cursor:pointer}
.levado:hover{border-color:#e3bd72}
.levado.fixo{cursor:default;opacity:.85}
.levado .tira{opacity:.55}
.rodape-maleta{display:flex;align-items:center;gap:12px;margin-top:10px;flex-wrap:wrap}
.falta-inline{font-size:12.5px;color:#e0b48f}
.p-maleta{position:relative;z-index:3;display:flex;align-items:center;gap:10px;
  margin:0 0 14px;padding-bottom:12px;border-bottom:1px dashed #d5c9ae;flex-wrap:wrap}
.p-maleta .nao-da{font-size:12px;color:#8a7a63}
.razoes-doc{margin-top:12px;border-top:1px dashed #cfc4ad;padding-top:10px}
.razoes-doc .rot{display:block;font-size:11px;letter-spacing:.09em;text-transform:uppercase;
  color:#7c705c;margin-bottom:6px}
.razoes-doc .linha{display:flex;align-items:center;gap:7px;font-size:12.5px;
  color:#3b3327;padding:3px 0}
.razoes-doc .linha.nao{color:#8a5b52}

.perdido{border:1px solid #5d3f36;border-radius:12px;background:rgba(46,26,22,.6);
  padding:12px 15px;margin-bottom:12px}
.perdido.bom{border-color:#2f5e3c;background:rgba(20,40,26,.55);display:flex;
  align-items:center;gap:10px;color:#bfe3c6}
.perdido .rot{display:block;font-size:11px;letter-spacing:.09em;text-transform:uppercase;
  color:#d9a08f;margin-bottom:7px}
.perdido .item{display:flex;align-items:center;gap:9px;padding:4px 0;flex-wrap:wrap}
.perdido .item .q{color:#f0d9cf;font-size:13.5px}
.perdido .item .a{color:#a08f84;font-size:12.5px}

.recurso{border:1px solid #4a3a22;border-radius:12px;background:rgba(26,21,13,.7);
  padding:14px 16px;margin-top:14px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.recurso .rot{color:#e3bd72;font-size:13.5px}
.recurso .risco{color:#d9a08f;font-size:12.5px;margin:0}
.recurso.bom{border-color:#2f5e3c;background:rgba(20,40,26,.55)}
.recurso.ruim{border-color:#5d3f36;background:rgba(46,26,22,.55)}
.recurso.nao-cabe{color:#bfe3c6;font-size:13px}
.recurso b{color:#f5e7cc;font-size:15px}
.recurso span{color:#c9bda8;font-size:13px}
.carimbo.recursal{position:static;transform:rotate(-4deg);font-size:12px}
.trocas.acordao{margin-top:14px;border-top:1px dashed #3a3020;padding-top:12px}
