.guide-unlock{position:fixed;inset:0;margin:auto;width:min(1180px,96vw);height:min(740px,94dvh);max-width:none;max-height:none;padding:0;border:1px solid #dac19965;border-radius:18px;overflow:hidden;background:#151015;color:#f8eddd;box-shadow:0 30px 160px #000c;text-align:left;isolation:isolate}
.guide-unlock::backdrop{background:#08060dec;backdrop-filter:blur(14px)}
.unlock-art{position:absolute;inset:0 29% 0 0;overflow:hidden;opacity:.18;filter:blur(8px);transition:opacity 1.8s,filter 1.8s}
.unlock-art img{width:100%;height:100%;object-fit:cover;object-position:50% 32%;transform:scale(1.1);transition:transform 7s ease-out;display:block}
.unlock-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#15101500 35%,#15101555 70%,#151015 100%),linear-gradient(0deg,#151015b0,transparent 40%)}
.unlock-halo{position:absolute;inset:0;background:radial-gradient(ellipse at 35% 55%,#e7c19922,transparent 70%);mix-blend-mode:screen;animation:unlock-warmth 6s ease-in-out infinite alternate}
.unlock-border{position:absolute;inset:12px;border:1px solid #dbba8538;border-radius:9px;pointer-events:none;z-index:2}
.unlock-border::before,.unlock-border::after{content:'✦';position:absolute;color:var(--unlock-accent);font-size:23px;top:-16px;left:20px;text-shadow:0 0 14px var(--unlock-accent)}
.unlock-border::after{top:auto;left:auto;bottom:-16px;right:20px}
.unlock-skip{position:absolute;right:25px;top:24px;z-index:5;border:1px solid #decbb347;border-radius:30px;padding:10px 18px;min-height:44px;color:#efe2d2;background:#150e19b3;font:inherit;font-size:12px;cursor:pointer;backdrop-filter:blur(8px)}
.unlock-skip:hover{background:#45303e}.guide-unlock button:focus-visible{outline:2px solid #fff0cf;outline-offset:4px}
.unlock-content{position:relative;margin-left:60%;width:40%;height:100%;padding:88px 44px 40px 10px;display:flex;flex-direction:column;justify-content:center;opacity:0;transform:translateY(20px);transition:opacity 1s .45s,transform 1.3s .45s;box-sizing:border-box;overflow:auto}
.unlock-kicker{color:var(--unlock-accent);font-size:12px;letter-spacing:.2em;margin:0 0 22px}
.unlock-identity{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:10px;color:#c9bdac;letter-spacing:.1em;border-bottom:1px solid #cbb18a42;padding-bottom:14px;margin-bottom:24px}
.unlock-identity>span:first-child{font-size:15px;letter-spacing:.25em;color:var(--unlock-accent)}
.unlock-subtitle{color:#c3af9e;font-size:12px;margin:0 0 12px}.unlock-moment h2{font-family:Georgia,'Noto Serif KR',serif;font-size:clamp(28px,3.25vw,43px);letter-spacing:-.06em;line-height:1.45;font-weight:500;color:#fff0dc;margin:0 0 20px;word-break:keep-all}
.unlock-aside{font-size:13px;line-height:1.85;color:#bba99d;word-break:keep-all;margin:0 0 22px}
.unlock-moment blockquote{margin:0;padding:0 0 0 16px;border-left:1px solid var(--unlock-accent)}
.unlock-moment blockquote>span{font-size:12px;color:var(--unlock-accent)}
.unlock-moment blockquote p{margin:9px 0 0;font-size:17px;line-height:1.8;word-break:keep-all;color:#f3e3d2}
.unlock-progress{display:flex;gap:6px;margin:28px 0 16px}.unlock-progress i{width:19px;height:3px;background:#7768666b;border-radius:3px;transition:width .4s,background .4s}.unlock-progress i.is-active{width:42px;background:var(--unlock-accent);box-shadow:0 0 12px #e2bd8c66}
.unlock-next{font:inherit;font-size:14px;min-height:50px;padding:14px 16px;border:1px solid #e6c9a775;border-radius:9px;color:#25151a;background:linear-gradient(100deg,#e7c7a0,var(--unlock-accent));box-shadow:0 5px 25px #edc2a41c;cursor:pointer;flex-shrink:0}
.unlock-next:hover{filter:brightness(1.1)}.unlock-footnote{font-size:11px;color:#af9b8f;text-align:center;line-height:1.6;margin:13px 0 0}
.unlock-seal{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse,#32222bd9,#120d18ee);transition:opacity 1.3s,visibility 1.3s;pointer-events:none}
.unlock-seal svg{width:62px;height:62px;color:var(--unlock-accent);filter:drop-shadow(0 0 20px #edcbaa99)}
.unlock-seal span{position:absolute;top:calc(50% + 100px);font-size:13px;letter-spacing:.18em;color:#e2c9aa}
.unlock-orbit{position:absolute;width:170px;height:170px;border:1px solid #cfb5826b;border-radius:50%;box-shadow:0 0 65px #e3bb7626,inset 0 0 50px #e3bb7612;animation:unlock-orbit 9s linear infinite}
.unlock-orbit::before{content:'';position:absolute;inset:13px;border:1px dashed #e6cdae77;border-radius:50%}.unlock-orbit::after{content:'✦';position:absolute;top:-15px;left:72px;color:var(--unlock-accent);font-size:22px}
.unlock-shackle{transform-origin:22px 30px;transition:transform .9s}
.unlock-dust{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:0;transition:opacity 2s}
.unlock-dust i{position:absolute;left:var(--x);top:var(--y);height:var(--size);width:var(--size);border-radius:50%;background:var(--unlock-accent);box-shadow:0 0 10px var(--unlock-accent);opacity:0;animation:unlock-drift 6s var(--d) ease-in-out infinite}
.guide-unlock.is-revealed .unlock-art{opacity:1;filter:none}.guide-unlock.is-revealed .unlock-art img{transform:scale(1)}
.guide-unlock.is-revealed .unlock-seal{opacity:0;visibility:hidden}.guide-unlock.is-revealed .unlock-shackle{transform:rotate(-35deg)}
.guide-unlock.is-revealed .unlock-content{opacity:1;transform:none}.guide-unlock.is-revealed .unlock-dust{opacity:1}
.guide-unlock[data-moment="1"] .unlock-art img{transform:scale(1.065)}.guide-unlock[data-moment="1"] .unlock-moment{animation:unlock-line .75s ease-out}
@keyframes unlock-orbit{to{transform:rotate(360deg)}}@keyframes unlock-warmth{to{opacity:.3}}
@keyframes unlock-drift{0%,100%{opacity:0;transform:translateY(15px)}35%,65%{opacity:.65}90%{transform:translateY(-40px)}}
@keyframes unlock-line{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:700px){
 .guide-unlock{width:100%;height:100dvh;border-radius:0;border:0}
 .unlock-art{inset:0 0 auto;height:53%;}.unlock-art img{object-position:50% 27%}
 .unlock-art::after{background:linear-gradient(0deg,#151015,transparent 50%)}
 .unlock-content{margin:0;width:100%;position:absolute;inset:auto 0 0;height:55%;padding:5px 28px 24px;justify-content:flex-start;background:linear-gradient(#15101500,#151015 15%)}
 .unlock-kicker{margin:0 0 12px;font-size:10px}.unlock-identity{margin-bottom:12px;padding-bottom:10px}
 .unlock-moment h2{font-size:29px;line-height:1.35;margin-bottom:12px}.unlock-subtitle{font-size:10px;margin-bottom:7px}
 .unlock-aside{font-size:11px;line-height:1.65;margin-bottom:12px}.unlock-moment blockquote p{font-size:14px;line-height:1.65;margin-top:5px}
 .unlock-progress{margin:17px 0 12px}.unlock-footnote{margin-top:10px;font-size:10px}
 .unlock-skip{right:20px;top:max(20px,env(safe-area-inset-top));font-size:11px}.unlock-border{inset:10px}
}
@media(max-width:700px) and (max-height:740px){.unlock-art{height:44%}.unlock-content{height:63%;padding-bottom:18px}.unlock-kicker{margin-bottom:8px}.unlock-moment h2{font-size:25px}.unlock-aside{display:none}.unlock-identity{margin-bottom:10px}.unlock-progress{margin-top:12px}}
@media(min-width:701px) and (max-height:640px){.unlock-content{padding-top:64px;padding-bottom:20px}.unlock-kicker{margin-bottom:12px}.unlock-identity{margin-bottom:12px}.unlock-moment h2{font-size:28px;margin-bottom:12px}.unlock-aside{font-size:11px;margin-bottom:10px}.unlock-moment blockquote p{font-size:14px}.unlock-progress{margin-top:15px}}
@media(prefers-reduced-motion:reduce){.guide-unlock *,.guide-unlock *::before,.guide-unlock *::after{animation:none!important;transition:none!important}.unlock-dust{display:none}.guide-unlock .unlock-art img{transform:none!important}}