@import "https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;600&display=swap";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#07080d;--panel:#121622c7;--panel-strong:#181f2ff5;--line:#ffffff1a;--text:#eef4ff;--muted:#9aa7bd;--accent:#74f7c5;--accent-2:#8ea7ff;--rose:#ff7ba7;--shadow:0 24px 80px #0000006b;font-family:Geist,system-ui,-apple-system,BlinkMacSystemFont,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;color:var(--text);background:radial-gradient(circle at 12% 12%,#74f7c52e,#0000 26rem),radial-gradient(circle at 78% 4%,#8ea7ff2e,#0000 28rem),linear-gradient(#080a12 0%,#0b1020 48%,#07080d 100%);margin:0}button,input{font:inherit}a{color:inherit}.app-shell{width:min(1440px,100% - 36px);margin:0 auto;padding:42px 0 64px}.hero{border:1px solid var(--line);min-height:520px;box-shadow:var(--shadow);background:linear-gradient(135deg,#ffffff14,#ffffff06);border-radius:36px;grid-template-columns:minmax(0,1.15fr) 420px;align-items:center;gap:32px;padding:64px;display:grid;position:relative;overflow:hidden}.hero:after{content:"";filter:blur(36px);background:linear-gradient(90deg,#74f7c533,#8ea7ff29);height:280px;position:absolute;inset:auto -8% -35% 34%;transform:rotate(-4deg)}.hero-copy{z-index:1;position:relative}.eyebrow{color:var(--accent);letter-spacing:.02em;align-items:center;gap:8px;margin:0 0 18px;font-weight:700;display:inline-flex}h1{letter-spacing:-.07em;max-width:960px;margin:0;font-size:clamp(44px,7vw,88px);line-height:.94}.hero-desc{color:#c6d2e6;max-width:760px;margin:28px 0 0;font-size:20px;line-height:1.7}.hero-actions{flex-wrap:wrap;gap:12px;margin-top:34px;display:flex}.primary,.secondary{border-radius:999px;align-items:center;gap:10px;padding:14px 20px;font-weight:750;text-decoration:none;display:inline-flex}.primary{color:#090d16;background:#f5f7fb}.secondary{border:1px solid var(--line);color:#d9e4f6;background:#ffffff0d}.stats-panel{z-index:1;border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#07090f9e;border-radius:28px;gap:16px;padding:24px;display:grid;position:relative}.stats-panel div{background:linear-gradient(135deg,#74f7c524,#8ea7ff1a);border:1px solid #ffffff1a;border-radius:22px;padding:24px}.stats-panel strong{letter-spacing:-.05em;font-size:46px;display:block}.stats-panel span{color:var(--muted);font-weight:650}.workspace{grid-template-columns:250px minmax(320px,430px) minmax(360px,1fr);align-items:start;gap:18px;margin-top:22px;display:grid}.sidebar,.skill-list,.detail-panel{border:1px solid var(--line);background:var(--panel);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:28px;box-shadow:0 18px 50px #00000038}.sidebar{flex-direction:column;gap:9px;padding:16px;display:flex;position:sticky;top:16px}.search-box{border:1px solid var(--line);background:#ffffff0f;border-radius:16px;align-items:center;gap:10px;height:48px;margin-bottom:8px;padding:0 14px;display:flex}.search-box input{width:100%;color:var(--text);background:0 0;border:0;outline:0}.search-box input::placeholder{color:#66738a}.chip{color:#c7d2e6;cursor:pointer;text-align:left;background:0 0;border:1px solid #0000;border-radius:14px;justify-content:space-between;align-items:center;gap:8px;width:100%;padding:11px 12px;display:flex}.chip:hover,.chip.active{border-color:var(--line);color:#fff;background:#ffffff14}.chip-label{align-items:center;gap:8px;display:inline-flex}.chip span:last-child{color:var(--muted)}.skill-list{max-height:calc(100vh - 32px);padding:14px;overflow:auto}.list-header{color:var(--muted);justify-content:space-between;gap:12px;padding:8px 4px 14px;font-size:13px;display:flex}.skill-card{text-align:left;width:100%;color:var(--text);border:1px solid var(--line);cursor:pointer;background:#ffffff0b;border-radius:22px;margin-bottom:12px;padding:18px;transition:transform .18s,border-color .18s,background .18s}.skill-card:hover{background:#ffffff13;transform:translateY(-2px)}.skill-card.selected{background:linear-gradient(135deg,#74f7c521,#8ea7ff14);border-color:#74f7c5a6}.skill-card h3{letter-spacing:-.03em;margin:12px 0 8px;font-size:20px}.skill-card p{color:#bbc7dc;margin:0;line-height:1.55}.skill-card small{color:#77849a;margin-top:14px;font-family:Geist Mono,monospace;display:block}.category-pill{color:var(--accent);background:#74f7c51a;border:1px solid #74f7c533;border-radius:999px;align-items:center;gap:7px;padding:6px 10px;font-size:12px;font-weight:750;display:inline-flex}.category-pill.big{padding:8px 12px;font-size:13px}.detail-panel{min-height:calc(100vh - 32px);padding:28px;position:sticky;top:16px}.detail-topline{justify-content:space-between;align-items:center;gap:16px;display:flex}.detail-topline a{color:var(--muted);align-items:center;gap:5px;font-size:14px;text-decoration:none;display:inline-flex}.detail-panel h2{letter-spacing:-.06em;margin:24px 0 10px;font-size:clamp(32px,4vw,58px);line-height:1}.original{color:#78869c;margin:0 0 22px;font-family:Geist Mono,monospace}.explain-card{border:1px solid var(--line);background:#ffffff0e;border-radius:24px;margin:14px 0;padding:20px}.explain-card.accent{background:linear-gradient(135deg,#8ea7ff29,#ff7ba714)}.explain-card h4,.command-area h4{color:#fff;letter-spacing:-.01em;margin:0 0 10px;font-size:15px}.explain-card p{color:#c9d4e7;margin:0;font-size:17px;line-height:1.72}.command-area{margin-top:22px}.code-card{background:#060910;border:1px solid #ffffff1c;border-radius:20px;margin:12px 0;overflow:hidden}.code-card button{float:right;border:1px solid var(--line);color:#cbd7eb;cursor:pointer;background:#ffffff14;border-radius:999px;align-items:center;gap:6px;margin:10px;padding:7px 10px;display:inline-flex}pre{color:#dce7fb;margin:0;padding:48px 16px 16px;font-family:Geist Mono,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:1.55;overflow:auto}.no-code,.empty{color:var(--muted);border:1px dashed var(--line);border-radius:18px;padding:24px}@media (width<=1120px){.hero{grid-template-columns:1fr;padding:42px}.stats-panel{grid-template-columns:repeat(3,1fr)}.workspace{grid-template-columns:1fr}.sidebar,.detail-panel{min-height:auto;position:static}.skill-list{max-height:none}}@media (width<=720px){.app-shell{width:min(100% - 22px,1440px);padding-top:16px}.hero{border-radius:26px;min-height:auto;padding:26px}.hero-desc{font-size:16px}.stats-panel{grid-template-columns:1fr}.detail-panel{padding:20px}.list-header{flex-direction:column}}