
:root{--bg:#fff;--fg:#1a1d21;--mut:#5b6470;--ac:#0b62d6;--card:#f4f6f9;--bd:#dde2e8;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#14171b;--fg:#e8ebee;--mut:#9aa4b0;--ac:#6aa9ff;--card:#1d2127;--bd:#2c323a}}
:root[data-theme="dark"]{--bg:#14171b;--fg:#e8ebee;--mut:#9aa4b0;--ac:#6aa9ff;--card:#1d2127;--bd:#2c323a}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
header,main,footer{max-width:860px;margin:auto;padding:1rem}
header{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;border-bottom:1px solid var(--bd)}
header a.logo{font-weight:700;font-size:1.2rem;text-decoration:none;color:var(--fg)}
a{color:var(--ac)}h1{line-height:1.2;margin:.5rem 0}
.card{background:var(--card);border:1px solid var(--bd);border-radius:10px;padding:1rem;margin:1rem 0}
.tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin:.75rem 0}
.tabs button{font:inherit;border:1px solid var(--bd);background:var(--card);color:var(--fg);border-radius:999px;padding:.35rem .9rem;cursor:pointer}
.tabs button.on{background:var(--ac);color:#fff;border-color:var(--ac)}
input{width:100%;font:inherit;padding:.6rem .8rem;border:1px solid var(--bd);border-radius:8px;background:var(--card);color:var(--fg)}
ul.g{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.5rem}
ul.g a{display:block;background:var(--card);border:1px solid var(--bd);border-radius:8px;padding:.6rem .75rem;text-decoration:none;color:var(--fg)}
ul.g small{display:block;color:var(--mut)}
.ok{color:#1a7f37;font-weight:600}
.scroll{overflow-x:auto}table{border-collapse:collapse;width:100%}th,td{border:1px solid var(--bd);padding:.5rem;text-align:left;vertical-align:top}
.mut{color:var(--mut);font-size:.9rem}

body{padding-bottom:6.5rem}
.pag{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;margin:1.5rem 0}
.pag a,.pag span{border:1px solid var(--bd);border-radius:8px;padding:.35rem .7rem;text-decoration:none;background:var(--card);color:var(--fg)}
.pag .cur{background:var(--ac);color:#fff;border-color:var(--ac)}
.bar{position:fixed;left:0;right:0;bottom:0;z-index:10;display:flex;gap:.6rem;padding:.6rem .75rem calc(.6rem + env(safe-area-inset-bottom,0px));background:var(--bg);border-top:1px solid var(--bd);box-shadow:0 -6px 18px rgba(0,0,0,.12)}
.bar a{position:relative;overflow:hidden;flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;text-decoration:none;color:#fff;border-radius:12px;padding:.6rem .5rem;line-height:1.2;text-align:left;transition:transform .15s,filter .15s;-webkit-tap-highlight-color:transparent}
.bar .b1{background:linear-gradient(135deg,#7c3aed,#2563eb)}
.bar .b2{background:linear-gradient(135deg,#ff6a00,#ee0979);animation:pulso 2s infinite}
.bar a:hover{transform:translateY(-3px) scale(1.03);filter:brightness(1.1)}
.bar a:active{transform:scale(.96)}
.bar a::after{content:"";position:absolute;top:0;left:-60%;width:35%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:brillo 3.5s infinite}
.bar .em{font-size:1.7rem;display:inline-block;animation:rebote 1.4s ease-in-out infinite}
.bar .tx{display:flex;flex-direction:column;min-width:0}
.bar strong{font-size:.95rem}.bar small{font-size:.75rem;opacity:.95}
@media(max-width:420px){.bar .em{font-size:1.35rem}.bar strong{font-size:.8rem}.bar small{font-size:.66rem}}
@keyframes pulso{0%,100%{box-shadow:0 0 0 0 rgba(238,9,121,.55)}50%{box-shadow:0 0 0 10px rgba(238,9,121,0)}}
@keyframes brillo{0%{left:-60%}55%,100%{left:140%}}
@keyframes rebote{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(-8deg)}}
@media(prefers-reduced-motion:reduce){.bar a,.bar a::after,.bar .em{animation:none!important;transition:none}}
