/* O que cada conta pode usar num campo: os modos no topo (revisão, livro, estratégia, GPS), as páginas do livro com a
   proteção contra cópias, o simulador da app de revisão dentro do portal, e o ecrã do GPS para o telemóvel. */

.espera{margin:0 0 34px;padding:20px 24px;border-radius:14px;background:var(--white);border:1px solid var(--line);border-left:4px solid var(--brass);max-width:760px}
.espera[hidden]{display:none}
.espera h2{font:400 22px/1.25 var(--serif);color:var(--pine);margin:0 0 6px;letter-spacing:0}
.espera p{margin:0;color:var(--ink);font-size:15px;line-height:1.55}
.cc-poderes{margin:6px 0 0;font-size:12.5px;font-weight:600;color:var(--pine)}

.modos{display:flex;gap:2px;margin-left:28px;padding:3px;background:#F1EEE4;border:1px solid var(--line);border-radius:999px;flex:none}
.modos[hidden]{display:none}
.modos a{padding:7px 16px;border-radius:999px;font:600 14px var(--sans);color:var(--muted);text-decoration:none;white-space:nowrap}
.modos a:hover{color:var(--pine)}
.modos a[aria-current=true]{background:var(--pine);color:var(--ivory)}

.trabalho.so-folha{grid-template-columns:78px minmax(0,1fr);grid-template-areas:"tb tb" "rail folha"}
.area-folha{grid-area:folha;min-height:0;overflow:auto;background:#ECE9E0}
.area-folha .a-carregar{color:var(--muted);padding:40px;text-align:center}

/* o livro: as duas páginas do buraco lado a lado, como no guia; desfocadas sem o foco da janela, e nunca impressas */
.paginas{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:22px;padding:22px;align-content:start}
.pagina{position:relative;margin:0;background:#fff;border-radius:10px;padding:14px 14px 10px;box-shadow:0 1px 2px rgba(23,61,50,.06),0 8px 24px rgba(23,61,50,.08);
  overflow:hidden;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.pagina figcaption{font:600 13px var(--sans);color:var(--muted);margin:0 0 8px}
.pag-svg svg{display:block;width:100%;height:auto;max-height:calc(100dvh - 200px)}
.paginas.tapado .pag-svg{filter:blur(24px);opacity:.35;transition:none}
.paginas .pag-svg{transition:filter .2s}
@media print{.paginas{display:none!important}}

.livro-tees{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:14px;color:var(--ink)}
.livro-tees .rot{font-weight:600;color:var(--muted)}
.livro-tees .tee{display:inline-flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums}
.livro-tees i{width:11px;height:11px;border-radius:50%;border:1px solid rgba(0,0,0,.3)}
.livro-nav{grid-column:1 / -1;display:flex;justify-content:space-between;gap:10px}
.livro-nav .btn[disabled]{visibility:hidden}
.gps > .a-carregar{margin-top:30vh}
.gps > .g-pronto{display:block;margin:20px auto 12px;width:min(320px,calc(100% - 40px))}
.g-voltar-txt{display:block;text-align:center;color:var(--ivory);font-size:15px}

/* a estratégia: o simulador da app de revisão, com as suas cores e letras */
.estr{--paper:#f3f1ea;--card:#fbfaf6;--ink:#17201b;--muted:#5f6a62;--line:#d9d6cb;--course:#173D32;--course-soft:#dfe8e1;--sand:#d8c39a;
  --onbar:#f3f1ea;--ok:#2f7a45;--bad:#b3362b;--todo:#b98a1d;--ask:#2c5677;--display:"Barlow Condensed","Arial Narrow",sans-serif;--body:var(--sans);
  display:flex;flex-direction:column;gap:10px;padding:16px 20px 20px;font:14px/1.45 var(--sans);color:var(--ink)}
.estr-abas{display:flex;gap:6px;flex:none}
.estr-abas button{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:7px 16px;font:600 14px var(--sans);cursor:pointer}
.estr-abas button[aria-selected=true]{background:var(--course);border-color:var(--course);color:var(--paper)}
.estr .pane{flex:1;min-height:560px;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.estr .pane .body{flex:1;position:relative;min-height:0;background:#fff}
.estr .empty{padding:40px 16px;text-align:center;color:var(--muted)}
.estr label{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:inherit}
.estr select,.estr input{width:auto}
.estr input[type=checkbox]{accent-color:var(--course)}

/* no telemóvel: o nome do campo em cima, os modos numa linha, os buracos numa fila que corre, uma página de cada vez */
@media (max-width:900px){
  .trabalho{grid-template-columns:minmax(0,1fr)}
  .trabalho.so-folha{height:auto;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;grid-template-areas:"tb" "rail" "folha"}
  .area-folha{overflow:visible}
  .tb{flex-wrap:wrap;gap:10px 12px;padding:10px 14px}
  .tb-nome{flex:1;min-width:0}
  .tb-nome h1{font-size:20px}
  .modos{order:3;margin:0;width:100%;overflow-x:auto}
  .modos a{flex:1;text-align:center;padding:8px 10px}
  .cartao-b{flex:0 1 auto;min-width:0}
  .paginas{grid-template-columns:minmax(0,1fr);padding:12px;gap:12px}
  .pag-svg svg{max-height:none}
  .estr{padding:12px}
  .estr .pane{min-height:75vh}
  body.modo-campo .top{display:none}   /* o topo do site não cabe: o botão de voltar leva à lista */
  .trabalho{grid-template-rows:auto auto 72dvh auto}
  .topo-palco{top:8px;left:58px;right:58px;transform:none;max-width:none;flex-direction:column;align-items:center;gap:6px}
  .cartao-b{padding:4px 12px 4px 4px;gap:8px}
  .cartao-b .num{width:34px;height:34px;font-size:18px}
  .vistas button{padding:6px 9px;font-size:11.5px}
  .ferr,.zoom{top:8px;padding:3px}
  .ferr{left:8px}
  .zoom{right:8px}
  .ferr-b,.zoom .ferr-b{width:40px;padding:7px 0}
  .menu-desenhar{left:56px;top:8px}
  .dica{display:none}
  .dica[data-fixa="1"]{display:block;bottom:52px;max-width:calc(100% - 24px)}
  .camadas{left:8px;right:8px;bottom:8px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .camadas button{flex:none;padding:6px 10px}
  .tres-ctl{left:8px;right:8px;bottom:8px;transform:none;overflow-x:auto;scrollbar-width:none}
  .tres-ctl button{flex:none;white-space:nowrap;padding:8px 10px}
  .tres-ctl .relevo{flex:none}
}

/* o GPS: a fotografia do buraco a encher o ecrã do telemóvel; o buraco numa barra em cima, as distâncias ao green num
   painel à direita (o fundo em cima, a bandeira, a frente em baixo) e o sinal e a bandeira em baixo */
body.modo-gps{overflow:hidden;background:#0b1a14}
body.modo-gps .top{display:none}
body.modo-gps main.wrap{max-width:none;padding:0}
.gps{--vidro:rgba(10,24,18,.72);--ouro:#F2D28C;position:relative;height:100vh;height:100dvh;overflow:hidden;background:#0b1a14;color:#fff;font-family:var(--sans);
  -webkit-tap-highlight-color:transparent}
.gps .a-carregar{padding:40px;text-align:center;color:var(--ivory)}
.gps button{font-family:var(--sans)}
.g-mapa{position:absolute;inset:0}
.g-mapa svg{width:100%;height:100%;display:block;touch-action:none}
.g-mapa::after{content:"";position:absolute;inset:0;pointer-events:none;   /* sombra em cima e em baixo, para os botões se lerem sobre a fotografia */
  background:linear-gradient(rgba(0,0,0,.35),transparent 110px,transparent calc(100% - 150px),rgba(0,0,0,.4))}
.g-mapa .z-fundo{opacity:.9}
.g-mapa .z-orla{fill:none;stroke:rgba(196,240,170,.28);stroke-linejoin:round}
.g-mapa .z-green{fill:rgba(190,240,160,.16);stroke:#fff;stroke-opacity:.95;stroke-linejoin:round}
.g-mapa .z-bunker{fill:rgba(250,236,196,.28);stroke:rgba(250,236,196,.75);stroke-linejoin:round}
.g-mapa .z-agua{fill:rgba(80,165,230,.28);stroke:rgba(150,210,255,.8);stroke-linejoin:round}
.g-mapa .z-green.pintado{fill:none}
.g-mapa .z-setas{fill:none;stroke:rgba(16,28,20,.85);stroke-linecap:round;stroke-linejoin:round}
.g-mapa .z-sombra-tee{fill:rgba(0,0,0,.35)}
.g-mapa .z-mira-fundo{fill:none;stroke:rgba(0,0,0,.35);stroke-linecap:round;stroke-linejoin:round}
.g-mapa .z-mira{fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round}
.g-mapa .z-alvo circle,.g-mapa .z-alvo path{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round}
.g-mapa .z-alvo .z-alvo-fundo{fill:rgba(255,255,255,.14);stroke:rgba(0,0,0,.35);stroke-width:5}
.g-mapa .z-alvo .z-alvo-meio{fill:#fff;stroke:none}
.g-mapa .z-acc{fill:rgba(66,133,244,.16);stroke:rgba(255,255,255,.45);stroke-width:.4}
.g-mapa .z-eu{fill:#4285F4;stroke:#fff}
.g-mapa .z-pulso{fill:rgba(66,133,244,.45);transform-box:fill-box;transform-origin:center;animation:g-pulso 2.2s ease-out infinite}
@keyframes g-pulso{from{transform:scale(1);opacity:.9}to{transform:scale(3.2);opacity:0}}
@media (prefers-reduced-motion:reduce){.g-mapa .z-pulso{animation:none;opacity:0}}
.g-mapa .z-sombra{fill:rgba(0,0,0,.35)}
.g-mapa .z-pau{stroke:#fff;stroke-width:2;stroke-linecap:round}
.g-mapa .z-pau-fundo{stroke:rgba(0,0,0,.45);stroke-width:4;stroke-linecap:round}
.g-mapa .z-halo{fill:rgba(255,255,255,.18);stroke:#fff;stroke-width:1.5;stroke-dasharray:3 3}
.g-mapa .z-pano{fill:#E5452F;stroke:#fff;stroke-width:1.2;stroke-linejoin:round}
.g-mapa .z-buraco{fill:#fff;stroke:#0b1a14;stroke-width:1.2}
.g-mapa .z-contorno{fill:none;stroke-linejoin:round}
.g-mapa .z-contorno.z-bunker{stroke:#F2DFA6}
.g-mapa .z-contorno.z-agua{stroke:#8FD0FF}
.g-mapa .pill rect{fill:rgba(10,24,18,.8)}
.g-mapa .pill text{fill:#fff;font-weight:700;text-anchor:middle;font-family:Manrope,Arial,sans-serif;font-variant-numeric:tabular-nums}
.g-mapa .pill.forte rect{fill:#fff}
.g-mapa .pill.forte text{fill:#0b1a14}
.g-mapa .c-bunker{fill:#F2DFA6}
.g-mapa .c-agua{fill:#5FB0EE}

.g-topo{position:absolute;left:10px;right:10px;top:calc(env(safe-area-inset-top,0px) + 10px);display:flex;align-items:center;gap:4px;padding:5px;border-radius:999px;
  background:var(--vidro);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 6px 20px rgba(0,0,0,.25)}
.g-icone{display:grid;place-items:center;width:42px;height:42px;flex:none;border-radius:50%;border:0;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;padding:0}
.g-icone svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.g-icone:disabled{opacity:.25}
.g-icone:first-child{background:none}
.g-titulo{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:2px 6px;border:0;border-radius:999px;background:none;color:#fff;cursor:pointer;text-align:left}
.g-badge{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:50%;background:var(--ouro);color:#0b1a14;font:800 19px/1 var(--sans)}
.g-info{display:grid;min-width:0;line-height:1.2}
.g-info b{font-size:15px;font-weight:700;white-space:nowrap}
.g-info span{font-size:12px;opacity:.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.g-painel{position:absolute;right:10px;top:calc(env(safe-area-inset-top,0px) + 74px);width:96px;display:grid;padding:6px 0;border-radius:20px;
  background:var(--vidro);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 8px 24px rgba(0,0,0,.28);text-align:center}
.g-d{display:grid;gap:1px;padding:9px 6px}
.g-d+.g-d{border-top:1px solid rgba(255,255,255,.1)}
.g-d span{font-size:11.5px;font-weight:600;opacity:.65}
.g-d b{font:800 26px/1 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.g-d.g-b{padding:12px 6px;background:rgba(242,210,140,.1)}
.g-d.g-b span{color:var(--ouro);opacity:1}
.g-d.g-b b{font-size:44px;color:var(--ouro)}
.g-joga{font-size:11.5px;font-weight:700;color:#fff;opacity:.85;margin-top:3px}
.g-joga[hidden]{display:none}
.g-legenda{margin:0;padding:8px 8px 4px;border-top:1px solid rgba(255,255,255,.1);font-size:10.5px;line-height:1.3;opacity:.75;display:grid;justify-items:center;gap:5px}
.g-legenda[hidden]{display:none}
.g-legenda i{width:24px;height:10px;border-radius:999px;background:rgba(10,24,18,.9);box-shadow:inset 0 0 0 1.5px #F2DFA6}

.g-barra{position:absolute;left:10px;right:10px;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);display:flex;align-items:center;gap:10px}
.g-estado{flex:1;min-width:0;display:flex;align-items:center;gap:8px;padding:11px 14px;border:0;border-radius:999px;background:var(--vidro);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#fff;font-size:12.5px;line-height:1.3;text-align:left;cursor:default}
.g-estado span{display:grid;min-width:0}
.g-estado b,.g-estado small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.g-estado b{font-weight:700}
.g-estado small{font-size:12px;opacity:.75}
.g-estado small::first-letter{text-transform:uppercase}
.g-estado i{width:9px;height:9px;flex:none;border-radius:50%;background:#E8A23A;box-shadow:0 0 0 3px rgba(232,162,58,.25)}
.g-estado.ok i{background:#5CD08A;box-shadow:0 0 0 3px rgba(92,208,138,.25)}
.g-estado.escolher{cursor:pointer}
.g-ver{position:absolute;right:10px;bottom:calc(env(safe-area-inset-bottom,0px) + 76px);width:50px;height:50px;box-shadow:0 6px 18px rgba(0,0,0,.28);background:var(--vidro);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.g-ver[aria-pressed=true]{background:#fff;color:#0b1a14}
.g-incl{position:absolute;left:10px;bottom:calc(env(safe-area-inset-bottom,0px) + 80px);display:flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;
  background:var(--vidro);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#fff;font-size:11.5px;font-weight:600}
.g-incl[hidden]{display:none}
.g-incl span{display:flex;align-items:center;gap:3px}
.g-incl i{width:10px;height:10px;border-radius:3px}
.g-pin{display:flex;align-items:center;gap:7px;flex:none;border:0;border-radius:999px;padding:13px 18px 13px 14px;background:var(--ouro);color:#0b1a14;font:700 15px var(--sans);cursor:pointer;
  box-shadow:0 8px 20px rgba(0,0,0,.3)}
.g-pin[hidden]{display:none}
.g-pin svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.g-recentrar{position:absolute;left:12px;top:calc(env(safe-area-inset-top,0px) + 76px);z-index:2;border:0;border-radius:999px;padding:9px 14px;
  background:var(--vidro);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#fff;font:600 13px var(--sans);cursor:pointer}
.g-recentrar[hidden]{display:none}
@media (min-width:700px){.g-topo{left:50%;right:auto;width:440px;transform:translateX(-50%)}.g-barra{left:50%;right:auto;width:440px;transform:translateX(-50%)}}

/* a folha por cima do mapa com a lista dos buracos, e o cartão para pôr a bandeira */
.g-folha{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;gap:12px;padding:calc(env(safe-area-inset-top,0px) + 16px) 16px calc(env(safe-area-inset-bottom,0px) + 16px);
  background:#0e221b;overflow:auto}
.g-folha[hidden]{display:none}
.g-folha-titulo{margin:0;font:700 20px var(--sans);text-align:center}
.g-grelha{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}
.g-grelha button{display:grid;gap:2px;padding:12px 0;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:none;color:#fff;cursor:pointer}
.g-grelha button b{font:700 22px/1 var(--sans)}
.g-grelha button span{font-size:12px;opacity:.7}
.g-grelha button[aria-current=true]{background:#F4D58D;border-color:#F4D58D;color:#0b1a14}
.g-sub{margin:6px 0 0;font-size:13px;opacity:.7;text-align:center}
.g-guardado{margin-top:14px;opacity:.85}
.g-tees{display:grid;gap:8px}
.g-tees button{display:flex;align-items:center;gap:12px;padding:13px 16px;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:none;color:#fff;font:600 16px var(--sans);cursor:pointer;text-align:left}
.g-tees button i{width:14px;height:14px;flex:none;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.6)}
.g-tees button span{flex:1}
.g-tees button span::first-letter{text-transform:uppercase}
.g-tees button b{font-weight:700;font-variant-numeric:tabular-nums;opacity:.8}
.g-tees button[aria-pressed=true]{background:#fff;border-color:#fff;color:#0b1a14}
.g-fechar,.g-pronto{margin-top:auto;border:0;border-radius:14px;padding:15px;background:#F4D58D;color:#0b1a14;font:700 16px var(--sans);cursor:pointer}
.g-cartao{position:absolute;left:0;right:0;bottom:0;z-index:5;display:grid;gap:10px;padding:14px 14px calc(env(safe-area-inset-bottom,0px) + 14px);
  background:rgba(14,34,27,.96);border-radius:22px 22px 0 0;box-shadow:0 -10px 30px rgba(0,0,0,.35);color:#fff}
.g-cartao[hidden]{display:none}
.g-cartao-titulo{margin:0;text-align:center;font:700 15px var(--sans)}
.g-dica{margin:-6px 0 2px;text-align:center;font-size:12.5px;opacity:.7}
@media (min-width:700px){.g-cartao{left:50%;right:auto;width:440px;transform:translateX(-50%)}}
.a-por .g-painel,.a-por .g-barra,.a-por .g-ver,.a-por .g-incl,.a-por .g-recentrar{display:none}
.g-ler{margin:0;text-align:center;font:700 20px var(--sans);color:#F4D58D}
.g-zonas{display:flex;gap:8px}
.g-zonas button{flex:1;border:1px solid rgba(255,255,255,.25);border-radius:12px;padding:10px 4px;background:none;color:#fff;font:600 15px var(--sans);cursor:pointer}
.g-zonas button[aria-pressed=true]{background:#fff;border-color:#fff;color:#0b1a14}
.g-todos{display:flex;align-items:center;gap:10px;font-size:14px;color:#fff;opacity:.9}
.g-todos input{width:20px;height:20px;accent-color:#F4D58D}
.g-pronto{margin-top:4px}