:root{
  --paper:#FBFAF7; --card:#FFFFFF; --ink:#1B2333; --muted:#4D5566; --line:#D9D6CE; --line2:#C9C4B8;
  --pink:#ff186b; --pink-deep:#B5004A; --pink-soft:#FFE3EE; --on-pink:#1B2333;
  --field:#F3F1EB; --stamp:#8C1D46; --col:760px; --wide:860px; --r:4px;
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#14171E; --card:#1C2029; --ink:#ECEEF2; --muted:#AEB4C0; --line:#323846; --line2:#414858;
    --pink-deep:#FF6E9F; --pink-soft:#3A1A27; --field:#232834; --stamp:#FF8DB3;
  }
}
*{box-sizing:border-box}
html{overflow-x:clip}
body{margin:0; background:var(--paper); color:var(--ink);
  font-family:'Overpass',system-ui,-apple-system,'Segoe UI',sans-serif; font-size:17.5px; line-height:1.62;
  -webkit-text-size-adjust:100%; counter-reset:box}
h1,h2,h3{line-height:1.15; margin:0 0 .5em; letter-spacing:-.005em}
h1{font-size:clamp(2rem,1.3rem + 2.4vw,3.05rem); font-weight:800}
h2{font-size:clamp(1.35rem,1.05rem + 1vw,1.82rem); font-weight:750}
h3{font-size:1.1rem; font-weight:700}
p{margin:0 0 1em}
a{color:var(--pink-deep); text-underline-offset:.18em}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--pink-deep); outline-offset:2px}
img{max-width:100%}
.dk-mono,code{font-family:'Overpass Mono',ui-monospace,Consolas,monospace}
.dk-skip{position:absolute; left:-999px; top:0; min-height:44px; min-width:44px}
.dk-skip:focus{left:8px; top:8px; background:var(--card); padding:10px 14px; z-index:9}
.dk-wrap{max-width:1180px; margin:0 auto; padding:0 20px}
.dk-col{max-width:var(--col)}


.dk-top{background:var(--card); border-bottom:2px solid var(--ink)}
.dk-topin{display:flex; align-items:center; flex-wrap:wrap; gap:6px 24px; min-height:68px; padding-top:6px; padding-bottom:6px}
.brandmark{display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px; min-height:44px; min-width:0; color:var(--ink); text-decoration:none}
.brandmark img{display:block; height:26px; width:auto}
.brandmark span{font-family:'Overpass Mono',monospace; font-size:.82rem; letter-spacing:.02em; min-width:0; border-left:1px solid var(--line2); padding-left:10px}
.dk-nav{margin-left:auto; min-width:0}
.dk-nav ul{display:flex; flex-wrap:wrap; list-style:none; margin:0; padding:0}
.dk-nav a{display:inline-flex; align-items:center; min-height:44px; min-width:44px; padding:0 10px; color:var(--ink); text-decoration:none; font-size:.95rem}
.dk-nav a:hover{background:var(--field)}
.dk-nav a[aria-current=page]{font-weight:800; box-shadow:inset 0 -3px 0 var(--pink)}


.dk-hero{padding:44px 0 6px}
.dk-lede{font-size:1.14rem; color:var(--muted); max-width:64ch; margin:0 0 22px}
.dk-search{display:flex; flex-wrap:wrap; gap:0; max-width:860px; margin:0 0 8px; border:2px solid var(--ink); border-radius:var(--r); background:var(--card)}
.dk-search label{flex:1 0 100%; font-family:'Overpass Mono',monospace; font-size:.78rem; letter-spacing:.03em; color:var(--muted); padding:8px 16px 0}
.dk-search input{flex:1 1 280px; min-width:0; min-height:58px; padding:0 16px; font:inherit; font-size:1.05rem; color:var(--ink); background:transparent; border:0}
.dk-search input::placeholder{color:var(--muted)}
.dk-search button{min-height:58px; margin:6px; padding:0 30px; font:inherit; font-weight:800; cursor:pointer; color:var(--on-pink); background:var(--pink-soft); border:2px solid var(--pink); border-radius:var(--r)}
.dk-search button:hover{background:var(--pink); color:#fff}
.dk-hop{display:flex; flex-wrap:wrap; gap:0 22px; list-style:none; margin:0 0 22px; padding:0}
.dk-hop a{display:inline-flex; align-items:center; min-height:44px; min-width:44px; color:var(--muted); font-size:.95rem}
.dk-crumbs{font-size:.88rem; color:var(--muted); margin:0 0 8px}
.dk-crumbs a{display:inline-flex; align-items:center; min-height:44px; min-width:44px; color:var(--muted)}


.dk-wall{padding:26px 0 40px}
.dk-wall .dk-col p{color:var(--muted)}
.dk-tiles{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; list-style:none; margin:16px 0 0; padding:0; border-top:1px solid var(--line2); border-left:1px solid var(--line2)}
.dk-tiles li{min-width:0; margin:0; border-right:1px solid var(--line2); border-bottom:1px solid var(--line2); background:var(--card)}
.dk-tile{display:flex; flex-direction:column; height:100%; color:var(--ink); text-decoration:none; padding:10px}
.dk-tile:hover{background:var(--field)}
.dk-tile img{display:block; width:100%; height:auto; aspect-ratio:1/1; object-fit:cover}
.dk-tilecap{display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:2px 8px; padding:8px 2px 2px; min-height:44px}
.dk-tilecap b{font-weight:700; font-size:.97rem; min-width:0; overflow-wrap:anywhere}
.dk-tilecap small{display:block; flex:1 0 100%; font-size:.84rem; color:var(--muted); line-height:1.4}
.dk-dest{font-family:'Overpass Mono',monospace; font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); white-space:nowrap}


