:root{--bg:#000;--yellow:#ffd400;--text-light:#fff;--font:"Bodoni Moda", Georgia, "Times New Roman", serif;--quiz-question-size:18px;--quiz-answer-size:14px;--quiz-text-weight:600;--ease:cubic-bezier(.22, 1, .36, 1);--dur:.42s;--arch-ratio:2 / 3}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100%}body{font-family:var(--font);background:var(--bg);color:var(--text-light);-webkit-font-smoothing:antialiased;overflow-x:hidden}#app{flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:100svh;padding:.75rem;display:flex;position:relative;overflow-x:hidden}.screen{--footer-space:0px;width:min(94vw,34rem);width:min(94vw, calc((100vh - 1.5rem - var(--footer-space)) * .66), 34rem);width:min(94vw, calc((100svh - 1.5rem - var(--footer-space)) * .66), 34rem);z-index:1;max-width:100%;position:relative}.screen--with-footer{--footer-space:3.25rem}.screen.is-leaving{animation:fadeOutUp var(--dur) var(--ease) forwards}.screen.is-entering{animation:fadeInUp var(--dur) var(--ease) forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(1.25rem)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes fadeOutUp{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-.9rem)scale(.98)}}@keyframes answerIn{0%{opacity:0;transform:translateY(.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes answerOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-.5rem)}}.arch{width:100%;aspect-ratio:var(--arch-ratio);color:var(--text-light);text-align:center;position:relative;overflow:hidden}.arch-bg{object-fit:fill;object-position:center;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:0;width:100%;max-width:100%;height:100%;max-height:100%;position:absolute;inset:0}.arch-content{z-index:1;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.55rem;min-height:0;display:flex;position:absolute;inset:22% 19% 18%;overflow:hidden;container-type:inline-size}.arch-title{letter-spacing:-.02em;color:#fff;overflow-wrap:anywhere;max-width:100%;font-size:clamp(1.15rem,12cqi,2rem);font-weight:700;line-height:1.15}.arch-lead{color:#ffffffeb;overflow-wrap:anywhere;max-width:100%;font-size:clamp(.9rem,8cqi,1.15rem);font-weight:400;line-height:1.3}.arch-question{font-family:var(--font);font-size:var(--quiz-question-size);font-weight:var(--quiz-text-weight);color:#fff;overflow-wrap:anywhere;flex-shrink:1;max-width:100%;min-height:0;font-style:normal;line-height:1.3}.progress{letter-spacing:.04em;color:#ffffffd9;flex-shrink:0;font-size:clamp(.75rem,6.5cqi,.95rem);font-weight:600}.done-note{color:#ffffffd9;font-size:clamp(.85rem,7cqi,1rem)}.btn{appearance:none;background:var(--yellow);color:#000;font-family:var(--font);cursor:pointer;transition:transform .16s var(--ease), background .16s ease;border:3px solid #000;border-radius:999px;max-width:100%;padding:.6rem 1.25rem;font-size:clamp(.95rem,8cqi,1.1rem);font-weight:700}.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(1px)}.btn--ghost{color:var(--text-light);border-color:var(--text-light);background:0 0;padding:.45rem 1rem;font-size:.9rem;font-weight:600}.btn--ghost:hover{background:#ffffff14}.btn-row{flex-direction:column;flex-shrink:0;align-items:center;gap:.65rem;width:100%;display:flex}.arch--done .arch-content{justify-content:center;padding-top:0}.arch--done .arch-title,.arch--done .arch-lead{flex-shrink:0}.arch--done .btn-row--done{width:100%;margin-top:0;padding-bottom:0;position:absolute;bottom:4%;left:50%;transform:translate(-50%)}.arch--hero .arch-content,.arch--name .arch-content{justify-content:center;padding-top:0}.arch--hero .btn-row--lower{margin-top:1.75rem;padding-bottom:0}.arch--name .name-form{width:100%;margin-top:.35rem}.arch--name .btn-start--lower{margin-top:1.5rem}.btn-start{appearance:none;aspect-ratio:1024/341;cursor:pointer;width:min(100%,15rem);transition:transform .16s var(--ease), filter .16s ease;background:url(/images/btn-start.webp) 50%/contain no-repeat;border:none;place-items:center;padding:0;display:grid;container-type:inline-size}.btn-start__label{font-family:var(--font);color:#000;pointer-events:none;font-size:clamp(1rem,11cqi,1.35rem);font-weight:700;line-height:1}.btn-start:hover{filter:brightness(1.08)saturate(1.05)}.btn-start:active{filter:brightness(.95);transform:scale(.94)}.btn-start--next{background-image:url(/images/btn-next.webp)}.btn-start--wide{width:min(100%,17.5rem)}.btn-start__label--sm{text-align:center;padding:0 .75rem;font-size:clamp(.72rem,7.5cqi,.95rem)}.name-form .btn-start{align-self:center;width:min(100%,15rem)}.name-form{flex-direction:column;flex-shrink:0;align-items:stretch;gap:.7rem;width:100%;display:flex}.name-form input{font-family:var(--font);text-align:center;color:#000;background:#fff;border:3px solid #000;border-radius:999px;outline:none;width:100%;min-width:0;padding:.65rem .85rem;font-size:clamp(.95rem,8cqi,1.1rem);font-weight:600}.name-form input:focus{box-shadow:none;outline:none}.name-form .btn{width:100%}.answers{flex-direction:column;flex:auto;justify-content:center;gap:.4rem;width:100%;min-height:0;list-style:none;display:flex;overflow:hidden}.answers li{animation:answerIn var(--dur) var(--ease) both;min-width:0}.answers li:first-child{animation-delay:60ms}.answers li:nth-child(2){animation-delay:.12s}.answers li:nth-child(3){animation-delay:.18s}.answers li:nth-child(4){animation-delay:.24s}.answers.is-leaving li{animation:answerOut .28s var(--ease) both}.answer-btn{appearance:none;color:#000;width:100%;font-family:var(--font);font-size:var(--quiz-answer-size);font-weight:var(--quiz-text-weight);cursor:pointer;text-align:center;transition:transform .14s var(--ease), background .14s ease;overflow-wrap:anywhere;word-break:break-word;background:#fff;border:2px solid #000;border-radius:.85rem;padding:.55rem .7rem;font-style:normal;line-height:1.3}@media (hover:hover) and (pointer:fine){.answer-btn:hover{background:var(--yellow);transform:translateY(-1px)}}.answer-btn:active{background:var(--yellow);transform:translateY(1px)}.answer-btn:disabled{pointer-events:none;opacity:.75}.quiz-footer{justify-content:center;align-items:center;gap:.65rem;min-height:2.5rem;margin-top:.55rem;display:flex}.quiz-nav-spacer{height:1px;display:block}.answer-btn.is-selected{background:var(--yellow)}.answer-btn.is-review,.answers--review .answer-btn{cursor:default;opacity:1}.answer-btn.is-review:not(.is-selected){opacity:.72}@media (hover:hover) and (pointer:fine){.answer-btn.is-review:hover{background:#fff;transform:none}.answer-btn.is-review.is-selected:hover{background:var(--yellow)}}@media (prefers-reduced-motion:reduce){.screen.is-entering,.screen.is-leaving,.answers li,.answers.is-leaving li{animation:none!important}.btn,.answer-btn{transition:none}}@media (width<=767px){.arch--low-title .arch-content{justify-content:flex-start;padding-top:.35rem;inset:28% 19% 16%}.arch--low-title-mid .arch-content{justify-content:flex-start;padding-top:.4rem;inset:30% 19% 15%}.arch--low-title-strong .arch-content{justify-content:flex-start;padding-top:.5rem;inset:32% 19% 15%}.arch--expand-answers .arch-content{justify-content:center;gap:.35rem;padding-top:0;inset:24% 15% 10%}.arch--low-title-mid.arch--expand-answers .arch-content,.arch--low-title-strong.arch--expand-answers .arch-content{justify-content:center;inset:26% 15% 9%}.arch--expand-answers .arch-question{flex-shrink:0}.arch--expand-answers .answers{flex:0 auto;justify-content:center;gap:.32rem;overflow:visible}.arch--expand-answers .answer-btn{padding:.42rem .55rem}.arch--narrow .arch-content{inset:28% 25% 16%}.arch--narrow.arch--expand-answers .arch-content,.arch--narrow.arch--low-title-mid.arch--expand-answers .arch-content{inset:26% 25% 9%}.arch--q6-lower .arch-content{inset:34% 19% 14%}.arch--q6-lower.arch--expand-answers .arch-content,.arch--low-title-strong.arch--q6-lower.arch--expand-answers .arch-content{inset:34% 15% 9%}}@media (width<=380px){.arch-content{gap:.4rem;inset:21% 17% 17%}.arch--low-title .arch-content{inset:30% 17% 15%}.arch--narrow .arch-content{inset:30% 26% 15%}.arch--q6-lower .arch-content{inset:36% 17% 13%}.arch--low-title-mid .arch-content{inset:32% 17% 14%}.arch--low-title-strong .arch-content{inset:34% 17% 14%}.arch--expand-answers .arch-content{justify-content:center;gap:.28rem;inset:22% 13% 8%}.arch--low-title-mid.arch--expand-answers .arch-content,.arch--low-title-strong.arch--expand-answers .arch-content{justify-content:center;inset:24% 13% 7%}.arch--narrow.arch--expand-answers .arch-content,.arch--narrow.arch--low-title-mid.arch--expand-answers .arch-content{inset:24% 26% 7%}.arch--q6-lower.arch--expand-answers .arch-content,.arch--low-title-strong.arch--q6-lower.arch--expand-answers .arch-content{inset:36% 13% 7%}.arch--expand-answers .answers{justify-content:center;gap:.28rem}.arch--expand-answers .answer-btn{padding:.38rem .5rem}.answer-btn{padding:.45rem .55rem}}@media (height<=700px){.arch-content{gap:.35rem;inset:20% 18% 16%}.arch--expand-answers .arch-content{justify-content:center;gap:.28rem;inset:22% 14% 8%}.arch--low-title-mid.arch--expand-answers .arch-content,.arch--low-title-strong.arch--expand-answers .arch-content{justify-content:center;inset:24% 14% 7%}.arch--narrow.arch--expand-answers .arch-content,.arch--narrow.arch--low-title-mid.arch--expand-answers .arch-content{inset:24% 26% 7%}.arch--q6-lower.arch--expand-answers .arch-content,.arch--low-title-strong.arch--q6-lower.arch--expand-answers .arch-content{inset:36% 14% 7%}.answer-btn{padding:.4rem .55rem}}@media (width>=768px){:root{--quiz-question-size:22px;--quiz-answer-size:16px}#app{padding:1rem}.screen{width:min(92vw,38rem);width:min(92vw, calc((100vh - 2rem - var(--footer-space)) * .66), 38rem);width:min(92vw, calc((100svh - 2rem - var(--footer-space)) * .66), 38rem)}.arch-content{gap:.7rem;inset:24% 19% 17%}.arch:not(.arch--hero):not(.arch--name):not(.arch--done) .arch-content{justify-content:flex-start;padding-top:.35rem;inset:38% 19% 10%}}@media (width>=768px) and (width<=1099px){.arch--tablet-lower .arch-content{justify-content:flex-start;padding-top:.75rem;inset:40% 19% 9%}.arch--tablet-lower.arch--narrow .arch-content{inset:40% 24% 9%}.arch--tablet-lower.arch--q6-lower .arch-content{padding-top:1rem;inset:43% 19% 8%}}@media (width>=1100px){.screen{width:min(90vw,42rem);width:min(90vw, calc((100vh - 2rem - var(--footer-space)) * .66), 42rem);width:min(90vw, calc((100svh - 2rem - var(--footer-space)) * .66), 42rem)}}