:root{--master-w:1024;--master-h:1536;--scene-scale:1}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#020a13;color:#f4f0e8;font-family:Georgia,'Times New Roman',serif}
button,select,input,dialog{font-family:inherit}
.screen[hidden]{display:none!important}
.screen{position:fixed;inset:0;overflow:hidden;background:#020a13 url('assets/background/master_background.png') center center/cover no-repeat}
.bio-scene,.mirror-scene,.interpret-scene{position:absolute;left:50%;top:50%;width:1024px;height:1536px;transform:translate(-50%,-50%) scale(var(--scene-scale));transform-origin:center center;overflow:hidden;background:transparent}
.scene-back{position:absolute;left:28px;top:26px;z-index:80;border:1px solid rgba(255,255,255,.78);background:rgba(2,10,19,.76);color:#fff;padding:10px 18px;font-size:18px;cursor:pointer}
.scene-back:hover{background:rgba(15,28,42,.94)}

/* LEVEL 1 */
.bio-scene{text-align:center}
.bio-scene h1{position:absolute;left:0;top:108px;width:100%;margin:0;font-size:64px;font-weight:400;letter-spacing:2px;text-shadow:0 2px 5px #000}
.lang{position:absolute;right:92px;top:42px;width:190px;background:#07111d;color:#fff;border:1px solid #aaa;border-radius:10px;padding:13px 18px;font-size:20px;z-index:15}
.orn{position:absolute;left:0;top:184px;width:100%;font-size:28px}
.bio-scene h2{position:absolute;left:0;width:100%;font-weight:400;font-size:29px;margin:0}
.bio-scene h2[data-i="dob"]{top:266px}.bio-scene h2[data-i="gender"]{top:512px}
.selectors{position:absolute;top:322px;left:128px;right:128px;display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.selectors label{display:grid;gap:12px;font-size:21px}.selectors select{width:100%;padding:15px 16px;background:#07111d;color:#fff;border:1px solid #bbb;border-radius:10px;font-size:21px}
.sex{position:absolute;left:0;top:572px;width:100%;display:flex;justify-content:center;gap:84px;font-size:24px}.sex input{width:20px;height:20px}
.primary{position:absolute;left:218px;top:682px;width:588px;padding:18px 28px;background:rgba(35,42,52,.58);color:#7d8490;border:1px solid #65707c;border-radius:10px;font-size:30px;cursor:not-allowed;opacity:.5;transition:.15s}
.primary.active{background:rgba(8,18,30,.96);color:#fff;border-color:#fff;box-shadow:0 0 18px rgba(255,255,255,.28);cursor:pointer;opacity:1}
.privacy{position:absolute;left:250px;right:250px;bottom:86px;font-size:16px;line-height:1.35;text-align:center}.privacy>p{margin:8px 0}.linkbtn{border:0;border-bottom:1px solid currentColor;background:none;color:#fff;font:inherit;cursor:pointer;padding:0}

/* LEVEL 2 — MASTER Scene #2 v2. Background is viewport layer; all interactive scene elements share one transform. */
.mirror-title{position:absolute;top:55px;left:0;width:100%;margin:0;text-align:center;font-size:60px;font-weight:400;letter-spacing:1px;text-shadow:0 2px 5px #000;z-index:20}
.mirror-subtitle{position:absolute;top:132px;left:0;width:100%;margin:0;text-align:center;font-size:24px;font-weight:400;z-index:20}
/* whole figures composition intentionally lower; divider below bases of central columns */
.figure-row{position:absolute;left:54px;right:54px;top:370px;height:560px;display:grid;grid-template-columns:repeat(5,1fr);gap:18px;align-items:end;z-index:8}
.figure-slot{height:100%;min-width:0;border:0;background:none;color:#fff;padding:0;display:flex;align-items:flex-end;justify-content:center;overflow:visible}
.shadow-figure{cursor:pointer;z-index:4}.self-slot{z-index:12}.figure-box{height:100%;width:100%;display:flex;align-items:flex-end;justify-content:center;overflow:visible}
.figure-box img{display:block;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 7px 9px rgba(0,0,0,.85))}
/* +50% larger visual base than prior build. Nominal multiplier remains 0.5/1/1.5. */
.shadow-figure .figure-box img{height:calc(340px * var(--shadow-scale));max-height:520px;width:auto;max-width:98%;object-fit:contain;object-position:center bottom;transform:none}
.self-slot .figure-box img{height:500px;max-height:520px;width:auto;max-width:98%;object-fit:contain;object-position:center bottom}
.empty-slot{font-size:15px;align-items:center}.mirror-rule{position:absolute;left:54px;right:54px;top:950px;border-top:2px solid rgba(240,240,240,.72);z-index:7}
.tarot-layer{position:absolute;left:54px;right:54px;top:978px;height:430px;display:grid;grid-template-columns:repeat(5,1fr);gap:18px;align-items:start;z-index:9}
.tarot-slot{border:0;background:none;color:#fff;padding:0;cursor:pointer;min-width:0;height:100%;display:flex;flex-direction:column;align-items:center}
.role-label{height:42px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:bold;text-shadow:0 2px 4px #000;white-space:nowrap}.role-spacer{visibility:hidden}
.tarot-card-frame{width:145px;height:246px;display:flex;align-items:center;justify-content:center;overflow:hidden}.tarot-card-frame img{width:100%;height:100%;object-fit:contain;display:block}
.self-tile{border:0;background:transparent;padding:0}.self-tile img{width:100%;height:100%;object-fit:contain;object-position:center center;display:block}
.empty-tarot .tarot-card-frame{border:1px solid rgba(255,255,255,.35);font-size:14px;line-height:1.2;padding:12px;text-align:center}
.tarot-slot:focus-visible,.shadow-figure:focus-visible{outline:1px solid #fff;outline-offset:2px}

/* LEVEL 3 — all UI in one MASTER container */
.interpret-scene{padding:92px 92px 52px}
.interpret-scene>h1{font-size:58px;font-weight:400;margin:0 0 28px;text-align:center}
.interpretbox{height:520px;display:grid;grid-template-columns:31% 69%;gap:20px;border:1px solid #aaa;padding:20px;background:rgba(3,12,22,.62)}
.tarot-panel,.definition-panel{border:1px solid #999;padding:22px;overflow:hidden}.tarot-panel{display:flex;flex-direction:column;align-items:center;justify-content:center}.tarot-panel img{max-height:405px;max-width:94%;object-fit:contain}.tarot-panel b{font-size:16px}
.definition-panel{display:block}.semantic{text-align:center;font-size:22px;font-weight:700;margin:46px 0 10px}.definition-panel h2{text-align:center;font-size:24px;margin:52px 0 28px}.definition-panel .semantic:not([hidden])+h2{margin-top:8px}.definition-panel p{text-align:left;font-size:20px;line-height:1.48;margin:0 18px 18px;max-height:330px;overflow-y:auto;overflow-x:hidden;padding-right:8px}
.future{height:595px;margin-top:28px;border:1px solid #777;padding:24px;background:rgba(3,12,22,.82);overflow:hidden}.future h2{font-weight:400;font-size:24px;margin:2px 0 6px;text-align:center}.future h3{font-size:18px;margin:8px 0 14px;text-align:center}
.future-table{border-top:1px solid #445}.frow{display:grid;grid-template-columns:190px 1fr;min-height:74px;text-align:left;border-bottom:1px solid #445;font-size:17px;align-items:stretch}.frow>b{display:flex;align-items:center;padding:12px 14px}.frow>span:last-child{display:flex;align-items:center;padding:12px 18px;border-left:1px solid #586474}
.future button{display:block;margin:22px auto 0;padding:15px 34px;background:#101927;color:#ddd;border:1px solid #777;font-size:17px}

/* dialogs — same family as all levels */
dialog{max-width:min(700px,88vw);background:#07111d;color:#eee;border:1px solid #aaa;padding:28px;font:18px/1.5 Georgia,'Times New Roman',serif;box-shadow:0 20px 60px #000}dialog::backdrop{background:rgba(0,0,0,.68)}dialog button{padding:10px 22px;background:#101927;color:#fff;border:1px solid #aaa;cursor:pointer}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}

/* BUILD 08 — custom scaled selectors. Native browser popups ignore transformed scene scale, so the BIO/language controls use an in-scene listbox. */
.native-select-hidden{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important;overflow:hidden!important}
.selectors label{position:relative}
.custom-select{position:relative;width:100%;z-index:40}
.custom-select-button{width:100%;min-height:56px;padding:12px 16px;background:#07111d;color:#fff;border:1px solid #bbb;border-radius:10px;font:21px/1.15 Georgia,'Times New Roman',serif;text-align:left;cursor:pointer;display:flex;align-items:center;justify-content:space-between}
.custom-select-button::after{content:'⌄';font-size:20px;margin-left:12px}
.custom-select-list{position:absolute;left:0;top:calc(100% + 5px);width:100%;max-height:310px;overflow-y:auto;overflow-x:hidden;background:#07111d;border:1px solid #aaa;border-radius:8px;box-shadow:0 14px 36px rgba(0,0,0,.55);z-index:200;padding:4px}
.custom-option{display:block;width:100%;border:0;background:transparent;color:#fff;text-align:left;padding:8px 10px;font:18px/1.15 Georgia,'Times New Roman',serif;cursor:pointer;border-radius:4px}
.custom-option:hover,.custom-option[aria-selected="true"]{background:rgba(255,255,255,.18)}
.custom-select.open{z-index:250}
.lang.native-select-hidden + .custom-select{position:absolute;right:72px;top:48px;width:190px;z-index:300}
.lang.native-select-hidden + .custom-select .custom-select-button{min-height:54px;font-size:19px}
.lang.native-select-hidden + .custom-select .custom-option{font-size:18px}

/* Keep the approved Level 1 title clear of the language control. */
.bio-scene h1{top:122px}
.orn{top:198px}
.bio-scene h2[data-i="dob"]{top:278px}
.selectors{top:336px}
.bio-scene h2[data-i="gender"]{top:526px}
.sex{top:586px}
.primary{top:696px}

/* Figure assets must always show the full available PNG; never crop by cover. */
.figure-box img,.tarot-card-frame img,.tarot-panel img{object-fit:contain!important;object-position:center bottom!important}

/* BUILD 10 — targeted Level #2 geometry patch only. */
.figure-row{top:350px;height:585px;align-items:end}
.figure-slot,.figure-box{overflow:visible}
.figure-box img{object-fit:contain!important;object-position:center bottom!important}
.self-slot .figure-box img{
  height:auto!important;
  max-height:555px!important;
  width:auto!important;
  max-width:96%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
}
.shadow-figure .figure-box img{
  width:auto!important;
  max-width:98%!important;
  object-fit:contain!important;
  object-position:center bottom!important;
}
/* Normalize 100% Shadow base first, then apply nominal 50/100/150. */
.shadow-figure .figure-box img{height:calc(330px * var(--shadow-scale))!important;max-height:560px!important}
.mirror-rule{top:958px}
.tarot-layer{top:986px}
.tarot-card-frame{width:145px;height:246px}
.self-tile img{width:145px!important;height:246px!important;object-fit:fill!important}