.dk-box{padding:36px 0; border-top:1px solid var(--line); counter-increment:box}
.dk-box h2::before{content:"Box " counter(box,decimal-leading-zero); display:block; width:max-content; font-family:'Overpass Mono',monospace;
  font-size:.74rem; font-weight:600; letter-spacing:.06em; color:var(--muted); border:1px solid var(--line2); padding:1px 7px 0; margin:0 0 10px; border-radius:2px}
.dk-box .dk-col > p:last-child{margin-bottom:0}
.dk-split{display:grid; grid-template-columns:minmax(0,55fr) minmax(0,45fr); gap:32px; align-items:stretch; margin:6px 0 0}
.dk-split.dk-flip{grid-template-columns:minmax(0,45fr) minmax(0,55fr)}
.dk-split.dk-flip > figure{order:2}
.dk-split > *{min-width:0}
.dk-split > figure{margin:0; display:flex; flex-direction:column; justify-content:center}
.dk-split > figure img{width:auto; max-width:100%; height:auto; align-self:center}
.dk-split > div p:last-child{margin-bottom:0}
figure{margin:22px 0}
figure img{display:block; width:auto; max-width:100%; height:auto; border:1px solid var(--line2); border-radius:var(--r); background:#fff}
figcaption{font-size:.86rem; color:var(--muted); margin-top:8px; padding-left:10px; border-left:3px solid var(--line2)}
.dk-col > figure{max-width:var(--col)}
.dk-wide{width:min(var(--wide),calc(100vw - 40px)); max-width:none}
.dk-wide img{margin:0}


.dk-stamp{position:relative; max-width:var(--col); margin:20px 0; padding:16px 18px 12px; background:var(--card); border:2px solid var(--stamp); border-radius:var(--r)}
.dk-stamp::before{content:"Official wording"; position:absolute; top:-11px; left:14px; background:var(--paper); padding:0 8px;
  font-family:'Overpass Mono',monospace; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--stamp)}
.dk-stamp blockquote{margin:0 0 8px; font-size:1.02rem}
.dk-stamp p.dk-src{margin:0; font-size:.84rem; color:var(--muted)}
.dk-stamp a{display:inline-flex; align-items:center; min-height:44px}


.dk-form{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; list-style:none; margin:18px 0 0; padding:0; max-width:900px; border:2px solid var(--ink); background:var(--card)}
.dk-form li{margin:0; min-width:0; border-bottom:1px solid var(--line2)}
.dk-form li:nth-child(odd){border-right:1px solid var(--line2)}
.dk-form li:nth-last-child(-n+2){border-bottom:0}
.dk-form a{display:block; height:100%; padding:14px 16px 16px; color:var(--ink); text-decoration:none}
.dk-form a:hover{background:var(--field)}
.dk-form code{display:block; font-size:.74rem; letter-spacing:.05em; text-transform:uppercase; color:var(--muted)}
.dk-form b{display:block; font-size:1.08rem; margin:2px 0 4px}
.dk-form span{display:block; font-size:.93rem; color:var(--muted); line-height:1.45}


.dk-tw{overflow-x:auto; margin:18px 0 22px; max-width:var(--col); background:var(--card); border:1px solid var(--line2); border-radius:var(--r)}
table{border-collapse:collapse; width:100%; font-size:.94rem}
th,td{text-align:left; vertical-align:top; padding:10px 12px; border-bottom:1px solid var(--line)}
tr:last-child td{border-bottom:0}
th{font-family:'Overpass Mono',monospace; font-size:.74rem; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); font-weight:600; background:var(--field)}
td.dk-num{white-space:nowrap; font-family:'Overpass Mono',monospace}


