
/* Simple RPG extras on top of 334.css / style.css */
.srpg .hero{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:center;width:min(calc(100% - 32px),var(--max));margin:40px auto 10px}
.srpg .hero-panel{border:1px solid var(--line);background:var(--panel);padding:36px 28px;text-align:center;min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.srpg .hero-panel .die{font:400 5rem/1 "VT323",monospace;color:var(--hot);text-shadow:0 0 22px rgba(255,45,120,.45);border:2px solid var(--cyan);width:120px;height:120px;display:grid;place-items:center}
.srpg .hero-panel p{font:.85rem "Share Tech Mono",monospace;letter-spacing:.18em;color:var(--cyan);margin:0}
.srpg .lede{color:var(--muted);max-width:62ch}
.srpg .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin:18px 0 40px}
.srpg .card{display:flex;flex-direction:column;gap:8px;padding:18px;border:1px solid var(--line);background:var(--panel);text-decoration:none;color:inherit;min-height:160px}
.srpg .card h3{margin:0;font:400 1.55rem/1.1 "VT323",monospace;color:var(--cyan)}
.srpg .card p{margin:0;flex:1;color:var(--muted);font-size:.95rem}
.srpg .intro,.srpg #rules,.srpg #labs,.srpg #adventures,.srpg #about,.srpg .chapter,.srpg .lab-page{width:min(calc(100% - 32px),var(--max));margin:28px auto}
.srpg .triad{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.srpg .triad > div{border:1px solid var(--line);background:var(--panel);padding:18px}
.srpg .triad h2{font:400 1.45rem "VT323",monospace;color:var(--cyan);margin:.2rem 0 .4rem}
.srpg .triad b{font:400 .78rem "Share Tech Mono",monospace;letter-spacing:.14em;color:var(--hot)}
.srpg .prose{max-width:72ch}
.srpg .prose.chapter,.srpg .lab-page{max-width:min(calc(100% - 32px),860px)}
.srpg .table-wrap{overflow-x:auto;margin:1rem 0}
.srpg table{width:100%;border-collapse:collapse;font-size:.9rem}
.srpg th,.srpg td{border:1px solid var(--line);padding:.45rem .55rem;vertical-align:top}
.srpg th{color:var(--yellow);font-family:"Share Tech Mono",monospace;font-weight:400;text-align:left}
.srpg .lab{border:1px solid var(--line);background:var(--panel);padding:18px;display:flex;flex-direction:column;gap:12px;margin:18px 0}
.srpg .lab label{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;font:.85rem "Share Tech Mono",monospace;color:var(--muted)}
.srpg .lab input,.srpg .lab select{background:#05000a;color:var(--cyan);border:1px solid var(--cyan);padding:.35rem .55rem;font:inherit}
.srpg .lab-row{display:flex;flex-wrap:wrap;gap:10px}
.srpg .lab button{cursor:pointer;padding:.45rem .8rem;background:transparent;color:var(--cyan);border:1px solid var(--cyan);font:inherit}
.srpg .lab button:hover{background:var(--yellow);border-color:var(--yellow);color:#08000c}
.srpg .lab button.ghost{opacity:.85}
.srpg .result{margin:0;white-space:pre-wrap;word-break:break-word;background:#05000a;border:1px solid var(--line);padding:14px;color:var(--hot);font-family:"Share Tech Mono",monospace;min-height:4.5rem}
.srpg .callout{border:1px dashed var(--hot);padding:14px 16px;margin:1rem 0 1.4rem;background:rgba(255,45,120,.06)}
.srpg .callout p{margin:.35rem 0}
.srpg .chapter-nav{display:flex;gap:18px;flex-wrap:wrap;margin:2rem 0 1rem;padding-top:1rem;border-top:1px solid var(--line)}
.srpg .chapter-nav a{color:var(--yellow);text-decoration:none}
@media(max-width:900px){
  .srpg .hero{grid-template-columns:1fr}
  .srpg .triad{grid-template-columns:1fr}
  .srpg .hero-panel{min-height:160px}
}

/* base layout borrowed for non-tlm-prose pages */
body.tlm{margin:0;font:16px/1.55 "Share Tech Mono",ui-monospace,monospace;color:var(--ink,#e6f4f2);background:var(--paper,#0a0010)}
.skip{position:absolute;left:16px;top:12px;z-index:20;padding:8px 12px;transform:translateY(-160%);background:var(--yellow,#ffe600);color:#000;text-decoration:none}
.skip:focus-visible{transform:none}
.srpg .hero h1{font-size:clamp(64px,12vw,110px);line-height:.9;margin:.2rem 0 .6rem}
.srpg .lead{font-size:1.25rem;color:var(--muted,#a9c9c5);max-width:40ch}
.srpg .button{display:inline-block;padding:.55rem 1rem;text-decoration:none;margin:.2rem .35rem .2rem 0}
.srpg section h2{font:400 2rem "VT323",monospace;color:var(--cyan,#00ffe7);letter-spacing:.06em}
.srpg .prose h1{font:400 clamp(2.4rem,6vw,3.4rem)/1 "VT323",monospace;color:var(--cyan);margin:.2rem 0 1rem}
.srpg .prose h2{font:400 1.7rem "VT323",monospace;margin:1.6rem 0 .6rem}
.srpg .prose h3{font:400 1.35rem "VT323",monospace;color:var(--yellow);margin:1.2rem 0 .4rem}
.srpg .prose ul{padding-left:1.2rem}
.srpg .prose li{margin:.25rem 0}

/* Paper / neon: avoid hard-coded neon blacks that break .dark */
.srpg .lab input,
.srpg .lab select{
  background:var(--paper);
  color:var(--ink);
  border:1px solid var(--line);
}
.srpg .result{
  background:var(--paper);
  border:1px solid var(--line);
  color:var(--hot);
}
html{color-scheme:dark}
html.dark{color-scheme:light}
.dark .srpg .hero-panel .die{text-shadow:none}
.dark .site-header{background:rgba(230,233,221,.96);border-bottom-color:var(--line)}
.dark .site-header .brand{color:var(--cyan);text-shadow:none}
.dark .site-header .nav a{color:var(--muted)}
.dark .site-header .nav a:hover,
.dark .site-header .nav a[aria-current="page"]{color:var(--accent)}
.dark footer.site-footer{background:rgba(230,233,221,.96);border-top-color:var(--line)}
.dark .footer-inner,
.dark .footer-inner a{color:var(--muted)}

/* Printable character sheet */
.srpg .sheet-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:0 0 1.2rem}
.srpg .sheet-toolbar .button{cursor:pointer;border:1px solid var(--hot);background:var(--hot);color:#08000c;font:.9rem "Share Tech Mono",monospace;letter-spacing:.08em;padding:.5rem .9rem}
.srpg .sheet-toolbar .button:hover{background:var(--yellow);border-color:var(--yellow)}
.srpg .char-sheet{
  border:1px solid var(--line);
  background:var(--panel);
  padding:18px 20px 22px;
  max-width:720px;
}
.srpg .char-sheet h2{
  font:400 1.6rem "VT323",monospace;
  color:var(--cyan);
  margin:0 0 .8rem;
  letter-spacing:.1em;
  border-bottom:1px solid var(--line);
  padding-bottom:.35rem;
}
.srpg .sheet-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin:0 0 14px}
.srpg .sheet-field{display:flex;flex-direction:column;gap:4px}
.srpg .sheet-field.full{grid-column:1 / -1}
.srpg .sheet-field label{
  font:.72rem "Share Tech Mono",monospace;
  letter-spacing:.12em;
  color:var(--hot);
  text-transform:uppercase;
}
.srpg .sheet-box{
  min-height:2.1rem;
  border:1px solid var(--cyan);
  background:rgba(0,255,231,.04);
  padding:.35rem .5rem;
}
.srpg .sheet-box.tall{min-height:3.4rem}
.srpg .sheet-box.notes{min-height:4.8rem}
.srpg .attr-row{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px;
  margin:0 0 14px;
}
.srpg .attr-cell{
  border:1px solid var(--line);
  text-align:center;
  padding:8px 4px 10px;
  background:rgba(0,0,0,.12);
}
.srpg .attr-cell .attr-name{
  display:block;
  font:.78rem "Share Tech Mono",monospace;
  letter-spacing:.1em;
  color:var(--yellow);
  margin-bottom:6px;
}
.srpg .attr-cell .sheet-box{
  min-height:2.4rem;
  margin:0 auto;
  width:100%;
  max-width:3.2rem;
}
.srpg .tools-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:8px;
  margin:0 0 14px;
}
.srpg .sheet-hint{font:.8rem "Share Tech Mono",monospace;color:var(--muted);margin:.6rem 0 0}
.srpg .sheet-classes{font:.8rem "Share Tech Mono",monospace;color:var(--muted);margin:0 0 12px}

@media(max-width:700px){
  .srpg .attr-row{grid-template-columns:repeat(3,1fr)}
  .srpg .tools-grid{grid-template-columns:repeat(2,1fr)}
  .srpg .sheet-grid{grid-template-columns:1fr}
}

@media print{
  .srpg .sheet-toolbar,
  .site-header,
  .book-bar,
  .site-footer,
  .srpg .chapter-nav,
  .srpg .sheet-screen-only{display:none!important}
  body.tlm.srpg{background:#fff;color:#000;font-size:11pt}
  .srpg .prose.chapter{width:100%;max-width:none;margin:0;padding:0}
  .srpg .char-sheet{
    border:2px solid #000;
    background:#fff;
    padding:10px 12px;
    max-width:none;
    box-shadow:none;
  }
  .srpg .char-sheet h2{color:#000;border-bottom-color:#000;font-size:16pt}
  .srpg .sheet-field label{color:#000}
  .srpg .sheet-box{
    border:1.5px solid #000;
    background:#fff;
    min-height:1.7rem;
  }
  .srpg .sheet-box.tall{min-height:2.6rem}
  .srpg .sheet-box.notes{min-height:3.6rem}
  .srpg .attr-cell{border-color:#000;background:#fff}
  .srpg .attr-cell .attr-name{color:#000}
  .srpg .sheet-hint,.srpg .sheet-classes,.srpg .eyebrow{color:#333}
  .srpg .prose h1{color:#000;font-size:18pt;margin:0 0 .4rem}
  a{color:#000;text-decoration:none}
  @page{margin:12mm}
}
