*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#07111c;color:#eef6ff;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;overscroll-behavior:none}button,input,a{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}.screen{display:none;width:100%;height:100%}.screen.active{display:block}.hidden{display:none!important}.muted{color:#9dafc4}.primary{border:0;border-radius:12px;padding:11px 16px;background:linear-gradient(#59b5ff,#2c8ef1);color:#fff;font-weight:800}.ghost{border:1px solid rgba(255,255,255,.13);border-radius:12px;padding:10px 14px;background:#172941;color:#fff}
#authScreen{display:none;align-items:center;justify-content:center;background:radial-gradient(circle at 18% 20%,rgba(60,155,255,.25),transparent 30%),radial-gradient(circle at 82% 70%,rgba(75,210,145,.16),transparent 28%),linear-gradient(135deg,#091525,#132a43)}#authScreen.active{display:flex}.auth-card{width:min(500px,calc(100% - 28px));padding:32px;border-radius:24px;background:rgba(6,17,31,.94);border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 90px rgba(0,0,0,.4)}.brand{font-weight:900;color:#8dd0ff}.auth-card h1{margin:10px 0 3px;font-size:36px}.subtitle{margin:5px 0;color:#ffe09b}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:22px 0 14px}.tabs button,.menu-grid button,.menu-grid a{border:1px solid rgba(255,255,255,.12);background:#172941;color:#eef6ff;border-radius:12px;padding:11px}.tabs button.active{background:#2e5682}label{display:block;margin:12px 0 6px;font-weight:700;font-size:14px}input{width:100%;padding:13px;border-radius:12px;border:1px solid #38516e;background:#091523;color:#fff;outline:none}#authSubmit{width:100%;margin-top:18px}.error{min-height:22px;color:#ff9999;margin-top:10px}
#gameScreen{position:relative;background:#75b7e7}#renderCanvas{position:absolute;inset:0;width:100%;height:100%;outline:0;touch-action:none}.hud-corner{position:absolute;z-index:8;top:max(10px,env(safe-area-inset-top));display:flex;gap:7px}.hud-left{left:max(10px,env(safe-area-inset-left))}.hud-right{right:max(10px,env(safe-area-inset-right))}.stat,.hud-right button,.online-badge{height:40px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.12);background:rgba(5,14,25,.72);backdrop-filter:blur(8px);border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.16)}.stat{padding:0 10px;font-size:13px;gap:5px}.hud-right button{width:42px;color:#fff;font-size:18px}.hp{color:#ff8787}.xp{color:#ffe17a}.coin{color:#ffd567}.quest-chip{position:absolute;z-index:7;left:50%;top:max(58px,calc(env(safe-area-inset-top) + 52px));transform:translateX(-50%);max-width:min(560px,60vw);height:44px;padding:6px 14px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(5,14,25,.70);color:#fff;backdrop-filter:blur(8px);box-shadow:0 6px 18px rgba(0,0,0,.13);display:flex;align-items:center;gap:10px;white-space:nowrap;overflow:hidden}.quest-chip b{font-size:13px;color:#9ed7ff}.quest-chip span{font-size:13px;text-overflow:ellipsis;overflow:hidden}.online-badge{position:absolute;z-index:6;right:12px;bottom:12px;padding:0 10px;font-size:12px;color:#78e9b0}.near-hint{position:absolute;z-index:8;left:50%;bottom:26px;transform:translateX(-50%);padding:9px 13px;border-radius:12px;background:rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.12);font-weight:800;font-size:13px;opacity:0;transition:.18s}.near-hint.show{opacity:1}.toast{position:absolute;z-index:30;left:50%;top:110px;transform:translateX(-50%);padding:10px 14px;border-radius:12px;background:#153e31;border:1px solid #2a8f69;opacity:0;transition:.2s;pointer-events:none}.toast.show{opacity:1}.crosshair{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%);font-size:22px;color:rgba(255,255,255,.8);text-shadow:0 1px 4px #000;pointer-events:none}
.sheet{position:absolute;z-index:20;top:76px;left:50%;transform:translateX(-50%);width:min(620px,calc(100% - 24px));max-height:calc(100dvh - 100px);overflow:auto;padding:18px;border-radius:18px;background:rgba(7,17,29,.94);border:1px solid rgba(255,255,255,.12);box-shadow:0 24px 70px rgba(0,0,0,.35);backdrop-filter:blur(12px)}.sheet-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.sheet-head h2{margin:3px 0}.sheet-head small{color:#8fd0ff;font-weight:900}.sheet-head>button{border:0;background:transparent;color:#fff;font-size:28px}.story-box{margin:12px 0;padding:12px;border-left:3px solid #79d9a1;background:#12263b;border-radius:0 12px 12px 0;line-height:1.5}.objective{line-height:1.55}.progress-line{height:8px;background:#1b2c40;border-radius:99px;overflow:hidden;margin-top:14px}.progress-line i{display:block;height:100%;width:0;background:linear-gradient(90deg,#54d995,#5dafff)}.sheet-actions{margin-top:14px}.map-sheet canvas{width:100%;height:auto;border-radius:12px;background:#173429}.menu-sheet{width:min(420px,calc(100% - 24px))}.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.menu-grid a{text-align:center}.boss-banner{position:absolute;z-index:9;left:50%;top:112px;transform:translateX(-50%);width:min(520px,70vw);padding:9px 12px;border-radius:14px;background:rgba(55,8,29,.8);border:1px solid rgba(255,110,145,.45);backdrop-filter:blur(8px);text-align:center}.boss-banner small{font-weight:900;color:#ff9cb3}.boss-hp{height:8px;margin:5px 0;background:#42182a;border-radius:99px;overflow:hidden}.boss-hp i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#ff6b8d,#ffb26d)}.boss-banner b{font-size:12px}
.modal{display:none;position:absolute;z-index:25;inset:0;padding:18px;background:rgba(1,7,13,.68);align-items:center;justify-content:center}.modal.show{display:flex}.modal-card{width:min(590px,100%);max-height:88dvh;overflow:auto;padding:24px;border-radius:22px;background:#0e1d30;border:1px solid rgba(255,255,255,.12);box-shadow:0 30px 90px rgba(0,0,0,.4)}.modal-card.wide{width:min(850px,100%)}.npc-header{display:flex;gap:12px;align-items:center}.portrait{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:#244260;font-size:30px}.npc-header h2{margin:2px 0}.dialogue{font-size:18px;line-height:1.55}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}.vocab-card{text-align:center}.vocab-card h2{font-size:46px;margin:12px 0 5px;color:#ffe486}.meaning{font-size:22px;color:#9bd8ff}.journal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:15px 0}.journal-word{padding:12px;border-radius:12px;background:#172e49;border:1px solid #385d83;cursor:pointer}.journal-word b{display:block;color:#92d2ff;margin-bottom:4px}.control-row{display:grid;grid-template-columns:1fr 150px;align-items:center;gap:12px;margin:8px 0}.key-btn{border:1px solid #405675;background:#0b1727;color:#fff;border-radius:10px;padding:10px;font-weight:800}
.mobile-controls{display:none;position:absolute;inset:0;z-index:11;pointer-events:none}.move-stick{position:absolute;left:max(18px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom));width:138px;height:138px;pointer-events:auto;touch-action:none}.stick-ring{position:absolute;inset:8px;border-radius:50%;background:rgba(5,14,25,.25);border:2px solid rgba(255,255,255,.25);backdrop-filter:blur(2px)}.stick-knob{position:absolute;left:44px;top:44px;width:50px;height:50px;border-radius:50%;background:rgba(8,24,42,.78);border:2px solid rgba(255,255,255,.34);box-shadow:0 8px 18px rgba(0,0,0,.25)}.mobile-actions{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));width:150px;height:130px;pointer-events:auto}.mobile-actions button{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.2);color:#fff;background:rgba(6,18,31,.72);backdrop-filter:blur(4px);box-shadow:0 8px 20px rgba(0,0,0,.2);touch-action:none}.attack{width:70px;height:70px;right:0;top:0;font-size:30px}.interact{width:58px;height:58px;left:0;bottom:0;font-size:21px;font-weight:900}
@media(pointer:coarse),(max-width:860px){.mobile-controls{display:block}.crosshair{display:none}.hud-left{top:max(6px,env(safe-area-inset-top));gap:4px}.hud-right{top:max(6px,env(safe-area-inset-top));gap:4px}.stat{height:34px;padding:0 7px;font-size:12px}.hud-right button{width:36px;height:36px;font-size:16px}.hud-right button:nth-child(2),.hud-right button:nth-child(3){display:none}.quest-chip{top:max(48px,calc(env(safe-area-inset-top) + 42px));height:38px;max-width:72vw;padding:5px 10px;border-radius:12px}.quest-chip b{font-size:11px}.quest-chip span{font-size:11px}.online-badge{display:none}.near-hint{bottom:104px;font-size:12px;max-width:60vw;text-align:center}.toast{top:92px;max-width:80vw;text-align:center}.sheet{top:52px;max-height:calc(100dvh - 65px)}.boss-banner{top:92px;width:76vw}.modal{padding:10px}.modal-card{padding:18px}.vocab-card h2{font-size:38px}.dialogue{font-size:16px}}
@media(max-height:520px) and (orientation:landscape){.quest-chip{top:47px}.hud-right button:nth-child(4){display:flex}.move-stick{width:120px;height:120px}.stick-ring{inset:8px}.stick-knob{left:38px;top:38px;width:44px;height:44px}.mobile-actions{width:135px;height:110px}.attack{width:62px;height:62px}.interact{width:52px;height:52px}.near-hint{bottom:75px}}