/* Dawn component layer for the site pages outside the two lay pages. */
:root{
  --sky:#CFE3F7;
  --cloud-pink:#F7C6EC;
  --magenta:#E0409F;
  --magenta-text:#A51F6D;
  --seal-vermilion:#C43D1A;
  --vermilion-text:#9B2C10;
  --paper:#FFF8F4;
  --ink:#16141A;
  --slate:#514A55;
  --card-dawn:#FFFCFA;
  --line-dawn:#AFA5B2;
  --ground:var(--paper);
  --panel:#FBEAF3;
  --card:var(--card-dawn);
  --type:var(--ink);
  --type-2:var(--slate);
  --shu:var(--seal-vermilion);
  --shu-ink:var(--vermilion-text);
  --hairline:var(--line-dawn);
  --ai:var(--magenta-text);
  --dawn-hero:radial-gradient(circle at 84% 14%,var(--cloud-pink) 0,transparent 42%),linear-gradient(135deg,var(--paper) 0%,var(--sky) 100%);
  --dawn-panel:linear-gradient(135deg,var(--sky) 0%,var(--paper) 52%,var(--cloud-pink) 100%);
}

html,body{max-width:100%;overflow-x:clip;background:var(--paper)}
body{color:var(--ink);font-size:16px;line-height:1.78}
.wrap{min-width:0}
header.site .wrap,footer.site .wrap,.banner .wrap{max-width:1160px;padding-inline:30px}
header.site{padding-top:20px;background:var(--paper)}
header.site .row{gap:14px}
.seal{width:44px;min-height:70px;flex-basis:44px;background:var(--seal-vermilion);color:var(--paper)}
.mark{font-size:18px;letter-spacing:.24em}
.status{color:var(--vermilion-text);border:1px solid var(--seal-vermilion);background:var(--paper)}
.langs{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px 16px;margin-left:auto;font-size:14px}
.langs a{color:var(--slate);padding:7px 2px;border-bottom:2px solid transparent}
.langs a:hover{color:var(--magenta-text);border-bottom-color:transparent}
.langs a[aria-current]{color:var(--magenta-text);border-bottom-color:var(--magenta)}
.rule{margin-top:18px;background:var(--line-dawn)}

.banner{background:linear-gradient(90deg,var(--sky),var(--paper) 56%,var(--cloud-pink));border-color:var(--line-dawn);color:var(--ink)}
.banner strong{color:var(--vermilion-text)}

main.wrap{isolation:isolate;padding-top:clamp(3.2rem,8vw,6.5rem)}
main.wrap::before{background:linear-gradient(to bottom,transparent,var(--line-dawn) 8%,var(--line-dawn) 92%,transparent)}
main.wrap::after{
  display:block;inset:1.25rem 0 auto;width:100%;height:clamp(280px,42vw,420px);
  background:var(--dawn-hero);background-size:auto;opacity:1;
  -webkit-mask-image:none;mask-image:none;border:1px solid var(--line-dawn);
}
main.wrap>*{position:relative}

.kicker{
  position:static!important;display:flex!important;align-items:center;gap:12px;
  width:auto;max-height:none;margin:3.8rem 0 1rem!important;
  color:var(--vermilion-text);font:600 11.5px/1.35 var(--mono);
  letter-spacing:.18em;text-transform:uppercase;writing-mode:horizontal-tb!important;
  white-space:normal;text-orientation:mixed;
}
.kicker::before{display:block!important;width:24px!important;height:2px!important;flex:0 0 24px;margin:0!important;background:var(--seal-vermilion)}
main.wrap>.kicker:first-child,main.wrap>nav:first-child .kicker{margin-top:0!important}

h1{max-width:16ch;margin:.28em 0 .42em;font-size:clamp(3.1rem,8vw,6.7rem);font-weight:600;line-height:.98;letter-spacing:-.045em}
h2{max-width:21ch;margin:0 0 .7em;font-size:clamp(2rem,4.5vw,3.8rem);font-weight:600;line-height:1.08;letter-spacing:-.03em}
h3{font-size:1.08rem;line-height:1.35}
.lede{max-width:43rem;color:var(--slate);font-size:clamp(1.08rem,2vw,1.32rem);line-height:1.65}
p,li{overflow-wrap:break-word}
main a,footer.site a,.bounds a,.banner a{color:var(--magenta-text);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--magenta-text) 35%,transparent)}
main a:hover,footer.site a:hover,.bounds a:hover,.banner a:hover{border-bottom-color:var(--magenta-text)}
a:focus-visible,summary:focus-visible{outline:3px solid var(--magenta-text);outline-offset:4px}

