@layer ficha {

@scope (.cos-ficha) {
:scope { --realce: var(--il-groc); }
.pg { height: 100%; display: grid; gap: 4mm; }
.pg-fanals { grid-template-rows: minmax(0, 122fr) minmax(0, 84fr); }
.pg-faana { grid-template-rows: minmax(0, 132fr) minmax(0, 114fr); }
.pg .ex-cos { display: grid; grid-template-columns: minmax(0, 1fr); }

.punts-i { fill: none; stroke: var(--il-contorn); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 0.1 6.5; }
.ini-i { fill: var(--il-verd-fosc); stroke: var(--il-contorn); stroke-width: 1.5; }


.carrer-fanals { display: grid; grid-template-columns: 38mm minmax(0, 1fr); gap: 5mm; min-height: 0; }
.gat-fa { border-radius: var(--radi); }
.tres-fanals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5mm; min-height: 0; }
.fanal { display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); padding: 3mm 2mm 0; background: linear-gradient(var(--il-groc), var(--il-groc)) 50% 0 / 100% 18mm no-repeat, var(--il-cel); border: var(--gruix) solid var(--il-contorn); border-radius: 12mm 12mm 0 0; border-bottom: 4mm solid var(--il-contorn); min-height: 0; }
.fanal > svg { width: 100%; height: 100%; min-height: 0; }


.copia-i { display: grid; grid-template-columns: minmax(0, 1fr) 36mm; gap: 5mm; min-height: 0; }
.nen-pa { border-radius: var(--radi); }
.dues-caselles-i { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5mm; min-height: 0; }
.casella-i { background: linear-gradient(var(--il-gris), var(--il-gris)) 0 18% / 100% 1px no-repeat, repeating-linear-gradient(90deg, var(--il-gris) 0 2mm, transparent 2mm 3.5mm) 0 50% / 100% 1px no-repeat, linear-gradient(var(--il-contorn), var(--il-contorn)) 0 82% / 100% 1.5px no-repeat, var(--paper); border: var(--gruix) solid var(--il-contorn); border-radius: var(--radi); min-height: 0; }


.faana-ex { display: grid; grid-template-columns: minmax(0, 1fr) 38mm; gap: 5mm; min-height: 0; }
.faana { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: repeat(5, minmax(0, 1fr)); gap: 3mm; padding: 4mm; background: var(--il-sorra); border: var(--gruix) solid var(--il-contorn); border-radius: var(--radi) var(--radi) 0 0; border-bottom: 4mm solid var(--il-marro); min-height: 0; }
.fin-i { display: grid; place-items: center; padding: 0; min-height: 0; border-radius: 10mm 10mm 1mm 1mm; background: var(--il-cel); }
.fin-i .lletra-gran { font-size: 11mm; }
.fin-i.on { background: var(--acento); color: var(--paper); }
.ocell-fi { border-radius: var(--radi); }


.quadres-ex { display: grid; grid-template-columns: 38mm minmax(0, 1fr); gap: 5mm; min-height: 0; }
.nena-qu { border-radius: var(--radi); }
.paper-quadrat { --q: 10mm; display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 3mm; padding: 3mm; min-height: 0; background-color: var(--paper); border: var(--gruix) solid var(--il-contorn); border-radius: var(--radi); background-image: linear-gradient(var(--il-gris) 1px, transparent 1px), linear-gradient(90deg, var(--il-gris) 1px, transparent 1px); background-size: 10mm 10mm; }
.fila-quadres { display: flex; align-items: center; padding: 0 3mm; background: transparent; border: 1px solid var(--il-contorn); border-radius: 2mm; }
.fila-quadres .model { font-size: 24mm; }

}
}