/* Blue Planet Dial-Up — hoja de estilos con espíritu de 1997 y CSS de ahora */
:root{--bg:#000022;--ink:#d0d0ff;--link:#66ffff;--vlink:#ff99ff;--neon:#00ff66;--amber:#ffb000;--panel:#000044;--border:#4040a0}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;color:var(--ink);font-family:Verdana,Geneva,"DejaVu Sans",sans-serif;font-size:14px;line-height:1.45;
 background:var(--bg) radial-gradient(1px 1px at 20px 30px,#fff 50%,transparent 51%),
 radial-gradient(1px 1px at 120px 80px,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 200px 160px,#aaf 50%,transparent 51%),
 radial-gradient(1px 1px at 300px 40px,#fff 50%,transparent 51%),radial-gradient(1px 1px at 70px 200px,#fff 50%,transparent 51%),
 radial-gradient(1.5px 1.5px at 250px 250px,#fff 50%,transparent 51%);background-size:320px 300px}
a{color:var(--link)}a:visited{color:var(--vlink)}
.wrap{max-width:820px;margin:0 auto;padding:12px}
.frame{border:3px double var(--border);background:rgba(0,0,68,.85);padding:14px 18px;margin:14px 0;box-shadow:0 0 18px #202080}
h1,h2,h3{font-family:"Times New Roman",Times,serif;color:#fff;margin:.3em 0}
h1{font-size:2.2em;text-shadow:3px 3px 0 #003,0 0 12px #66f}
h2{font-size:1.5em;border-bottom:1px dashed var(--border);padding-bottom:4px}
pre,code,tt,.mono{font-family:"Courier New",Courier,monospace}
pre{background:#000;color:var(--neon);padding:10px;border:1px solid #060;overflow-x:auto;font-size:12.5px;line-height:1.25}
pre.logo{color:#7fbfff;text-align:center;border:0;background:transparent;text-shadow:0 0 6px #48f;font-size:11px}
@media(min-width:640px){pre.logo{font-size:13px}}
.blink{animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}
.rainbow{background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:bold}
.new{background:#f00;color:#ff0;font-size:9px;padding:0 3px;vertical-align:super;font-weight:bold}
.construction{background:repeating-linear-gradient(45deg,#000 0 12px,#ffcc00 12px 24px);color:#000;text-align:center;font-weight:bold;padding:4px;
 font-family:Impact,"Arial Black",sans-serif;letter-spacing:2px;text-shadow:0 0 4px #ff0}
.construction span{background:#ffcc00;padding:0 8px}
table.tab{border-collapse:collapse;width:100%;font-size:13px}table.tab th,table.tab td{border:1px solid var(--border);padding:5px 7px;text-align:left;vertical-align:top}
table.tab th{background:#202070;color:#fff}table.tab tr:nth-child(even) td{background:rgba(255,255,255,.04)}
.btn{display:inline-block;background:linear-gradient(#5f5fff,#1f1f9f);color:#fff;border:2px outset #9f9fff;padding:8px 18px;font-weight:bold;font-size:16px;
 text-decoration:none;cursor:pointer;font-family:Verdana,sans-serif;box-shadow:2px 2px 0 #000}
.btn:active{border-style:inset}.btn.big{font-size:22px;padding:12px 30px}
.badges{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:10px 0}
.badge{width:88px;height:31px;font-size:9px;line-height:1.05;display:flex;align-items:center;justify-content:center;text-align:center;
 border:1px solid #888;background:#222;color:#fff;text-decoration:none;font-family:Arial,sans-serif;overflow:hidden;padding:1px 2px}
.badge.b1{background:#003;color:#9cf;border-color:#69c}.badge.b2{background:#300;color:#fc9}.badge.b3{background:#030;color:#9f9}
.badge.b4{background:linear-gradient(#fff,#ccc);color:#000}.badge.b5{background:#000;color:#0f0;font-family:"Courier New",monospace}
.badge.b6{background:#440;color:#ff0}.badge.b7{background:#404;color:#f9f}.badge.b8{background:#036;color:#fff}
.counter{display:inline-block;background:#000;border:2px inset #666;padding:2px 4px;font-family:"Courier New",monospace;color:#0f0;letter-spacing:3px;font-size:18px}
.terminal{background:#000;color:#0f0;border:2px inset #444;padding:10px;min-height:220px;font-family:"Courier New",Courier,monospace;font-size:13px;white-space:pre-wrap;overflow:auto;max-height:420px}
.terminal .cursor{display:inline-block;width:8px;height:14px;background:#0f0;vertical-align:-2px;animation:blink .8s steps(1) infinite}
.led{display:inline-block;width:10px;height:10px;border-radius:50%;background:#400;margin-right:4px;vertical-align:middle;box-shadow:0 0 2px #000}
.led.on{background:#f22;box-shadow:0 0 6px #f44}.led.tx{background:#2f2;box-shadow:0 0 6px #4f4}
.leds{font-family:"Courier New",monospace;font-size:11px;background:#222;border:1px solid #555;padding:4px 8px;display:inline-block;color:#ccc}
nav.bar{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;background:#101050;padding:6px;border:1px solid var(--border)}
nav.bar a{padding:3px 10px;background:#202080;color:#fff;text-decoration:none;font-size:12px;border:1px outset #66a}
nav.bar a:hover{background:#4040c0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:640px){.two{grid-template-columns:1fr}}
.webring{text-align:center;font-size:12px;border:1px solid #666;padding:6px;background:#111}
.small{font-size:11px;color:#99a}
.marq{background:#000;color:var(--amber);font-family:"Courier New",monospace;border:1px solid #630;padding:2px}
hr{border:0;border-top:1px dashed var(--border)}
form.gb input,form.gb textarea{width:100%;background:#000;color:#0f0;border:1px inset #666;font-family:"Courier New",monospace;padding:4px}
.gbmsg{border-left:3px solid var(--border);padding:4px 8px;margin:8px 0;background:rgba(255,255,255,.03)}
.gbmsg .who{color:var(--amber)}
.speed{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:12px}
input,select{font-family:inherit}
