/*
 * CSS Copyright Mike Pierce | All rights reserved
 * mapierce2 (ατ) coloradomesa • edu
 * */

@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,600;1,400&family=Inconsolata:wght@500&family=Playfair+Display:wght@500&display=swap');

:root {
    color-scheme: light;
    /*color-scheme: light dark;*/
    --foreground: light-dark(#2b2821, #e3cfb4);
    --background: light-dark(#f8f3ec, #2b2821);
    --whiteblack: light-dark(#ffffff, #000000);
    --red: light-dark(#b03a48, #b03a48);
    --orange: light-dark(#d4804d, #d4804d);
    --yellow: light-dark(#e0c872, #e0c872);
    --green: light-dark(#3e6958, #3e6958);
    --blue: light-dark(#5c8b93, #5c8b93);
    --teal: light-dark(#5d7275, #5d7275);
    --violet: light-dark(#243d5c, #243d5c);
    --bodytext:'Crimson Pro', serif;
    --headingtext:'Playfair Display', serif;
    --monotext:'Inconsolata', monospace;
    --regularweight:400;
    --headingweight:500;
    --strongweight:600;
    --monoweight:500;
    scrollbar-color: var(--blue) rgb(from var(--background) r g b / 0); 
}

* {
    border:0; 
    font:inherit; 
    margin:0; 
    padding:0; 
    vertical-align:baseline;
    /*border:1px solid black;*/
}

body {
    background-color:var(--background); 
    /*
    background-image:linear-gradient(
        rgb(from var(--background) r g b / 0.111111%) 0.676667%, rgb(from var(--background) r g b / 0.111111%) 0.678287%, rgb(from var(--background) r g b / 0.111118%) 0.680030%, rgb(from var(--background) r g b / 0.111143%) 0.681913%, rgb(from var(--background) r g b / 0.111232%) 0.683958%, rgb(from var(--background) r g b / 0.111477%) 0.686193%, rgb(from var(--background) r g b / 0.112062%) 0.688651%, rgb(from var(--background) r g b / 0.113303%) 0.691377%, rgb(from var(--background) r g b / 0.115708%) 0.694428%, rgb(from var(--background) r g b / 0.120027%) 0.697879%, rgb(from var(--background) r g b / 0.127342%) 0.701835%, rgb(from var(--background) r g b / 0.139152%) 0.706440%, rgb(from var(--background) r g b / 0.157527%) 0.711906%, rgb(from var(--background) r g b / 0.185303%) 0.718552%, rgb(from var(--background) r g b / 0.226394%) 0.726884%, rgb(from var(--background) r g b / 0.286224%) 0.737749%, rgb(from var(--background) r g b / 0.372153%) 0.752654%, rgb(from var(--background) r g b / 0.492925%) 0.774413%, rgb(from var(--background) r g b / 0.652602%) 0.808111%, rgb(from var(--background) r g b / 0.825412%) 0.858802%, rgb(from var(--background) r g b / 0.931853%) 0.909403%, rgb(from var(--background) r g b / 0.963961%) 0.933548%, rgb(from var(--background) r g b / 0.976917%) 0.946629%, rgb(from var(--background) r g b / 0.983927%) 0.955378%, rgb(from var(--background) r g b / 0.988299%) 0.961882%, rgb(from var(--background) r g b / 0.991258%) 0.967026%, rgb(from var(--background) r g b / 0.993367%) 0.971261%, rgb(from var(--background) r g b / 0.994925%) 0.974850%, rgb(from var(--background) r g b / 0.996103%) 0.977956%, rgb(from var(--background) r g b / 0.997010%) 0.980689%, rgb(from var(--background) r g b / 0.997719%) 0.983125%, rgb(from var(--background) r g b / 0.998273%) 0.985320%, rgb(from var(--background) r g b / 0.998711%) 0.987315%, rgb(from var(--background) r g b / 0.999055%) 0.989142%,
        var(--background)), 
        url("banner.webp");
    */
    background-image:linear-gradient(transparent, var(--background)), url("banner.webp");
    background-repeat:no-repeat;
    background-size:100% calc(100*400vw/1920 + 1em/12), 100%;
    color:var(--foreground);
    font-family:var(--bodytext);
    font-weight:var(--regularweight);
    font-size:clamp(1rem, 25vw/18 + 1rem/2, 3rem/2);
    line-height:calc(4em/3);
    font-variant-numeric:oldstyle-nums;
    font-feature-settings:"liga", "clig", "dlig";
    font-kerning:normal;
    width:min(100% - 24px, 325%/6 + 240px, 12*12*6px);
    margin:calc(125vw/6 - 24px) auto calc(12*12px) clamp(12px, 275%/12 - 120px , 12*12px);
    counter-reset:theorem;
}

.katex {font-size:calc(11em/12); padding:0 calc(1em/12) 0 calc(1em/12);}

h1, h2, h3 {clear:both; display:block; font-family:var(--headingtext); font-weight:var(--headingweight); font-variant-numeric:lining-nums; line-height:calc(7em/6); margin:calc(3em/2) 0 calc(1em/3) 0;}
h1 {font-size:clamp(6rem/3, 100vw/18 + 0rem/3, 12rem/3);}
h2 {font-size:clamp(5rem/3, 100vw/27 + 1rem/3, 9rem/3);}
h3 {font-size:clamp(4rem/3, 100vw/54 + 2rem/3, 6rem/3);}
span.h5 {font-weight:var(--strongweight);}
span.h5:after {content:"\2004\00B7\2004";}
p, ul, ol, li, dl, dt, dd, details, blockquote, aside, figure, pre code {clear:both; position:relative; margin:calc(3em/3) 0 calc(3em/3) 0;}
p:first-child, ul:first-child, ol:first-child, li:first-child, dl:first-child, details:first-child, blockquote:first-child, aside:first-child, pre code:first-child {margin-top:0;}
details, ul, ol, dl {margin-left:calc(4em/3);}
details ul, details ol, details dl {margin-left:calc(2em/3);}
dl dt {font-family:var(--headingtext); font-weight:var(--headingweight); margin:calc(2em/3) 0 calc(1em/3) calc(0em/3);}
dl dt cite {font-style:normal;}
dl dd {margin:calc(1em/3) 0 calc(1em/3) calc(2em/3);}
li dl {margin-left:0;}
ul {list-style-type:disc;}
ul ul {list-style-type:circle;}
ul ul ul {list-style-type:square;}
ul ul ul ul {list-style-type:circle;}
ol {list-style-type:numeric;}
@counter-style lower-alpha-parenthesis {system: extends lower-alpha; suffix:') '; prefix:'(';}
ol ol {list-style-type:lower-alpha-parenthesis;}
@counter-style lower-roman-parenthesis {system: extends lower-roman; suffix:') '; prefix:'(';}
ol ol ol {list-style-type:lower-roman-parenthesis;}
@counter-style lower-greek-parenthesis {system: extends lower-greek; suffix:') '; prefix:'(';}
ol ol ol ol {list-style-type:lower-greek-parenthesis;}
li[note] {margin-left:2em;}
li[note]::marker {content:attr(note) "\2004\00B7\2004"; font-weight:var(--strongweight);}
.inline li {display:inline; white-space:nowrap;}
.inline li::after {content:"\2004\2004\2004";}
.inline li:last-child::after {content:none;}
i, em, q, var, cite {font-style:italic;}
q em, q var, q cite {font-style:normal;}
cite em, cite var {font-style:normal;}
em var, em cite {font-style:normal;}
b, strong {font-weight:var(--strongweight);}
q::before {content:"\0201C";}
q::after {content:"\0201D";}
sub {vertical-align:sub; font-size:calc(2em/3); line-height:0;}
sup {vertical-align:super; font-size:calc(2em/3); line-height:0;}
dfn {font-style:italic; color:color-mix(in oklch, var(--teal) calc(200%/3), var(--foreground));}
mark {background-color:color-mix(in oklch, var(--yellow) calc(200%/3), var(--background)); padding-right:calc(1em/6); padding-left:calc(1em/6); border-radius:calc(1em/3);}
ins {text-decoration:none; background-color:color-mix(in oklch, var(--green) calc(100%/12), var(--background)); color:color-mix(in oklch, var(--green) calc(100%/2), var(--foreground)); font-weight:var(--strongweight); border-radius:calc(1em/3);}
del {text-decoration:underline var(--red) calc(1em/12); text-decoration-skip-ink:none; text-underline-offset:calc(-1em/4);}
s {text-decoration:underline var(--foreground) calc(1em/12); text-decoration-skip-ink:none; text-underline-offset:calc(-1em/4);}
address {display:inline;}
time {display:inline;}

::selection {color:var(--background); background:var(--foreground);}

a {text-decoration:underline color-mix(in oklch, var(--foreground) calc(100%/24), var(--background)) calc(1em/3); text-decoration-skip-ink:none; text-underline-offset:calc(-1em/6);}
a:link {color:color-mix(in oklch, var(--blue) calc(100%/1), var(--foreground)); text-decoration-color:color-mix(in oklch, var(--blue) calc(100%/72), var(--background));}
a:visited {color:color-mix(in oklch, var(--blue) calc(100%/1), var(--foreground)); text-decoration-color:color-mix(in oklch, var(--red) calc(100%/12), var(--background));}
a:hover {color:color-mix(in oklch, var(--foreground) calc(500%/6), var(--background)); text-decoration-color:var(--foreground); transition:calc(1s/6); text-decoration-thickness:calc(1em/12); text-underline-offset:calc(100%/4);}
a:link:hover {color:color-mix(in oklch, var(--blue) calc(200%/3), var(--foreground)); text-decoration-color:color-mix(in oklch, var(--blue) calc(500%/6), var(--background)); transition:calc(1s/6); text-decoration-thickness:calc(1em/12); text-underline-offset:calc(100%/4);}
a:visited:hover {color:color-mix(in oklch, var(--blue) calc(200%/3), var(--foreground)); text-decoration-color:color-mix(in oklch, var(--red) calc(500%/6), var(--background)); transition:calc(1s/6); text-decoration-thickness:calc(1em/12); text-underline-offset:calc(100%/4);}
a[href^='#'] {margin-right:calc(-1ch/3);}
a[href^='#']::after {visibility:hidden; content:"\00A7"; font-size:calc(2em/3); position:relative; top:calc(-2em/3); margin-left:calc(-1ch/3); white-space:nowrap;}
a[href^='#']:hover::after {visibility:visible; color:var(--blue); transition:calc(1s/6);}
a.url {font-family:var(--monotext); font-weight:var(--monoweight); font-size:calc(11em/12); padding:0 calc(1em/12) 0 calc(1em/12);}

code, kbd, samp {
    position:relative;
    display:inline; 
    background-color:color-mix(in oklch, var(--background) calc(200%/3), var(--whiteblack));
    font-family:var(--monotext); 
    font-weight:var(--monoweight); 
    font-size:calc(5em/6); 
    line-height:calc(4em/3); 
    padding:0 calc(1em/6) 0 calc(1em/6); 
    border-radius:calc(1em/3);
}

kbd {
    border:1px solid color-mix(in oklch, var(--background) calc(500%/6), var(--yellow)); 
    box-shadow:0 2px 1px color-mix(in oklch, var(--background) calc(500%/6), var(--yellow)); 
    white-space:nowrap;
}

pre {
	display:block;
    clear:left;
    background-color:color-mix(in oklch, var(--background) calc(200%/3), var(--whiteblack));
	font-size:clamp(4em/6, 175vw/108 + 1em/12, 5em/6);
    margin-bottom:1em;
    padding:1em 0em 1em 2em;
    line-height:1em;
    max-width:100%;
    overflow-x:auto;
}  
pre code, pre samp{padding-right:0em; padding-left:0em; border-radius:0em;}
pre samp::before{content:"\2192"; position:absolute; bottom:calc(0em/12); left:-1em;}

pre code.hljs {}
.hljs-subst {color:color-mix(in oklch, var(--foreground) calc(100%/2), var(--background));}
.hljs-comment {color:color-mix(in oklch, var(--foreground) calc(100%/3), var(--background));}
.hljs-attr,.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-section,.hljs-selector-tag {color:var(--blue);}
.hljs-attribute {color:var(--violet);}
.hljs-name,.hljs-number,.hljs-quote,.hljs-selector-id,.hljs-template-tag,.hljs-type {color:color-mix(in oklch, var(--orange) calc(500%/6), var(--red));}
.hljs-selector-class {color:var(--blue);}
.hljs-link,.hljs-regexp,.hljs-selector-attr,.hljs-string,.hljs-symbol,.hljs-template-variable,.hljs-variable {color:color-mix(in oklch, var(--yellow) calc(200%/3), var(--red));}
.hljs-meta,.hljs-selector-pseudo {color:color-mix(in oklch, var(--foreground) calc(100%/2), var(--background));}
.hljs-built_in,.hljs-literal,.hljs-title {color:color-mix(in oklch, var(--red) calc(500%/6), var(--violet));}
.hljs-bullet,.hljs-code {color:var(--green);}
.hljs-deletion {color:var(--red);}
.hljs-addition {color:var(--green);}
.hljs-emphasis {font-style:italic;}
.hljs-strong {font-weight:var(--strongweight);}

p img, li img, h1 img, h2 img, h3 img, h4 img {display:inline-block; height:1em; vertical-align:text-bottom; margin:0 calc(1em/6) 0 calc(1em/6);}
p img.float-left, li img.float-left, aside img.float-left, p svg.float-left, li svg.float-left, aside svg.float-left {float:left; display:block; height:auto; vertical-align:text-top; margin:0 calc(6em/6) calc(6em/6) 0;}
p img.float-right, li img.float-right, aside img.float-right, p svg.float-right, li svg.float-right, aside svg.float-right {float:right; display:block; height:auto; vertical-align:text-top; margin:0 0 calc(6em/6) calc(6em/6);}
h1 img {vertical-align:calc(-1em/8); border-radius:calc(1em/6); filter:saturate(calc(500%/6));}
figure {display:flex; flex-wrap:wrap; justify-content:space-evenly; align-items:flex-start; align-content:flex-start; row-gap:1em; overflow:hidden; vertical-align:center; max-width:100%; margin:1em auto 1em auto; padding-top:0;}
figure img, figure table, figure div, figure pre {display:block; height:auto; max-width:100%; margin:calc(1em/24) calc(2em/3) 0 calc(2em/3);}
figure img {border-radius:calc(1em/3); font-size:calc(2em/3); line-height:calc(4em/3);}
figure figcaption {width:100%; font-size:calc(2em/3); position:relative; text-align:center; color:color-mix(in oklch, var(--foreground) calc(200%/3), var(--background));}
figure .hfill {flex-grow:1;}

audio {display:block; width:216px; height:36px; filter:hue-rotate(90deg) sepia(calc(100%/6)) invert(calc(100%/24)); }

table {font-size:calc(5em/6); line-height:calc(4em/3); margin:1em auto 1em auto; border-spacing:0pt;}
thead, tfoot, th {font-weight:600; background-color:color-mix(in oklch, var(--background) calc(500%/6), var(--yellow))}
th, td {text-align:center; vertical-align:middle; white-space:normal; padding:calc(2em/6) calc(3em/6) calc(2em/6) calc(3em/6); border:1px solid color-mix(in oklch, var(--background) calc(500%/6), var(--yellow));}
th > *, td > * {background-color:inherit!important;} 
    
tbody tr:nth-child(odd) {background-color:color-mix(in oklch, var(--background) calc(100%/6), var(--whiteblack));}
tbody tr:nth-child(even) {background-color:var(--background);}
tbody td:nth-child(odd) {background-color:color-mix(in oklch, var(--background) calc(100%/6), var(--whiteblack));}
tbody td:nth-child(even) {background-color:var(--background);}
th.phantom {background-color:var(--background); border:none;}

header h1 {margin-top:0;}
header h2 {margin-top:calc(-1em/3);}
header h3 {margin-top:calc(-1em/3)}
header aside {font-style:italic; margin:0.67em 0em 1em 0em;}
header ul {clear:both; font-size:calc(2em/3); list-style-type:none; margin:1em 0 2em 0;} 
header li {display:inline; white-space:nowrap;}
header li::before {content:"\2004\00B7\2004";}
header li:first-child::before {content:"";}
header ul.breadcrumbs li {display:inline; white-space:nowrap;}
header ul.breadcrumbs li::before {content:"\2004/\2004";}
header ul.breadcrumbs li:first-child::before {content:none;}

header a, header a:link, nav a, nav a:link, footer a, footer a:link {text-decoration:none; border:none; color:var(--blue);}
header a:visited, nav a:visited, footer a:visited {color:color-mix(in oklch, var(--blue) calc(100%/1), var(--foreground));}
header a:hover, nav a:hover, footer a:hover {cursor:pointer; color:color-mix(in oklch, var(--blue) calc(100%/3), var(--background)); transition:calc(1s/6);} 
header a:active, nav a:active, footer a:active {color:color-mix(in oklch, var(--blue) calc(100%/6), var(--background));}
nav a cite {font-style:italic;}

nav ul {list-style-type:none;}
nav ul ul {margin-top:0; margin-bottom:0;}
nav li {margin:0;} 

footer {color:color-mix(in oklch, var(--foreground) calc(200%/3), var(--background)); clear:both; font-size:calc(2em/3); text-align:center; padding-top:18em;}
footer ul {margin:0; list-style-type:none;}
footer li {display:inline; white-space:nowrap;}
footer li::before {content:"\2004\00B7\2004";}
footer li:first-child::before {content:"";}

details summary {clear:both; display:list-item; list-style-type:'\2004\2295\2004'; list-style-position:outside;}
details:hover summary {cursor:pointer; color:var(--blue);}
details:active summary {color:color-mix(in oklch, var(--blue) calc(200%/3), var(--background));}
details[open] summary {list-style-type:'\2004\2296\2004';}
details[open]:hover summary {cursor:pointer; color:var(--blue);}
details[open]:active summary {color:color-mix(in oklch, var(--blue) calc(200%/3), var(--background));}

li details summary {display:block; list-style-type:none;}
li details[open] summary {display:block; list-style-type:none;}

article {clear:both; display:block; margin:calc(1em/3) 0 0 0; padding:0 0 calc(2em/3) 0; border-radius:calc(1em/3);}
article:hover {background:color-mix(in oklch, var(--blue) calc(100%/54), var(--background)); transition:calc(1s/6);}
article img {clear:none; float:left; display:inline-block; width:calc(100%/6); margin-right:calc(100%/36); margin-bottom:calc(100%/72); margin-top:1ex; border-radius:calc(1em/3);}
article h3 {clear:none; float:none; font-size:calc(3em/2); vertical-align:top; margin-bottom:calc(1em/6); padding-top:calc(1em/12); line-height:calc(4em/3);}
article p {clear:none; float:none; margin:0; color:var(--foreground);} 

aside {clear:both; font-size:calc(5em/6); line-height:calc(4em/3); color:color-mix(in oklch, var(--foreground) calc(200%/3), var(--background)); margin:1em 2em 1em 2em;}
aside p:last-of-type {margin-bottom:0em;}

blockquote {clear:both; font-style:normal; margin:1em 0em 1em 0em; padding:1ex 1em 1ex 1em; border-radius:calc(1em/3); background:color-mix(in oklch, var(--yellow) calc(100%/12), var(--background));}
blockquote footer {clear:both; font-style:normal; font-size:calc(2em/3); text-align:right; padding-top:0em;}
blockquote footer::before {content:"\2014";}

button {clear:both; display:block; text-align:center; cursor:pointer; font-size:1em; margin:calc(1em/3) auto calc(1em/3) auto; color:var(--background); background-color:var(--blue); box-shadow:0 calc(1em/6) calc(1em/12) color-mix(in oklch, var(--background) calc(500%/6), var(--yellow)); border-radius:calc(1em/3); padding:calc(1em/3) calc(1em/3) calc(1em/3) calc(1em/3);}
button.large {clear:both; display:block; text-align:center; cursor:pointer; font-size:calc(4em/3); margin:1em auto 1em auto; color:var(--background); background-color:var(--blue); box-shadow:0 calc(1em/6) calc(1em/12) color-mix(in oklch, var(--background) calc(500%/6), var(--yellow)); border-radius:calc(1em/3); padding:calc(2em/3) calc(2em/3) calc(2em/3) calc(2em/3);}
button:hover {background-color:color-mix(in oklch, var(--blue) calc(200%/3), var(--background)); transition:calc(1s/6);}
button:active {box-shadow:none; transform:translateY(calc(1em/12)); top:3px;}






.theorem::before {clear:both; float:left; display:inline; margin:0; counter-increment:theorem; content:"Theorem " counter(theorem) "\2004\2014\2004"; font-weight:var(--strongweight);}
.theorem[title]::before {content:attr(title) "\2004\2014\2004";}
.theorem[note]::before {content:"Theorem " counter(theorem) " (" attr(note) ")\2004\2014\2004";}
.theorem[title][note]::before {content:attr(title) " (" attr(note) ")\2004\2014\2004";}
.theorem > *:first-child {display:inline;}

.lemma::before {clear:both; float:left; display:inline; margin:0; counter-increment:theorem; content:"Lemma " counter(theorem) "\2004\2014\2004"; font-weight:var(--strongweight);}
.lemma[title]::before {content:attr(title) "\2004\2014\2004";}
.lemma[note]::before {content:"Lemma " counter(theorem) " (" attr(note) ")\2004\2014\2004";}
.lemma[title][note]::before {content:attr(title) " (" attr(note) ")\2004\2014\2004";}
.lemma > *:first-child {display:inline;}

.corollary::before {clear:both; float:left; display:inline; margin:0; counter-increment:theorem; content:"Corollary " counter(theorem) "\2004\2014\2004"; font-weight:var(--strongweight);}
.corollary[title]::before {content:attr(title) "\2004\2014\2004";}
.corollary[note]::before {content:"Corollary " counter(theorem) " (" attr(note) ")\2004\2014\2004";}
.corollary[title][note]::before {content:attr(title) " (" attr(note) ")\2004\2014\2004";}
.corollary > *:first-child {display:inline;}

.proof {display:block; margin:1em 0 1em 1em; /*font-style:normal;*/}
.proof::before {clear:both; float:left; display:inline; margin:0; font-style:italic; content:"Proof. \00A0";}
.proof[note]::before {content:"Proof (" attr(note) ").\2004\2014\2004";}
.proof > *:first-child {display:inline;}
.proof > *:last-child::after {content:"\2004\2610"; float:right; margin-bottom:-1em; /*otherwise spacing below is weird*/}

ol li.extra::before {content:"\00B0"; position:absolute; top:calc(-1em/6); left:calc(-1em/2);}
span.extra::before, div.extra::before, ul li.extra::before {content:"\00B0"; position:relative; top:calc(-1em/6); left:calc(0em/2);}
ol li.textbook::before {content:"\01F56E"; position:absolute; font-size:calc(1em/2); top:calc(-1em/2); left:calc(-7ch/1);}
span.textbook::before, div.textbook::before {content:"\01F56E"; position:relative; font-size:calc(1em/2); top:calc(-1em/2); left:calc(-1ch/3);}
.thisone::before {content:"\27F6"; position:absolute; left:calc(-6em/2);}

span.hard {margin-left:calc(-1ch/2);}
span.hard::before {content:"\002a"; position:relative; top:calc(-1em/6); left:calc(1ch/3);}
span.hardhard {margin-left:calc(-1ch/3);}
span.hardhard::before {content:"\2051"; transform:rotate(45deg); position:relative; font-size:calc(1em/2); top:calc(-2em/3); left:calc(1ch/3);} /* why doesn't rotate() work? */
span.hardhardhard {margin-left:calc(-1ch/3);}
span.hardhardhard::before {content:"\2042"; transform:rotate(75deg); position:relative; font-size:calc(1em/2); top:calc(-2em/3); left:calc(1ch/3);} /* why doesn't rotate() work? */
ol li.hard::before {content:"\002a"; position:absolute; top:calc(-1em/6); left:calc(-7ch/3);}
ol li.hardhard::before {content:"\2051"; transform:rotate(45deg); position:absolute; font-size:calc(2em/3); top:calc(-1em/2); left:calc(-20ch/6);}
ol li.hardhardhard::before {content:"\2042"; transform:rotate(75deg); position:absolute; font-size:calc(2em/3); top:calc(-2em/3); left:calc(-22ch/6);}
ol li.hard:nth-of-type(n+10)::before {content:"\002a"; position:absolute; top:calc(-1em/6); left:calc(-10ch/3);}
ol li.hardhard:nth-of-type(n+10)::before {content:"\2051"; transform:rotate(45deg); position:absolute; font-size:calc(2em/3); top:calc(-1em/2); left:calc(-29ch/6);}
ol li.hardhardhard:nth-of-type(n+10)::before {content:"\2042"; transform:rotate(60deg); position:absolute; font-size:calc(2em/3); top:calc(-2em/3); left:calc(-31ch/6);}
ol ol li.hard::before, ol ol li.hard:nth-of-type(n+10)::before {content:"\002a"; position:absolute; top:calc(-1em/6); left:calc(-10ch/3);}
ol ol li.hardhard::before, ol ol li.hardhard:nth-of-type(n+10)::before {content:"\2051"; transform:rotate(45deg); position:absolute; font-size:calc(2em/3); top:calc(-1em/2); left:calc(-29ch/6);}
ol ol li.hardhardhard::before, ol ol li.hardhardhard:nth-of-type(n+10)::before {content:"\2042"; transform:rotate(75deg); position:absolute; font-size:calc(2em/3); top:calc(-2em/3); left:calc(-31ch/6);}

.references dl dt {margin-bottom:0;}
.references dl dd {margin-top:0; margin-bottom:0;}

details.solution {background:color-mix(in oklch, var(--blue) calc(100%/24), var(--background) ); margin:1em 0em 1em 0em; padding:1ex 1em 1ex 2em; border-radius:calc(1em/3);}
details[open].solution {background:color-mix(in oklch, var(--orange) calc(100%/24), var(--background) );}
details.solution summary {font-weight:var(--strongweight);}

.example {background:color-mix(in oklch, var(--foreground) calc(100%/36), var(--background)); margin:1em 0em 1em 0em; padding:1ex 1em 1ex 1em; border-radius:calc(1em/3);}
details.example {background:color-mix(in oklch, var(--foreground) calc(100%/36), var(--background)); margin:1em 0em 1em 0em; padding:1ex 1em 1ex 2em; border-radius:calc(1em/3);}
details[open].example {background:color-mix(in oklch, var(--green) calc(100%/36), var(--background));}
.attention {background:color-mix(in oklch, var(--orange) calc(100%/6), var(--background)); margin:1em 0em 1em 0em; padding:1ex 1em 1ex 1em; border-radius:calc(1em/3);}
.note {background:color-mix(in oklch, var(--blue) calc(100%/12), var(--background)); margin:1em 0em 1em 0em; padding:1ex 1em 1ex 1em; border-radius:calc(1em/3);}

.name {margin:0.333in 0 0.167in 0; border-bottom:1px solid Black;}
.name::before {content:"Name: "}
.hide {display:none;}

hr {display:block; height:1px; margin:2em 0 2em 0; border:0; background-image: linear-gradient(to right, var(--background), var(--foreground), var(--background)); }

svg {
    background-color:none;
    fill:none;
    stroke:var(--foreground);
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

text {
    fill:var(--foreground);
    stroke:none;
}

line {
    fill:none;
    stroke:var(--foreground);
    stroke-width:2;
}

.axes {
    stroke-width: 1px;
    stroke-linecap: round;
}

.prism {
    stroke-width: 2;
    fill:var(--background);
    fill-opacity:0.50;
}

.curve-one {
    fill: none;
    stroke-width: 3;
    stroke: var(--blue);
}
.curve-two {
    fill: none;
    stroke-width: 3;
    stroke: var(--orange);
    stroke-dasharray:12 4;
}
.curve-three {
    fill: none;
    stroke-width: 3;
    stroke: var(--red);
    stroke-dasharray:1 6;
}
.curve-four {
    stroke-width: 3;
    stroke: var(--green);
    stroke-dasharray:12 6 1 6;
}

.dashed {
    stroke-width:1;
    stroke-dasharray:6 3;
}

.point {
    stroke-width:0;
    fill:var(--foreground);
}


/* For Finger-Presses Instead of Mouse-Clicks */
@media screen and (max-width:576px) {
    .inline, header ul, footer ul {line-height:calc(7em/3);} 
    nav li {margin:1em 0;} 
    dfn::after {content:none;}
}

/* Screen-Specific Styles */
@media only screen {
    .print {display:none;}
    .spoiler {filter:opacity(calc(2/3)) blur(calc(1em/3)); cursor:pointer;}
    .spoiler+figcaption {visibility:hidden;}
    .spoiler:hover {filter:none; transition-duration:calc(1s/12);}
    .spoiler:hover+figcaption {visibility:visible;}

    /* Display Pages */
    body.display {
        width:calc(1100%/12);
        background-image:linear-gradient(transparent, var(--background) calc(100%/3)), url("banner.webp");
        margin:0 auto auto auto;
        overflow: hidden;
        font-size:2rem;
    }

    body.display h1, h2 {margin-top:1em;}
    body.display h1 {font-size:5rem; text-wrap:nowrap;}
    body.display h2 {font-size:3rem;}
    body.display figure * {margin:0;}
    body.display img {max-width:100%; max-height:67vh; height: auto; flex: 1 1 auto; object-fit: cover;}
    body.display figcaption {font-size:1em;}
    body.display nav.prev-next {position:fixed; bottom:0; width:calc(1100%/12);}
    body.display nav.prev-next ul {justify-content:space-between;}
}

/* Print-Specific Styles */
@media only print {
    @page {size:letter; margin:0.75in 1in 0.75in 1in;}
    .screen {display:none;}
    .squint {color:Gainsboro;}
    body {margin:0in 0in 0in 0in; margin-trim:block; width:100%; height:100%; font-size:12pt; color:Black; background-color:White; background-image:none!important;}
    header {font-size:12pt; padding-bottom:6pt;}
    main {clear:both;}
    /*main {clear:both; column-count:2; column-gap:0.2in; column-fill:auto;}*/
    body > footer {display:none; text-align:center; break-before:avoid;}
    nav.prev-next {display:none;}

    h1, h2, h3 {text-shadow:none; break-after:avoid; break-inside:avoid;}
    h1 {font-size:32pt;}
    h2 {font-size:24pt;}
    h3 {font-size:16pt; margin-trim:block;}
    p, ul, ol, li, blockquote, aside, pre code, pre samp {widows:3; orphans:3; break-inside:auto;}
    details, img, figure, table, article, figure table, .example {break-inside:avoid; overflow:hidden;}
    details, ol, ul, dl {margin-left:2em; break-before:avoid;}
    a, header a, nav a, a:link, header a:link, nav a:link, a:visited, header a:visited, nav a:visited {color:DarkSlateGray; text-decoration:none!important;}
    button {background-color:DarkSlateGray;}
    a[href^='#'] {margin-right:0;}
    a[href^='#']::after {content:none;}
    a[rel^="external"] {margin-right:0;}
    a[rel^="external"]::after {content:none;}
    a.print-url::after {    
        content: " (" attr(href) ") ";
        font-family:var(--monotext); 
        font-weight:var(--monoweight); 
        font-size:calc(5em/6);
        color:SlateGray;
    }
    details summary {list-style-type:none;}
    details[open] summary {list-style-type:none; color:Black;}
    pre, code, kbd, samp {background-color:FloralWhite;}
    kbd {border:1px solid LavenderBlush; box-shadow:none;}
    mark {background-color:LemonChiffon;}
    ins {background-color:HoneyDew;}
    del {text-decoration-color:Crimson;}
    dfn {color:Teal;}
    thead, tfoot, th {background-color:LavenderBlush;}
    th, td {border:1px solid White;}
    tbody tr:nth-child(odd) {background-color:White;}
    tbody tr:nth-child(even) {background-color:FloralWhite;}
    tbody td:nth-child(odd) {background-color:White;}
    tbody td:nth-child(even) {background-color:FloralWhite;}
    blockquote {background:FloralWhite;}
    .example {background:GhostWhite;}
    aside {color:DimGray;}
    hr {display:block; height:1px; margin:2em 0 2em 0; border:0; background-image:none; background:Black;}

    .skip-quarter {padding-bottom:0.25in; page-break-inside:avoid;}
    .skip-third {padding-bottom:0.333in; page-break-inside:avoid;}
    .skip-half {padding-bottom:0.5in; page-break-inside:avoid;}
    .skip-one {padding-bottom:1in; page-break-inside:avoid;}
    .skip-one-half {padding-bottom:1.5in; page-break-inside:avoid;}
    .skip-two {padding-bottom:2in; page-break-inside:avoid;}
    .skip-two-half {padding-bottom:2.5in; page-break-inside:avoid;}
    .skip-three {padding-bottom:3in; page-break-inside:avoid;}
    .skip-three-half {padding-bottom:3.5in; page-break-inside:avoid;}
    .skip-four {padding-bottom:4in; page-break-inside:avoid;}
    .skip-four-half {padding-bottom:4.5in; page-break-inside:avoid;}
    .skip-five {padding-bottom:5in; page-break-inside:avoid;}
    .skip-six {padding-bottom:6in; page-break-inside:avoid;}
    .skip-seven {padding-bottom:7in; page-break-inside:avoid;}
    .skip-eight {padding-bottom:8in; page-break-inside:avoid;}
    .skip-nine {padding-bottom:9in; page-break-inside:avoid;}
    .skip-ten {padding-bottom:10in; page-break-inside:avoid;}
    .skip-eleven {padding-bottom:11in; page-break-inside:avoid;}
    .skip-page {break-after:page; break-inside:avoid; /*page-break-after:always; page-break-inside:avoid;*/}

    details.solution summary {display:none;}
}