/*
 * Card Docu v10.46 — DER ECHTE CLEAR-FRONT-SLAB AUF DER ZERTIFIKATSSEITE (/card/{nr}/ und /status/{nr}/)
 *
 * Mert, 15.10.2026: „Der Clear Front Slab soll überall mit Label jetzt eingebaut werden: im Platin-Grading.de/card
 * Platin-grading.de/status … das soll alles richtig aussehen. So wie im schaufenster".
 *
 * Dieselben Bauteile wie in der Kundenbereich-Anzeige (assets/schaufenster/index.html, v10.43–10.45), hier als echte
 * Dateien statt Data-URIs: Merts Case-Front (case-front.webp, 1600 × 2000, unverändert; case-front-s.webp = nur der
 * Case-Ausschnitt 420 × 709 aus 10.45), Leinen-Papier und geprägtes Wappen des Labels (label-papier*.jpg,
 * wappen-praegung*.webp), Wappen-Pfade/Silber/Prägung (label-vorrat.svg) und Merts Arial als Teilsatz.
 *
 * Maße wie im Schaufenster, in Prozent des Cases (80 × 135 mm = 1000 × 1688 px im Bild bei x 300–1300, y 120–1808):
 *   Label-Fenster  left 6,875 % · top 3,0066 % · 86,25 % × 15,551 %
 *   Kartenfach     left 10,3125 % · top 26,622 % · 79,375 % × 65,832 %
 * Ebenen: Motiv (FusionArt, z 0) → Label und Karte (z 1) → Case-Front ganz oben (z 3, durchsichtig, ohne Blur,
 * ohne eigenen Schatten/Glanz; pointer-events:none — Klicks, Kippen, ZOOM und Umdrehen treffen die Karte darunter).
 *
 * Alle Regeln hängen an .cdg-slab.cdg-case — die Klasse setzt die Vorlage nur bei eingeschaltetem Slab (Option
 * card_docu_cert_slab, Filter card_docu_cert_slab_an). Ohne sie sieht die Seite aus wie bis 10.45.
 * Vorangestelltes „body": schlägt die älteren Regeln von ArtFusion (≤ 1.3.5: .cd-grade-page .cdg-slab:not(.pgsaf-zert-aus)
 * mit Rand und Motiv als Hintergrund) — das Motiv zeichnet seit 10.46 der Slab selbst (.cdg-case__motiv).
 */

@font-face{ font-family:"PGS Label Arial"; src:url(arial-label-teil.woff2) format("woff2");
  font-weight:400; font-style:normal; font-display:block; }

/* Die Fläche: kein Rahmen, kein Hintergrund mehr — das Case IST die Fläche. */
body .cd-grade-page .cdg-slab.cdg-case{
  padding:0; border:0; border-radius:0; overflow:visible;
  background:none; background-image:none;
  box-shadow:none !important;
  width:100%; max-width:420px; margin-left:auto; margin-right:auto; margin-bottom:0;
}
body .cd-grade-page .cdg-slab.cdg-case::before,
body .cd-grade-page .cdg-slab.cdg-case::after{ display:none !important; }

/* Das Case: Seitenverhältnis 1000 : 1688 (Rückfall ohne aspect-ratio über padding-top). */
body .cd-grade-page .cdg-case__box{
  position:relative; width:100%; height:0; padding-top:168.8%;
  isolation:isolate;
  transform:perspective(1400px) rotateX(var(--case-rx, 0deg)) rotateY(var(--case-ry, 0deg));
  transition:transform .18s cubic-bezier(0.23, 1, 0.32, 1);
}
body .cd-grade-page .cdg-case__box.ist-ruhig{ transition:transform .8s cubic-bezier(0.23, 1, 0.32, 1); }

/* FusionArt™: das Motiv über das GANZE Case (bis unter den Rahmen, kein Spalt an einer Kante — Mert, 15.10.2026), hinter
   Label und Karte. Die Adresse setzt ArtFusion als --pgsaf-zert-motiv auf .cdg-slab; .pgsaf-zert-aus = Bild lädt nicht. */
