/* skin-r3.css · round 3 look: borderless tonal blocks, arched image cards, paper and cane.
   Everything is gated on <html data-skin="r3">. To revert in one move, remove that attribute
   from the pages (sed -i '' 's/ data-skin="r3"//' *.html shop/*.html) or delete the <link>. */
:root[data-skin="r3"] { --r3-tone: rgba(var(--c-ink-rgb, 26,18,12), 0.055); --r3-edge: rgba(var(--c-ink-rgb, 26,18,12), 0.28); --r3-terracotta: #9A6238; --r3-radius: 12px; }

/* A · borderless tonal blocks: no outlines; the block is a shade of its ground */
[data-skin="r3"] :is(.board-tile, .dispatch-preview-grid, .range-quote-card, .explore-tile, .jargon-helper, .brew-grid, .story-aside,
  .sci-card, .lever, .m-panel, .calc, .timer, .ins-card, .gw-card, .so-card, .info-card, .status-card, .seg-grid, .policy-note,
  .pp-spec, .pp-brewcard, .pp-sec, .pp-rel, .so-sec, .so-steps li, .pp-so-box, .ritual-how, .ritual-flow-step, .b-form-card, .fn-pick-box) {
  border-color: transparent !important; border-radius: var(--r3-radius); }
[data-skin="r3"] :is(.jargon-helper, .brew-grid, .story-aside, .sci-card, .lever, .calc, .ins-card, .gw-card, .info-card, .status-card,
  .policy-note, .pp-spec, .pp-brewcard, .pp-rel, .so-steps li, .pp-so-box, .ritual-how, .ritual-flow-step) { background: var(--r3-tone); }
/* the five convictions: no 1px grid, five soft blocks with air between */
[data-skin="r3"] .pillars { gap: 14px; background: none; border: 0; }
[data-skin="r3"] .pillar { background: var(--r3-tone); border-radius: var(--r3-radius); border: 0 !important; }
[data-skin="r3"] .dispatch-preview-grid { gap: 14px; background: none; border: 0; }
[data-skin="r3"] .dispatch-preview-card { border-radius: var(--r3-radius); }
[data-skin="r3"] .section-divider { border: 0; height: 18px; background:
  radial-gradient(circle at 50% 50%, var(--r3-edge) 0 2.5px, transparent 3.2px),
  linear-gradient(90deg, transparent calc(50% - 64px), var(--r3-edge) calc(50% - 64px) calc(50% - 14px), transparent calc(50% - 14px) calc(50% + 14px), var(--r3-edge) calc(50% + 14px) calc(50% + 64px), transparent calc(50% + 64px)) center / 100% 1px no-repeat; }

/* E · arch tops on image cards (a doorway curve; the rest stays square) */
[data-skin="r3"] .board-tile { border-radius: 96px 96px var(--r3-radius) var(--r3-radius); overflow: hidden; }
[data-skin="r3"] .dp-carousel .dispatch-preview-card { border-radius: 70px 70px var(--r3-radius) var(--r3-radius); }
@media (max-width: 860px) {
  [data-skin="r3"] .board-tile { border-radius: 56px 56px var(--r3-radius) var(--r3-radius); }
  [data-skin="r3"] .dp-carousel .dispatch-preview-card { border-radius: 44px 44px var(--r3-radius) var(--r3-radius); }
}

/* C · paper edge: a stitched inner line, like a menu card or a bag tag. FAQ and Field Notes only. */
[data-skin="r3"] :is(.pp-faq details, .pp-faq-item, .fn-card, details.fn-order) {
  border: 0 !important; border-bottom: 1.5px dashed var(--r3-edge) !important; border-radius: 0; background: none; outline: 0; }
[data-skin="r3"] :is(.fn-card, details.fn-order) { border: 1.5px dashed var(--r3-edge) !important; border-radius: 8px; }

/* Paper and ink: a barely-there grain across every ground */
[data-skin="r3"] body::after { content: ''; position: fixed; inset: 0; z-index: 3; pointer-events: none; opacity: 0.07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .1 0 0 0 0 .07 0 0 0 0 .05 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* Cane and terracotta: a faint cane weave inside the bands and blocks only; terracotta is the warm hover */
[data-skin="r3"] .dvn-art :is(.dvn-band, .d1, .d2) { background-image:
  repeating-linear-gradient(45deg, rgba(26,18,12,0.06) 0 1px, transparent 1px 10px),
  repeating-linear-gradient(-45deg, rgba(26,18,12,0.06) 0 1px, transparent 1px 10px); }
[data-skin="r3"] :is(.view-more-cta, .board-cta, .dp-cta, .pc-know, .inline-link, .pp-link):hover { text-decoration-color: var(--r3-terracotta); border-color: var(--r3-terracotta); }
[data-skin="r3"] :is(.board-tile, .dispatch-preview-card):hover { box-shadow: 0 0 0 3px var(--r3-terracotta); }

@media (prefers-reduced-motion: reduce) { [data-skin="r3"] body::after { opacity: 0.05; } }

/* Drawn divider: the rule draws itself once as it scrolls into view */
[data-skin="r3"] hr.section-divider.tl-arm { clip-path: inset(0 50% 0 50%); }
[data-skin="r3"] hr.section-divider.tl-arm.is-drawn { clip-path: inset(0 0 0 0); transition: clip-path 1.2s cubic-bezier(.2,.7,.2,1); }