:root{--blue-50:#f2f7ff;--blue-100:#e4eefe;--blue-200:#c9ddfd;--blue-300:#9dc2fa;--blue-400:#6ba1f6;--blue-500:#4a86ee;--blue-600:#2f6fed;--blue-700:#2557c4;--ink:#16233a;--ink-soft:#43536e;--muted:#74839c;--line:#dbe6f7;--surface:#fff;--surface-soft:#f7faff;--ok:#1f9d6b;--warn:#c9822a;--err:#cf4b4b;--radius-sm:10px;--radius:14px;--radius-lg:20px;--radius-pill:999px;--shadow-sm:0 1px 2px #18366e0d, 0 2px 8px #18366e0a;--shadow:0 2px 6px #18366e0f, 0 12px 28px #18366e12;--shadow-lg:0 4px 12px #18366e14, 0 20px 48px #18366e1a;--grad-brand:linear-gradient(135deg, #4a86ee 0%, #7c6ef6 100%);--grad-page:linear-gradient(180deg, #f7faff 0%, #eef4ff 60%, #e9f0ff 100%);--grad-card:linear-gradient(135deg, #4a86ee0f, #8fc0fb24);--font:"PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Noto Sans SC", system-ui, -apple-system, "Segoe UI", sans-serif;--mono:"JetBrains Mono", "Cascadia Code", Consolas, "Courier New", monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font);color:var(--ink);background:var(--grad-page);-webkit-font-smoothing:antialiased;background-attachment:fixed;margin:0;line-height:1.65;overflow-x:hidden}a{color:var(--blue-700);text-decoration:none}a:hover{color:var(--blue-600)}.wrap{width:100%;max-width:1080px;margin:0 auto;padding:0 20px}.site-header{z-index:50;backdrop-filter:saturate(160%)blur(12px);border-bottom:1px solid var(--line);background:#ffffffd1;position:sticky;top:0}.site-header .wrap{flex-wrap:wrap;align-items:center;gap:10px 18px;min-height:62px;display:flex}.brand{color:var(--ink);align-items:center;gap:10px;font-weight:700;display:flex}.brand:hover{color:var(--ink)}.brand-mark{background:var(--grad-brand);color:#fff;border-radius:9px;place-items:center;width:30px;height:30px;font-size:15px;font-weight:800;display:grid;box-shadow:0 4px 12px #4a86ee59}.brand-name{letter-spacing:.3px}.site-nav{flex-wrap:wrap;gap:4px;margin-left:auto;display:flex}.site-nav a{border-radius:var(--radius-pill);color:var(--ink-soft);padding:7px 13px;font-size:14px;transition:background .18s,color .18s}.site-nav a:hover{background:var(--blue-100);color:var(--blue-700)}.site-nav a.active{background:var(--blue-100);color:var(--blue-700);font-weight:600}.nav-drop{position:relative}.nav-root{align-items:center;gap:5px;display:inline-flex}.caret{opacity:.65;font-size:10px;transition:transform .18s}.nav-drop:hover .caret,.nav-drop.open .caret{transform:rotate(180deg)}.drop-panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);min-width:196px;box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;z-index:60;flex-direction:column;gap:2px;padding:6px;transition:opacity .16s,transform .16s,visibility .16s;display:flex;position:absolute;top:calc(100% + 8px);left:0;transform:translateY(-6px)}.nav-drop:hover .drop-panel,.nav-drop:focus-within .drop-panel,.nav-drop.open .drop-panel{opacity:1;visibility:visible;transform:translateY(0)}.drop-panel a{color:var(--ink-soft);border-radius:10px;align-items:center;gap:9px;padding:8px 12px;font-size:14px;display:flex}.drop-panel a:hover{background:var(--blue-50);color:var(--blue-700)}.drop-ico{text-align:center;width:18px;color:var(--violet);flex:0 0 18px;font-size:13px}.site-footer{border-top:1px solid var(--line);color:var(--muted);margin-top:64px;padding:28px 0 40px;font-size:13px}.site-footer .wrap{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.site-footer .sep{opacity:.5}.hero{padding:52px 0 26px}.hero h1{letter-spacing:-.4px;background:linear-gradient(120deg,#2557c4 0%,#4a86ee 45%,#7fb4f9 100%);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0 0 10px;font-size:clamp(30px,4.4vw,44px);line-height:1.22}.hero p{color:var(--ink-soft);max-width:640px;margin:0;font-size:16px}.hero-chips{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.chip{border-radius:var(--radius-pill);background:var(--surface);border:1px solid var(--line);color:var(--ink-soft);box-shadow:var(--shadow-sm);align-items:center;gap:6px;padding:6px 12px;font-size:13px;display:inline-flex}.toolbar{flex-wrap:wrap;align-items:center;gap:12px;max-width:100%;margin:26px 0 20px;display:flex}.toolbar>*{min-width:0}.search{flex:260px;min-width:220px;position:relative}.toolbar .search input,.toolbar .search input[type=text]{border-radius:var(--radius-pill);border:1px solid var(--line);background:var(--surface);width:100%;font-family:var(--font);color:var(--ink);box-shadow:var(--shadow-sm);padding:11px 14px 11px 38px;font-size:14px;transition:border .18s,box-shadow .18s}.search input:focus{border-color:var(--blue-300);outline:none;box-shadow:0 0 0 4px #4a86ee21}.search .ico{color:var(--muted);pointer-events:none;font-size:14px;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.tabs{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-wrap:wrap;flex:0 auto;gap:4px;max-width:100%;padding:4px;display:inline-flex}.tab{appearance:none;cursor:pointer;font-family:var(--font);border-radius:var(--radius-pill);color:var(--ink-soft);background:0 0;border:0;padding:8px 15px;font-size:14px;transition:background .18s,color .18s,box-shadow .18s}.tab:hover{background:var(--blue-50);color:var(--blue-700)}.tab[aria-selected=true]{background:var(--grad-brand);color:#fff;font-weight:600;box-shadow:0 4px 12px #4a86ee52}.grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;display:grid}.card{border-radius:var(--radius-lg);border:1px solid var(--line);background:var(--surface);min-height:84px;box-shadow:var(--shadow-sm);align-items:center;gap:14px;padding:16px 18px;transition:transform .18s,box-shadow .18s,border-color .18s;display:flex;position:relative;overflow:hidden}.card:after{content:"";background:var(--grad-card);opacity:0;pointer-events:none;transition:opacity .2s;position:absolute;inset:0}.card:hover{box-shadow:var(--shadow);border-color:var(--blue-200);transform:translateY(-2px)}.card:hover:after{opacity:1}.card-icon{width:46px;height:46px;font-family:var(--mono);color:var(--blue-700);border:1px solid var(--blue-100);background:linear-gradient(135deg,#eaf2ff,#dbe8ff);border-radius:13px;flex:0 0 46px;place-items:center;font-size:15px;font-weight:700;display:grid}.card-body{flex-direction:column;gap:2px;min-width:0;display:flex}.card-title{color:var(--ink);font-size:15.5px;font-weight:650;display:block}.card-desc{-webkit-line-clamp:2;color:var(--muted);-webkit-box-orient:vertical;font-size:13px;line-height:1.5;display:-webkit-box;overflow:hidden}.card-arrow{color:var(--blue-300);margin-left:auto;font-size:18px}.card.todo{opacity:.62}.card.todo .card-arrow{display:none}.badge{border-radius:var(--radius-pill);background:var(--blue-50);color:var(--blue-700);border:1px solid var(--blue-100);padding:2px 8px;font-size:11px;position:absolute;top:10px;right:12px}.empty{text-align:center;color:var(--muted);padding:40px 0}.tool-head{padding:34px 0 6px}.crumb{color:var(--muted);margin-bottom:14px;font-size:13px}.crumb a{color:var(--muted)}.crumb a:hover{color:var(--blue-600)}.tool-head h1{letter-spacing:-.3px;margin:0 0 6px;font-size:clamp(24px,3.2vw,32px)}.tool-head .sub{color:var(--ink-soft);margin:0}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-top:20px;padding:20px}.panel+.panel{margin-top:14px}.panel-title{color:var(--ink-soft);letter-spacing:.4px;text-transform:none;margin:0 0 12px;font-size:13px;font-weight:650}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.row.tight{gap:7px}.grow{flex:150px}.spacer{flex:1}.row>*,.grid>*,.kv .item>*{min-width:0}.row>input,.row>select,.row>textarea{flex:0 auto}.row>input.grow,.row>select.grow,.row>textarea.grow{flex:180px;width:auto}label.fld{color:var(--ink-soft);margin-bottom:6px;font-size:13px;display:block}input[type=text],input[type=number],input[type=date],input[type=datetime-local],select,textarea{width:100%;font-family:var(--font);color:var(--ink);background:var(--surface-soft);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;font-size:14px;transition:border .18s,box-shadow .18s,background .18s}textarea{resize:vertical;min-height:168px;line-height:1.6}textarea.mono,input.mono,pre,code,.mono{font-family:var(--mono)}input:focus,select:focus,textarea:focus{background:var(--surface);border-color:var(--blue-300);outline:none;box-shadow:0 0 0 4px #4a86ee21}.btn{appearance:none;cursor:pointer;font-family:var(--font);border-radius:var(--radius-pill);background:var(--grad-brand);color:#fff;border:1px solid #0000;padding:10px 18px;font-size:14px;font-weight:600;transition:transform .15s,box-shadow .18s,background .18s;box-shadow:0 4px 14px #4a86ee4d}.btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px #4a86ee61}.btn:active{transform:translateY(0)}.btn.ghost{background:var(--surface);color:var(--blue-700);border-color:var(--blue-200);box-shadow:var(--shadow-sm)}.btn.ghost:hover{background:var(--blue-50);box-shadow:var(--shadow-sm)}.btn.sm{padding:7px 13px;font-size:13px}.out{border-radius:var(--radius);background:var(--surface-soft);border:1px solid var(--line);font-family:var(--mono);white-space:pre-wrap;word-break:break-all;max-height:460px;color:var(--ink);margin-top:12px;padding:14px;font-size:13.5px;overflow:auto}.out:empty{display:none}.msg{border-radius:var(--radius);margin-top:12px;padding:10px 14px;font-size:13.5px;display:none}.msg.show{display:block}.msg.ok{color:#146b4a;background:#edf9f3;border:1px solid #c8ecdb}.msg.err{color:#9c3535;background:#fdf1f1;border:1px solid #f3d3d3}.msg.info{background:var(--blue-50);color:var(--blue-700);border:1px solid var(--blue-100)}.kv{gap:8px;display:grid}.kv .item{border-radius:var(--radius);background:var(--surface-soft);border:1px solid var(--line);align-items:center;gap:12px;padding:10px 14px;display:flex}.kv .k{color:var(--muted);overflow-wrap:anywhere;flex:0 0 132px;min-width:0;font-size:13px}.kv .v{font-family:var(--mono);color:var(--ink);word-break:break-all;flex:auto;min-width:0;font-size:14px}.kv .v.big{color:var(--blue-700);font-size:20px;font-weight:700}.stat-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;display:grid}.stat{border-radius:var(--radius);background:var(--surface-soft);border:1px solid var(--line);text-align:center;padding:14px}.stat .num{color:var(--blue-700);font-size:clamp(15px,2vw,22px);font-weight:750;font-family:var(--mono);overflow-wrap:anywhere;min-width:0;line-height:1.25}.stat .lbl{color:var(--muted);margin-top:2px;font-size:12.5px}.tip{color:var(--muted);margin:10px 0 0;font-size:13px}.hidden{display:none!important}:root{--sakura:#ff5f9e;--sakura-soft:#ffc2d9;--violet:#7c4dff;--grad-blossom:linear-gradient(120deg, #ff5f9e 0%, #b15cf0 48%, #4a86ee 100%)}.brand{position:relative}.brand-mark{background:var(--grad-blossom);box-shadow:0 4px 14px #ff5f9e52}.brand-petal{background:var(--sakura);border-radius:50% 0 50% 50%;width:9px;height:9px;position:absolute;bottom:-2px;right:-3px;transform:rotate(20deg);box-shadow:0 0 0 2px #ffffffe6}.hero{position:relative}.hero-glow{pointer-events:none;z-index:0;background:radial-gradient(540px 220px at 10% 36%,#4a86ee4d,#0000 70%),radial-gradient(460px 210px at 86% 10%,#ff5f9e6b,#0000 70%),radial-gradient(420px 190px at 56% 74%,#7c4dff4d,#0000 72%);height:320px;position:absolute;top:-60px;left:-20px;right:-20px}.hero>:not(.hero-glow){z-index:1;position:relative}.hero h1{background:linear-gradient(120deg,#2f6fed 0%,#8b5cf6 42%,#ff5f9e 100%);color:#0000;-webkit-background-clip:text;background-clip:text}.hero h1 .accent{background:linear-gradient(120deg,#ff2f7d 0%,#ff7fb0 100%);color:#0000;-webkit-background-clip:text;background-clip:text}.petal-dot{background:var(--grad-blossom);border-radius:50% 0 50% 50%;flex:none;width:8px;height:8px;margin-right:8px;display:inline-block;transform:rotate(18deg)}.ev-line{color:var(--ink-soft);border-left:2px solid var(--sakura);font-size:13.5px;line-height:1.95;font-family:"Songti SC", "STSong", "SimSun", "Noto Serif SC", var(--font);letter-spacing:.3px;align-items:center;gap:2px;padding:3px 0 3px 11px;display:inline-flex}.post-list{gap:12px;display:grid}.post-card{border-radius:var(--radius-lg);border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow-sm);padding:18px 20px;transition:transform .18s,box-shadow .18s,border-color .18s;display:block}.post-card:hover{box-shadow:var(--shadow);border-color:var(--blue-200);transform:translateY(-2px)}.post-title{color:var(--ink);margin:0 0 6px;font-size:17px;font-weight:650}.post-meta{color:var(--muted);flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:8px;font-size:12.5px;display:flex}.post-excerpt{color:var(--ink-soft);margin:0;font-size:14px}.tag-pill{border-radius:var(--radius-pill);background:var(--blue-50);color:var(--blue-700);border:1px solid var(--blue-100);padding:2px 9px;font-size:11.5px}.back-link{color:var(--muted);align-items:center;gap:6px;margin-bottom:12px;font-size:13.5px;display:inline-flex}.back-link:hover{color:var(--blue-600)}.article .body{font-size:15.5px}.article .body h2{border-left:3px solid var(--blue-300);margin:30px 0 10px;padding-left:11px;font-size:20px}.article .body h3{margin:22px 0 8px;font-size:17px}.article .body p{color:var(--ink-soft);margin:12px 0;line-height:1.88}.article .body ul,.article .body ol{color:var(--ink-soft);padding-left:22px;line-height:1.9}.article .body code{background:var(--blue-50);border:1px solid var(--blue-100);font-size:13px;font-family:var(--mono);border-radius:6px;padding:1px 5px}.article .body pre{color:#dce9ff;border-radius:var(--radius);background:#101d34;padding:14px 16px;line-height:1.7;overflow:auto}.article .body pre code{color:inherit;background:0 0;border:0;padding:0}.article .body blockquote{border-left:3px solid var(--sakura);border-radius:0 var(--radius) var(--radius) 0;color:var(--ink-soft);background:linear-gradient(90deg,#ff9ec417,#0000);margin:18px 0;padding:10px 16px}.article .body img{border-radius:var(--radius);max-width:100%}.article .body a{text-decoration:underline;text-decoration-color:var(--blue-200);text-underline-offset:3px}.article .body table{border-collapse:collapse;width:100%;margin:14px 0;font-size:14px}.article .body th,.article .body td{border:1px solid var(--line);text-align:left;padding:8px 10px}.article .body th{background:var(--surface-soft)}@media (width<=620px){.site-header .wrap{gap:6px 10px;padding-top:8px;padding-bottom:8px}.brand-name{font-size:15px}.brand{flex:none}.site-nav{gap:2px;width:100%;margin-left:0}.site-nav a{padding:6px 9px;font-size:12.5px}.grid{grid-template-columns:1fr}.kv .k{flex:0 0 96px}.hero{padding:30px 0 16px}.hero-glow{height:220px;top:-30px}.tab{padding:7px 12px;font-size:13px}.toolbar{gap:8px}}
