:root {
  --deco-washi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 70'%3E%3Cpath d='M60 64h56l-8-10H60z' fill='%23c2593b' fill-opacity='.75'/%3E%3Ccircle cx='42' cy='35' r='32' fill='%23d9a02b'/%3E%3Ccircle cx='42' cy='35' r='32' fill='none' stroke='%23b07d17' stroke-width='2'/%3E%3Ccircle cx='42' cy='35' r='14' fill='%23efe6d6' stroke='%23b07d17' stroke-width='2'/%3E%3Cpath d='M18 20l6 6M24 46l6 6M54 14l4 7M60 46l5 5M14 36h8M62 34h8' stroke='%23fff' stroke-opacity='.55' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
  --deco-seal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cpath d='M45 4c8 0 10 6 17 8s12 0 16 7-1 11 1 18 8 9 5 17-10 7-14 13-2 12-10 16-11-2-18 0-10 8-17 4-4-11-10-15-14-1-15-10 6-10 6-17-6-12-1-18 12-2 17-7 7-16 23-16z' fill='%238e2b2b'/%3E%3Ccircle cx='45' cy='45' r='24' fill='none' stroke='%235e1717' stroke-width='3'/%3E%3Cpath d='M45 30c8 7 8 19 0 30-8-11-8-23 0-30z' fill='%235e1717'/%3E%3C/svg%3E");
  --deco-leaf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 140'%3E%3Cpath d='M40 136V20' stroke='%235f7a4c' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Cg fill='%237f9a6a'%3E%3Cpath d='M40 30c-14-6-22-2-24 2 8 8 16 8 24-2z'/%3E%3Cpath d='M40 30c14-6 22-2 24 2-8 8-16 8-24-2z'/%3E%3Cpath d='M40 54c-16-6-26-2-28 3 10 9 19 8 28-3z'/%3E%3Cpath d='M40 54c16-6 26-2 28 3-10 9-19 8-28-3z'/%3E%3Cpath d='M40 78c-17-5-27 0-28 5 10 8 20 7 28-5z'/%3E%3Cpath d='M40 78c17-5 27 0 28 5-10 8-20 7-28-5z'/%3E%3Cpath d='M40 102c-15-4-24 1-25 6 9 7 18 6 25-6z'/%3E%3Cpath d='M40 102c15-4 24 1 25 6-9 7-18 6-25-6z'/%3E%3Cpath d='M40 22c-4-10 0-16 0-18 4 4 6 10 0 18z'/%3E%3C/g%3E%3C/svg%3E");
  --deco-pen: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 170 34'%3E%3Crect x='6' y='9' width='96' height='16' rx='8' fill='%2323180f'/%3E%3Crect x='70' y='9' width='8' height='16' fill='%23b8862b'/%3E%3Cpath d='M102 11h20l26 6-26 6h-20z' fill='%232f2620'/%3E%3Cpath d='M122 11l38 6-38 6z' fill='%23d9a02b'/%3E%3Cpath d='M132 17h22' stroke='%238a6514' stroke-width='1.5'/%3E%3Crect x='18' y='6' width='34' height='4' rx='2' fill='%23b8862b'/%3E%3C/svg%3E");
  --deco-palette: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 130 80'%3E%3Crect x='4' y='8' width='122' height='64' rx='8' fill='%23e9e4da' stroke='%239aa3ab' stroke-width='3'/%3E%3Cg%3E%3Crect x='14' y='18' width='30' height='20' rx='4' fill='%23c2593b'/%3E%3Crect x='50' y='18' width='30' height='20' rx='4' fill='%23d9a02b'/%3E%3Crect x='86' y='18' width='30' height='20' rx='4' fill='%237f9a6a'/%3E%3Crect x='14' y='44' width='30' height='20' rx='4' fill='%233d4f8f'/%3E%3Crect x='50' y='44' width='30' height='20' rx='4' fill='%237a3b69'/%3E%3Crect x='86' y='44' width='30' height='20' rx='4' fill='%232f8f9d'/%3E%3C/g%3E%3Cpath d='M18 22h10M54 22h10M90 22h10' stroke='%23fff' stroke-opacity='.5' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
  --deco-brayer: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 70'%3E%3Crect x='8' y='8' width='72' height='28' rx='14' fill='%232f2620'/%3E%3Crect x='14' y='12' width='60' height='6' rx='3' fill='%23fff' fill-opacity='.18'/%3E%3Cpath d='M80 22h18l20 26' stroke='%239aa3ab' stroke-width='5' fill='none' stroke-linecap='round'/%3E%3Crect x='110' y='42' width='34' height='14' rx='7' fill='%238a5a2b' transform='rotate%2852 127 49%29'/%3E%3C/svg%3E");
  --deco-hoop: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 110'%3E%3Ccircle cx='50' cy='60' r='40' fill='%23f4ede0' stroke='%23c99c64' stroke-width='9'/%3E%3Ccircle cx='50' cy='60' r='45' fill='none' stroke='%23a8773f' stroke-width='3'/%3E%3Crect x='42' y='8' width='16' height='14' rx='3' fill='%23b8862b'/%3E%3Cpath d='M30 62l8-8 8 8 8-8 8 8 8-8' fill='none' stroke='%237a3b69' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M34 74h32' stroke='%23c2593b' stroke-width='3' stroke-dasharray='4 4'/%3E%3C/svg%3E");
  --deco-swatch: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 120'%3E%3Cg transform='rotate%28-14 30 110%29'%3E%3Crect x='12' y='10' width='38' height='96' rx='4' fill='%23fffdf7' stroke='%23d9cbb0'/%3E%3Crect x='16' y='14' width='30' height='24' fill='%237f9a6a'/%3E%3Crect x='16' y='42' width='30' height='24' fill='%239db58a'/%3E%3Crect x='16' y='70' width='30' height='24' fill='%23c2d3b3'/%3E%3C/g%3E%3Cg%3E%3Crect x='38' y='8' width='38' height='96' rx='4' fill='%23fffdf7' stroke='%23d9cbb0'/%3E%3Crect x='42' y='12' width='30' height='24' fill='%23c2593b'/%3E%3Crect x='42' y='40' width='30' height='24' fill='%23d98b70'/%3E%3Crect x='42' y='68' width='30' height='24' fill='%23eebca9'/%3E%3C/g%3E%3Cg transform='rotate%2814 70 110%29'%3E%3Crect x='62' y='10' width='38' height='96' rx='4' fill='%23fffdf7' stroke='%23d9cbb0'/%3E%3Crect x='66' y='14' width='30' height='24' fill='%233d4f8f'/%3E%3Crect x='66' y='42' width='30' height='24' fill='%236f7fb5'/%3E%3Crect x='66' y='70' width='30' height='24' fill='%23a7b2d8'/%3E%3C/g%3E%3C/svg%3E");
  --deco-type: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 90'%3E%3Crect x='8' y='14' width='64' height='70' rx='4' fill='%23b07d4f'/%3E%3Crect x='8' y='14' width='64' height='10' fill='%23c99c64'/%3E%3Crect x='14' y='6' width='52' height='14' rx='2' fill='%235c6b73'/%3E%3Ctext x='40' y='68' font-family='Georgia, serif' font-size='44' font-weight='700' text-anchor='middle' fill='%233b2a17' transform='scale%28-1 1%29 translate%28-80 0%29'%3EA%3C/text%3E%3C/svg%3E");
  --deco-clip: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 110'%3E%3Cpath d='M14 30V16a8 8 0 0116 0v70a14 14 0 01-28 0V24' fill='none' stroke='%23b8862b' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
  --deco-binder_unused: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 90'%3E%3Cpath d='M10 40h60l-6 44H16z' fill='%2323180f'/%3E%3Cpath d='M20 40C20 14 30 6 40 6s20 8 20 34' fill='none' stroke='%23b8862b' stroke-width='5'/%3E%3Cpath d='M26 40C26 20 32 14 40 14s14 6 14 26' fill='none' stroke='%23d9a02b' stroke-width='3'/%3E%3C/svg%3E");
  --deco-shears: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 80'%3E%3Cpath d='M56 40L134 12M56 40l78 28' stroke='%23b9c1c8' stroke-width='8' stroke-linecap='round'/%3E%3Cpath d='M56 40L134 12' stroke='%238d969e' stroke-width='2'/%3E%3Cellipse cx='28' cy='22' rx='20' ry='13' fill='none' stroke='%2323180f' stroke-width='8'/%3E%3Cellipse cx='28' cy='58' rx='20' ry='13' fill='none' stroke='%2323180f' stroke-width='8'/%3E%3Ccircle cx='56' cy='40' r='4' fill='%23b8862b'/%3E%3C/svg%3E");
  --deco-needle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 70'%3E%3Cpath d='M10 58L118 12' stroke='%239aa3ab' stroke-width='3' stroke-linecap='round'/%3E%3Cellipse cx='112' cy='15' rx='5' ry='2' fill='none' stroke='%235c6b73' stroke-width='1.5' transform='rotate%28-23 112 15%29'/%3E%3Cpath d='M112 15c10 10 30 0 34 14s-24 22-40 30' fill='none' stroke='%23c2593b' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
  --deco-spool: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 70 90'%3E%3Crect x='8' y='6' width='54' height='10' rx='3' fill='%23b07d4f'/%3E%3Crect x='8' y='74' width='54' height='10' rx='3' fill='%23b07d4f'/%3E%3Crect x='16' y='16' width='38' height='58' fill='%233d4f8f'/%3E%3Cpath d='M16 24h38M16 32h38M16 40h38M16 48h38M16 56h38M16 64h38' stroke='%232c3a6b' stroke-width='2'/%3E%3C/svg%3E");
  --deco-yarn: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 130 100'%3E%3Cpath d='M8 92L74 14M22 96L96 22' stroke='%23b07d4f' stroke-width='4' stroke-linecap='round'/%3E%3Ccircle cx='74' cy='14' r='5' fill='%235c6b73'/%3E%3Ccircle cx='96' cy='22' r='5' fill='%235c6b73'/%3E%3Ccircle cx='70' cy='62' r='32' fill='%237f9a6a'/%3E%3Cpath d='M42 52c18-8 42-6 58 8M40 70c22-10 46-6 60 8M52 90c12-12 30-16 46-10M64 32c-8 20-6 44 6 62' fill='none' stroke='%235f7a4c' stroke-width='3'/%3E%3C/svg%3E");
  --deco-button: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Ccircle cx='30' cy='30' r='27' fill='%23c2593b'/%3E%3Ccircle cx='30' cy='30' r='20' fill='none' stroke='%23fff' stroke-opacity='.3' stroke-width='3'/%3E%3Ccircle cx='24' cy='24' r='3.5' fill='%237d3320'/%3E%3Ccircle cx='36' cy='24' r='3.5' fill='%237d3320'/%3E%3Ccircle cx='24' cy='36' r='3.5' fill='%237d3320'/%3E%3Ccircle cx='36' cy='36' r='3.5' fill='%237d3320'/%3E%3C/svg%3E");
  --deco-button2: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Ccircle cx='30' cy='30' r='27' fill='%237f9a6a'/%3E%3Ccircle cx='30' cy='30' r='20' fill='none' stroke='%23fff' stroke-opacity='.3' stroke-width='3'/%3E%3Ccircle cx='24' cy='24' r='3.5' fill='%234a5e3c'/%3E%3Ccircle cx='36' cy='24' r='3.5' fill='%234a5e3c'/%3E%3Ccircle cx='24' cy='36' r='3.5' fill='%234a5e3c'/%3E%3Ccircle cx='36' cy='36' r='3.5' fill='%234a5e3c'/%3E%3C/svg%3E");
  --deco-brush: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 30'%3E%3Cpath d='M4 15c0-3 30-6 80-5v10c-50 1-80-2-80-5z' fill='%2323180f'/%3E%3Crect x='84' y='9' width='26' height='12' fill='%23b8862b'/%3E%3Cpath d='M110 9c22 0 40 4 44 6-4 2-22 6-44 6z' fill='%236b4a2b'/%3E%3Cpath d='M140 13c6 1 10 2 14 2-4 0-8 1-14 2z' fill='%233d4f8f'/%3E%3C/svg%3E");
  --deco-ruler: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 30'%3E%3Crect x='2' y='4' width='176' height='22' rx='2' fill='%23c8cfd4' stroke='%238d969e' stroke-width='2'/%3E%3Cpath d='M14 4v9M24 4v5M34 4v9M44 4v5M54 4v9M64 4v5M74 4v9M84 4v5M94 4v9M104 4v5M114 4v9M124 4v5M134 4v9M144 4v5M154 4v9M164 4v5' stroke='%2323180f' stroke-width='1.6'/%3E%3C/svg%3E");
  --deco-pencil: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 170 26'%3E%3Crect x='10' y='5' width='120' height='16' fill='%2323180f'/%3E%3Crect x='10' y='5' width='120' height='5' fill='%233a312b'/%3E%3Crect x='4' y='5' width='8' height='16' fill='%23b8862b'/%3E%3Cpath d='M130 5l30 8-30 8z' fill='%23d8b98c'/%3E%3Cpath d='M152 11l8 2-8 2z' fill='%2323180f'/%3E%3C/svg%3E");
  --deco-stamp: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 106'%3E%3Crect x='4' y='4' width='82' height='98' fill='%23fffdf7' stroke='%23d9cbb0' stroke-width='2' stroke-dasharray='5 4'/%3E%3Crect x='12' y='12' width='66' height='70' fill='%23e3ecf2'/%3E%3Cpath d='M45 24c12 10 12 26 0 40-12-14-12-30 0-40z' fill='%233d4f8f'/%3E%3Ctext x='45' y='96' font-family='Georgia, serif' font-size='11' font-weight='700' text-anchor='middle' fill='%2323180f'%3EAMELIO%3C/text%3E%3C/svg%3E");
  --deco-envelope: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'%3E%3Crect x='4' y='6' width='112' height='70' rx='4' fill='%23fffdf7' stroke='%23d9cbb0' stroke-width='3'/%3E%3Cpath d='M4 10l56 36 56-36' fill='none' stroke='%23d9cbb0' stroke-width='3'/%3E%3Ccircle cx='60' cy='46' r='12' fill='%238e2b2b'/%3E%3C/svg%3E");
  --deco-compass: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Ccircle cx='45' cy='45' r='40' fill='%23fffdf7' stroke='%23b8862b' stroke-width='6'/%3E%3Ccircle cx='45' cy='45' r='31' fill='none' stroke='%23d9cbb0' stroke-width='1.5'/%3E%3Cpath d='M45 14l8 31-8 31-8-31z' fill='%23c2593b'/%3E%3Cpath d='M45 45h8l-8 31-8-31z' fill='%233d4f8f'/%3E%3Ccircle cx='45' cy='45' r='4' fill='%2323180f'/%3E%3C/svg%3E");
  --deco-book: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 90'%3E%3Crect x='8' y='54' width='94' height='16' rx='2' fill='%233d4f8f'/%3E%3Crect x='14' y='38' width='84' height='16' rx='2' fill='%237f9a6a'/%3E%3Crect x='4' y='70' width='100' height='16' rx='2' fill='%23c2593b'/%3E%3Crect x='20' y='22' width='70' height='16' rx='2' fill='%23d9a02b'/%3E%3Cpath d='M26 30h30M10 78h40M20 46h24M14 62h36' stroke='%23fffdf7' stroke-opacity='.6' stroke-width='2'/%3E%3C/svg%3E");
  --deco-magnifier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='40' cy='40' r='28' fill='%23e3ecf2' fill-opacity='.7' stroke='%23b8862b' stroke-width='7'/%3E%3Cpath d='M62 62l30 30' stroke='%2323180f' stroke-width='11' stroke-linecap='round'/%3E%3C/svg%3E");
  --deco-key: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 50'%3E%3Ccircle cx='26' cy='25' r='18' fill='none' stroke='%23b8862b' stroke-width='8'/%3E%3Cpath d='M44 25h70M98 25v14M110 25v10' stroke='%23b8862b' stroke-width='8' stroke-linecap='round'/%3E%3C/svg%3E");
  --deco-mug: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Crect x='12' y='26' width='50' height='56' rx='8' fill='%235c6b73'/%3E%3Cpath d='M62 38h8a12 12 0 010 24h-8' fill='none' stroke='%235c6b73' stroke-width='7'/%3E%3Cg fill='%23fff' fill-opacity='.35'%3E%3Ccircle cx='22' cy='40' r='1.6'/%3E%3Ccircle cx='34' cy='52' r='1.6'/%3E%3Ccircle cx='48' cy='38' r='1.6'/%3E%3Ccircle cx='28' cy='66' r='1.6'/%3E%3Ccircle cx='50' cy='62' r='1.6'/%3E%3C/g%3E%3Cpath d='M26 8c-6 8 6 10 0 18M40 8c-6 8 6 10 0 18' fill='none' stroke='%23a3865c' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
  --deco-coin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 70 70'%3E%3Ccircle cx='35' cy='35' r='31' fill='%23d9a02b' stroke='%239c6f12' stroke-width='4'/%3E%3Ccircle cx='35' cy='35' r='22' fill='none' stroke='%239c6f12' stroke-width='2' stroke-dasharray='3 3'/%3E%3Ctext x='35' y='44' font-family='Georgia, serif' font-size='26' font-weight='700' text-anchor='middle' fill='%236b4a0b'%3E%24%3C/text%3E%3C/svg%3E");
  --deco-receipt: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 110'%3E%3Cpath d='M6 4h48v94l-6-6-6 6-6-6-6 6-6-6-6 6-6-6-6 6z' fill='%23fffdf7' stroke='%23d9cbb0' stroke-width='2'/%3E%3Cpath d='M14 20h32M14 32h24M14 44h32M14 56h20M14 72h32' stroke='%23a3865c' stroke-width='3'/%3E%3C/svg%3E");
  --deco-bus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 60'%3E%3Crect x='4' y='6' width='100' height='40' rx='8' fill='%232f6f7d'/%3E%3Crect x='12' y='12' width='16' height='14' fill='%23e3ecf2'/%3E%3Crect x='32' y='12' width='16' height='14' fill='%23e3ecf2'/%3E%3Crect x='52' y='12' width='16' height='14' fill='%23e3ecf2'/%3E%3Crect x='74' y='12' width='22' height='22' fill='%23e3ecf2'/%3E%3Cpath d='M4 34h100' stroke='%23d9a02b' stroke-width='4'/%3E%3Ccircle cx='26' cy='48' r='8' fill='%2323180f'/%3E%3Ccircle cx='82' cy='48' r='8' fill='%2323180f'/%3E%3C/svg%3E");
  --deco-seed: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 110'%3E%3Cpath d='M6 8l6-4 6 4 6-4 6 4 6-4 6 4 6-4 6 4 6-4 6 4 6-4v98H6z' fill='%23f4ead2'/%3E%3Crect x='12' y='18' width='56' height='50' rx='2' fill='%237f9a6a'/%3E%3Cpath d='M40 60V34' stroke='%233f5530' stroke-width='3'/%3E%3Cpath d='M40 42c-10-10-18-6-20-2 6 6 14 6 20 2zM40 38c8-10 18-8 20-4-6 8-14 8-20 4z' fill='%23e4ecd9'/%3E%3Cpath d='M14 80h52M14 90h36' stroke='%23a3865c' stroke-width='3'/%3E%3C/svg%3E");
  --deco-spoon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 40'%3E%3Cellipse cx='130' cy='20' rx='24' ry='14' fill='%23b07d4f'/%3E%3Cellipse cx='130' cy='20' rx='15' ry='8' fill='%239a6a3a'/%3E%3Crect x='6' y='16' width='104' height='8' rx='4' fill='%23b07d4f'/%3E%3C/svg%3E");
  --deco-whisk: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 50'%3E%3Crect x='4' y='20' width='60' height='10' rx='5' fill='%2323180f'/%3E%3Cpath d='M64 25c30-22 70-22 90 0-20 22-60 22-90 0z M64 25c30-12 70-12 90 0M64 25c30 12 70 12 90 0' fill='none' stroke='%239aa3ab' stroke-width='2.5'/%3E%3C/svg%3E");
  --deco-hammer: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 60'%3E%3Crect x='6' y='26' width='80' height='10' rx='5' fill='%23b07d4f'/%3E%3Cpath d='M84 10h22v18H84zM84 34h22v14H84z' fill='%238d969e'/%3E%3Crect x='80' y='20' width='10' height='22' fill='%235c6b73'/%3E%3C/svg%3E");
  --deco-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 70'%3E%3Ccircle cx='25' cy='20' r='14' fill='%23c2593b'/%3E%3Ccircle cx='20' cy='15' r='4' fill='%23fff' fill-opacity='.45'/%3E%3Cpath d='M25 34v30' stroke='%238d969e' stroke-width='3'/%3E%3C/svg%3E");
  --deco-twine: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'%3E%3Cellipse cx='44' cy='40' rx='36' ry='32' fill='%23c9a46b'/%3E%3Cpath d='M12 30c20-6 44-6 64 0M10 42c22-6 46-6 68 0M14 54c18-5 42-5 60 0' fill='none' stroke='%23a07a3f' stroke-width='3'/%3E%3Cellipse cx='44' cy='40' rx='10' ry='9' fill='%23efe6d6'/%3E%3Cpath d='M78 46c14 2 24 10 36 26' fill='none' stroke='%23c9a46b' stroke-width='3'/%3E%3C/svg%3E");
  --deco-knife: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 30'%3E%3Crect x='4' y='9' width='96' height='12' rx='6' fill='%235c6b73'/%3E%3Cpath d='M20 9v12M30 9v12M40 9v12' stroke='%233f4a50' stroke-width='2'/%3E%3Crect x='100' y='8' width='14' height='14' fill='%23b8862b'/%3E%3Cpath d='M114 8l42 7-42 7z' fill='%23d6dce0'/%3E%3C/svg%3E");
  --deco-plate: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='44' fill='%23efe6d6' stroke='%23c2593b' stroke-width='4'/%3E%3Ccircle cx='50' cy='50' r='30' fill='none' stroke='%23d98b70' stroke-width='2' stroke-dasharray='2 6'/%3E%3C/svg%3E");
}

