article h2{color:var(--quinary-dark);font-size:var(--fs-2xl);margin-bottom:var(--space-lg);border-bottom:var(--bw-thick) solid var(--quinary-hover);padding-bottom:var(--space-sm);letter-spacing:var(--ls-medium)}article h3{color:var(--primary-dark);font-size:var(--fs-xl);margin-bottom:var(--space-lg);border-bottom:var(--bw-medium) dashed var(--primary);padding-bottom:var(--space-sm);letter-spacing:var(--ls-medium)}article h4{color:var(--gray-900);font-size:var(--fs-lg);margin-bottom:var(--space-sm);letter-spacing:var(--ls-wide)}article p{font-size:var(--fs-base);color:var(--gray-900);margin-bottom:var(--space-lg);line-height:var(--lh-medium);&.info{background:var(--white);border-left:var(--bw-xl) solid var(--gray-500);padding:var(--space-lg);border-radius:var(--br-xs);margin:var(--space-sm) 0}}section{margin-bottom:var(--space-3xl)}article>section:nth-of-type(1){p:last-of-type{background:color-mix(in srgb,var(--quinary-light) 50%,transparent);border-color:var(--quinary-hover)}}article>section:nth-of-type(2){>ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-lg);margin-bottom:var(--space-xl);>li{background:var(--white);outline:var(--bw-medium) solid var(--primary-light);border-radius:var(--br-sm);padding:var(--space-lg);transition-duration:var(--transition-base);&:hover{outline-color:var(--primary-hover);transform:scale(1.025);box-shadow:0 2px 8px color-mix(in srgb,var(--primary-hover) 25%,transparent)}>h3{margin-bottom:var(--space-sm)}>section{display:grid;grid-template-columns:30% 1fr;gap:var(--space-md) 0;padding:var(--space-xs);margin:0;h4{color:var(--primary-dark)}h4:nth-of-type(2),ol:nth-of-type(2){border-top:var(--bw-thin) solid var(--primary-light);padding-top:var(--space-md)}>ol{margin-left:var(--space-xs);>li{padding-bottom:var(--space-xs);&::marker{color:var(--primary-hover)}}}}}}p:last-of-type{background:color-mix(in srgb,var(--primary-light) 25%,transparent);border-left:var(--bw-xl) solid var(--primary)}}article>section:nth-of-type(3){>section:first-of-type{>ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,2fr));gap:var(--space-lg);text-align:center;margin-bottom:var(--space-2xl);li{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);border-radius:var(--br-sm);border:var(--bw-medium) solid var(--quaternary);padding:var(--space-lg);transition-duration:var(--transition-base);&:first-of-type{background:color-mix(in srgb,var(--senary-light) 25%,transparent);border-color:var(--senary);h4{color:var(--senary-dark)}}&:nth-of-type(2){background:color-mix(in srgb,var(--secondary-light) 25%,transparent);border-color:var(--secondary);h4{color:var(--secondary-dark)}}&:nth-of-type(3){background:color-mix(in srgb,var(--quaternary-light) 25%,transparent);border-color:var(--quaternary);h4{color:var(--quaternary-dark)}}&:hover{transform:scale(1.025)}figure{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);math{background:var(--gray-50);font-size:var(--fs-md);color:var(--gray-900);padding:var(--space-sm) var(--space-md) var(--space-sm) 0;border-radius:var(--br-xs)}figcaption{font-size:var(--fs-sm);color:var(--gray-800)}}}}>p{background:color-mix(in srgb,var(--info) 10%,transparent);border-left:var(--bw-xl) solid var(--info)}}section:last-of-type{>ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--space-lg);margin-bottom:var(--space-xl);>li{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);font-size:var(--fs-md);border-radius:var(--br-sm);padding:var(--space-lg);transition-duration:var(--transition-base);background:color-mix(in srgb,var(--sprint) 20%,transparent);border:var(--bw-thick) solid var(--sprint);strong{color:color-mix(in srgb,var(--sprint) 60%,var(--black))}mark{background:color-mix(in srgb,var(--senary-light) 60%,transparent);outline:var(--bw-thin) solid var(--senary);color:var(--black);font-size:var(--fs-sm);padding:var(--space-xs) var(--space-sm);border-radius:var(--br-full)}&:nth-of-type(4){mark{background:color-mix(in srgb,var(--quinary) 60%,transparent);outline-color:var(--quinary-dark)}}&:nth-of-type(5),&:nth-of-type(6),&:nth-of-type(7){background:color-mix(in srgb,var(--hurdles) 30%,transparent);border-color:var(--hurdles);strong{color:color-mix(in srgb,var(--hurdles) 60%,var(--black))}}&:hover{background:color-mix(in srgb,var(--secondary-light) 20%,transparent);border-color:var(--secondary);box-shadow:0 2px 8px color-mix(in srgb,var(--secondary-hover) 25%,transparent);strong{color:color-mix(in srgb,var(--secondary) 60%,var(--black))}}}}>p:last-of-type{background:color-mix(in srgb,var(--tertiary-light) 60%,transparent);border-left:var(--bw-xl) solid var(--tertiary-dark)}}}article>section:nth-of-type(4){nav{display:grid;grid-template-columns:1fr 1fr;border:var(--bw-xl) solid transparent;border-radius:var(--br-md);background-image:linear-gradient(var(--white),var(--white)),linear-gradient(to right,var(--primary-light) 47.5%,var(--quaternary-light) 52.5%);background-origin:border-box;background-clip:content-box,border-box;&:has(label:first-of-type input:checked)~section>table:first-of-type,&:has(label:last-of-type input:checked)~section>table:last-of-type{opacity:1;visibility:visible;pointer-events:auto}label{display:block;text-align:center;cursor:pointer;color:var(--gray-800);background:var(--white);font-size:var(--fs-md);padding:var(--space-sm) 0;transition:var(--transition-base);&:first-of-type:has(input:checked){color:var(--black);background:var(--primary-light)}&:last-of-type:has(input:checked){color:var(--black);background:var(--quaternary-light)}&:first-of-type{border-radius:var(--br-sm) 0 0 var(--br-sm)}&:last-of-type{border-radius:0 var(--br-sm) var(--br-sm) 0}input{appearance:none}}}>section{display:grid;margin:var(--space-xl) 0;table{grid-area:1 / 1;border-collapse:collapse;font-size:var(--fs-sm);font-weight:var(--fw-semibold);border-radius:var(--br-md);outline:var(--bw-thick) solid var(--quinary-hover);background:var(--white);color:var(--gray-700);cursor:pointer;letter-spacing:var(--ls-medium);width:100%;opacity:0;visibility:hidden;pointer-events:none;transition-duration:var(--transition-base);thead>tr>th{padding:var(--space-sm);color:var(--gray-800);background:var(--quinary);font-size:var(--fs-md);text-align:left;&:first-child{width:50%}&:not(:first-child){width:16.667%}}tbody>tr{border-bottom:var(--bw-thin) solid var(--gray-200);transition:var(--transition-fast);&.race:hover{background:color-mix(in srgb,var(--senary) 20%,transparent)}&.jump:hover{background:color-mix(in srgb,var(--secondary) 20%,transparent)}&.throw:hover{background:color-mix(in srgb,var(--quaternary) 20%,transparent)}&:hover{background:color-mix(in srgb,var(--quinary-light) 25%,transparent)}&:last-child{border-bottom:none}>td{padding:var(--space-sm);&:first-child{width:50%}&:not(:first-child){width:16.667%}}}}}}article>section:nth-of-type(5){>ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-lg);>li{background:color-mix(in srgb,var(--quinary-light) 25%,transparent);border-radius:var(--br-md);padding:var(--space-lg);outline:var(--bw-medium) solid var(--quinary-hover);transition-duration:var(--transition-base);&:hover{outline-color:var(--quinary-dark);box-shadow:0 2px 8px var(--quinary-dark);transform:scale(1.025) rotate(.005turn)}&:first-of-type,&:nth-of-type(4),&:nth-of-type(7){grid-column:1 / -1}}}}section:nth-of-type(6){ol{list-style-position:inside;padding:0;margin:var(--space-2xl) 0 var(--space-3xl);display:flex;flex-direction:column;gap:var(--space-lg);li{padding:var(--space-md) var(--space-lg);background:color-mix(in srgb,var(--secondary-light) 25%,transparent);border-radius:var(--br-sm);outline:var(--bw-medium) solid var(--secondary);font-size:var(--fs-base);line-height:var(--lh-medium);color:var(--gray-800);transition-duration:var(--transition-fast);&:first-of-type{background:color-mix(in srgb,var(--septenary-light) 25%,transparent);outline-color:var(--septenary)}&::marker{background:var(--secondary);color:var(--secondary-dark);font-size:var(--fs-lg);font-weight:var(--fw-semibold);&:first-of-type{background:var(--septenary);color:var(--septenary-dark)}}&:hover{background:color-mix(in srgb,var(--secondary-light) 45%,var(--white));outline-color:var(--secondary-hover);transform:scale(.98);&:first-of-type{background:color-mix(in srgb,var(--septenary-light) 45%,var(--white));outline-color:var(--septenary-dark)}}}}>p:last-of-type{background:color-mix(in srgb,var(--quinary-light) 50%,transparent);border-color:var(--quinary-hover)}}
