*{box-sizing:border-box}body{margin:0;font:16px/1.65 Arial,Helvetica,sans-serif;color:#222;background:#fff}
a{color:#1a3fd0}
/* --- mobile first --- */
.topbar{display:flex;align-items:center;justify-content:space-between;background:#ff0000}
.logo{display:block;flex:none}.logo img{height:46px;display:block}
.burger{display:flex;align-items:center;font-size:24px;color:#fff;padding:0 18px;cursor:pointer;user-select:none}
.menu{display:none;padding:8px 16px 20px;border-bottom:1px solid #eee}
#mnav:checked ~ .side .menu{display:block}
.acct{display:block;font-size:13px;text-decoration:none;margin:3px 0}.acct:hover{text-decoration:underline}
.grp{margin:12px 0}.lk{display:flex;align-items:center;gap:9px;text-decoration:none}.mtxt{color:#333;font-weight:bold;font-size:16px}.icn{height:26px}
.grp select{display:block;width:100%;max-width:340px;font-size:13px;margin:3px 0;padding:4px}
.bar{background:#ff9900;color:#fff;font-weight:bold;padding:11px 16px;font-size:14px}
.bar a{color:#fff;text-decoration:none}.bar a:hover{text-decoration:underline}
.body{padding:18px 16px 72px}.lead{font-size:13px;color:#777}
h1.tt{font-size:24px;margin:.1em 0 .15em;line-height:1.2}.by{color:#666;font-style:italic;margin-bottom:16px}
.cover{display:block;float:none;width:160px;margin:2px auto 18px;border-radius:3px;box-shadow:0 6px 20px rgba(0,0,0,.25)}
h2.sec{font-size:16px;border-bottom:1px solid #ff9900;padding-bottom:4px;margin:20px 0 10px;color:#333}
.content{font-size:17px;line-height:1.75}.content p{margin:0 0 1em}.content img{max-width:100%;height:auto}
.content blockquote{margin:1em 0;padding-left:1em;border-left:3px solid #ffcc80;color:#555}
ul.toc{list-style:none;padding:0;margin:0}ul.toc li{margin:5px 0}ul.toc a{text-decoration:none}ul.toc a:hover{text-decoration:underline}
.auth{color:#6b6256;font-size:.92em}
.searchbox{display:flex;gap:8px;margin:4px 0 16px;max-width:560px}
.searchbox input{flex:1;padding:9px 12px;font-size:16px;border:1px solid #ccc;border-radius:4px}
.searchbox button{padding:9px 18px;font-size:15px;font-weight:bold;background:#ff9900;color:#fff;border:0;border-radius:4px;cursor:pointer}
.searchstatus{color:#777;font-size:14px;margin:0 0 12px}.searchresults li{margin:7px 0}
.nav{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #eee;margin-top:28px;padding-top:14px;font-size:14px}
.nav a{text-decoration:none}.nav .mid{color:#999;text-align:center}
.grid{display:flex;flex-wrap:wrap;gap:20px;margin-top:18px}
.card{width:140px}.card img{width:140px;border-radius:3px;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.card a{text-decoration:none;font-size:13px;display:block;margin-top:6px}
/* --- desktop --- */
@media(min-width:780px){
  .wrap{display:flex;min-height:100vh}
  .side{width:210px;flex:none;border-right:1px solid #eee}
  .topbar{display:block}.logo{display:block}.logo img{height:auto;width:100%}.burger{display:none}
  .menu{display:block;padding:6px 12px 40px;border-bottom:0}
  .main{flex:1;min-width:0}
  .body{max-width:820px;padding:22px 28px 80px}
  .content{font-size:16px;line-height:1.7}.content p{text-align:justify}
  .cover{float:right;width:150px;margin:0 0 14px 22px}
  ul.toc{column-width:220px;column-gap:32px}ul.toc li{margin:3px 0}
}