/* Nur das Spielfeld: gedruckter Spielplan, Modellstadt und Spielsteine.
   Containermaße beziehen sich auf das gezoomte Brett, nicht das Fenster. */
body.jupi.jd_body .jd_brett {
  --jd-papier: #f6f1df;
  --jd-druck: #253e3c;
  background: #324d47;
  border: .65rem solid #31483e;
  border-radius: .7rem;
  padding: .55rem;
  box-shadow: 0 7px 0 #172f2b, 0 10px 0 #b49a65, 0 22px 35px #15282166, inset 0 0 0 1px #c8be95;
  aspect-ratio: 1;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-color: #c5ad78 #31483e;
}
body.jupi.jd_body .jd_brett_innen {
  container-type: inline-size;
  position: relative;
  display: grid;
  grid-template-columns: 1.65fr repeat(9, minmax(0, 1fr)) 1.65fr;
  grid-template-rows: 1.65fr repeat(9, minmax(0, 1fr)) 1.65fr;
  gap: 0;
  aspect-ratio: 1;
  width: calc(100% * var(--jd-zoom, 1));
  background: var(--jd-druck);
  border: 2px solid var(--jd-druck);
  border-radius: 2px;
}
body.jupi.jd_body .jd_felder { display: contents; }
body.jupi.jd_body #jd_feldwahl { display: block; width: 100%; min-height: 2.75rem; margin: .4rem 0; }