/* ==========================================================================
   Amelio Services — the maker's studio (draft 6)
   A mature, hand-made look for an adult audience: letterpress, bookbinding,
   quilting, embroidery, printmaking, watercolor and studio tools. Every page
   is its own project with its own materials. Words always sit on solid paper,
   paper keeps dark ink in every color mode, and Simple view removes all of it.
   ========================================================================== */

/* ---------- Refinements to the base craft look ---------- */
:root {
  --font-display: "Fraunces", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --table: #ece4d6; --paper: #ece4d6;
  --linen: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Cpath d='M0 0h6v1H0zM0 3h6v1H0z' fill='%23786247' fill-opacity='.07'/%3E%3Cpath d='M0 0v6h1V0zM3 0v6h1V0z' fill='%23786247' fill-opacity='.05'/%3E%3C/svg%3E");
  --sketch: 12px 16px 13px 17px / 15px 12px 16px 13px;
  --sketch-2: 16px 12px 17px 13px / 13px 16px 12px 15px;
}
body { background-image: var(--grain), var(--linen); background-color: var(--table); }
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 650; font-variation-settings: "SOFT" 60, "opsz" 72; letter-spacing: -.01em; }
h1 { font-weight: 700; font-variation-settings: "SOFT" 80, "opsz" 144; letter-spacing: -.015em; }
.hand { font-family: var(--font-display); font-style: italic; font-weight: 500; font-size: 1.1em; }
.marker { background: linear-gradient(transparent 58%, rgba(217, 160, 43, .38) 58% 92%, transparent 92%); padding: 0 .05em; }
.eyebrow { font-weight: 800; letter-spacing: .12em; font-size: .78rem; background-color: rgba(239, 230, 214, .92); }
.btn { border-radius: 10px; }
.btn-primary { box-shadow: 0 3px 0 color-mix(in srgb, var(--action) 55%, #000); }
.btn-secondary { box-shadow: 0 2px 0 var(--ink); }
.primary-nav a { font-weight: 700; }
.chip, .chip-btn { border-radius: 999px; }
.route-line > li.is-here .stop-name::after { font-family: var(--font-display); font-style: italic; font-weight: 600; font-size: .95em; }
.collage-note::before, .index-card::before { background: radial-gradient(circle at 35% 35%, rgba(255, 255, 255, .7), #8a6a4a 60%); }

/* The service area becomes a printed map with pins (no toy town) */
.town-set {
  background-color: #f4ecdc; border-radius: 6px; padding: var(--space-6) var(--space-5);
  background-image: repeating-radial-gradient(circle at 30% 40%, transparent 0 26px, rgba(61, 79, 143, .08) 26px 27px), repeating-radial-gradient(circle at 75% 70%, transparent 0 34px, rgba(127, 154, 106, .1) 34px 35px);
  box-shadow: inset 0 0 0 10px #fffdf7, inset 0 0 0 11px #c9b791, var(--shadow-lift);
}
.town-set::before { display: none; }
.town { gap: 14px 12px; padding: 0; justify-content: flex-start; }
.house { --w: auto; min-height: 0; margin-top: 0; padding: .45rem .8rem .45rem 1.9rem; background: #fffdf7 !important; color: #23180f; border-radius: 4px; box-shadow: 0 1px 0 rgba(0, 0, 0, .12), 0 6px 10px -6px rgba(70, 45, 20, .55); transform: none !important; font-size: .95rem; text-align: left; place-items: start; }
.house::before { content: ""; position: absolute; left: .6rem; top: 50%; right: auto; bottom: auto; width: .75rem; height: .75rem; margin-top: -.375rem; border-radius: 50%; background: var(--roof, #c2593b); clip-path: none; box-shadow: 0 0 0 2px #fffdf7, 0 0 0 3px rgba(35, 24, 15, .3); }
.house::after { display: none; }
.house span { padding-bottom: 0; }
.town > li.home-base .house::before { width: 1rem; height: 1rem; margin-top: -.5rem; background: #23180f; }
.town > li.home-base .house span::before { content: ""; }
.road, .town-bus { display: none; }
.town > li:nth-child(9n+1) .house { --roof: #d9a02b; } .town > li:nth-child(9n+2) .house { --roof: #c2593b; } .town > li:nth-child(9n+3) .house { --roof: #8e2b2b; }
.town > li:nth-child(9n+4) .house { --roof: #7a3b69; } .town > li:nth-child(9n+5) .house { --roof: #5b3e8f; } .town > li:nth-child(9n+6) .house { --roof: #3d4f8f; }
.town > li:nth-child(9n+7) .house { --roof: #2f6f9d; } .town > li:nth-child(9n+8) .house { --roof: #2f8f9d; } .town > li:nth-child(9n+9) .house { --roof: #7f9a6a; }

/* ---------- Shared pieces for the simpler layout ---------- */
.page-nav { padding-block: 0 var(--space-5); }
.page-nav .wrap { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-3); align-items: center; }
.page-nav-label { font-weight: 800; color: #23180f; background: #fffdf7; padding: .3em .8em; border-radius: 4px; box-shadow: var(--shadow); }
.page-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.page-nav li { margin: 0; }
.page-nav a {
  display: inline-flex; align-items: center; gap: .45em; min-height: 44px; padding: .4em .95em;
  background: #fffdf7; color: #23180f; font-weight: 700; text-decoration: none;
  border: 1.5px solid #8d755a; border-radius: 999px; box-shadow: 0 2px 0 rgba(35, 24, 15, .25);
}
.page-nav a:hover { border-color: #23180f; box-shadow: 0 3px 0 rgba(35, 24, 15, .4); }
.page-nav a .icon { color: #2f6f7d; }
.center-link { text-align: center; margin-top: var(--space-5); max-width: none; }
.petal-help { max-width: 34rem; text-align: center; background: #fffdf7; color: #23180f; padding: .55rem .95rem; border-radius: 4px; box-shadow: var(--shadow); }
.petal-collage .petal-btn:focus-visible .petal-ring { stroke: var(--focus); stroke-width: 7; }
.petal-collage text { font-family: var(--font-display); font-style: italic; font-weight: 500; }

/* Patchwork quilt in muted fabrics (five support areas) */
.quilt { list-style: none; margin: 0; padding: 12px; display: grid; gap: 0; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13.5rem), 1fr)); background: #4a3b2e; border-radius: 6px; box-shadow: var(--shadow-lift); }
.quilt-square {
  margin: 0; max-width: none; position: relative; padding: var(--space-5) var(--space-4);
  background-color: var(--qa, #f1e7d6); color: #23180f;
  outline: 1.5px dashed rgba(35, 24, 15, .4); outline-offset: -9px;
  display: flex; flex-direction: column; gap: .45rem;
}
.quilt-square.c-purple { --qa: #e8dde6; background-image: repeating-linear-gradient(45deg, rgba(122, 59, 105, .1) 0 2px, transparent 2px 10px); }
.quilt-square.c-green { --qa: #e3e9db; background-image: radial-gradient(rgba(95, 122, 76, .22) 1.6px, transparent 2px); background-size: 12px 12px; }
.quilt-square.c-sky { --qa: #dde7ea; background-image: repeating-linear-gradient(0deg, rgba(47, 111, 125, .1) 0 1px, transparent 1px 8px), repeating-linear-gradient(90deg, rgba(47, 111, 125, .1) 0 1px, transparent 1px 8px); }
.quilt-square.c-orange { --qa: #f1ddd2; background-image: repeating-linear-gradient(-45deg, rgba(194, 89, 59, .12) 0 3px, transparent 3px 11px); }
.quilt-square.c-yellow { --qa: #f3e7c8; background-image: radial-gradient(circle at 50% 50%, rgba(217, 160, 43, .2) 2px, transparent 2.6px); background-size: 16px 16px; }
.quilt-square h3 { font-size: var(--step-1); color: #23180f; }
.quilt-square p, .quilt-square li { color: #2b2014; }
.quilt-square ul { padding-left: 1.1em; display: grid; gap: .15rem; font-size: var(--step--1); }
.quilt-square li + li { margin: 0; }
.quilt-icon { width: 2.8rem; height: 2.8rem; display: grid; place-items: center; border-radius: 50%; background: #fffdf7; color: #2f2620; box-shadow: 0 0 0 1.5px rgba(35, 24, 15, .35); }
.quilt-icon .icon { width: 1.35rem; height: 1.35rem; }

/* Quick fact cards */
.fact-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.fact-cards:has(> li:nth-child(5):last-child) { grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); } /* five facts share one row on a wide screen instead of leaving one alone below */
.fact-cards > li { margin: 0; max-width: none; background: #fffdf7; color: #23180f; padding: var(--space-4) var(--space-4) var(--space-5); border-top: 5px solid var(--c); box-shadow: var(--shadow); display: flex; flex-direction: column; gap: .4rem; --ink: #23180f; --link: #1b5ca2; }
.fact-cards h3 { font-size: var(--step-1); color: #23180f; display: flex; gap: .45rem; align-items: center; }
.fact-cards p { color: #2b2014; }

/* Open/close folds */
.fold { margin-top: var(--space-5); background: #fffdf7; color: #23180f; border-radius: 4px; box-shadow: var(--shadow); border-left: 5px solid var(--c, #2f6f7d); --ink: #23180f; --ink-2: #47372a; --link: #1b5ca2; }
.fold > summary { cursor: pointer; list-style: none; padding: var(--space-4) var(--space-5); font-weight: 700; font-family: var(--font-display); font-size: var(--step-1); display: flex; align-items: center; gap: .5rem; }
.fold > summary::-webkit-details-marker { display: none; }
.fold > summary::after { content: "+"; margin-left: auto; font-family: var(--font-body); font-weight: 700; font-size: 1.3rem; line-height: 1; width: 1.9rem; height: 1.9rem; display: grid; place-items: center; border: 1.5px solid #23180f; border-radius: 50%; }
.fold[open] > summary::after { content: "–"; }
.fold > :not(summary) { margin: 0 var(--space-5) var(--space-5); }

/* Section heads are paper labels, so words never sit on a pattern */
.section-head { background: #fffdf7; color: #23180f; padding: var(--space-4) var(--space-5); border-radius: 3px; box-shadow: var(--shadow); --ink: #23180f; --ink-2: #47372a; --link: #1b5ca2; width: fit-content; max-width: min(100%, 52rem); position: relative; }
.section-head h2 { color: #23180f; }
.section-head p { color: #47372a; }
:root[data-look="simple"] .section-head { box-shadow: none; border: 2px solid var(--line-strong); }

/* ---------- Hero banner, themed by custom properties ---------- */
.page-hero .wrap > .page-hero-paper, .page-hero-paper {
  --ink: #23180f; --ink-2: #47372a; --ink-3: #5a4836; --link: #1b5ca2; --surface: #fffdf7; --line-strong: #a3865c;
  color: var(--hero-ink, #23180f);
  background-color: var(--hero-bg, #fffdf7);
  background-image: var(--hero-img, var(--fiber));
  background-size: var(--hero-size, auto);
  border: var(--hero-border, 0);
  border-top: var(--hero-top, 8px solid var(--c, #2f6f7d));
  border-radius: var(--hero-radius, 3px);
  box-shadow: var(--hero-shadow, var(--shadow));
  outline: var(--hero-outline, 0); outline-offset: var(--hero-outline-offset, -12px);
  transform: rotate(var(--hero-rot, -.3deg));
}
.page-hero-paper h1, .page-hero-paper .lead, .page-hero-paper p { color: var(--hero-ink, #23180f); }
.page-hero-paper .breadcrumbs a, .page-hero-paper .breadcrumbs ol { color: var(--hero-ink-2, #47372a); }
.page-hero .wrap { position: relative; }
@media (min-width: 760px) {
  .page-hero .wrap::before, .page-hero .wrap::after {
    content: ""; position: absolute; z-index: 3; pointer-events: none; background-repeat: no-repeat; background-size: contain; background-position: center;
    filter: drop-shadow(0 4px 3px rgba(60, 40, 20, .3));
  }
  .page-hero .wrap::before { background-image: var(--d1, none); width: var(--d1-w, 150px); height: var(--d1-h, 40px); top: var(--d1-top, -16px); right: var(--d1-right, 8%); transform: rotate(var(--d1-rot, -8deg)); }
  .page-hero .wrap::after { background-image: var(--d2, none); width: var(--d2-w, 80px); height: var(--d2-h, 80px); bottom: var(--d2-bottom, -26px); right: var(--d2-right, 3%); transform: rotate(var(--d2-rot, 10deg)); }
}

/* ==========================================================================
   The projects
   ========================================================================== */

/* Home: mixed-media collage on linen */
@media (min-width: 1000px) {
  .theme-collage .collage-hero .wrap { position: relative; }
  .theme-collage .collage-hero .wrap::before { content: ""; position: absolute; left: -16px; bottom: -40px; width: 110px; height: 70px; background: var(--deco-washi) no-repeat center / contain; transform: rotate(-10deg); filter: drop-shadow(0 4px 3px rgba(60, 40, 20, .3)); pointer-events: none; }
  .theme-collage .collage-hero .wrap::after { content: ""; position: absolute; right: 4px; top: -20px; width: 70px; height: 120px; background: var(--deco-leaf) no-repeat center / contain; transform: rotate(16deg); filter: drop-shadow(0 4px 3px rgba(60, 40, 20, .25)); pointer-events: none; }
}
.theme-collage .hero-sheet::before { background: rgba(217, 160, 43, .55); }
.theme-collage .hero-sheet::after { background: rgba(47, 111, 125, .45); }

/* Start here: letterpress card on heavy cotton paper */
.theme-letterpress body { background-color: #e6ddd0; }
.theme-letterpress {
  --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 2px; --hero-rot: 0deg;
  --hero-shadow: 0 1px 0 rgba(0, 0, 0, .08), 0 22px 34px -18px rgba(60, 40, 20, .55);
  --d1: var(--deco-type); --d1-w: 76px; --d1-h: 86px; --d1-top: -34px; --d1-rot: 8deg; --d2: var(--deco-brayer); --d2-w: 140px; --d2-h: 64px; --d2-rot: -6deg;
}
.theme-letterpress .page-hero .wrap > .page-hero-paper { clip-path: polygon(0 1%, 3% 0, 7% .8%, 12% 0, 18% .6%, 25% 0, 33% .7%, 41% 0, 50% .8%, 58% 0, 66% .6%, 74% 0, 82% .7%, 90% 0, 96% .6%, 100% 0, 99.6% 20%, 100% 40%, 99.5% 60%, 100% 80%, 99.6% 100%, 90% 99.3%, 80% 100%, 70% 99.4%, 60% 100%, 50% 99.3%, 40% 100%, 30% 99.4%, 20% 100%, 10% 99.3%, 0 100%, .4% 80%, 0 60%, .5% 40%, 0 20%); }
.theme-letterpress .page-hero .wrap > .page-hero-paper h1 { color: #2c2a4a; text-shadow: 0 1px 0 rgba(255, 255, 255, .8), 0 -1px 0 rgba(0, 0, 0, .12); }
.theme-letterpress .er-section { --ink: #23180f; --ink-2: #47372a; --link: #1b5ca2; color: #23180f; background: #fbf7ee; border-radius: 2px; box-shadow: 0 1px 0 rgba(0, 0, 0, .08), 0 14px 22px -14px rgba(60, 40, 20, .5); border-left: 6px solid var(--c); }
.theme-letterpress .er-section .er-pic { border-radius: 50%; background: #fffdf7; color: #2c2a4a; box-shadow: inset 0 2px 3px rgba(0, 0, 0, .18), 0 0 0 2px var(--c); }
.theme-letterpress .er-section h2 { color: #2c2a4a; }

/* Learn about SDP: a cloth-bound field guide with tabbed sections */
.theme-fieldguide body { background-color: #e3dccf; }
.theme-fieldguide {
  --hero-bg: #2c3a5c; --hero-ink: #f6efe0; --hero-ink-2: #e7dfcc; --hero-top: 0; --hero-radius: 3px 10px 10px 3px; --hero-rot: 0deg;
  --hero-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4'%3E%3Cpath d='M0 0h4v1H0z' fill='%23fff' fill-opacity='.05'/%3E%3Cpath d='M0 0v4h1V0z' fill='%23000' fill-opacity='.08'/%3E%3C/svg%3E");
  --hero-shadow: -14px 0 0 #1f2a44, 0 20px 32px -16px rgba(30, 20, 10, .6);
  --hero-outline: 1.5px solid rgba(217, 160, 43, .7); --hero-outline-offset: -14px;
  --d1: var(--deco-leaf); --d1-w: 60px; --d1-h: 110px; --d1-top: -40px; --d1-rot: 14deg; --d2: var(--deco-magnifier); --d2-w: 80px; --d2-h: 80px;
}
.theme-fieldguide .page-hero .wrap > .page-hero-paper { margin-left: 14px; --link: #f0cf86; }
.theme-fieldguide .page-hero .wrap > .page-hero-paper h1 { color: #f3d996; }
.theme-fieldguide .page-hero .wrap > .page-hero-paper .eyebrow { background: #f3d996; color: #23180f; }
.theme-fieldguide .page-hero .wrap > .page-hero-paper a { color: #f0cf86; }
.theme-fieldguide .page-hero .wrap > .page-hero-paper .btn-primary { background: #f3d996; color: #23180f; box-shadow: 0 3px 0 #a9852f; }
.theme-fieldguide .page-hero .wrap > .page-hero-paper .btn-quiet, .theme-fieldguide .page-hero .wrap > .page-hero-paper .btn-ghost { background: #fff6dc; color: #23180f; border-color: #23180f; box-shadow: 0 3px 0 #a9852f; }
.theme-fieldguide .toc { background: #fbf7ee; padding: var(--space-4) var(--space-4) var(--space-5); border-radius: 2px; box-shadow: var(--shadow); --ink: #23180f; --ink-2: #47372a; }
.theme-fieldguide .toc h2 { color: #2c3a5c; font-family: var(--font-display); text-transform: none; letter-spacing: 0; font-size: var(--step-1); font-style: italic; }
.theme-fieldguide .toc ol { counter-reset: part; border-left: 0; }
.theme-fieldguide .toc li { counter-increment: part; }
.theme-fieldguide .toc a { color: #3b2c1f; border-left: 0; padding: .35em .2rem; border-bottom: 1px dotted #c9b791; }
.theme-fieldguide .toc a::before { content: counter(part) "  "; font-family: var(--font-display); font-weight: 700; color: #2c3a5c; }
.theme-fieldguide .prose { gap: var(--space-6); }
.theme-fieldguide .prose > section { background: #fbf7ee; padding: var(--space-5) var(--space-5) var(--space-5) var(--space-6); border-radius: 2px; box-shadow: var(--shadow); position: relative; --ink: #23180f; --ink-2: #47372a; --link: #1b5ca2; color: #23180f; }
.theme-fieldguide .prose > section::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 8px; background: var(--tab, #2f6f7d); }
.theme-fieldguide .prose > section:nth-of-type(6n+1) { --tab: #2f6f7d; } .theme-fieldguide .prose > section:nth-of-type(6n+2) { --tab: #c2593b; }
.theme-fieldguide .prose > section:nth-of-type(6n+3) { --tab: #d9a02b; } .theme-fieldguide .prose > section:nth-of-type(6n+4) { --tab: #7a3b69; }
.theme-fieldguide .prose > section:nth-of-type(6n+5) { --tab: #7f9a6a; } .theme-fieldguide .prose > section:nth-of-type(6n+6) { --tab: #3d4f8f; }
.theme-fieldguide .prose > section > h2 { color: #2c3a5c; margin-top: 0; }

/* Services: a quilt in muted fabrics, bound in a printed border */
.theme-quilt body { background-color: #eae2d2; }
.theme-quilt {
  --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 4px; --hero-border: 12px solid transparent;
  --hero-outline: 1.5px dashed rgba(35, 24, 15, .45); --hero-outline-offset: -8px;
  --d1: var(--deco-spool); --d1-w: 60px; --d1-h: 80px; --d1-top: -34px; --d1-rot: 12deg; --d2: var(--deco-shears); --d2-w: 130px; --d2-h: 74px; --d2-rot: -10deg;
}
.theme-quilt .page-hero .wrap > .page-hero-paper { border-image: repeating-linear-gradient(45deg, #d9a02b 0 14px, #c2593b 14px 28px, #3d4f8f 28px 42px, #7f9a6a 42px 56px) 12; }
.theme-quilt .service-panel, .theme-quilt .week-note { outline: 1.5px dashed rgba(35, 24, 15, .3); outline-offset: -8px; }
.theme-quilt .promise { background: #fffdf7; padding: var(--space-4); border-top-width: 5px; box-shadow: var(--shadow); color: #23180f; --ink: #23180f; --ink-2: #47372a; }
.theme-quilt .promise h3, .theme-quilt .promise p { color: #23180f; }

/* Community Living Supports: recipe cards on a striped linen tea towel */
.theme-recipe body { background-color: #efe8dc; background-image: var(--grain), repeating-linear-gradient(90deg, transparent 0 46px, rgba(61, 79, 143, .12) 46px 52px, transparent 52px 58px, rgba(61, 79, 143, .12) 58px 60px, transparent 60px 120px); }
.theme-recipe {
  --hero-bg: #fffef9; --hero-top: 0; --hero-radius: 4px;
  --hero-img: linear-gradient(#c2593b, #c2593b), var(--fiber); --hero-size: 100% 2px, auto;
  --d1: var(--deco-spoon); --d1-w: 160px; --d1-h: 40px; --d1-top: -16px; --d1-rot: -10deg; --d2: var(--deco-whisk); --d2-w: 150px; --d2-h: 48px; --d2-rot: 8deg;
}
.theme-recipe .page-hero .wrap > .page-hero-paper { background-position: 0 3.3rem, 0 0; background-repeat: no-repeat, repeat; }
.theme-recipe .page-hero .wrap > .page-hero-paper::before { content: "From the recipe box"; display: block; font-family: var(--font-display); font-style: italic; font-size: 1.05rem; color: #8e3b25; margin-bottom: -.2rem; }
.theme-recipe .card, .theme-recipe .service-panel, .theme-recipe .faq details { border-top: 4px solid #c2593b; }

/* Community Integration Supports: a travel journal */
.theme-passport body { background-color: #e2e6df; background-image: var(--grain), repeating-radial-gradient(circle at 20% 30%, transparent 0 28px, rgba(47, 111, 125, .06) 28px 29px), repeating-radial-gradient(circle at 80% 70%, transparent 0 36px, rgba(61, 79, 143, .05) 36px 37px); }
.theme-passport {
  --hero-bg: #f6f3ea; --hero-top: 0; --hero-radius: 4px; --hero-border: 1.5px solid #2c3a5c;
  --hero-img: repeating-linear-gradient(-30deg, rgba(44, 58, 92, .04) 0 2px, transparent 2px 9px), repeating-linear-gradient(30deg, rgba(47, 111, 125, .04) 0 2px, transparent 2px 9px);
  --d1: var(--deco-stamp); --d1-w: 80px; --d1-h: 96px; --d1-top: -32px; --d1-rot: 8deg; --d2: var(--deco-compass); --d2-w: 78px; --d2-h: 78px;
}
.theme-passport .page-hero .wrap > .page-hero-paper .eyebrow { background: #2c3a5c; color: #fffdf7; clip-path: none; border-radius: 3px; letter-spacing: .16em; }
.theme-passport .card, .theme-passport .service-panel { border: 1.5px solid #2c3a5c; }
.theme-passport .section-head::after { content: ""; position: absolute; right: -18px; top: -20px; width: 64px; height: 64px; border-radius: 50%; border: 2.5px solid rgba(142, 43, 43, .65); box-shadow: inset 0 0 0 5px rgba(255, 253, 247, .9), inset 0 0 0 6.5px rgba(142, 43, 43, .5); transform: rotate(-12deg); }

/* About Amelio: an artist's journal */
.theme-scrapbook body { background-color: #e1d6c3; }
.theme-scrapbook {
  --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 2px;
  --d1: var(--deco-washi); --d1-w: 100px; --d1-h: 64px; --d1-top: -30px; --d1-rot: 10deg; --d2: var(--deco-seal); --d2-w: 70px; --d2-h: 70px; --d2-rot: -8deg;
}
.theme-scrapbook .page-hero .wrap > .page-hero-paper::before, .theme-scrapbook .page-hero .wrap > .page-hero-paper::after { content: ""; position: absolute; width: 40px; height: 40px; background: #2f2620; opacity: .8; }
.theme-scrapbook .page-hero .wrap > .page-hero-paper::before { top: 0; left: 0; clip-path: polygon(0 0, 100% 0, 0 100%); }
.theme-scrapbook .page-hero .wrap > .page-hero-paper::after { bottom: 0; right: 0; clip-path: polygon(100% 0, 100% 100%, 0 100%); }

/* Families: embroidery on linen */
.theme-stitch body { background-color: #ebe3d4; }
.theme-stitch {
  --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 4px;
  --hero-outline: 2px dashed #7a3b69; --hero-outline-offset: -12px;
  --d1: var(--deco-hoop); --d1-w: 96px; --d1-h: 104px; --d1-top: -44px; --d1-rot: 6deg; --d2: var(--deco-needle); --d2-w: 140px; --d2-h: 64px; --d2-rot: -4deg;
}
.theme-stitch .section-head h2 { text-decoration: underline; text-decoration-style: dashed; text-decoration-color: #7a3b69; text-decoration-thickness: 2px; text-underline-offset: .3em; }
.theme-stitch .card, .theme-stitch .callout, .theme-stitch .steps > li { outline: 1.5px dashed rgba(122, 59, 105, .45); outline-offset: -7px; }

/* Professionals: manila folders on a slate desk */
.theme-office body { background-color: #d6dad8; }
.theme-office {
  --hero-bg: #f0dcae; --hero-top: 0; --hero-radius: 0 8px 8px 8px; --hero-rot: 0deg;
  --d1: var(--deco-clip); --d1-w: 32px; --d1-h: 92px; --d1-top: -38px; --d1-right: 12%; --d1-rot: 0deg; --d2: var(--deco-pen); --d2-w: 170px; --d2-h: 34px; --d2-bottom: -14px; --d2-rot: -6deg;
}
.theme-office .page-hero .wrap > .page-hero-paper { margin-top: 26px; }
.theme-office .page-hero .wrap > .page-hero-paper::before { content: "Professional file"; position: absolute; top: -26px; left: 0; height: 26px; padding: 0 1.1rem; display: flex; align-items: center; background: #f0dcae; border-radius: 8px 8px 0 0; font-weight: 800; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: #4a3a1c; }
.theme-office .card, .theme-office .service-panel, .theme-office .faq details, .theme-office .callout { border-left: 5px solid #d8bd80; }
.theme-office .section-head { border-left: 8px solid #f0dcae; }

/* Contact: fine stationery with a wax seal */
.theme-mail body { background-color: #e6e1d6; }
.theme-mail {
  --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 3px; --hero-border: 10px solid transparent;
  --d1: var(--deco-seal); --d1-w: 76px; --d1-h: 76px; --d1-top: -28px; --d1-rot: -8deg; --d2: var(--deco-pen); --d2-w: 170px; --d2-h: 34px; --d2-rot: -12deg;
}
.theme-mail .page-hero .wrap > .page-hero-paper { border-image: repeating-linear-gradient(135deg, #8e2b2b 0 10px, #fbf7ee 10px 20px, #2c3a5c 20px 30px, #fbf7ee 30px 40px) 10; }

/* Feedback: a wooden suggestion box with a brass slot */
.theme-suggestion body { background-color: #e3d7c4; }
.theme-suggestion {
  --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 4px;
  --d1: var(--deco-envelope); --d1-w: 104px; --d1-h: 70px; --d1-top: -34px; --d1-rot: -10deg; --d2: var(--deco-pencil); --d2-w: 160px; --d2-h: 26px; --d2-rot: 8deg;
}
.theme-suggestion .page-hero .wrap > .page-hero-paper::before { content: ""; display: block; height: 16px; width: min(55%, 320px); margin: 0 auto var(--space-4); background: #2b1f12; border-radius: 8px; box-shadow: 0 0 0 4px #b8862b, inset 0 3px 6px rgba(0, 0, 0, .6); }

/* Resources: a library card catalog */
.theme-library body { background-color: #e5dccb; background-image: var(--grain), repeating-linear-gradient(90deg, rgba(107, 74, 43, .14) 0 3px, transparent 3px 180px); }
.theme-library {
  --hero-bg: #fdf9ee; --hero-top: 0; --hero-radius: 2px;
  --hero-img: linear-gradient(90deg, transparent 0 74%, rgba(47, 111, 157, .12) 74% 74.3%, transparent 74.3%), repeating-linear-gradient(transparent 0 calc(2rem - 1px), rgba(47, 111, 157, .14) calc(2rem - 1px) 2rem);
  --d1: var(--deco-book); --d1-w: 116px; --d1-h: 92px; --d1-top: -46px; --d1-rot: 0deg; --d2: var(--deco-magnifier); --d2-w: 78px; --d2-h: 78px;
}
.theme-library .page-hero .wrap > .page-hero-paper::before { content: "Date due"; position: absolute; right: 26%; top: 12px; font-weight: 800; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: #2f6f9d; }
.theme-library .resource { border-left: 6px solid var(--c, #8d5f32); }

/* Tools: a maker's pegboard */
.theme-workshop body { background-color: #e2d4bd; background-image: radial-gradient(circle, rgba(70, 45, 20, .32) 2.5px, transparent 3px), var(--grain); background-size: 26px 26px, auto; }
.theme-workshop {
  --hero-bg: #fbf7ee; --hero-top: 0;
  --d1: var(--deco-ruler); --d1-w: 190px; --d1-h: 32px; --d1-top: -16px; --d1-rot: -4deg; --d2: var(--deco-knife); --d2-w: 160px; --d2-h: 30px; --d2-rot: 12deg;
}

/* My SDP Journey: a seed packet in the potting shed */
.theme-garden body { background-color: #e4e6d6; }
.theme-garden { --hero-bg: #f6efd8; --hero-top: 0; --hero-radius: 3px;
  --d1: var(--deco-seed); --d1-w: 74px; --d1-h: 100px; --d1-top: -40px; --d1-rot: 8deg; --d2: var(--deco-leaf); --d2-w: 56px; --d2-h: 100px; --d2-rot: -18deg; }
.theme-garden .page-hero .wrap > .page-hero-paper { clip-path: polygon(0 10px, 4% 0, 8% 10px, 12% 0, 16% 10px, 20% 0, 24% 10px, 28% 0, 32% 10px, 36% 0, 40% 10px, 44% 0, 48% 10px, 52% 0, 56% 10px, 60% 0, 64% 10px, 68% 0, 72% 10px, 76% 0, 80% 10px, 84% 0, 88% 10px, 92% 0, 96% 10px, 100% 0, 100% 100%, 0 100%); padding-top: calc(var(--space-6) + 10px); }

/* Spending Plan Helper: a bookkeeper's ledger */
.theme-ledger body { background-color: #e3e5da; }
.theme-ledger {
  --hero-bg: #f4f7ec; --hero-top: 0; --hero-radius: 2px;
  --hero-img: linear-gradient(90deg, transparent 0 3rem, rgba(142, 43, 43, .45) 3rem 3.08rem, transparent 3.08rem), repeating-linear-gradient(transparent 0 calc(1.8rem - 1px), rgba(95, 122, 76, .22) calc(1.8rem - 1px) 1.8rem);
  --d1: var(--deco-coin); --d1-w: 60px; --d1-h: 60px; --d1-top: -24px; --d1-rot: 0deg; --d2: var(--deco-receipt); --d2-w: 48px; --d2-h: 92px;
}
.theme-ledger .page-hero .wrap > .page-hero-paper { padding-left: 4.2rem; }

/* All About Me: a photo album */
.theme-polaroid body { background-color: #e8e0d8; }
.theme-polaroid { --hero-bg: #ffffff; --hero-top: 0; --hero-radius: 2px; --hero-border: 14px solid #ffffff; --hero-shadow: var(--shadow-lift);
  --d1: var(--deco-washi); --d1-w: 96px; --d1-h: 60px; --d1-top: -30px; --d1-rot: -10deg; --d2: var(--deco-brush); --d2-w: 150px; --d2-h: 28px; --d2-rot: -14deg; }
.theme-polaroid .page-hero .wrap > .page-hero-paper { border-bottom-width: 50px; }

/* Things to do nearby: a community board with tear-off flyers */
.theme-flyers body { background-color: #cdb48e; background-image: radial-gradient(rgba(90, 55, 20, .28) 1px, transparent 1.5px), radial-gradient(rgba(255, 235, 200, .22) 1px, transparent 1.5px), var(--grain); background-size: 9px 9px, 13px 13px, auto; background-position: 0 0, 4px 6px, 0 0; }
.theme-flyers { --hero-bg: #fbf3d8; --hero-top: 0; --hero-radius: 2px;
  --d1: var(--deco-pin); --d1-w: 36px; --d1-h: 52px; --d1-top: -24px; --d1-right: 48%; --d1-rot: 0deg; --d2: none; }
.theme-flyers .page-hero .wrap > .page-hero-paper { margin-bottom: 42px; }
.theme-flyers .page-hero .wrap > .page-hero-paper::after { content: ""; position: absolute; left: 0; right: 0; bottom: -40px; height: 40px; background: repeating-linear-gradient(90deg, #fbf3d8 0 54px, transparent 54px 60px); border-top: 1.5px dashed rgba(35, 24, 15, .4); }
.theme-flyers .idea { background: #fffdf7; box-shadow: var(--shadow); }
.theme-flyers .idea:nth-child(4n+2) { background: #fbf3d8; }
.theme-flyers .idea:nth-child(4n+3) { background: #eef2ec; }

/* Meeting Planner: a linen-bound notebook with an elastic band */
.theme-journal body { background-color: #e6e0d6; }
.theme-journal {
  --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 4px 12px 12px 4px; --hero-shadow: -12px 0 0 #5b3e8f, var(--shadow-lift);
  --hero-img: repeating-linear-gradient(transparent 0 calc(1.8rem - 1px), rgba(61, 79, 143, .12) calc(1.8rem - 1px) 1.8rem);
  --d1: var(--deco-pen); --d1-w: 170px; --d1-h: 34px; --d1-top: -14px; --d1-rot: -6deg; --d2: none;
}
.theme-journal .page-hero .wrap > .page-hero-paper { margin-left: 12px; }
.theme-journal .page-hero .wrap > .page-hero-paper::after { content: ""; position: absolute; top: 0; bottom: 0; right: 9%; width: 12px; background: #2f2620; opacity: .85; }

/* Glossary: typewritten index cards */
.theme-typewriter body { background-color: #e4e1da; }
.theme-typewriter { --hero-bg: #fffef9; --hero-top: 0; --hero-radius: 3px;
  --hero-img: linear-gradient(#c2593b, #c2593b), repeating-linear-gradient(transparent 0 calc(1.75rem - 1px), rgba(61, 79, 143, .16) calc(1.75rem - 1px) 1.75rem); --hero-size: 100% 2px, 100% 100%;
  --hero-shadow: 6px 6px 0 #efe6d6, 12px 12px 0 #e2d6c0, var(--shadow-lift);
  --d1: var(--deco-type); --d1-w: 70px; --d1-h: 80px; --d1-top: -32px; --d1-rot: -8deg; --d2: none; }
.theme-typewriter .page-hero .wrap > .page-hero-paper { background-position: 0 4.2rem, 0 4.4rem; background-repeat: no-repeat, repeat-y; }
.theme-typewriter .page-hero .wrap > .page-hero-paper h1 { font-family: "Courier New", Courier, monospace; font-weight: 700; letter-spacing: -.02em; }

/* Questions to Ask: a kraft field notebook */
.theme-fieldnotes body { background-color: #e5ddd0; }
.theme-fieldnotes { --hero-bg: #fbf7ee; --hero-top: 22px solid #c9a46b; --hero-radius: 3px;
  --hero-img: radial-gradient(rgba(70, 45, 20, .16) 1px, transparent 1.4px); --hero-size: 16px 16px;
  --d1: var(--deco-pencil); --d1-w: 160px; --d1-h: 26px; --d1-top: -10px; --d1-rot: -4deg; --d2: none; }

/* SDP Fit Check: a drafting sheet */
.theme-drafting body { background-color: #dfe5e8; background-image: var(--grain), linear-gradient(rgba(47, 111, 157, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(47, 111, 157, .07) 1px, transparent 1px); background-size: auto, 24px 24px, 24px 24px; }
.theme-drafting { --hero-bg: #fbfcf9; --hero-top: 0; --hero-radius: 2px;
  --hero-img: linear-gradient(rgba(47, 111, 157, .1) 1px, transparent 1px), linear-gradient(90deg, rgba(47, 111, 157, .1) 1px, transparent 1px); --hero-size: 12px 12px;
  --hero-outline: 1px solid rgba(47, 111, 157, .5); --hero-outline-offset: -10px;
  --d1: var(--deco-ruler); --d1-w: 180px; --d1-h: 30px; --d1-top: -14px; --d1-rot: -3deg; --d2: var(--deco-pencil); --d2-w: 150px; --d2-h: 24px; --d2-rot: 20deg; }

/* My Week and My Day: a dot-grid planner */
.theme-bujo body { background-color: #ece6dc; background-image: radial-gradient(rgba(70, 45, 20, .18) 1.1px, transparent 1.6px); background-size: 20px 20px; }
.theme-bujo { --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 4px;
  --hero-img: radial-gradient(rgba(70, 45, 20, .16) 1.1px, transparent 1.6px); --hero-size: 20px 20px;
  --d1: var(--deco-washi); --d1-w: 96px; --d1-h: 60px; --d1-top: -30px; --d1-rot: 10deg; --d2: var(--deco-pen); --d2-w: 160px; --d2-h: 32px; --d2-rot: -10deg; }
.theme-bujo .planner-panel { background-image: radial-gradient(rgba(70, 45, 20, .12) 1.1px, transparent 1.6px); background-size: 20px 20px; }

/* My dashboard: an artist's mood board */
.theme-moodboard body { background-color: #ddd5c8; background-image: var(--grain), var(--linen); }
.theme-moodboard {
  --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 2px;
  --d1: var(--deco-swatch); --d1-w: 100px; --d1-h: 110px; --d1-top: -46px; --d1-rot: 6deg; --d2: var(--deco-pin); --d2-w: 34px; --d2-h: 50px; --d2-bottom: auto; --d2-right: 50%; --d2-rot: 0deg;
}
.theme-moodboard .page-hero .wrap::after { top: -22px; }
.theme-moodboard .dash-top { border-top-color: #2c3a5c; }

/* Privacy: a leather journal with a strap */
.theme-diary body { background-color: #e5ded6; }
.theme-diary { --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 4px 14px 14px 4px; --hero-shadow: -12px 0 0 #6b3a2b, var(--shadow-lift);
  --d1: var(--deco-key); --d1-w: 108px; --d1-h: 44px; --d1-top: -18px; --d1-rot: -12deg; --d2: none; }
.theme-diary .page-hero .wrap > .page-hero-paper { margin-left: 12px; }
.theme-diary .page-hero .wrap > .page-hero-paper::after { content: ""; position: absolute; right: -10px; top: 50%; width: 30px; height: 50px; margin-top: -25px; border-radius: 6px; background: linear-gradient(180deg, #d9a02b, #9c6f12); box-shadow: 0 3px 4px rgba(0, 0, 0, .3); }

/* Accessibility: a large-print card */
.theme-bigprint body { background-color: #e5e6df; }
.theme-bigprint { --hero-bg: #fffdf7; --hero-top: 0; --hero-radius: 14px; --hero-rot: 0deg;
  --hero-shadow: 0 0 0 8px #fffdf7, 0 0 0 10px #23180f, var(--shadow-lift);
  --d1: var(--deco-magnifier); --d1-w: 86px; --d1-h: 86px; --d1-top: -40px; --d1-rot: 0deg; --d2: none; }
.theme-bigprint .page-hero .wrap > .page-hero-paper h1 { font-size: clamp(2.3rem, 1.6rem + 3vw, 3.4rem); }

/* Not found: a sketch on drawing paper */
.theme-sketch body { background-color: #e6e0d6; }
.theme-sketch { --hero-bg: #fbfaf6; --hero-top: 0; --hero-radius: 2px;
  --hero-img: linear-gradient(115deg, transparent 47%, rgba(0, 0, 0, .04) 48%, transparent 49%), linear-gradient(35deg, transparent 60%, rgba(0, 0, 0, .035) 61%, transparent 62%);
  --d1: var(--deco-pencil); --d1-w: 160px; --d1-h: 26px; --d1-top: -10px; --d1-rot: -8deg; --d2: none; }

/* Provider hub: the studio office board */
.theme-studio body { background-color: #cdb48e; background-image: radial-gradient(rgba(90, 55, 20, .28) 1px, transparent 1.5px), radial-gradient(rgba(255, 235, 200, .22) 1px, transparent 1.5px), var(--grain); background-size: 9px 9px, 13px 13px, auto; background-position: 0 0, 4px 6px, 0 0; }
.theme-studio { --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 2px;
  --d1: var(--deco-mug); --d1-w: 78px; --d1-h: 78px; --d1-top: -34px; --d1-rot: 0deg; --d2: var(--deco-clip); --d2-w: 30px; --d2-h: 86px; --d2-bottom: auto; --d2-right: 50%; --d2-rot: 0deg; }
.theme-studio .page-hero .wrap::after { top: -40px; }
.theme-studio .card { background-color: #fffdf7; }
.theme-studio .card:nth-child(3n+2) { background-color: #f6efd8; }
.theme-studio .card:nth-child(3n) { background-color: #eef2ec; }
.theme-studio .panel { background: #fffdf7; border: 0; border-radius: 3px; box-shadow: var(--shadow); --ink: #23180f; --ink-2: #47372a; color: #23180f; }

/* Invoice builder: a receipt book */
.theme-receipt body { background-color: #e5e2db; }
.theme-receipt { --hero-bg: #fffefb; --hero-top: 0; --hero-radius: 0;
  --d1: var(--deco-receipt); --d1-w: 48px; --d1-h: 92px; --d1-top: -40px; --d1-rot: 8deg; --d2: var(--deco-coin); --d2-w: 54px; --d2-h: 54px; }
.theme-receipt .page-hero .wrap > .page-hero-paper::after { content: ""; position: absolute; left: 0; right: 0; bottom: -10px; height: 10px; background: linear-gradient(-45deg, transparent 7px, #fffefb 0) 0 0 / 14px 14px repeat-x, linear-gradient(45deg, transparent 7px, #fffefb 0) 0 0 / 14px 14px repeat-x; }

/* Getting around: a transit timetable */
.theme-transit body { background-color: #e1e6e6; background-image: var(--grain), linear-gradient(rgba(47, 111, 125, .06) 2px, transparent 2px), linear-gradient(90deg, rgba(47, 111, 125, .06) 2px, transparent 2px); background-size: auto, 60px 60px, 60px 60px; }
.theme-transit { --hero-bg: #fbf7ee; --hero-top: 10px solid #2f6f7d; --hero-radius: 3px;
  --d1: var(--deco-bus); --d1-w: 124px; --d1-h: 68px; --d1-top: -44px; --d1-rot: -3deg; --d2: var(--deco-compass); --d2-w: 72px; --d2-h: 72px; }
.theme-transit .section-head h2::before { content: ""; display: inline-block; width: .8em; height: .8em; border-radius: 50%; border: 4px solid #2f6f7d; margin-right: .4em; vertical-align: -.02em; background: #fffdf7; }

/* Provider onboarding: a clipboard; Session guide: a production planner */
.theme-clipboard body { background-color: #e1e3da; }
.theme-clipboard { --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 3px; --hero-rot: 0deg;
  --hero-shadow: 0 0 0 12px #a8804f, var(--shadow-lift);
  --d1: var(--deco-clip); --d1-w: 32px; --d1-h: 92px; --d1-top: -46px; --d1-right: 46%; --d1-rot: 0deg; --d2: var(--deco-pen); --d2-w: 160px; --d2-h: 32px; --d2-rot: -8deg; }
.theme-clipboard .page-hero .wrap > .page-hero-paper { margin: 12px; }
.theme-planner body { background-color: #e3e4e8; }
.theme-planner { --hero-bg: #fbf7ee; --hero-top: 0; --hero-radius: 3px 10px 10px 3px; --hero-shadow: -10px 0 0 #2c3a5c, var(--shadow-lift);
  --hero-img: linear-gradient(rgba(44, 58, 92, .08) 1px, transparent 1px), linear-gradient(90deg, rgba(44, 58, 92, .08) 1px, transparent 1px); --hero-size: 26px 26px;
  --d1: var(--deco-swatch); --d1-w: 90px; --d1-h: 100px; --d1-top: -42px; --d1-rot: 8deg; --d2: var(--deco-pencil); --d2-w: 150px; --d2-h: 24px; --d2-rot: -6deg; }
.theme-planner .page-hero .wrap > .page-hero-paper { margin-left: 10px; }

/* ---------- Dark color mode: darker work surfaces, paper stays paper ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body { background-color: #241e19 !important; background-image: var(--grain), radial-gradient(rgba(255, 255, 255, .045) 1px, transparent 1.6px) !important; background-size: auto, 14px 14px !important; }
}
:root[data-theme="dark"] body { background-color: #241e19 !important; background-image: var(--grain), radial-gradient(rgba(255, 255, 255, .045) 1px, transparent 1.6px) !important; background-size: auto, 14px 14px !important; }

/* ---------- Simple view and high contrast: just the words ---------- */
:root[data-look="simple"] body, :root[data-contrast="high"] body { background-image: none !important; }
:root[data-look="simple"] .page-hero .wrap::before, :root[data-look="simple"] .page-hero .wrap::after,
:root[data-look="simple"] .page-hero-paper::before, :root[data-look="simple"] .page-hero-paper::after,
:root[data-look="simple"] .section-head::after, :root[data-look="simple"] .collage-hero .wrap::before, :root[data-look="simple"] .collage-hero .wrap::after,
:root[data-contrast="high"] .page-hero .wrap::before, :root[data-contrast="high"] .page-hero .wrap::after, :root[data-contrast="high"] .section-head::after { display: none !important; }
:root[data-look="simple"] .page-hero-paper { background-image: none !important; border: 2px solid var(--line-strong) !important; border-image: none !important; outline: 0 !important; box-shadow: none !important; clip-path: none !important; margin: 0 !important; padding-left: var(--space-6) !important; transform: none !important; background-color: #fffdf7 !important; }
:root[data-look="simple"] .page-hero-paper, :root[data-look="simple"] .page-hero-paper h1, :root[data-look="simple"] .page-hero-paper p, :root[data-look="simple"] .page-hero-paper .lead { color: #23180f !important; text-shadow: none !important; font-family: inherit; }
:root[data-look="simple"] .page-hero-paper h1 { font-family: var(--font-display) !important; }
:root[data-look="simple"] .page-hero-paper a { color: #1b5ca2 !important; }
:root[data-look="simple"] .page-hero-paper .btn-primary { background: var(--action) !important; color: var(--on-action) !important; }
:root[data-look="simple"] .page-hero-paper .btn:not(.btn-primary), :root[data-look="simple"] .page-hero-paper .btn:not(.btn-primary):hover, :root[data-look="simple"] .page-hero-paper .btn:not(.btn-primary):active { background: #fffdf7 !important; color: #23180f !important; border-color: #23180f !important; }
:root[data-look="simple"] .quilt { background: transparent; box-shadow: none; padding: 0; gap: var(--space-3); }
:root[data-look="simple"] .quilt-square { background-image: none !important; outline: 0; border: 2px solid var(--line-strong); }
:root[data-look="simple"] .fact-cards > li, :root[data-look="simple"] .page-nav a, :root[data-look="simple"] .fold { box-shadow: none; }
:root[data-look="simple"] .town-set { box-shadow: none; background-image: none; border: 2px solid var(--line-strong); }
@media print {
  .page-hero .wrap::before, .page-hero .wrap::after, .page-hero-paper::before, .page-hero-paper::after, .page-nav { display: none !important; }
  .page-hero-paper { background: #fff !important; color: #000 !important; border: 1px solid #999 !important; border-image: none !important; box-shadow: none !important; clip-path: none !important; transform: none !important; }
  .page-hero-paper h1, .page-hero-paper p { color: #000 !important; }
  body { background: #fff !important; }
}

/* Provider onboarding groups and the featured guide link */
.ob-group { padding: var(--space-4) var(--space-5) var(--space-5); border-left: 6px solid var(--c); display: flex; flex-direction: column; gap: var(--space-3); --ink: #23180f; --ink-2: #47372a; color: #23180f; background-color: #fffdf7; }
.ob-group h2 { font-size: var(--step-2); color: #23180f; }
.onboard-progress { --ink: #23180f; color: #23180f; background-color: #fffdf7; }
.featured-guide { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-4); align-items: center; padding: var(--space-4) var(--space-5); text-decoration: none; color: #23180f; background-color: #fffdf7; border-left: 6px solid #2f6f7d; --ink: #23180f; }
.featured-guide .fg-title { font-family: var(--font-display); font-size: var(--step-1); font-weight: 700; color: #23180f; }
.featured-guide .fg-go { font-weight: 800; color: #1b5ca2; display: inline-flex; align-items: center; gap: .3rem; }
.featured-guide:hover .fg-title { text-decoration: underline; }
@media (max-width: 640px) { .featured-guide { grid-template-columns: 1fr; } }

/* Simple text pages: keep the reading area on paper */
.theme-bigprint main .prose, .theme-diary main .prose { background: #fffdf7; color: #23180f; padding: var(--space-6) var(--space-6); border-radius: 3px; box-shadow: var(--shadow); --ink: #23180f; --ink-2: #47372a; --link: #1b5ca2; }
.theme-bigprint main .prose h2, .theme-diary main .prose h2 { color: #23180f; }

/* Keep wide content inside folds, and keep the passport stamp on the page on phones */
.fold, .prose > section, .prose > section > * { min-width: 0; max-width: 100%; }
@media (max-width: 760px) { .theme-passport .section-head::after { right: 6px; top: -14px; width: 46px; height: 46px; } }
p, li, dd, td { overflow-wrap: break-word; }
a[href^="mailto:"] { overflow-wrap: anywhere; }
/* Quilt rows always fill edge to edge */
.quilt { display: flex; flex-wrap: wrap; }
.quilt-square { flex: 1 1 12rem; }

/* ==========================================================================
   Color modes you can rely on (draft 6.1)
   Light paper stays light paper in dark mode, so everything printed on it
   (text, links, chips, buttons, tables, folds and messages) uses the
   light-mode colors. Each color class also carries its light-mode ink so a
   piece of paper inside a colored section still gets a readable accent.
   Surfaces that follow the color mode (cards and panels drawn with
   var(--surface)) keep using the mode's own colors.
   ========================================================================== */
.c-yellow  { --c-ink-paper: #765600; --c-tint-paper: #fff4cc; --on-c: #23180f; }
.c-orange  { --c-ink-paper: #9a4300; --c-tint-paper: #ffe9d6; --on-c: #23180f; }
.c-red     { --c-ink-paper: #a3171b; --c-tint-paper: #fce2e2; --on-c: #ffffff; }
.c-magenta { --c-ink-paper: #8e1167; --c-tint-paper: #fadff0; --on-c: #ffffff; }
.c-purple  { --c-ink-paper: #5b2486; --c-tint-paper: #eee4f6; --on-c: #ffffff; }
.c-indigo  { --c-ink-paper: #2d2e86; --c-tint-paper: #e5e5f6; --on-c: #ffffff; }
.c-blue    { --c-ink-paper: #0b5f96; --c-tint-paper: #dceffb; --on-c: #ffffff; }
.c-sky     { --c-ink-paper: #08678a; --c-tint-paper: #dbf3fa; --on-c: #23180f; }
.c-green   { --c-ink-paper: #3e690e; --c-tint-paper: #e9f5da; --on-c: #23180f; }

:where(
  .page-hero-paper, .section-head, .page-nav-label, .page-nav a, .fact-cards > li, .fold, .petal-help, .quilt-square,
  .index-card, .notebook, .note-card, .folder, .polaroid, .town-set, .house, .drawer .label-holder,
  .ticket, .depart-board, .collage-note, .in-short, .site-footer .footer-safety, .fav-btn[aria-pressed="true"],
  .theme-letterpress .er-section, .theme-fieldguide .toc, .theme-fieldguide .prose > section, .theme-quilt .promise,
  .theme-flyers .idea, .theme-studio .card, .theme-studio .panel, .ob-group, .onboard-progress, .featured-guide,
  .theme-bigprint main .prose, .theme-diary main .prose, .profile-sheet,
  .door-choice, .start-choice, .m-notice, .m-wizard-card, .m-unlock-form, .m-tabs, .m-home-bar, .m-panel, .m-tour, .m-dialog, .m-wall-help p, .m-back a,
  .m-drawer-chip, .m-steps li, .df-card, .m-preview-note, .m-sheet, .m-card, .m-toolbar,
  .m-tool-head, .m-lib-item, .m-lib-cat-h, .m-step-card, .m-journey-stage, .m-word, .m-goal-card, .m-entry-link,
  .m-log-date, .m-count, .m-privacy-note, .m-entry-stamp, .m-day-card, .m-handoff, .m-med-figure, .start-choice, .rt-card, .rt-controls, .rt-bar, .rt-col-head h2, .rt-edit-card, .rt-cover-actions, .rt-need, .rt-timer, .m-section-title, .s-signin-card, .s-shift-row, .s-week-day, .s-shift, .s-notices li, .s-guide, .s-seg-opt > span, .s-pill
) {
  --paper: #ece4d6; --band: #f5ead7; --band-2: #efe4f4; --surface: #fffdf7; --surface-2: #faf4e8;
  --ink: #23180f; --ink-2: #47372a; --ink-3: #5a4836; --line: #dcc8a6; --line-strong: #a3865c;
  --kraft: #d6b88c; --kraft-ink: #3b2a17; --tape: rgba(244, 232, 196, .82);
  --shadow: 0 1px 1px rgba(70, 45, 20, .14), 0 12px 22px -12px rgba(70, 45, 20, .55);
  --shadow-lift: 0 2px 2px rgba(70, 45, 20, .14), 0 18px 30px -14px rgba(70, 45, 20, .6);
  --green: #05683d; --teal: #08705f; --blue: #1b5ca2; --indigo: #29298e;
  --action: #0a6b57; --action-hover: #075646; --on-action: #ffffff; --link: #1b5ca2; --focus: #29298e; --focus-halo: #ffc20e;
  --yellow-ink: #765600;  --yellow-tint: #fff4cc;  --orange-ink: #9a4300;  --orange-tint: #ffe9d6;
  --red-ink: #a3171b;     --red-tint: #fce2e2;     --magenta-ink: #8e1167; --magenta-tint: #fadff0;
  --purple-ink: #5b2486;  --purple-tint: #eee4f6;  --indigo-ink: #2d2e86;  --indigo-tint: #e5e5f6;
  --blue-ink: #0b5f96;    --blue-tint: #dceffb;    --sky-ink: #08678a;     --sky-tint: #dbf3fa;
  --green-ink: #3e690e;   --green-tint: #e9f5da;
  --ok-ink: #1f6a2a; --ok-tint: #e3f4e3; --warn-ink: #8a4b00; --warn-tint: #fff0d9; --bad-ink: #a3171b; --bad-tint: #fce2e2;
  --c-ink: var(--c-ink-paper); --c-tint: var(--c-tint-paper); --c-safe: #08705f;
  color-scheme: light;
  color: var(--ink);
}
:root[data-contrast="high"] :where(
  .page-hero-paper, .section-head, .page-nav-label, .page-nav a, .fact-cards > li, .fold, .petal-help, .quilt-square,
  .index-card, .notebook, .note-card, .folder, .polaroid, .town-set, .house, .drawer .label-holder,
  .ticket, .depart-board, .collage-note, .in-short, .site-footer .footer-safety, .fav-btn[aria-pressed="true"],
  .theme-letterpress .er-section, .theme-fieldguide .toc, .theme-fieldguide .prose > section, .theme-quilt .promise,
  .theme-flyers .idea, .theme-studio .card, .theme-studio .panel, .ob-group, .onboard-progress, .featured-guide,
  .theme-bigprint main .prose, .theme-diary main .prose, .profile-sheet,
  .door-choice, .start-choice, .m-notice, .m-wizard-card, .m-unlock-form, .m-tabs, .m-home-bar, .m-panel, .m-tour, .m-dialog, .m-wall-help p, .m-back a,
  .m-drawer-chip, .m-steps li, .df-card, .m-preview-note, .m-sheet, .m-card, .m-toolbar,
  .m-tool-head, .m-lib-item, .m-lib-cat-h, .m-step-card, .m-journey-stage, .m-word, .m-goal-card, .m-entry-link,
  .m-log-date, .m-count, .m-privacy-note, .m-entry-stamp, .m-day-card, .m-handoff, .m-med-figure, .start-choice, .rt-card, .rt-controls, .rt-bar, .rt-col-head h2, .rt-edit-card, .rt-cover-actions, .rt-need, .rt-timer, .m-section-title, .s-signin-card, .s-shift-row, .s-week-day, .s-shift, .s-notices li, .s-guide, .s-seg-opt > span, .s-pill
) {
  --ink: #000; --ink-2: #000; --ink-3: #000; --line: #000; --line-strong: #000;
  --surface: #fff; --surface-2: #fff; --band: #fff; --band-2: #fff; --paper: #fff;
  --link: #0b3c8c; --action: #00452f; --shadow: none;
}

/* The field guide cover is dark cloth, so its small print is light */
.theme-fieldguide .page-hero .wrap > .page-hero-paper { --ink: #f6efe0; --ink-2: #e7dfcc; --ink-3: #e7dfcc; --c-safe: #f3d996; --focus: #f3d996; --focus-halo: #23180f; color-scheme: dark; }

/* Tape labels are always light paper, so their words are always dark */
.eyebrow { color: #23180f; }
:root[data-look="simple"] .eyebrow { color: inherit; }

/* Numbers printed on a petal use the ink that reads best on that petal */
.steps > li::before { color: var(--on-c, #23180f); }
.route-line > li.is-here .stop-dot { color: var(--on-c, #ffffff); }
.route-line > li.is-here.c-yellow .stop-dot, .route-line > li.is-here.c-orange .stop-dot, .route-line > li.is-here.c-green .stop-dot, .route-line > li.is-here.c-sky .stop-dot { text-shadow: none; }
.jstep[data-done="true"] .jnum { color: var(--on-c, #ffffff); }

/* The dashboard link keeps its dark tab inside the phone menu */
@media (max-width: 1239px) {
  .site-header.menu-open .primary-nav .nav-portal a { background: var(--ink); color: var(--surface); border-color: var(--ink); }
  .site-header.menu-open .primary-nav .nav-portal a:hover, .site-header.menu-open .primary-nav .nav-portal a[aria-current="page"] { background: var(--ink-2); color: var(--surface); }
}

/* Simple view prints the field guide cover on plain paper, so its small print turns dark too */
:root[data-look="simple"].theme-fieldguide .page-hero .wrap > .page-hero-paper {
  --ink: #23180f; --ink-2: #47372a; --ink-3: #5a4836; --hero-ink: #23180f; --hero-ink-2: #47372a; --link: #1b5ca2;
  --c-safe: #08705f; --focus: #29298e; --focus-halo: #ffc20e; color-scheme: light;
}
:root[data-look="simple"].theme-fieldguide .page-hero .wrap > .page-hero-paper .btn-quiet,
:root[data-look="simple"].theme-fieldguide .page-hero .wrap > .page-hero-paper .btn-ghost { color: #23180f; border-color: #8d755a; }

/* Simple view: the week note's label moves inside the note as plain dark text */
:root[data-look="simple"] .week-note::before { position: static; display: block; color: var(--ink); margin-bottom: var(--space-2); }

/* Field guide cover: quiet buttons stay light-on-cloth when hovered */
.theme-fieldguide .page-hero .wrap > .page-hero-paper .btn-quiet:hover,
.theme-fieldguide .page-hero .wrap > .page-hero-paper .btn-ghost:hover { background: rgba(246, 239, 224, .16); color: #f6efe0; border-color: #f6efe0; }
:root[data-look="simple"].theme-fieldguide .page-hero .wrap > .page-hero-paper .btn-quiet:hover,
:root[data-look="simple"].theme-fieldguide .page-hero .wrap > .page-hero-paper .btn-ghost:hover { background: #f5ead7; color: #23180f; border-color: #23180f; }

/* Generated by tools/art.py: soft cut-paper backdrops, one per page theme.
   The backdrop is drawn by body::before (see color.part.css). */
.theme-door { --art-base: #fcedc8; --art-layer: #f293ba; }
.theme-door body::before { background-image: var(--grain), url(../img/art/door-wide.svg); }
.theme-drawers { --art-base: #e3def4; --art-layer: #f293ba; }
.theme-drawers body::before { background-image: var(--grain), url(../img/art/drawers-wide.svg); }
.theme-collage { --art-base: #fcedc8; --art-layer: #f293ba; }
.theme-collage body::before { background-image: var(--grain), url(../img/art/collage-wide.svg); }
.theme-letterpress { --art-base: #fcedc8; --art-layer: #f293ba; }
.theme-letterpress body::before { background-image: var(--grain), url(../img/art/letterpress-wide.svg); }
.theme-quilt { --art-base: #d2eadf; --art-layer: #fde69e; }
.theme-quilt body::before { background-image: var(--grain), url(../img/art/quilt-wide.svg); }
.theme-recipe { --art-base: #d2eadf; --art-layer: #fde69e; }
.theme-recipe body::before { background-image: var(--grain), url(../img/art/recipe-wide.svg); }
.theme-passport { --art-base: #d2eadf; --art-layer: #fde69e; }
.theme-passport body::before { background-image: var(--grain), url(../img/art/passport-wide.svg); }
.theme-fieldguide { --art-base: #d5e1f5; --art-layer: #fde69e; }
.theme-fieldguide body::before { background-image: var(--grain), url(../img/art/fieldguide-wide.svg); }
.theme-typewriter { --art-base: #d5e1f5; --art-layer: #fde69e; }
.theme-typewriter body::before { background-image: var(--grain), url(../img/art/typewriter-wide.svg); }
.theme-drafting { --art-base: #d5e1f5; --art-layer: #fde69e; }
.theme-drafting body::before { background-image: var(--grain), url(../img/art/drafting-wide.svg); }
.theme-garden { --art-base: #d2eadf; --art-layer: #fde69e; }
.theme-garden body::before { background-image: var(--grain), url(../img/art/garden-wide.svg); }
.theme-fieldnotes { --art-base: #d5e1f5; --art-layer: #fde69e; }
.theme-fieldnotes body::before { background-image: var(--grain), url(../img/art/fieldnotes-wide.svg); }
.theme-workshop { --art-base: #f4d1d6; --art-layer: #fde69e; }
.theme-workshop body::before { background-image: var(--grain), url(../img/art/workshop-wide.svg); }
.theme-planner { --art-base: #fcdece; --art-layer: #bba4e2; }
.theme-planner body::before { background-image: var(--grain), url(../img/art/planner-wide.svg); }
.theme-mail { --art-base: #fcdece; --art-layer: #bba4e2; }
.theme-mail body::before { background-image: var(--grain), url(../img/art/mail-wide.svg); }
.theme-suggestion { --art-base: #fcdece; --art-layer: #bba4e2; }
.theme-suggestion body::before { background-image: var(--grain), url(../img/art/suggestion-wide.svg); }
.theme-scrapbook { --art-base: #e3daf5; --art-layer: #fddf8e; }
.theme-scrapbook body::before { background-image: var(--grain), url(../img/art/scrapbook-wide.svg); }
.theme-stitch { --art-base: #e3daf5; --art-layer: #fddf8e; }
.theme-stitch body::before { background-image: var(--grain), url(../img/art/stitch-wide.svg); }
.theme-office { --art-base: #e3daf5; --art-layer: #fddf8e; }
.theme-office body::before { background-image: var(--grain), url(../img/art/office-wide.svg); }
.theme-library { --art-base: #e3daf5; --art-layer: #fddf8e; }
.theme-library body::before { background-image: var(--grain), url(../img/art/library-wide.svg); }
.theme-diary { --art-base: #e3daf5; --art-layer: #fddf8e; }
.theme-diary body::before { background-image: var(--grain), url(../img/art/diary-wide.svg); }
.theme-bigprint { --art-base: #fcedc8; --art-layer: #f293ba; }
.theme-bigprint body::before { background-image: var(--grain), url(../img/art/bigprint-wide.svg); }
.theme-sketch { --art-base: #fcdece; --art-layer: #bba4e2; }
.theme-sketch body::before { background-image: var(--grain), url(../img/art/sketch-wide.svg); }
.theme-transit { --art-base: #fcedc8; --art-layer: #f293ba; }
.theme-transit body::before { background-image: var(--grain), url(../img/art/transit-wide.svg); }
.theme-studio { --art-base: #f4d1d6; --art-layer: #fde69e; }
.theme-studio body::before { background-image: var(--grain), url(../img/art/studio-wide.svg); }
.theme-receipt { --art-base: #f4d1d6; --art-layer: #fde69e; }
.theme-receipt body::before { background-image: var(--grain), url(../img/art/receipt-wide.svg); }
.theme-clipboard { --art-base: #f4d1d6; --art-layer: #fde69e; }
.theme-clipboard body::before { background-image: var(--grain), url(../img/art/clipboard-wide.svg); }
.theme-table { --art-base: #fcedc8; --art-layer: #f293ba; }
.theme-table body::before { background-image: var(--grain), url(../img/art/table-wide.svg); }
/* Start-page color themes (data-start on <html>) */
:root[data-start="sunrise"].theme-door { --art-base: #fcedc8; --art-layer: #f293ba; --start-swatch: #fed464; }
:root[data-start="sunrise"].theme-door body::before { background-image: var(--grain), url(../img/art/start-sunrise-wide.svg); }
:root[data-start="ocean"].theme-door { --art-base: #d5e1f5; --art-layer: #fde69e; --start-swatch: #739adf; }
:root[data-start="ocean"].theme-door body::before { background-image: var(--grain), url(../img/art/start-ocean-wide.svg); }
:root[data-start="meadow"].theme-door { --art-base: #d2eadf; --art-layer: #fde69e; --start-swatch: #66be8c; }
:root[data-start="meadow"].theme-door body::before { background-image: var(--grain), url(../img/art/start-meadow-wide.svg); }
:root[data-start="dusk"].theme-door { --art-base: #e3daf5; --art-layer: #fddf8e; --start-swatch: #a783df; }
:root[data-start="dusk"].theme-door body::before { background-image: var(--grain), url(../img/art/start-dusk-wide.svg); }
:root[data-start="canyon"].theme-door { --art-base: #fcdece; --art-layer: #bba4e2; --start-swatch: #fe9b7a; }
:root[data-start="canyon"].theme-door body::before { background-image: var(--grain), url(../img/art/start-canyon-wide.svg); }
:root[data-start="berry"].theme-door { --art-base: #f4d1d6; --art-layer: #fde69e; --start-swatch: #df6a99; }
:root[data-start="berry"].theme-door body::before { background-image: var(--grain), url(../img/art/start-berry-wide.svg); }
@media (max-aspect-ratio: 4/5) {
  .theme-door body::before { background-image: var(--grain), url(../img/art/door-tall.svg); }
  .theme-drawers body::before { background-image: var(--grain), url(../img/art/drawers-tall.svg); }
  .theme-collage body::before { background-image: var(--grain), url(../img/art/collage-tall.svg); }
  .theme-letterpress body::before { background-image: var(--grain), url(../img/art/letterpress-tall.svg); }
  .theme-quilt body::before { background-image: var(--grain), url(../img/art/quilt-tall.svg); }
  .theme-recipe body::before { background-image: var(--grain), url(../img/art/recipe-tall.svg); }
  .theme-passport body::before { background-image: var(--grain), url(../img/art/passport-tall.svg); }
  .theme-fieldguide body::before { background-image: var(--grain), url(../img/art/fieldguide-tall.svg); }
  .theme-typewriter body::before { background-image: var(--grain), url(../img/art/typewriter-tall.svg); }
  .theme-drafting body::before { background-image: var(--grain), url(../img/art/drafting-tall.svg); }
  .theme-garden body::before { background-image: var(--grain), url(../img/art/garden-tall.svg); }
  .theme-fieldnotes body::before { background-image: var(--grain), url(../img/art/fieldnotes-tall.svg); }
  .theme-workshop body::before { background-image: var(--grain), url(../img/art/workshop-tall.svg); }
  .theme-planner body::before { background-image: var(--grain), url(../img/art/planner-tall.svg); }
  .theme-mail body::before { background-image: var(--grain), url(../img/art/mail-tall.svg); }
  .theme-suggestion body::before { background-image: var(--grain), url(../img/art/suggestion-tall.svg); }
  .theme-scrapbook body::before { background-image: var(--grain), url(../img/art/scrapbook-tall.svg); }
  .theme-stitch body::before { background-image: var(--grain), url(../img/art/stitch-tall.svg); }
  .theme-office body::before { background-image: var(--grain), url(../img/art/office-tall.svg); }
  .theme-library body::before { background-image: var(--grain), url(../img/art/library-tall.svg); }
  .theme-diary body::before { background-image: var(--grain), url(../img/art/diary-tall.svg); }
  .theme-bigprint body::before { background-image: var(--grain), url(../img/art/bigprint-tall.svg); }
  .theme-sketch body::before { background-image: var(--grain), url(../img/art/sketch-tall.svg); }
  .theme-transit body::before { background-image: var(--grain), url(../img/art/transit-tall.svg); }
  .theme-studio body::before { background-image: var(--grain), url(../img/art/studio-tall.svg); }
  .theme-receipt body::before { background-image: var(--grain), url(../img/art/receipt-tall.svg); }
  .theme-clipboard body::before { background-image: var(--grain), url(../img/art/clipboard-tall.svg); }
  .theme-table body::before { background-image: var(--grain), url(../img/art/table-tall.svg); }
  :root[data-start="sunrise"].theme-door body::before { background-image: var(--grain), url(../img/art/start-sunrise-tall.svg); }
  :root[data-start="ocean"].theme-door body::before { background-image: var(--grain), url(../img/art/start-ocean-tall.svg); }
  :root[data-start="meadow"].theme-door body::before { background-image: var(--grain), url(../img/art/start-meadow-tall.svg); }
  :root[data-start="dusk"].theme-door body::before { background-image: var(--grain), url(../img/art/start-dusk-tall.svg); }
  :root[data-start="canyon"].theme-door body::before { background-image: var(--grain), url(../img/art/start-canyon-tall.svg); }
  :root[data-start="berry"].theme-door body::before { background-image: var(--grain), url(../img/art/start-berry-tall.svg); }
}

/* ==========================================================================
   Amelio Services draft 7: a soft wash of color
   The craft-table look stays. Instead of plain beige linen, each page now
   sits on a light wash of the color of its part of the site, with a few
   pale, hand-cut paper shapes around the edges: Welcome is sunflower,
   Services is mint, How SDP works is sky blue, Get started is peach,
   About is lavender, the provider pages are rose and the member drawers
   are dusk lavender.
   Words still always sit on paper. Simple view and High contrast remove the
   shapes, and dark mode dims them.
   ========================================================================== */
:where(:root) { --art-base: #fcedc8; --art-layer: #f293ba; }
:root { --rainbow: linear-gradient(90deg, #ffc21a 0 11.2%, #ff7a12 0 22.3%, #ec2227 0 33.4%, #ca1a93 0 44.5%, #6f2da1 0 55.6%, #34359b 0 66.7%, #0a89da 0 77.8%, #1cb3e5 0 88.9%, #7bbe2b 0); }

/* ---------- the backdrop behind every page ---------- */
:root body { background-color: var(--art-base) !important; background-image: none !important; position: relative; isolation: isolate; }
:root body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-size: 220px 220px, cover; background-position: 0 0, center; background-repeat: repeat, no-repeat;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body { background-color: color-mix(in srgb, var(--art-base) 12%, #221a14) !important; }
  :root:not([data-theme="light"]) body::before { filter: brightness(.26) saturate(.9); }
}
:root[data-theme="dark"] body { background-color: color-mix(in srgb, var(--art-base) 12%, #221a14) !important; }
:root[data-theme="dark"] body::before { filter: brightness(.26) saturate(.9); }
/* Simple view: just the soft color. High contrast: plain. */
:root[data-look="simple"] body::before, :root[data-contrast="high"] body::before { display: none; }
:root[data-contrast="high"] body { background-color: #fff !important; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"])[data-contrast="high"] body { background-color: #000 !important; } }
:root[data-theme="dark"][data-contrast="high"] body { background-color: #000 !important; }
@media print { :root body::before { display: none; } :root body { background: #fff !important; } }

/* ---------- a thin ribbon of the logo's colors under the header ---------- */
.site-header { position: relative; }
.site-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 4px; background: var(--rainbow); opacity: .85; pointer-events: none; }
:root[data-look="simple"] .site-header::after, :root[data-contrast="high"] .site-header::after { display: none; }

/* ---------- section bands: a light sheet of paper over the color ---------- */
.band, .band-2 { background-color: rgba(255, 252, 245, .58); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .band, :root:not([data-theme="light"]) .band-2 { background-color: rgba(50, 39, 31, .72); } }
:root[data-theme="dark"] .band, :root[data-theme="dark"] .band-2 { background-color: rgba(50, 39, 31, .72); }
:root[data-look="simple"] .band, :root[data-contrast="high"] .band { background-color: var(--band); }
:root[data-look="simple"] .band-2, :root[data-contrast="high"] .band-2 { background-color: var(--band-2); }