@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700&family=Noto+Serif+KR:wght@600&display=swap');
:root{color-scheme:dark;--bg:#141211;--gold:#d5b78b;--ink:#f4ede4;--muted:#b0a397}
*{box-sizing:border-box}
body{margin:0;background:#22201e;color:var(--ink);font-family:'Noto Sans KR',sans-serif;-webkit-font-smoothing:antialiased}
button{font:inherit;cursor:pointer}button:focus-visible{outline:2px solid white;outline-offset:4px}[hidden]{display:none!important}
.page{max-width:480px;min-height:100vh;min-height:100dvh;margin:auto;background:#000;position:relative;overflow:hidden}
.hero,.hero-stage{position:relative}
.media{width:100%;aspect-ratio:9/16;position:relative;overflow:hidden;background:var(--bg);isolation:isolate}
.portrait{position:absolute;inset:0;overflow:hidden}
.portrait img{position:absolute;width:230%;max-width:none;height:auto;left:-10%;top:-5%}
video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:var(--bg);z-index:0}
.shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(15,12,11,.46) 0%,transparent 22%,transparent 44%,rgba(20,18,17,.5) 65%,#141211 100%)}
.header{position:absolute;top:0;left:0;right:0;z-index:3;padding:22px 23px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.brand{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;text-shadow:0 1px 5px #0008}
.seal{display:grid;place-items:center;border:1px solid #d5b78b9c;width:25px;height:29px;font:18px 'Noto Sans KR',sans-serif;color:#f0d8b6}
.sound{background:#17131080;color:white;border:1px solid #ffffff40;padding:8px 10px;border-radius:30px;font-size:12px}
.hero-copy{position:absolute;left:12px;right:12px;bottom:3%;z-index:2;text-align:center}
h1{margin:0;line-height:1}
.title-logo{display:block;width:100%;height:auto;filter:drop-shadow(0 3px 12px #0008)}
/* Copy shares the same continuous surface; no independent panel or backdrop. */
.cta-dock{position:relative;z-index:4;margin-top:-28px;padding:0 16px max(24px,env(safe-area-inset-bottom));background:linear-gradient(var(--bg),#000)}
.landing-note{margin:0 0 16px;font-size:14px;line-height:1.8;letter-spacing:-.035em;text-align:center;color:#c8bcb0}
.landing-note strong{font-weight:600;color:#e4cfaf}
.landing-note-end{display:block;margin-top:10px;color:#eee3d5}
.primary{width:100%;min-height:46px;border:1px solid #f0d6ac66;border-radius:10px;background:linear-gradient(115deg,#d7b58b,#eed6b4 55%,#cba375);color:#322316;font-size:14px;letter-spacing:-.045em;font-weight:700;box-shadow:0 4px 25px #0004;display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 12px}
.primary:hover{filter:brightness(1.05)}.primary span{font-size:20px;font-weight:400}
.eyebrow{font-size:12px;letter-spacing:.13em;color:var(--gold);margin:0 0 16px}
dialog{width:min(calc(100% - 36px),420px);border:1px solid #6c523b;background:#1c1713;color:var(--ink);border-radius:18px;padding:42px 26px 26px;box-shadow:0 20px 90px #0008}
dialog::backdrop{background:#000b;backdrop-filter:blur(7px)}
dialog h2{font-family:'Noto Sans KR',sans-serif;font-size:24px;line-height:1.8;margin:0}
dialog>p:not(.eyebrow){font-size:15px;line-height:1.9;color:var(--muted);margin:18px 0 28px}
.close{position:absolute;right:12px;top:8px;border:0;background:transparent;color:#c7b8a6;font-size:28px;width:40px;height:40px}
body.modal-open{overflow:hidden}
@media(max-width:360px){.primary{font-size:13px}.header{padding-inline:16px}}
@media(min-width:600px){.page{box-shadow:0 0 80px #0005}}

.items-line{white-space:nowrap;font-size:clamp(11px,3.5vw,14px);letter-spacing:-.05em}

.landing-note .note-title{font-size:16px;font-weight:700;color:#f4ede4}
.landing-note .note-keyword{color:#e3bd83;font-weight:600}
.landing-note .note-ending{color:#eee3d5;font-weight:700}

.scene-status{font-size:12px;line-height:1.7;text-align:center;color:#b0a397;margin:12px 0 0}
.primary:disabled{cursor:wait;opacity:.7}
.next-scene{position:relative;max-width:480px;min-height:100svh;margin:auto;background:var(--bg);outline:none}
.next-scene video{position:absolute;inset:0 0 auto;display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain}
.scene-back{position:absolute;z-index:2;left:16px;top:20px;width:40px;height:40px;border:1px solid #ffffff40;border-radius:50%;background:#17131080;color:white;font-size:22px}
.scene-sound{position:absolute;z-index:4;right:16px;top:20px}
.scene-play{position:absolute;z-index:2;top:45%;left:50%;transform:translate(-50%,-50%);padding:14px 22px;border:1px solid #d5b78b;border-radius:10px;color:#f4ede4;background:#141211cc}

/* Render the short tagline as real text to preserve exact Korean spelling. */
.logo-lockup{position:relative}
.logo-lockup .title-logo{clip-path:inset(27% 0 0 0)}
.logo-tagline{position:absolute;z-index:1;top:17%;left:0;right:0;font-family:'Noto Sans KR',sans-serif;font-size:clamp(13px,3.7vw,18px);font-weight:600;line-height:1.6;letter-spacing:.02em;color:#f4ede4;text-shadow:0 2px 3px #000,0 0 7px #000b}

.next-scene{min-height:max(100dvh,var(--landing-height,100svh));overflow:hidden;container-type:inline-size;background:#000}
.next-scene::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(15,12,11,.46) 0%,transparent 22%,transparent 44%,rgba(0,0,0,.5) 65%,#000 100%)}
.scene-header{justify-content:flex-start;gap:9px}
.scene-header .scene-back{position:static;display:grid;place-items:center;flex:0 0 25px;width:25px;height:29px;padding:0;border:0;border-radius:0;background:transparent;color:var(--ink)}
.door-background{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain}
.door-actions{position:absolute;z-index:2;left:16px;right:16px;top:calc(100cqw * 16 / 9 * .86);transform:translateY(-28px)}
.door-actions .scene-status{padding:8px;background:#141211c9;border-radius:6px}

.door-actions .primary{width:100%;min-height:56px;margin-inline:auto;background:linear-gradient(110deg,rgba(255,255,255,.15),rgba(226,237,241,.32) 55%,rgba(255,255,255,.17));color:#fff;border:1px solid rgba(255,255,255,.75);border-radius:16px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:inset 0 1px 12px #ffffff12,0 4px 18px #0002;text-shadow:0 1px 4px #0004;font-size:16px;font-weight:600}
.door-actions .primary:hover{filter:brightness(1.12)}

/* Lower only the closed-door action; preserve the greeting position. */
.door-actions:has(#open-door:not([hidden])){top:calc(100cqw * 16 / 9 + 16px);transform:none}

/* Both choice buttons end at the same baseline as the door button. */
.door-actions:has(#greet-teacher:not([hidden])){top:calc(100cqw * 16 / 9 + 72px);transform:translateY(-100%);display:grid;gap:10px}
/* Conversation intake, isolated from the landing typography and layout. */
#scene-video{transition:filter .5s ease}
.intake-active #scene-video{filter:blur(9px) brightness(.55)}
#intake{width:min(calc(100% - 32px),432px);max-height:calc(100dvh - 32px);margin:auto;padding:24px;border:1px solid #bac7dc35;border-radius:22px;background:linear-gradient(155deg,#202631f5,#10141df5);color:#f2f0ec;box-shadow:0 24px 100px #0009;overflow:auto;animation:intake-in .35s ease}
#intake::backdrop{background:#080c1466;backdrop-filter:blur(3px)}
.intake-top{display:flex;align-items:center;justify-content:space-between;color:#afb9c9;font-size:12px;gap:12px}
.intake-top button{border:0;background:none;color:#dde4ef;width:32px;height:36px;font-size:26px;padding:0}
.intake-top button:disabled{opacity:.2;cursor:default}
.intake-progress{height:3px;background:#ffffff15;border-radius:3px;margin:18px 0 24px;overflow:hidden}
.intake-progress span{display:block;height:100%;background:#d5b78b;transition:width .25s}
#intake-step{font-size:12px;color:#bbaa93;letter-spacing:.04em;margin:0 0 12px}
#intake-title{font:600 clamp(21px,5.5vw,26px)/1.5 'Noto Sans KR',sans-serif;margin:0 0 28px;outline:none;word-break:keep-all}
#intake-fields{min-height:150px}
.intake-label{display:block;font-size:12px;color:#b7c0cd}
.intake-label input{display:block;width:100%;margin-top:9px;border:1px solid #b5c6df40;background:#ffffff07;border-radius:10px;padding:15px 13px;font:500 18px 'Noto Sans KR',sans-serif;color:#fff;outline:none}
.intake-label input:focus{border-color:#d5b78b;background:#ffffff0b}
.intake-label input:disabled{opacity:.35}
.intake-label input::placeholder{color:#788292;font-size:15px}
.intake-choices{display:grid;gap:10px;margin:14px 0}
.intake-choices button{min-height:52px;padding:13px;border:1px solid #b5c6df40;border-radius:10px;background:#ffffff06;color:#e1e6ed;font-size:15px;text-align:left}
.intake-choices button[aria-pressed=true]{border-color:#d5b78b;background:#d5b78b18;color:#f2ddba}
.intake-check{display:flex;align-items:center;gap:10px;font-size:14px;color:#c6cedb;margin:18px 0;min-height:32px}
.intake-check input{width:18px;height:18px;accent-color:#d5b78b}
.intake-hint{color:#aeb9ca;font-size:13px;line-height:1.8;margin:0 0 18px;word-break:keep-all}
.intake-time{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:12px}.intake-time>span{padding-bottom:15px}
#intake-error{min-height:20px;font-size:12px;color:#f4ab9e;margin:18px 0 10px}
#intake-next{min-height:50px;font-size:15px}
.intake-review button{display:grid;grid-template-columns:85px 1fr auto;gap:8px;width:100%;align-items:center;padding:16px 0;border:0;border-bottom:1px solid #ffffff14;background:none;text-align:left;color:#eceef2}
.intake-review span{font-size:12px;color:#aab5c6}.intake-review strong{font-size:13px;font-weight:500;overflow-wrap:anywhere}.intake-review i{font-style:normal;color:#d5b78b;font-size:11px}
@keyframes intake-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#intake{animation:none}#scene-video{transition:none}}
/* Full-scene conversation layer, matching the reference products' bottom form. */
#intake{position:fixed;inset:0;width:min(100%,480px);max-width:480px;height:100dvh;max-height:100dvh;margin:0 auto;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:auto;animation:intake-in .4s ease}
#intake::backdrop{background:rgba(6,9,15,.3);backdrop-filter:none}
#intake-form{position:relative;display:flex;flex-direction:column;min-height:100%;padding:90px 24px max(28px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#080b1310 20%,#080b1340 46%,#080b13db 100%)}
.intake-top{position:absolute;top:18px;left:20px;right:20px}
.intake-top>span{visibility:hidden}
.intake-progress{position:absolute;top:0;left:0;right:0;margin:0;height:2px}
#intake-step{margin-top:auto;padding-top:32px;font-size:11px;color:#c0b5a5}
#intake-title{margin-bottom:20px;font-size:26px;line-height:1.45;text-shadow:0 2px 18px #000b}
#intake-fields{min-height:0}
.intake-label{font-size:12px;color:#b7bfcc}
.intake-label input{border:0;border-bottom:1px solid #ffffff60;border-radius:0;background:transparent;padding:15px 2px;font-size:22px}
.intake-label input:focus{background:transparent;border-bottom-color:#d5b78b}
.intake-label input::placeholder{font-family:'Noto Sans KR',sans-serif;font-size:18px;color:#ffffff55}
.intake-choices button{background:#ffffff18;backdrop-filter:blur(10px);border-color:#ffffff70;border-radius:14px;min-height:58px}
.intake-choices button[aria-pressed=true]{background:#ffffff30;border-color:#eee0c8}
#intake-error:empty{min-height:0;margin:10px 0}
#intake-next{margin-top:12px;border-radius:14px;box-shadow:none}
.intake-active #scene-video{filter:blur(7px) brightness(.65)}
@media(max-height:560px){#intake-form{padding-top:64px}#intake-step{padding-top:8px}#intake-title{margin-bottom:12px;font-size:23px}}
.intake-active>.scene-header,.intake-active>.scene-sound{visibility:hidden}

/* Keep stage metadata out of the conversation UI. */
#intake-step{display:none}
#intake-title{margin-top:auto;padding-top:32px}
@media(max-height:560px){#intake-title{padding-top:8px}}

#intake-title{font-family:'Noto Serif KR',serif}
/* Let the character scene remain visible through the input controls. */
#intake-form{background:linear-gradient(180deg,transparent 35%,rgba(8,11,19,.12) 65%,rgba(8,11,19,.38) 100%)}
.intake-choices button{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.35);backdrop-filter:none;-webkit-backdrop-filter:none}
.intake-choices button[aria-pressed=true]{background:rgba(213,183,139,.08);border-color:#d5b78b;color:#f2ddba}
#intake-next{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.45);color:#f4ede4;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
#intake-next:hover{background:rgba(255,255,255,.09)}
.intake-label input,.intake-label input:focus,.intake-review button{background:transparent}
.intake-choices button,.intake-choices button[aria-pressed=true],.intake-choices button:hover{background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}

/* Compact birth-date entry with adjacent calendar pills. */
.intake-birth-row{display:flex;align-items:center;gap:16px;border-bottom:1px solid #ffffff40;padding:8px 0 14px}
.intake-birth-row>input{min-width:0;flex:1;width:0;border:0;outline:none;background:transparent;color:#fff;font:600 22px 'Noto Sans KR',sans-serif;padding:12px 0}
.intake-birth-row>input::placeholder{color:#ffffff60}
.intake-birth-row:focus-within{border-bottom-color:#d5b78b}
.intake-birth-row .intake-choices{display:flex;gap:6px;flex-shrink:0;margin:0}
.intake-birth-row .intake-choices button{border:0;border-radius:999px;min-height:48px;min-width:58px;padding:0 14px;text-align:center;background:#ffffff12;color:#ffffff80;font-size:14px;font-weight:600}
.intake-birth-row .intake-choices button[aria-pressed=true]{background:#fff;color:#151821}

#intake-title,#intake-fields,#intake-error,#intake-next{transition:none}
.intake-changing #intake-title,.intake-changing #intake-fields,.intake-changing #intake-error,.intake-changing #intake-next{opacity:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){#intake-title,#intake-fields,#intake-error,#intake-next{transition:none}}

.next-scene.report-ritual{background:#f6f2e8;min-height:100dvh;overflow:hidden}
.next-scene.report-ritual::after{display:none}
.next-scene.report-ritual .door-background{visibility:hidden;aspect-ratio:480/854}
.next-scene.report-ritual #scene-video{aspect-ratio:480/854;filter:none;transition:none;background:#f6f2e8}
#free-report-frame{position:fixed;inset:0;width:min(100%,480px);height:100dvh;margin:0 auto;border:0;z-index:20;visibility:hidden;pointer-events:none;background:#f6f2e8}
#free-report-frame.is-visible{visibility:visible;pointer-events:auto}
body.report-open{overflow:hidden}
.report-ritual .scene-sound{background:#15233580;color:white;border-radius:20px;padding:8px 12px}
/* The ritual and report cover use the same full-viewport crop. */
.next-scene.report-ritual{height:100dvh;min-height:100dvh}
.next-scene.report-ritual .door-background{height:100dvh;aspect-ratio:auto;object-fit:cover}
.next-scene.report-ritual #scene-video{width:100%;height:100dvh;aspect-ratio:auto;object-fit:cover;object-position:center center}

@media(max-width:390px){.items-line{font-size:clamp(10px,3.1vw,12px)}}

/* Keep the input scene present until the ritual's first frame is decoded. */
.ritual-bridge{position:absolute;top:0;left:0;width:100%;object-fit:contain;object-position:top center;z-index:3;pointer-events:none;filter:blur(7px) brightness(.65);background:#101826}
#intake.intake-departing::backdrop{background:transparent;transition:background .45s ease}
@media(prefers-reduced-motion:reduce){#intake.intake-departing::backdrop{transition:none}}

.logo-tagline{top:25%;transform:translateY(-100%);font-size:clamp(12px,3.3vw,16px);line-height:1.65;white-space:nowrap}

.logo-tagline .logo-tagline-emphasis{display:block;margin-top:4px;font-size:1.22em;font-weight:700;color:#f3d39a;letter-spacing:.015em;text-shadow:0 2px 4px #000,0 0 16px #d9ad6240}


.entry-options{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;width:100%}
.entry-options .primary{padding-inline:6px;white-space:nowrap;font-size:clamp(12px,3.4vw,14px)}
.entry-options .parent-entry{background:linear-gradient(115deg,#182b3c,#263e51);color:#eed6b4;border-color:#d7b58b80}

.parent-scene{position:fixed;inset:0;width:min(100%,480px);margin:auto;overflow:hidden;background:#060e18}
.parent-tableau{position:absolute;inset:0;aspect-ratio:9/16;width:100%;height:100%;}
.parent-character{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.parent-orbit{position:absolute;left:46%;top:48%;width:0;height:0;--orbit-radius:80px;--orbit-height:22px}
.parent-orb{position:absolute;left:-30px;top:-30px;width:60px;height:60px;border-radius:50%;display:grid;place-items:center;border:1px solid #c9e6ffc0;background:radial-gradient(circle at 28% 20%,#ffffff70,transparent 35%),radial-gradient(circle at 50% 75%,#5688b7a0,#0a1830dd);box-shadow:inset 0 0 12px #b6dfff50,0 0 20px #7ebcff65;animation:parent-orbit 12s linear infinite}
.parent-orb img{width:70%;height:70%;object-fit:contain}.parent-orb.snu img,.parent-orb.hanyang img{filter:brightness(0) invert(.95)}
.parent-orb.korea{animation-delay:-4s}.parent-orb.hanyang{animation-delay:-8s}
.parent-orb.korea img{width:55%}
@keyframes parent-orbit{0%,100%{transform:translate(calc(-1 * var(--orbit-radius)),0) scale(.86);z-index:1}25%{transform:translate(0,calc(-1 * var(--orbit-height))) scale(.72);z-index:0}50%{transform:translate(var(--orbit-radius),0) scale(.86);z-index:1}75%{transform:translate(0,var(--orbit-height)) scale(1.08);z-index:2}}
.parent-funnel #intake::backdrop{background:#060b131a}
@media(prefers-reduced-motion:reduce){.parent-orb{animation:none}.parent-orb.snu{transform:translate(-75px,0)}.parent-orb.korea{transform:translate(0,-22px)}.parent-orb.hanyang{transform:translate(75px,0)}}

/* Match oni/css/fidelity.css and oni-input.css typography, scoped to intake. */
#intake,#intake input,#intake button,#intake label,#intake p,#intake span,#intake strong,#intake i,#intake h2,#intake input::placeholder{font-family:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif;font-synthesis:none}
#intake{font-weight:400}
#intake-title{font-weight:600}
#intake .intake-label input,#intake .intake-birth-row>input{font-weight:600}
#intake input::placeholder{font-weight:inherit}
#intake .intake-choices button{font-weight:500}
#intake .intake-choices button[data-key="gender"]{font-weight:600}
#intake .intake-hint,#intake .intake-label,#intake .intake-check,#intake-error,#intake .intake-review span,#intake .intake-review i{font-weight:400}
#intake .intake-top,#intake .intake-review strong{font-weight:500}
#intake-next,#intake .intake-time>span{font-weight:600}

/* Shared glass treatment for eight universities. */
@property --parent-orbit-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
.parent-orbit{top:50%;--orbit-radius:124px;--orbit-height:67px}
.parent-orbit .parent-orb{left:-34px;top:-34px;width:68px;height:68px;overflow:hidden;border:1px solid #e0f3ff99;background:radial-gradient(circle at 29% 20%,#ffffffa0,transparent 37%),radial-gradient(circle at 50% 50%,#d4e8ff99 0%,#b1d3f477 58%,#6b9ecd66 100%);box-shadow:inset 0 0 9px #edfbff77,0 0 14px #76b6e83b;animation:parent-university-orbit 26s linear infinite,parent-orb-glow var(--glow-duration,7s) ease-in-out infinite;animation-delay:calc(var(--orb-delay) * 1.3),var(--orb-delay);--flow-angle:calc(var(--parent-orbit-angle) + sin(var(--parent-orbit-angle) * 2 + var(--orb-rest)) * 9deg);transform:perspective(480px) translate3d(calc(cos(var(--flow-angle)) * var(--orbit-radius) * var(--orbit-width,1) + sin(var(--parent-orbit-angle) * 3 + var(--orb-rest)) * 5px),calc(sin(var(--flow-angle)) * var(--orbit-height) * var(--orbit-flat,.8) + sin(var(--parent-orbit-angle) * 2 + var(--orb-rest)) * 9px + var(--float-offset,0px)),calc(sin(var(--flow-angle)) * 105px)) scale(1.14);opacity:calc(.86 + sin(var(--parent-orbit-angle)) * .14);filter:blur(calc(.25px - sin(var(--parent-orbit-angle)) * .25px));z-index:calc(20 + sin(var(--parent-orbit-angle)) * 10)}
.parent-orbit .orb-emblem{position:relative;width:60px;height:60px;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:transparent;box-shadow:none}
.parent-orbit .parent-orb img{position:static;width:58px;height:58px;max-width:none;object-fit:contain;filter:none;mix-blend-mode:normal}
.parent-orbit .snu img{width:48px;height:52px}
.parent-orbit .korea img{width:38px;height:52px}
.parent-orbit .skku img{width:58px;height:58px}
.parent-orbit .sogang img{position:absolute;left:13px;top:4px;width:167px;height:52px;object-fit:fill}
.parent-orbit .kaist img{position:absolute;width:317px;height:auto;left:-87.8px;top:-13px;filter:url(#parent-logo-alpha)}
@keyframes parent-university-orbit{from{--parent-orbit-angle:0deg}to{--parent-orbit-angle:360deg}}
.parent-tableau{transform-origin:46% 52%;animation:parent-scene-drift 22s ease-in-out infinite;will-change:transform}
.parent-tableau::before,.parent-tableau::after{content:"";position:absolute;inset:-5%;pointer-events:none}
.parent-tableau::before{background:radial-gradient(ellipse at 74% 19%,#add9ff24,transparent 54%),radial-gradient(ellipse at 20% 45%,#dac59a12,transparent 46%);mix-blend-mode:screen;animation:parent-light-breathe 9s ease-in-out infinite alternate;mask-image:linear-gradient(#000 45%,transparent 78%)}
.parent-tableau::after{background:radial-gradient(circle at 17% 25%,#c5e9ffb0 0 1px,transparent 2px),radial-gradient(circle at 73% 39%,#c5e9ff90 0 1px,transparent 2px),radial-gradient(circle at 34% 54%,#edddbd90 0 1px,transparent 2px),radial-gradient(circle at 81% 17%,#c5e9ff90 0 1px,transparent 2px);background-size:230px 340px;animation:parent-dust-drift 12s linear infinite;opacity:.5}
@keyframes parent-scene-drift{0%,100%{transform:scale(1.065) translate(-3px,2px) rotate(-.12deg)}25%{transform:scale(1.078) translate(1px,-3px) rotate(.08deg)}50%{transform:scale(1.09) translate(4px,-1px) rotate(.15deg)}75%{transform:scale(1.075) translate(0,4px) rotate(-.05deg)}}
@keyframes parent-light-breathe{from{opacity:.25}to{opacity:.7}}
@keyframes parent-dust-drift{from{transform:translate(8px,45px);opacity:.3}50%{opacity:.85}to{transform:translate(-8px,-65px);opacity:.3}}
@media(max-width:360px){.parent-orbit{--orbit-radius:112px;--orbit-height:57px}}
@media(prefers-reduced-motion:reduce){.parent-tableau,.parent-tableau::before,.parent-tableau::after{animation:none}.parent-orbit .parent-orb{animation:none;--parent-orbit-angle:var(--orb-rest)}}

.next-scene.parent-generation{background:#f6f2e8 url('assets/report-last-frame-v3.png') center/cover no-repeat}
.generation-status{position:fixed;z-index:15;top:46%;left:50%;transform:translate(-50%,-50%);width:min(calc(100% - 64px),384px);margin:0;padding:0;color:#3e5264;background:transparent;border:0;text-align:center;font:600 clamp(20px,5.4vw,25px)/2 'Noto Serif KR',serif;letter-spacing:-.035em;word-break:keep-all;text-shadow:0 1px 0 #fff8;animation:generation-ink-in 1s ease-out both}
.generation-status span{display:block}
.generation-status small{display:block;margin-top:24px;color:#6c7881;font-size:15px;letter-spacing:.035em;line-height:1.9}
.generation-status.is-error{top:65%;font-size:17px;animation:none}
@keyframes generation-ink-in{from{opacity:0;filter:blur(4px);translate:0 -10px}to{opacity:1;filter:blur(0);translate:0 0}}
@media(prefers-reduced-motion:reduce){.generation-status{animation:none}}

.generation-track{position:relative;width:164px;height:3px;margin:28px auto 0;overflow:hidden;border-radius:3px;background:#536b7c24;box-shadow:0 1px 0 #ffffff65}
.generation-flow{width:38%;height:100%;border-radius:inherit;background:linear-gradient(90deg,transparent,#687f91 35%,#9a8767 70%,transparent);animation:generation-flow 2.8s ease-in-out infinite}
.generation-status.is-complete .generation-flow{width:100%;animation:none;background:#687f91}
@keyframes generation-flow{from{transform:translateX(-110%)}to{transform:translateX(370%)}}
@media(prefers-reduced-motion:reduce){.generation-flow{animation:none;margin-inline:auto}}

/* Keep entry controls inside the current viewport, including short mobile screens. */
.page{display:flex;flex-direction:column;height:var(--funnel-height,100dvh);min-height:0}
.page .hero{flex:1;min-height:0}
.page .hero-stage,.page .media{height:100%;aspect-ratio:auto}
.page .media video{object-fit:cover}
.page .hero-copy{bottom:0}
.page .logo-lockup{width:min(100%,48svh);margin-inline:auto}
.page .cta-dock{flex:none;margin-top:0;padding-bottom:max(16px,env(safe-area-inset-bottom))}
.next-scene .door-actions,
.next-scene .door-actions:has(#open-door:not([hidden])),
.next-scene .door-actions:has(#greet-teacher:not([hidden])){top:auto;bottom:max(20px,env(safe-area-inset-bottom));transform:none;position:fixed;left:max(16px,calc((100vw - 480px)/2 + 16px));right:max(16px,calc((100vw - 480px)/2 + 16px))}

html:has(body.funnel-shell),body.funnel-shell{height:100%;overflow:hidden;overscroll-behavior:none}
.funnel-shell .next-scene{height:var(--funnel-height,100dvh);min-height:0}
.funnel-shell .next-scene:not(.report-ritual)>.door-background,
.funnel-shell .next-scene:not(.report-ritual)>video{height:100%;width:100%;aspect-ratio:auto;object-fit:cover}
.funnel-shell #intake{top:var(--funnel-top,0px);bottom:auto;height:var(--funnel-height,100dvh);max-height:var(--funnel-height,100dvh);overflow:hidden}
.funnel-shell #intake-form{height:100%;min-height:0;padding:56px 24px max(16px,env(safe-area-inset-bottom));overflow:hidden}
.funnel-shell #intake-title{flex-shrink:0;padding-top:8px;font-size:clamp(18px,3.4vh,26px);margin-bottom:16px}
.funnel-shell #intake-fields,.funnel-shell #intake-next{flex-shrink:0}
.funnel-shell .intake-review{gap:4px}
.funnel-shell .intake-review button{padding:8px 10px;min-height:36px}
@media(max-height:650px){
 .funnel-shell .intake-review{display:grid;grid-template-columns:1fr 1fr}
 .funnel-shell .intake-review button{display:flex;flex-wrap:wrap;gap:3px 8px;align-items:center}
 .funnel-shell .intake-review strong{flex-basis:100%;order:2}
 .funnel-shell .intake-review i{margin-left:auto}
 .funnel-shell #intake-title{margin-bottom:10px}
 .funnel-shell .intake-hint{margin:6px 0;font-size:11px}
 .funnel-shell #intake-next{margin-top:6px}
}
@media(max-height:450px){
 .funnel-shell #intake-form{padding:42px 16px 8px}
 .funnel-shell .intake-top{top:5px}
 .funnel-shell #intake-title{font-size:18px;margin-bottom:6px;padding-top:0}
 .funnel-shell .intake-label input{padding:8px 2px;font-size:18px}
 .funnel-shell .intake-choices button{min-height:42px}
 .funnel-shell .intake-review{grid-template-columns:repeat(3,minmax(0,1fr))}
 .funnel-shell .intake-review button{padding:4px 6px}
 .funnel-shell .landing-note{font-size:11px;margin-bottom:6px}
 .funnel-shell .header{padding:10px 16px}
}

/* Keep the two gender/attempt options on one row in both audience flows. */
.intake-choices:has([data-key="gender"]),.intake-choices:has([data-key="attempt"]),.intake-choices:has([data-key="fifth"]){grid-template-columns:repeat(2,minmax(0,1fr))}
.intake-choices button[data-key="gender"],.intake-choices button[data-key="attempt"],.intake-choices button[data-key="fifth"]{min-width:0;white-space:nowrap;text-align:center;padding-inline:8px}

.intake-time{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto;gap:10px}
.intake-time .intake-label{min-width:0}
.intake-time .intake-label input{width:100%;min-width:0}
.intake-time .intake-time-unknown{white-space:nowrap;margin:0 0 10px;gap:6px;min-height:36px}
.intake-time-unknown input{flex-shrink:0}
/* Review text sits above a dark mask; other input steps keep their scene. */
.funnel-shell #intake:has(.intake-review)::backdrop{background:rgba(0,0,0,.82)}
.funnel-shell #intake-form:has(.intake-review){background:rgba(0,0,0,.38)}
.funnel-shell .intake-review button{color:#fff;border-color:rgba(255,255,255,.25)}
.funnel-shell .intake-review strong{color:#fff}
.funnel-shell .intake-review span{color:#d8dee7}

/* Bottom-align the entire question/input group, not only the controls. */
.funnel-shell #intake-form:not(:has(.intake-review)){justify-content:flex-end;padding-top:56px;padding-bottom:max(12px,env(safe-area-inset-bottom))}
.funnel-shell #intake-form:not(:has(.intake-review)) #intake-title{margin-top:auto;padding-top:0;min-height:0;margin-bottom:12px}
.funnel-shell #intake-form:not(:has(.intake-review)) #intake-error:empty{margin:0}
.funnel-shell #intake-form:not(:has(.intake-review)) .intake-hint{margin-bottom:0}
.funnel-shell #intake-form:not(:has(.intake-review)) .intake-choices{margin-bottom:0}

/* Lift both audience inputs equally while retaining the bottom-anchored layout. */
.funnel-shell #intake #intake-form:not(:has(.intake-review)){padding-bottom:calc(max(12px,env(safe-area-inset-bottom)) + 8px)}
.scene-sound{right:100px}
.scene-skip{position:absolute;z-index:4;right:16px;top:20px}
.intake-active>.scene-skip{visibility:hidden}
/* Preserve a clear input zone on short screens, including landscape. */
@media(max-height:800px){.parent-orbit{top:42%;scale:.75}}
@media(max-height:560px){.parent-orbit{top:32%;scale:.55}}
@media(max-height:450px){.parent-orbit{top:22%;scale:.4}}

.generation-notice{position:fixed;z-index:15;bottom:max(36px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);box-sizing:border-box;width:calc(100% - 80px);max-width:320px;padding:16px 22px;border:1px solid #536b7c35;border-radius:8px;background:#f5f0e780;color:#526574;text-align:center;font:400 13px/1.9 "Noto Serif KR",serif;letter-spacing:-.02em;white-space:pre-line}

/* Outgoing video frame stays above a loading video, below scene controls. */
.scene-frame-hold{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}

/* Bounded variations keep the orbit together while each orb drifts and glows. */
.parent-orbit .parent-orb:nth-child(2n){--orbit-width:.94;--orbit-flat:.92;--float-offset:-6px;--glow-duration:8.3s}
.parent-orbit .parent-orb:nth-child(3n){--orbit-width:1.03;--orbit-flat:.72;--float-offset:4px;--glow-duration:9.7s}
.parent-orbit .parent-orb:nth-child(5n){--orbit-width:.91;--orbit-flat:.85;--float-offset:7px;--glow-duration:6.6s}
.parent-orbit .parent-orb::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse at 25% 18%,#fff9,transparent 34%);opacity:.3;animation:parent-orb-glint var(--glow-duration,7s) ease-in-out infinite;animation-delay:var(--orb-delay)}
@keyframes parent-orb-glow{0%,100%{box-shadow:inset 0 0 9px #edfbff55,0 0 12px #76b6e82b}45%{box-shadow:inset 0 0 13px #edfbff88,0 0 22px #99d7ff70,0 0 34px #76b6e824}70%{box-shadow:inset 0 0 10px #edfbff66,0 0 15px #76b6e840}}
@keyframes parent-orb-glint{0%,100%{opacity:.18;transform:rotate(-12deg)}45%{opacity:.55;transform:rotate(15deg)}}
@media(prefers-reduced-motion:reduce){.parent-orbit .parent-orb::after{animation:none}}