body .cd-grade-page .cdg-case__motiv{
  position:absolute; z-index:0; left:0; right:0; top:0; bottom:0; display:none;
  border-radius:2.2% / 1.3%;
  background-image:var(--pgsaf-zert-motiv, none);
  background-position:center; background-size:cover; background-repeat:no-repeat;
  pointer-events:none;
}
body .cd-grade-page .cdg-case.cdg-case--motiv:not(.pgsaf-zert-aus) .cdg-case__motiv{ display:block; overflow:hidden; }
/* pgs-slab.js legt das Motiv als eigene Lage (.cdg-case__motiv-bild, Lage in % des Cases, gleichmäßig skaliert) so, dass die
   echte Karte im Kartenfach genau auf der gemalten liegt (Lage von ArtFusion ab 1.3.6, sonst Standard 40 | 77,5 mm).
   Ohne Skript bleibt der Rückfall oben (mittig „cover"). */
body .cd-grade-page .cdg-case.cdg-case--lage .cdg-case__motiv{ background-image:none; }
body .cd-grade-page .cdg-case__motiv-bild{
  position:absolute; display:block; pointer-events:none;
  background-image:var(--pgsaf-zert-motiv, none); background-size:100% 100%; background-repeat:no-repeat;
}

/* v10.46 (Nachtrag) — DRUCKBILD von ArtFusion (ab 1.3.6, WebP mit Durchsicht: Motiv MIT gedrucktem Labeltext, Kartenfenster
   und Druckrand durchsichtig wie im xTool-Projekt). pgs-slab.js legt es so breit wie das Case, die gedruckte Label-Zone mittig
   ins Label-Fenster (1,56 mm unter der Case-Oberkante — Mert: „Text zu tief"). Hinter dem Bild liegt KEINE Farbe: durch den
   Cutout sieht man nur die echte Karte und die Case-Innenseite. */
body .cd-grade-page .cdg-case.cdg-case--druck .cdg-case__motiv,
body .cd-grade-page .cdg-case.cdg-case--druck .cdg-case__motiv-bild{ background-color:transparent; }

/* Das Label im Label-Fenster. */
body .cd-grade-page .cdg-case__label{
  position:absolute; z-index:1; left:6.875%; top:3.0066%; width:86.25%; height:15.551%;
}
body .cd-grade-page .cdg-case__label .pgs-label{
  display:block; width:100%; height:100%; overflow:hidden; background:#dfe5ec;   /* Papierton, falls das Leinen-Bild nicht geht */
}
/* Mert, 15.10.2026: „nie das weiße standard label bei den fusion art karten verwenden … nie über artfusion oder unsere schon
   fertigen produktbilder" und: Labeltext sichtbar wie im xTool-Druck. Das Zertifikatsbild von ArtFusion ist die Druckfassung
   MIT Labeltext in der Label-Zone — darüber liegt nichts von Card Docu (kein Papier, keine Halbtransparenz, kein zweiter
   Text). Nur mit dem Schalter card_docu_cert_slab_fa_papier = 1 das Papier-Label; lädt das Motiv nicht (.pgsaf-zert-aus),
   steht das normale Label da. */
