:root { --ink:#121a27; --paper:#e7e4d6; --blue:#163c70; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); font:12px/1.55 Verdana,Geneva,sans-serif; background-color:#05070b; background-image:radial-gradient(circle at 8% 21%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 15% 78%,#9bb3d4 0 1px,transparent 1.5px),radial-gradient(circle at 29% 8%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 40% 64%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 61% 18%,#b7d0ff 0 1px,transparent 1.5px),radial-gradient(circle at 74% 84%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 88% 35%,#fff 0 1px,transparent 1.5px); background-size:180px 160px,220px 180px,250px 200px,190px 230px,270px 220px,210px 170px,240px 260px; }
.site-shell { width:760px; margin:26px auto 36px; border:3px ridge #e5e5db; background:var(--paper); box-shadow:0 0 0 3px #0c1423,0 10px 28px #000; }
.masthead { border-bottom:3px double #0b2244; background:linear-gradient(90deg,#d8d7c9,#f5f1dc 55%,#cbd4cc); }
.masthead-top { display:flex; justify-content:space-between; padding:4px 9px; color:#fff; background:var(--blue); font:bold 10px "Courier New",monospace; letter-spacing:.7px; }
h1 { margin:11px 12px 1px; color:#123a74; font:bold 33px/1 Georgia,"Times New Roman",serif; letter-spacing:1px; text-shadow:1px 1px 0 #fff; }
.tagline { margin:0 14px 12px; color:#4e5663; font-size:10px; font-weight:bold; letter-spacing:.6px; }
nav { display:flex; gap:3px; padding:8px 8px 0; background:#b8bdc4; border-bottom:1px solid #fff; } nav a { padding:4px 7px; color:#101b2d; background:#d9d9d0; border:2px outset #eee; text-decoration:none; font:bold 10px "Courier New",monospace; } nav a:hover,nav a.active { color:#fff; background:#214e8a; border-style:inset; }
.notice { display:flex; align-items:center; gap:8px; margin:10px; padding:7px; border:1px dashed #7c3200; color:#552300; background:#ffedb4; font:11px "Courier New",monospace; } .notice-icon { display:grid; place-items:center; width:18px; height:18px; flex:0 0 18px; border:2px outset #f4d15b; color:#fff; background:#bf570c; font:bold 14px Arial,sans-serif; }
.content-grid { display:grid; grid-template-columns:minmax(0,1fr) 210px; gap:10px; padding:0 10px 10px; }.panel { margin-bottom:10px; border:2px groove #c7c7bd; background:#f6f3e7; }.panel-title { padding:3px 6px; color:#fff; background:linear-gradient(90deg,#163c70,#2b66aa); font:bold 11px "Courier New",monospace; letter-spacing:.35px; }.panel-body { padding:7px 9px; }.panel p { margin:0 0 9px; }.panel p:last-child { margin-bottom:0; }.dropcap { float:left; margin:-3px 4px -3px 0; color:#b84408; font:bold 31px/1 Georgia,serif; }.small-print { color:#686459; font-size:10px; font-style:italic; }
.tech-list div { display:grid; grid-template-columns:112px 1fr; padding:4px 0; border-bottom:1px dotted #939486; }.tech-list div:last-child { border-bottom:0; }.tech-list b { color:#163c70; font:bold 11px "Courier New",monospace; }.tech-list span { font-family:"Courier New",monospace; }.updates time { color:#c34c05; font-weight:bold; }
.status-list { padding:5px 8px; background:#e7eadf; }.status-list p { display:flex; justify-content:space-between; gap:5px; padding:3px 0; border-bottom:1px dotted #9b9f90; font:10px "Courier New",monospace; }.status-list p:last-child { border-bottom:0; }.status-list b { color:#187116; font-size:10px; }.link-list { padding:5px 8px; }.link-list a { display:block; padding:4px 0; border-bottom:1px dotted #9b9f90; color:#0b4384; font:bold 10px "Courier New",monospace; text-decoration:none; }.link-list a:last-child { border-bottom:0; }.link-list a:hover { color:#c34c05; text-decoration:underline; }
.visitor-box { padding:8px; border:2px inset #f0f0e8; color:#31435c; background:#d1d5cc; text-align:center; font:bold 9px "Courier New",monospace; }.visitor-box output { display:block; margin:3px auto; padding:1px 3px; width:fit-content; border:1px inset #ddd; color:#b3f433; background:#192419; font:bold 16px "Courier New",monospace; letter-spacing:1px; } footer { display:flex; justify-content:space-between; padding:6px 9px; color:#d7ddea; background:#111f35; border-top:1px solid #7288a4; font:9px "Courier New",monospace; }
@media (max-width:800px) { body { background-image:none; }.site-shell { width:100%; margin:0; border-width:0; box-shadow:none; }.content-grid { grid-template-columns:1fr; }.side-column { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.visitor-box { grid-column:1/-1; margin-top:-10px; margin-bottom:10px; } } @media (max-width:480px) { h1 { font-size:25px; }.masthead-top,footer { flex-direction:column; }nav { flex-wrap:wrap; }.side-column { grid-template-columns:1fr; gap:0; }.visitor-box { grid-column:auto; margin-top:0; }.tech-list div { grid-template-columns:1fr; } }
