:root{
  color-scheme:dark;
  --ink:#352513;
  --gold:#ddb85a;
  --gold-bright:#f6dc8a;
  --green:#153c2b;
  --red:#7c1830;
  --stage-shadow:0 26px 90px rgba(0,0,0,.82);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#020202}
body{font-family:Georgia,"Times New Roman",serif;color:#f4e7bd}
button,a{font:inherit}
button{border:0}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.app{position:relative;width:100%;height:100%;overflow:hidden;background:radial-gradient(circle at 50% 44%,#17110a 0,#050403 46%,#000 100%)}
.loading{position:absolute;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;gap:14px;background:#050403;color:#d7bf75;letter-spacing:.08em;text-transform:uppercase;font-size:.82rem;transition:opacity .35s,visibility .35s}
.loading-crest{display:grid;place-items:center;width:46px;height:46px;border:1px solid #b89646;border-radius:50%;font:700 1.6rem Georgia,serif;box-shadow:0 0 24px rgba(226,187,83,.25);animation:pulse 1.5s ease-in-out infinite}
.app:not(.is-loading) .loading{opacity:0;visibility:hidden}
@keyframes pulse{50%{transform:scale(1.06);box-shadow:0 0 34px rgba(226,187,83,.42)}}

/* Shared zoom-and-fade transition, matched to the approved entrance language. */
.transition-veil{position:absolute;inset:-4%;z-index:850;pointer-events:none;opacity:0;visibility:hidden;background:radial-gradient(circle at var(--veil-x,50%) var(--veil-y,50%),rgba(87,62,31,.22),rgba(8,5,3,.88) 58%,#020202 100%);transition:opacity .28s ease,visibility .28s}
.transition-veil.is-active{opacity:1;visibility:visible}
.view{position:absolute;inset:0;display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .52s cubic-bezier(.2,.72,.2,1),visibility .52s}
.view.is-active{opacity:1;visibility:visible;pointer-events:auto}
.view.is-next{opacity:0;visibility:visible;pointer-events:none}
.view.is-next.is-entering{opacity:1}
.view.is-leaving{opacity:0;pointer-events:none}
.view .desk-stage,.view .asset-frame{transition:transform .70s cubic-bezier(.18,.74,.16,1),opacity .52s cubic-bezier(.2,.72,.2,1);transform:scale(1);opacity:1;will-change:transform,opacity}
.view.is-leaving .desk-stage,.view.is-leaving .asset-frame{transform:scale(1.045);opacity:.12}
.view.is-next .asset-frame{transform:scale(.982);opacity:.04}
.view.is-next.is-entering .asset-frame{transform:scale(1);opacity:1}

/* Approved interactive desk. */
.desk-view{background:#000}
.desk-stage{position:relative;width:min(100vw,calc(100vh * 2));aspect-ratio:2/1;overflow:hidden;isolation:isolate;box-shadow:var(--stage-shadow);background:#080604}
.desk-base,.desk-plates,.desk-plate,.desk-hotspots{position:absolute;inset:0;width:100%;height:100%}
.desk-base,.desk-plate{display:block;object-fit:contain;user-select:none;-webkit-user-drag:none}
.desk-base{z-index:1}.desk-plates{z-index:2;pointer-events:none}
.desk-plate{opacity:0;transition:opacity .34s cubic-bezier(.2,.72,.2,1)}
.desk-plate.is-active{opacity:1}
.desk-hotspots{z-index:4;pointer-events:none}
.desk-hotspot{pointer-events:auto;cursor:pointer;outline:none}
.desk-hotspot path{fill:transparent;stroke:none;pointer-events:all}
.desk-hotspot:focus-visible path{stroke:rgba(244,216,126,.08);stroke-width:2}

/* Open-book and themed section stages. */
.overlay-view{background:rgba(0,0,0,.22)}
.overlay-view::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.76)}
.asset-frame{position:relative;z-index:2;width:min(98vw,calc(94vh * var(--asset-ratio)));max-height:94vh;aspect-ratio:var(--asset-ratio);container-type:inline-size;isolation:isolate;filter:drop-shadow(0 22px 52px rgba(0,0,0,.75));transform:translateZ(0)}
.asset-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;pointer-events:none}
.section-image{z-index:2}
.power-plate{z-index:5;opacity:0;transition:opacity .27s cubic-bezier(.2,.72,.2,1)}
.power-plate.is-visible{opacity:1}
.text-plate{z-index:8;opacity:1;transition:opacity .18s ease}
.text-plate.is-changing{opacity:0}
.control-plate{z-index:14;opacity:0;pointer-events:none;transition:opacity .11s ease-out;will-change:opacity}
.control-plate.is-visible{opacity:1}
.return-plate{z-index:14}.contents-plate{z-index:15}.special-plate{z-index:16}

/* Approved master hub: Contents on the left, detailed hero on the right. */
.hub-frame{--asset-ratio:1.5}
.page-surface{position:absolute;z-index:4;color:var(--ink);text-shadow:0 1px rgba(255,255,255,.25)}
.hub-contents{left:15.7%;top:14.2%;width:31.8%;height:71.3%;padding:2.4cqw 2.2cqw 2cqw}
.hub-preview{left:52.7%;top:14.2%;width:34.8%;height:71.3%;display:flex;flex-direction:column;align-items:center;text-align:center;padding:2.3cqw 2cqw 1.8cqw}
.hub-contents h1{margin:0 0 1.15cqw;font-size:2.45cqw;font-weight:500;letter-spacing:.075em;text-align:center;color:#3c2a17}
.contents-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.42cqw .48cqw;counter-reset:contents}
.contents-item{counter-increment:contents}
.contents-entry{position:relative;width:100%;display:grid;grid-template-columns:2.15cqw 1fr;align-items:center;gap:.55cqw;min-height:5.15cqw;padding:.42cqw .62cqw;background:transparent;border:1px solid rgba(97,74,36,.23);color:#3c2b19;text-align:left;cursor:pointer;transition:background .22s,border-color .22s,transform .22s,box-shadow .22s}
.contents-entry::before{content:counter(contents,upper-roman);font-size:.78cqw;letter-spacing:.05em;color:#806638;text-align:center}
.contents-entry span{font-size:.93cqw;font-weight:700;line-height:1.02;letter-spacing:.018em;text-transform:uppercase}
.contents-entry:hover,.contents-entry:focus-visible,.contents-entry.is-selected{background:linear-gradient(90deg,rgba(209,179,103,.12),rgba(23,65,45,.10));border-color:rgba(146,112,48,.55);box-shadow:inset 3px 0 0 #9b7431,0 4px 12px rgba(65,39,10,.08);transform:translateX(.12cqw);outline:none}
.contents-item.is-restricted .contents-entry{border-color:rgba(112,20,34,.34);color:#551526}
.contents-item.is-restricted .contents-entry::after{content:"OOC HIDDEN CANON";position:absolute;right:.45cqw;bottom:.16cqw;font:700 .47cqw/1 Georgia,serif;letter-spacing:.06em;color:#8b1f32}
.hub-preview h2{margin:0;max-width:100%;font-size:2.45cqw;line-height:.98;letter-spacing:.035em;text-transform:uppercase;color:#3a2917;min-height:5.4cqw;display:flex;align-items:center;justify-content:center}
.hub-preview.is-record{align-items:stretch;text-align:left;padding:1.95cqw 2.05cqw 1.35cqw}
.hub-preview.is-record h2{min-height:auto;margin:0 0 .62cqw;text-align:center;font-size:2.12cqw;line-height:1.02}
.hub-record{min-height:0;flex:1;overflow:hidden;color:#352513}
.hub-record-body{font-family:Baskerville,"Times New Roman",Times,serif;font-size:18px;line-height:1.32;text-align:left;text-rendering:optimizeLegibility}
.hub-record-body p{margin:0 0 .48em;text-indent:1.2em}
.hub-record-body p:last-child{margin-bottom:0}
.personality-summary{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding:.1cqw .45cqw .2cqw}
.personality-summary img{display:block;width:auto;max-width:72%;height:auto;max-height:54%;object-fit:contain;margin:.05cqw auto .35cqw;filter:drop-shadow(0 .55cqw .55cqw rgba(45,25,8,.32))}
.personality-summary p{max-width:94%;margin:.15cqw auto 0;font:400 clamp(19px,1.37cqw,25px)/1.36 Baskerville,"Times New Roman",Times,serif;text-indent:0;color:#352513;text-align:center}
.hub-preview.is-personality{padding-bottom:1.3cqw}
.hub-preview.is-personality h2{margin-bottom:.05cqw}
.hub-preview.is-record .hero-button{display:none}

.hero-button{position:relative;flex:1;width:100%;min-height:0;background:transparent;cursor:pointer;display:grid;place-items:center;padding:.4cqw;outline:none}
.hero-button img{position:relative;z-index:2;max-width:96%;max-height:96%;object-fit:contain;filter:drop-shadow(0 .85cqw .8cqw rgba(45,25,8,.34));transition:transform .35s cubic-bezier(.2,.75,.2,1),filter .35s}
.hero-aura{position:absolute;z-index:1;width:78%;height:68%;border-radius:50%;background:radial-gradient(ellipse,rgba(231,195,93,.24),rgba(231,195,93,.05) 46%,transparent 72%);filter:blur(1.3cqw);opacity:0;transform:scale(.86);transition:opacity .35s,transform .35s}
.hero-button:hover img,.hero-button:focus-visible img,.hero-button.is-active img{transform:translateY(-.6cqw) scale(1.035);filter:drop-shadow(0 .95cqw 1.2cqw rgba(45,25,8,.48)) drop-shadow(0 0 .85cqw var(--hero-color,#d3a743)) brightness(1.08)}
.hero-button:hover .hero-aura,.hero-button:focus-visible .hero-aura,.hero-button.is-active .hero-aura{opacity:1;transform:scale(1)}

/* HTML tabs are used only where no tab is baked into the approved image. */
.integrated-tab{position:absolute;z-index:30;cursor:pointer;color:#edcf76;background:linear-gradient(145deg,#2a1b10,#100c08 70%);border:1px solid #9e7b38;box-shadow:inset 0 0 0 2px rgba(231,195,93,.11),0 5px 16px rgba(0,0,0,.45);text-shadow:0 1px #000;transition:filter .2s,transform .2s,box-shadow .2s;outline:none}
.integrated-tab:hover,.integrated-tab:focus-visible{filter:brightness(1.28);box-shadow:inset 0 0 0 2px rgba(245,217,126,.22),0 0 24px rgba(222,181,73,.38),0 5px 16px #000}
.return-desk{right:2.7%;top:2.2%;width:11%;height:7.8%;border-radius:.7cqw .7cqw .2cqw .2cqw;font:700 .82cqw/1.05 Georgia,serif;letter-spacing:.04em}
.contents-tab{right:1.45%;top:32%;width:4.5%;height:35%;border-radius:0 .55cqw .55cqw 0;writing-mode:vertical-rl;text-orientation:mixed;font:700 .88cqw Georgia,serif;letter-spacing:.12em;background:linear-gradient(90deg,#0b281c,#174530,#0b281c)}
.section-frame.has-baked-tabs .section-return,.section-frame.has-baked-tabs .contents-tab{display:none}

/* Exact invisible interaction geometry, independent from visible photo highlights. */
.native-hit{position:absolute;z-index:32;cursor:pointer;background:transparent;border:0;box-shadow:none;outline:none;padding:0}
.native-hit:focus-visible{outline:1px solid rgba(235,202,105,.10);outline-offset:2px}
.bloodline-seal{z-index:36}
.family-unlock-hint{position:absolute;z-index:18;left:55.1%;bottom:18.5%;width:34.8%;text-align:center;color:#6b512b;text-shadow:0 1px rgba(255,255,255,.32);font:700 .70cqw/1.05 Georgia,serif;letter-spacing:.050em;text-transform:uppercase;pointer-events:none}

.powers-controls{position:absolute;inset:0;z-index:31;pointer-events:none}
.powers-controls button{position:absolute;pointer-events:auto;background:transparent;border:0;border-radius:50%;cursor:pointer;outline:none;padding:0}
.powers-controls button:focus-visible{outline:1px solid rgba(105,196,255,.12);outline-offset:3px}

/* Primary open Dossier text remains live and unchanged in visual character. */
.text-plane{position:absolute;z-index:12;color:#352513;font-family:Baskerville,"Times New Roman",Times,serif;text-rendering:optimizeLegibility}
.dossier-page{top:18.2%;width:30.2%;height:64%;font-size:clamp(16px,1.35cqw,23px);line-height:1.35}
.dossier-left{left:16.1%}.dossier-right{left:53.3%}
.dossier-page h1{margin:0 0 .48em;font-family:"Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;font-size:clamp(30px,2.25cqw,46px);line-height:.98;letter-spacing:.025em;text-transform:uppercase;font-weight:700;color:#3b2815}
.dossier-page .text-body p{margin:0 0 .42em;line-height:1.30;text-indent:1.15em}
.dossier-page .text-body p:first-child{text-indent:0}

/* Bloodline opens immediately as a restricted two-column record. */
.restricted-overlay{position:absolute;z-index:22;color:#f1dfbd;overflow:hidden}
.restricted-overlay.bloodline-open{left:6.7%;top:9.6%;width:86.6%;height:79.4%;padding:1.35cqw 2.05cqw 1.45cqw;background:linear-gradient(135deg,rgba(29,8,12,.975),rgba(58,14,21,.965));border:1px solid rgba(197,126,92,.72);box-shadow:0 1.4cqw 3cqw rgba(0,0,0,.72),inset 0 0 0 2px rgba(214,161,83,.16);display:flex;flex-direction:column}
.restricted-overlay.bloodline-open .warning-band{font:700 .84cqw Georgia,serif;letter-spacing:.08em;text-transform:uppercase;text-align:center;color:#e5b3aa;margin:0 0 .32cqw}
.restricted-overlay.bloodline-open h1{font:700 1.92cqw/1 "Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;letter-spacing:.035em;text-transform:uppercase;text-align:center;color:#f1d29a;margin:0 0 .58cqw}
.restricted-overlay.bloodline-open .bloodline-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.7cqw;min-height:0;flex:1}
.restricted-overlay.bloodline-open .bloodline-column{min-width:0;min-height:0;overflow:hidden}
.restricted-overlay.bloodline-open .bloodline-column+.bloodline-column{border-left:1px solid rgba(213,168,96,.20);padding-left:1.5cqw}
.restricted-overlay.bloodline-open p{margin:0 0 .50em;font:400 var(--bloodline-font,18px)/1.27 "EB Garamond",Georgia,serif;text-indent:1.16em;color:#ead7b6}
.reseal-control{position:absolute;z-index:37;right:8.0%;bottom:8.1%;padding:.48cqw .9cqw;border:1px solid #aa7454;background:#2b0d12;color:#ebca94;letter-spacing:.08em;font:700 .72cqw Georgia,serif;cursor:pointer;box-shadow:0 0 16px rgba(131,30,39,.35)}
.reseal-control:hover,.reseal-control:focus-visible{filter:brightness(1.25);outline:none;box-shadow:0 0 23px rgba(182,55,62,.46)}

/* Compact screens keep the complete artwork visible. */
@media (max-width:980px),(max-aspect-ratio:1.12){
  .asset-frame{width:99vw;max-height:96vh}
  .hub-contents{padding:2.1cqw 1.8cqw}
  .contents-entry{min-height:5.3cqw}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
}


/* V121 full-site integration: physical bedroom return on the Dossier desk. */
.bedroom-return{
  position:absolute;z-index:25;right:1.8%;top:2.1%;min-width:8.7%;height:6.8%;
  border:1px solid #9e7b38;border-radius:.55cqw;background:linear-gradient(145deg,#2a1b10,#100c08 72%);
  color:#edcf76;box-shadow:inset 0 0 0 2px rgba(231,195,93,.11),0 6px 18px rgba(0,0,0,.48);
  text-shadow:0 1px #000;font:700 .82cqw/1 Georgia,serif;letter-spacing:.085em;cursor:pointer;
  transition:filter .16s ease,box-shadow .16s ease,transform .16s ease
}
.bedroom-return:hover,.bedroom-return:focus-visible{
  filter:brightness(1.24);box-shadow:inset 0 0 0 2px rgba(245,217,126,.20),0 0 24px rgba(222,181,73,.38),0 6px 18px #000;
  transform:translateY(-.08cqw);outline:none
}
@media(max-width:760px){.bedroom-return{right:1.2%;top:1.5%;min-width:13%;height:8.2%;font-size:1.35cqw}}
