/* CCG printables: A4 pages, one resource per page. Screen view shows the pages as sheets. */
@page{size:A4;margin:12mm}
*{box-sizing:border-box}
body{margin:0;background:#E9E4DA;font-family:"Andika","Montserrat",system-ui,sans-serif;color:#2A1E14}
.e,.emo{font-family:"Noto Color Emoji","Apple Color Emoji","Segoe UI Emoji",sans-serif}
.ptools{position:sticky;top:0;z-index:5;background:#1F2A44;color:#fff;display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;padding:10px 16px;font-family:"Montserrat",system-ui,sans-serif;font-size:.9rem}
.ptools a{color:#fff}
.ptools b{font-size:1rem}
.ptools .ver{opacity:.75;font-size:.78rem}
.ptools button{font:inherit;font-weight:600;background:#F5B700;color:#1F2A44;border:0;border-radius:6px;padding:8px 16px;cursor:pointer}
.ptools nav{display:flex;flex-wrap:wrap;gap:6px 12px}
.sheet{background:#fff;width:min(210mm,100% - 32px);min-height:270mm;margin:16px auto;padding:12mm;box-shadow:0 2px 10px rgba(0,0,0,.15);display:flex;flex-direction:column;gap:6mm}
.sheet h1{font-size:22pt;margin:0;line-height:1.15}
.sheet h2{font-size:15pt;margin:0}
.sheet .tag{font-family:"Montserrat",system-ui,sans-serif;font-size:8pt;letter-spacing:.12em;text-transform:uppercase;color:#6B6157;display:flex;justify-content:space-between;gap:8px}
.sheet p,.sheet li{font-size:12pt;line-height:1.45;margin:0}
.sheet ul,.sheet ol{margin:0;padding-left:1.3em;display:flex;flex-direction:column;gap:2mm}
.grid{display:grid;gap:5mm;grid-template-columns:repeat(var(--cols,3),1fr)}
.card{border:2.5px dashed #9C8F80;border-radius:5mm;padding:4mm;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2mm;min-height:var(--h,58mm);break-inside:avoid}
.card .emo{font-size:var(--es,34pt);line-height:1.1}
.card b{font-size:var(--bs,14pt)}
.card small{font-size:9pt;color:#6B6157}
.card svg{width:var(--sv,38mm);height:var(--sv,38mm)}
.loopcard{border:4px solid #2A1E14;border-radius:8mm;min-height:115mm;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4mm;text-align:center;padding:8mm;break-inside:avoid}
.loopcard .emo{font-size:70pt;line-height:1}
.loopcard b{font-size:40pt}
.loopcard span{font-size:16pt;max-width:150mm}
.loopcard .num{font-family:"Montserrat",system-ui,sans-serif;font-size:11pt;color:#6B6157}
table.rec{width:100%;border-collapse:collapse;font-size:10pt}
table.rec th,table.rec td{border:1px solid #9C8F80;padding:2mm;text-align:left;vertical-align:top}
table.rec th{background:#F3EEE6;font-weight:700}
table.rec td{height:8mm}
.lines{display:flex;flex-direction:column;gap:0}
.lines div{border-bottom:1px solid #9C8F80;height:10mm}
.field{border:2px solid #2A1E14;border-radius:4mm;padding:3mm 4mm;display:flex;flex-direction:column;gap:2mm;break-inside:avoid}
.field b{font-size:12pt}
.field .box{flex:1;min-height:var(--fh,18mm)}
.badge{width:62mm;height:62mm;border-radius:50%;border:4px solid #2E8B57;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin:auto;gap:1mm}
.badge .emo{font-size:30pt}
.badge b{font-size:18pt}
.badge small{font-size:9pt}
.poster{border:6px solid var(--pc,#0F6E7A);border-radius:10mm;padding:10mm;display:flex;flex-direction:column;gap:7mm;flex:1}
.poster h1{font-size:30pt;text-align:center}
.poster .rule{display:flex;gap:6mm;align-items:center}
.poster .rule .emo{font-size:40pt;flex:0 0 auto}
.poster .rule span{font-size:20pt;line-height:1.3}
.sheet.compact{gap:3.5mm}.sheet.compact p,.sheet.compact li{font-size:10.5pt;line-height:1.38}.sheet.compact h1{font-size:19pt}.sheet.compact h2{font-size:13pt}
.key{font-size:9pt;color:#6B6157;border-top:1px solid #DDD3C5;padding-top:2mm;margin-top:auto}
.cut{font-size:9pt;color:#6B6157}
@media screen and (max-width:640px){.sheet{padding:16px;min-height:0}.grid{--cols:2!important}.grid>*{min-width:0}.card [data-blip]{width:100%!important;height:auto!important;aspect-ratio:1}.card svg{width:100%;height:auto}.loopcard b{font-size:28pt}.badge{width:36vw;height:36vw}.badge b{font-size:13pt}table.rec{font-size:8pt;word-break:break-word}table.rec th,table.rec td{padding:1mm}}
@media print{
  body{background:#fff}
  .ptools{display:none}
  .sheet{box-shadow:none;margin:0;width:auto;min-height:0;padding:0;break-after:page;height:auto}
  .sheet:last-child{break-after:auto}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

.pp{display:flex;gap:3mm;align-items:baseline;font-size:11.5pt!important}
.pp .star{font-size:16pt;line-height:1;color:#B98A3C;flex:none}
.ppname{display:grid;grid-template-columns:auto 1fr auto 40mm;gap:3mm;align-items:end;font-size:12pt}
.ppname .line{border-bottom:1.5px solid #2A1E14;height:8mm}
.cert{flex:1;border:3px double #6E1E2B;border-radius:6mm;padding:12mm;display:flex;flex-direction:column;align-items:center;text-align:center;gap:5mm}
.cert .seal{font-size:40pt;line-height:1}
.cert .c1{font-size:14pt!important}
.cert .cname{width:70%;border-bottom:2px solid #2A1E14;height:14mm}
.clist{text-align:left;align-self:stretch;margin:2mm 8mm!important}
.clist li{font-size:11.5pt!important}
.csign{margin-top:auto;align-self:stretch;display:grid;grid-template-columns:1fr 1fr;gap:16mm}
.csign span{border-top:1.5px solid #2A1E14;padding-top:2mm;font-size:10pt;color:#6B6157}