.rat .atf{grid-template-columns:1fr;grid-template-areas:"meta" "ans"}
.rat .ans{max-width:none;padding-bottom:26px}
.rat .ans h1{max-width:34ch;text-wrap:balance}
.rat .atf>.meta>.cat{display:flex}
.antwort{margin:18px 0 0;max-width:72ch;font-size:19px;line-height:1.5;color:var(--s-ink)}
.zahlen{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 22px;margin:22px 0 0;padding:0;border-top:2px solid var(--s-ink)}
.zahlen li{min-width:0;padding:12px 0 0;border-top:0}
.zahlen li+li{border-left:1px solid var(--s-rule);padding-left:18px}
.zahlen b{display:block;font:500 clamp(24px,2.2vw,32px)/1.1 var(--mono);letter-spacing:-.02em;color:var(--s-ink)}
.zahlen span{display:block;margin-top:4px;font-size:14px;line-height:1.4;color:var(--s-ink-2)}
.rat .hnote{margin-top:18px;font-size:12.5px}
.rat .hnote a{color:var(--s-ink)}
.lw{margin:40px 0 0;padding-top:18px;border-top:3px solid var(--acc)}
.lwh{margin:0 0 18px}
.lwh h2{margin:0;max-width:none;font-size:clamp(26px,2.4vw,36px)}
.lwh .no{margin:0 0 12px}
.lwo{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule)}
.lwb{display:grid;align-content:start;gap:6px;min-width:0;min-height:148px;padding:16px 16px 18px 0;margin:0;background:transparent;border:0;border-left:1px solid var(--rule);color:var(--ink);text-align:left;cursor:pointer;transition:background var(--t) var(--ease)}
.lwb:first-child{border-left:0;padding-left:0}
.lwb+.lwb{padding-left:16px}
.lwb:hover{background:var(--row-h)}
.lwb:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.lwb[aria-selected=true]{background:var(--ink);color:var(--bg)}
.lwb .nr{font:500 11.5px/1 var(--mono);letter-spacing:.12em;color:var(--acc)}
.lwb[aria-selected=true] .nr{color:var(--bg)}
.lwb b{font:700 clamp(20px,1.7vw,24px)/1.05 var(--disp);letter-spacing:.01em;text-transform:uppercase}
.lwb .sub{font-size:14.5px;line-height:1.4;color:var(--mute)}
.lwb[aria-selected=true] .sub{color:var(--bg);opacity:.85}
.lwb .mt{margin-top:auto;font:500 11.5px/1.3 var(--mono);letter-spacing:.06em;color:var(--mute)}
.lwb[aria-selected=true] .mt{color:var(--bg);opacity:.85}
.lwp{margin-top:-1px;border:1px solid var(--ink)}
.lwbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;padding:9px 16px;background:var(--ink);color:var(--bg);font:500 12px/1.3 var(--mono);letter-spacing:.06em}
.lwbar b{font-weight:500;text-transform:uppercase}
.lwx{min-height:36px;padding:0 12px;background:transparent;border:1px solid currentColor;color:inherit;font:500 12px/1 var(--mono);cursor:pointer}
.lwx:hover{background:var(--bg);color:var(--ink)}
.lwc{padding:clamp(16px,2.4vw,28px)}
.lwc>p{max-width:64ch}
.lwtoc{margin:0 0 22px;padding-left:1.4em;columns:2 280px;column-gap:40px;font-size:16.5px}
.lwtoc li{break-inside:avoid;padding:4px 0}
.clip{margin:0;max-width:860px}
.clf{position:relative;aspect-ratio:16/9;border:1px solid var(--rule)}
.clp{position:absolute;inset:0;width:100%;height:100%;display:block;padding:0;margin:0;background:transparent;border:0;cursor:pointer}
.clv{display:block;width:100%;height:100%}
.clb{position:absolute;left:clamp(12px,2vw,24px);bottom:clamp(12px,2vw,24px);display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 18px 0 14px;background:var(--btn);color:var(--btn-t);font:600 13px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.clp:hover .clb,.clp:focus-visible .clb{background:var(--btn-h)}
.clp:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.clip figcaption{padding:12px 0 4px;font-size:14.5px;line-height:1.5;color:var(--mute)}
.clip figcaption b{color:var(--ink)}
.clt{border-top:1px solid var(--rule)}
.clt summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font:600 13px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.clt p{max-width:70ch;font-size:16.5px}
.szene{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(18px,3vw,44px);align-items:start}
.szs{border:1px solid var(--rule);background:var(--stage)}
.szv{display:block;width:100%;height:auto;font-family:var(--mono)}
.szk rect{fill:var(--stage);stroke:var(--s-rule);stroke-width:1.5}
.szb0 rect{stroke:var(--cx);stroke-dasharray:4 3}
.szl1{font-size:11px;letter-spacing:.1em;text-transform:uppercase;fill:var(--s-ink-2)}
.szl2{font-size:11px;fill:var(--s-ink-2)}
.szz{font-size:30px;font-weight:500;fill:var(--s-ink)}
.szz2{font-size:22px;font-weight:500;fill:var(--cx)}
.szbg{fill:var(--off)}
.szfg{fill:var(--cx);transition:width 400ms var(--ease)}
.szt rect{fill:var(--off)}
.szt rect.on{fill:var(--cx)}
.szs text.szs{font-size:12px;letter-spacing:.06em;fill:var(--s-ink)}
.verfall .szb0 text.szz{fill:var(--s-ink-2);text-decoration:line-through}
.fertig .szfg{fill:var(--cx)}
.szt .no{margin:0 0 8px}
.szh{margin:0 0 10px;font:700 clamp(21px,1.9vw,26px)/1.2 var(--serif)}
.szp{min-height:5.2em;font-size:16.5px}
.szb{display:flex;gap:10px;margin:0 0 18px}
.szb .auf::after{display:none}
.szb .auf:disabled,.szb .btn:disabled{opacity:.35;cursor:default}
.szl{list-style:none;margin:0;padding:0!important;display:grid;gap:4px;counter-reset:z}
.szl li{margin:0!important}
.szl button{counter-increment:z;display:flex;align-items:center;gap:10px;width:100%;min-height:36px;padding:0 8px 0 0;background:transparent;border:0;border-bottom:1px solid var(--rule-2);color:var(--ink);font:400 15px/1.3 var(--serif);text-align:left;cursor:pointer}
.szl button::before{content:counter(z);display:grid;place-items:center;flex:none;width:22px;height:22px;border:1px solid var(--rule);font:500 11px/1 var(--mono)}
.szl button.cur{font-weight:700}
.szl button.cur::before{border-color:var(--acc);color:var(--acc)}
.szl button.ok::before{background:var(--acc);border-color:var(--acc);color:var(--btn-t)}
.szt .cl{margin:16px 0 0}
.kul{list-style:none;margin:0 0 10px;padding:0!important;display:flex;flex-wrap:wrap;gap:6px}
.kul li{margin:0!important}
.kul button{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px 0 6px;background:transparent;border:1px solid var(--rule);color:var(--ink);font:400 14.5px/1 var(--serif);cursor:pointer}
.kul button span{display:inline-grid;place-items:center;width:22px;height:22px;border:1px solid var(--rule);font:500 11px/1 var(--mono)}
.kul button.cur{border-color:var(--ink)}
.kul button.ok span{background:var(--acc);border-color:var(--acc);color:var(--btn-t)}
.kup{height:3px;background:var(--rule-2);margin:0 0 22px}
.kup i{display:block;height:100%;width:0;background:var(--acc);transition:width 400ms var(--ease)}
.kl h3{margin:0 0 12px;font:700 clamp(22px,2vw,28px)/1.15 var(--serif)}
.kl>p{max-width:66ch;font-size:16.5px}
.kq{padding:14px 0 6px;border-top:1px solid var(--rule)}
.kqf{font-weight:700;margin:0 0 10px}
.ka2{display:flex;flex-wrap:wrap;gap:8px}
.ka2 button{min-height:40px;padding:0 14px;background:transparent;border:1px solid var(--rule);color:var(--ink);font:400 15px/1 var(--serif);cursor:pointer}
.ka2 button.right{background:var(--acc);border-color:var(--acc);color:var(--btn-t)}
.ka2 button.wrong{text-decoration:line-through;opacity:.55}
.kw{margin:10px 0 0;font-size:14.5px;color:var(--mute);min-height:1.5em}
.kn{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-top:18px;padding-top:14px;border-top:1px solid var(--rule)}
.kn>div{display:flex;flex-wrap:wrap;gap:8px}
.kb{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:transparent;border:1px solid var(--ink);color:var(--ink);font:600 15px/1 var(--serif);cursor:pointer}
.kb.pri{background:var(--btn);border-color:var(--btn-b);color:var(--btn-t)}
.kb:disabled{opacity:.35;cursor:default}
.rechner{margin:0}
.rechner .cl{margin:0 0 14px}
.rei{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 22px;margin:0 0 18px}
.rei label{display:grid;gap:5px;font-size:14px;color:var(--mute)}
.rei input,.rei select{min-height:44px;padding:0 12px;font:500 17px/1.2 var(--mono);color:var(--ink);background:var(--bg);border:1px solid var(--ink);border-radius:0;-webkit-appearance:none;appearance:none}
.rei select{padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 16px) 50%,calc(100% - 11px) 50%;background-size:5px 5px;background-repeat:no-repeat;cursor:pointer}
.rei input:focus-visible,.rei select:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.reo{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 22px;margin:0 0 16px;border-top:2px solid var(--ink)}
.res{max-width:70ch;font-size:17px}
.scope.drei{grid-template-columns:repeat(3,minmax(0,1fr))}
.scope .zz{margin:0 0 8px;font:500 30px/1.1 var(--mono);letter-spacing:-.02em;color:var(--acc)}
.scope .zz+p{font-size:15.5px;color:var(--mute)}
.angebote{margin:6px 0 22px;font-size:15.5px;border-top:2px solid var(--ink)}
.angebote caption{text-align:left;padding:10px 0 4px;font:700 18px/1.3 var(--serif)}
.angebote th,.angebote td{padding:10px 14px 10px 0;vertical-align:top;border-bottom:1px solid var(--rule-2)}
.angebote thead th{font:500 11.5px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.angebote tbody th{font-weight:700}
.plan-bild.fr{align-items:start}
.rat~.wrap .note,.sec .body>.note{max-width:none}
.fristen{list-style:none;margin:0;padding:0!important}
.fristen>li{margin:0 0 14px!important;padding:10px 0 0;border-top:2px solid var(--ink)}
.fristen .fk{margin:0 0 8px;font:700 16px/1.3 var(--serif)}
.fristen ul{list-style:none;margin:0;padding:0!important;display:grid;gap:6px}
.fristen ul li{position:relative;display:grid;grid-template-columns:92px minmax(0,1fr);gap:0 14px;align-items:center;margin:0!important;min-height:30px;font-size:14.5px;line-height:1.35;color:var(--mute)}
.fristen ul li::before{content:"";grid-column:1/-1;grid-row:1;height:12px;margin-left:calc(var(--o)/90*100%);width:max(1.6%,calc(var(--d)/90*100%));background:var(--acc);opacity:.9}
.fristen ul li b{grid-column:1;grid-row:2;font:500 14px/1.2 var(--mono);color:var(--ink)}
.fristen ul li span{grid-column:2;grid-row:2}
@media (max-width:1100px){.lwo{grid-template-columns:repeat(3,minmax(0,1fr))}.lwb{min-height:132px;border-top:1px solid var(--rule);margin-top:-1px}.lwb:nth-child(3n+1){border-left:0;padding-left:0}.lwb:nth-child(3n+2),.lwb:nth-child(3n){padding-left:16px}.rei,.reo{grid-template-columns:repeat(2,minmax(0,1fr))}.reo>div:nth-child(3){border-left:0;padding-left:0}.szene{grid-template-columns:1fr}}
@media (max-width:900px){.zahlen{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 22px}.zahlen li:nth-child(3){border-left:0;padding-left:0}.scope.drei{grid-template-columns:1fr}}
@media (max-width:760px){.lwo{grid-template-columns:1fr 1fr}.lwb{min-height:0;padding:14px 10px 14px 0}.lwb:nth-child(n){border-left:0;padding-left:0}.lwb:nth-child(2n){border-left:1px solid var(--rule);padding-left:12px}.lwb b{font-size:18px}.lwb .sub{display:none}.lwtoc{columns:1}.angebote thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.angebote tr{display:block;padding:10px 0;border-bottom:1px solid var(--rule)}.angebote th,.angebote td{display:block;padding:3px 0;border:0}.angebote td::before{content:attr(data-l) ": ";font:500 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}.rei,.reo{grid-template-columns:1fr}.reo>div+div{border-left:0;padding-left:0;border-top:1px solid var(--rule-2);margin-top:10px}.zahlen{grid-template-columns:1fr 1fr}.fristen ul li{grid-template-columns:80px minmax(0,1fr)}.antwort{font-size:17.5px}.szl1,.szl2,.szs text.szs{font-size:16px}.szz{font-size:38px}.szz2{font-size:28px}}
@media (prefers-reduced-motion:reduce){.szfg,.kup i{transition:none}}
.t-guide .hero::before{background-image:url(img/hero-guide-1600.webp);background-image:image-set(url(img/hero-guide-1600.avif) type("image/avif"),url(img/hero-guide-1600.webp) type("image/webp"));background-position:right top 7%;background-size:auto 70%;opacity:.17}
[data-theme=dark] .t-guide .hero::before{opacity:.13}
.sec .body .scope ul{font:700 16px/1.35 var(--serif)}
.sec .body .scope ul li{position:relative;margin:0!important;padding:7px 0 7px 18px;border-top:1px solid var(--rule-2)}
.sec .body .scope ul li:first-child{border-top:0;padding-top:2px}
.sec .body .scope ul li::before{content:"";position:absolute;left:0;top:calc(7px + .45em);width:7px;height:7px;background:var(--acc)}
.sec .body .scope ul li:first-child::before{top:calc(2px + .45em)}
.angebote caption{caption-side:top;font-size:18px;color:var(--ink)}
.fristen>li.fax{position:relative;height:22px;margin:0!important;padding:0;border-top:1px solid var(--ink);font:500 11px/1 var(--mono);letter-spacing:.04em;color:var(--mute)}
.fax span{position:absolute;top:6px;left:calc(var(--x) * 100% / 3);transform:translateX(-50%);white-space:nowrap}
.fax span::before{content:"";position:absolute;top:-7px;left:50%;height:5px;border-left:1px solid var(--ink)}
.fax span:first-child{transform:none}
.fax span:first-child::before{left:0}
.fax span:last-child::before{left:auto;right:0}
.fax span:last-child{transform:translateX(-100%)}
@media (max-width:900px){.t-guide .hero::before{background-image:url(img/hero-guide-800.webp);background-image:image-set(url(img/hero-guide-800.avif) type("image/avif"),url(img/hero-guide-800.webp) type("image/webp"));background-position:right bottom;background-size:150% auto;opacity:.06}}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .t-guide .hero::before{opacity:.13}}
@media (max-width:760px){.zahlen b{font-size:22px}.rat .meta .pr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.rat .meta .pr>div{padding:7px 8px;border-top:1px solid var(--s-rule)}.rat .meta .pr dd{font-size:11.5px;letter-spacing:0;white-space:normal}}
.eckg dl>div:first-child{padding-left:0}
.eckg dl>div+div{border-left:1px solid var(--s-rule)}
.mx{margin:6px 0 22px}
.mxc{margin:0 0 10px;font:700 18px/1.3 var(--serif);color:var(--ink)}
.mxw{display:none}
.mxs{overflow-x:auto;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule)}
.mxs:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.mxt{width:100%;border-collapse:separate;border-spacing:0;font-size:15.5px;table-layout:fixed}
.mxt th,.mxt td{padding:12px 14px;vertical-align:top;text-align:left;border-bottom:1px solid var(--rule-2)}
.mxt tbody tr:last-child>*{border-bottom:0}
.mxt thead th{padding-top:12px;font:700 19px/1.25 var(--serif);color:var(--ink);border-bottom:1px solid var(--ink)}
.mxt th:first-child{position:sticky;left:0;z-index:1;width:178px;background:var(--bg)}
.mxt tbody th{font:500 11.5px/1.35 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.mxt td{color:var(--ink)}
.mxt td.hi{box-shadow:inset 3px 0 0 var(--acc);background:var(--row-h)}
.mxt .tag{display:block;margin:0 0 5px;font:500 10.5px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--acc)}
.mxn{margin:8px 0 0;font-size:13.5px;color:var(--mute)}
@media (max-width:760px){.eckg dl>div{flex-direction:row-reverse;justify-content:space-between;align-items:baseline;gap:12px;padding:7px 0;border-top:1px solid var(--s-rule)}.eckg dl>div:first-child{border-top:0;padding-top:0}.eckg dl>div+div{border-left:0}.mxw{display:block;margin:0 0 6px;font:500 11px/1.3 var(--mono);letter-spacing:.06em;color:var(--mute)}.mxt{width:640px;font-size:14.5px}.mxt th:first-child{width:104px;box-shadow:6px 0 8px -6px rgba(0,0,0,.18)}.mxt th,.mxt td{padding:10px 10px}.mxt thead th{font-size:17px}}
.mxt thead th{text-transform:none;letter-spacing:0}
@media (max-width:760px){.mxt th:first-child{width:118px}.mxt tbody th{font-size:10px;letter-spacing:.02em;overflow-wrap:anywhere;hyphens:auto}}
.rat .h1w{width:fit-content;max-width:100%}
.rat .h1w h1{max-width:none;text-wrap:wrap}
.h1x span{display:block}
.rat .h1w .antwort{width:0;min-width:100%;max-width:none}
.sec .body ul.wz.wz3{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:22px}
.wz3>li:last-child:nth-child(odd){grid-column:auto}
.wz3>li:last-child:nth-child(odd) dl{display:block}
.wz3>li:last-child:nth-child(odd) dl>div+div{border-top:1px solid var(--rule-2)}
.wz3 .wzh h3 sup{font-size:.55em}
@media (max-width:1100px){.sec .body ul.wz.wz3{grid-template-columns:minmax(0,1fr)}.wz3 .wzb dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}.wz3 .wzb dl>div:nth-child(2){border-top:0}}
@media (max-width:760px){.wz3 .wzb dl{display:block}.wz3 .wzb dl>div:nth-child(2){border-top:1px solid var(--rule-2)}}
.steps.stv{grid-template-columns:minmax(0,1fr);max-width:none;margin:22px 0 10px;border-top:2px solid var(--ink)}
.steps.stv li{display:grid;grid-template-columns:56px minmax(0,15rem) minmax(0,1fr);column-gap:24px;align-items:baseline;padding:16px 0!important;border:0;border-bottom:1px solid var(--rule)}
.steps.stv li::before{content:counter(s,decimal-leading-zero);position:static;display:block;width:auto;height:auto;border:0;background:none;font:500 26px/1 var(--mono);color:var(--acc)}
.steps.stv li:last-child::after{display:none}
.steps.stv b{font:700 18px/1.3 var(--serif)}
.steps.stv span{margin:0;font-size:16.5px;line-height:1.5;color:var(--ink-2)}
@media (max-width:760px){.steps.stv{margin:18px 0 10px}.steps.stv li{grid-template-columns:40px minmax(0,1fr);column-gap:14px;padding:14px 0!important;border-left:0}.steps.stv li::before{font-size:20px;grid-row:1/3;left:auto;top:auto}.steps.stv b,.steps.stv span{grid-column:2}.steps.stv span{margin-top:4px;font-size:15.5px}}
.chr{--dw:118px;list-style:none;max-width:none;margin:24px 0 10px;padding:0!important}
.chr li{position:relative;display:grid;grid-template-columns:var(--dw) minmax(0,1fr);column-gap:46px;margin:0!important;padding:0 0 24px}
.chr li::before{content:"";position:absolute;left:calc(var(--dw) + 22px);top:8px;bottom:-8px;width:2px;background:var(--rule)}
.chr li:last-child::before{display:none}
.chr li::after{content:"";position:absolute;left:calc(var(--dw) + 17px);top:5px;width:12px;height:12px;box-sizing:border-box;border:2px solid var(--acc);background:var(--bg)}
.chr li:last-child{padding-bottom:4px}
.chr li:last-child::after{background:var(--acc)}
.chr .chd{margin:0;text-align:right;font:500 15px/1.5 var(--mono);color:var(--ink);font-variant-numeric:tabular-nums}
.chr .che{margin:0;font:700 18px/1.35 var(--serif);color:var(--ink)}
.chr .chq{margin:3px 0 0;font:500 12px/1.4 var(--mono);letter-spacing:.04em;color:var(--mute)}
@media (max-width:760px){.chr{--dw:86px}.chr li{column-gap:34px}.chr li::before{left:calc(var(--dw) + 16px)}.chr li::after{left:calc(var(--dw) + 11px)}.chr .chd{font-size:13px}.chr .che{font-size:16.5px}}
a.kb{text-decoration:none}
.pruefer{margin:0}
.pruefer .cl{margin:0 0 14px;max-width:70ch}
.prf{display:grid;gap:5px;margin:0 0 18px;font-size:14px;color:var(--mute)}
.pri{display:flex;gap:10px;max-width:620px}
.pri input{flex:1;min-width:0;min-height:44px;padding:0 12px;font:500 17px/1.2 var(--mono);color:var(--ink);background:var(--bg);border:1px solid var(--ink);border-radius:0;-webkit-appearance:none;appearance:none}
.pri input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prr{margin:0 0 16px}
.prt{border-top:2px solid var(--ink);padding-top:12px}
.prt>p{max-width:70ch}
.prt.no{border-top-color:var(--mute)}
.prs{margin:0 0 10px;font-size:17px}
.prn{margin:8px 0;font-size:15px;color:var(--ink-2)}
.prd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 22px;margin:12px 0 0;padding:10px 0 0;border-top:1px solid var(--rule-2)}
.prd dt{font:500 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.prd dd{margin:2px 0 0;font-size:15px}
.prl{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.prl button{min-height:44px;padding:0 12px;background:transparent;border:1px solid var(--ink);color:var(--ink);font:500 15px/1 var(--mono);cursor:pointer}
@media (min-width:900px){.prd{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (max-width:560px){.pri{flex-direction:column}.pri .btn{width:100%}}
.xst{container-type:inline-size;margin:18px 0 20px}
.xsc{display:grid;grid-template-columns:minmax(0,1fr);border:2px solid var(--ink);background:var(--stage)}
.xsc:focus-visible,.xbar button:focus-visible{outline:2px solid var(--cx);outline-offset:3px}
.xcv{min-width:0;position:relative}
.xcv canvas{display:block;width:100%;height:auto}
.xpan{margin:0;padding:12px 14px;border-top:1px solid var(--ink);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;align-content:start;background:var(--bg);min-height:calc(var(--xr) / 2 * 64px)}
.xpan div{min-width:0}
.xpan dt,.xpan dd{hyphens:auto;overflow-wrap:break-word}
.xpan dt{font:500 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.xpan dd{margin:3px 0 0;font:700 20px/1.15 var(--disp);color:var(--ink);font-variant-numeric:tabular-nums}
.xpan dd.xl{font-size:15px;line-height:1.3}
.xpan small{display:block;margin-top:4px;font:400 11px/1.4 var(--mono);color:var(--mute)}
.xcap{border:2px solid var(--ink);border-top:0;padding:12px 14px 14px;min-height:118px;background:var(--bg)}
.xeb{display:block;font:500 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--cx)}
.xct{margin:6px 0 0;font:700 19px/1.3 var(--disp);color:var(--ink);text-wrap:balance}
.xbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:10px 0 0}
.xbar button{min-width:44px;min-height:44px;margin:0;padding:0 10px;border:1px solid var(--ink);border-radius:0;background:var(--bg);color:var(--ink);font:500 13px/1 var(--mono);cursor:pointer}
.xbar button:hover{border-color:var(--cx);color:var(--cx)}
.xdots{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.xdots li{margin:0;padding:0}
.xdots button[aria-current=step],.xplay[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.xplay{margin-left:auto;padding:0 18px;letter-spacing:.08em;text-transform:uppercase;font-size:11px}
.xpl .xtx{margin:18px 0 12px;padding-left:1.4em}
.xpl .xtx li{margin:0 0 12px;padding:2px 0 2px 12px;border-left:2px solid transparent}
.xpl .xtx li[aria-current=step]{border-left-color:var(--cx)}
.xpl .xtx h3{margin:0 0 4px}
.xpl .xtx p{margin:0}
@container (min-width:720px){.xsc{grid-template-columns:minmax(0,1fr) 236px}.xpan{border-top:0;border-left:1px solid var(--ink);grid-template-columns:minmax(0,1fr);min-height:0}.xcap{min-height:92px}.xct{font-size:22px}}
@container (max-width:520px){.xdots{order:-1;flex:1 1 100%}.xnav{flex:1 1 0}.xplay{flex:2 1 0;margin-left:0}.xct{font-size:17px}.xcap{min-height:140px}.xpan dd{font-size:17px}}
.clf video{display:block;width:100%;height:100%;background:#000}