body.jupi.jd_body .jd_stadt {
  position: relative;
  grid-column: 2 / 11;
  grid-row: 2 / 11;
  margin: 0;
  background: #dce5cf url("assets/brettstadt.svg") center / cover no-repeat;
  border: .4rem solid #eee9d4;
  box-shadow: inset 0 0 0 2px #879f8a;
  pointer-events: none;
  overflow: hidden;
}
/* Eigene Wortmarke und zwei Kartenfächer wie bei einem echten Spielplan. */
body.jupi.jd_body .jd_brett_marke {
  position: absolute;
  top: 40%; left: 50%;
  transform: translate(-50%, -50%) rotate(-11deg);
  background: #244d46;
  color: #fff6dd;
  border: .5cqw double #d1b56f;
  padding: .8cqw 2.7cqw 1.1cqw;
  font: 900 5.6cqw/1.1 Georgia, serif;
  letter-spacing: -.25cqw;
  box-shadow: .4cqw .6cqw 0 #102f2a35;
  white-space: nowrap;
}
body.jupi.jd_body .jd_brett_marke span { color: #edc96f; }
body.jupi.jd_body .jd_kartenstapel {
  position: absolute;
  top: 72%; left: 15%;
  width: 23%; height: 16%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .3cqw;
  color: #fff6dd;
  background: repeating-linear-gradient(45deg, #ffffff0a 0 1px, transparent 1px 5px), #a3593e;
  border: .5cqw double #f6e3b9;
  border-radius: .5cqw;
  box-shadow: .2cqw .3cqw 0 #f5efd9, .3cqw .5cqw 0 #a59e82, .5cqw .7cqw 0 #f5efd9, .7cqw 1cqw 1cqw #203d3933;
  transform: rotate(-11deg);
  font-size: 1.15cqw; font-weight: 800;
}
body.jupi.jd_body .jd_kartenstapel b { font: 700 4.5cqw/1 Georgia, serif; }
body.jupi.jd_body .jd_stapel_kasse { left: auto; right: 15%; transform: rotate(11deg); background-color: #3a6b74; }

body.jupi.jd_body .jd_feld {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  padding: 0;
  min-width: 0; min-height: 0;
  border: 0;
  border-radius: 0;
  box-shadow: inset 0 0 0 1px #294039;
  background: linear-gradient(125deg, #fffbed, var(--jd-papier));
  color: var(--jd-druck);
  font-family: inherit;
  font-size: 1.16cqw;
  line-height: 1.08;
  text-align: center;
  cursor: pointer;
  overflow: hidden;
  transition: filter .12s;
}
body.jupi.jd_body .jd_feld:hover { filter: brightness(1.06); z-index: 3; }
body.jupi.jd_body .jd_feld:focus-visible { outline: 3px solid #df9a26; outline-offset: -4px; z-index: 4; }
body.jupi.jd_body .jd_feld_inhalt {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0; min-height: 0;
  padding: 1.9cqw .35cqw .45cqw;
  gap: .25cqw;
}
body.jupi.jd_body .jd_feld_balken {
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 1.5cqw;
  background: var(--gruppe-farbe);
  border-bottom: 1px solid #294039;
  box-shadow: inset 0 2px #ffffff44;
}
/* Auf jeder Seite liegt die Gruppenfarbe an der inneren Brettkante. */
body.jupi.jd_body .jd_feld[data-seite="oben"] .jd_feld_balken { top: auto; bottom: 0; border-top: 1px solid #294039; }
body.jupi.jd_body .jd_feld[data-seite="oben"] .jd_feld_inhalt { padding: .45cqw .35cqw 1.9cqw; }
body.jupi.jd_body .jd_feld[data-seite="links"] .jd_feld_balken { left: auto; width: 1.5cqw; height: 100%; border-left: 1px solid #294039; }
body.jupi.jd_body .jd_feld[data-seite="rechts"] .jd_feld_balken { right: auto; width: 1.5cqw; height: 100%; border-right: 1px solid #294039; }
body.jupi.jd_body .jd_feld[data-seite="links"] .jd_feld_inhalt { padding: .35cqw 1.9cqw .35cqw .35cqw; }
body.jupi.jd_body .jd_feld[data-seite="rechts"] .jd_feld_inhalt { padding: .35cqw .35cqw .35cqw 1.9cqw; }
body.jupi.jd_body .jd_stadtbild { width: 90%; height: 3.5cqw; min-height: 0; object-fit: contain; }
body.jupi.jd_body .jd_feld_stadt { font-size: .92cqw; font-weight: 700; letter-spacing: .01em; color: #536457; }
body.jupi.jd_body .jd_feld_name {
  font-size: 1.14cqw;
  font-weight: 800;
  max-width: 100%;
  overflow-wrap: anywhere;
  hyphens: auto;
}
body.jupi.jd_body .jd_feld_fuss { font-size: 1.05cqw; font-weight: 700; color: #4c5d51; margin-top: auto; white-space: nowrap; }
body.jupi.jd_body .jd_feld_symbol { display: block; width: 4.3cqw; height: 4.5cqw; color: #355d60; flex-shrink: 1; min-height: 0; }
body.jupi.jd_body .jd_feld_symbol svg { display: block; width: 100%; height: 100%; }
body.jupi.jd_body .jd_feld:not(.jd_art_grundstueck) .jd_feld_inhalt { padding: .65cqw .4cqw; }
body.jupi.jd_body .jd_feld:not(.jd_art_grundstueck) .jd_feld_fuss:empty { display: none; }
/* Die Seitenfelder zeigen eine breite Stadtvignette neben dem Straßennamen. */
body.jupi.jd_body .jd_feld:is([data-seite="links"], [data-seite="rechts"]) .jd_stadtbild { position: absolute; width: 5.2cqw; height: 3.2cqw; opacity: .2; right: 1.7cqw; bottom: .4cqw; }
body.jupi.jd_body .jd_feld:is([data-seite="links"], [data-seite="rechts"]) .jd_feld_name { font-size: 1.24cqw; }
body.jupi.jd_body .jd_feld:is([data-seite="links"], [data-seite="rechts"]) .jd_feld_symbol { width: 3.5cqw; height: 3.4cqw; }
body.jupi.jd_body .jd_ecke { background: #e4dfc7; }
body.jupi.jd_body .jd_ecke .jd_feld_symbol { width: 6cqw; height: 6.4cqw; }
body.jupi.jd_body .jd_ecke .jd_feld_name { font: 800 1.5cqw/1.1 Georgia, serif; }
body.jupi.jd_body .jd_ecke[data-feld="0"] { background: #d4e2be; }
body.jupi.jd_body .jd_ecke[data-feld="10"] { background: #e9dcc0; }
body.jupi.jd_body .jd_ecke[data-feld="20"] { background: #d6e2c9; }
body.jupi.jd_body .jd_ecke[data-feld="30"] { background: #e2dbca; }
body.jupi.jd_body .jd_art_ereignis .jd_feld_symbol { color: #a65c35; }
body.jupi.jd_body .jd_art_gemeinschaft .jd_feld_symbol { color: #346f75; }
body.jupi.jd_body .jd_art_steuer .jd_feld_symbol { color: #9a513d; }

/* Eigentum liegt als Farbniete am Außenrand, nicht über dem Namen. */
body.jupi.jd_body .jd_feld.jd_hat_besitzer { box-shadow: inset 0 0 0 .38cqw var(--besitzer-farbe); }
body.jupi.jd_body .jd_besitzer_marke { position: absolute; width: .8cqw; height: .8cqw; top: .3cqw; right: .3cqw; border: 1px solid #fff; border-radius: 50%; }
body.jupi.jd_body .jd_beleiht { background-image: repeating-linear-gradient(45deg, #97734e24 0 6px, transparent 6px 12px); }
body.jupi.jd_body .jd_beleiht_marke { position: absolute; top: .2cqw; left: .2cqw; font-size: 1.4cqw; }

/* Spielfiguren: lackierte Kegel mit Namensinitial und aktivem Standring. */
body.jupi.jd_body .jd_figuren { position: absolute; bottom: .5cqw; right: .5cqw; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .15cqw; max-width: 96%; z-index: 2; }
body.jupi.jd_body .jd_figur {
  position: relative;
  width: 1.65cqw; height: 1.65cqw;
  margin-top: 1cqw;
  border-radius: 45% 45% 36% 36%;
  border: 1px solid #203c3e88;
  background-image: linear-gradient(105deg, #fff9 0, transparent 45%, #0005 95%);
  box-shadow: .3cqw .4cqw .3cqw #19322d66, inset 0 -.25cqw #0002;
  color: white; font: 900 1cqw/1.65cqw Arial, sans-serif;
  text-shadow: 0 1px 2px #000;
}
body.jupi.jd_body .jd_figur::before { content: ""; position: absolute; width: 1.1cqw; height: 1.1cqw; left: 50%; top: -.95cqw; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle at 30% 25%, #fffb, transparent 60%), var(--figur-farbe); border: 1px solid #203c3e88; }
body.jupi.jd_body .jd_figur_aktiv { outline: .3cqw solid #ffd253; outline-offset: .2cqw; }
body.jupi.jd_body .jd_aktive_figur { z-index: 2; box-shadow: inset 0 0 0 .4cqw #dfaa39; }
body.jupi.jd_body .jd_ausgewaehlt { outline: .35cqw dashed #a54030; outline-offset: -.5cqw; }

body.jupi.jd_body .jd_gebäude { position: absolute; left: .3cqw; top: .2cqw; display: flex; gap: .3cqw; z-index: 1; }
body.jupi.jd_body .jd_modellhaus { position: relative; display: block; width: 1.3cqw; height: 1cqw; margin-top: .7cqw; background: linear-gradient(90deg, #559f6a 68%, #286b49 68%); box-shadow: .2cqw .3cqw .2cqw #19322d66; }
body.jupi.jd_body .jd_modellhaus::before { content: ""; position: absolute; top: -.65cqw; left: -.1cqw; border-left: .75cqw solid transparent; border-right: .75cqw solid transparent; border-bottom: .7cqw solid #275a40; }
body.jupi.jd_body .jd_haus_stufe_3 .jd_modellhaus { width: 2.1cqw; height: 1.6cqw; background: repeating-linear-gradient(90deg, transparent 0 .35cqw, #fff7 .35cqw .5cqw), #ba5742; }
body.jupi.jd_body .jd_haus_stufe_3 .jd_modellhaus::before { border-left-width: 1.15cqw; border-right-width: 1.15cqw; border-bottom-color: #843d34; }
/* Das gedruckte Brett bleibt im Lampenlicht lesbar. */
html[data-theme="dark"] body.jupi.jd_body .jd_brett { --jd-papier: #e0decb; border-color: #203b34; }
html[data-theme="dark"] body.jupi.jd_body .jd_stadt { filter: brightness(.84) saturate(.9); }
@media (max-width: 40rem) {
  body.jupi.jd_body .jd_brett { padding: .2rem; border-width: .35rem; }
}
@media (prefers-reduced-motion: reduce) { body.jupi.jd_body .jd_feld { transition: none; } }

/* Echte 3D-Ansicht; der gedruckte Spielplan bleibt als WebGL-Ersatz erhalten. */
body.jupi.jd_body .jd_brett.jd_3d { position: relative; padding: 0; overflow: hidden; aspect-ratio: auto; height: min(78dvh, 850px, calc(100vw - 2rem)); min-height: 280px; }
body.jupi.jd_body .jd_brett3d_canvas { display: block; width: 100%; height: 100%; position: absolute; inset: 0; touch-action: none; cursor: grab; }
body.jupi.jd_body .jd_brett3d_canvas:active { cursor: grabbing; }
body.jupi.jd_body .jd_brett3d_canvas:focus-visible { outline: 3px solid #eec563; outline-offset: -4px; }
body.jupi.jd_body .jd_3d_hinweis { position: absolute; bottom: .5rem; left: .5rem; right: .5rem; margin: 0; padding: .45rem .6rem; border-radius: .35rem; background: #183b34e8; color: #fff4d8; font-size: .72rem; line-height: 1.3; text-align: center; pointer-events: none; z-index: 1; }
body.jupi.jd_body .jd_ansicht_reset { position: absolute; top: .65rem; right: .65rem; z-index: 1; background: #fff4d8; color: #24463d; border: 1px solid #6c826a; border-radius: .45rem; min-height: 40px; padding: .4rem .8rem; font: 700 .8rem Arial, sans-serif; cursor: pointer; box-shadow: 0 2px 8px #17332a33; }

/* Die Szene nutzt den ganzen Raum unter der JUPI-Leiste. HUD und Urkunden
   sind unabhängige Blätter darüber und reservieren keine Canvas-Spalte. */
body.jupi.jd_body.jd_ingame { overflow: hidden; }
body.jupi.jd_body.jd_ingame .jupi_container { display: block; width: 100%; max-width: none; height: 100dvh; min-height: 0; margin: 0; padding: 0; }
body.jupi.jd_body.jd_ingame .jupi_main { margin: 0; padding: 0; }
body.jupi.jd_body.jd_ingame .jd_header { position: fixed; top: 0; left: 0; right: 0; z-index: 30; height: auto; min-height: 0; margin: 0; }
body.jupi.jd_body.jd_ingame .jd_spiel { position: fixed; top: var(--jd-header-h, 64px); left: 0; right: 0; bottom: 0; z-index: 10; overflow: hidden; }
body.jupi.jd_body.jd_ingame .jd_brett_buehne { position: absolute; inset: 0; display: block; }
body.jupi.jd_body.jd_ingame .jd_brett.jd_3d { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; }
body.jupi.jd_body.jd_ingame footer { display: none; }
body.jupi.jd_body.jd_ingame .jd_leiste { position: absolute; top: .5rem; left: .6rem; right: .6rem; z-index: 5; gap: .45rem; margin: 0; align-items: flex-start; flex-wrap: nowrap; pointer-events: none; }
body.jupi.jd_body.jd_ingame .jd_leiste > * { pointer-events: auto; }
body.jupi.jd_body.jd_ingame .jd_leiste_werkzeuge { flex: 1; min-width: 0; gap: .3rem; }
body.jupi.jd_body.jd_ingame .jd_leiste_werkzeuge .jupi_btn { min-width: 40px; min-height: 40px; padding: .35rem .65rem; font-size: .8rem; line-height: 1.15; }
body.jupi.jd_body.jd_ingame .jd_leiste_stat { min-height: 40px; box-sizing: border-box; white-space: nowrap; }
body.jupi.jd_body.jd_ingame .jd_panel { position: absolute; top: calc(var(--jd-hud-h, 40px) + 1rem); right: .8rem; width: 17rem; max-height: calc(100% - var(--jd-hud-h, 40px) - 2rem); box-sizing: border-box; padding: .65rem; gap: .55rem; z-index: 4; overscroll-behavior: contain; }
body.jupi.jd_body .jd_spieler_panel > summary { cursor: pointer; }
body.jupi.jd_body.jd_ingame .jd_panel_zu .jd_panel { display: none; }
body.jupi.jd_body.jd_ingame .jd_urkunde { display: none; position: absolute; top: calc(var(--jd-hud-h, 40px) + 1rem); left: .8rem; width: 19rem; box-sizing: border-box; max-height: calc(100% - var(--jd-hud-h, 40px) - 2rem); overflow-y: auto; overscroll-behavior: contain; padding: .9rem; background: var(--jd-panel-hintergrund); border: 2px solid var(--jd-holz); border-radius: .7rem; box-shadow: 0 10px 32px #142e2966; z-index: 6; }
body.jupi.jd_body.jd_ingame .jd_card_open .jd_urkunde { display: block; }
body.jupi.jd_body .jd_urkunde > label { display: block; padding-right: 2.2rem; }
body.jupi.jd_body .jd_urkunde { position: relative; }
body.jupi.jd_body .jd_overlay_zu { position: absolute; right: .25rem; top: .25rem; min-width: 40px; min-height: 40px; border: 0; background: transparent; color: var(--jd-tinte); font-size: 1.6rem; cursor: pointer; }
body.jupi.jd_body .jd_wurf_overlay { position: absolute; z-index: 12; left: 50%; top: 50%; transform: translate(-50%,-50%); width: min(26rem,calc(100% - 1rem)); overflow: hidden; border: 3px solid #d4bb7b; border-radius: 1rem; background: #274b3d; box-shadow: 0 16px 48px #122e2aa8; pointer-events: none; }
body.jupi.jd_body .jd_wurf_canvas { display: block; width: 100%; height: 210px; margin: 0; border: 0; }
body.jupi.jd_body .jd_wurf_text { margin: 0; padding: .8rem .5rem; background: #193d32; color: #fff2cc; text-align: center; font-size: 1.2rem; font-weight: 800; min-height: 1.5rem; }
body.jupi.jd_body .jd_aktionen .jupi_btn:disabled { opacity: .55; cursor: wait; }

/* Dauerhafter Besitz am unteren Rand: Geldkarte und kleine Urkunden. */
body.jupi.jd_body .jd_besitz { padding: .6rem .8rem; box-sizing: border-box; border-top: 2px solid #bda36a; background: linear-gradient(180deg,#304d43f5,#172f29fa); color: #fff1d0; box-shadow: 0 -6px 26px #0b221f55; }
body.jupi.jd_body.jd_ingame .jd_besitz { position: absolute; bottom: 0; left: 0; right: 0; z-index: 7; }
body.jupi.jd_body .jd_besitz_kopf { display: flex; align-items: center; gap: .8rem; min-width: 0; }
body.jupi.jd_body .jd_geldkarte { display: grid; grid-template-columns: auto auto; column-gap: .8rem; align-items: baseline; min-width: 12rem; padding: .4rem .8rem; background: linear-gradient(125deg,#28483b,#3c6450); border: 1px solid #a88f59; border-radius: .6rem; box-shadow: inset 0 1px #ffffff18; }
body.jupi.jd_body .jd_geldkarte_person { font-size: .85rem; font-weight: 800; }
body.jupi.jd_body .jd_geldkarte_person::before { content: ""; display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; background: var(--besitz-farbe); box-shadow: 0 0 0 1px #fff8; margin-right: .4rem; }
body.jupi.jd_body .jd_geldkarte_label { grid-row: 2; color: #d7d2af; font-size: .67rem; text-transform: uppercase; letter-spacing: .06em; }
body.jupi.jd_body .jd_geldkarte_betrag { grid-column: 2; grid-row: 1 / 3; align-self: center; color: #ffe49c; font-size: 1.4rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
body.jupi.jd_body #jd_besitz_aktionen { flex: 1; min-width: 0; }
body.jupi.jd_body #jd_besitz_aktionen .jd_aktionen { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: flex-end; }
body.jupi.jd_body #jd_besitz_aktionen .jupi_btn { min-height: 40px; padding: .4rem .7rem; font-size: .85rem; border: 1px solid #b9a274; border-radius: .45rem; background: #f4e6c6; color: #263e35; font-weight: 800; cursor: pointer; }
body.jupi.jd_body #jd_besitz_aktionen .jd_btn_wuerfeln { background: #e8c56a; }
body.jupi.jd_body .jd_besitz_anzahl { color: #e8d7ad; font-size: .75rem; white-space: nowrap; }
body.jupi.jd_body .jd_besitz_karten { display: flex; gap: .55rem; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-color: #b3a16b #263e35; padding: .5rem .1rem .2rem; touch-action: pan-x; }
body.jupi.jd_body .jd_besitz_leer { margin: .15rem 0; color: #c8cfbd; font-size: .75rem; }
body.jupi.jd_body .jd_besitz_karte { position: relative; display: flex; flex-direction: column; flex: 0 0 10.5rem; min-height: 7.6rem; padding: .7rem .6rem .45rem; border: 1px solid #b5a37f; border-top: .55rem solid var(--karte-farbe); border-radius: .3rem .3rem .5rem .5rem; background: linear-gradient(115deg,#fff9e9,#e9dfc6); color: #2c4039; text-align: left; cursor: pointer; box-shadow: 0 3px 5px #001e1855,inset 0 0 0 2px #ffffff6b; font-family: inherit; }
body.jupi.jd_body .jd_besitz_karte:hover { filter: brightness(1.06); }
body.jupi.jd_body .jd_besitz_karte:focus-visible { outline: 3px solid #ffdc73; outline-offset: 1px; }
body.jupi.jd_body .jd_besitz_bild { position: absolute; width: 2.7rem; height: 1.8rem; object-fit: contain; right: .4rem; top: .25rem; }
body.jupi.jd_body .jd_besitz_karte .jd_feld_symbol { position: absolute; width: 1.7rem; height: 1.7rem; right: .4rem; top: .25rem; opacity: .6; }
body.jupi.jd_body .jd_besitz_stadt { min-height: 1.1rem; padding-right: 2.8rem; font-size: .63rem; color: #627161; text-transform: uppercase; letter-spacing: .03em; }
body.jupi.jd_body .jd_besitz_strasse { display: block; min-height: 1.8rem; margin-top: .4rem; font-size: .83rem; line-height: 1.15; overflow-wrap: anywhere; }
body.jupi.jd_body .jd_besitz_bau { margin: auto 0 .25rem; padding-top: .15rem; font-size: .65rem; color: #6e7058; }
body.jupi.jd_body .jd_besitz_wert { display: block; border-top: 1px solid #a0a18b77; padding-top: .3rem; font-size: .73rem; font-weight: 800; }
body.jupi.jd_body .jd_besitz_beliehen { background: repeating-linear-gradient(45deg,#ffffff22 0 5px,transparent 5px 10px),#ded7c7; }
body.jupi.jd_body.jd_ingame .jd_panel { max-height: calc(100% - var(--jd-hud-h,40px) - var(--jd-dock-h,0px) - 2rem); }
body.jupi.jd_body.jd_ingame .jd_urkunde { max-height: calc(100% - var(--jd-hud-h,40px) - var(--jd-dock-h,0px) - 2rem); }
body.jupi.jd_body.jd_ingame .jd_3d_hinweis { bottom: calc(var(--jd-dock-h,0px) + .5rem); }
body.jupi.jd_body.jd_ingame .jd_wurf_overlay { top: calc((100% - var(--jd-dock-h,0px) + var(--jd-hud-h,0px)) / 2); }
body.jupi.jd_body.jd_ingame .jd_3d_hinweis { right: auto; bottom: .65rem; max-width: calc(100% - 21rem); }
body.jupi.jd_body.jd_ingame .jd_dialog { background: #0e29264a; backdrop-filter: none; }
@media (max-width: 700px) {
  body.jupi.jd_body.jd_ingame .jd_leiste { left: .4rem; right: .4rem; }
  body.jupi.jd_body.jd_ingame .jd_leiste_stat { padding: .3rem; gap: .2rem; }
  body.jupi.jd_body.jd_ingame .jd_leiste_label { display: none; }
  body.jupi.jd_body.jd_ingame .jd_leiste_wert { font-size: .85rem; }
  body.jupi.jd_body.jd_ingame .jd_leiste_werkzeuge .jupi_btn { padding: .3rem .45rem; font-size: .72rem; }
  body.jupi.jd_body.jd_ingame .jd_panel { top: calc(var(--jd-hud-h,40px) + 1rem); bottom: auto; right: .5rem; width: min(16rem, calc(100% - 1rem)); max-height: calc(100% - var(--jd-hud-h,40px) - var(--jd-dock-h,0px) - 2rem); padding: .5rem; gap: .35rem; }
  body.jupi.jd_body.jd_ingame .jd_aktuell { padding: .35rem .55rem; display: flex; align-items: baseline; gap: .4rem; flex-wrap: wrap; }
  body.jupi.jd_body.jd_ingame .jd_aktuell_name { font-size: 1rem; }
  body.jupi.jd_body.jd_ingame .jd_aktuell_geld { margin-left: auto; font-size: .85rem; }
  body.jupi.jd_body.jd_ingame .jd_wuerfel { width: 2rem; height: 2rem; font-size: 1.1rem; }
  body.jupi.jd_body.jd_ingame .jd_aktionen { grid-template-columns: repeat(2,minmax(0,1fr)); gap: .3rem; }
  body.jupi.jd_body.jd_ingame .jd_aktionen .jupi_btn { padding: .35rem .4rem; min-height: 40px; font-size: .8rem; }
  body.jupi.jd_body.jd_ingame .jd_meldung { margin: 0; padding: .35rem .5rem; font-size: .72rem; }
  body.jupi.jd_body.jd_ingame .jd_urkunde { left: .5rem; width: min(22rem, calc(100% - 1rem)); }
  body.jupi.jd_body.jd_ingame .jd_card_open .jd_panel { visibility: hidden; }
  body.jupi.jd_body.jd_ingame .jd_3d_hinweis { display: none; }
  body.jupi.jd_body .jd_besitz { padding: .4rem .5rem; }
  body.jupi.jd_body .jd_besitz_kopf { flex-wrap: wrap; gap: .3rem .5rem; }
  body.jupi.jd_body .jd_geldkarte { flex: 1; min-width: 0; display: flex; gap: .5rem; padding: .35rem .55rem; }
  body.jupi.jd_body .jd_geldkarte_label { display: none; }
  body.jupi.jd_body .jd_geldkarte_betrag { margin-left: auto; font-size: 1.15rem; }
  body.jupi.jd_body .jd_besitz_anzahl { font-size: .65rem; }
  body.jupi.jd_body #jd_besitz_aktionen { flex: 1 0 100%; order: 3; }
  body.jupi.jd_body #jd_besitz_aktionen .jd_aktionen { justify-content: flex-start; }
  body.jupi.jd_body #jd_besitz_aktionen .jupi_btn { flex: 1; padding: .35rem .45rem; font-size: .75rem; }
  body.jupi.jd_body .jd_besitz_karte { flex-basis: 9.1rem; min-height: 6.6rem; padding: .45rem .5rem .35rem; }
  body.jupi.jd_body .jd_besitz_strasse { font-size: .76rem; min-height: 1.8rem; }
  body.jupi.jd_body .jd_besitz_bau { font-size: .62rem; }
}
/* Während des Ziehens braucht die Figur auch auf kleinen Handys freie Sicht.
   Das Geld-/Besitz-Dock bleibt dabei an seinem festen Platz sichtbar. */
#jd_spiel.jd_bewegt #jd_panel,
#jd_spiel.jd_bewegt #jd_urkunde { visibility: hidden; pointer-events: none; }