:root{--ink: #0e1410;--ink-2: #151f18;--paper: #f3ead7;--gold: #d8b25e;--gold-bright: #f4d98e;--jade: #4fd08a;--rouge: #e85a8f;--violet: #9b6bff;--blood: #e05249;--panel: rgba(14, 22, 17, .72);--panel-line: rgba(216, 178, 94, .35);--font-song: "Songti SC", "STSong", "Noto Serif SC", serif;--font-hei: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;overflow:hidden;background:var(--ink);font-family:var(--font-hei);color:var(--paper);user-select:none;-webkit-user-select:none;overscroll-behavior:none;touch-action:none}#app,#game-canvas{position:fixed;inset:0;width:100%;height:100%;display:block}#game-canvas{touch-action:none}.hidden{display:none!important}.screen{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:24px}#start-screen{background:radial-gradient(ellipse at 30% 20%,rgba(79,208,138,.08),transparent 55%),radial-gradient(ellipse at 75% 80%,rgba(232,90,143,.1),transparent 55%),linear-gradient(160deg,#101a14,#0b100d 60%,#0a0f0c);overflow:hidden}.ink-wash{position:absolute;inset:-10%;background:radial-gradient(ellipse 40% 30% at 20% 30%,rgba(243,234,215,.05),transparent 70%),radial-gradient(ellipse 30% 20% at 80% 20%,rgba(216,178,94,.07),transparent 70%),radial-gradient(ellipse 45% 25% at 60% 85%,rgba(243,234,215,.04),transparent 70%);filter:blur(2px);animation:inkDrift 18s ease-in-out infinite alternate;pointer-events:none}@keyframes inkDrift{0%{transform:translate3d(-1.5%,-1%,0) scale(1.02)}to{transform:translate3d(1.5%,1.5%,0) scale(1.06)}}.start-card{position:relative;z-index:2;width:min(440px,92vw);padding:40px 36px 32px;text-align:center;background:linear-gradient(170deg,#18221beb,#0d130ff0);border:1px solid var(--panel-line);border-radius:18px;box-shadow:0 30px 80px #0000008c,inset 0 1px #f4d98e26;backdrop-filter:blur(8px);animation:cardRise .7s cubic-bezier(.2,.9,.25,1.2)}@keyframes cardRise{0%{opacity:0;transform:translateY(26px) scale(.97)}to{opacity:1;transform:none}}.title-seal{position:absolute;top:-18px;right:26px;width:44px;height:44px;display:grid;place-items:center;font-family:var(--font-song);font-size:15px;font-weight:700;color:#f7eeda;background:linear-gradient(150deg,#c9443b,#a32f28);border-radius:8px;transform:rotate(6deg);box-shadow:0 6px 16px #a92f2866;letter-spacing:2px}.game-title{font-family:var(--font-song);font-size:clamp(40px,11vw,58px);font-weight:900;letter-spacing:6px;line-height:1.15;margin-bottom:10px}.game-title span{display:inline-block;background:linear-gradient(180deg,var(--gold-bright),var(--gold) 55%,#9c7a38);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 30px rgba(216,178,94,.25);animation:floatChar 3s ease-in-out infinite}.game-title .t1{animation-delay:0s}.game-title .t2{animation-delay:.15s}.game-title .t3{animation-delay:.3s}.game-title .t4{animation-delay:.45s}.game-title .t5{animation-delay:.6s}@keyframes floatChar{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.game-subtitle{font-family:var(--font-song);color:#f3ead79e;letter-spacing:4px;font-size:13px;margin-bottom:28px}.name-row{display:flex;gap:10px;margin-bottom:18px}.name-input{flex:1;height:48px;padding:0 16px;font-family:var(--font-song);font-size:17px;letter-spacing:2px;color:var(--paper);text-align:center;background:#0000004d;border:1px solid rgba(216,178,94,.3);border-radius:10px;outline:none;transition:border-color .2s,box-shadow .2s}.name-input::placeholder{color:#f3ead74d}.name-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px #d8b25e24}.dice-btn{width:48px;font-size:20px;background:#d8b25e1f;border:1px solid rgba(216,178,94,.3);border-radius:10px;color:var(--gold-bright);cursor:pointer;transition:background .15s,transform .15s}.dice-btn:active{transform:scale(.92)}.start-btn{width:100%;height:52px;margin-bottom:24px;font-family:var(--font-song);font-size:19px;font-weight:700;letter-spacing:8px;text-indent:8px;color:#241c0c;background:linear-gradient(180deg,var(--gold-bright),var(--gold));border:none;border-radius:12px;cursor:pointer;box-shadow:0 10px 26px #d8b25e52,inset 0 1px #ffffff80;transition:transform .12s,box-shadow .12s,filter .12s}.start-btn:hover{filter:brightness(1.06);box-shadow:0 14px 32px #d8b25e73}.start-btn:active{transform:translateY(2px) scale(.99)}.btn-sword{font-size:16px}.controls-hint{display:flex;flex-direction:column;gap:7px;margin-bottom:22px;font-size:12px;color:#f3ead78c}.controls-hint kbd{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;margin:0 2px;font-family:var(--font-hei);font-size:11px;color:var(--gold-bright);background:#ffffff0f;border:1px solid rgba(216,178,94,.25);border-bottom-width:2px;border-radius:5px}.legend{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 14px;padding-top:18px;border-top:1px dashed rgba(216,178,94,.2)}.legend-item{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:#f3ead799}.dot{width:10px;height:10px;border-radius:50%;box-shadow:0 0 8px currentColor}.dot.tier-1{background:#d9d9d9;color:#d9d9d9}.dot.tier-2{background:#4fd08a;color:#4fd08a}.dot.tier-3{background:#e85a8f;color:#e85a8f}.dot.tier-4{background:#9b6bff;color:#9b6bff}.dot.tier-5{background:linear-gradient(135deg,#f4d98e,#d8b25e);color:var(--gold)}.start-footer{position:absolute;bottom:18px;width:100%;text-align:center;font-size:11px;letter-spacing:2px;color:#f3ead74d}@media (pointer: coarse){.touch-only{display:block}}@media (pointer: fine){.touch-only{display:none}}.hud{position:fixed;inset:0;z-index:20;pointer-events:none}.panel{background:var(--panel);border:1px solid var(--panel-line);border-radius:14px;backdrop-filter:blur(6px);box-shadow:0 8px 24px #00000059,inset 0 1px #f4d98e1a}.player-panel{position:absolute;top:calc(14px + env(safe-area-inset-top));left:calc(14px + env(safe-area-inset-left));width:230px;padding:10px 12px 9px}.pp-name{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:7px}#pp-name-text{font-family:var(--font-song);font-size:16px;font-weight:700;letter-spacing:1.5px;color:var(--gold-bright);max-width:140px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.pp-level{font-size:12px;font-weight:700;color:var(--jade)}.bar{position:relative;height:15px;margin-bottom:5px;background:#0006;border-radius:7px;overflow:hidden;border:1px solid rgba(255,255,255,.07)}.bar-fill{height:100%;width:100%;border-radius:6px 0 0 6px;transition:width .18s ease-out}.hp-bar .bar-fill{background:linear-gradient(90deg,#b83c35,var(--blood) 60%,#f07a6e);box-shadow:0 0 10px #e0524980}.blade-bar .bar-fill{background:linear-gradient(90deg,#8fb7c9,#e8f4f8 60%,#fff);box-shadow:0 0 10px #dcf0fa73}.bar-text{position:absolute;inset:0;display:grid;place-items:center;font-size:10px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.9);letter-spacing:.5px}.pp-stats{display:flex;justify-content:space-between;margin-top:6px;font-size:11px;color:#f3ead7b3}.pp-stats b{color:var(--paper);font-size:12px}.top-right{position:absolute;top:calc(14px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right));display:flex;flex-direction:column;align-items:flex-end;gap:8px}#minimap{width:clamp(96px,26vw,150px);height:clamp(96px,26vw,150px);border-radius:50%;background:#0a100ca8;border:2px solid rgba(216,178,94,.4);box-shadow:0 6px 20px #0006,inset 0 0 22px #0000008c}.icon-btn{pointer-events:auto;width:38px;height:38px;font-size:17px;background:var(--panel);border:1px solid var(--panel-line);border-radius:50%;cursor:pointer;backdrop-filter:blur(6px);transition:transform .12s}.icon-btn:active{transform:scale(.9)}.banner{position:absolute;top:calc(16px + env(safe-area-inset-top));left:50%;transform:translate(-50%);padding:9px 22px;font-family:var(--font-song);font-size:14px;font-weight:700;letter-spacing:3px;color:var(--gold-bright);background:var(--panel);border:1px solid var(--panel-line);border-radius:999px;backdrop-filter:blur(6px);white-space:nowrap;animation:bannerIn .35s cubic-bezier(.2,.9,.3,1.3)}@keyframes bannerIn{0%{opacity:0;transform:translate(-50%) translateY(-12px)}to{opacity:1;transform:translate(-50%)}}.feed{position:absolute;top:118px;right:calc(14px + env(safe-area-inset-right));width:min(250px,52vw);display:flex;flex-direction:column;align-items:flex-end;gap:5px}.feed-item{padding:5px 11px;font-size:11px;line-height:1.4;color:#f3ead7d1;background:#0a100c99;border:1px solid rgba(255,255,255,.07);border-radius:8px;animation:feedIn .3s ease,feedOut .5s ease 3.4s forwards;text-align:right}.feed-item b{color:var(--gold-bright)}.feed-item.me{border-color:#d8b25e73}.feed-item.death-me{border-color:#e0524999;color:#f3b8b3}@keyframes feedIn{0%{opacity:0;transform:translate(18px)}to{opacity:1;transform:none}}@keyframes feedOut{to{opacity:0;transform:translate(12px)}}.toasts{position:absolute;top:22%;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;width:80%}.toast{padding:8px 18px;font-family:var(--font-song);font-size:14px;letter-spacing:2px;color:var(--paper);background:#0a100cc7;border:1px solid var(--panel-line);border-radius:999px;animation:toastPop .3s cubic-bezier(.2,.9,.3,1.4),toastFade .5s ease 1.9s forwards}.toast.gold{color:var(--gold-bright);border-color:#d8b25e8c}.toast.jade{color:#9be8bc;border-color:#4fd08a80}.toast.rouge{color:#f5a4c4;border-color:#e85a8f80}@keyframes toastPop{0%{opacity:0;transform:scale(.85) translateY(8px)}to{opacity:1;transform:none}}@keyframes toastFade{to{opacity:0;transform:translateY(-8px)}}#buff-bar{position:absolute;left:18px;bottom:168px;display:flex;gap:8px;pointer-events:none}.buff-chip{display:flex;align-items:center;gap:5px;background:#141a16c7;border:1px solid rgba(216,178,94,.4);border-radius:20px;padding:5px 10px 5px 7px;color:#f3ead7;font-size:13px}.buff-chip .t{font:11px/1 ui-monospace,monospace;color:#f4d98e;min-width:22px}.shield-bar{display:none;background:#0e1624b3}.shield-bar.show{display:flex}#shield-fill{background:linear-gradient(90deg,#6ba0e8,#9ec8ff);box-shadow:0 0 8px #78aaff99}#damage-vignette{position:fixed;inset:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse at center,#e03c3000 45%,#e03c3047 78%,#c81e188c)}#damage-vignette.hurt{animation:hurtPulse .5s ease-out}@keyframes hurtPulse{0%{opacity:.9}to{opacity:0}}.player-panel.in-combat{border-color:#f0785abf;box-shadow:0 8px 24px #00000059,0 0 0 1px #f0644659,0 0 22px #e052494d}.joystick{pointer-events:auto;position:absolute;left:calc(34px + env(safe-area-inset-left));bottom:calc(40px + env(safe-area-inset-bottom));width:128px;height:128px;border-radius:50%;background:radial-gradient(circle,#f3ead71a,#f3ead708 65%);border:1.5px solid rgba(216,178,94,.3);box-shadow:inset 0 0 22px #00000059;touch-action:none}.joystick-knob{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f4d98ed9,#d8b25e8c);border:1px solid rgba(244,217,142,.8);box-shadow:0 4px 14px #0006,inset 0 1px 3px #ffffff80;transition:transform .06s linear}@media (pointer: fine){.joystick{opacity:.55}}#death-screen{background:#0805059e;backdrop-filter:blur(4px)}.death-card{width:min(380px,90vw);padding:36px 30px 28px;text-align:center;background:linear-gradient(170deg,#281210f2,#120a09f5);border:1px solid rgba(224,82,73,.4);border-radius:18px;box-shadow:0 30px 80px #0009;animation:cardRise .5s cubic-bezier(.2,.9,.25,1.2)}.death-title{font-family:var(--font-song);font-size:38px;letter-spacing:10px;text-indent:10px;color:#e8837c;margin-bottom:10px}.death-quote{font-family:var(--font-song);font-size:13px;color:#f3ead78c;letter-spacing:2px;margin-bottom:24px}.death-stats{display:flex;justify-content:space-around;margin-bottom:22px}.death-stats div{display:flex;flex-direction:column;gap:6px}.death-stats span{font-size:11px;color:#f3ead780}.death-stats b{font-size:22px;color:var(--gold-bright)}.respawn-tip{font-size:13px;color:#f3ead799}.respawn-tip b{color:#f3b8b3;font-size:17px}@media (max-width: 480px){.player-panel{width:188px;padding:8px 10px}#pp-name-text{font-size:14px}.bar{height:13px}.feed{top:96px}}@media (orientation: landscape) and (max-height: 500px){.start-card{padding:22px 28px 18px}.game-title{font-size:36px}.game-subtitle{margin-bottom:14px}.controls-hint,.legend{display:none}.start-btn{height:46px;margin-bottom:12px}.joystick{width:108px;height:108px;left:calc(22px + env(safe-area-inset-left));bottom:calc(20px + env(safe-area-inset-bottom))}.joystick-knob{width:46px;height:46px;margin:-23px 0 0 -23px}}