.dk-col ul,.dk-col ol{padding-left:1.25em; margin:0 0 1em}
.dk-col li{margin:0 0 .45em}
.dk-note{max-width:var(--col); margin:18px 0; padding:14px 18px; background:var(--field); border-left:4px solid var(--ink)}
.dk-note p:last-child{margin:0}
.dk-qa{max-width:var(--col); margin:10px 0 0}
.dk-qa details{border-top:1px solid var(--line2)}
.dk-qa details:last-child{border-bottom:1px solid var(--line2)}
.dk-qa summary{cursor:pointer; min-height:44px; display:flex; align-items:center; padding:10px 0; font-weight:700; font-size:1.03rem}
.dk-qa details p{margin:0 0 14px}
.dk-next{display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px; max-width:var(--col); margin:24px 0 0; padding:14px 18px; border:1px dashed var(--line2); background:var(--card)}
.dk-next p{margin:0; flex:1 1 280px}
.dk-next a{display:inline-flex; align-items:center; min-height:44px; font-weight:800}
.dk-box p a,.dk-box li a,.dk-box td a{display:inline-flex; align-items:center; min-height:44px; min-width:44px; vertical-align:middle}
.dk-box .dk-form a{display:block; min-height:0}


.dk-tool{max-width:var(--col); background:var(--card); border:2px solid var(--ink); border-radius:var(--r); padding:20px}
.dk-tool fieldset{border:0; margin:0 0 14px; padding:0}
.dk-tool legend{font-weight:800; margin:0 0 6px}
.dk-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 16px}
.dk-grid label{display:flex; flex-direction:column; gap:4px; font-size:.92rem; color:var(--muted)}
.dk-tool input,.dk-tool select{min-height:46px; padding:0 12px; font:inherit; color:var(--ink); background:var(--paper); border:1px solid var(--line2); border-radius:var(--r)}
.dk-lines{display:flex; flex-direction:column; gap:10px; margin:0 0 10px}
.dk-line{display:grid; grid-template-columns:minmax(0,2fr) repeat(2,minmax(0,1fr)) 46px; gap:8px; align-items:end}
.dk-line label{display:flex; flex-direction:column; gap:3px; font-size:.82rem; color:var(--muted)}
.dk-btn{min-height:48px; padding:0 22px; font:inherit; font-weight:800; cursor:pointer; color:var(--on-pink); background:var(--pink-soft); border:2px solid var(--pink); border-radius:var(--r)}
.dk-btn.dk-plain{background:transparent; border-color:var(--line2); color:var(--ink)}
.dk-x{min-height:46px; min-width:46px; font:inherit; cursor:pointer; background:transparent; border:1px solid var(--line2); border-radius:var(--r); color:var(--ink)}
.dk-out{margin-top:18px}
.dk-out[hidden]{display:none}
.dk-out ol{padding-left:1.3em}
.dk-out li{margin:0 0 12px}
.dk-flag{font-family:'Overpass Mono',monospace; font-size:.74rem; letter-spacing:.04em; text-transform:uppercase; padding:1px 6px; border-radius:2px; margin-right:6px; border:1px solid currentColor}
.dk-flag.ok{color:#2E6B3F} .dk-flag.warn{color:#8A5A00} .dk-flag.stop{color:var(--stamp)}
@media (prefers-color-scheme:dark){ .dk-flag.ok{color:#7FD39A} .dk-flag.warn{color:#F0C060} }


.dk-foot{margin-top:40px; background:#1B2333; color:#C8CEDA; padding:34px 0 40px; font-size:.92rem}
.dk-foot a{color:#F4F5F8}
.dk-footgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:22px}
.dk-foot h2{font-family:'Overpass Mono',monospace; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:#F4F5F8; margin:0 0 6px}
.dk-foot ul{list-style:none; margin:0; padding:0}
.dk-foot li a{display:inline-flex; align-items:center; min-height:44px; min-width:44px}
.dk-fine{margin-top:22px; padding-top:16px; border-top:1px solid #36405A; max-width:86ch}
.dk-fine p{margin:0 0 .7em}

@media (max-width:980px){
  .dk-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dk-split,.dk-split.dk-flip{grid-template-columns:minmax(0,1fr)}
  .dk-split.dk-flip > figure{order:0}
}
@media (max-width:700px){
  body{font-size:16.5px}
  .dk-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dk-form,.dk-grid{grid-template-columns:minmax(0,1fr)}
  .dk-form li:nth-child(odd){border-right:0}
  .dk-form li:nth-last-child(2){border-bottom:1px solid var(--line2)}
  .dk-line{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .dk-line label:first-child{grid-column:1 / -1}
  .brandmark span{border-left:0; padding-left:0; flex:1 0 100%}
  .dk-hero{padding-top:28px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important; scroll-behavior:auto!important}}