/* Euclid's workshop: the site's existing ink, gold, and self-hosted type. */
#page-euclid { --eu-surface:#17140e; --eu-line:#746241; --eu-accent:#dbbd76; --eu-paper:#f0e4c9; --eu-muted:#cabea1; --eu-success:#b8d5ae; --eu-error:#f1c1a0; color:var(--eu-paper); }
#page-euclid *, #eu-reset-dialog * { box-sizing:border-box; }
#page-euclid p, #page-euclid li, #page-euclid dd { font-size:1.12rem; line-height:1.75; }
#page-euclid h1, #page-euclid h2, #page-euclid h3 { color:var(--eu-paper); font-weight:400; line-height:1.2; }
#page-euclid h2 { font-size:clamp(1.7rem,3vw,2.35rem); margin:0 0 1rem; }
#page-euclid h3 { font-size:1.3rem; margin:0 0 .75rem; }
#page-euclid p { margin:0 0 1.25rem; }
#page-euclid a { color:var(--eu-paper); }
#page-euclid a:hover { color:var(--eu-accent); }
#page-euclid .eyebrow { color:var(--eu-accent); font-size:.82rem; letter-spacing:.09em; }
#page-euclid :is(a,button,input,select,textarea,summary):focus-visible { outline:2px solid var(--eu-accent); outline-offset:4px; }
#page-euclid :is(article,section,[id]) { scroll-margin-top:1.5rem; }
.eu-interactive { display:none; }
.eu-ready .eu-interactive { display:block; }
.eu-ready .eu-nojs { display:none; }
.eu-skip { position:fixed; top:-100px; left:1rem; z-index:150; padding:1rem; background:var(--eu-surface); }
.eu-skip:focus { top:80px; }
.eu-hero { max-width:1180px; margin:auto; padding:4rem 2rem 3rem; display:grid; grid-template-columns:1.2fr 1fr; gap:3rem; align-items:center; }
#page-euclid .eu-hero h1 { font-size:clamp(2.7rem,5.5vw,4.7rem); letter-spacing:-.025em; margin:.75rem 0 1.5rem; }
#page-euclid .eu-hero h1 em { color:var(--eu-accent); font-weight:400; }
#page-euclid .eu-deck { font-size:clamp(1.5rem,2.5vw,2rem); line-height:1.3; }
.eu-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin:1.25rem 0; }
#page-euclid .button { white-space:normal; font-size:1rem; }
#page-euclid .button.primary, #page-euclid .button.primary:hover { color:#100d08; }
#page-euclid .eu-facts { font-size:.95rem; color:var(--eu-muted); margin-top:1.5rem; }
.eu-frontispiece { border:1px solid var(--eu-line); padding:1.5rem; background:var(--eu-surface); }
#page-euclid .eu-frontispiece p { text-align:center; margin:0; font-size:1rem; color:var(--eu-muted); font-style:italic; }
#page-euclid svg { display:block; width:100%; height:auto; fill:none; stroke:var(--eu-accent); stroke-width:2; }
#page-euclid svg text { stroke:none; fill:var(--eu-paper); font:20px var(--serif-body); }
#page-euclid svg .eu-aux { stroke-dasharray:5 5; stroke:var(--eu-muted); stroke-width:1.5; }
#page-euclid svg .eu-second { stroke:var(--eu-success); }
#page-euclid svg .eu-point { fill:var(--eu-paper); stroke:none; }
.eu-orientation { max-width:1116px; margin:0 auto 3rem; padding:1.5rem 0; display:grid; grid-template-columns:1fr 1fr; gap:3rem; border-top:1px solid var(--eu-line); border-bottom:1px solid var(--eu-line); }
#page-euclid .eu-orientation p { font-size:1rem; color:var(--eu-muted); margin:0; }
.eu-orientation strong { color:var(--eu-paper); display:block; }
.eu-layout { max-width:1180px; margin:auto; padding:0 2rem 4rem; display:grid; grid-template-columns:280px minmax(0,1fr); gap:3.5rem; align-items:start; }
.eu-sidebar { position:sticky; top:calc(var(--header-height) + 1.5rem); max-height:calc(100vh - var(--header-height) - 3rem); overflow:auto; scrollbar-color:var(--eu-line) var(--eu-surface); padding:0 .75rem 1rem 0; }
#page-euclid .eu-sidebar h2 { font-size:1.5rem; }
#page-euclid .eu-sidebar p { font-size:.9rem; line-height:1.5; color:var(--eu-muted); margin:.5rem 0; }
.eu-progress-panel { margin:0 0 1.5rem; }
.eu-progress-panel label { font-size:.95rem; }
.eu-progress-panel progress { display:block; width:100%; height:7px; accent-color:var(--eu-accent); margin:.75rem 0; background:var(--eu-surface); border:0; }
.eu-progress-panel progress::-webkit-progress-bar { background:var(--eu-surface); }
.eu-progress-panel progress::-webkit-progress-value { background:var(--eu-accent); }
.eu-text-button { min-height:44px; padding:.25rem 0; background:none; border:0; color:var(--eu-muted); font:inherit; cursor:pointer; text-decoration:underline; text-underline-offset:.2em; }
#page-euclid summary { cursor:pointer; min-height:44px; padding:.75rem 0; line-height:1.5; }
.eu-sidebar details { border-top:1px solid var(--eu-line); }
.eu-sidebar summary { font-size:1rem; color:var(--eu-accent); }
.eu-sidebar ol { list-style:none; padding:0; margin:0 0 .75rem; }
.eu-sidebar a[data-lesson-link] { display:grid; grid-template-columns:1.4rem 1fr 1rem; align-items:start; gap:.4rem; padding:.65rem .5rem; font-size:.97rem; line-height:1.4; text-decoration:none; border-left:2px solid transparent; }
.eu-sidebar a[data-lesson-link]>span:first-child { color:var(--eu-muted); font-variant-numeric:tabular-nums; font-size:.8rem; padding-top:.12rem; }
.eu-sidebar a[aria-current="step"] { background:var(--eu-surface); border-left-color:var(--eu-accent); }
.eu-lesson-mark { color:var(--eu-success); }
.eu-tools { display:grid; border-top:1px solid var(--eu-line); padding-top:.75rem; }
.eu-tools a { padding:.5rem; min-height:44px; font-size:1rem; }
.eu-lesson { border-bottom:1px solid var(--eu-line); margin-bottom:4rem; padding-bottom:2rem; min-width:0; }
.eu-ready .eu-lesson { margin-bottom:0; }
#page-euclid .eu-objective { font-size:1.08rem; color:var(--eu-muted); }
#page-euclid .eu-mastery { font-size:.9rem; color:var(--eu-accent); border-top:1px solid var(--eu-line); padding-top:.75rem; }
.eu-prose { margin:1.75rem 0; }
.eu-example { background:var(--eu-surface); border:1px solid var(--eu-line); padding:1.5rem; margin:1.75rem 0; }
.eu-example p:last-child, .eu-pitfall p:last-child, .eu-application p:last-child { margin-bottom:0 !important; }
.eu-pitfall { border-left:2px solid var(--eu-accent); padding:.25rem 0 .25rem 1.25rem; margin:1.75rem 0; }
.eu-application { padding:1.25rem 0; }
#page-euclid .eu-application h3 { color:var(--eu-accent); }
.eu-diagram { border:1px solid var(--eu-line); background:var(--eu-surface); margin:1.5rem 0; padding:1rem 1.5rem 1.5rem; }
.eu-diagram svg { max-width:540px; margin:auto; }
.eu-diagram figcaption { font-size:1rem; line-height:1.5; }
.eu-diagram figcaption strong { color:var(--eu-accent); }
.eu-diagram ol { padding-left:1.25rem; margin:1rem 0; }
#page-euclid .eu-diagram li { font-size:1rem; }
.eu-ready .eu-diagram-steps { display:none; }
.eu-ready .eu-diagram-controls { display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0; }
.eu-diagram small { color:var(--eu-muted); display:block; line-height:1.5; }
#page-euclid .eu-step-status { font-size:1rem; min-height:3rem; }
.eu-practice { margin:2rem 0; padding-top:1.5rem; border-top:1px solid var(--eu-line); }
.eu-question { border:0; border-bottom:1px solid var(--eu-line); padding:0 0 1.5rem; margin:1.5rem 0; min-width:0; }
.eu-question legend { float:none; width:100%; font-size:1.13rem; line-height:1.5; padding:0 0 .75rem; color:var(--eu-paper); }
.eu-option { display:flex; align-items:flex-start; gap:.75rem; padding:.75rem 1rem; margin:.5rem 0; border:1px solid var(--eu-line); background:var(--eu-surface); cursor:pointer; line-height:1.55; }
.eu-option:has(input:checked) { border-color:var(--eu-accent); background:#292316; }
.eu-option:has(input:focus-visible) { outline:2px solid var(--eu-accent); outline-offset:3px; }
.eu-option input { flex:none; margin-top:.35rem; accent-color:var(--eu-accent); width:1rem; height:1rem; }
.eu-option:has(input:disabled) { cursor:default; }
#page-euclid .eu-feedback { font-size:1rem; margin:.75rem 0 .25rem; color:var(--eu-error); }
#page-euclid .eu-feedback[data-correct="true"] { color:var(--eu-success); }
#page-euclid .eu-explanation { font-size:1rem; color:var(--eu-muted); margin:.25rem 0; }
.eu-proof-row { display:grid; gap:.65rem; margin:1rem 0; }
.eu-proof-row span { line-height:1.5; }
#page-euclid select, #page-euclid textarea { display:block; width:100%; min-width:0; padding:.8rem; background:var(--eu-surface); color:var(--eu-paper); border:1px solid var(--eu-line); border-radius:0; font:1rem/1.6 var(--serif-body); }
#page-euclid select { min-height:48px; }
#page-euclid textarea { resize:vertical; margin:.5rem 0 1.25rem; }
#page-euclid textarea::placeholder { color:var(--eu-muted); opacity:1; }
#page-euclid select[aria-invalid="true"] { border-color:var(--eu-error); }
#page-euclid button:disabled { cursor:default; opacity:.5; }
.eu-lesson-nav { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.75rem; padding-top:1rem; }
#page-euclid .eu-source { font-size:.95rem; overflow-wrap:anywhere; }
.eu-supplement { max-width:840px; margin:0 auto; padding:3rem 2rem; border-top:1px solid var(--eu-line); }
.eu-supplement details { border-bottom:1px solid var(--eu-line); padding:.5rem 0; }
.eu-supplement ol { padding-left:1.5rem; }
.eu-rubric { border:1px solid var(--eu-line); margin:1.5rem 0; padding:1rem; }
.eu-rubric legend { padding:0 .5rem; color:var(--eu-accent); }
.eu-rubric label { display:block; padding:.5rem 0; line-height:1.6; }
.eu-rubric input { accent-color:var(--eu-accent); }
.eu-book-grid summary span { display:inline-block; min-width:5rem; color:var(--eu-accent); }
.eu-glossary { display:grid; grid-template-columns:170px 1fr; gap:1rem 1.5rem; margin-bottom:2rem; }
.eu-glossary dt { color:var(--eu-accent); line-height:1.75; }
.eu-glossary dd { margin:0; }
.eu-notice { max-width:800px; padding:1.5rem; margin:1rem auto !important; border:1px solid var(--eu-line); }
#eu-reset-dialog { position:fixed; inset:0; width:min(90vw,540px); max-height:85vh; overflow:auto; margin:auto; padding:2rem; border:1px solid var(--eu-line); color:var(--eu-paper); background:var(--eu-surface); }
#eu-reset-dialog::backdrop { background:rgb(0 0 0 / .8); }
@media (max-width:1100px) { .eu-orientation { margin-left:2rem; margin-right:2rem; } .eu-layout { grid-template-columns:240px minmax(0,1fr); gap:2rem; } }
@media (max-width:800px) {
 .eu-hero { grid-template-columns:1fr; padding:2.5rem 1.5rem 2rem; gap:1.5rem; }
 .eu-frontispiece { display:none; }
 .eu-orientation { grid-template-columns:1fr; gap:1rem; margin:0 1.5rem 2rem; }
 .eu-layout { display:block; padding:0 1.5rem 2rem; }
 .eu-sidebar { position:static; max-height:none; padding:0; margin-bottom:2rem; }
 .eu-ready .eu-sidebar nav { max-height:300px; overflow:auto; border-bottom:1px solid var(--eu-line); padding-right:.5rem; }
 .eu-tools { display:flex; flex-wrap:wrap; gap:0 .5rem; }
 .eu-tools a { font-size:.9rem; }
 .eu-supplement { padding:2rem 1.5rem; }
 .eu-diagram { padding:.5rem 1rem 1rem; }
 .eu-glossary { grid-template-columns:1fr; gap:.25rem; }
 .eu-glossary dd { margin-bottom:1rem; }
}
@media print {
 .topnav, footer, .eu-sidebar, .eu-interactive, .eu-lesson-nav, .eu-skip, #eu-reset-dialog { display:none !important; }
 .eu-layout { display:block; }
 .eu-lesson[hidden], .eu-ready .eu-nojs, .eu-ready .eu-diagram-steps { display:block !important; }
 #page-euclid { --eu-paper:#111; --eu-muted:#333; --eu-accent:#444; --eu-surface:#fff; }
 #page-euclid svg g { visibility:visible !important; }
 .eu-lesson { break-before:page; }
}
