.skill-guide{color-scheme:light;--paper:#faf9fd;--card:#fff;--ink:#202034;--muted:#625e74;--line:#e5e0ed;--control-line:#9c82b5;--accent:#513aab;--tint:#eee8fa;--focus:#795edb;background:var(--paper);color:var(--ink);font:16px/1.65 system-ui,-apple-system,PingFang TC,Microsoft JhengHei,sans-serif}.skill-guide a{color:var(--accent)}.skill-guide a:focus-visible,.skill-guide button:focus-visible,.skill-guide input:focus-visible,.skill-guide summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.skill-guide a:hover{text-decoration-thickness:2px}.skill-guide .guide-wrap{max-width:1120px;margin:auto;padding-inline:clamp(18px,5vw,56px)}.skill-guide header{background:var(--paper);color:var(--ink);border-bottom:1px solid var(--line);padding:clamp(32px,7vw,82px) 0 clamp(34px,6vw,62px)}.skill-guide .eyebrow{color:var(--accent);letter-spacing:.11em;margin:0 0 12px;font-size:.82rem;font-weight:750}.skill-guide h1{letter-spacing:-.035em;text-wrap:balance;max-width:17em;margin:0 0 16px;font-size:clamp(1.95rem,5.5vw,3.9rem);line-height:1.12}.skill-guide header p:last-child{color:var(--muted);max-width:43em;margin:0}.skill-guide .guide-content{padding-block:28px 45px}.skill-guide h2{margin:0;font-size:clamp(1.3rem,3vw,1.75rem)}.skill-guide .callout{border:1px solid var(--line);background:radial-gradient(at 100% 0,#eee5ff 0%,#0000 65%),#faf7ff;border-radius:14px;margin-bottom:18px;padding:18px 22px}.skill-guide .callout p{margin:5px 0 0}.skill-guide .methods{border-bottom:1px solid var(--line);margin-bottom:28px;padding:6px 0 16px}.skill-guide summary{cursor:pointer;color:var(--accent);font-weight:720}.skill-guide .method-grid,.skill-guide .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.skill-guide .method-grid{margin-top:12px}.skill-guide .method-grid div{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:12px 15px}.skill-guide .method-grid p{margin:4px 0 0}.skill-guide .controls{flex-wrap:wrap;align-items:center;gap:10px;margin:12px 0 8px;display:flex}.skill-guide input{background:var(--card);min-width:min(100%,270px);color:var(--ink);border:1px solid var(--control-line);font:inherit;border-radius:8px;flex:1;padding:10px 12px}.skill-guide .filters{flex-wrap:wrap;gap:6px;display:flex}.skill-guide button{background:var(--card);color:var(--ink);border:1px solid var(--control-line);cursor:pointer;font:inherit;border-radius:8px;padding:8px 12px}.skill-guide button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#fff}.skill-guide .count{color:var(--muted);margin:0 0 10px;font-size:.9rem}.skill-guide article{background:var(--card);border:1px solid var(--line);border-radius:14px;flex-direction:column;min-width:0;padding:clamp(15px,3vw,23px);display:flex}.skill-guide .chips{flex-wrap:wrap;gap:6px;display:flex}.skill-guide .chip{background:var(--tint);color:var(--accent);border-radius:20px;padding:2px 8px;font-size:.76rem;font-weight:700;display:inline-block}.skill-guide .chip.file{color:#432079;background:#eee6fb}.skill-guide h3{overflow-wrap:anywhere;margin:9px 0 0;font-size:1.31rem;line-height:1.3}.skill-guide .repo{overflow-wrap:anywhere;margin:5px 0 15px;font-size:.84rem;line-height:1.45;display:block}.skill-guide .segment{border-top:1px solid var(--line);margin-top:11px;padding:11px 0 0}.skill-guide .segment-heading{flex-wrap:wrap;align-items:baseline;gap:8px;display:flex}.skill-guide .segment-heading strong{font-size:.94rem}.skill-guide time,.skill-guide .segment-heading span{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.81rem}.skill-guide .segment p{margin:3px 0 0}.skill-guide .demo{margin:auto 0 0;padding-top:16px}.skill-guide .demo img{background:var(--paper);border:1px solid var(--line);border-radius:9px;width:100%;height:auto;display:block}.skill-guide .demo figcaption{color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:4px 12px;margin-top:5px;font-size:.82rem;display:flex}.skill-guide #empty{background:var(--card);border-radius:8px;padding:16px}.skill-guide footer{color:var(--muted);border-top:1px solid var(--line);margin-top:28px;padding-top:18px;font-size:.89rem}.skill-guide .sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (width<=670px){.skill-guide .grid,.skill-guide .method-grid{grid-template-columns:1fr}.skill-guide input{width:100%}}.skill-guide h1,.skill-guide h2,.skill-guide h3{color:var(--ink);font-family:inherit}.skill-guide a:hover{color:var(--accent)}
