@layer ficha {

@scope (.cos-ficha) {
:scope { --realce: var(--il-groc); }
.pg { height: 100%; display: grid; gap: 4mm; }
.pg-banderes { grid-template-rows: minmax(0, 118fr) minmax(0, 88fr); }
.pg-corda-2 { grid-template-rows: minmax(0, 126fr) minmax(0, 120fr); }
.pg .ex-cos { display: grid; grid-template-columns: minmax(0, 1fr); }
.fig { width: 100%; height: 100%; }
.fig circle { fill: none; stroke: var(--il-contorn); stroke-width: 5; }


.corda { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5mm; padding: 0 4mm; min-height: 0; border-top: 2mm solid var(--il-marro); align-items: start; }
.bandera { display: grid; place-items: center; height: 92%; min-height: 0; background: var(--il-groc); border: var(--gruix) solid var(--il-contorn); border-top: 5mm solid var(--il-vermell); border-radius: 0 0 10mm 10mm; }
.bandera .lletra-gran { font-size: 14mm; }
.bandera .fig { width: 13mm; height: 13mm; }
.bandera.buida { background: var(--il-blanc); border-style: dashed; border-top-style: solid; }
.bandera.pregunta { font-size: 14mm; font-weight: 800; background: var(--il-cel); }
.bandera .r { width: 100%; height: 100%; max-height: 100%; min-height: 0; border-radius: 0 0 8mm 8mm; }


.dues-cordes { display: grid; grid-template-columns: 38mm minmax(0, 1fr); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 4mm 5mm; min-height: 0; }
.ocell-cd { grid-row: 1 / 3; border-radius: var(--radi); }
.buida-cd { opacity: 1; }


.banderes-ord { display: grid; grid-template-columns: 38mm minmax(0, 1fr); gap: 5mm; min-height: 0; }
.gos-bd { border-radius: var(--radi); }
.barreja-cd { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pas-bd { display: grid; grid-template-rows: minmax(0, 1fr) auto; justify-items: center; align-items: center; gap: 2mm; padding: 2mm 1mm 3mm; background: var(--il-groc); border: var(--gruix) solid var(--il-contorn); border-top: 5mm solid var(--il-vermell); border-radius: 0 0 10mm 10mm; min-height: 0; height: 94%; }
.pas-bd .lletra-gran { font-size: 15mm; line-height: 1; }
.pas-bd .fig { width: 15mm; height: 15mm; }
.pas-bd .ordre { min-width: 11mm; height: 11mm; background: var(--paper); }


.falta-opcions { display: grid; grid-template-columns: 38mm minmax(0, 1fr); gap: 5mm; min-height: 0; }
.ovella-bd { border-radius: var(--radi); }
.tres-cordes { display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 3mm; min-height: 0; }
.fila-op { display: grid; grid-template-columns: minmax(0, 1fr) 50mm; gap: 4mm; padding: 2mm 3mm; background: var(--il-sorra); border-radius: var(--radi); min-height: 0; }
.mitjana-cd { height: 100%; gap: 3mm; }
.fila-op .bandera .lletra-gran { font-size: 11mm; }
.fila-op .bandera .fig { width: 10mm; height: 10mm; }
.fila-op .bandera.pregunta { font-size: 11mm; }
.opcions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2mm; min-height: 0; }
.opcions .tria { flex-direction: column; justify-content: center; gap: 1mm; background: var(--paper); border: var(--gruix) solid var(--il-contorn); border-radius: 3mm; min-height: 0; }
.opcions .tria span { display: grid; place-items: center; }
.opcions .tria .lletra-gran { font-size: 9mm; }
.opcions .tria .fig { width: 9mm; height: 9mm; }


.falta-cd { display: grid; grid-template-columns: 38mm minmax(0, 1fr); gap: 5mm; min-height: 0; }
.nen-cd { border-radius: var(--radi); }
.dues-falta-cd { display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 6mm; min-height: 0; }

}
}