/* Paper, charcoal and red ink from Ode to Hope and Despair. */
body:has(.quiz-main){background:#e8e5e0;color:#282323}
body:has(.quiz-main)>header{background:#eeebe6;border-bottom:1px solid #a31924}
body:has(.quiz-main)>header a,body:has(.quiz-main)>header summary{color:#282323}
body:has(.quiz-main)>footer{background:#eeebe6;border-top:1px solid #a31924}
body:has(.quiz-main)>footer a{color:#921921}
.quiz-main{--cerulean:#a31924;--deep-blue:#77121b;--ink:#282323;--muted:#625b59;max-width:1060px;min-height:75vh;padding:50px 4% 80px}
#quiz{background:#fffdf8;padding:clamp(24px,5vw,64px);box-shadow:-7px 0 0 -4px #d3ccc3,0 8px 32px #29211b0c;border-top:3px solid #8e1821;position:relative}
#quiz:after{content:'';display:block;clear:both}
.quiz-main h1{font:normal clamp(34px,4.4vw,56px)/1.15 Georgia,serif;margin:16px 0 28px;overflow-wrap:break-word}
.quiz-main p{max-width:750px}.quiz-main .eyebrow{color:#8f1823;font-size:14px;letter-spacing:.12em}
.quiz-lead{font:22px/1.65 Georgia,serif}.quiz-main .privacy-note{clear:both;font:14px/1.65 inherit;color:#625b59;padding-top:25px;max-width:630px}
.quiz-intro-art{float:right;width:30%;max-width:205px;margin:0 0 28px 30px;transform:rotate(2deg);box-shadow:5px 9px 18px #28232330}
.quiz-intro-art img{display:block;width:100%;height:auto}
.quiz-main .button{border:1px solid #9c1923;border-radius:0;background:transparent;color:#8e1821;font-size:16px;padding:12px 22px;min-height:46px;cursor:pointer}
.quiz-main .button:hover,.quiz-main .quiz-primary{background:#9c1923;color:#fff}
.quiz-main #start{margin-top:16px;background:#9c1923;color:#fff}
.quiz-running-head{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid #d9d0c6;padding-bottom:18px;color:#74665e;font:italic 14px/1.4 Georgia,serif}
.quiz-main form{max-width:none;margin:0;padding:0;background:transparent;border:0;box-shadow:none}
.quiz-main fieldset{border:0;margin:30px 0 0;padding:0;min-width:0}
.quiz-main legend{font:normal clamp(28px,3.8vw,39px)/1.3 Georgia,serif;padding:0;margin-bottom:24px;width:100%}
.quiz-options{display:grid;gap:0;border-top:1px solid #e4ddd4}
.quiz-option{position:relative;display:flex;align-items:flex-start;gap:13px;padding:15px 12px 15px 7px;border-bottom:1px solid #e4ddd4;cursor:pointer;font:18px/1.5 Georgia,serif;transition:background .15s,color .15s}
.quiz-option input{position:absolute;width:1px;height:1px;opacity:0;margin:0}
.quiz-option:before{content:'“';color:#b0a099;flex:0 0 18px;font:28px/1.1 Georgia,serif}
.quiz-option:hover{background:#f5eee6}
.quiz-option:has(:checked){background:#f4e9e3;color:#82131d;box-shadow:inset 3px 0 #9c1923}
.quiz-option:has(:checked):before{color:#9c1923}
.quiz-option:has(:focus-visible){outline:2px solid #9c1923;outline-offset:3px;z-index:1}
.quiz-actions{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:28px}
.quiz-main :focus-visible{outline:2px solid #9c1923;outline-offset:5px}
.quiz-main [data-focus]:focus{outline:none}.quiz-main [data-focus]:focus-visible{outline:2px solid #9c1923;outline-offset:5px}
.reveal-note{font:italic 18px Georgia,serif;color:#74665e;margin-bottom:32px}
#quiz[data-view=result]{background:transparent;box-shadow:none;border-top:0;padding-top:10px}
#quiz[data-view=result] h1{max-width:780px}
.quiz-interpretation{max-width:730px;font:20px/1.8 Georgia,serif}
.quiz-interpretation p{margin:0 0 22px}
.gift{margin:48px auto 0;padding-top:24px;border-top:1px solid #b7a59a}
.quiz-main h2{font:normal 30px/1.3 Georgia,serif}.gift-heading{font-style:italic!important;color:#8f1823;margin-bottom:30px}
.book-page{margin:24px 0}.book-page img{display:block;width:100%;height:auto;box-shadow:0 5px 24px #28232318}
.book-page figcaption,.page-reference,.piece-attribution{font-size:14px;line-height:1.6;color:#625b59}
.book-page figcaption{text-align:center;margin-top:12px}.piece-attribution{margin:22px 0}
.readable-text{border-block:1px solid #cfc4b9;padding:18px 0}.readable-text summary{cursor:pointer;color:#8f1823;font-size:16px}.readable-text h2{font-size:20px;margin-top:25px}
.poem-text{white-space:pre-wrap;font:18px/1.8 Georgia,serif;overflow-wrap:anywhere}
.quiz-related{margin-top:50px;padding-top:24px;border-top:1px solid #cfc4b9}.related-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.related-grid h3{font:normal 23px/1.35 Georgia,serif;margin:12px 0}.related-grid p{font-size:16px;line-height:1.6}
.book-invitation{margin-top:45px;padding:28px 0;border-block:1px solid #a31924}.book-invitation p{font:18px/1.6 Georgia,serif}
.share-link{width:100%;padding:12px;font:inherit}
#quiz[data-view=result]>.eyebrow,#quiz[data-view=result]>h1,.quiz-interpretation{animation:page-arrives .35s ease-out both}
@keyframes page-arrives{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.quiz-main{padding:25px 4% 45px}#quiz{padding:25px 20px}.quiz-intro-art{width:110px;margin:0 0 20px 20px}.quiz-main h1{font-size:34px}.quiz-lead{font-size:20px}.quiz-option{font-size:17px;padding-block:15px}.quiz-running-head{font-size:14px}.quiz-interpretation{font-size:19px}.related-grid{grid-template-columns:1fr;gap:12px}.quiz-actions .button{flex:1}.poem-text{font-size:17px}#quiz[data-view=result]{padding-inline:4px}}
@media(prefers-reduced-motion:reduce){.quiz-main *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Keep each thought compact; override margins from the site's contact form. */
body:has(.quiz-main)>header{padding-block:16px;gap:14px}
.quiz-main{max-width:1120px;padding:24px 3% 38px;min-height:0}
#quiz{padding:clamp(20px,3vw,34px)}
.quiz-main h1{font-size:clamp(30px,3.5vw,44px);margin:12px 0 18px;letter-spacing:-.025em}
.quiz-main .quiz-lead{font-size:20px;line-height:1.5;margin:14px 0}
.quiz-main .privacy-note{padding-top:12px;margin:14px 0 0;font-size:14px;line-height:1.5}
.quiz-intro-art{max-width:175px;margin-left:28px}
.quiz-main fieldset{margin-top:18px}
.quiz-main legend{font-size:clamp(25px,3vw,32px);line-height:1.25;margin-bottom:16px}
.quiz-main form .quiz-option{margin:0;padding:11px 12px;min-height:46px;font-size:17px;line-height:1.4}
.quiz-main .quiz-option input{padding:0;border:0}
.quiz-running-head{padding-bottom:10px}
.quiz-actions{margin-top:18px;gap:12px}
.quiz-interpretation{font-size:18px;line-height:1.65;max-width:760px}
.quiz-interpretation p{margin-bottom:15px}
.reveal-note{margin:0 0 16px;font-size:16px}
.gift{margin-top:24px;padding-top:14px}.gift-heading{margin:0 0 14px}
.book-page{max-width:650px;margin:18px auto}.book-page img{max-height:82vh;max-height:82svh;width:auto;max-width:100%;margin:auto;object-fit:contain}
.quiz-related{margin-top:26px;padding-top:16px}.quiz-main h2{font-size:26px;margin-bottom:16px}
.book-invitation{margin-top:25px;padding-block:18px}
.piece-attribution{margin:14px 0}
@media(min-width:1000px){.quiz-options{grid-template-columns:1fr 1fr;column-gap:24px}.quiz-main form .quiz-option{padding-block:14px}}
@media(max-width:600px){body:has(.quiz-main)>header{padding:12px 5%;gap:10px}body:has(.quiz-main) nav{gap:8px 16px}.quiz-main{padding:16px 3% 28px}#quiz{padding:20px 16px}.quiz-intro-art{width:95px;margin:0 0 16px 20px}.quiz-main h1{font-size:30px}.quiz-main .quiz-lead{font-size:18px}.quiz-main form .quiz-option{font-size:16px;padding:11px 8px}.quiz-interpretation{font-size:17px}.book-page img{max-height:none;width:100%}.quiz-main .privacy-note{clear:both}.quiz-running-head{font-size:14px}}
@media(max-width:600px){#quiz[data-view=intro] h1{font-size:29px;line-height:1.2}#quiz[data-view=intro] .quiz-lead{clear:both;padding-top:4px}#quiz[data-view=intro] .quiz-intro-art{width:82px;margin-left:16px}#quiz[data-view=intro] .eyebrow{font-size:13px;letter-spacing:.08em}}
.piece-reminder{max-width:760px;border-left:3px solid #9c1923;padding:3px 18px;margin:20px 0}.piece-reminder .eyebrow{font-size:13px;margin:0 0 6px}.piece-reminder p:last-child{font:20px/1.5 Georgia,serif;margin:0}.quiz-reflection{border-top:1px solid #cfc4b9;margin-top:24px;padding-top:12px;max-width:760px}.quiz-reflection h2{margin-bottom:6px}.reflection-note{font-size:14px;color:#625b59;margin:0 0 10px}.quiz-reflection ul{padding-left:22px;margin:10px 0;font:18px/1.6 Georgia,serif}.quiz-reflection li+li{margin-top:8px}
/* The cover's black field, white page and red accent frame the encounter. */
body:has(.quiz-main){background:#191718 url('/assets/ode.jpg') no-repeat fixed right center;background-size:auto 90vh}
.quiz-main{background:#e8e5e0f5;margin-block:22px;border:1px solid #9c1923;box-shadow:0 12px 36px #0005}
#quiz[data-view=question],#quiz[data-view=intro]{border:6px solid #252122;outline:1px solid #a31924;outline-offset:4px;box-shadow:inset 0 0 0 1px #c3b9ae}
.quiz-running-head{position:relative;min-height:66px;padding-right:55px;align-items:center;color:#86202a;border-bottom:1px solid #a31924}
.quiz-running-head:after{content:'';position:absolute;right:0;top:0;width:39px;height:58px;background:url('/assets/ode.jpg') center/contain no-repeat;transform:rotate(3deg)}
.related-heading{display:flex;align-items:center;gap:16px;margin:12px 0}.related-heading img{width:80px;height:115px;object-fit:contain;flex:none;background:#c4c3c1;box-shadow:0 2px 7px #0002}.related-heading h3{margin:0 0 8px}.related-heading .page-reference{margin:0}.related-grid article>p{margin-top:12px}
body:has(.quiz-main)>footer{padding-inline:20px;background:#eeebe6}
@media(max-width:600px){.quiz-main{margin:12px 3%;width:94%;padding:14px 3% 22px}#quiz[data-view=question],#quiz[data-view=intro]{border-width:3px;outline-offset:2px}.related-heading{gap:12px}.related-heading h3{font-size:21px}}