:root { --blue:#0b57d0; --ink:#1c2128; --mut:#5b6472; --line:#d9dee6; --bg:#f4f6f9; }
* { box-sizing: border-box; }
body { margin:0; font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif; color:var(--ink); background:#fff; line-height:1.6; }
a { color:var(--blue); text-decoration:none; }
.wrap { max-width:820px; margin:0 auto; padding:0 20px 60px; }
header.top { position:sticky; top:0; z-index:9; background:rgba(255,255,255,.94); backdrop-filter:blur(4px); border-bottom:1px solid var(--line); }
header.top .in { max-width:820px; margin:0 auto; padding:10px 20px; display:flex; align-items:center; gap:14px; }
header.top .brand { font-weight:700; color:var(--blue); }
header.top nav { display:flex; gap:14px; font-size:14px; }
header.top nav a.on { font-weight:700; }
h1 { font-size:22px; margin:26px 0 6px; }
p.sub { color:var(--mut); margin:0 0 18px; font-size:14px; }
.search { width:100%; padding:10px 14px; font-size:15px; border:1.5px solid var(--line); border-radius:8px; margin:4px 0 18px; outline:none; }
.search:focus { border-color:var(--blue); }
h2.sec { font-size:16px; margin:26px 0 10px; padding:7px 12px; background:var(--blue); color:#fff; border-radius:8px; }
h2.sec.hide { display:none; }
h2.sec .cnt { font-weight:400; font-size:12px; opacity:.85; margin-left:8px; }
a.entry { display:block; padding:9px 12px; border:1px solid var(--line); border-radius:8px; margin-bottom:8px; color:var(--ink); font-size:14.5px; transition:border-color .12s; }
a.entry:hover { border-color:var(--blue); }
a.entry .no { font-weight:700; color:var(--blue); }
a.entry .kw { color:var(--mut); }
a.entry .chip { float:right; color:#98a1ae; font-size:12px; margin-left:10px; }
a.entry.hide { display:none; }
p.none { display:none; color:var(--mut); text-align:center; padding:30px 0; }
.home { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:22px; }
@media (max-width:640px){ .home { grid-template-columns:1fr; } }
a.big { border:1.5px solid var(--line); border-radius:12px; padding:22px; display:block; }
a.big:hover { border-color:var(--blue); }
a.big .t { font-size:19px; font-weight:700; color:var(--blue); }
a.big .d { color:var(--mut); font-size:13.5px; margin-top:8px; }
.crumb { font-size:13px; color:var(--mut); margin:18px 0 4px; }
.card { border:1px solid var(--line); border-radius:12px; padding:18px 20px; margin-top:12px; }
.card .ttl { font-size:19px; font-weight:700; margin:0 0 10px; }
.card .ttl .lc { color:var(--blue); font-family:Menlo,Consolas,monospace; font-size:15px; margin-right:8px; }
.card .en { color:#98a1ae; font-size:13px; font-weight:400; margin-left:8px; }
.diff { font-size:12px; font-weight:600; padding:2px 10px; border-radius:99px; vertical-align:2px; }
.diff.easy { color:#0a7d38; background:#e6f6ec; } .diff.medium { color:#b45309; background:#fdf1de; } .diff.hard { color:#c22a2a; background:#fdeaea; }
.ds, .hint { margin:10px 0; }
.hint { padding-left:12px; border-left:3px solid #b9cdf3; color:#414b58; }
.hint b { color:var(--blue); }
code { font-family:"SF Mono",Menlo,Consolas,monospace; font-size:.92em; background:#eef2f8; padding:1px 5px; border-radius:4px; }
pre.code { margin:12px 0 0; padding:14px 16px; background:var(--bg); border-radius:8px; overflow-x:auto; font-family:"SF Mono",Menlo,Consolas,"Courier New",monospace; font-size:13px; line-height:1.55; }
pre.code .k, pre.code .kn, pre.code .kr, pre.code .ow, pre.code .kc, pre.code .kd { color:var(--blue); font-weight:600; }
pre.code .s, pre.code .s1, pre.code .s2, pre.code .sd, pre.code .sa, pre.code .si, pre.code .se { color:#0a7d38; }
pre.code .c, pre.code .c1, pre.code .ch, pre.code .cm { color:#7d8794; font-style:italic; }
pre.code .mi, pre.code .mf, pre.code .mh, pre.code .mo, pre.code .il { color:#b45309; }
pre.code .nf { color:var(--ink); font-weight:600; }
.meta { color:#98a1ae; font-size:13px; margin-top:14px; }
.pager { display:flex; justify-content:space-between; margin:26px 0 40px; gap:10px; }
.pager a { border:1px solid var(--line); border-radius:8px; padding:9px 14px; font-size:14px; max-width:48%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pager a:hover { border-color:var(--blue); }
.toc { font-size:13px; color:var(--mut); margin-bottom:14px; line-height:2.1; }
.toc a { display:inline-block; background:#eef2f8; color:#2b5bb7; padding:2px 11px; border-radius:99px; margin:0 8px 6px 0; white-space:nowrap; }
.toc a:hover { background:var(--blue); color:#fff; }
.toc a.hide { display:none; }