:root{
  --bg:#080b14;
  --bg-soft:#0d1220;
  --card:#111729;
  --card-border:#1f2a44;
  --text:#e8ecf7;
  --text-dim:#9aa5c0;
  --text-faint:#7d87ab;
  --violet:#8b5cf6;
  --cyan:#22d3ee;
  --lime:#c6f24a;
  --gradient:linear-gradient(135deg,var(--violet),var(--cyan));
}
*{box-sizing:border-box;margin:0;padding:0;}
html{overflow-x:hidden;}
body{
  background:var(--bg);color:var(--text);
  font-family:'Inter',system-ui,sans-serif;line-height:1.7;
}
a{color:var(--cyan);}
.wrap{max-width:760px;margin:0 auto;padding:0 24px;}

header{
  background:rgba(8,11,20,0.9);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--card-border);position:sticky;top:0;z-index:50;
}
.nav{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;
  max-width:1160px;margin:0 auto;gap:16px;}
.logo{font-family:'Sora',sans-serif;font-weight:800;font-size:1rem;color:var(--text);
  text-decoration:none;white-space:nowrap;}
.logo span{background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent;}
.back{font-size:0.85rem;color:var(--text-dim);text-decoration:none;white-space:nowrap;}
.back:hover{color:var(--text);}

main{padding:56px 0 80px;}
h1{font-family:'Sora',sans-serif;font-size:clamp(1.7rem,4vw,2.3rem);font-weight:800;
  letter-spacing:-0.02em;margin-bottom:10px;}
.updated{color:var(--text-faint);font-size:0.85rem;margin-bottom:36px;}
h2{font-family:'Sora',sans-serif;font-size:1.15rem;font-weight:700;
  margin:34px 0 10px;color:var(--text);}
h3{font-family:'Sora',sans-serif;font-size:1rem;font-weight:600;margin:20px 0 8px;}
p{color:var(--text-dim);margin-bottom:12px;}
ul,ol{color:var(--text-dim);margin:0 0 14px;padding-left:22px;}
li{margin-bottom:7px;}
strong{color:var(--text);}
table{width:100%;border-collapse:collapse;margin:14px 0 20px;font-size:0.9rem;}
th,td{border:1px solid var(--card-border);padding:10px 12px;text-align:left;
  color:var(--text-dim);vertical-align:top;}
th{background:var(--bg-soft);color:var(--text);font-weight:600;}
.table-scroll{overflow-x:auto;}

.todo{
  background:rgba(198,242,74,0.07);border:1px dashed rgba(198,242,74,0.45);
  border-radius:10px;padding:14px 16px;margin:0 0 28px;
  color:var(--lime);font-size:0.87rem;
}
.todo strong{color:var(--lime);}
.ph{background:rgba(198,242,74,0.13);border-bottom:1px dashed var(--lime);
  color:var(--lime);padding:0 4px;border-radius:3px;font-weight:600;}

footer{border-top:1px solid var(--card-border);background:var(--bg-soft);padding:32px 0;}
.footer-links{display:flex;gap:20px;flex-wrap:wrap;font-size:0.85rem;color:var(--text-faint);}
.footer-links a{color:var(--text-faint);text-decoration:none;}
.footer-links a:hover{color:var(--text);}
.copy{color:var(--text-faint);font-size:0.78rem;margin-top:16px;}
