:root{color-scheme:dark;--ink:#ecdfc8;--muted:#baaa90;--gold:#c9a84c;--line:#c9a84c44;--dark:#100c08;font-family:Georgia,'Songti SC','STSong','SimSun',serif;color:var(--ink);background:var(--dark)}
*{box-sizing:border-box}body{margin:0}button,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid #ecd495;outline-offset:5px}button{transition:background .2s,color .2s,opacity .2s,transform .2s}button:active{transform:translateY(1px)}[hidden]{display:none!important}#experience{position:relative;height:100svh;min-height:640px;isolation:isolate;overflow:hidden;background:#0c0906}.room-art{position:absolute;inset:0;background:url('assets/empty-sanctuary.jpg') center 43% / cover no-repeat;transform:scale(1.035);will-change:transform;z-index:-3}.room-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,6,4,.7),transparent 42%,transparent 70%,rgba(8,6,4,.22)),linear-gradient(0deg,#0c0906,transparent 44%);z-index:-2}#scene{position:absolute;inset:0;width:100%;height:100%;touch-action:none;outline:none;z-index:-1}.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 47%,transparent 35%,rgba(7,5,3,.35) 79%,#080604b3 100%),linear-gradient(0deg,#080604 0%,#080604dd 6%,transparent 28%,transparent 84%,#08060499 100%)}.frame{position:absolute;inset:19px;border:1px solid #c9a84c27;pointer-events:none}.frame:before,.frame:after{content:'';position:absolute;width:40px;height:40px;border:1px solid #c9a84c99}.frame:before{top:-1px;left:-1px;border-right:0;border-bottom:0}.frame:after{bottom:-1px;right:-1px;border-left:0;border-top:0}header{position:absolute;top:42px;left:4.2%;right:4.2%;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:var(--ink);font-size:21px;letter-spacing:.18em}.brand-symbol{font-size:43px;color:#dcc37c;line-height:1;transform:rotate(-20deg)}.brand small{display:block;font-family:Georgia,serif;font-size:9px;letter-spacing:.25em;margin-top:7px;color:#c4b18c}.header-actions{display:flex;align-items:center;gap:25px}.quiet{border:0;background:transparent;color:#ddcbb0;font-size:13px;letter-spacing:.12em;padding:12px 4px}.quiet:hover{color:#ffe5a1}.quiet span{margin-left:5px}.circle{background:#130e0880;color:#ddcbb0;border:1px solid var(--line);height:34px;width:34px;border-radius:50%;font-style:italic}.intro{position:absolute;top:25.5%;left:7%;pointer-events:none}.eyebrow{font-size:10px;letter-spacing:.25em;color:#c4ae78;margin:0 0 21px}.intro h1{font-size:clamp(26px,2.5vw,40px);font-weight:400;letter-spacing:.12em;margin:0 0 23px;line-height:1.4}.intro-note{color:#c6b7a1;font-size:15px;line-height:2;letter-spacing:.13em;margin:0}.intro-rule{width:36px;height:1px;background:#b79a5c66;margin:28px 0 22px}.invitation{max-width:136px;line-height:1.8;font-size:12px;color:#b3a187;letter-spacing:.09em}.table-note{position:absolute;right:7%;top:40%;color:#c4b18d;font-size:12px;line-height:2.1;letter-spacing:.21em;display:flex;gap:18px;align-items:center}.note-rule{height:52px;width:1px;background:linear-gradient(transparent,#c9a84c,transparent)}.ritual-ui{position:absolute;bottom:37px;left:50%;transform:translateX(-50%);width:min(710px,85%);text-align:center}.status{font-size:14px;letter-spacing:.12em;color:#e1cfb0;text-shadow:0 2px 10px #000;margin:0 0 23px;min-height:20px}.ritual-controls{display:flex;align-items:center;justify-content:center;gap:23px}.spread-label{position:relative}.spread-label:after{content:'⌄';position:absolute;right:9px;top:10px;color:#c4ae78;pointer-events:none}select{appearance:none;border:0;border-bottom:1px solid #c9a84c4d;background:#0d0a0670;border-radius:0;color:#c8b79a;padding:13px 27px 13px 4px;font-size:12px;max-width:235px}option{background:#17100a}.gold-button{min-height:47px;border:1px solid #c7a960;background:linear-gradient(115deg,#d7bc7d,#b59656);color:#231b0f;padding:12px 28px;font-size:14px;letter-spacing:.12em;white-space:nowrap;box-shadow:0 2px 20px #d9ae3520}.gold-button:hover{background:#e0c98e}.gold-button span{margin-left:20px}.bottom-line{display:flex;justify-content:space-between;margin-top:24px;font-size:10px;letter-spacing:.11em;color:#a08e73}.gesture-note{color:#aa987d}.card-hint{position:fixed;pointer-events:none;padding:9px 13px;background:#1a120ee8;border:1px solid #b39a5e77;color:#e0c78c;font-size:12px;z-index:3}.result-tray{position:absolute;inset:15% auto auto 50%;transform:translateX(-50%);width:min(660px,88%);text-align:center;background:linear-gradient(155deg,#261c13f5,#0d0b08fa);border:1px solid #c9a84c77;padding:40px 38px 25px;box-shadow:0 30px 150px #000;z-index:5;max-height:80svh;overflow:auto;backdrop-filter:blur(16px)}.result-tray h2,dialog h2{font-weight:400;font-size:27px;letter-spacing:.15em;margin:0 0 27px}.result-tray .eyebrow{margin-bottom:12px}.close{position:absolute;top:12px;right:15px;background:none;border:0;color:var(--muted);font-size:26px;line-height:1;min-width:36px;min-height:36px}.result-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.result-card{margin:0;min-width:0}.result-card img{display:block;width:100%;aspect-ratio:300/527;object-fit:cover;border:3px solid #bca46c;border-radius:5px;box-shadow:0 8px 25px #0008}.result-card img.reversed{transform:rotate(180deg)}.result-card .position{font-size:12px;min-height:30px;color:#bba373}.result-card figcaption{font-size:16px;margin:14px 0 7px}.result-card small{color:#c6b395;font-size:11px}.result-tray .result-note{font-size:13px;line-height:1.9;color:#c2b29c;margin:24px 0 18px}.result-tray>small{display:block;font-size:10px;color:#a99a82;margin-top:19px}.result-tray .gold-button{font-size:12px}.result-tray .image-error{min-height:180px;display:grid;place-items:center;border:1px solid #bca46c;color:#dbc89d}dialog{border:1px solid #c9a84c77;background:#17110bf5;color:var(--ink);max-width:430px;width:88%;padding:36px;box-shadow:0 30px 120px #000}dialog::backdrop{background:#0009;backdrop-filter:blur(8px)}dialog p{color:#c1b39e;font-size:15px;line-height:1.9}dialog .gold-button{width:100%;margin-top:15px}.guide-moon{font-size:44px;color:#c9a84c}dialog h2{font-size:23px;margin-top:17px}.fatal,#loader{position:absolute;inset:0;background:#0c0906f0;z-index:8;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:24px}.fatal p{max-width:340px;line-height:1.8}.loader-moon{font-size:60px;color:#c9a84c;animation:breathe 2s ease-in-out infinite alternate}#loader p{letter-spacing:.2em;color:#c4b18d;font-size:14px}#loader{transition:opacity .8s}.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}@keyframes breathe{to{opacity:.4;transform:rotate(15deg)}}
@media(min-width:1600px){.intro{left:10%}.table-note{right:10%}}
@media(max-width:900px){.intro{left:6%;top:22%}.intro h1{font-size:27px}.intro-note{font-size:13px}.table-note{display:none}.intro-rule,.invitation{display:none}.ritual-controls{gap:15px}.gold-button{padding:12px 20px}.header-actions{gap:14px}}
@media(max-width:600px){#experience{min-height:600px}.room-art{background-size:auto 78%;background-position:center top}.room-shade{background:linear-gradient(0deg,#0c0906 12%,transparent 53%),linear-gradient(90deg,#08060455,transparent 35%,transparent 70%,#08060455)}.frame{inset:10px}header{top:27px;left:24px;right:24px}.brand{font-size:16px;gap:8px}.brand-symbol{font-size:33px}.brand small{font-size:7px;margin-top:5px}.header-actions{gap:12px}.quiet{font-size:12px}.circle{width:28px;height:28px}.intro{top:13.5%;left:26px}.eyebrow{font-size:8px;letter-spacing:.17em;margin-bottom:10px}.intro h1{font-size:22px;max-width:120px;line-height:1.65;margin-bottom:12px}.intro-note{display:none}.ritual-ui{width:calc(100% - 48px);bottom:max(28px,env(safe-area-inset-bottom))}.status{font-size:12px;letter-spacing:.02em;margin-bottom:14px;line-height:1.7}.ritual-controls{flex-wrap:wrap;gap:10px}.spread-label{flex:1 1 100%}.spread-label:after{right:calc(50% - 120px)}select{font-size:12px;text-align:center;max-width:100%;width:250px;padding-top:8px;padding-bottom:9px}.gold-button{min-height:45px;padding:11px 22px;font-size:13px}.shuffle{padding:12px 7px}.bottom-line{font-size:9px;margin-top:19px}.gesture-note{display:none}.result-tray{inset:12% auto auto 50%;width:90%;padding:35px 18px 22px;max-height:84svh}.result-tray h2{font-size:21px;margin-bottom:20px}.result-cards{gap:10px}.result-card figcaption{font-size:13px}.result-card .position{font-size:10px;min-height:28px}.result-card img{border-width:2px}.result-tray .result-note{font-size:12px}.result-tray>small{font-size:9px}}
@media(max-height:700px) and (min-width:601px){.intro{top:25%}.intro-note,.intro-rule,.invitation{display:none}.ritual-ui{bottom:27px}.status{margin-bottom:12px}.bottom-line{margin-top:12px}.result-tray{top:7%;max-height:88svh}.result-card img{max-height:230px;width:auto;max-width:100%;margin:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.room-art{will-change:auto}}
/* Unified academy scene: restrained controls leave the character and table clear. */
.room-art{background-image:url('assets/academy-room.jpg');transform:none;will-change:auto}
.room-shade,.frame,.table-note,.intro-note,.intro-rule,.invitation{display:none}
.vignette{background:linear-gradient(0deg,#05090fe8,transparent 23%,transparent 85%,#05090f66)}
header{top:30px}.intro{top:16%;left:4.2%}.intro .eyebrow{font-size:9px;color:#b4b5b0;letter-spacing:.2em}.intro h1{font-size:25px;color:#ddd4c3;letter-spacing:.15em}
.ritual-ui{bottom:22px}.status{margin-bottom:15px;font-size:13px}.bottom-line{margin-top:16px}.gold-button{background:linear-gradient(120deg,#c8b07b,#a38a56);box-shadow:0 2px 24px #0006}.gold-button:hover{background:#d6c18e}
@media(max-width:600px){header{top:23px;left:20px;right:20px}.brand{font-size:15px}.intro{top:12%;left:22px}.intro .eyebrow{display:none}.intro h1{font-size:16px;max-width:100px;line-height:1.8}.ritual-ui{bottom:max(22px,env(safe-area-inset-bottom));width:calc(100% - 40px)}.status{font-size:11px}.bottom-line{margin-top:14px}}

/* Drawn faces stay front-facing and fully contained on the table. */
.result-tray{inset:auto auto 88px 50%;width:min(780px,calc(100% - 40px));max-height:none;padding:0;border:0;background:none;box-shadow:none;backdrop-filter:none;overflow:visible;pointer-events:none}
.result-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,2vw,30px);align-items:end}
.result-card{display:flex;flex-direction:column;align-items:center;filter:drop-shadow(0 8px 15px #0009)}
.result-card img{width:auto;height:min(31svh,310px);max-width:100%;aspect-ratio:300/527;object-fit:contain;border:0;border-radius:2px;box-shadow:none}
.result-card .position{min-height:0;margin:0 0 7px;color:#eed9a4;font-size:12px;text-shadow:0 2px 5px #000}
.result-card figcaption{margin:9px 0 3px;font-size:15px;text-shadow:0 2px 5px #000}
.result-card small{font-size:11px;color:#d3c2a4;text-shadow:0 2px 5px #000}
@media(max-width:600px){.result-tray{bottom:94px;width:calc(100% - 30px)}.result-cards{gap:10px}.result-card img{height:min(29svh,calc((100vw - 50px)/3 * 1.7567));max-height:none}.result-card figcaption{font-size:12px;margin-top:7px}.result-card .position,.result-card small{font-size:10px}}
@media(max-height:700px) and (min-width:601px){.result-tray{top:auto;bottom:83px}.result-card img{height:30svh;max-height:none}.result-card .position{margin-bottom:4px}.result-card figcaption{font-size:13px;margin-top:5px}}
/* A writing ritual on the wooden table, without a form panel. */
.ritual-ui{width:min(630px,calc(100% - 40px));bottom:max(20px,env(safe-area-inset-bottom));z-index:6;translate:0 calc(-1 * var(--keyboard-rise,0px))}
.question-float{position:relative;isolation:isolate;text-align:left;margin:0 0 13px;padding:24px 43px 22px 57px;border:0;background:none;box-shadow:none;backdrop-filter:none}
.question-float::before{content:"";position:absolute;z-index:-1;inset:0 -20px -5px;border-radius:50%;background:radial-gradient(ellipse,#080a0cc4,transparent 72%);pointer-events:none}
.question-float::after{content:"";position:absolute;z-index:-1;left:15%;right:15%;bottom:1px;height:36px;background:radial-gradient(ellipse,#dfb46924,transparent 68%);opacity:.35;transition:opacity .35s;pointer-events:none}
.question-float:focus-within::after{opacity:1}
.question-caption{position:absolute;top:-3px;right:32px}.question-caption button{color:#d6c49e;border:0;background:none;padding:4px 7px;min-height:30px;font-size:11px;letter-spacing:.1em;text-shadow:0 2px 4px #000}
.question-quill{position:absolute;left:8px;top:20px;width:32px;height:50px;cursor:text;color:#cbb486;opacity:.85;transform:rotate(9deg);transition:color .3s,transform .3s}
.question-quill svg{width:100%;height:100%;stroke:currentColor;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 3px #000)}
.question-float:focus-within .question-quill{color:#f4d6a0;transform:rotate(0deg)}
#tableQuestion{display:block;width:100%;height:66px;resize:none;overflow-y:auto;padding:4px 0 0;border:0;outline:none;background:none;color:#f3dfb8;caret-color:#f3d398;font:22px/1.45 'Tarot Handwriting','Kaiti SC','STKaiti','KaiTi',serif;letter-spacing:.04em;text-align:center;text-shadow:0 2px 5px #000,0 0 18px #0009;scrollbar-width:thin;scrollbar-color:#b7a78550 transparent}
#tableQuestion{font-family:'Tarot Explora','Tarot Fine Ink','Tarot Handwriting',cursive;font-weight:300;font-style:normal;font-synthesis:none;font-size:25px;letter-spacing:.065em;text-shadow:0 1px 6px #0009;animation:ink-drift 7s ease-in-out infinite alternate}
#tableQuestion:focus{animation-play-state:paused}
@keyframes ink-drift{from{translate:-5px 2px}to{translate:5px -3px}}
@media(prefers-reduced-motion:reduce){#tableQuestion{animation:none}}
#tableQuestion::placeholder{color:#e0cba7;opacity:1}#tableQuestion:read-only{color:#d3c3a9}
.question-stroke{position:absolute;bottom:3px;left:1%;width:98%;height:24px;overflow:visible;pointer-events:none;filter:drop-shadow(0 1px 4px #c9a34f30)}
.ink-line,.ink-edge{fill:none;stroke:#cdb181;stroke-width:.7;opacity:.6;transition:opacity .3s}.ink-sigil{fill:#151510;stroke:#ddbf85;stroke-width:.8;opacity:.9}.question-float:focus-within .ink-line{opacity:1}
.ritual-controls{gap:26px}.ritual-controls .gold-button{border:0;border-radius:0;background:none;box-shadow:none;color:#e0c594;padding:9px 12px;min-height:44px;font-size:14px;letter-spacing:.14em;text-shadow:0 2px 6px #000}
.ritual-controls .gold-button:hover{color:#fff0c9;background:none}.ritual-controls .gold-button span{margin-left:17px}.ritual-controls .shuffle{color:#b3a68e;font-size:12px}.ritual-controls .shuffle:hover{color:#e0c594}
.result-tray{bottom:210px}.result-card img{height:min(27svh,265px)}
@media(max-width:600px){.ritual-ui{width:calc(100% - 28px);bottom:max(16px,env(safe-area-inset-bottom))}.question-float{padding:22px 10px 22px 36px;margin-bottom:10px}.question-quill{left:2px;top:22px;width:23px;height:40px}.question-caption{right:12px;top:-4px}#tableQuestion{font-size:18px;height:60px;line-height:1.6;letter-spacing:.015em}.question-stroke{height:20px}.ritual-controls{flex-wrap:nowrap;gap:17px}.ritual-controls .gold-button{padding:9px 7px;font-size:13px;letter-spacing:.08em}.ritual-controls .shuffle{font-size:11px}.result-tray{bottom:202px;width:calc(100% - 36px)}.result-card img{height:min(23svh,calc((100vw - 56px)/3 * 1.7567))}}
@media(max-height:700px){.question-float{padding-top:15px;padding-bottom:19px}#tableQuestion{height:50px;line-height:1.4}.question-quill{top:15px}.result-tray{bottom:188px}.result-card img{height:22svh}}
@media(max-width:600px) and (max-height:620px){#experience{min-height:100svh}.ritual-ui{bottom:max(10px,env(safe-area-inset-bottom))}.question-float{margin-bottom:5px}.result-tray{bottom:174px}.result-card img{height:18svh}}
.brand-name{font:13px/1.4 Georgia,serif;letter-spacing:.25em;color:#d9c599}
.ritual-controls .gold-button,.ritual-controls .shuffle{font-family:'Tarot Explora','Tarot Fine Ink','Tarot Handwriting',cursive;font-size:18px;font-weight:300;font-synthesis:none;letter-spacing:.08em;text-shadow:0 1px 5px #0009}
@media(max-width:600px){#tableQuestion{font-size:21px;letter-spacing:.015em}.ritual-controls .gold-button,.ritual-controls .shuffle{font-size:16px}}
#sound{display:grid;place-items:center;width:44px;height:44px;padding:10px}
#sound svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
#sound .sound-on,#sound[aria-pressed="true"] .sound-off{display:none}
#sound[aria-pressed="true"] .sound-on{display:block}
@media(max-width:600px){.brand-name{font-size:10px;letter-spacing:.18em}.header-actions{gap:7px}.brand-symbol{font-size:30px}}
.site-beian{position:fixed;left:0;right:0;bottom:max(8px,env(safe-area-inset-bottom));z-index:6;margin:0;text-align:center;pointer-events:none}
.site-beian a{pointer-events:auto;color:#a08e73cc;font-size:11px;letter-spacing:.08em;text-decoration:none}
.site-beian a:hover{color:#c4b18d}