body .cd-grade-page .cdg-case.cdg-case--motiv.cdg-case--ohne-papier:not(.pgsaf-zert-aus) .cdg-case__label{ display:none; }
/* Schrift wie in der Vorlage und im Schaufenster: Arial REGULAR, schwarz. */
body .cd-grade-page .cdg-case .pgs-label text{
  font-family:"PGS Label Arial", Arial, Helvetica, Arimo, "Liberation Sans", sans-serif;
  font-weight:400; font-style:normal; fill:#0a0b0d; text-rendering:geometricPrecision;
}
body .cd-grade-page .cdg-case .pgs-label .pl-wappen{ filter:url(#pl-praegung); }
body .cd-grade-page .cdg-case .pgs-label .pl-wappen-form{ fill:url(#pl-silber); }
body .cd-grade-page .cdg-case .pgs-label .pl-wappen-raster{ display:none; }
body .cd-grade-page .cdg-case.pl-webp .pgs-label .pl-wappen-raster{ display:inline; }
body .cd-grade-page .cdg-case.pl-webp .pgs-label .pl-wappen{ display:none; }   /* die Live-Prägung bleibt nur Rückfall */

/* Die Karte im Kartenfach — dasselbe Element wie bisher (.cdg-slab__pic: ZOOM, Großansicht, Umdrehen, Glanz).
   .cdg-slab.cdg-case: schlägt auch den dunklen Schatten der alten ArtFusion-Regel (.cdg-slab:not(.pgsaf-zert-aus) .cdg-slab__pic).
   Das Foto ganz zeigen (contain): Yu-Gi-Oh! (59 × 86 mm) und knapp geschnittene Scans werden nicht beschnitten. */
body .cd-grade-page .cdg-slab.cdg-case .cdg-slab__pic{
  position:absolute; z-index:1; left:10.3125%; top:26.622%; width:79.375%; height:65.832%;
  min-height:0; margin:0; border-radius:4.7% / 3.4%; box-shadow:none; background:transparent;
}
body .cd-grade-page .cdg-case .cdg-slab__pic > img{ width:100%; height:100%; object-fit:contain; border-radius:inherit; }
body .cd-grade-page .cdg-case .cdg-flip__face{ background:transparent; }
body .cd-grade-page .cdg-case .cdg-flip__face img{ object-fit:contain; }
body .cd-grade-page .cdg-case .cdg-slab__pic.cdg-flip .cdg-flip__inner{ aspect-ratio:auto; height:100%; }
body .cd-grade-page .cdg-case .cdg-flip__face,
body .cd-grade-page .cdg-case .cdg-flip__face img{ border-radius:4.7% / 3.4%; }
/* v10.46 (Nachtrag 2) — DIE KARTE MITTIG IM WEISSEN RECHTECK DER CASE-FRONT.
   Mert, 15.10.2026: „das overlay muss einfach nach oben verschoben werden – das weiße Rechteck, das lange, umrandet die
   Karte quasi mit gleichmäßigem Abstand" und „nicht drüber/drunter". Gemessen in Merts Case-Front (1600 × 2000, Case bei
   x 300–1300, y 120–1808 = 80 × 135 mm, 12,5 px/mm): die vier weißen Balken um die Karte — oben y 551–565, unten y 1684–1698,
   links x 382–396, rechts x 1204–1217; Innenkante also x 396 … 1204, y 565,1 … 1684,8 (807,9 × 1119,7 px = 64,63 × 89,58 mm, Kanten auf Bruchteile eines Bildpunkts),
   Mitte x 800 | y 1124,95. Die Karte (63 × 88 mm = 787,5 × 1100 px) liegt jetzt genau mittig darin: Abstand links = rechts
   0,82 mm, oben = unten 0,79 mm, an keiner Seite drüber oder drunter. In % des Cases: left 10,625 %,
   top 26,952 %, 78,75 % × 65,1659 %, Mitte 50 | 59,535 %. (Bis hierher: 10,3125 | 26,622 | 79,375 × 65,832 = Fach 63,5 × 88,9 mm —
   mittig, aber rundum ungleich: seitlich 0,57, oben/unten 0,44 mm.) Schalter zurück: Klasse cdg-case--fach-alt (Filter card_docu_cert_slab_fach =
   'alt') bzw. im Schaufenster …&fach=alt. */
body .cd-grade-page .cdg-slab.cdg-case .cdg-slab__pic{ left:10.625%; top:26.952%; width:78.75%; height:65.1659%; }
body .cd-grade-page .cdg-slab.cdg-case.cdg-case--fach-alt .cdg-slab__pic{ left:10.3125%; top:26.622%; width:79.375%; height:65.832%; }
/* Gekippt wird jetzt das ganze Case (pgs-slab.js misst den Zeiger am ruhenden .cdg-slab); die Karte liegt fest im Fach. */
body .cd-grade-page .cdg-case .cdg-slab__pic.cdg-tilt-on{ transform:none; }

/* Merts Case-Front: ganz oben, unverändert. Groß = sein Original (1600 × 2000, Case-Ausschnitt über die Lage). */
body .cd-grade-page .cdg-case__front{
  position:absolute; z-index:3; left:0; top:0; width:100%; height:100%; display:block; pointer-events:none;
  background:url(case-front.webp) 50% 38.463% / 160% 118.483% no-repeat;
}
/* Am PC mit einfacher Pixeldichte ist das Case höchstens 380 px breit — dort reicht die kleine Fassung aus 10.45. */
@media (min-width:861px) and (max-resolution:1.2dppx){
  body .cd-grade-page .cdg-case__front{ background:url(case-front-s.webp) 0 0 / 100% 100% no-repeat; }
}

/* GOLD LABEL (viermal Teilnote 10, istGoldLabel wie im Schaufenster): ein goldener Schein HINTER dem Case — wie
   .st-slab.gold der Anzeige. Case-Front und Label bleiben unverändert. */
body .cd-grade-page .cdg-case.cdg-case--gold .cdg-case__box{
  border-radius:2.2% / 1.3%;
  box-shadow:0 0 1.8rem -.3rem rgba(226,169,60,.6);
}

/* „Karte umdrehen" unter dem Case (ArtFusion ≤ 1.3.5 hängte den Knopf absolut unter die Fläche). */
body .cd-grade-page .cdg-slab--flip.cdg-case .cdg-flip__btn{
  position:relative; left:auto; top:auto; width:100%; margin-top:12px; box-sizing:border-box;
}

/* Mert, 15.10.2026: „unten ein kleiner hinweis text … nur digital nachbildung des slabs". */
body .cd-grade-page .cdg-case__hinweis{
  margin:10px 0 0; padding:0 4px; text-align:center;
  font-size:11.5px; line-height:1.45; letter-spacing:.01em; color:rgba(200,210,230,.62);
}

@media (max-width:860px){
  body .cd-grade-page .cdg-slab.cdg-case{ max-width:420px; }
  body .cd-grade-page .cdg-case__hinweis{ font-size:12px; }
}
@media (prefers-reduced-motion: reduce){
  body .cd-grade-page .cdg-case__box{ transform:none; transition:none; }
}

/* ═══ v10.47 — WIE DER ECHTE SLAB (Merts Fotos echter Slabs, 15.10.2026; Rechnung und Herkunft: pgs-slab.js, druckEcht) ═══
   Beides nur mit dem DRUCKBILD von ArtFusion (.cdg-case--druck); lädt das Bild nicht (.pgsaf-zert-aus), gilt nichts davon. */

/* 1. Dunkler Einleger hinter dem Cutout: ein schwarzes Rechteck um das Kartenfach (Karte 63 × 88 mm + je 3 mm, mittig im weißen
      Rechteck: Mitte 50 | 59,535 %, 69 × 94 mm = 86,25 % × 69,609 % des Cases). Es liegt UNTER dem Druckbild — wo gedruckt ist,
      verdeckt es das Motiv, sichtbar ist es nur im durchsichtigen Kartenfenster (66,2 × 90,8 mm), also als Rand um die Karte. */
body .cd-grade-page .cdg-case.cdg-case--druck.cdg-case--einleger:not(.pgsaf-zert-aus) .cdg-case__motiv::before{
  content:""; position:absolute; left:6.875%; top:24.7305%; width:86.25%; height:69.609%;
  border-radius:4.35% / 3.19%; background:#08080a; pointer-events:none;
}

/* 2. Zwei-Teil-Front (wie ArtFusion 1.3.7): unten wie bisher ab der Naht (20,6 % = 27,81 mm), oben dasselbe Bild 1,815 mm
      (1,3441 %) tiefer bis zur Naht — im eigenen Element beschnitten bei 100 − 20,6 + 1,3441 = 80,7441 % von unten. */
body .cd-grade-page .cdg-case__front--oben{ display:none; }
body .cd-grade-page .cdg-case.cdg-case--front-zwei.cdg-case--druck:not(.pgsaf-zert-aus) .cdg-case__front{
  -webkit-clip-path:inset(20.6% 0 0 0); clip-path:inset(20.6% 0 0 0);
}
body .cd-grade-page .cdg-case.cdg-case--front-zwei.cdg-case--druck:not(.pgsaf-zert-aus) .cdg-case__front.cdg-case__front--oben{
  display:block; transform:translateY(1.3441%);
  -webkit-clip-path:inset(0 0 80.7441% 0); clip-path:inset(0 0 80.7441% 0);
}
/* Die Oberkante des Cases liegt damit 1,815 mm tiefer: Motiv/Druckbild erst ab dort (wie die Leinwand im Studio). */
body .cd-grade-page .cdg-case.cdg-case--front-zwei.cdg-case--druck:not(.pgsaf-zert-aus) .cdg-case__motiv{
  -webkit-clip-path:inset(1.3441% 0 0 0 round 2.2% / 1.3%); clip-path:inset(1.3441% 0 0 0 round 2.2% / 1.3%);
}
/* Papier-Label doch an (data-fa-papier="1"): mit dem oberen Teil der Front 1,815 mm tiefer, mittig im verschobenen Fenster. */
body .cd-grade-page .cdg-case.cdg-case--front-zwei.cdg-case--druck:not(.pgsaf-zert-aus) .cdg-case__label{ top:4.3507%; }