@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#273730;--green:#294f3c;--cream:#f6f4ec;--orange:#d86b46;--line:#dcded3;--muted:#7c8277}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Noto Sans KR',sans-serif;font-size:14px}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #d86b46;outline-offset:4px}header{height:90px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 5vw}.brand{color:var(--green);text-decoration:none;font-size:30px;display:flex;gap:12px;align-items:center}.brand b{font-size:22px;letter-spacing:-1px}.brand span{font-size:9px;letter-spacing:2px;border-left:1px solid #aaa;padding-left:15px;width:100px}nav{display:flex;align-items:center;gap:30px}nav button{background:none;border:0;font-size:13px}.proto,.eyebrow{font-size:10px;letter-spacing:2px}.proto{border:1px solid #b5bcb0;border-radius:20px;padding:7px 12px;color:#727d70}main{max-width:1440px;margin:auto;padding:0 5vw}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:520px;align-items:center;gap:30px}.eyebrow{color:var(--orange);font-weight:700}.hero h1{font-size:57px;line-height:1.24;letter-spacing:-3.5px;margin:23px 0}.hero h1 em{font-style:normal;color:var(--orange)}.intro{color:#777e73;line-height:1.95;font-size:14px}.primary{background:var(--green);color:white;border:0;padding:15px 24px;border-radius:5px;font-weight:600}.hero .primary{margin-top:23px}.smallnote{font-size:11px;color:#8b8e82;margin-left:15px}.art{position:relative}.art svg{width:100%;max-height:440px;overflow:visible}.float{animation:float 4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.pulse{animation:pulse 2s infinite}.artlabel{position:absolute;background:#fffdf8;border:1px solid #e1dfd2;padding:12px 17px;border-radius:7px;box-shadow:0 8px 25px #3a46300d;font-size:11px;bottom:43px;left:20px}.artlabel b{color:var(--orange)}@keyframes float{50%{transform:translateY(-7px)}}@keyframes pulse{50%{opacity:.4}}.strip{display:flex;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;justify-content:space-between;color:#6f796a;font-size:12px}.strip b{color:#364e3c;margin-right:12px}.sectionhead{display:flex;align-items:end;justify-content:space-between;margin:43px 0 22px}.sectionhead h2{margin:8px 0 0;font-size:26px;letter-spacing:-1px}.sectionhead p{margin:0;color:var(--muted);font-size:12px}.filters{display:flex;gap:7px;margin-bottom:22px}.filters button,.tag{border:1px solid var(--line);background:transparent;border-radius:4px;padding:7px 14px;font-size:11px}.filters button.active{background:var(--green);color:white;border-color:var(--green)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:#fffdf7;border:1px solid #dddfd4;border-radius:9px;overflow:hidden;transition:transform .2s;cursor:pointer;text-align:left;padding:0}.card:hover{transform:translateY(-5px);box-shadow:0 12px 26px #253c2e10}.thumb{height:155px;position:relative;overflow:hidden;background:#e2e7dc;display:flex;justify-content:center;align-items:center}.thumb svg{width:80%;height:155px}.thumb .num{position:absolute;left:20px;top:17px;font-size:10px;letter-spacing:2px;color:#61725e}.cardbody{padding:22px}.level{font-size:10px;color:#4c775b}.card h3{font-size:20px;letter-spacing:-.7px;margin:9px 0}.card p{font-size:12px;line-height:1.8;color:var(--muted);min-height:43px}.cardfoot{display:flex;justify-content:space-between;border-top:1px solid #e6e7df;margin-top:20px;padding-top:15px;font-size:11px;color:#82907e}.arrow{color:var(--orange)}footer{display:flex;justify-content:space-between;gap:20px;margin-top:45px;border-top:1px solid var(--line);padding:25px 0;color:#8a8d80;font-size:10px}.gamehead{display:flex;justify-content:space-between;align-items:center;padding:26px 0}.back{background:none;border:0;color:#788270}.gamehead h2{font-size:22px;margin:0}.game{display:grid;grid-template-columns:1.15fr 1fr;gap:23px}.scene{background:#e5e9de;border-radius:10px;position:relative;min-height:400px;display:flex;align-items:center}.scene svg{width:100%}.hotspot{position:absolute;border:1px solid white;background:#fffefaeb;border-radius:22px;padding:10px 15px;box-shadow:0 4px 20px #294f3c22;font-size:12px}.hotspot:hover{background:#f6dfad}.h1{left:10%;top:28%}.h2{right:6%;top:42%}.h3{left:30%;bottom:17%}.panel{background:#fffdf7;border:1px solid var(--line);border-radius:9px;padding:25px}.panel h3{margin-top:0;font-size:18px}.panel p{color:#73806e;line-height:1.85;font-size:13px}.tabs{display:flex;gap:5px;margin:22px 0 18px}.tabs button{flex:1;border:1px solid var(--line);background:transparent;padding:11px 4px;font-size:12px;border-radius:5px}.tabs .active{background:var(--green);color:white}.doclist{display:grid;gap:8px}.doclist button,.question{border:1px solid var(--line);border-radius:5px;background:#f7f6ef;text-align:left;padding:13px;display:flex;justify-content:space-between;width:100%}.checked{color:#50765a}.progress{height:5px;background:#e1e4d8;border-radius:10px;margin:15px 0}.progress span{display:block;height:100%;background:var(--orange);border-radius:10px}.statusrow{display:flex;justify-content:space-between;font-size:11px;color:#7f8778}.dialogue{padding:17px;background:#edf0e6;border-radius:6px;font-size:13px;line-height:1.85;margin:12px 0}.question{margin:8px 0;font-size:12px}.clause{background:#f5f2e8;border:1px solid #dddccf;padding:12px;border-radius:5px;margin:7px 0;font-size:11px;line-height:1.75;cursor:grab}.clause.selected{border-color:#728d74;background:#eaf0e4}.drop{border:2px dashed #b8c6ae;padding:15px;border-radius:6px;min-height:80px;background:#f5f7ed;margin:12px 0}.drop p{margin:0;font-size:11px}.clause small{display:block;color:#8f917e}.actions{display:flex;gap:8px;margin-top:17px;flex-wrap:wrap}.secondary{padding:12px 17px;background:transparent;border:1px solid #bbc3b3;border-radius:5px;font-size:12px}.bottomgrid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}.notebook{font-size:12px;color:#66745f;line-height:1.8}.paper{background:#fffdf6;border:1px solid #ddd9ca;padding:24px;line-height:1.9;font-size:13px}.paper h3{text-align:center;letter-spacing:3px}.paper hr{border:0;border-top:1px solid #dad7c9}.paper .stamp{color:#bd5e47;border:2px solid #bd5e47;display:inline-block;padding:3px 9px;transform:rotate(-9deg);float:right}.paper button{margin-top:20px}dialog{width:min(660px,94vw);border:1px solid #d7dacd;border-radius:12px;padding:32px;background:var(--cream);color:var(--ink);max-height:88vh}dialog::backdrop{background:#20352680;backdrop-filter:blur(4px)}.close{position:absolute;right:16px;top:10px;border:0;background:transparent;font-size:26px}.resulticon{font-size:50px;color:var(--orange)}.result h2{font-size:29px}.result p{line-height:1.85;color:#6c7865}.source{display:block;padding:15px 0;border-bottom:1px solid var(--line);color:var(--green);text-decoration:none;font-size:13px}.source small{display:block;color:#8a8f80;font-size:11px;margin-top:6px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#273e2f;color:white;padding:14px 22px;border-radius:7px;opacity:0;pointer-events:none;transition:.2s;max-width:90vw;font-size:12px;z-index:10}#toast.show{opacity:1}.setting{display:flex;align-items:center;gap:7px;font-size:11px}.setting select{padding:7px;background:#fffdf7;border:1px solid var(--line);border-radius:4px;color:var(--green)}.courtchoices{display:grid;gap:9px}.courtchoices button{text-align:left;padding:14px;border:1px solid var(--line);background:#fffdf7;border-radius:6px}.notice{padding:12px;background:#eeeadd;color:#7e806e;font-size:11px;line-height:1.8}.badge{font-size:10px;background:#f1e8d8;border-radius:20px;padding:5px 9px;color:#a1764f}.empty{font-size:12px;color:#929581} @media(max-width:850px){header{height:75px;padding:0 5vw}.brand span,.proto{display:none}nav{gap:6px}.hero{grid-template-columns:1fr;padding-top:45px;gap:0}.hero h1{font-size:43px}.art svg{max-height:330px}.strip{flex-wrap:wrap;gap:15px}.grid{grid-template-columns:1fr 1fr}.game,.bottomgrid{grid-template-columns:1fr}.gamehead{flex-wrap:wrap;gap:15px}.scene{min-height:300px}.sectionhead{align-items:start;gap:10px}.sectionhead p{max-width:130px}.smallnote{display:block;margin:12px 0}.setting{width:100%}}@media(max-width:520px){.grid{grid-template-columns:1fr}.hero h1{font-size:40px}.brand b{font-size:18px}nav button{font-size:11px}.filters{flex-wrap:wrap}.strip{font-size:10px}.thumb{height:170px}.gamehead h2{font-size:18px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:360px){.hero h1{font-size:30px;letter-spacing:-1.8px}.gamehead h2{font-size:16px}.scene{min-height:245px}.hotspot{font-size:10px;padding:8px 10px}.panel{padding:18px}.brand{gap:6px}.brand b{font-size:17px}.sectionhead h2{font-size:22px}}
