:root{--ink:#f2efe6d9;--ink-dim:#f2efe68c;--shadow:0 0 8px #00000059, 0 1px 2px #00000059;--panel:#12100d9e;--accent:#ff5a1f;--ok:#9fd08a;--warn:#f1b25a;--bad:#ff6a4d}.hud{pointer-events:none;color:var(--ink);text-shadow:var(--shadow);letter-spacing:.01em;z-index:1;font:15px/1.35 ui-rounded,system-ui,-apple-system,sans-serif;position:fixed;inset:0}.hud .status{color:var(--ink-dim);font-size:13px;transition:opacity .8s;position:absolute;bottom:40px;right:48px}.hud .message{text-align:center;max-width:70vw;transition:opacity .6s;position:absolute;bottom:96px;left:50%;transform:translate(-50%)}body:has(.panel.open) .hud{z-index:4}body:has(.panel.open) .hud .message{top:10px;bottom:auto}.hud .cast{background:#f2efe62e;border-radius:2px;width:140px;height:3px;transition:opacity .3s;position:absolute;top:58%;left:50%;overflow:hidden;transform:translate(-50%)}.hud .cast>i{background:var(--ink);width:0;height:100%;display:block}.hud .cast.sweet>i{background:var(--ok)}.hud .cast.over>i{background:var(--warn)}.hud .tension{transition:opacity .5s;position:absolute;top:50%;right:64px;transform:translateY(-50%)}.hud .tension svg{overflow:visible}.hud .fight{text-align:right;font-size:13px;transition:opacity .5s;position:absolute;bottom:40px;right:48px}.hud .crosshair{background:var(--ink-dim);border-radius:50%;width:4px;height:4px;margin:-2px;transition:opacity .5s;position:absolute;top:50%;left:50%}.panel{z-index:3;color:var(--ink);backdrop-filter:blur(3px);background:#08070659;place-items:center;font:15px/1.4 ui-rounded,system-ui,-apple-system,sans-serif;display:grid;position:fixed;inset:0}.panel .card{background:var(--panel);border:1px solid #f2efe61f;border-radius:14px;min-width:420px;max-width:min(860px,92vw);max-height:calc(100vh - 96px);padding:22px 26px;overflow:auto;box-shadow:0 20px 60px #00000059}.panel h2{margin:0 0 4px;font-size:20px;font-weight:600}.panel .sub{color:var(--ink-dim);margin-bottom:14px;font-size:13px}.panel .tabs{gap:6px;margin:8px 0 14px;display:flex}.panel button{font:inherit;color:var(--ink);cursor:pointer;background:#f2efe612;border:1px solid #f2efe629;border-radius:8px;padding:6px 12px}.panel button:hover:not(:disabled){background:#f2efe624}.panel button:disabled{opacity:.45;cursor:default}.panel button.on{border-color:var(--ink)}.panel table{border-collapse:collapse;width:100%;font-size:14px}.panel td,.panel th{text-align:left;vertical-align:top;border-bottom:1px solid #f2efe614;padding:6px 8px}.panel th{color:var(--ink-dim);font-size:12px;font-weight:500}.panel .why{color:var(--ink-dim);font-size:12px}.panel h3{margin:16px 0 6px;font-size:14px;font-weight:600}.panel .credit{color:var(--ink);margin:3px 0;font-size:12px}.panel a{color:var(--ink)}.panel .delta-up{color:var(--ok)}.panel .delta-down{color:var(--bad)}.panel .keys{color:var(--ink-dim);margin-top:14px;font-size:12px}.panel.card-mode{backdrop-filter:none;background:linear-gradient(#0000 55%,#08070673);place-items:end center;padding-bottom:6vh}.panel.card-mode .card{min-width:380px}.hud .guide{text-align:center;background:var(--panel);border-radius:10px;max-width:70vw;padding:8px 16px;font-size:15px;transition:opacity .4s,background .2s;position:absolute;top:28px;left:50%;transform:translate(-50%)}.hud .guide .n{color:var(--ink-dim);margin-right:6px}.hud .guide b{color:#fff;font-weight:700}.hud .guide.urgent{background:#ff5a1fd9;font-size:20px;font-weight:600}