@layer ficha {

@scope (.cos-ficha) {
:scope { --realce: var(--il-herba); }
.pg { height: 100%; display: grid; gap: 4mm; }
.pg-p1 { grid-template-columns: 56mm minmax(0, 1fr); }
.pg-p2 { grid-template-rows: minmax(0, 118fr) minmax(0, 120fr); }
.pg .ex-cos { display: grid; grid-template-columns: minmax(0, 1fr); }


.columna-m { display: grid; grid-template-rows: 27mm repeat(5, minmax(0, 1fr)) minmax(0, 1.4fr); gap: 2.5mm; min-height: 0; }
.model-o { display: flex; align-items: center; justify-content: space-around; background: var(--realce); border: var(--gruix) solid var(--il-contorn); border-radius: var(--radi); padding: 0 2mm; }
.model-o .lletra-gran { font-size: 17mm; }
.carta-o { display: grid; place-items: center; padding: 0; min-height: 0; border-radius: var(--radi); }
.carta-o .lletra-gran { font-size: 13mm; }
.roda-o { border-radius: var(--radi); }


.pista { position: relative; min-height: 0; background: radial-gradient(ellipse 40% 43% at 50% 50%, transparent 94%, var(--il-gris) 95% 99%, transparent 100%); }
.seient { position: absolute; width: 22mm; height: 22mm; margin: -11mm 0 0 -11mm; display: grid; place-items: center; padding: 0; border-radius: 50%; background: var(--il-sorra); }
.seient .lletra-gran { font-size: 12mm; }
.seient.on { background: var(--acento); color: var(--paper); }
.s1 { left: 50%; top: 7%; }
.s2 { left: 71%; top: 12.5%; }
.s3 { left: 86%; top: 28%; }
.s4 { left: 91%; top: 50%; }
.s5 { left: 86%; top: 72%; }
.s6 { left: 71%; top: 87.5%; }
.s7 { left: 50%; top: 93%; }
.s8 { left: 29%; top: 87.5%; }
.s9 { left: 14%; top: 72%; }
.s10 { left: 9%; top: 50%; }
.s11 { left: 14%; top: 28%; }
.s12 { left: 29%; top: 12.5%; }
.centre-p { position: absolute; left: 27%; top: 27%; width: 46%; height: 46%; border-radius: var(--radi); }


.taller { display: grid; grid-template-columns: minmax(0, 1fr) 40mm; gap: 5mm; min-height: 0; }
.terra { position: relative; min-height: 0; background: var(--il-sorra); border: var(--gruix) solid var(--il-contorn); border-radius: var(--radi); }
.esp { position: absolute; width: 18mm; height: 18mm; margin: -9mm 0 0 -9mm; display: grid; place-items: center; padding: 0; border-radius: 4mm; }
.esp .lletra-gran { font-size: 11mm; }
.esp:nth-child(1) { left: 11%; top: 17%; rotate: -14deg; }
.esp:nth-child(2) { left: 30%; top: 13%; rotate: 20deg; }
.esp:nth-child(3) { left: 49%; top: 19%; rotate: -8deg; }
.esp:nth-child(4) { left: 68%; top: 13%; rotate: 15deg; }
.esp:nth-child(5) { left: 87%; top: 18%; rotate: -22deg; }
.esp:nth-child(6) { left: 18%; top: 50%; rotate: 25deg; }
.esp:nth-child(7) { left: 38%; top: 46%; rotate: -18deg; }
.esp:nth-child(8) { left: 59%; top: 52%; rotate: 10deg; }
.esp:nth-child(9) { left: 80%; top: 47%; rotate: -12deg; }
.esp:nth-child(10) { left: 10%; top: 83%; rotate: 16deg; }
.esp:nth-child(11) { left: 29%; top: 85%; rotate: -24deg; }
.esp:nth-child(12) { left: 49%; top: 82%; rotate: 8deg; }
.esp:nth-child(13) { left: 68%; top: 85%; rotate: -15deg; }
.esp:nth-child(14) { left: 88%; top: 83%; rotate: 22deg; }
.gos-o { border-radius: var(--radi); }


.cercles { display: grid; grid-template-columns: 38mm minmax(0, 1fr) minmax(0, 1fr) 34mm; gap: 4mm; min-height: 0; }
.nen-o { border-radius: var(--radi); }
.cercle-punts { display: grid; place-items: center; min-height: 0; border: var(--gruix) dashed var(--realce); border-radius: var(--radi); padding: 2mm; }
.punts-o { fill: none; stroke: var(--il-contorn); stroke-width: 3.2; stroke-linecap: round; stroke-dasharray: 0.1 7.5; }
.caselles-o { display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 3mm; min-height: 0; }
.casella-o { background: var(--paper); border: var(--gruix) solid var(--il-contorn); border-radius: var(--radi); background-image: repeating-linear-gradient(90deg, var(--il-gris) 0 2mm, transparent 2mm 3.5mm); background-size: 100% 1px; background-position: 0 50%; background-repeat: no-repeat; min-height: 0; }

}
}