/* Beanlings Booster · Brunnenwacht (Beta, 01.11.2026). Wird erst geladen, wenn der Modus geöffnet wird (js/wacht.js).
   Gleiche Handschrift wie die App: Holzrahmen, harte versetzte Schatten, keine Verläufe, kein Glow. */
.wc{padding-bottom:12px}
.wc-kopf{display:flex;align-items:center;gap:8px;margin:0 0 10px}
.wc-kopf h1{flex:1;margin:0;font-family:'Jersey 10',monospace;font-weight:400;font-size:30px;line-height:1;color:var(--text)}
.wc-beta{font-style:normal;font-family:'VT323',monospace;font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:var(--holz-d);
  background:var(--gold);padding:0 5px;border:2px solid var(--holz-d);vertical-align:middle}
.wc-zurueck{min-height:40px}
.wc-held-bild{display:block;width:100%;max-width:420px;height:auto;margin:0 auto 6px}
.wc-eintrag .w-wahl-bild{background:#2a3f31}
.wc-regel-bild{min-height:150px;display:flex;justify-content:center}
.wc-regel-img{width:100%;max-width:340px;height:auto}
/* Meilensteine */
.wc-ms-zeile{display:flex;gap:10px;align-items:center;padding:6px 0;border-top:2px solid var(--holz-d)}
.wc-ms-zeile:first-of-type{border-top:0}
.wc-ms-text{flex:1;min-width:0}
.wc-ms-text b{display:block;font-weight:400}
.wc-ms-text small{color:var(--text-m)}
.wc-ms-zeile .fort{margin:4px 0 2px}
.wc-ms-zeile.erreicht .fort i{background:var(--gruen)}
.wc-ms-silhouette{flex:0 0 auto;width:44px;height:62px;background:#1e1610;border:3px solid var(--holz-d);box-shadow:inset 0 0 0 2px #3a2a1c;
  -webkit-mask:none;position:relative}
.wc-ms-silhouette::after{content:'';position:absolute;left:10px;top:14px;width:18px;height:24px;background:#3a2a1c;border-radius:50% 50% 40% 40%}
.wc-rahmen{display:flex;gap:12px;flex-wrap:wrap;font-family:'VT323',monospace;font-size:20px;color:var(--gold);margin:4px 0}
.wc-zu-viel{color:#ff7a6a}
/* Tisch */
.wc-tisch{display:flex;flex-direction:column;gap:8px}
.wc-seite{display:flex;align-items:center;gap:8px;background:var(--fach);border:3px solid var(--holz-d);padding:6px 8px;color:var(--perg)}
.wc-seite.dran{box-shadow:inset 0 0 0 2px var(--gold)}
.wc-seite.fremd{order:0}
.wc-seite-name{flex:1;min-width:0}
.wc-seite-name b{display:block;font-family:'Jersey 10',monospace;font-weight:400;font-size:22px;line-height:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wc-seite-info{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--perg-m)}
.wc-setzling{display:flex;align-items:center;gap:4px;width:118px}
.wc-setzling-bild{width:34px;height:34px}
.wc-schein{flex:1}
.wc-schein b{display:block;font-size:18px;line-height:1}
.wc-schein small{font-size:11px;color:var(--perg-m)}
.wc-schein .fort{height:8px;margin:2px 0}
.wc-lager{display:flex;gap:3px;align-items:center;min-width:44px;justify-content:flex-end}
.wc-bei{display:flex;flex-direction:column;align-items:center;font-size:10px}
.wc-bei .wc-motiv{width:30px;height:30px}
.wc-lichtung{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(3,auto);gap:6px;padding:8px;background:#2a3a24;
  border:3px solid var(--holz-d);box-shadow:inset 0 0 0 2px #3f5532,4px 4px 0 #0007;touch-action:manipulation}
.wc-feld{position:relative;min-height:100px;display:flex;flex-direction:column;gap:2px;padding:4px;background:var(--gel,#3a3a2a);
  border:3px solid #1c140d;box-shadow:inset 0 0 0 2px #ffffff14;cursor:pointer;color:var(--perg);-webkit-user-select:none;user-select:none}
.wc-feld.heim{border-bottom-color:var(--gold)}
.wc-feld.fremd{border-top-color:#b3202a}
.wc-feld.brunnen{background:#5a6a7a;border-radius:44% 44% 10px 10px / 28% 28% 10px 10px}
.wc-feld.ziel{box-shadow:inset 0 0 0 3px var(--gold),0 0 0 2px var(--gold);animation:wc-puls 1s steps(2) infinite}
@keyframes wc-puls{50%{box-shadow:inset 0 0 0 3px var(--bern),0 0 0 2px var(--bern)}}
.wc-feld.blitz{animation:wc-blitz .45s steps(3)}
@keyframes wc-blitz{40%{filter:brightness(1.6)}}
.wc-feld-kopf{display:flex;gap:4px;align-items:baseline;flex-wrap:wrap;line-height:1}
.wc-feld-kopf b{font-family:'VT323',monospace;font-weight:400;font-size:16px}
.wc-feld-kopf small{font-size:10px;color:#f3e3c3cc}
.wc-feld-kopf .wc-land{color:var(--gold)}
.wc-brunnen-bild{position:absolute;left:50%;top:50%;width:46px;height:46px;transform:translate(-50%,-50%);opacity:.55;pointer-events:none}
.wc-reihe{display:flex;gap:3px;min-height:46px;align-items:center;justify-content:center;position:relative;z-index:1}
.wc-reihe.fremd{order:1}
.wc-reihe.eigen{order:2;margin-top:auto}
.wc-wesen{position:relative;width:46px;height:46px;flex:0 0 auto;border:3px solid var(--holz-d);background:#1e1610;cursor:pointer;touch-action:manipulation}
.wc-wesen.eigen{box-shadow:0 0 0 2px #7ac48a}
.wc-wesen.fremd{box-shadow:0 0 0 2px #e2574c}
.wc-wesen.kann::before{content:'';position:absolute;right:-5px;top:-5px;width:9px;height:9px;background:var(--gold);border:2px solid var(--holz-d);z-index:2}
.wc-wesen.gewaehlt{transform:translateY(-3px);box-shadow:0 0 0 3px var(--gold)}
.wc-motiv{display:block;width:100%;height:100%;overflow:hidden}
.wc-motiv img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block}
.wc-schlag{position:absolute;left:-4px;top:-6px;min-width:18px;height:18px;padding:0 2px;background:var(--rot);color:#fff;font-family:'Jersey 10',monospace;
  font-size:16px;line-height:18px;text-align:center;border:2px solid var(--holz-d)}
.wc-leben{position:absolute;left:0;right:0;bottom:0;height:12px;background:#000a}
.wc-leben i{position:absolute;left:0;top:0;bottom:0;background:#5aa850}
.wc-leben b{position:relative;display:block;text-align:center;font-family:'VT323',monospace;font-weight:400;font-size:13px;line-height:12px;color:#fff}
.wc-vschaden,.wc-schaden{position:absolute;right:-6px;top:10px;z-index:3;font-family:'Jersey 10',monospace;font-size:20px;color:#fff;background:#b3202a;
  padding:0 3px;border:2px solid var(--holz-d)}
.wc-schaden{animation:wc-auf 1s steps(4) forwards}
@keyframes wc-auf{0%{transform:translateY(6px);opacity:0}30%{opacity:1}100%{transform:translateY(-14px);opacity:0}}
.wc-hut{position:absolute;right:3px;bottom:3px;font-size:10px;padding:0 3px;border:2px solid var(--holz-d);z-index:2}
.wc-hut.eigen{background:#7ac48a;color:#1c140d}
.wc-hut.fremd{background:#e2574c;color:#fff}
.wc-status{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;justify-content:space-between;background:var(--fach);border:3px solid var(--holz-d);padding:6px 10px;color:var(--perg)}
.wc-status b{font-family:'Jersey 10',monospace;font-weight:400;font-size:22px}
.wc-dran{color:var(--gold)}
.wc-welle{color:var(--gold);width:100%}
.wc-aktionen{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.wc-aktionen .leise{flex:1 1 100%}
.wc-fertig{margin-left:auto;min-width:110px}
.wc-hand{display:flex;gap:6px;overflow-x:auto;padding:8px 2px 6px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.wc-hk{position:relative;flex:0 0 auto;padding:3px;border:3px solid transparent;cursor:pointer;touch-action:pan-x}
.wc-hk .kt{pointer-events:none}
.wc-hk.gewaehlt{border-color:var(--gold);background:#f2c35b33;transform:translateY(-4px)}
.wc-hk.teuer{opacity:.55}
.wc-hk .pf-glut{position:absolute;left:-2px;bottom:-2px;z-index:2}
.wc-hk .lupe{width:30px;height:30px;padding:5px}
.wc-typ{position:absolute;left:4px;top:4px;z-index:2;font-size:10px;background:var(--holz-d);color:var(--gold);padding:0 3px}
.wc-log .wc-log-z{font-size:13px;padding:2px 0;border-bottom:1px solid var(--holz)}
.wc-finger{word-break:break-all}
.wc-dm{position:fixed;left:50%;top:30%;transform:translateX(-50%);z-index:20;width:min(340px,calc(100% - 32px));background:var(--innen);border:3px solid var(--holz-d);
  box-shadow:inset 0 0 0 2px var(--gold),5px 5px 0 #0008;padding:12px;text-align:center;color:var(--perg);cursor:pointer}
.wc-dm-titel{display:block;font-family:'Jersey 10',monospace;font-weight:400;font-size:30px;color:var(--gold)}
.wc-dm-schein{display:flex;justify-content:space-between;gap:8px;margin-top:6px;font-size:14px}
.wc-dm-schein .eigen{color:#7ac48a}
.wc-dm-schein .fremd{color:#ff9a8a}
.wc-ende-bild{width:120px;height:120px;display:block;margin:0 auto}
.wc-tut{display:flex;gap:10px;align-items:flex-start;background:var(--papier,#f3e6c8);color:#2e2219;border:3px solid var(--holz-d);box-shadow:4px 4px 0 #0007;padding:8px}
.wc-tut p{flex:1;margin:0;font-size:15px}
.wc-tut .reihe{flex-basis:100%}
.wc-tut{flex-wrap:wrap}
.wc-funki{width:56px;height:56px;flex:0 0 auto}
@media (min-width:700px){
  .wc-feld{min-height:132px}
  .wc-wesen{width:56px;height:56px}
}
@media (prefers-reduced-motion:reduce){.wc-feld.ziel,.wc-feld.blitz,.wc-schaden{animation:none!important}}
/* online (Welle 2) */
.wc-uhr{font-family:'VT323',monospace;font-size:18px;color:var(--perg)}
.wc-uhr.knapp{color:#ff7a6a}
.wc-netz{background:#b3202a;color:#fff;text-align:center;padding:4px;border:3px solid var(--holz-d);margin:0}
.wc-such-bild{width:96px;height:96px;display:block;margin:8px auto}
/* Welle 4: Turniere und Modi */
.wc-modi .wc-turnier{border-top:2px solid var(--holz-d);padding:8px 0;display:flex;flex-direction:column;gap:4px}
.wc-modi .wc-turnier:first-of-type{border-top:0}
.wc-turnier small{color:var(--text-m)}
.wc-turnier table tr.ich td{color:var(--gold)}
.wc-banner{background:#2a3f31;border:3px solid var(--holz-d);padding:6px 10px;margin:0;color:var(--perg);text-align:center}
.wc-ww-raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:6px;max-height:60vh;overflow:auto}
.wc-ww-raster .fach small{font-size:11px}
.wc-feld.duerre{box-shadow:inset 0 0 0 3px #a07850}
.wc-duerre{position:absolute;left:3px;bottom:3px;font-size:10px;background:#a07850;color:#1c140d;padding:0 3px;border:2px solid var(--holz-d)}
.wc-ms-schatten{filter:brightness(0) opacity(.35)}
.wc-ms-aussen{margin-top:12px}
/* Einstieg: Schild unter der Welt und Kachel in der Arena (wacht.css wird dafür früh geladen) */
.wc-schild{position:relative;display:flex;align-items:center;gap:12px;width:100%;max-width:520px;margin:12px auto;padding:10px 14px;text-align:left;
  background:#2f4a33;border:3px solid var(--holz-d);box-shadow:inset 0 0 0 2px var(--gold),4px 4px 0 #0008;color:var(--perg);cursor:pointer;font:inherit}
.wc-schild-bild{width:56px;height:56px;flex:0 0 auto}
.wc-schild-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.wc-schild-text b{font-family:'Jersey 10',monospace;font-weight:400;font-size:28px;line-height:1}
.wc-schild-text small{font-size:14px;color:#e8dcc0}
.wc-neu{position:absolute;right:-6px;top:-10px;background:var(--rot);color:#fff;font-family:'Jersey 10',monospace;font-size:20px;padding:0 8px;
  border:3px solid var(--holz-d);transform:rotate(4deg)}
@media (prefers-reduced-motion:no-preference){.wc-neu{animation:wc-neu-wippen 1.6s steps(2) 4}}
@keyframes wc-neu-wippen{50%{transform:rotate(-3deg)}}
