/* Steckbrief-Generator (Welle 10 g03, 27.10.2026): Felder neben der Vorschau, Regler, Druck nur des Steckbriefs.
   Schriften kommen aus wilderwesten.css (/assets/fonts/), keine eigene @font-face. Nichts schwebt. */
.ww-sg-raster { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.ww-sg-vorschau { margin: 0; padding: .8rem; text-align: center; }
.ww-sg-bogen { display: block; width: 100%; max-width: 420px; height: auto; margin: 0 auto .6rem; border-radius: 2px; box-shadow: var(--ww-papierkante); background: #e9d8b4; }
.ww-sg-hilfe, .ww-main .prose .ww-sg-hilfe { margin: 0; }
.ww-sg-regler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin: .8rem 0; }
.ww-sg-regler input[type="range"] { min-height: 32px; padding: 0; border: 0; background: transparent; accent-color: var(--ww-marke); }
.ww-feld input[type="file"] { padding: .45rem .6rem; }
.ww-feld textarea { resize: vertical; }
.ww-sg-druckbogen { display: none; }
/* Felder und Vorschau nebeneinander nur, wenn das Werkzeug selbst breit genug ist (Containerabfrage; sonst untereinander) */
.ww-w-steckbrief-generator { container-type: inline-size; }
@container (min-width: 680px) {
    .ww-sg-raster { grid-template-columns: minmax(0, 1fr) minmax(0, 300px); align-items: start; }
    .ww-sg-raster .ww-werkzeug-form { grid-template-columns: minmax(0, 1fr); }
}
@container (max-width: 520px) {
    .ww-sg-regler { grid-template-columns: minmax(0, 1fr); }
}
@media print {
    /* Nur nach dem Knopf "Drucken": allein der Steckbrief auf der Seite */
    html.ww-sg-druck body > :not(.ww-sg-druckbogen) { display: none !important; }
    html.ww-sg-druck .ww-sg-druckbogen { display: block; text-align: center; }
    html.ww-sg-druck .ww-sg-druckbogen img { display: block; width: auto; max-width: 100%; max-height: 23cm; margin: 0 auto; }
    html.ww-sg-druck .ww-sg-druckbogen p { font: 9pt Figtree, sans-serif; color: #444; margin: .3cm 0 0; }
    /* Druck der ganzen Seite: Vorschau klein, Hinweise ohne Rahmen */
    .ww-sg-bogen { max-width: 9cm; box-shadow: none; }
    .ww-sg-vorschau .ww-w-status { display: none; }
}