/* Pique · computador (≥1100px): tela inteira em 3 colunas
   esquerda: conversas e curtidas · centro: filtros + cartão · direita: perfil e configurações */
.pane[hidden]{display:none!important}
body.wide{display:block;padding:0;background:var(--bg)}
body.wide .phone{display:grid;width:100vw;max-width:none;height:100vh;height:100dvh;border-radius:0;box-shadow:none;
  grid-template-columns:minmax(320px,360px) minmax(0,1fr) minmax(360px,420px);grid-template-rows:auto minmax(0,1fr)}
body.wide .tabs{display:none}

/* colunas laterais */
.pane{display:flex;flex-direction:column;min-height:0;background:var(--surface)}
.pane.pl{grid-column:1;grid-row:1/3;border-right:1px solid var(--line)}
.pane.pr{grid-column:3;grid-row:1/3;border-left:1px solid var(--line)}
.phead{display:flex;align-items:center;gap:10px;min-height:62px;padding:14px 20px 8px}
.phead b{font-size:18px}
.pbody{flex:1;min-height:0;overflow-y:auto;padding:4px 20px 24px}
.pane.pr .pbody{background:var(--bg)}
.ltabs{display:grid;grid-template-columns:1fr 1fr;margin:0 20px;border-bottom:1px solid var(--line)}
.ltabs button{position:relative;padding:10px 0 12px;border:0;background:none;font-weight:700;font-size:14.5px;color:var(--muted)}
.ltabs button[aria-selected="true"]{color:var(--ink)}
.ltabs button[aria-selected="true"]::after{content:"";position:absolute;left:20%;right:20%;bottom:-1px;height:3px;border-radius:3px;background:var(--accent)}
.ltabs .badge{position:static;display:inline-grid;place-items:center;margin-left:6px;vertical-align:1px}
.lseg{margin:12px 20px 4px;align-self:flex-start}
.pane .grid2{grid-template-columns:1fr 1fr}
.pane .mini .ph{height:150px}
.pane .cards .tcards{gap:6px}

/* centro */
body.wide .top{grid-column:2;grid-row:1;flex-direction:column;align-items:stretch;gap:12px;padding:16px 32px 6px}
.wtop{display:flex;align-items:center;gap:14px}
.wtitle{font-size:22px}
.wfilters{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:flex-end;padding:12px 16px;border-radius:16px;
  background:var(--surface);box-shadow:var(--sh1)}
.wf{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:12px;font-weight:600;color:var(--muted)}
.wf:nth-child(2){flex:1 1 140px;min-width:140px}
.wf:nth-child(2) .range{margin:6px 0 8px}
.wf output{color:var(--ink)}
.wf .input{padding:8px 10px;font-size:14px;border-radius:10px}
.wf select.input{min-width:150px}
.wseg{display:flex;background:var(--surface2);border-radius:999px;padding:3px}
.wseg button{padding:6px 12px;border:0;border-radius:999px;background:none;font-weight:600;font-size:13px;color:var(--muted);white-space:nowrap}
.wseg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:var(--sh1)}
.wage{display:flex;align-items:center;gap:6px}
.wage .input{width:64px}
.wage i{font-style:normal}
.wf .pill{font-size:9.5px;padding:2px 6px}

body.wide .view{grid-column:2;grid-row:2;padding:10px 32px 18px}
body.wide .view.disc .deck,body.wide .view.disc .goalbar,body.wide .view.disc .pausebar,body.wide .view.disc .frow,
body.wide .view.disc .acts,body.wide .view.disc .counter,body.wide .view.disc .coach{width:100%;max-width:560px;margin-left:auto;margin-right:auto}
body.wide .bib .pname h2{font-size:36px}
body.wide .bib .meta{font-size:15px}

/* conversa abre por cima da coluna da esquerda; janelas de baixo ficam centralizadas */
body.wide .chat{right:auto;width:clamp(320px,26vw,420px);border-right:1px solid var(--line);box-shadow:20px 0 50px rgba(0,0,0,.12)}
body.wide .sheet{left:50%;right:auto;top:50%;bottom:auto;width:min(640px,92vw);margin-left:calc(min(640px,92vw) / -2);
  max-height:86vh;border-radius:28px;padding:20px 28px 30px;opacity:0;transform:translateY(-46%) scale(.97);
  box-shadow:0 0 0 1px rgba(255,255,255,.06),0 40px 100px rgba(0,0,0,.45);
  transition:transform .38s cubic-bezier(.22,1,.36,1),opacity .25s,visibility 0s .38s}
body.wide .sheet.on{opacity:1;transform:translateY(-50%);transition:transform .38s cubic-bezier(.22,1,.36,1),opacity .25s}
body.wide .sheet .grab{display:none}
body.wide .overlay{align-items:center;text-align:center}
body.wide .overlay p{margin-left:auto;margin-right:auto}
body.wide .overlay .btn{max-width:360px}
