@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Manrope:wght@400;500;600;700&display=swap');
:root{color-scheme:light;--ink:#162b4b;--muted:#526a80;--gold:#a2742c;--blue:#86add0;--paper:#f4f8fc;--serif:'Cormorant Garamond',Georgia,serif;--sans:'Manrope',system-ui,sans-serif}
*{box-sizing:border-box}html{min-width:320px;background:var(--paper)}body{margin:0;color:var(--ink);font:16px/1.6 var(--sans);background:radial-gradient(ellipse at 50% 39%,#fff 10%,#f8fbfeaa 40%,#dfeaf47a 100%),linear-gradient(90deg,#8fb3d72a 1px,transparent 1px),linear-gradient(#8fb3d72a 1px,transparent 1px),#f4f8fc;background-size:auto,88px 88px,88px 88px,auto}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:wait}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,.arena:focus-visible{outline:3px solid #376fa1;outline-offset:5px}button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;left:20px;top:-100px;background:#fff;padding:10px;z-index:100}.skip-link:focus{top:10px}.page-shell{max-width:2000px;margin:auto;min-height:100svh;display:flex;flex-direction:column;overflow:hidden}.masthead{min-height:110px;padding:22px clamp(24px,4vw,76px);display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:16px}.brand img{flex:none}.brand strong{display:block;font-family:var(--serif);font-weight:600;font-size:27px;letter-spacing:.025em;line-height:1.15}.brand small{display:block;color:var(--gold);font-size:12px;letter-spacing:.21em;text-transform:uppercase;margin-top:7px}.brand-mantra{font-size:12px;text-transform:uppercase;letter-spacing:.26em;color:#667b91}.sound-toggle{border:1px solid #b3c4d450;background:#ffffff70;border-radius:30px;padding:10px 15px;display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px}.sound-toggle:hover{border-color:#b58c45;background:#fff}.sound-waves{display:flex;gap:3px;align-items:center;height:17px}.sound-waves i{display:block;width:2px;height:7px;background:currentColor;border-radius:2px}.sound-waves i:nth-child(2){height:16px}.sound-waves i:nth-child(3){height:11px}.sound-toggle[aria-pressed=false] .sound-waves i{height:3px}main{flex:1}.page-heading{text-align:center;padding-top:1px;position:relative;z-index:2}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.23em;color:var(--muted)}h1{font-family:var(--serif);font-weight:500;font-size:clamp(38px,4vw,65px);letter-spacing:.015em;line-height:1.05;margin:8px 0 18px}.heading-rule{height:1px;background:linear-gradient(90deg,transparent,#b9985b,transparent);width:220px;margin:auto;position:relative}.heading-rule i{position:absolute;width:6px;height:6px;border:1px solid var(--gold);transform:rotate(45deg);top:-2px;left:50%;background:var(--paper)}
.arena{height:clamp(335px,47vh,515px);margin-top:18px;position:relative;isolation:isolate;outline:none}.character-track{position:absolute;inset:0;perspective:1500px}.hero-card{position:absolute;left:50%;top:48%;width:clamp(210px,23vw,332px);aspect-ratio:4/5;padding:6px;border:1px solid #c9a566b0;border-radius:150px 150px 16px 16px;background:linear-gradient(145deg,#ffffffeb,#eaf0f7eb);box-shadow:0 16px 30px #28425e1b,inset 0 0 0 3px #ffffffb0;transform-origin:center 75%;transition:transform .78s cubic-bezier(.2,.75,.18,1),opacity .6s,filter .6s,box-shadow .6s,border-color .6s;will-change:transform,opacity;overflow:visible;cursor:pointer;color:var(--ink)}.hero-card::before{content:'';position:absolute;inset:11px;border:1px solid #b4905060;border-radius:inherit;pointer-events:none;z-index:2}.hero-card::after{content:'';position:absolute;width:10px;height:10px;left:calc(50% - 5px);bottom:-6px;background:#e9d099;border:2px solid #b28a41;transform:rotate(45deg);box-shadow:0 0 14px #d0a55380;z-index:3}.hero-card img{display:block;width:100%;height:100%;aspect-ratio:4/5;object-fit:cover;border-radius:144px 144px 12px 12px;pointer-events:none}.hero-card.is-selected{border-color:#b07e2a;box-shadow:0 22px 42px #28425e25,0 0 42px #d2ab5b30,inset 0 0 0 3px #ffffffd0}.hero-card.is-selected::before{border-color:#a679316b}.card-label{position:absolute;bottom:18px;left:14px;right:14px;background:#fffffff2;border:1px solid #b4905050;border-radius:4px;padding:5px 4px;font-size:13px;font-weight:600;letter-spacing:.02em;line-height:1.3;text-align:center;opacity:1;transition:opacity .35s}.is-selected .card-label{opacity:0}.hero-card:hover:not(.is-selected){filter:brightness(1.035)!important}.blueprint-orbit{position:absolute;width:520px;height:520px;left:50%;top:45%;transform:translate(-50%,-50%);z-index:-2;opacity:.6;pointer-events:none}.blueprint-orbit span{position:absolute;inset:0;border:1px solid #78a5cf8c;border-radius:50%}.blueprint-orbit span:nth-child(2){inset:21px;border-style:dashed;border-color:#97b8d365}.blueprint-orbit span:nth-child(3){inset:51px;border-color:#c49d5950}.blueprint-orbit::before,.blueprint-orbit::after{content:'';position:absolute;background:#8fb3d76a}.blueprint-orbit::before{width:1px;left:50%;height:112%;top:-6%}.blueprint-orbit::after{height:1px;top:50%;width:116%;left:-8%}.blueprint-orbit i{position:absolute;width:7px;height:7px;background:#c4a15b;border-radius:50%;left:50%;top:20px;box-shadow:0 0 10px #e3b449}.floor-orbit{position:absolute;width:min(1400px,112%);height:260px;left:50%;bottom:-86px;transform:translateX(-50%) rotateX(62deg);border:1px solid #9db9d48c;border-radius:50%;z-index:-1;background:radial-gradient(ellipse,#fff0 51%,#e2c17c22 54%,#fff0 59%);pointer-events:none}.floor-orbit span{position:absolute;inset:13px;border:1px solid #b58b429c;border-radius:50%;box-shadow:0 0 9px #dfc38630}.floor-orbit span:nth-child(2){inset:36px;border-color:#749ec080;border-style:dashed}.floor-orbit span:nth-child(3){inset:64px;border-color:#9db9d46b}.floor-orbit i{position:absolute;width:9px;height:9px;border:2px solid #b18638;border-radius:50%;background:#fff;left:50%;bottom:14px;box-shadow:0 0 14px #d8b86c}.selection-flash{position:absolute;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 50% 65%,#edcb8170,transparent 53%);opacity:0}.selection-flash.play{animation:select-pulse .8s ease-out}.turn-button{position:absolute;top:43%;z-index:30;width:58px;height:58px;border-radius:50%;border:1px solid #b38c46;background:#ffffffed;color:#977027;display:grid;place-items:center;box-shadow:0 4px 18px #2c456b13;transition:transform .2s,background .2s,box-shadow .2s}.turn-button:hover{transform:scale(1.08);background:#fff8e9;box-shadow:0 0 20px #dfba6a40}.turn-button:active{transform:scale(.94)}.previous{left:clamp(18px,4vw,70px)}.next{right:clamp(18px,4vw,70px)}
.selection-info{position:relative;z-index:2;text-align:center;margin:12px auto 0;padding:0 20px;max-width:850px}.character-role{font-size:12px;letter-spacing:.2em;color:var(--gold);text-transform:uppercase;margin:0 0 2px}.selection-info h2{font-family:var(--serif);font-weight:500;font-size:clamp(30px,3.2vw,46px);letter-spacing:.01em;line-height:1.08;margin:4px 0 8px}.character-line{color:#52697f;font-size:14px;margin:0;min-height:24px}.trait-tags{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:14px 0 19px}.trait-tags span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;min-width:115px;border:1px solid #9bbada96;background:#f7fbff9c;padding:3px 13px;border-radius:30px;color:#37668b}.open-character{min-height:54px;min-width:290px;border-radius:30px;border:1px solid #b28030;background:linear-gradient(180deg,#f9e7b2,#eac170 45%,#c49846);color:#4d3917;box-shadow:inset 0 0 0 3px #fff1d090,0 4px 13px #a77b2926;display:inline-flex;align-items:center;justify-content:center;gap:24px;font-family:var(--serif);font-weight:600;font-size:23px;transition:transform .2s,box-shadow .2s}.open-character:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 3px #fff1d090,0 8px 22px #a77b2940}.open-character:active{transform:translateY(1px)}.rotation-hint{margin-top:12px;color:#5e7690;font-size:12px;letter-spacing:.13em}.rotation-hint span{color:#8a6a34;padding:0 13px;font-size:17px}.selection-info.changing{animation:info-enter .55s ease both}.gallery-footer{padding:24px clamp(24px,4vw,76px) 20px;display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative;z-index:2}.collection-label{font-size:12px;letter-spacing:.06em;color:#6b7e91}.collection-label b{margin:0 6px;color:#b9975c}.page-counter{display:flex;align-items:baseline;gap:9px;font-size:14px;color:#708297}.page-counter strong{font-family:var(--serif);font-size:30px;font-weight:500;color:#283d54}.index-navigation{display:flex;gap:1px;align-items:center}.index-navigation button{width:23px;height:28px;padding:0;border:0;background:none;position:relative}.index-navigation button::before{content:'';display:block;width:5px;height:5px;border:1px solid #7193b4;border-radius:50%;position:absolute;left:9px;top:11px;transition:all .3s}.index-navigation button[aria-current=true]::before{width:9px;height:9px;left:7px;top:9px;background:#b78a38;border-color:#b78a38;box-shadow:0 0 0 4px #b78a3814}.index-navigation button:hover::before{background:#b78a38}
.dossier-dialog{width:min(1200px,94vw);max-width:none;max-height:90svh;padding:0;border:1px solid #c6aa74;border-radius:15px;background:#fcfdff;color:var(--ink);box-shadow:0 35px 140px #17314940;overflow:hidden}.dossier-dialog::backdrop{background:#20324980;backdrop-filter:blur(9px)}.dossier-dialog[open]{animation:dossier-enter .4s ease both}.close-dossier{position:absolute;right:17px;top:17px;z-index:5;width:43px;height:43px;border:1px solid #b7c5d1;background:#fffffff2;border-radius:50%;display:grid;place-items:center;color:var(--ink)}.close-dossier:hover{background:#f1e6d0}.dossier-layout{display:grid;grid-template-columns:43% 57%;height:min(790px,90svh)}.dossier-visual{position:relative;background:#eaf1f7;overflow:hidden;display:flex;align-items:center;border-right:1px solid #bdcdd966}.dossier-visual img{width:100%;height:100%;object-fit:contain}.dossier-visual-caption{position:absolute;left:0;right:0;bottom:0;padding:65px 25px 23px;display:flex;flex-direction:column;align-items:center;gap:3px;background:linear-gradient(transparent,#f4f8fbee 56%)}.dossier-visual-caption strong{font-family:var(--serif);font-size:28px;font-weight:600;line-height:1.15;text-align:center}.dossier-visual-caption>span:last-child{font-size:12px;color:#657c91}.dossier-copy{overflow-y:auto;padding:42px 48px 34px;overscroll-behavior:contain;scrollbar-color:#c2ae88 #f1f5f8;scrollbar-width:thin}.dossier-copy h2{font-family:var(--serif);font-size:clamp(32px,3vw,46px);font-weight:500;line-height:1.06;margin:15px 25px 15px 0;overflow-wrap:anywhere}.dossier-lead{font-family:var(--serif);font-size:25px;line-height:1.25;color:#8b692e;margin:0 0 24px}.configuration{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #c4af8660;border-bottom:1px solid #c4af8660;padding:17px 0;gap:20px;margin:22px 0}.configuration div span{display:block;color:#778b9b;font-size:12px;letter-spacing:.12em;text-transform:uppercase}.configuration strong{font-weight:600;font-size:16px}.dossier-copy p{font-size:16px;line-height:1.8}.dossier-copy section{margin:27px 0}.dossier-copy section h3{font-family:var(--serif);font-size:27px;font-weight:600;margin:0 0 8px;line-height:1.2}.dossier-copy ul{padding:0;list-style:none;margin:10px 0}.dossier-copy li{position:relative;padding:0 0 9px 18px;font-size:15px;line-height:1.7}.dossier-copy li::before{content:'';position:absolute;width:4px;height:4px;left:1px;top:11px;background:#b89450;transform:rotate(45deg)}.player-question{border-left:2px solid #b89450;background:#f3eee43b;padding:17px 20px}.player-question p{font-family:var(--serif);font-size:25px;line-height:1.35;margin:9px 0 0}.dossier-copy .model-note{font-size:12px;line-height:1.7;color:#718193;border-top:1px solid #bdcad650;padding-top:20px;margin-top:30px}.back-to-arena{border:none;border-bottom:1px solid #aa854f;background:transparent;color:#8b692e;font-size:14px;padding:8px 0}.no-script{position:fixed;inset:45% 15% auto;background:#fff;padding:20px;border:1px solid var(--gold);z-index:50;text-align:center}
@keyframes select-pulse{0%{opacity:0;transform:scale(.8)}30%{opacity:.7}100%{opacity:0;transform:scale(1.1)}}@keyframes info-enter{0%{opacity:.45;transform:translateY(6px)}100%{opacity:1;transform:translateY(0)}}@keyframes dossier-enter{from{opacity:0;transform:translateY(22px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(min-height:950px) and (min-width:900px){.page-heading{padding-top:20px}.arena{margin-top:30px;height:490px}.selection-info{margin-top:30px}.gallery-footer{padding-bottom:30px}}
@media(max-width:1000px){.brand-mantra{display:none}.masthead{min-height:96px}.hero-card{width:270px}.arena{height:405px}.dossier-copy{padding:38px 28px}.gallery-footer{flex-wrap:wrap}.collection-label{font-size:11px}.trait-tags span{min-width:95px}}
@media(max-width:600px){.masthead{padding:20px 19px 12px;gap:10px;min-height:88px}.brand{gap:9px}.brand img{width:40px;height:40px}.brand strong{font-size:23px}.brand small{font-size:9px;letter-spacing:.15em;margin-top:5px}.sound-toggle{padding:10px;min-width:38px;height:38px;justify-content:center}.sound-toggle>span:last-child{display:none}.page-heading{padding-top:12px}.page-heading .eyebrow{font-size:10px}h1{font-size:41px;margin:8px 0 13px}.heading-rule{width:150px}.arena{height:345px;margin-top:17px}.hero-card{width:228px;top:46%}.blueprint-orbit{width:355px;height:355px;top:44%}.floor-orbit{width:780px;bottom:-84px}.turn-button{width:42px;height:42px;top:44%;background:#fffffff5}.previous{left:13px}.next{right:13px}.selection-info{margin-top:1px;padding:0 20px}.selection-info h2{font-size:33px;line-height:1.12;margin:5px 0 8px}.character-role{font-size:10px;letter-spacing:.15em}.character-line{font-size:13px;line-height:1.6;min-height:42px;max-width:340px;margin:auto}.trait-tags{gap:5px;margin:12px 0 17px}.trait-tags span{font-size:10px;min-width:0;padding:4px 10px}.open-character{min-width:265px;min-height:51px;font-size:22px}.rotation-hint{font-size:10px;margin-top:12px}.gallery-footer{padding:18px 20px 22px;gap:8px}.index-navigation{order:3;width:100%;justify-content:center;margin-top:6px}.collection-label{font-size:10px}.page-counter strong{font-size:26px}.page-counter{font-size:12px}.dossier-dialog{width:100vw;max-height:100svh;height:100svh;border-radius:0;border:0}.dossier-layout{display:block;height:100svh;overflow-y:auto;overscroll-behavior:contain}.dossier-visual{height:390px;min-height:0;border-right:0;border-bottom:1px solid #bdcdd966}.dossier-visual img{object-position:center 28%}.dossier-visual-caption{padding:45px 20px 13px}.dossier-visual-caption strong{font-size:25px}.dossier-copy{overflow:visible;padding:28px 24px 36px}.dossier-copy h2{font-size:38px;margin-right:0}.dossier-copy .eyebrow{font-size:11px}.dossier-lead{font-size:24px}.close-dossier{position:fixed;right:14px;top:14px}.configuration{gap:12px}.configuration strong{font-size:15px}.dossier-copy section h3{font-size:28px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Keep the controls within a compact laptop viewport. */
@media(min-width:601px) and (max-height:850px){
 .masthead{min-height:78px;padding-top:12px;padding-bottom:12px}.brand img{width:47px;height:47px}.brand strong{font-size:25px}.brand small{font-size:10px}
 h1{font-size:44px;margin:4px 0 12px}.page-heading .eyebrow{font-size:10px}
 .arena{height:max(230px,calc(100svh - 435px));margin-top:10px}.hero-card{width:min(23vw,31vh);top:50%}.blueprint-orbit{width:410px;height:410px}
 .selection-info{margin-top:0}.selection-info h2{font-size:34px;margin:2px 0 4px}.character-role{font-size:10px}.character-line{font-size:12px;min-height:20px}
 .trait-tags{margin:8px 0 12px}.trait-tags span{font-size:10px;padding:2px 12px}.open-character{min-height:46px;font-size:21px}.rotation-hint{margin-top:7px;font-size:10px}
 .gallery-footer{padding-top:10px;padding-bottom:10px}.page-counter strong{font-size:26px;line-height:1.2}
}
@media(max-width:1000px){.masthead{flex-wrap:wrap;row-gap:9px}.brand-mantra{display:block;order:3;width:100%;text-align:center;font-size:10px;letter-spacing:.21em}}
@media(max-width:600px){.brand-mantra{font-size:9px}.masthead{padding-bottom:6px}.page-heading{padding-top:7px}.arena{height:310px}.hero-card{width:220px}}