@charset "UTF-8";
@font-face{font-family:Manrope;src:url('assets/fonts/manrope.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap}
:root{color-scheme:light;--ink:#423858;--purple:#6344c7;--deep:#5134b3;--muted:#6f6487;--line:#ddd5ed;--surface:#faf9fc;--tint:#eee7fa;--ease:cubic-bezier(.22,1,.36,1);--art:url('assets/smm/pearl-ribbons-hq.webp');--art:image-set(url('assets/smm/pearl-ribbons-hq.webp') 1x,url('assets/smm/pearl-ribbons-hq@2x.webp') 2x);--art-x:32%}
*{box-sizing:border-box}html{min-width:320px;scroll-behavior:smooth;scrollbar-gutter:stable}body{margin:0;background:var(--surface);color:var(--ink);font-family:Manrope,system-ui,sans-serif;font-size:16px;line-height:24px;-webkit-font-smoothing:antialiased;isolation:isolate}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;cursor:pointer}button:disabled{cursor:default}a{color:inherit}img{display:block;max-width:100%;height:auto}h1,h2,p{margin:0}h1,h2{font-weight:500;text-wrap:balance}p{text-wrap:pretty}button:focus-visible,a:focus-visible{outline:2px solid var(--deep);outline-offset:4px}h1:focus,#main:focus{outline:none}::selection{background:#e2d7fa;color:var(--ink)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.skip-link{position:fixed;z-index:40;top:16px;left:24px;padding:12px 16px;background:white;opacity:0;pointer-events:none;border-radius:8px}.skip-link:focus{opacity:1;pointer-events:auto}
/* Supplied brand artwork is contained in the era visual; reading surfaces stay flat. */
.scene-background{display:none}.site-header{max-width:1280px;padding:16px 32px;display:flex;align-items:center;gap:24px;margin:8px auto 0;position:relative;z-index:5;min-height:96px}.brand{display:block;flex:0 0 80px;background:transparent}.brand img{width:80px;height:auto}.header-caption{font-size:14px;line-height:20px;color:var(--muted)}
#main{min-height:calc(100svh - 104px)}.era-screen{max-width:1280px;margin:0 auto;padding:32px 32px 40px}.era-core{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);column-gap:64px;grid-template-areas:'kicker kicker' 'title visual' 'intro visual' 'action visual';align-content:start;align-items:start}.era-kicker{grid-area:kicker;display:flex;align-items:center;gap:24px;width:100%;font-size:14px;line-height:20px;color:var(--muted);font-variant-numeric:tabular-nums;margin-bottom:40px}.era-years{color:var(--deep);font-size:24px;line-height:32px;font-weight:500}.era-index,.landing-range{margin-left:auto}.era-index span{color:var(--muted)}.era-title{grid-area:title;color:var(--purple);font-size:60px;line-height:1;letter-spacing:-.05em;max-width:680px;overflow-wrap:break-word}.long-title .era-title{font-size:48px;line-height:1}.era-intro{grid-area:intro;font-size:18px;line-height:28px;max-width:680px;margin-top:32px}.era-actions{grid-area:action;margin-top:32px}.primary-button{display:inline-flex;justify-content:space-between;align-items:center;gap:32px;min-height:56px;min-width:240px;padding:8px 12px;border:0;border-radius:12px;background:var(--purple);color:white;font-weight:600;font-size:16px;line-height:24px;text-decoration:none;transition:background-color 300ms var(--ease),transform 500ms var(--ease)}.primary-button svg{width:24px;height:24px;flex-shrink:0}.primary-button:hover{background:var(--deep);transform:translateY(-2px)}.primary-button:active{transform:scale(.98)}.primary-button:disabled{opacity:.6;transform:none}.era-visual{grid-area:visual;position:relative;align-self:stretch;min-height:400px;overflow:hidden;border-radius:24px;background:#eeebfa;isolation:isolate}.visual-art{position:absolute;inset:-4%;background-image:var(--art);background-position:var(--art-x) center;background-size:auto 100%;background-repeat:no-repeat;animation:pearl-drift 20s var(--ease) infinite alternate;z-index:-1}.visual-period{position:absolute;bottom:32px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center;font-size:30px;line-height:36px;letter-spacing:-.04em;color:var(--deep);font-variant-numeric:tabular-nums}.visual-period span{font-weight:400}.timeline{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:48px}.timeline-item{position:relative;padding-top:16px;font-size:12px;line-height:16px;color:var(--muted);font-variant-numeric:tabular-nums}.timeline-item:before{content:'';display:block;position:absolute;inset:0 0 auto;height:2px;background:var(--line);border-radius:2px}.timeline-item.active{color:var(--deep);font-weight:600}.timeline-item.active:before{background:var(--purple)}
/* Cover: title and action read together; the brand visual has its own space. */
.landing-screen .era-core{grid-template-areas:'kicker kicker' 'title visual' 'summary visual';row-gap:0}.landing-title{font-size:96px;line-height:1;letter-spacing:-.06em;max-width:680px}.landing-summary{grid-area:summary;margin-top:32px;max-width:680px}.landing-description{margin:0;font-size:18px;line-height:28px;max-width:560px}.landing-facts{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:12px;line-height:16px;color:var(--muted);margin-top:24px;font-variant-numeric:tabular-nums}.landing-facts span{color:var(--muted)}.landing-summary .era-actions{margin-top:32px}.landing-visual{min-height:480px}.landing-screen .timeline{margin-top:64px}
/* Questions use a flat reading area and a distinct interaction column. */
.question-screen{max-width:1280px;margin:0 auto;padding:32px 32px 64px}.question-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:14px;line-height:20px;color:var(--muted);font-variant-numeric:tabular-nums}.question-meta>span:first-child{display:flex;gap:16px;align-items:center}.type-label{display:inline-flex;align-items:center;min-height:32px;font-size:12px;line-height:16px;padding:4px 8px;background:var(--tint);color:var(--deep);border-radius:4px}.question-count{color:var(--deep);font-weight:600;white-space:nowrap}.question-count span{color:var(--muted);font-weight:400}.question-track{height:4px;border-radius:4px;background:var(--line);margin-top:16px;overflow:hidden}.question-track span{display:block;height:100%;width:100%;background:var(--purple);transform-origin:left center;transition:transform 500ms var(--ease)}.question-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px;margin-top:40px;align-items:start}.question-copy,.question-interaction{min-width:0}.question-text{font-size:36px;line-height:40px;font-weight:500;letter-spacing:-.035em;color:var(--ink);max-width:680px;text-wrap:pretty}.options{display:grid;gap:12px}.option{display:grid;grid-template-columns:24px 1fr 24px;gap:16px;align-items:center;text-align:left;width:100%;min-height:72px;padding:16px;border:1px solid var(--line);border-radius:12px;background:white;color:var(--ink);transition:background-color 300ms var(--ease),border-color 300ms var(--ease),transform 500ms var(--ease)}.option-copy{font-size:16px;line-height:24px;text-wrap:pretty}.option-index{font-size:12px;line-height:16px;font-variant-numeric:tabular-nums;color:var(--muted)}.option-indicator{display:flex;align-items:center;justify-content:center;color:var(--muted)}.option-indicator svg{display:block;width:24px;height:24px;flex:none}.option:not(:disabled):hover{background:var(--tint);border-color:#9978df;transform:translateX(2px)}.option:not(:disabled):active{transform:scale(.98)}.option.correct{border-color:#79b69a;background:#dff2e8;color:#245c49}.option.correct .option-index,.option.correct .option-indicator{color:#245c49}.option.selected:not(.correct){background:#f9d5df;border-color:#d77b94;color:#86344e}.option.selected:not(.correct) .option-index,.option.selected:not(.correct) .option-indicator{color:#86344e}.option:disabled:not(.correct):not(.selected){color:var(--muted);background:var(--surface);border-color:#e7e1ed}.option:disabled:not(.correct):not(.selected) .option-indicator{visibility:hidden}.answer-panel{margin-top:24px;padding:24px;background:var(--tint);border-radius:16px;animation:reveal 500ms var(--ease);scroll-margin-top:24px}.answer-status{color:var(--deep);font-size:20px;line-height:28px;font-weight:600;letter-spacing:-.025em;margin-bottom:12px}.answer-status:focus{outline:none}.explanation{font-size:16px;line-height:24px;max-width:65ch}.answer-bottom{margin-top:24px}.answer-bottom .primary-button{width:100%;min-width:0}
/* Results keep score and rank together; exporting is a separate action area. */
.result-screen{max-width:1280px;margin:0 auto;padding:40px 32px 64px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:96px;align-items:start}.result-copy{min-width:0}.result-eyebrow{font-size:14px;line-height:20px;color:var(--muted)}.result-score{display:flex;align-items:center;gap:24px;margin:40px 0 32px;color:var(--purple);font-variant-numeric:tabular-nums}.result-score strong{font-size:128px;font-weight:500;letter-spacing:-.06em;line-height:1}.result-score>span{font-size:30px;line-height:36px;color:var(--muted)}.result-score small{display:block;font-size:12px;line-height:16px;margin-top:8px}.result-rank-label{font-size:12px;line-height:16px;color:var(--muted);margin-bottom:12px}.result-copy h1{font-size:60px;line-height:1;letter-spacing:-.05em;color:var(--purple)}.result-description{margin-top:24px;font-size:18px;line-height:28px;max-width:560px}.result-cta{margin-top:24px}.text-button{display:block;border:0;padding:12px 0;background:none;color:var(--deep);font-size:16px;line-height:24px;font-weight:600;text-align:left;min-height:48px;transition:opacity 300ms var(--ease),transform 500ms var(--ease)}.text-button:hover{opacity:.75}.text-button:active{transform:scale(.98)}.result-copy>.text-button{margin-top:24px}.result-sharing{min-width:0;background:white;padding:24px;border-radius:24px}.result-sharing h2{font-size:20px;line-height:28px;font-weight:600;letter-spacing:-.025em}.format-picker{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:24px 0 16px;padding:4px;background:var(--tint);border-radius:12px}.format-picker button{border:0;background:none;color:var(--ink);padding:8px 12px;border-radius:8px;font-size:14px;line-height:20px;font-weight:500;min-height:48px;transition:background-color 300ms var(--ease),transform 500ms var(--ease)}.format-picker button[aria-pressed=true]{background:white;color:var(--deep)}.format-picker button:hover{background:#faf9fc}.format-picker button:active{transform:scale(.98)}.card-preview{width:100%;min-height:240px;border-radius:12px;overflow:hidden;background:var(--tint);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.card-preview>p{padding:24px;font-size:14px;line-height:20px}.card-preview img{width:100%;height:auto}.card-preview.story{max-width:240px;margin-inline:auto}.card-actions{margin-top:24px;display:grid;gap:8px}.card-actions .primary-button{width:100%;min-width:0}.card-actions .primary-button:nth-child(2){background:var(--tint);color:var(--deep)}.card-actions .primary-button:nth-child(2):hover{background:#e2d7fa}.share-status{font-size:12px;line-height:16px;color:var(--muted);margin-top:16px}.share-status:empty{display:none}.open-card{font-size:14px;line-height:20px;display:inline-block;padding:12px 0;color:var(--deep)}.open-card[hidden]{display:none}
.site-footer{max-width:1280px;margin:0 auto;padding:0 32px 24px}.site-footer button{border:0;background:none;padding:12px 0;color:var(--muted);font-size:12px;line-height:16px;min-height:48px}
.loading{min-height:65svh;max-width:1280px;margin:auto;padding:40px 32px;color:var(--muted);font-size:14px;line-height:20px}.loading-skeleton{display:block;width:65%;max-width:680px;height:128px;margin:40px 0 24px;border-radius:16px;background:var(--tint);animation:pulse 1500ms var(--ease) infinite alternate}.loading-skeleton:after{content:'';display:block;width:65%;height:48px;position:relative;top:152px;border-radius:12px;background:var(--tint)}.loading p{margin-top:96px}.error-box,.noscript{max-width:680px;margin:64px auto;padding:24px;font-size:16px;line-height:24px}.error-box .primary-button{margin-top:24px}.enter{animation:reveal 500ms var(--ease)}
@keyframes pearl-drift{from{transform:scale(1.01) translate3d(-.5%,0,0)}to{transform:scale(1.06) translate3d(1%,0,0)}}@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes pulse{to{opacity:.45}}
.page-hidden .visual-art,.quiet-motion .visual-art{animation-play-state:paused}body[data-era="2"]{--art-x:70%}body[data-era="3"]{--art-x:10%}body[data-era="4"]{--art-x:90%}body[data-era="5"]{--art-x:40%}body[data-era="6"]{--art-x:100%}
@media(min-width:1600px){.era-screen{padding-top:48px}.landing-screen .era-core{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}.landing-visual{min-height:560px}}
@media(max-width:1100px){.era-core{column-gap:32px}.landing-title{font-size:72px}.era-title{font-size:48px}.long-title .era-title{font-size:36px;line-height:40px}.era-visual{min-height:400px}.question-layout{gap:40px}.question-text{font-size:30px;line-height:36px}.result-screen{grid-template-columns:minmax(0,1fr) minmax(0,360px);gap:40px}.result-copy h1{font-size:48px}.result-score strong{font-size:96px}}
@media(max-width:760px){
 :root{--art:url('assets/smm/pearl-strip.webp')}
 .site-header{padding:8px 24px;gap:16px;margin-top:8px;min-height:80px}.brand{flex-basis:64px}.brand img{width:64px}.header-caption{font-size:12px;line-height:16px;max-width:128px}#main{min-height:calc(100svh - 88px)}
 .era-screen{padding:24px 24px 32px}.era-core{grid-template-columns:minmax(0,1fr);grid-template-areas:'kicker' 'title' 'visual' 'intro' 'action';gap:0}.era-kicker{margin-bottom:24px;font-size:12px;line-height:16px;gap:12px}.era-years{font-size:20px;line-height:28px}.era-title{font-size:36px;line-height:40px;letter-spacing:-.04em}.long-title .era-title{font-size:30px;line-height:36px}.era-intro{font-size:16px;line-height:24px;margin-top:24px}.era-actions{margin-top:24px}.primary-button{min-width:0;width:100%;min-height:56px;padding:8px 12px}.era-visual{min-height:128px;margin-top:24px;border-radius:16px}.visual-art{background-size:cover}.visual-period{left:16px;right:16px;bottom:16px;font-size:24px;line-height:32px}.timeline{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:32px}.timeline-item{padding-top:8px;font-size:12px;line-height:16px}
 .landing-screen .era-core{grid-template-columns:minmax(0,1fr);grid-template-areas:'kicker' 'title' 'visual' 'summary'}.landing-title{font-size:60px;line-height:1;letter-spacing:-.06em}.landing-summary{margin-top:24px}.landing-description{font-size:16px;line-height:24px;margin:0}.landing-facts{margin-top:16px;font-size:12px;line-height:16px;gap:8px}.landing-summary .era-actions{margin-top:24px}.landing-visual{min-height:96px;margin-top:24px}.landing-visual .visual-period{font-size:20px;line-height:28px}.landing-screen .timeline{margin-top:32px}
 .question-screen{padding:24px 24px 40px}.question-meta{font-size:12px;line-height:16px;gap:12px}.question-meta>span:first-child{gap:12px}.question-layout{display:block;margin-top:24px}.question-text{font-size:24px;line-height:32px;letter-spacing:-.025em}.question-interaction{margin-top:24px}.options{gap:8px}.option{min-height:64px;padding:12px;grid-template-columns:16px minmax(0,1fr) 24px;gap:12px}.option-copy{font-size:16px;line-height:24px}.option-index{font-size:12px;line-height:16px}.answer-panel{padding:16px;margin-top:24px;border-radius:16px}.answer-status{font-size:18px;line-height:28px}.answer-bottom{margin-top:24px}
 .result-screen{display:block;padding:24px 24px 40px}.result-score{margin:32px 0 24px;gap:24px}.result-score strong{font-size:96px;line-height:1}.result-copy h1{font-size:48px;line-height:1}.result-description{font-size:16px;line-height:24px}.result-sharing{margin-top:40px;padding:16px;border-radius:24px}.result-sharing h2{font-size:20px;line-height:28px}.card-preview.story{max-width:240px}.card-preview{border-radius:8px}.format-picker{border-radius:8px}.format-picker button{border-radius:4px}.card-actions .primary-button{font-size:16px}.site-footer{padding-inline:24px}.loading{padding-inline:24px}.loading-skeleton{width:100%}
}
@media(max-width:374px){.site-header{padding-inline:16px}.era-screen,.question-screen,.result-screen{padding-left:16px;padding-right:16px}.landing-title{font-size:48px}.header-caption{max-width:128px}.result-copy h1{font-size:36px;line-height:40px}}
@media(hover:none){.option:not(:disabled):hover{background:white;border-color:var(--line);transform:none}.primary-button:hover{background:var(--purple);transform:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.primary-button:hover,.option:hover{transform:none!important}}
@media print{.site-header,.timeline,.era-visual{display:none}body{background:white;color:black}.question-screen{padding:0}}

/* Opt-in illustration sizing review (?visuals=1). Keep production layout intact. */
.visual-review-bar{max-width:1280px;margin:0 auto;padding:12px 32px;display:flex;align-items:center;gap:16px;border-block:1px solid var(--line);font-size:12px;line-height:16px;background:var(--tint)}
.visual-review-bar label{font-weight:600}.visual-review-bar select{font:inherit;font-size:14px;line-height:20px;min-height:40px;max-width:100%;padding:8px 12px;background:white;color:var(--deep);border:1px solid var(--line);border-radius:8px}.visual-review-bar select:focus-visible{outline:2px solid var(--deep);outline-offset:4px}.visual-review-bar a{margin-left:auto;padding-block:12px}
.visual-review .era-visual{align-self:start;justify-self:end;width:100%;max-width:480px;min-height:0;aspect-ratio:2/1;outline:1px dashed var(--purple);outline-offset:-1px}
.illustration-slot{background:var(--tint);border:1px dashed var(--purple);border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--muted);text-align:center;padding:16px}
.slot-caption{font-size:14px;line-height:20px}.slot-size{font-size:12px;line-height:16px;font-variant-numeric:tabular-nums}.art-slot-size{position:absolute;left:16px;top:16px;padding:4px 8px;border-radius:4px;background:var(--surface);color:var(--deep)}
.question-illustration{width:100%;max-width:480px;aspect-ratio:3/1;margin-top:24px}.role-illustration{width:320px;max-width:100%;aspect-ratio:1;margin:0 0 24px}
.question-art{position:relative;overflow:hidden;border-radius:16px}.question-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.visual-review .question-art{outline:1px dashed var(--purple);outline-offset:-1px}
@media(max-width:760px){.visual-review-bar{padding:12px 24px;gap:8px;display:grid;grid-template-columns:minmax(0,1fr) auto}.visual-review-bar label{grid-column:1}.visual-review-bar select{grid-column:1;grid-row:2;width:100%;min-width:0}.visual-review-bar a{grid-column:2;grid-row:2;font-size:12px;line-height:16px;padding:12px 0}.visual-review .era-visual{max-width:none;aspect-ratio:2/1}.question-illustration{max-width:none;aspect-ratio:3/1}.role-illustration{width:240px;margin-inline:auto}.illustration-slot{padding:8px;gap:4px}}
@media(max-width:374px){.visual-review-bar{padding-inline:16px}}

/* Supplied page backgrounds; the original compositions remain unmodified. */
body[data-background="pattern-1"]{--page-pattern:url('assets/backgrounds/pattern-1.webp')}
body[data-background="pattern-2"]{--page-pattern:url('assets/backgrounds/pattern-2.webp')}
body[data-background="pattern-001"]{--page-pattern:url('assets/backgrounds/pattern-001.webp')}
body[data-background="pattern-002"]{--page-pattern:url('assets/backgrounds/pattern-002.webp')}
body[data-background="pattern-003"]{--page-pattern:url('assets/backgrounds/pattern-003.webp')}
body[data-background="pattern-004"]{--page-pattern:url('assets/backgrounds/pattern-004.webp')}
body[data-background="pattern-005"]{--page-pattern:url('assets/backgrounds/pattern-005.webp')}
body[data-background="pattern-006"]{--page-pattern:url('assets/backgrounds/pattern-006.webp')}
body[data-background="pattern-007"]{--page-pattern:url('assets/backgrounds/pattern-007.webp')}
body[data-background="pattern-soft"]{--page-pattern:url('assets/backgrounds/pattern-soft.webp')}
@media(max-width:760px){#review-cover-control{grid-column:1 / -1}}
body[data-background^="pattern-"] .scene-background{display:block;position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:var(--page-pattern);background-position:center;background-size:cover;background-repeat:no-repeat;opacity:.7}
.visual-review-bar{flex-wrap:wrap;align-items:end}
.review-control{display:flex;flex-direction:column;gap:4px;min-width:0}
.review-control[hidden]{display:none}
.visual-review-bar select:disabled{opacity:.65;cursor:default}
.era-visual.era-illustration{width:100%;max-width:480px;min-height:0;aspect-ratio:2/1;align-self:start;justify-self:end}
.era-illustration img{display:block;width:100%;height:100%;object-fit:contain}
@media(max-width:760px){.era-visual.era-illustration{max-width:none}#review-era-control{grid-column:1 / -1}}
@media(max-width:760px){.visual-review-bar{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.review-control select{width:100%}.visual-review-bar a{grid-column:1 / -1;grid-row:auto;margin:0;justify-self:end;padding:4px 0}}

/* Final result: the role leads; sharing follows the complete result. */
.result-screen{display:flex;flex-direction:column;gap:64px;padding-top:48px}
.result-copy,.result-sharing{width:100%}
.result-hero{margin-top:24px}
.result-hero.has-role-art{display:grid;grid-template-columns:minmax(0,1fr) 480px;gap:64px;align-items:start}
.result-role-copy{min-width:0;max-width:680px}
.result-copy h1{font-size:60px;line-height:1;text-wrap:balance;max-width:680px}
.result-rank-label{font-size:14px;line-height:20px;margin-bottom:16px}
.result-hero .role-illustration{margin:0;width:480px}
.result-description{max-width:680px;text-wrap:pretty}
.result-score{gap:12px;margin:24px 0 0;flex-wrap:wrap;color:var(--deep)}
.result-score strong{font-size:24px;line-height:32px;letter-spacing:0;font-weight:600}
.result-score>span{font-size:14px;line-height:20px}
.result-closing{margin-top:32px}
.result-closing .result-description{margin:0;color:var(--muted);font-size:16px;line-height:24px}
.result-closing .text-button{margin-top:12px}
.result-sharing{background:none;padding:0;border-radius:0;margin:0}
.result-sharing h2{font-size:20px;line-height:28px}
.result-share-layout{display:grid;grid-template-columns:240px minmax(0,360px);gap:32px;margin-top:24px;align-items:start}
.result-share-controls{min-width:0}
.result-sharing .card-preview{min-height:0;max-width:240px;margin:0}
.result-sharing .format-picker{margin:0}
.result-sharing .card-actions{margin-top:16px}
.result-sharing .card-actions .primary-button{background:var(--tint);color:var(--deep)}
.result-sharing .card-actions .primary-button:hover{background:#e2d7fa}
@media(max-width:1100px){.result-hero.has-role-art{gap:32px;grid-template-columns:minmax(0,1fr) 360px}.result-hero .role-illustration{width:360px}.result-copy h1{font-size:48px}}
@media(max-width:760px){
 .result-screen{padding-top:24px;gap:48px}
 .result-hero{margin-top:24px}
 .result-hero.has-role-art{grid-template-columns:minmax(0,1fr);gap:24px}
 .result-copy h1{font-size:36px;line-height:40px}
 .result-hero .role-illustration{justify-self:center;width:100%}
 .result-role-copy{display:contents}
 .result-role-content{order:1}
 .result-hero .role-illustration{order:2}
 .result-closing{order:3;margin-top:0}
 .result-share-layout{grid-template-columns:minmax(0,1fr);gap:24px}
 .result-sharing .card-preview{max-width:240px;justify-self:start}
 .result-share-controls{width:100%;max-width:360px}
}

body[data-background="pattern-latest"]{--page-pattern:url('assets/backgrounds/pattern-latest.webp')}
.privacy-footer{display:flex;align-items:center;flex-wrap:wrap;gap:8px 24px}
.privacy-footer a,.privacy-footer button{font:500 14px/20px Manrope,sans-serif;color:var(--deep);padding:12px 0;min-height:48px;text-underline-offset:4px}
.privacy-footer a:hover,.privacy-footer button:hover{color:var(--purple)}



/* Supplied square role artwork: preserve the full composition. */
.role-art{position:relative;overflow:hidden;border-radius:16px}
.role-art img{display:block;width:100%;height:100%;object-fit:contain}
.visual-review .role-art{outline:1px dashed var(--purple);outline-offset:-1px}

/* Anniversary cover: supplied landscape and portrait artwork, live text. */
body[data-screen="landing"] #main{min-height:0}
.cover-hero{position:relative;isolation:isolate;overflow:hidden;min-height:780px}
.cover-hero-inner{max-width:1280px;margin:auto;padding:32px 32px 80px}
.cover-kicker{display:flex;align-items:center;justify-content:space-between;gap:24px;color:var(--muted);font-size:14px;line-height:20px;margin-bottom:32px}
.cover-title{font-size:96px;line-height:1;font-weight:700;letter-spacing:-.055em;text-transform:uppercase;color:var(--ink);text-wrap:initial;max-width:960px}
.cover-hero-art{position:absolute;inset:0;z-index:-1;background-image:url('assets/illustrations/cover/web/landing-desktop.webp');background-size:cover;background-position:center bottom;pointer-events:none;mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 94%,transparent)}
.cover-summary{max-width:480px;margin-top:24px}
.cover-description{font-size:18px;line-height:28px;text-wrap:pretty}
.cover-action{margin-top:32px}
.cover-action .primary-button{min-width:280px;padding-inline:24px}
.cover-summary .landing-facts{margin-top:16px;font-size:14px;line-height:20px;gap:8px}
@media(min-width:1600px){.cover-hero{min-height:880px}.cover-hero-inner{padding-top:48px}.cover-title{font-size:96px}.cover-summary{max-width:560px}}
@media(min-width:761px) and (max-width:1100px){
 .cover-hero{min-height:840px}.cover-hero-inner{padding:24px 32px 64px}.cover-title{font-size:72px}.cover-summary{max-width:440px}.cover-hero-art{inset:auto 0 0;height:calc(100vw * 1520 / 2688);background-size:100% auto;background-repeat:no-repeat;background-position:center bottom}
}
@media(max-width:760px){
 .cover-hero{min-height:0;overflow:hidden}
 .cover-hero-inner{display:flex;flex-direction:column;padding:24px 24px 32px}
 .cover-kicker{font-size:12px;line-height:16px;margin-bottom:24px;gap:12px}
 .cover-title{font-size:48px;line-height:1;letter-spacing:-.055em;max-width:none}
 .cover-hero-art{position:relative;inset:auto;z-index:0;flex:none;height:72vw;width:calc(100% + 48px);margin:8px -24px 0;background-image:url('assets/illustrations/cover/web/landing-mobile.webp');background-size:100% auto;background-position:center 55%;mask-image:linear-gradient(to bottom,transparent,#000 10%,#000 90%,transparent)}
 .cover-summary{max-width:560px;margin:8px 0 0}
 .cover-description{font-size:16px;line-height:24px}
 .cover-action{margin-top:24px}
 .cover-action .primary-button{min-width:0;width:100%;padding-inline:16px}
 .cover-summary .landing-facts{font-size:12px;line-height:16px;gap:8px;margin-top:16px}
}
@media(min-width:431px) and (max-width:760px){.cover-title{font-size:60px}.cover-hero-art{height:56vw;background-position:center 56%}}
@media(max-width:374px){.cover-hero-inner{padding-inline:16px}.cover-hero-art{width:calc(100% + 32px);margin-inline:-16px}.cover-title{font-size:48px;letter-spacing:-.065em}}