/* Weitere Fotos verorten (seit 1.3.0)
   Stadtseite: Kasten unter den Fotos der Woche und Galerie der unverorteten Pool-Fotos.
   Redaktion: Einstellungen und Prüfung der Vorschläge. Nutzt die Farben aus style.css. */

/* ---------- Kasten unter den Fotos der Woche ---------- */
.pool-box{margin-top:6px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg);display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.pool-box p{margin:0;font-size:14px}
.pool-box.ready{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);background:var(--accent-soft)}
.pool-box .btn:disabled{cursor:not-allowed}
.pool-box .small,.pool-head .pool-quota{font-size:13px;color:var(--muted)}
.pool-thanks{color:var(--ok);font-weight:600}

/* ---------- Galerie ---------- */
#poolView{display:flex;flex-direction:column;gap:12px}
#poolGallery{display:flex;flex-direction:column;gap:12px}
.pool-head{display:flex;flex-direction:column;gap:6px}
.pool-head .pool-quota{padding:7px 10px;border-left:3px solid var(--accent);background:var(--sunk);border-radius:0 6px 6px 0;color:var(--ink)}
.pool-fig{margin:0;display:flex;flex-direction:column;gap:6px}
.pool-fig .photo-btn{max-height:46vh;display:grid;place-items:center}
.pool-fig .photo-btn img{max-height:46vh;width:auto;max-width:100%;margin:0 auto}
.pool-pos{font:500 12px/1.3 var(--font-mono);letter-spacing:.04em;color:var(--muted);text-align:center;font-variant-numeric:tabular-nums}
.pool-nav{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:8px}
.pool-nav .btn{padding:10px 8px;font-size:13.5px;text-wrap:balance;line-height:1.2}
.pool-info{display:flex;flex-direction:column;gap:4px}
.pool-title{font:700 19px/1.2 var(--font-display);text-wrap:balance}
.pool-hint{font-size:13.5px;border:1px dashed var(--line);border-radius:8px;padding:6px 10px}
.pool-mine{font-size:14px;border-radius:8px;padding:8px 10px;background:var(--sunk)}
.pool-mine.st-offen{background:color-mix(in srgb,var(--mine) 12%,transparent)}
.pool-mine.st-uebernommen{background:color-mix(in srgb,var(--ok) 14%,transparent)}
.pool-mine.st-abgelehnt,.pool-mine.st-erledigt{opacity:.85}
.pool-form{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:10px}
.pool-form textarea{font:400 14px/1.35 var(--font-body);color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:7px 9px;width:100%;margin-top:6px}
.pool-form .pool-decade{margin-top:8px}
.pool-keys kbd,.pool-box kbd{font:600 11px/1 var(--font-mono);padding:2px 5px;border:1px solid var(--line);border-bottom-width:2px;border-radius:4px;background:var(--surface)}
.pool-empty{padding:12px;border:1px dashed var(--line);border-radius:10px}
@media (max-width:760px){
  .pool-nav{grid-template-columns:1fr 1fr}
  .pool-nav #poolLocate{grid-column:1/-1;order:-1}
  .pool-keys{display:none}
}

/* ---------- Redaktion ---------- */
#poolSetBox .two-col{align-items:end}
#poolSetBox input[type=number]{font:400 15px/1.3 var(--font-body);color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:8px 10px;width:100%}
.ps-stats{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;font-size:13px;margin:0}
.ps-stats dt{font:700 15px/1.2 var(--font-display);text-align:right;font-variant-numeric:tabular-nums}
.ps-stats dd{margin:0;color:var(--muted)}
.ps-suggestions li.uebernommen{border-color:var(--ok)}
.ps-suggestions .near{color:var(--ok);font-weight:600}
.ps-suggestions .far{color:var(--warn)}

/* ---------- Enthaltung im Rätsel: „Ich weiß es (doch) nicht“ (seit 1.4.0) ---------- */
.skip-row{display:flex;flex-direction:column;gap:6px;align-items:flex-start;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
.skip-btn{font-weight:600;color:var(--muted);background:transparent;border-style:dashed}
.skip-btn:hover{color:var(--ink);background:var(--sunk)}
.skip-state{font-size:14px;padding:8px 10px;border-radius:8px;background:var(--sunk);border-left:3px solid var(--muted)}
.card .skipped{color:var(--muted);font-weight:600}

/* ---------- Redaktion: Statistik als Tabelle, Pool-Vorschläge in der Karte ---------- */
#aStats{grid-template-columns:repeat(6,auto);row-gap:6px}
#aStats b + span{margin-right:14px}
#aStats b + span:nth-child(6n){margin-right:0}
.ppin.poolsug{border-style:dashed;border-color:var(--gold)}
.ppin.poolsug.center{box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 35%,transparent),0 2px 6px rgb(0 0 0 / .4)}
.ppin .sbadge{position:absolute;right:-9px;top:-9px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--gold);color:#fff;
  font:700 11px/18px var(--font-body);text-align:center;box-shadow:0 0 0 2px var(--surface)}
.p-ray{stroke:var(--gold);fill:none;opacity:.85;animation:ray-in .5s ease-out both}
@keyframes ray-in{from{opacity:0;stroke-width:0}to{opacity:.85}}
@media (prefers-reduced-motion: reduce){.p-ray{animation:none}}
.skip-row + .small{margin-top:8px}