/* Matches krm9c.github.io (Jekyll, _sass/main.scss): dark navy bg, teal primary,
   coral accent, Montserrat, a 280px left sidebar + content column. */
:root{
  --bg:#1a1a2e; --sidebar:#1a1a2e; --panel:#212138; --panel2:#26264a;
  --primary:#4ECDC4;                /* teal */
  --accent:#FF6B6B;                 /* coral */
  --amber:#FF8E72; --violet:#5DADE2;
  --text:#ffffff; --text-light:rgba(255,255,255,.7); --muted:rgba(255,255,255,.5);
  --border:rgba(255,255,255,.1); --sidebar-w:280px;
}
*{box-sizing:border-box}
body{margin:0;font-family:'Montserrat',-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:16px;line-height:1.65;color:var(--text-light);background:var(--bg)}

/* ---- sidebar (left), matching the site ---- */
.sidebar{position:fixed;top:0;left:0;width:var(--sidebar-w);height:100vh;overflow-y:auto;
  background:var(--sidebar);border-right:1px solid var(--border);padding:28px 22px;display:flex;
  flex-direction:column;gap:22px}
.sidebar-name{font-weight:700;font-size:20px;color:var(--text)}
.sidebar-name::after{content:"";display:block;width:46px;height:3px;margin-top:10px;border-radius:2px;
  background:linear-gradient(90deg,var(--primary),var(--accent))}
.sidebar-title{font-size:13px;color:var(--text-light);margin-top:10px}
.sidebar-nav{display:flex;flex-direction:column;gap:4px}
.sidebar-nav a{display:block;padding:.55rem .9rem;border-radius:8px;color:var(--text-light);
  text-decoration:none;font-size:14px;font-weight:500;transition:background .15s,color .15s}
.sidebar-nav a:hover{background:rgba(255,255,255,.06);color:var(--text)}
.sidebar-nav a.active{background:rgba(78,205,196,.16);color:var(--primary)}
.sidebar-foot{margin-top:auto;font-size:13px}
.sidebar-foot a{color:var(--muted)}.sidebar-foot a:hover{color:var(--primary)}

/* ---- content ---- */
main{margin-left:var(--sidebar-w);min-height:100vh;display:flex;flex-direction:column}
.content{max-width:860px;width:100%;margin:0 auto;padding:44px 32px 40px;flex:1}
h1{font-size:32px;margin:0 0 6px;color:var(--text);font-weight:700;letter-spacing:-.01em}
h1::after{content:"";display:block;width:88px;height:3px;margin-top:14px;border-radius:2px;
  background:linear-gradient(90deg,var(--primary),var(--accent))}
h2{font-size:22px;margin-top:44px;padding-bottom:6px;color:var(--text);font-weight:600;
  border-bottom:1px solid var(--border)}
h4{margin:22px 0 6px;color:var(--text);font-weight:600}
h5{margin:14px 0 4px;color:var(--text-light);font-weight:600}
p,li{color:var(--text-light)}
strong,b{color:var(--text)}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13.5px;color:#d9fbf7}
pre{background:var(--panel);border:1px solid var(--border);border-left:3px solid var(--primary);
  border-radius:10px;padding:14px 16px;overflow:auto}
pre code{color:#e6f0ee}
pre.doc{background:transparent;border:none;padding:0;white-space:pre-wrap;color:var(--text-light)}
.member{border-left:3px solid var(--accent);padding-left:16px;margin:20px 0}
.member h4 code{color:var(--primary)}
.method{margin-left:18px;border-left:2px solid var(--border);padding-left:14px}
.toc{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:12px 18px;margin:20px 0}
.toc b{color:var(--text)}.toc ul{columns:2;margin:6px 0 0}
.toc a{color:var(--primary);text-decoration:none}.toc a:hover{color:var(--accent)}
.nodoc{color:var(--muted);font-style:italic}
table{border-collapse:collapse;width:100%;margin:16px 0;font-size:14px}
th,td{border:1px solid var(--border);padding:8px 11px;text-align:left}
th{background:var(--panel2);color:var(--text)}
tr:nth-child(even) td{background:rgba(255,255,255,.03)}
a{color:var(--primary);text-decoration:none}a:hover{color:var(--accent)}
footer{border-top:1px solid var(--border);color:var(--muted);font-size:13px;padding:22px 32px;text-align:center}

/* ---- mobile: collapse the sidebar ---- */
.sidebar-toggle{display:none;position:fixed;top:14px;right:16px;z-index:20;width:44px;height:44px;
  align-items:center;justify-content:center;background:var(--panel);border:1px solid var(--border);
  border-radius:8px;color:var(--text);font-size:20px;cursor:pointer}
@media(max-width:820px){
  .sidebar{transform:translateX(-100%);transition:transform .2s;z-index:15}
  #navtoggle:checked ~ .sidebar{transform:translateX(0)}
  .sidebar-toggle{display:flex}
  main{margin-left:0}
  .content{padding:64px 20px 40px}
}