:root {
  --p2-navy-950:#020713;
  --p2-navy-900:#071128;
  --p2-ink:#f7f2e8;
  --p2-muted:rgba(211,220,239,.7);
  --p2-gold:#d7b577;
  --p2-gold-soft:#f0d8a5;
  --p2-green:#7ec5a1;
  --p2-line:rgba(225,198,146,.3);
  --p2-serif:"Noto Serif KR","Nanum Myeongjo","Batang","바탕",Georgia,serif;
  --p2-sans:Pretendard,"Noto Sans KR","Malgun Gothic",sans-serif;
}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0;background:var(--p2-navy-950)}
body.page2{overflow-x:hidden;color:var(--p2-ink);font-family:var(--p2-sans)}
body.page2 button,body.page2 input,body.page2 select{font:inherit}
body.page2 button,body.page2 a{-webkit-tap-highlight-color:transparent}
body.page2 button{color:inherit}
body.page2 a{color:inherit;text-decoration:none}
[hidden]{display:none!important}
.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;z-index:100;left:18px;top:-80px;padding:12px 16px;color:#071024;background:#fff}
.skip-link:focus{top:18px}
body.page2 :focus-visible{outline:2px solid rgba(240,216,165,.9);outline-offset:4px}

.page2-shell{position:relative;min-height:100svh;display:grid;overflow-x:hidden;isolation:isolate;background:#020713;animation:page-scene-in .32s ease-out}
.world-background,.world-shade,.door-gap-light,.lantern-glows{position:fixed;inset:0;pointer-events:none}
.world-background{z-index:-5;background:#020713 url("./assets/main-hero-v2.png") center/cover no-repeat;filter:saturate(.78) brightness(.72)}
.world-shade{z-index:-4;background:linear-gradient(90deg,rgba(2,7,19,.94) 0%,rgba(3,9,23,.8) 36%,rgba(3,9,23,.38) 63%,rgba(2,7,19,.34) 100%),linear-gradient(180deg,rgba(2,7,19,.32),rgba(2,7,19,.15) 50%,rgba(2,7,19,.78))}
.world-shade::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 84% 46%,rgba(96,165,128,.1),transparent 12%),radial-gradient(circle at 55% 20%,transparent,rgba(2,7,19,.24) 65%)}
.door-gap-light{z-index:-2;left:84.5%;right:auto;top:34%;bottom:auto;width:24px;height:190px;border-radius:50%;background:linear-gradient(180deg,rgba(180,231,197,0),rgba(135,210,168,.38),rgba(191,236,204,.12));filter:blur(8px);opacity:.55;animation:door-breathe 5.5s ease-in-out infinite}
.lantern-glows{z-index:-1}
.lantern-glows i{position:absolute;left:var(--x);top:var(--y);width:16px;height:16px;border-radius:50%;background:rgba(248,216,150,.86);box-shadow:0 0 12px 5px rgba(226,178,93,.28),0 0 42px 16px rgba(211,151,64,.1);opacity:0;transform:translate(-50%,-50%) scale(.55);transition:opacity .7s ease var(--delay),transform .7s ease var(--delay),filter .7s ease var(--delay)}
body.page2[data-progress="1"] .lantern-glows i:nth-child(1),
body.page2[data-progress="2"] .lantern-glows i:nth-child(-n+2),
body.page2[data-progress="3"] .lantern-glows i:nth-child(-n+4),
body.page2[data-progress="4"] .lantern-glows i{opacity:.72;transform:translate(-50%,-50%) scale(1);filter:drop-shadow(0 0 10px rgba(238,197,121,.5))}

