.entrance[hidden]{display:none!important}.entrance:focus{outline:none}.entrance{position:fixed;inset:0;z-index:10000;isolation:isolate;overflow:hidden;min-height:100dvh;background:#08090a;color:#eee5d5;font-family:"Noto Sans KR",sans-serif;opacity:1;transition:opacity .48s ease;--entrance-book-w:clamp(260px,28vw,340px);--entrance-book-h:calc(var(--entrance-book-w)*1.324)}
.entrance::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 43%,#35302a45 0%,#15161555 33%,#08090a 73%),repeating-linear-gradient(115deg,#ffffff02 0 1px,transparent 1px 6px)}.entrance::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.45;background:linear-gradient(105deg,transparent 34%,#a78c6511 46%,transparent 58%);pointer-events:none}
.entrance-topline,.entrance-bottomline{position:absolute;left:clamp(24px,4vw,64px);right:clamp(24px,4vw,64px);display:flex;align-items:center;justify-content:space-between;gap:18px;z-index:3}.entrance-topline{top:25px}.entrance-topline>span{font:600 15px "Noto Serif KR",serif;letter-spacing:.26em;color:#b6a58e}.entrance button{font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.entrance button:focus-visible{outline:2px solid #f0bc82;outline-offset:8px}.entrance-topline button{display:flex;align-items:center;gap:14px;min-height:44px;padding:8px 0;background:none;border:0;color:#c5bcad;font-size:14px}.entrance-topline button span{font-size:20px;color:#ba7455}.entrance-topline button:hover{color:#fff1d8}.entrance-bottomline{bottom:26px;color:#6f706c;font-size:11px;letter-spacing:.14em}.entrance-bottomline>span:first-child{font-family:"Noto Serif KR",serif;font-size:12px;color:#8d8170}
.entrance-composition{height:100dvh;min-height:610px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:74px 24px 62px;box-sizing:border-box;position:relative}.entrance-heading{text-align:center;z-index:1;margin:0 0 21px;transition:opacity .4s,transform .6s}.entrance-heading p{margin:0 0 9px;color:#bcb1a0;font-size:13px;letter-spacing:.17em}.entrance-heading h1{font:600 clamp(31px,3.5vw,43px)/1.25 "Noto Serif KR",serif;letter-spacing:.17em;margin:0 0 0 .17em;color:#ece3d3;text-shadow:0 2px 20px #000}
.entrance-artifact{position:relative;perspective:1100px;width:var(--entrance-book-w);height:var(--entrance-book-h);flex-shrink:0;transform:rotate(-5deg);transition:transform .85s cubic-bezier(.2,.7,.25,1),opacity .55s;filter:drop-shadow(0 26px 27px #0009)}.entrance-book-shadow{position:absolute;inset:10% -30% -8%;background:radial-gradient(ellipse at 50% 80%,#000d,transparent 65%);filter:blur(18px);pointer-events:none}.entrance-book{display:block;position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;text-align:left;perspective:1100px;transform-style:preserve-3d;transition:transform .55s}.entrance-book:hover{transform:translateY(-4px) rotate(1deg)}.entrance-book:disabled{cursor:default;opacity:1}.entrance-book-pages{position:absolute;inset:5px -8px -8px 5px;border-radius:2px 5px 6px 2px;background:repeating-linear-gradient(0deg,#837b66 0 1px,#2c2b24 1px 2px,#5e594c 2px 3px);box-shadow:2px 2px 0 #151612,6px 7px 0 #151612,9px 10px 22px #0009;transform:translateZ(-8px)}.entrance-book-pages::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,#0b0c09 0%,transparent 35%,#0b0c0977 95%)}.entrance-book-cover{position:absolute;inset:0;display:block;transform-origin:4% 50%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,.1,.1,1);box-shadow:inset 4px 0 7px #000a,0 0 1px 1px #6b5b4144;border-radius:2px;background:#131412}.entrance-cover-drawing{position:absolute;inset:0;width:100%;height:100%;border-radius:2px;pointer-events:none}.entrance-cover-title{position:absolute;left:17%;top:12%;writing-mode:vertical-rl;font:600 clamp(22px,2.4vw,29px)/1.3 "Noto Serif KR",serif;letter-spacing:.17em;color:#a99e88;text-shadow:1px 1px #000}.entrance-cover-note{position:absolute;right:12%;bottom:10%;writing-mode:vertical-rl;font:400 11px/1 "Noto Serif KR",serif;letter-spacing:.2em;color:#80745f}.entrance-cord{display:block;position:absolute;top:48%;width:51%;height:5px;background:repeating-linear-gradient(115deg,#4e1514 0 2px,#9d4434 2px 3px,#5f1f1b 3px 4px);box-shadow:0 2px 3px #000,0 -1px #ab53434d;transition:transform .7s ease,opacity .45s}.entrance-cord-left{left:-1%;transform:rotate(3deg);transform-origin:left}.entrance-cord-right{right:-1%;transform:rotate(-3deg);transform-origin:right}
.entrance-ofuda{display:flex;flex-direction:column;align-items:center;position:absolute;left:calc(55% - 56px);top:15%;width:112px;height:71%;max-height:320px;background:linear-gradient(100deg,#d4c4a3,#ede2c6 42%,#e1d1b3 73%,#cdbb9b);color:#2a2420;box-shadow:3px 5px 10px #0008;clip-path:polygon(1% 0,99% .5%,100% 99%,97% 100%,2% 99.5%,0 1%);will-change:clip-path}.entrance-ofuda::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.3;background:repeating-linear-gradient(3deg,transparent 0 3px,#7d56330c 3px 4px),radial-gradient(ellipse at 3% 80%,#75452266,transparent 45%),linear-gradient(90deg,transparent 48%,#84724b55 49%,#fff3d755 50%,transparent 52%)}.entrance-ofuda::after{content:"";position:absolute;left:8%;right:8%;top:48%;height:1px;background:#886e3f40;box-shadow:0 1px #fff4d550}.entrance-ofuda-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.entrance-ofuda-small{font:600 13px "Noto Serif KR",serif;letter-spacing:.28em;margin:42px 0 0 4px;color:#8d3527}.entrance-ofuda-word{font:600 39px/1.3 "Noto Serif KR",serif;writing-mode:vertical-rl;letter-spacing:.12em;margin-top:12px;position:relative;text-shadow:.4px .6px #2a2420}.entrance-ofuda-stamp{display:grid;place-items:center;width:38px;height:38px;border:3px solid #a43b2c;box-shadow:inset 0 0 0 1px #a43b2c;font:600 28px "Noto Serif KR",serif;color:#a43b2c;transform:rotate(-7deg);margin-top:18px;opacity:.9}.entrance-ofuda-foot{font-size:10px;font-weight:600;letter-spacing:.14em;color:#7e3929;position:absolute;bottom:45px}.entrance-fire{position:absolute;left:-120px;top:-140px;width:calc(100% + 240px);height:calc(100% + 240px);pointer-events:none;z-index:5;opacity:0;transition:opacity .15s}.entrance.is-burning .entrance-fire{opacity:1}.entrance.is-burning .entrance-book:hover{transform:none}.entrance.is-burning .entrance-cord-left{transform:rotate(9deg) translateX(-10px);opacity:.45}.entrance.is-burning .entrance-cord-right{transform:rotate(-10deg) translateX(10px);opacity:.45}.entrance.is-opening .entrance-book-cover{transform:rotateY(-66deg)}.entrance.is-opening .entrance-artifact{transform:rotate(-1deg) translateX(-8%) scale(1.05)}.entrance.is-opening .entrance-heading,.entrance.is-burning .entrance-action{opacity:0;transform:translateY(-5px);pointer-events:none}.entrance.is-leaving{opacity:0}.entrance.is-leaving .entrance-artifact{opacity:0;transform:rotate(-1deg) translateX(-13%) scale(1.1)}
.entrance-action{margin-top:30px;text-align:center;z-index:2;transition:opacity .3s,transform .4s}.entrance-action>button{display:flex;align-items:center;justify-content:center;gap:17px;min-height:51px;background:linear-gradient(90deg,transparent,#a77c4910,transparent);border:0;border-top:1px solid #70503966;border-bottom:1px solid #70503966;color:#f4dfbc;padding:10px 24px;font-size:17px;font-weight:600;letter-spacing:.06em}.entrance-action>button:hover{color:#fff7df;background:#9a512218}.entrance-action-mark{color:#d16c47;font-size:20px}.entrance-action-arrow{color:#af8460;font-size:24px;font-weight:400}.entrance-action>p{margin:12px 0 0;color:#b0a493;font-size:13px}.entrance-atmosphere{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:-1}.entrance-atmosphere>span{position:absolute;left:17%;top:25%;width:3px;height:3px;border-radius:50%;background:#9a6a3e80;box-shadow:45vw 34vh 0 -1px #b07e46,21vw -11vh 0 -1px #bd976044,50vw -5vh 0 -1px #c79c6b55;animation:entrance-dust 13s ease-in-out infinite}.entrance-atmosphere>span:nth-child(2){left:35%;top:81%;animation-delay:-5s;opacity:.55}.entrance-atmosphere>span:nth-child(3){left:75%;top:45%;animation-delay:-9s;opacity:.35}.entrance-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes entrance-dust{0%,100%{transform:translate(0,8px);opacity:.15}50%{transform:translate(14px,-20px);opacity:.65}}
@media(max-height:800px){.entrance{--entrance-book-w:280px}.entrance-composition{min-height:560px;padding-top:65px;padding-bottom:48px}.entrance-heading{margin-bottom:18px}.entrance-heading h1{font-size:34px}.entrance-action{margin-top:23px}.entrance-ofuda{width:100px;left:calc(55% - 50px)}.entrance-ofuda-small{margin-top:33px}.entrance-ofuda-word{font-size:34px;margin-top:8px}.entrance-ofuda-stamp{width:33px;height:33px;font-size:25px;margin-top:12px}.entrance-ofuda-foot{bottom:39px}}
@media(max-width:600px){.entrance{--entrance-book-w:min(69vw,285px)}.entrance-topline{top:12px;left:22px;right:22px}.entrance-topline>span{font-size:12px;letter-spacing:.15em}.entrance-topline button{font-size:12px;gap:8px}.entrance-composition{min-height:540px;padding:69px 20px 55px}.entrance-heading{margin-bottom:24px}.entrance-heading p{font-size:12px;letter-spacing:.1em}.entrance-heading h1{font-size:33px}.entrance-cover-title{font-size:23px}.entrance-ofuda{width:96px;left:calc(55% - 48px)}.entrance-ofuda-small{margin-top:31px}.entrance-ofuda-word{font-size:32px;margin-top:8px}.entrance-ofuda-stamp{width:30px;height:30px;font-size:23px;margin-top:10px}.entrance-ofuda-foot{font-size:9px;bottom:35px}.entrance-action{margin-top:30px}.entrance-action>button{font-size:16px;min-height:50px;padding:10px 18px;gap:14px}.entrance-action>p{font-size:12px}.entrance-bottomline{left:22px;right:22px;bottom:18px;font-size:10px}.entrance-bottomline>span:first-child{font-size:10px}}
@media(max-height:640px){.entrance{--entrance-book-w:220px}.entrance-composition{min-height:460px;padding:54px 18px 28px}.entrance-heading{margin-bottom:14px}.entrance-heading p{font-size:10px;margin-bottom:5px}.entrance-heading h1{font-size:26px}.entrance-action{margin-top:20px}.entrance-action>p{margin-top:7px;font-size:11px}.entrance-action>button{min-height:44px;font-size:14px}.entrance-bottomline{display:none}.entrance-ofuda-small{margin-top:25px;font-size:10px}.entrance-ofuda-word{font-size:26px;margin-top:6px}.entrance-ofuda-stamp{width:26px;height:26px;font-size:20px;margin-top:9px}.entrance-ofuda-foot{bottom:31px;font-size:8px}.entrance-cover-title{font-size:21px}.entrance-ofuda{width:82px;left:calc(55% - 41px)}}
@media(prefers-reduced-motion:reduce){.entrance,.entrance *{animation:none!important;transition:none!important}.entrance.is-leaving{transition:opacity .16s ease!important}}
@media(max-height:480px) and (min-width:600px){.entrance{--entrance-book-w:200px}.entrance-composition{min-height:0;display:grid;grid-template-columns:220px minmax(240px,340px);grid-template-rows:auto auto;column-gap:40px;align-content:center;align-items:center;padding:54px 28px 25px}.entrance-artifact{grid-column:1;grid-row:1/3;justify-self:center}.entrance-heading{grid-column:2;grid-row:1;align-self:end;margin:0}.entrance-heading h1{font-size:32px}.entrance-heading p{font-size:12px;margin-bottom:8px}.entrance-action{grid-column:2;grid-row:2;align-self:start;justify-self:center;margin:25px 0 0}.entrance-action>button{font-size:16px;min-height:47px}.entrance-action>p{font-size:12px;margin-top:12px}.entrance-ofuda-small{margin-top:20px}.entrance-ofuda-word{font-size:24px}.entrance-ofuda-stamp{width:22px;height:22px;font-size:18px;margin-top:7px}.entrance-ofuda-foot{bottom:26px;font-size:7px}.entrance-cover-title{font-size:20px}.entrance-topline{top:12px;left:26px;right:26px}.entrance-topline>span{font-size:12px}.entrance-topline button{font-size:12px}}
@media(max-height:480px) and (max-width:599px){.entrance{overflow-y:auto}.entrance-composition{padding-top:67px;min-height:490px}.entrance-topline{position:absolute}}
