/* Powerhouse Apps — charcoal & amber, classic and clean. */
:root{
  --bg:#262626; --panel:#2C2C2C; --panel-border:#3A3A3A;
  --text:#F2F2F2; --secondary:#B8B8B8; --amber:#F28A17;
  --amber-dark:#4D3510; --max:62rem;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size:1.0625rem; line-height:1.6;
}
a{color:var(--amber)}
a:hover{text-decoration-thickness:.15em}
:focus-visible{outline:3px solid var(--amber); outline-offset:2px; border-radius:2px}
.skip-link{
  position:absolute; left:-9999px; top:0; background:var(--amber); color:#1a1a1a;
  padding:.6rem 1rem; font-weight:700; z-index:10;
}
.skip-link:focus{left:0}
.wrap{max-width:var(--max); margin:0 auto; padding:0 1.25rem}
header.site{
  border-bottom:3px solid var(--amber); background:#202020;
}
.header-in{display:flex; align-items:center; gap:.9rem; padding:.8rem 0; flex-wrap:wrap}
.header-in img{width:52px; height:52px; border-radius:12px}
.wordmark{font-size:1.45rem; font-weight:700; line-height:1.15; color:var(--text); text-decoration:none}
.wordmark span{color:var(--amber)}
nav.main{background:#202020; border-bottom:1px solid var(--panel-border)}
nav.main ul{
  list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.25rem;
}
nav.main a{
  display:block; padding:.65rem .8rem; color:var(--text); text-decoration:none;
  border-radius:.4rem .4rem 0 0; font-weight:600;
}
nav.main a:hover{background:var(--panel); color:var(--amber)}
nav.main a[aria-current="page"]{background:var(--amber-dark); color:var(--amber); box-shadow:inset 0 -3px 0 var(--amber)}
main{padding:2rem 0 3rem}
h1{font-size:2.1rem; line-height:1.2; margin:.2rem 0 1rem}
h2{font-size:1.5rem; margin:2.2rem 0 .8rem; padding-bottom:.3rem; border-bottom:2px solid var(--amber-dark)}
h3{font-size:1.15rem; margin:1.2rem 0 .4rem; color:var(--amber)}
p{margin:.6rem 0}
.lede{font-size:1.2rem; color:var(--text)}
.muted{color:var(--secondary)}
.panel{
  background:var(--panel); border:1px solid var(--panel-border);
  border-radius:12px; padding:1.1rem 1.25rem; margin:1.1rem 0;
}
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(16rem,1fr)); gap:1rem; margin:1rem 0}
.card{
  background:var(--panel); border:1px solid var(--panel-border); border-radius:12px;
  padding:1rem 1.1rem; display:flex; flex-direction:column; gap:.4rem;
}
.card h3{margin-top:0}
.card .spacer{flex:1}
.btn{
  display:inline-block; background:var(--amber); color:#1a1a1a; font-weight:700;
  padding:.6rem 1.1rem; border-radius:.5rem; text-decoration:none; border:0; cursor:pointer;
  font-size:1rem;
}
.btn:hover{background:#ffa63d}
.btn.secondary{background:transparent; color:var(--amber); border:2px solid var(--amber)}
.btn.disabled{background:#3d3d3d; color:#9a9a9a; cursor:not-allowed}
.textlink{font-weight:600}
table{border-collapse:collapse; width:100%; margin:.8rem 0}
th,td{border:1px solid var(--panel-border); padding:.55rem .7rem; text-align:left; vertical-align:top}
th{background:#202020; color:var(--amber)}
code.checksum{
  display:block; background:#1c1c1c; border:1px solid var(--panel-border); border-radius:.5rem;
  padding:.7rem .8rem; word-break:break-all; font-size:.95rem; margin:.5rem 0;
}
.hero{display:flex; gap:1.5rem; align-items:center; flex-wrap:wrap; margin-bottom:1rem}
.hero img.logo{width:120px; height:120px; border-radius:24px}
.about-photo{
  width:220px; max-width:100%; border-radius:12px; border:1px solid var(--panel-border);
}
.about-flex{display:flex; gap:1.4rem; flex-wrap:wrap; align-items:flex-start}
.about-flex .about-text{flex:1; min-width:16rem}
.disclaimer{border:2px solid var(--amber); background:#33270f}
footer.site{
  border-top:1px solid var(--panel-border); background:#202020; color:var(--secondary);
  padding:1.6rem 0 2.2rem; margin-top:1rem; font-size:.98rem;
}
footer.site a{color:var(--amber)}
ol.steps li, ul.tight li{margin:.35rem 0}
.copied{color:var(--amber); font-weight:600}
@media (max-width:40rem){
  .hero img.logo{width:88px; height:88px}
  h1{font-size:1.7rem}
}