:root{--bg:#fff;--fg:#2b2118;--muted:#6e5f52;--line:#d6ccbe;--surface:#fff;--leather:#4b2e1e;--leather-2:#6e4631;--leather-dark:#2a170e;--gold:#c9a75c;--parchment:#e9dbb8;--parchment-2:#dccb9f;--parchment-edge:#cdb98c;--parchment-line:#b79c6e;--ink:#2b2118;--ribbon:#7a1f2b;--accent:#4b2e1e;--on-accent:#f3e8d2;--focus:#b08d57;--danger:#9b2c2c;--serif:var(--font-serif),"Gowun Batang","Nanum Myeongjo","Apple SD Gothic Neo",serif;--sans:var(--font-sans),"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;--display:var(--font-display),"Cinzel","Times New Roman",serif;--open-scale:1;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--fg);font-family:var(--sans);margin:0;padding-block:0 48px;padding-inline:16px;font-size:16px;line-height:1.5}img{max-width:100%}[hidden]{display:none!important}.wrap{max-width:980px;margin:0 auto}.controls{max-width:480px;margin:0 auto}.top{align-items:center;padding-block:18px 14px;display:flex}.logo{color:var(--fg);align-items:center;gap:10px;text-decoration:none;display:inline-flex}.logo svg{width:24px;height:24px;color:var(--accent)}.logo span{font-family:var(--display);letter-spacing:.24em;padding-left:.1em;font-size:17px;font-weight:700}.foot{color:var(--muted);flex-wrap:wrap;justify-content:center;gap:8px 20px;margin-top:48px;font-size:13px;display:flex}.foot a{color:inherit;text-decoration:none}.foot a:hover{color:var(--fg);text-decoration:underline}.sr{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.btn{min-height:48px;font:500 16px var(--sans);cursor:pointer;border:1px solid #0000;border-radius:12px;justify-content:center;align-items:center;padding:0 20px;text-decoration:none;transition:background-color .2s,color .2s,border-color .2s,transform .15s;display:inline-flex}.btn:active{transform:translateY(1px)}.btn:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.btn.primary{background:var(--accent);color:var(--on-accent);flex:180px}.btn.primary:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn.ghost{color:var(--fg);border-color:var(--line);background:0 0}.btn.ghost:hover{border-color:var(--fg)}.btn.text{color:var(--muted);background:0 0;padding:0 12px}.btn.text:hover{color:var(--fg)}.actions{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}.hint{color:var(--muted);margin:0;font-size:13px}.toast{left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));background:var(--fg);color:var(--bg);opacity:0;pointer-events:none;z-index:10;border-radius:999px;padding:10px 16px;font-size:14px;transition:opacity .25s,transform .25s;position:fixed;transform:translate(-50%)translateY(20px)}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}.page{padding-block:8px 24px}.page h1{font-family:var(--serif);margin:8px 0 18px;font-size:26px}.page h2{margin:28px 0 8px;font-size:17px}.page p,.page li{font-size:15px;line-height:1.7}.page ol,.page ul{padding-left:20px}.copy{flex-wrap:wrap;align-items:center;gap:10px;display:inline-flex}.copy code{font:500 15px var(--sans);background:#f3eee4;border-radius:8px;padding:6px 10px}.hero-wrap{justify-content:center;margin-inline:-16px;display:flex;overflow:hidden}.hero{aspect-ratio:2000/1510;--bw:22cqw;--bh:31cqw;--d:4cqw;flex:none;width:max(100%,860px);max-width:980px;position:relative;container-type:inline-size}.figure{pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:auto;display:block;position:absolute;top:9cqw;left:0;-webkit-mask-image:linear-gradient(#000 80%,#0000 100%);mask-image:linear-gradient(#000 80%,#0000 100%)}.head-text{text-align:center;width:min(70cqw,100vw - 32px);font:700 2.6cqw/1.35 var(--serif);color:var(--ink);text-wrap:balance;word-break:keep-all;margin:0;position:absolute;top:0;left:50%;translate:-50%}.ask{justify-items:center;gap:8px;width:min(42cqw,360px,100vw - 32px);display:grid;position:absolute;top:45cqw;left:50%;translate:-50%}.ask.leaving{animation:.45s forwards askOut}.ask.entering{animation:.4s askIn}@keyframes askOut{to{opacity:0;transform:translateY(14px)scale(.88)}}@keyframes askIn{0%{opacity:0;transform:translateY(10px)scale(.95)}}.askbox{background:var(--surface);border:1px solid var(--line);border-radius:14px;align-items:center;gap:8px;width:100%;min-height:54px;padding:4px 4px 4px 16px;transition:border-color .2s,box-shadow .2s;display:flex;box-shadow:0 10px 30px -14px #2b211873}.askbox:focus-within{border-color:var(--focus);box-shadow:0 0 0 3px #b08d5759,0 10px 30px -14px #2b211873}.askbox input{min-width:0;color:var(--fg);font:400 16px var(--sans);background:0 0;border:0;outline:none;flex:auto;padding:8px 0}.askbox input::placeholder{color:var(--muted)}.count{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:11px}.askbox button{background:var(--accent);min-height:44px;color:var(--on-accent);font:500 15px var(--sans);cursor:pointer;border:0;border-radius:11px;flex:none;padding:0 16px;transition:opacity .2s,transform .15s}.askbox button:disabled{opacity:.45;cursor:not-allowed}.askbox button:active{transform:translateY(1px)}.askbox button:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.err{min-height:0;color:var(--danger);margin:0;font-size:13px}.err:not(:empty){background:var(--surface);border-radius:999px;padding:4px 12px;box-shadow:0 2px 10px #0000001a}.stage{opacity:0;place-items:center;transition:opacity .5s;display:grid;position:absolute;inset:38cqw 0 0}.stage.in{opacity:1}.rise{perspective:1400px;perspective-origin:50% 30%;transition:transform .5s;transform:translateY(18px)scale(.94)}.stage.in .rise{transform:none}.book{width:var(--bw);height:var(--bh);transform-style:preserve-3d;transition:transform .9s cubic-bezier(.25,.7,.2,1);position:relative;transform:rotateX(9deg)rotateY(-26deg)}.book.open{transform:translateX(calc(50% * var(--open-scale))) scale(var(--open-scale))}.pages{transform-style:preserve-3d;position:absolute;inset:0}.back-cover{transform:translateZ(calc(-1 * var(--d) - 4px));background:var(--leather-dark);border-radius:2px 8px 8px 2px;position:absolute;inset:0}.page-top{background:radial-gradient(ellipse at 50% 45%,var(--parchment) 0%,var(--parchment) 55%,var(--parchment-edge) 100%);color:var(--ink);border-radius:2px 6px 6px 2px;align-content:center;justify-items:center;gap:5%;padding:10% 9%;display:grid;position:absolute;inset:0;box-shadow:inset 0 0 46px #5a3c1447,inset -14px 0 22px -18px #0000004d}.edge-r{width:var(--d);transform-origin:0;background:repeating-linear-gradient(90deg,var(--parchment) 0 2px,var(--parchment-line) 2px 3px);border-radius:0 3px 3px 0;height:100%;position:absolute;top:0;left:100%;transform:rotateY(90deg)}.edge-t{width:100%;height:var(--d);transform-origin:bottom;transform-style:preserve-3d;background:repeating-linear-gradient(0deg,var(--parchment) 0 2px,var(--parchment-line) 2px 3px);position:absolute;bottom:100%;left:0;transform:rotateX(90deg)}.flag{left:12%;bottom:calc(var(--pos,.5) * (100% - 3px));transform-origin:bottom;background:var(--ribbon);border-radius:2px 2px 0 0;width:6%;height:70%;transition:bottom .12s linear;position:absolute;transform:rotateX(-90deg);box-shadow:0 2px 4px #0000004d}.flag:after{content:"";background:#ffffff2e;height:28%;position:absolute;top:0;left:0;right:0}.cover{transform-origin:0;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,.7,.2,1);position:absolute;inset:0;transform:translateZ(4px)}.book.open .cover{transform:translateZ(4px)rotateY(-180deg)}.face{backface-visibility:hidden;border-radius:2px 10px 10px 2px;position:absolute;inset:0}.face.front{background:radial-gradient(120% 100% at 25% 15%,var(--leather-2) 0%,var(--leather) 45%,var(--leather-dark) 100%);align-content:center;justify-items:center;gap:5%;padding:10% 10% 10% 14%;display:grid;box-shadow:inset 0 0 0 1px #ffffff0d,inset 14px 0 22px -16px #000c,6px 10px 28px -12px #0009}.face.front:before{content:"";background:linear-gradient(90deg,#00000073,#0000),repeating-linear-gradient(#0000 0 54px,#c9a75c73 54px 56px,#0000 56px 68px);border-radius:2px 0 0 2px;width:8%;position:absolute;top:0;bottom:0;left:0}.face.front:after{content:"";border:1px solid var(--gold);outline:1px solid var(--gold);outline-offset:4px;opacity:.75;pointer-events:none;border-radius:2px;position:absolute;inset:7% 7% 7% 12%}.face.back{background:radial-gradient(ellipse at 50% 50%,var(--parchment-2) 0%,var(--parchment-2) 50%,var(--parchment-edge) 100%);color:var(--ink);align-content:center;justify-items:start;gap:4%;padding:10% 11%;display:grid;transform:rotateY(180deg);box-shadow:inset 14px 0 22px -18px #0000004d,inset 0 0 40px #5a3c1438}.face.back:after{content:"";pointer-events:none;border:1px solid #4b2e1e59;position:absolute;inset:5%}.orn{background:var(--gold);opacity:.9;width:30%;height:1px;position:relative}.orn:after{content:"";background:var(--gold);width:7px;height:7px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(45deg)}.title{font-family:var(--display);letter-spacing:.18em;text-align:center;color:var(--gold);text-shadow:0 1px #000000a6,0 -1px #ffffff12;font-size:4cqw;font-weight:700;line-height:1.15}.sub{font-family:var(--display);letter-spacing:.34em;color:var(--gold);opacity:.85;font-size:max(10px,1.3cqw)}.q-eyebrow{font-family:var(--display);letter-spacing:.32em;color:#6e5a42;font-size:max(9px,1.2cqw)}.q-text{font-family:var(--serif);word-break:keep-all;overflow-wrap:anywhere;font-size:2.1cqw;line-height:1.5}.ans{font-family:var(--serif);text-align:center;word-break:keep-all;overflow-wrap:anywhere;opacity:0;font-size:3.3cqw;font-weight:700;line-height:1.45;transition:opacity .5s .55s,transform .5s .55s;transform:translateY(6px)}.book.open .ans{opacity:1;transform:none}.ans-foot{font-family:var(--display);letter-spacing:.32em;color:#6e5a42;opacity:0;font-size:max(9px,1.2cqw);transition:opacity .4s .8s}.book.open .ans-foot{opacity:1}.book.open .flag{opacity:0;transition:opacity .3s}.book.still,.book.still .cover,.book.still .ans,.book.still .ans-foot{transition:none}.fade{opacity:0;transition:opacity .45s}.fade.in{opacity:1}.edge-ctl{gap:6px;margin-top:6px;display:grid}.edge-head{color:var(--muted);font-size:13px}input[type=range]{appearance:none;cursor:grab;background:0 0;width:100%;height:56px;margin:0}input[type=range]:active{cursor:grabbing}input[type=range]::-webkit-slider-runnable-track{background:repeating-linear-gradient(90deg,var(--parchment) 0 3px,var(--parchment-line) 3px 4px);height:40px;box-shadow:inset 0 0 0 1px var(--parchment-line),inset 0 0 18px #5a3c142e;border-radius:5px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--ribbon);border:0;border-radius:3px;width:22px;height:52px;margin-top:-6px;box-shadow:0 2px 6px #00000059}input[type=range]::-moz-range-track{background:repeating-linear-gradient(90deg,var(--parchment) 0 3px,var(--parchment-line) 3px 4px);height:40px;box-shadow:inset 0 0 0 1px var(--parchment-line);border-radius:5px}input[type=range]::-moz-range-thumb{background:var(--ribbon);border:0;border-radius:3px;width:22px;height:52px;box-shadow:0 2px 6px #00000059}input[type=range]:focus-visible{outline:3px solid var(--focus);outline-offset:4px}input[type=range]:disabled{opacity:.55;cursor:default}.edge-foot{color:var(--muted);font-variant-numeric:tabular-nums;justify-content:space-between;font-size:12px;display:flex}.result-stage{perspective:1400px;perspective-origin:50% 30%;--bw:220px;--bh:310px;--d:40px;place-items:center;padding-block:12px 8px;display:grid}.result-stage .book{--open-scale:1}.result-stage .title{font-size:34px}.result-stage .sub,.result-stage .q-eyebrow,.result-stage .ans-foot{font-size:10px}.result-stage .q-text{font-size:18px}.result-stage .ans{font-size:28px}@media (max-width:480px){:root,.result-stage{--open-scale:.78}}@media (max-width:360px){:root,.result-stage{--open-scale:.72}}@media (max-width:330px){:root,.result-stage{--open-scale:.62}}@media (prefers-reduced-motion:reduce){.btn,.toast,.book,.cover,.ans,.ans-foot,.flag,.stage,.rise,.fade{transition:none}.ask.leaving,.ask.entering{animation:none}}