.page2-back{position:fixed;z-index:12;left:clamp(20px,4vw,60px);top:clamp(20px,4vw,44px);color:rgba(242,237,225,.7);font-size:12px;letter-spacing:.08em;transition:color .2s}
.page2-back:hover{color:var(--p2-gold-soft)}
.page2-stage{grid-area:1/1;min-height:100svh;width:100%;display:grid;align-items:center;padding:clamp(82px,8vw,120px) clamp(20px,7vw,110px);transition:opacity .55s ease,visibility .55s ease}
.form-stage{justify-items:center}
.glass-panel{border:1px solid rgba(224,201,156,.26);background:linear-gradient(145deg,rgba(8,20,46,.78),rgba(3,10,28,.62));box-shadow:0 28px 85px rgba(0,0,0,.36),inset 0 1px rgba(255,255,255,.04);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.information-panel{width:min(100%,540px);padding:clamp(34px,4vw,58px)}
.eyebrow{margin:0 0 18px;color:var(--p2-gold);font:10px/1.4 Georgia,serif;letter-spacing:.24em}
.information-panel h1{margin:0;color:#fff9ed;font-family:var(--p2-serif);font-size:clamp(39px,4.2vw,62px);line-height:1.24;letter-spacing:-.055em;font-weight:550}
.panel-copy{margin:22px 0 36px;color:var(--p2-muted);font-size:14px;line-height:1.85}
.field-group{margin-top:24px}
.field-group>label,.field-group>legend{display:block;margin-bottom:10px;color:rgba(247,242,232,.88);font-size:13px}
.choice-field{min-width:0;padding:0;border:0}
.field-group input[type="text"]{width:100%;min-height:58px;padding:0 17px;color:#fff9ed;border:1px solid rgba(208,220,244,.2);border-radius:2px;background:rgba(2,9,25,.54);transition:border-color .22s,box-shadow .22s,background .22s}
.field-group input::placeholder{color:rgba(201,211,233,.4)}
.field-group input[type="text"]:focus{border-color:rgba(225,192,133,.65);box-shadow:0 0 0 3px rgba(215,177,111,.07);background:rgba(4,13,32,.72);outline:0}
.field-group input[aria-invalid="true"]{border-color:rgba(224,143,129,.62)}
.segmented-control{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.segmented-control label{position:relative;display:block;margin:0;cursor:pointer}
.segmented-control input,.unknown-time-toggle input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.segmented-control span{display:flex;min-height:56px;align-items:center;justify-content:center;gap:8px;color:rgba(221,228,240,.68);border:1px solid rgba(208,220,244,.18);border-radius:999px;background:rgba(2,9,25,.5);transition:color .22s,border-color .22s,background .22s,box-shadow .22s}
.segmented-control span i,.unknown-time-toggle span i{display:grid;width:16px;height:16px;place-items:center;opacity:.3;border:1px solid rgba(204,216,237,.28);border-radius:50%;font-size:9px;font-style:normal;transition:opacity .22s,border-color .22s,background .22s}
.segmented-control input:checked+span{color:#fff8e9;border-color:rgba(219,190,133,.68);background:linear-gradient(100deg,rgba(32,103,84,.28),rgba(135,99,49,.2));box-shadow:inset 0 0 22px rgba(91,184,145,.07)}
.segmented-control input:checked+span i,.unknown-time-toggle input:checked+span i{opacity:1;color:#071b19;border-color:rgba(238,210,151,.82);background:var(--p2-gold-soft)}
.segmented-control input:focus-visible+span,.unknown-time-toggle input:focus-visible+span{outline:2px solid rgba(240,216,165,.9);outline-offset:4px}
.birth-time-field>legend{width:100%}
.birth-time-field>legend small{margin-left:7px;color:var(--p2-gold);font:9px/1.4 Georgia,serif;letter-spacing:.1em}
.time-input-shell{position:relative;transition:opacity .22s,filter .22s}
.time-input-shell input{padding-right:98px!important;letter-spacing:.08em}
.time-input-shell>span{position:absolute;right:16px;top:50%;color:rgba(220,229,241,.42);font-size:10px;transform:translateY(-50%);pointer-events:none}
.time-input-shell.is-disabled{opacity:.32;filter:saturate(.4)}
.time-input-shell input:disabled{cursor:not-allowed}
.unknown-time-toggle{position:relative;display:block;margin:11px 0 0;cursor:pointer}
.unknown-time-toggle>span{display:flex;min-height:48px;align-items:center;justify-content:flex-start;gap:9px;padding:0 14px;color:rgba(218,226,239,.67);border:1px solid rgba(205,218,240,.15);border-radius:2px;background:rgba(3,12,29,.38);font-size:12px;transition:color .22s,border-color .22s,background .22s}
.unknown-time-toggle input:checked+span{color:#f6f0e2;border-color:rgba(103,190,155,.5);background:rgba(30,105,83,.16)}
.field-error,.field-help{display:block;margin-top:8px;font-size:11px;line-height:1.5}
.field-error{color:#e6a59a}.field-help{color:rgba(199,210,234,.46)}
.story-start{width:100%;min-height:62px;margin-top:34px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;color:rgba(255,249,237,.42);border:1px solid rgba(218,184,124,.22);background:rgba(129,95,45,.08);cursor:not-allowed;transition:color .25s,border-color .25s,background .25s,box-shadow .25s,transform .2s}
.story-start:not(:disabled){color:#fff9ed;border-color:rgba(232,199,140,.62);background:linear-gradient(90deg,rgba(144,104,48,.2),rgba(111,83,51,.14));box-shadow:0 0 34px rgba(218,174,97,.1);cursor:pointer}
.story-start:not(:disabled):hover{transform:translateY(-2px);background:rgba(145,105,48,.24)}
.privacy-note{margin:15px 0 0;color:rgba(198,209,231,.38);font-size:10px;line-height:1.5;text-align:center}
.scene-transition{position:fixed;z-index:90;inset:0;opacity:0;visibility:hidden;pointer-events:none;background:#020713;transition:opacity .26s ease,visibility .26s ease}
body.page2.is-page-leaving .scene-transition{opacity:1;visibility:visible}

.form-stage.is-exiting{opacity:0;visibility:hidden}
.waiting-stage{place-items:center;opacity:0}.waiting-stage.is-active{opacity:1}
.waiting-panel{width:min(100%,480px);padding:clamp(34px,4vw,50px);text-align:center}
.waiting-panel h2{margin:0;color:#fff8eb;font-family:var(--p2-serif);font-size:clamp(31px,3.5vw,46px);line-height:1.4;letter-spacing:-.045em;font-weight:500}
.quiet-loader{position:relative;width:56px;height:56px;margin:10px auto 29px;border:1px solid rgba(226,194,135,.23);border-radius:50%;box-shadow:inset 0 0 20px rgba(76,176,140,.08),0 0 28px rgba(215,179,111,.06)}
.quiet-loader::before{content:"";position:absolute;inset:-1px;border:1px solid transparent;border-top-color:rgba(239,210,153,.86);border-right-color:rgba(107,197,162,.42);border-radius:50%;animation:quiet-orbit 3.8s linear infinite}
.quiet-loader i,.quiet-loader span{position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%)}
.quiet-loader i{width:8px;height:8px;background:var(--p2-gold-soft);box-shadow:0 0 13px 4px rgba(227,195,133,.24);animation:quiet-pulse 2.7s ease-in-out infinite}
.quiet-loader span{width:24px;height:24px;border:1px solid rgba(106,196,159,.26)}
.retry-box{margin-top:24px;padding-top:22px;border-top:1px solid rgba(210,222,244,.12)}
.retry-box p{margin:0 0 16px;color:rgba(232,219,204,.78);font-size:13px}
.retry-box button{min-height:44px;padding:0 22px;color:#fff7e8;border:1px solid rgba(224,191,132,.42);background:rgba(134,99,46,.15);cursor:pointer}

@keyframes door-breathe{0%,100%{opacity:.38;transform:scaleY(.96)}50%{opacity:.62;transform:scaleY(1.03)}}
@keyframes quiet-orbit{to{transform:rotate(360deg)}}
@keyframes quiet-pulse{0%,100%{opacity:.45;transform:translate(-50%,-50%) scale(.82)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}}
@keyframes page-scene-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

@media(max-width:720px){
  .page2-shell{min-height:100svh}.world-background{background-position:61% center;filter:saturate(.72) brightness(.56)}.world-shade{background:linear-gradient(180deg,rgba(2,7,19,.4),rgba(2,7,19,.72) 42%,rgba(2,7,19,.9))}.door-gap-light{left:82%;top:29%;height:135px}.lantern-glows i{width:12px;height:12px}
  .page2-stage{align-items:start;padding:88px 16px max(26px,env(safe-area-inset-bottom))}.information-panel{padding:31px 22px}.information-panel h1{font-size:clamp(35px,10vw,46px)}.panel-copy{margin:18px 0 27px;font-size:13px}.field-group{margin-top:19px}.field-group input[type="text"]{min-height:54px}.segmented-control span{min-height:54px}.story-start{margin-top:27px}
  .waiting-stage{align-items:center;padding:24px}.waiting-panel{padding:34px 22px}.waiting-panel h2{font-size:clamp(29px,8.5vw,38px)}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .door-gap-light{opacity:.48;transform:none}.lantern-glows i{transition:none}.quiet-loader::before{transform:none}.quiet-loader i{opacity:.8;transform:translate(-50%,-50%)}
  .page2-shell{animation:none}.scene-transition{transition-duration:.01ms}
}