/* Beanlings Booster: Illustrationsstil (31.10.2026). Schrift Grandstander (SIL OFL 1.1, schrift/Grandstander-OFL.txt)
   einmal für alle Karten; Karten selbst sind inline-SVG (js/karte.js), hier nur Hülle, Plaketten und Binder-Filter. */
@font-face{font-family:'Grandstander';font-weight:700;font-display:swap;src:url(../schrift/Grandstander-700-latin.woff2) format('woff2')}
@font-face{font-family:'Grandstander';font-weight:800;font-display:swap;src:url(../schrift/Grandstander-800-latin.woff2) format('woff2')}
.kt.kt-i{border-radius:6%/4.3%;filter:drop-shadow(2px 3px 0 #0007)}
.kt-i .kt-flaeche{position:absolute;inset:0}
.kt-i .kt-illu,.kt-i .kt-flaeche canvas{display:block;width:100%;height:100%}
.kt-illu text{font-family:'Grandstander',system-ui,sans-serif}
.kt-i .kt-folie,.kt-i .kt-glitzer{display:none}
.kt.kt-i.auf.st-mythisch,.kt.kt-i.auf.st-goettlich,.kt.kt-i.auf.st-einzigartig{animation:auf2 .7s ease-out}
.kt.kt-i.auf{animation-timing-function:ease-out}
/* Binder-Plakette */
.kt-plak{position:absolute;left:4%;right:4%;bottom:3%;display:flex;align-items:center;gap:3px;pointer-events:none;font:800 11px/1 'Grandstander',system-ui,sans-serif}
.kt-plak-st{background:#2a1f1af0;border:2px solid;border-radius:8px;padding:3px 5px 2px;white-space:nowrap;letter-spacing:.3px}
.kt-plak-var{display:flex;gap:2px}
.kt-plak-var i{font-style:normal;display:inline-grid;place-items:center;width:15px;height:15px;border-radius:50%;background:#f6edd6;color:#2a1f1a;border:1.5px solid #2a1f1a;font-size:9px}
.kt-plak-var i.kt-v-erstausgabe{background:#f6edd6;color:#b3202a;border-color:#b3202a}
.kt-plak-var i.kt-v-glanz{background:#c9b8f0}
.kt-plak-var i.kt-v-fehldruck{color:#b3202a}
.kt-plak-n{margin-left:auto;background:#f2c35b;color:#2a1f1a;border:2px solid #2a1f1a;border-radius:8px;padding:3px 5px 2px}
/* Binder: Filterleiste und Übersicht */
.bi-filter{display:flex;gap:6px;overflow-x:auto;padding:4px 2px 8px;margin:6px -4px 0;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.bi-filter button{flex:0 0 auto;min-height:36px;padding:6px 10px;border-radius:18px;border:2px solid var(--holz-d,#3a2414);background:#2a1f1a;color:#f3e3c3;
  font:800 13px/1 'Grandstander',system-ui,sans-serif;cursor:pointer}
.bi-filter button[aria-pressed="true"]{background:#f6edd6;color:#2a1f1a;box-shadow:inset 0 0 0 2px #f2c35b}
.bi-filter button b{font-weight:800}
.bi-filter button small{font-weight:700;opacity:.8;margin-left:4px}
.bi-uebersicht{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin:4px 0 2px}
.bi-uebersicht button{border:2px solid #2a1f1a;border-radius:10px;background:#2a1f1a;padding:5px 2px 4px;cursor:pointer;color:#f3e3c3;
  font:700 10px/1.1 'Grandstander',system-ui,sans-serif;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:44px}
.bi-uebersicht button b{font-size:15px;font-weight:800}
.bi-uebersicht button.null{opacity:.45}
.bi-uebersicht button[aria-pressed="true"]{outline:3px solid #f2c35b;outline-offset:1px}
.bi-leer{font-size:13px;color:var(--perg-m,#c2ab86);margin:6px 0}
/* Großansicht Rückseite im Zeichenstil */
.bo-illu .rs{border-radius:18px;border:4px solid #2a1f1a;box-shadow:inset 0 0 0 5px #8a5a32,inset 0 0 0 7px #2a1f1a;background:#f6edd6}
.bo-illu .rs{font-family:'Grandstander',system-ui,sans-serif;font-weight:700}
.bo-illu .rs-titel{font-family:'Grandstander',system-ui,sans-serif;font-weight:800;font-size:26px;color:#2a1f1a}
.bo-illu .rs-unter,.bo-illu .rs-k,.bo-illu .rs-wk{font-family:'Grandstander',system-ui,sans-serif;font-weight:700;font-size:13px;letter-spacing:.3px}
.bo-illu .rs-wz{font-family:'Grandstander',system-ui,sans-serif;font-weight:800;font-size:20px}
.bo-illu .rs-balken i{border-radius:3px}
.bo-illu .rs-wk{display:flex;align-items:center;gap:4px}
.bo-illu .rs-wert:nth-child(1) .rs-wk::before,.bo-illu .rs-wert:nth-child(2) .rs-wk::before,.bo-illu .rs-wert:nth-child(3) .rs-wk::before{content:'';width:18px;height:18px;flex:0 0 18px;background:center/contain no-repeat}
.bo-illu .rs-wert:nth-child(1) .rs-wk::before{background-image:url(../grafik/illu/e/wert_kraft.svg)}
.bo-illu .rs-wert:nth-child(2) .rs-wk::before{background-image:url(../grafik/illu/e/wert_leben.svg)}
.bo-illu .rs-wert:nth-child(3) .rs-wk::before{background-image:url(../grafik/illu/e/wert_tempo.svg)}
.bo-illu .rs-wert{grid-template-columns:82px 1fr 28px}
.el-ikon-i{vertical-align:-2px}
/* Booster-Päckchen gezeichnet (31.10.2026, js/karte.js iPackung, illustration/paeckchen.py): Ebenen + Schrift darüber */
.ipack{position:relative;display:block;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.ipack img{position:absolute;left:0;top:0;width:100%;height:100%;display:block;pointer-events:none;-webkit-user-drag:none}
.ipack .ip-koerper{z-index:0}.ipack .ip-zu,.ipack .ip-riss{z-index:1}.ipack .ip-los{z-index:3}
.ipack .ip-riss,.ipack .ip-los{visibility:hidden}
.ip-text{position:absolute;z-index:2;transform:translate(-50%,-50%);white-space:nowrap;line-height:1;pointer-events:none;
  font-family:'Grandstander',system-ui,sans-serif;font-weight:800}
.ip-oben{color:#f6edd6;-webkit-text-stroke:.24em #2a1f1a;paint-order:stroke fill}
.ip-titel{color:#f2c35b;-webkit-text-stroke:.16em #2a1f1a;paint-order:stroke fill;text-shadow:.05em .08em 0 #2a1f1a}
.ip-name{color:#2a1f1a;max-width:54%;overflow:hidden;text-overflow:ellipsis;padding-bottom:.08em}
.ipack .ip-los.fliegt{animation:ip-fliegt .7s cubic-bezier(.3,.1,.7,1) forwards}
@keyframes ip-fliegt{0%{transform:translateY(-1.5%) rotate(7deg)}30%{transform:translate(5%,-12%) rotate(16deg)}
  100%{transform:translate(70vw,-70vh) rotate(64deg);opacity:0}}
.oe-pack.oe-ipack.schwebt{animation:oe-rein .7s cubic-bezier(.2,.9,.3,1.1) both,oe-schweben 2.4s .7s ease-in-out infinite}
.oe-pack.oe-ipack.offen .oe-koerper{animation:oe-ruck .3s ease-out}
@media (prefers-reduced-motion:reduce){.ipack .ip-los,.oe-pack.oe-ipack{animation:none!important}}
/* 31.10.2026 Info: „So funktioniert's“ */
.so-schritte{margin:6px 0 12px;padding-left:22px;line-height:1.45}
.so-schritte li{margin:6px 0}
/* 31.10.2026 Chancen-/Variantentabelle: Namen nicht mitten im Wort umbrechen */
.tafel table td:first-child{white-space:nowrap}
/* 31.10.2026 Freundescode */
.fr-code{font-size:1.6rem;letter-spacing:.08em;margin:8px 0;user-select:all}
/* 31.10.2026: vier Reiter in der Sammlung passen in eine Zeile */
.segment .knopf{white-space:nowrap;padding-left:6px;padding-right:6px;font-size:.92em;min-width:0}
