*{box-sizing:border-box}body{margin:0;background:#eee;color:#111;font:16px/1.5 system-ui,sans-serif}aside{max-width:760px;margin:24px auto;padding:16px}aside a{color:#294e40}.sheet{width:190mm;min-height:270mm;margin:20px auto;padding:12mm;background:white}h1{font:28px Georgia,serif}h2{font-size:19px;margin:20px 0 8px}svg{width:100%;display:block;margin:20px 0;font:20px system-ui,sans-serif}.tokens{display:grid;grid-template-columns:repeat(8,18mm);gap:3mm;margin:12mm 0}.token{width:18mm;height:18mm;display:grid;place-items:center;border:1px dashed black;border-radius:50%;font-size:32px}.dark{background:#777;color:black}.light{background:white;color:black}@media(max-width:760px){.sheet{width:auto;min-height:0;margin:12px;padding:20px}.tokens{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.token{width:100%;height:auto;aspect-ratio:1}}@page{size:A4 portrait;margin:10mm}@media print{body{background:white;font-size:11pt}aside{display:none}.sheet{width:190mm;height:277mm;min-height:0;margin:0;padding:6mm;break-after:page;overflow:visible}.sheet:last-child{break-after:auto}.tokens{grid-template-columns:repeat(8,18mm);gap:3mm}.token{width:18mm;height:18mm}.dark{background:#777;print-color-adjust:exact}svg{print-color-adjust:exact}}