/* 고양이점프 STAGE 7 — 뉴욕 산책냥. static/catjump_ny.js 와 함께 쓴다. */
.ny-root { position:absolute; inset:0; z-index:6; overflow:hidden; display:none; background:#101626; color:#f2f5ff; font-family:system-ui,-apple-system,"Noto Sans KR",sans-serif; -webkit-user-select:none; user-select:none; touch-action:none; }
.ny-root.on { display:block; }
@keyframes nyTwinkle { to { opacity:.4; } } @keyframes spDrift { to { background-position:-340px 250px; } }
.ny-ents { position:absolute; inset:0; }
.ny-ent { position:absolute; width:0; height:0; }
.ny-ent > svg { position:absolute; overflow:visible; pointer-events:none; filter:drop-shadow(0 6px 5px rgba(0,0,0,.45)); }
.ny-ent .lab { position:absolute; left:0; bottom:100%; transform:translateX(-50%); margin-bottom:6px; padding:3px 12px; border:1px solid rgba(190,208,255,.5); border-radius:99px; background:rgba(8,12,36,.78); color:#e6eeff; font-size:12px; font-weight:600; letter-spacing:.12em; white-space:nowrap; opacity:0; transition:opacity .2s; pointer-events:none; }
.ny-ent.near .lab { opacity:1; }
.ny-ent.near > svg { filter:drop-shadow(0 0 10px rgba(160,200,255,.9)); }
.ny-ent.done > svg { opacity:.35; filter:none; }
.ny-ent.hid > svg { opacity:.5; animation:nyTwinkle 1.6s ease-in-out infinite alternate; }
.ny-me { position:absolute; width:0; height:0; }
.ny-me svg { position:absolute; left:-30px; top:-72px; width:60px; height:72px; overflow:visible; filter:drop-shadow(0 6px 5px rgba(0,0,0,.5)); }
.ny-me.walk svg { animation:nyBob .34s ease-in-out infinite alternate; } .ny-me.moon.walk svg { animation:nyHop .7s ease-in-out infinite; }
.ny-me.left svg { transform:scaleX(-1); }
@keyframes nyBob { to { translate:0 -4px; } } @keyframes nyHop { 50% { translate:0 -26px; } }
.ny-me.stretch svg { animation:spStretch 1.6s ease-in forwards; }
.ny-bubble { position:absolute; z-index:4; padding:4px 12px; border:1px solid rgba(190,208,255,.4); border-radius:12px; background:rgba(8,12,36,.8); color:#dfe9ff; font-size:13px; font-weight:600; letter-spacing:.06em; pointer-events:none; animation:nyBub 3.4s ease-out forwards; }
@keyframes nyBub { 0% { opacity:0; } 12%,80% { opacity:1; } 100% { opacity:0; } }
.ny-hud { position:absolute; z-index:10; left:max(16px,env(safe-area-inset-left)); top:12px; pointer-events:none; }
.ny-kicker { color:#9fb9e8; font-size:11px; letter-spacing:.34em; text-transform:uppercase; }
.ny-title { margin-top:4px; font-size:clamp(1.15rem,3.4vw,1.8rem); font-weight:300; letter-spacing:.14em; color:#f4f7ff; text-shadow:0 0 18px rgba(120,160,255,.5); }
.ny-btns { position:absolute; z-index:12; left:max(16px,env(safe-area-inset-left)); top:104px; display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.ny-btn { padding:6px 14px; border:1px solid rgba(190,208,255,.4); border-radius:99px; background:rgba(8,12,36,.7); color:#dfe9ff; font:inherit; font-size:12px; letter-spacing:.14em; cursor:pointer; backdrop-filter:blur(4px); }
.ny-pad { position:absolute; z-index:12; left:max(14px,env(safe-area-inset-left)); bottom:14px; width:150px; height:150px; display:none; touch-action:none; }
.ny-pad button { position:absolute; width:50px; height:50px; padding:0; border:1px solid rgba(190,208,255,.6); border-radius:14px; background:rgba(20,30,80,.55); color:#e6eeff; font-size:18px; touch-action:none; backdrop-filter:blur(3px); }
.ny-pad .u { left:50px; top:0; } .ny-pad .d { left:50px; top:100px; } .ny-pad .l { left:0; top:50px; } .ny-pad .r { left:100px; top:50px; }
.ny-a { position:absolute; z-index:12; right:max(16px,env(safe-area-inset-right)); bottom:22px; width:84px; height:84px; padding:0; border:1px solid rgba(190,208,255,.7); border-radius:50%; background:rgba(60,90,200,.55); color:#fff; font-size:17px; letter-spacing:.1em; display:none; touch-action:none; backdrop-filter:blur(3px); }
@media (pointer:coarse) { .ny-pad, .ny-a { display:block; } }
.ny-dlg { position:absolute; z-index:20; left:50%; bottom:8px; width:min(86%,720px); transform:translateX(-50%); display:none; padding:11px 18px 7px; border:1px solid rgba(190,208,255,.32); border-radius:16px; background:rgba(6,10,34,.88); backdrop-filter:blur(8px); box-shadow:0 10px 40px rgba(0,0,0,.6); }
.ny-dlg.on { display:block; }
.ny-dlg .nm { position:absolute; left:18px; top:-13px; padding:2px 14px; border-radius:99px; background:#2a3f9a; color:#eaf0ff; font-size:12px; letter-spacing:.16em; }
.ny-dlg .tx { min-height:34px; font-size:15px; line-height:1.55; font-weight:400; letter-spacing:.03em; color:#eef2ff; white-space:pre-wrap; word-break:keep-all; }
.ny-dlg .more { text-align:right; font-size:11px; letter-spacing:.2em; color:#8fb0ff; animation:nyTwinkle .8s infinite alternate; }
.ny-dlg .choices { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.ny-dlg .choices button, .ny-quiz button, .ny-card button { font:inherit; }
.ny-dlg .choices button { padding:8px 18px; border:1px solid rgba(190,208,255,.5); border-radius:12px; background:rgba(40,60,150,.5); color:#f2f5ff; font-size:15px; cursor:pointer; }
.ny-toast { position:absolute; z-index:24; left:50%; top:14%; transform:translate(-50%,0); padding:8px 22px; border:1px solid rgba(190,208,255,.4); border-radius:99px; background:rgba(8,12,40,.88); color:#eaf0ff; font-size:14px; letter-spacing:.1em; opacity:0; pointer-events:none; white-space:nowrap; }
.ny-toast.go { animation:nyToast 2.6s ease-out; } @keyframes nyToast { 0% { opacity:0; transform:translate(-50%,10px); } 12%,80% { opacity:1; transform:translate(-50%,0); } 100% { opacity:0; } }
.ny-fade { position:absolute; z-index:30; inset:0; background:#101626; opacity:0; pointer-events:none; transition:opacity .4s; }
.ny-fade.on { opacity:1; } .ny-fade.warp { background:radial-gradient(circle,#fff 0,#9fc0ff 30%,#101626 80%); }
.ny-over { position:absolute; z-index:40; inset:0; display:none; place-items:center; background:rgba(10,14,28,.86); }
.ny-over.on { display:grid; }
.ny-card { width:min(94%,620px); max-height:94%; overflow:auto; padding:22px 24px; border:1px solid rgba(190,208,255,.3); border-radius:18px; background:rgba(8,12,40,.94); text-align:center; box-shadow:0 0 70px rgba(70,100,220,.3); touch-action:pan-y; }
.ny-card h3 { margin:0 0 6px; font-size:1.5rem; font-weight:300; letter-spacing:.18em; color:#fff; }
.ny-card .kk { color:#9fb9e8; font-size:11px; letter-spacing:.34em; }
.ny-card p { margin:10px 0; color:rgba(222,230,252,.78); font-size:.92rem; line-height:1.7; letter-spacing:.03em; }
.ny-card ul { list-style:none; margin:10px 0; padding:0; text-align:left; } .ny-card li { padding:7px 4px; border-bottom:1px solid rgba(190,208,255,.15); font-size:.9rem; color:#cfd9f5; } .ny-card li.d { color:#8fffd0; } .ny-card li.h { color:#ffe08a; }
.ny-card .row { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-top:12px; }
.ny-card button { padding:8px 18px; border:1px solid rgba(190,208,255,.5); border-radius:99px; background:rgba(50,80,200,.55); color:#fff; font-size:.88rem; letter-spacing:.1em; cursor:pointer; } .ny-card button.sub { background:transparent; }
.ny-view { position:absolute; left:0; top:0; width:960px; height:500px; transform-origin:0 0; overflow:visible; }
.ny-clip { position:absolute; left:-340px; top:0; width:1640px; height:500px; overflow:hidden; }
.ny-sky { position:absolute; inset:0; background:linear-gradient(var(--sk1,#7ec8ff),var(--sk2,#f5e6c8)); }
.ny-sun { position:absolute; left:var(--sunx,700px); top:var(--suny,60px); width:70px; height:70px; border-radius:50%; background:radial-gradient(circle,#fff8d0,#ffd860 60%,rgba(255,200,80,0)); filter:blur(1px); }
.ny-far, .ny-mid, .ny-cam { position:absolute; top:0; left:0; height:500px; will-change:transform; }
.ny-far svg, .ny-mid svg { position:absolute; left:0; bottom:0; display:block; }
.ny-glow { position:absolute; inset:0; pointer-events:none; mix-blend-mode:screen; background:radial-gradient(ellipse at 50% 100%,rgba(255,90,160,.35),transparent 60%); opacity:var(--night,0); }
.ny-shade { position:absolute; inset:0; pointer-events:none; background:#0a0e30; opacity:calc(var(--night,0)*.42); }
.ny-ground { position:absolute; left:0; top:0; height:500px; }
.ny-prop { position:absolute; width:0; height:0; pointer-events:none; }
.ny-prop > svg { position:absolute; overflow:visible; filter:drop-shadow(0 5px 4px rgba(0,0,0,.35)); }
.ny-neon { animation:nyNeon 2.4s ease-in-out infinite alternate; } @keyframes nyNeon { 0%,100% { filter:brightness(1); } 50% { filter:brightness(1.5) drop-shadow(0 0 6px currentColor); } }
.ny-steam { position:absolute; width:26px; height:40px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.8),rgba(255,255,255,0)); animation:nySteam 2.6s ease-out infinite; opacity:0; }
@keyframes nySteam { 0% { transform:translateY(0) scale(.5); opacity:0; } 30% { opacity:.8; } 100% { transform:translateY(-60px) scale(1.6); opacity:0; } }
.ny-car { position:absolute; width:0; height:0; }
.ny-car svg { position:absolute; left:-46px; top:-34px; width:92px; height:40px; overflow:visible; filter:drop-shadow(0 4px 3px rgba(0,0,0,.35)); }
.ny-zone { position:absolute; z-index:11; left:50%; top:46px; transform:translateX(-50%); padding:6px 22px; border:1px solid rgba(255,207,51,.6); border-radius:99px; background:rgba(16,22,38,.84); color:#ffe18a; font-size:13px; letter-spacing:.24em; white-space:nowrap; opacity:0; pointer-events:none; }
.ny-zone.go { animation:nyToast 3.4s ease-out; }
@keyframes nyToast { 0% { opacity:0; transform:translate(-50%,8px); } 12%,80% { opacity:1; transform:translate(-50%,0); } 100% { opacity:0; } }
.ny-meet { margin-top:6px; font-size:12px; letter-spacing:.2em; color:#ffe18a; }
.ny-title { font-weight:800; letter-spacing:.06em; }
.ny-kicker { color:#ffcf33; }
.ny-lesson { position:absolute; z-index:22; inset:0; display:none; place-items:center; background:rgba(10,14,28,.55); backdrop-filter:blur(2px); }
.ny-lesson.on { display:grid; }
.ny-lbox { width:min(92%,620px); padding:16px 22px 16px; border:1px solid rgba(255,207,51,.55); border-radius:18px; background:rgba(18,24,44,.94); text-align:center; box-shadow:0 0 50px rgba(255,200,60,.18); }
.ny-lbox .lk { color:#ffcf33; font-size:11px; letter-spacing:.34em; }
.ny-lbox .en { margin:8px 0 4px; font-size:clamp(1.25rem,4vw,1.9rem); font-weight:700; letter-spacing:.02em; color:#fff; line-height:1.3; }
.ny-lbox .ko { color:#cfd9f5; font-size:15px; }
.ny-lbox .tip { margin:10px 0 0; padding:8px 12px; border-radius:10px; background:rgba(255,207,51,.1); color:#ffe9a8; font-size:13px; line-height:1.6; word-break:keep-all; }
.ny-lbox .row { display:flex; gap:8px; justify-content:center; margin-top:12px; }
.ny-lbox button { padding:8px 18px; border:1px solid rgba(255,207,51,.6); border-radius:99px; background:rgba(255,207,51,.16); color:#ffe9a8; font:inherit; font-size:14px; cursor:pointer; } .ny-lbox button.go { background:#ffcf33; color:#2a2000; font-weight:700; }
.ny-card li { display:flex; justify-content:space-between; gap:10px; cursor:pointer; } .ny-card li b { color:#ffe18a; font-weight:600; } .ny-card li span { color:#9fb0d8; font-size:.8rem; text-align:right; }
.ny-card li.no { opacity:.35; cursor:default; }
.ny-card h3 { color:#ffe18a; } .ny-card .kk { color:#ffcf33; }
.ny-card button { border-color:rgba(255,207,51,.6); background:rgba(255,207,51,.16); color:#ffe9a8; } .ny-card button.sub { background:transparent; }
.ny-dlg .nm { background:#b8860b; color:#fff; } .ny-dlg { border-color:rgba(255,207,51,.4); }
.ny-dlg .choices button { border-color:rgba(255,207,51,.6); background:rgba(255,207,51,.14); color:#ffe9a8; }
.ny-pad button { border-color:rgba(255,207,51,.6); background:rgba(40,40,60,.55); } .ny-a { border-color:rgba(255,207,51,.8); background:rgba(184,134,11,.6); }
body.mode-ny #world, body.mode-ny #fx, body.mode-ny #hud, body.mode-ny #hudProg, body.mode-ny #starHud, body.mode-ny #comboBadge, body.mode-ny #vignette, body.mode-ny #flash, body.mode-ny #dark, body.mode-ny #moon, body.mode-ny #fog, body.mode-ny #starTint, body.mode-ny #wordToast, body.mode-ny #fsDuck, body.mode-ny #fsJump, body.mode-ny .stats, body.mode-ny .mission, body.mode-ny .stage-progress, body.mode-ny .pad { display:none !important; }
@media (prefers-reduced-motion:reduce) { .ny-neon, .ny-steam { animation:none; } }
