
body { margin:0; background:#ffffff; color:#111111; font-family: Arial, Helvetica, sans-serif; font-size:16px; line-height:1.55; }
a { color:#0645ad; text-decoration: underline; }
.header { border-bottom:1px solid #999; padding:14px 20px; background:#f8f8f8; }
.header h1 { margin:0; font-size:24px; font-weight:bold; }
.header .subtitle { color:#444; margin-top:2px; }
.layout { display:block; }
.sidebar { float:left; width:260px; min-height:calc(100vh - 54px); border-right:1px solid #999; background:#f3f3f3; padding:14px 14px 30px 18px; box-sizing:border-box; }
.sidebar h2 { font-size:18px; margin:0 0 8px 0; }
.sidebar ul { margin:0; padding-left:18px; }
.sidebar li { margin:5px 0; }
.sidebar li.active a { font-weight:bold; color:#000; }
.content { margin-left:290px; max-width:980px; padding:24px 36px 60px 20px; }
h1 { font-size:30px; margin:0 0 12px; }
h2 { font-size:23px; border-bottom:1px solid #aaa; padding-bottom:3px; margin-top:34px; }
h3 { font-size:18px; margin-top:20px; }
.intro { border:1px solid #777; background:#fbfbfb; padding:12px 16px; margin:12px 0 18px; }
.note, .task, .checklist, .patterns { border:1px solid #999; background:#f9f9f9; padding:10px 14px; margin:14px 0; }
.task { border-left:6px solid #777; }
.listing { border-top:1px solid #bbb; padding-top:12px; margin-top:18px; }
.listing h3 { font-size:17px; margin-bottom:7px; }
pre { background:#f4f4f4; border:1px solid #999; padding:12px; overflow:auto; white-space:pre; font-size:14px; line-height:1.45; }
code { font-family: Consolas, Menlo, Monaco, 'Courier New', monospace; }
details { border:1px solid #aaa; padding:8px 12px; margin-top:8px; background:#fff; }
summary { cursor:pointer; font-weight:bold; }
table { border-collapse:collapse; width:100%; margin:15px 0; }
th, td { border:1px solid #999; padding:7px 9px; text-align:left; vertical-align:top; }
th { background:#efefef; }
hr { border:0; border-top:1px solid #aaa; margin:24px 0; }
.footer { clear:both; border-top:1px solid #999; padding:12px 20px; color:#555; background:#f8f8f8; font-size:14px; }
@media (max-width: 900px) { .sidebar { float:none; width:auto; min-height:0; border-right:0; border-bottom:1px solid #999; } .content { margin-left:0; padding:18px; } }