section{min-width:0;margin-top:1.25rem;padding:clamp(1.5rem,4vw,2.6rem);border:1px solid var(--line-dawn);background:var(--dawn-panel)}
section .kicker:first-child{margin-top:0!important}
.grid{gap:12px;border:0;background:transparent}
.card,.grid.three .card{min-width:0;padding:24px;border:2px solid var(--ink);background:var(--card-dawn);transition:transform .18s ease,box-shadow .18s ease}
.card:hover{transform:translate(-3px,-3px);box-shadow:7px 7px 0 var(--magenta)}
.card p{color:var(--slate);font-size:15px;line-height:1.68}

ol.steps{display:grid;gap:12px;margin:2rem 0}
ol.steps li{grid-template-columns:44px minmax(0,1fr);gap:0 18px;padding:20px;border:2px solid var(--ink);background:var(--card-dawn)}
ol.steps li::before{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:4px;background:var(--seal-vermilion);color:var(--paper);font:800 14px/1 var(--mono);box-shadow:inset 0 0 0 4px var(--seal-vermilion),inset 0 0 0 5px rgba(255,248,244,.68)}
ol.steps h3,ol.steps p{min-width:0}
ol.steps p{color:var(--slate);line-height:1.65}

.bounds{border-top:2px solid var(--ink)}
.bounds li{padding:16px 8px 16px 30px;border-bottom:1px solid var(--line-dawn);color:var(--slate)}
.bounds li::before{color:var(--seal-vermilion)}
.bounds strong{color:var(--ink)}
.facts{gap:9px}
.facts li{color:var(--slate);border-color:var(--line-dawn);background:var(--card-dawn)}
.facts li.key{color:var(--vermilion-text);border-color:var(--vermilion-text)}
.meta{color:var(--slate);line-height:1.65}
.note-under{padding:1rem 1.15rem;border:0;border-left:5px solid var(--magenta);background:linear-gradient(90deg,var(--sky),var(--paper) 72%);color:var(--slate)}

.tbl-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;border-color:var(--ink);background:var(--card-dawn)}
table.tbl{background:var(--card-dawn)}
table.tbl caption,table.tbl th,table.tbl td{color:var(--slate)}
table.tbl thead th,table.tbl tbody th,table.tbl code{color:var(--ink)}
table.tbl th,table.tbl td{border-color:var(--line-dawn)}
table.tbl td:has(.v-deny){background-image:linear-gradient(135deg,var(--cloud-pink),var(--card-dawn))}
.lvl-1,.v-deny,.v-esc{color:var(--vermilion-text)}
.lvl-2,.lvl-3{color:var(--slate)}
.v-permit{color:var(--ink)}

pre.code{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;background:var(--card-dawn);border-color:var(--ink);color:var(--ink)}
pre.code code{white-space:pre;overflow-wrap:normal}
code{max-width:100%;background:var(--card-dawn);border-color:var(--line-dawn);color:var(--ink);overflow-wrap:anywhere}
details{border-color:var(--line-dawn)}
details summary{color:var(--ink)}
details summary::before{color:var(--vermilion-text)}
details p{color:var(--slate)}

footer.site{margin-top:5rem;padding-bottom:64px;border-color:var(--line-dawn);background:var(--paper);color:var(--slate)}
footer.site .seal{margin-top:24px}

@media(max-width:760px){
  header.site .wrap,footer.site .wrap,.banner .wrap,.wrap{padding-inline:20px}
  header.site .row{align-items:flex-start}
  .mark{font-size:17px}
  .status{margin-top:4px}
  .langs{width:100%;justify-content:flex-start;margin-left:0;gap:5px 13px}
  main.wrap{padding-top:3.6rem}
  main.wrap::after{display:none}
  h1{font-size:clamp(2.8rem,14vw,4.5rem)}
  section{padding:1.4rem 1.15rem}
  ol.steps li{grid-template-columns:38px minmax(0,1fr);padding:16px;gap:0 14px}
  ol.steps li::before{width:38px;height:38px}
  .tbl-wrap,pre.code{max-width:100%}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}

/* hero wash: follows content height instead of a fixed panel, so long headlines never spill out */
main.wrap::after{display:none!important}
body{background:radial-gradient(60rem 34rem at 78% 10rem,rgba(247,198,236,.55),transparent 70%),radial-gradient(52rem 30rem at 12% 22rem,rgba(207,227,247,.6),transparent 70%),var(--paper);background-repeat:no-repeat}
h1{max-width:20ch;font-size:clamp(2.6rem,5.2vw,4.6rem);line-height:1.02}
@media(max-width:760px){h1{font-size:clamp(2.3rem,10vw,3.3rem)}}