:root {
    color-scheme: light;
    --paper: #ffffff;
    --cream: #fff8ef;
    --cream-deep: #f7eadc;
    --ink: #2c1028;
    --muted: #745d6f;
    --plum: #590540;
    --plum-deep: #3c062d;
    --coral: #ff5863;
    --orange: #ffa814;
    --teal: #38b995;
    --wash: #f6edf2;
    --line: rgba(89, 5, 64, .14);
    --sans: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  }

  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; scroll-padding-top: 24px; }
  body { margin: 0; background: radial-gradient(ellipse at 90% 0, rgba(255, 168, 20, .09), transparent 850px), linear-gradient(125deg, #fff9f2, #f9eee5 580px, var(--cream) 1000px); color: var(--ink); font: 18px/1.7 var(--sans); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
  a { color: var(--plum-deep); text-underline-offset: .22em; text-decoration-thickness: 1px; }
  a:hover { text-decoration-thickness: 2px; }
  a:focus-visible, input:focus-visible + label { outline: 3px solid var(--plum); outline-offset: 5px; }
  .skip { position: fixed; left: 1rem; top: -5rem; padding: .5rem 1rem; background: white; z-index: 20; }
  .skip:focus { top: 1rem; }
  .shell { width: min(1160px, calc(100% - 48px)); margin: auto; }
  .wordmark { display: inline-flex; flex: 0 1 240px; width: 240px; max-width: 100%; min-height: 44px; align-items: center; color: var(--plum-deep); border-radius: 6px; }
  .wordmark-logo { display: block; width: 100%; height: auto; }
.theme-toggle {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 108px;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: transparent;
  color: var(--plum-deep);
  font: inherit;
  font-size: 0.88rem;
  font-weight: 700;
  cursor: pointer;
}

.theme-toggle[hidden] {
  display: none;
}

.theme-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
  .theme-toggle { transition: background-color 180ms ease; }
  .theme-toggle:hover { background: var(--cream-deep); }
  .theme-toggle:focus-visible { outline: 3px solid var(--plum); outline-offset: 5px; }
  .license-header { width: 100%; background: var(--cream); border-bottom: 1px solid var(--line); box-shadow: 0 4px 16px rgba(60, 6, 45, .04); }
  .header-content { display: flex; align-items: center; gap: 1.5rem; min-height: 88px; padding: .75rem 0; }
  .header-content > .theme-toggle { margin-left: auto; }
  .hero-copy { max-width: 1000px; padding: 2.5rem 0 3.5rem; }
  h1 { font: 750 clamp(2.5rem, 4.6vw, 3.75rem)/1.12 var(--sans); letter-spacing: -.045em; margin: 0 0 1.5rem; color: var(--plum-deep); }
  .title-version { display: inline-block; vertical-align: middle; padding: .45rem .8rem; border: 1px solid var(--line); border-radius: 999px; font: 650 .9rem/1.4 var(--sans); letter-spacing: 0; white-space: nowrap; }
  .hero-tagline { margin: 0 0 .5rem; color: var(--plum); font-size: 1.4rem; font-weight: 650; letter-spacing: -.02em; }
  .lede { font-size: 1.125rem; line-height: 1.7; color: var(--muted); max-width: 650px; }
  .hero-links { display: flex; flex-wrap: wrap; gap: .9rem 1.25rem; align-items: center; margin-top: 1.8rem; font-size: .92rem; }
  .hero-links a { display: inline-flex; align-items: center; gap: .4rem; min-height: 52px; text-decoration: none; }
  .hero-links > a:not(.primary-link) { color: var(--plum); font-weight: 780; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; transition: color 160ms ease; }
  .hero-links > a:not(.primary-link):hover { color: var(--plum-deep); }
  .primary-link { justify-content: center; padding: 13px 23px; border: 2px solid var(--plum); background: var(--plum); color: white; border-radius: 999px; font-weight: 720; line-height: 1.2; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 3px 6px rgba(60, 6, 45, .08), 0 10px 24px rgba(60, 6, 45, .14); transition: background-color 180ms ease, color 180ms ease; }

  .overview { padding: 2rem 0 0; margin: 0 0 5rem; }
  .section-heading { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: .5rem 1rem; margin-bottom: 1rem; }
  .section-heading h2 { font: 730 clamp(2rem, 3vw, 2.6rem)/1.25 var(--sans); letter-spacing: -.035em; color: var(--plum-deep); margin: 0; }
  .overview-status { max-width: 970px; color: var(--muted); font-size: 1rem; line-height: 1.7; }
  .overview-disclaimer { max-width: 960px; margin: 0 0 1.75rem; }
  .overview-status a { text-decoration-color: #bea6b6; }
  .overview-hint { display: flex; align-items: center; gap: .6rem; margin: 0 0 1rem; color: var(--muted); font-size: .94rem; }
  .cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 1.25rem; margin: 0 0 1.5rem; }
  .cards:has(details[open]) { align-items: start; }
  .card { --accent: #08735b; --tint: #eaf8f2; --stripe: var(--teal); position: relative; isolation: isolate; min-width: 0; border: 1px solid var(--line); border-top: 4px solid var(--stripe); border-radius: 18px; background: var(--paper); box-shadow: 0 4px 6px rgba(60, 6, 45, .025), 0 16px 36px rgba(60, 6, 45, .045); }
  /* Original vector filigree: mirrored scrolls, veined leaves and woven diamonds.
     Embedded here so the engraving remains crisp and works entirely offline. */
  .cards { --engraving: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cdefs%3E%3Cpattern%20id%3D%22engraving-tile%22%20width%3D%22180%22%20height%3D%22240%22%20patternUnits%3D%22userSpaceOnUse%22%20patternTransform%3D%22rotate(-13)%20scale(1.2)%22%3E%3Cdefs%3E%3Cg%20id%3D%22sprig%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cg%20stroke-width%3D%221.15%22%3E%3Cpath%20d%3D%22M90%200C90%2030%20156%2025%20158%2067C160%2096%20131%20108%20118%2091C108%2077%20122%2061%20134%2069C143%2075%20137%2088%20130%2083C125%2080%20131%2075%20133%2079%22%2F%3E%3Cpath%20d%3D%22M90%207C96%2031%20152%2032%20153%2067C154%2088%20137%20100%20125%2090%22%2F%3E%3Cpath%20d%3D%22M90%20120C98%20101%20112%20110%20113%20125C114%20139%20103%20146%2094%20140C88%20136%2093%20129%2098%20132%22%2F%3E%3Cpath%20d%3D%22M114%2030C112%2015%20123%205%20140%203C139%2019%20129%2032%20114%2030ZM136%2043C149%2027%20163%2027%20171%2029C169%2045%20157%2057%20144%2056M157%2065C168%2059%20176%2067%20176%2082C164%2082%20158%2078%20157%2065%22%2F%3E%3Cpath%20d%3D%22M148%2098C164%2094%20173%20103%20171%20119C156%20118%20147%20111%20148%2098ZM126%20103C137%20117%20134%20128%20125%20137C116%20125%20114%20114%20126%20103%22%2F%3E%3Cpath%20d%3D%22M94%2026C104%2038%20123%2041%20120%2054C117%2066%20101%2065%2098%2055C96%2049%20103%2044%20107%2049C109%2052%20104%2055%20103%2051%22%2F%3E%3Cpath%20d%3D%22M107%2064C120%2066%20124%2075%20115%2086C103%2082%20100%2072%20107%2064%22%2F%3E%3Cpath%20d%3D%22M91%2091C101%2072%2097%2053%2090%2043C83%2053%2079%2072%2089%2091%22%2F%3E%3C%2Fg%3E%3Cg%20stroke-width%3D%22.55%22%3E%3Cpath%20d%3D%22M115%2029L137%206M119%2023L119%2016M123%2019L124%2011M128%2015L131%208M121%2025L128%2025M126%2020L133%2020M131%2015L137%2013M141%2049L167%2032M148%2045L152%2035M153%2042L164%2042M158%2069L172%2078M149%20100L168%20115M156%20105L165%20103M160%20109L161%20114M125%20105L126%20132M121%20115L126%20120L131%20115M90%2049V86M86%2061L90%2067L94%2061M86%2071L90%2077L94%2071M108%2067L114%2081%22%2F%3E%3Cpath%20d%3D%22M94%2016C111%2033%20144%2029%20151%2049M144%2096C141%20100%20135%20102%20130%20100M112%20104C118%20105%20119%20110%20118%20114%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fdefs%3E%3Cuse%20href%3D%22%23sprig%22%2F%3E%3Cuse%20href%3D%22%23sprig%22%20transform%3D%22translate(180%200)%20scale(-1%201)%22%2F%3E%3Cuse%20href%3D%22%23sprig%22%20transform%3D%22translate(0%20240)%20scale(1%20-1)%22%2F%3E%3Cuse%20href%3D%22%23sprig%22%20transform%3D%22translate(180%20240)%20scale(-1%20-1)%22%2F%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20stroke-width%3D%221.1%22%20d%3D%22M90%2097C99%20108%20106%20115%20106%20120C106%20125%2099%20132%2090%20143C81%20132%2074%20125%2074%20120C74%20115%2081%20108%2090%2097ZM90%20105L101%20120L90%20135L79%20120Z%22%2F%3E%3Cpath%20stroke-width%3D%22.7%22%20d%3D%22M90%20111C101%20111%20101%20129%2090%20129C79%20129%2079%20111%2090%20111ZM83%20120H97M90%20113V127M0%209C11%2014%2016%2024%2012%2035C8%2045%202%2047%200%2052M0%2015C6%2019%2011%2026%207%2034M180%209C169%2014%20164%2024%20168%2035C172%2045%20178%2047%20180%2052M180%2015C174%2019%20169%2026%20173%2034M0%20188C11%20193%2016%20203%2012%20214C8%20224%202%20226%200%20231M180%20188C169%20193%20164%20203%20168%20214C172%20224%20178%20226%20180%20231%22%2F%3E%3Ccircle%20cx%3D%2290%22%20cy%3D%22120%22%20r%3D%222.5%22%20stroke-width%3D%22.7%22%2F%3E%3Cpath%20stroke-width%3D%22.8%22%20d%3D%22M90%200L97%2010L90%2020L83%2010ZM90%20220L97%20230L90%20240L83%20230Z%22%2F%3E%3C%2Fg%3E%3C%2Fpattern%3E%3C%2Fdefs%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20fill%3D%22url(%23engraving-tile)%22%2F%3E%3C%2Fsvg%3E"); }
  .card { overflow: hidden; }
  /* SVG tiles use fixed units and rotate around their top-left origin.
     Growing the mask reveals more pattern without moving the existing lines. */
  .card::before, .card::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; mask-image: var(--engraving); mask-size: 100% 100%; mask-position: left top; mask-repeat: no-repeat; }
  .card::before { background: var(--accent); opacity: .11; }
  .card::after { background: var(--paper); opacity: .4; transform: translateY(1px); }
  .card h3 { position: relative; display: flex; align-items: center; gap: .75rem; padding: 1.5rem 1.25rem; border-bottom: 1px solid var(--line); border-radius: 14px 14px 0 0; background: transparent; font: 760 1.5rem/1.3 var(--sans); letter-spacing: -.025em; text-transform: none; color: var(--accent); margin: 0; }
  /* A dark upper cut and pale lower lip make the headings feel recessed. */
  .card h3 { font-weight: 800; text-shadow: 0 -.6px .5px rgba(44, 16, 40, .45), 0 1.2px 0 rgba(255, 255, 255, .98), 0 2px 1px rgba(255, 255, 255, .5); }
  .category-icon { display: block; width: 48px; height: 48px; flex: 0 0 48px; overflow: visible; }
  .medallion-ground { fill: var(--tint); }
  .medallion-highlight { stroke: white; opacity: .95; }
  .medallion-cut { stroke: currentColor; }
  /* Header tint sits below the shared engraving, so its lines cross the divider
     continuously. Text and controls stay above both decorative layers. */
  .card h3::before { content: ""; position: absolute; inset: 0; z-index: -2; border-radius: inherit; pointer-events: none; background: var(--tint); }
  .card ul { list-style: none; padding: .5rem; margin: 0; }
  .card li { padding: 0; margin: 0; border-top: 1px solid rgba(89, 5, 64, .09); }
  .card li:first-child { border-top: 0; }
  .card details { margin: 0; border-radius: 10px; }
  .card details[open] { background: var(--tint); }
  .card summary { display: flex; align-items: start; justify-content: space-between; gap: .875rem; min-height: 96px; padding: 1.15rem .75rem; border-radius: 10px; color: var(--ink); cursor: pointer; font-size: 1.125rem; font-weight: 650; line-height: 1.5; list-style: none; transition: background-color 160ms ease, color 160ms ease; }
  .card summary::-webkit-details-marker { display: none; }
  .card summary::after { content: ""; box-sizing: border-box; flex: 0 0 28px; width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 50%; color: var(--accent); background: linear-gradient(currentColor, currentColor) center / 12px 2px no-repeat, linear-gradient(currentColor, currentColor) center / 2px 12px no-repeat, var(--paper); }
  .card details[open] summary::after { background-size: 12px 2px, 0 0; }
  .card details[open] summary { color: var(--accent); }
  .card summary:focus-visible { outline: 3px solid var(--accent); outline-offset: -3px; }
  .card-detail { padding: 0 .75rem 1.25rem; }
  .card small { display: block; margin: 0; color: var(--ink); font-size: 1rem; line-height: 1.7; }
  .card-section-links { display: flex; flex-wrap: wrap; column-gap: 1rem; margin-top: .5rem; }
  .card-section-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--accent); font-size: .94rem; font-weight: 720; text-decoration: underline; text-underline-offset: .2em; }
  /* Related engravings with distinct silhouettes: vines, ribbons, floral lattice. */
  .card-cannot { --accent: #a42d43; --tint: #fff0f0; --stripe: var(--coral); --engraving: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cdefs%3E%3Cpattern%20id%3D%22engraving-tile%22%20width%3D%22180%22%20height%3D%22240%22%20patternUnits%3D%22userSpaceOnUse%22%20patternTransform%3D%22rotate(19)%20scale(1.2)%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cdefs%3E%3Cg%20id%3D%22ribbon%22%20stroke-width%3D%221.15%22%3E%3Cpath%20d%3D%22M90%200C128%2029%20166%2054%20158%2086C153%20108%20120%20111%20115%2092C109%2073%20132%2066%20139%2079C144%2089%20133%2096%20128%2090%22%2F%3E%3Cpath%20d%3D%22M90%208C127%2037%20158%2058%20150%2084C146%2099%20126%20103%20122%2090C119%2081%20130%2076%20133%2083%22%2F%3E%3Cpath%20d%3D%22M90%2028C101%2048%20127%2057%20127%2079M90%2040C101%2056%20117%2061%20120%2073%22%2F%3E%3Cpath%20d%3D%22M90%2084L118%20120L90%20156L62%20120ZM90%2095L109%20120L90%20145L71%20120%22%2F%3E%3Cpath%20d%3D%22M145%2038C156%2027%20169%2028%20176%2038C173%2050%20161%2054%20151%2047M147%2040C159%2045%20169%2042%20173%2037%22%2F%3E%3Cpath%20d%3D%22M151%20100C159%20110%20164%20114%20173%20113C181%20106%20170%2098%20165%20104C162%20108%20167%20110%20168%20107%22%2F%3E%3C%2Fg%3E%3C%2Fdefs%3E%3Cuse%20href%3D%22%23ribbon%22%2F%3E%3Cuse%20href%3D%22%23ribbon%22%20transform%3D%22translate(180%200)%20scale(-1%201)%22%2F%3E%3Cuse%20href%3D%22%23ribbon%22%20transform%3D%22translate(0%20240)%20scale(1%20-1)%22%2F%3E%3Cuse%20href%3D%22%23ribbon%22%20transform%3D%22translate(180%20240)%20scale(-1%20-1)%22%2F%3E%3Cg%20stroke-width%3D%221.1%22%3E%3Cpath%20d%3D%22M39%2072C67%2073%2074%20101%2090%20108C108%20117%20132%20110%20138%2093M42%2079C63%2081%2070%20107%2088%20115C111%20126%20136%20114%20143%2095%22%2F%3E%3Cpath%20d%3D%22M141%20168C113%20167%20106%20139%2090%20132C72%20123%2048%20130%2042%20147M138%20161C117%20159%20110%20133%2092%20125C69%20114%2044%20126%2037%20145%22%2F%3E%3Cpath%20d%3D%22M90%200L97%2012L90%2024L83%2012ZM90%20216L97%20228L90%20240L83%20228%22%2F%3E%3C%2Fg%3E%3Cg%20stroke-width%3D%22.55%22%3E%3Cpath%20d%3D%22M94%2018L99%2016M100%2023L106%2021M107%2028L112%2026M114%2033L120%2032M121%2039L127%2038M127%2045L134%2045M86%20222L81%20224M80%20217L74%20219M73%20212L68%20214M66%20207L60%20208M59%20201L53%20202M53%20195L46%20195M145%2039L147%2044M150%2035L153%2047M156%2033L159%2048M163%2033L166%2045%22%2F%3E%3Cpath%20d%3D%22M0%20102L12%20120L0%20138M180%20102L168%20120L180%20138M0%20111L6%20120L0%20129M180%20111L174%20120L180%20129%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fpattern%3E%3C%2Fdefs%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20fill%3D%22url(%23engraving-tile)%22%2F%3E%3C%2Fsvg%3E"); }
  .card-must { --accent: #875000; --tint: #fff5e3; --stripe: var(--orange); --engraving: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cdefs%3E%3Cpattern%20id%3D%22engraving-tile%22%20width%3D%22180%22%20height%3D%22240%22%20patternUnits%3D%22userSpaceOnUse%22%20patternTransform%3D%22rotate(-29)%20scale(1.2)%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cdefs%3E%3Cg%20id%3D%22petal%22%3E%3Cpath%20stroke-width%3D%221.15%22%20d%3D%22M90%20110C76%20100%2076%2082%2090%2067C104%2082%20104%20100%2090%20110Z%22%2F%3E%3Cpath%20stroke-width%3D%22.55%22%20d%3D%22M90%20106V74M90%2098L83%2090M90%2091L85%2082M90%2098L97%2090M90%2091L95%2082%22%2F%3E%3C%2Fg%3E%3Cg%20id%3D%22bud%22%3E%3Cpath%20stroke-width%3D%221.1%22%20d%3D%22M90%200C83%2012%2081%2025%2090%2035C99%2025%2097%2012%2090%200ZM89%2031C75%2029%2067%2019%2068%208C81%2010%2089%2020%2089%2031ZM91%2031C105%2029%20113%2019%20112%208C99%2010%2091%2020%2091%2031%22%2F%3E%3Cpath%20stroke-width%3D%22.55%22%20d%3D%22M90%207V28M72%2012L85%2027M108%2012L95%2027%22%2F%3E%3C%2Fg%3E%3C%2Fdefs%3E%3Cg%20stroke-width%3D%221.1%22%3E%3Cpath%20d%3D%22M90%200C98%2048%20141%2066%20180%20120C141%20174%2098%20192%2090%20240C82%20192%2039%20174%200%20120C39%2066%2082%2048%2090%200Z%22%2F%3E%3Cpath%20d%3D%22M90%2036C109%2067%20144%2089%20170%20120C144%20151%20109%20173%2090%20204C71%20173%2036%20151%2010%20120C36%2089%2071%2067%2090%2036Z%22%2F%3E%3C%2Fg%3E%3Cuse%20href%3D%22%23petal%22%20transform%3D%22rotate(0%2090%20120)%22%2F%3E%3Cuse%20href%3D%22%23petal%22%20transform%3D%22rotate(45%2090%20120)%22%2F%3E%3Cuse%20href%3D%22%23petal%22%20transform%3D%22rotate(90%2090%20120)%22%2F%3E%3Cuse%20href%3D%22%23petal%22%20transform%3D%22rotate(135%2090%20120)%22%2F%3E%3Cuse%20href%3D%22%23petal%22%20transform%3D%22rotate(180%2090%20120)%22%2F%3E%3Cuse%20href%3D%22%23petal%22%20transform%3D%22rotate(225%2090%20120)%22%2F%3E%3Cuse%20href%3D%22%23petal%22%20transform%3D%22rotate(270%2090%20120)%22%2F%3E%3Cuse%20href%3D%22%23petal%22%20transform%3D%22rotate(315%2090%20120)%22%2F%3E%3Cuse%20href%3D%22%23bud%22%2F%3E%3Cuse%20href%3D%22%23bud%22%20transform%3D%22translate(180%20240)%20rotate(180)%22%2F%3E%3Cg%20stroke-width%3D%221.1%22%3E%3Ccircle%20cx%3D%2290%22%20cy%3D%22120%22%20r%3D%229%22%2F%3E%3Ccircle%20cx%3D%2290%22%20cy%3D%22120%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M29%20102C17%2085%2028%2073%2040%2079C49%2084%2043%2094%2037%2090C33%2087%2036%2084%2039%2086M151%20138C163%20155%20152%20167%20140%20161C131%20156%20137%20146%20143%20150C147%20153%20144%20156%20141%20154M29%20138C17%20155%2028%20167%2040%20161C49%20156%2043%20146%2037%20150C33%20153%2036%20156%2039%20154M151%20102C163%2085%20152%2073%20140%2079C131%2084%20137%2094%20143%2090C147%2087%20144%2084%20141%2086%22%2F%3E%3C%2Fg%3E%3Cg%20stroke-width%3D%22.55%22%3E%3Cpath%20d%3D%22M0%20110L7%20120L0%20130M180%20110L173%20120L180%20130M43%2063L48%2065M48%2057L53%2060M53%2051L58%2055M58%2045L63%2050M137%20177L132%20175M132%20183L127%20180M127%20189L122%20185M122%20195L117%20190%22%2F%3E%3Ccircle%20cx%3D%2290%22%20cy%3D%2251%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%2290%22%20cy%3D%22189%22%20r%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fpattern%3E%3C%2Fdefs%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20fill%3D%22url(%23engraving-tile)%22%2F%3E%3C%2Fsvg%3E"); }

  .agreement-heading { border-top: 1px solid var(--line); padding-top: 3rem; }
  .reading-note { max-width: 860px; margin: 0 0 2rem; font-size: 1.125rem; line-height: 1.7; color: var(--muted); }
  .reading-note strong { color: var(--plum); }
  .reading-controls { min-inline-size: 0; margin: 0; padding: 0; border: 0; }
  .reading-controls legend { margin-bottom: .8rem; padding: 0; color: var(--plum-deep); font-size: 1rem; font-weight: 650; }
  .view-options { display: inline-flex; gap: .25rem; max-width: 100%; padding: .375rem; border: 1px solid var(--line); border-radius: 999px; background: var(--cream-deep); }
  .view-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .view-label { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 52px; padding: .8rem 1.15rem; border-radius: 999px; cursor: pointer; font-size: 1rem; font-weight: 650; color: var(--plum-deep); background: transparent; transition: background-color 180ms ease, color 180ms ease; }
  .view-icon { width: 24px; height: 24px; flex: 0 0 24px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
  .view-label:hover { background: rgba(255, 255, 255, .7); }
  .view-input:checked + .view-label { background: var(--plum); color: white; box-shadow: 0 3px 8px rgba(60, 6, 45, .15); }
  .view-input:focus-visible + .view-label { outline: 3px solid var(--plum); outline-offset: 3px; }
  .mode-note { display: none; border-left: 3px solid var(--plum); padding: 1rem 1.25rem; background: var(--wash); font-size: .96rem; line-height: 1.7; }
  .shell:has(#view-guide:checked) main .guide-mode-note,
  .shell:has(#view-terms:checked) main .terms-mode-note { display: block; }
  .shell:has(#view-guide:checked) main .clause .terms { display: none; }
  .shell:has(#view-terms:checked) main .clause .explanation { display: none; }
  .shell:has(#view-guide:checked) main .pair,
  .shell:has(#view-terms:checked) main .pair { grid-template-columns: minmax(0, 1fr); max-width: 820px; }
  .shell:has(#view-terms:checked) main .guide-preface { display: none; }

  nav { padding: 1.75rem 0 2.5rem; }
  .section-menu > summary { cursor: pointer; padding: .8rem 1rem; min-height: 48px; border: 1px solid var(--line); border-radius: 12px; color: var(--plum); font-size: 1rem; font-weight: 650; background: var(--paper); }
  .section-menu > summary:focus-visible { outline: 3px solid var(--plum); outline-offset: 3px; }
  @media (min-width: 761px) {
    .section-menu > summary { display: none; }
    .section-menu::details-content { display: block; content-visibility: visible; }
  }
  nav ol { display: flex; flex-wrap: wrap; gap: .45rem 1.4rem; margin: 0; padding: 0; list-style: none; }
  nav li { margin: 0; }
  nav a { display: block; font-size: 1rem; font-weight: 600; padding: .45rem 0; border-radius: 6px; color: var(--plum-deep); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; transition: color 160ms ease; }
  nav a:hover { color: var(--plum); }
  main { padding-top: 1rem; }
  .foundation { max-width: 820px; padding: 2.25rem; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); font-size: 1.125rem; line-height: 1.75; box-shadow: 0 8px 28px rgba(60, 6, 45, .035); }
  .foundation h2 { font: 700 1.55rem/1.35 var(--sans); letter-spacing: -.025em; margin: 2.25rem 0 1rem; color: var(--plum-deep); }
  .foundation h2:first-child { margin-top: 0; }
  p { margin: 0 0 1rem; }
  p:last-child { margin-bottom: 0; }
  .notice { margin: 0; color: var(--ink); background: linear-gradient(145deg, #fff, #fffcfa); border: 1px solid var(--line); border-radius: 12px; padding: .25rem 1.4rem; overflow-wrap: anywhere; box-shadow: 0 4px 16px rgba(60, 6, 45, .035); }
  .notice-row { display: grid; grid-template-columns: minmax(0, 10.5rem) minmax(0, 1fr); gap: .5rem 1.25rem; padding: 1.1rem 0; break-inside: avoid; }
  .notice-row + .notice-row { border-top: 1px solid var(--line); }
  .notice dt { color: var(--plum-deep); font-weight: 700; }
  .notice dd { margin: 0; min-width: 0; }
  @media (max-width: 760px) {
    .notice { padding-inline: 1rem; }
    .notice-row { grid-template-columns: minmax(0, 1fr); gap: .25rem; }
  }
  .guide-preface { padding: 2.25rem; background: linear-gradient(145deg, #fcf7fa, var(--wash)); border: 1px solid var(--line); border-radius: 20px; margin: 1.5rem 0 1rem; font-size: 1.125rem; line-height: 1.75; max-width: 820px; }
  .guide-preface h2 { font: 700 1.2rem/1.4 var(--sans); margin: 0 0 1rem; color: var(--plum-deep); }
  .clause { padding: 2.75rem 0 1rem; }
  .clause > h2 { display: flex; align-items: baseline; gap: 1rem; font: 700 1.85rem/1.3 var(--sans); letter-spacing: -.025em; margin: 0 0 1.5rem; color: var(--plum-deep); }
  .clause:target > h2 { color: var(--plum); }
  .number { flex: 0 0 auto; font: 650 1rem/1 var(--sans); font-variant-numeric: tabular-nums; letter-spacing: 0; color: var(--muted); }
  .pair { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1.5rem; align-items: start; }
  .terms, .explanation { min-width: 0; padding: 2rem; border: 1px solid var(--line); border-radius: 20px; font-size: 1.125rem; line-height: 1.75; }
  .explanation { background: linear-gradient(155deg, #fcf7fa, var(--wash)); }
  .terms { background: var(--paper); box-shadow: 0 8px 28px rgba(60, 6, 45, .035); }
  h3 { font: 700 1.125rem/1.4 var(--sans); margin: 0 0 1.25rem; color: var(--plum); }
  ul { padding-left: 1.3rem; margin: .4rem 0 1rem; }
  li { margin-bottom: .6rem; }
  footer { border-top: 1px solid var(--line); margin-top: 3rem; padding: 2rem 0 3rem; color: var(--muted); font-size: 1rem; }
  footer p { max-width: 800px; }
  .back-to-top { display: inline-block; margin-top: 1rem; font-weight: 600; }

  @media (max-width: 980px) {
    .shell { width: min(100% - 48px, 1160px); }
    .pair { grid-template-columns: minmax(0, 1fr); gap: 1rem; max-width: 820px; }
    .cards { grid-template-columns: minmax(0, 1fr); }
    .card h3 { padding: 1.25rem 1.5rem; }
    .card summary { min-height: 64px; padding: 1.1rem 1rem; }
    .card-detail { padding: 0 1rem 1.25rem; }
  }

  @media (max-width: 760px) {
    .shell { width: min(100% - 32px, 620px); }
    .header-content { gap: .75rem; min-height: 80px; }
    .hero-copy { padding: 2rem 0 2.6rem; }
    h1 { font-size: clamp(2rem, 6.5vw, 2.8rem); }
    .wordmark { flex-basis: 190px; width: 190px; }
    .title-version { margin-top: .75rem; }
    .overview { margin-bottom: 2.5rem; padding: 2rem 0; }
    .section-heading h2 { font-size: 1.9rem; }
    .cards, .pair { grid-template-columns: minmax(0, 1fr); }
    .overview-disclaimer { margin-bottom: 1.5rem; }
    .clause { padding: 2rem 0; }
    .clause > h2 { font-size: 1.55rem; }
    .terms, .explanation, .foundation, .guide-preface { padding: 1.5rem; }
    .view-options { display: flex; flex-direction: column; border-radius: 24px; }
    .view-label { justify-content: flex-start; padding: .8rem 1rem; border-radius: 18px; }
    nav a { display: flex; align-items: center; min-height: 44px; }
    .section-menu ol { padding: 1rem .25rem 0; }
    .back-to-top { padding: .5rem 0; min-height: 44px; }
  }

  @media (max-width: 480px) {
    .wordmark { flex-basis: 180px; width: 180px; }
    .theme-toggle { min-width: 44px; padding: 10px; }
    .theme-label { display: none; }
    .terms, .explanation, .foundation, .guide-preface { padding: 1.25rem; }
    .card h3 { padding: 1.25rem; }
    .card summary { padding: 1rem .75rem; }
    .card-detail { padding: 0 .75rem 1rem; }
  }

  @media (hover: hover) and (pointer: fine) {
    .card summary:hover { background: var(--tint); color: var(--accent); }
    .card summary:hover::after { border-color: var(--accent); }
    .primary-link:hover { background: #7a164f; }
  }

  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .card summary, .primary-link, .view-label, .theme-toggle { transition: none; }
    .card:hover, .primary-link:hover { transform: none; }
  }

  @media print {
    @page { margin: 16mm; }
    .card h3 { text-shadow: none; }
    .medallion-ground { fill: white; }
    .medallion-highlight { display: none; }
    .card::before, .card::after, .card h3::before, .card h3::after { display: none; }
    body { background: white; color: black; font-size: 10pt; }
    .card, .card h3, .card details[open], .notice, .foundation, .terms, .guide-preface, .explanation { background: white; box-shadow: none; transform: none; transition: none; }
    .shell { padding: 0; max-width: none; }
    .skip, nav, .reading-controls, .reading-note, .mode-note, .hero-links, .back-to-top, .overview-hint, .card summary::after, .theme-toggle { display: none !important; }
    .license-header { position: static; display: block; padding: 1rem 0; background: none; border: 0; box-shadow: none; }
    .header-content { display: block; min-height: 0; padding: 0; }
    .hero-copy { padding: 1rem 0; }
    h1 { font-size: 28pt; }
    .wordmark { width: 180px; }
    .overview { margin-bottom: 1rem; }
    .cards { display: block; }
    .card { break-inside: avoid; margin-bottom: 1rem; box-shadow: none; }
    .card li > a::after { content: ""; }
    .card-detail { display: block !important; }
    .card details::details-content { display: block; content-visibility: visible; }
    .clause { padding: 1rem 0; }
    .clause > h2 { break-after: avoid; font-size: 17pt; }
    .pair, .shell:has(#view-guide:checked) main .pair, .shell:has(#view-terms:checked) main .pair { display: flex; flex-direction: column; max-width: none; }
    .clause .terms, .clause .explanation, .shell:has(#view-guide:checked) main .clause .terms,
    .shell:has(#view-terms:checked) main .clause .explanation, .shell:has(#view-terms:checked) main .guide-preface { display: block !important; }
    .explanation, .guide-preface { background: none; border: none; border-left: 2px solid #777; border-radius: 0; padding: .5rem 1rem; margin-bottom: 1rem; }
    .terms, .foundation { padding: 0; border: 0; max-width: none; }
    p, li { orphans: 3; widows: 3; }
    h2, h3 { break-after: avoid; }
    a, .card li > a, .card small a { color: inherit; }
  }