/* BASE */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{height:100%}
body{
    font-family:var(--f-sans);font-size:var(--fs-md);font-weight:500;
    line-height:1.5;color:var(--text);background:var(--bg);
    min-height:100vh;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
button{font-family:inherit;font-weight:600;border:none;background:none;cursor:pointer;color:inherit;line-height:1}
button:disabled{cursor:default;opacity:0.3}
*:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:var(--r-sm)}
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--text-4);border-radius:3px}
::selection{background:var(--green);color:#fff}
[hidden]{display:none!important}

kbd{
    display:inline-block;padding:1px 5px;
    font-family:var(--f-mono);font-size:0.65rem;font-weight:600;
    color:var(--text-3);background:var(--surface);
    border:1px solid var(--b2);border-radius:var(--r-sm);
    min-width:16px;text-align:center;line-height:1.4;
    vertical-align:middle;
}

/* Flicker animation for attacks */
@keyframes capture-flash{
    0%{opacity:1}10%{opacity:0.6}20%{opacity:1}30%{opacity:0.8}100%{opacity:1}
}
.flash{animation:capture-flash 0.25s linear}