:root{--bg:#0d0b0f;--panel:#171218;--panel2:#20171b;--text:#fff7ef;--muted:#b9aaa0;--line:#ffffff1f;--orange:#ffae62;--peach:#ff7f72;--mint:#78f0d5;--pink:#ee6fa4}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--text);background:radial-gradient(circle at 50% 0,#29160f 0,#110d10 35%,#09080a 100%);margin:0;font-family:PingFang SC,Noto Sans SC,Microsoft YaHei,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}.grain{pointer-events:none;opacity:.18;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");position:fixed;inset:0}.nav{z-index:10;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);justify-content:space-between;align-items:center;width:min(1120px,100% - 40px);margin:0 auto;padding:22px 0;display:flex;position:sticky;top:0}.brand{align-items:center;gap:12px;font-size:20px;font-weight:800;display:flex}.logo{background:linear-gradient(135deg,#ffb36b,#ff756e);border-radius:12px;place-items:center;width:40px;height:40px;display:grid;box-shadow:0 0 28px #ff8a4e73}.navLinks{color:#d9ccc4;align-items:center;gap:24px;font-size:14px;display:flex}.navLinks a:hover{color:#fff}.navCta{background:linear-gradient(135deg,#ffba70,#ff9557);border-radius:14px;padding:13px 22px;font-weight:800;box-shadow:0 0 28px #ff965059;color:#20100a!important}.hero{text-align:center;width:min(1120px,100% - 40px);margin:60px auto 40px;padding:50px 0 20px;position:relative}.hero:before{content:"";filter:blur(20px);z-index:-1;background:radial-gradient(circle,#ff984b33,#0000 58%);height:420px;position:absolute;inset:-80px 8% auto}.pill{border:1px solid var(--line);color:#d7c9c0;background:#ffffff0a;border-radius:999px;align-items:center;gap:10px;padding:9px 16px;display:inline-flex}.pill span{background:var(--mint);width:8px;height:8px;box-shadow:0 0 16px var(--mint);border-radius:50%}h1{letter-spacing:-.06em;margin:34px 0 24px;font-family:Georgia,Songti SC,serif;font-size:clamp(52px,8.2vw,106px);line-height:.95}h1 span{background:linear-gradient(90deg,#ffb66b,#ff7a72,#ef6fa9);color:#0000;-webkit-background-clip:text;background-clip:text}.lead{color:#d9cbc2;width:min(760px,100%);margin:0 auto;font-size:20px;line-height:1.9}.actions{flex-wrap:wrap;justify-content:center;gap:16px;margin:36px 0;display:flex}.primary,.secondary{border-radius:16px;padding:17px 28px;font-weight:900}.primary{color:#1c0f09;background:linear-gradient(135deg,#ffbd72,#ff9257);box-shadow:0 18px 60px #ff8c4352}.secondary{border:1px solid var(--line);color:#eee0d6;background:#ffffff09}.heroCard{text-align:left;border:1px solid var(--line);background:linear-gradient(#ffffff14,#ffffff08);border-radius:24px;width:min(660px,100%);margin:34px auto 0;padding:18px;transform:rotate(-1deg);box-shadow:0 30px 100px #00000073}.terminalTop{color:#92827a;align-items:center;gap:8px;margin-bottom:14px;font-size:13px;display:flex}.terminalTop i{background:#ff6f62;border-radius:50%;width:11px;height:11px}.terminalTop i:nth-child(2){background:#ffc36d}.terminalTop i:nth-child(3){background:#74e5c7}.terminalTop span{margin-left:8px}code{color:#ffe5c7;padding:10px 12px;font-family:SF Mono,Menlo,monospace;display:block}.muted{color:#9edccf}.answer{color:#ffbf81}.stats{grid-template-columns:repeat(4,1fr);gap:14px;width:min(1120px,100% - 40px);margin:40px auto 120px;display:grid}.stats div{border:1px solid var(--line);background:#ffffff0b;border-radius:20px;padding:24px}.stats b{color:#ffb26b;font-size:34px;display:block}.stats span{color:#c6b5aa}.split,.install,.faq,.compare{width:min(1120px,100% - 40px);margin:0 auto 120px}.split{grid-template-columns:.82fr 1.18fr;align-items:start;gap:42px;display:grid}.eyebrow{color:var(--orange);letter-spacing:.18em;font-size:13px;font-weight:900}.split h2,.install h2,.faq h2{margin:10px 0 22px;font-family:Georgia,Songti SC,serif;font-size:clamp(36px,5vw,68px);line-height:1.05}.split>div>p:not(.eyebrow){color:#cdbdb3;font-size:18px;line-height:1.9}.skillGrid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.skill{border:1px solid var(--line);background:linear-gradient(145deg,#ffffff14,#ffffff06);border-radius:24px;min-height:190px;padding:24px;position:relative;overflow:hidden}.skill:after{content:"";background:radial-gradient(circle,#ff9a5638,#0000 65%);border-radius:50%;width:130px;height:130px;position:absolute;bottom:-50px;right:-30px}.skill span{font-size:32px}.skill h3{margin:18px 0 10px;font-size:22px}.skill p{color:#bdada4;margin:0;line-height:1.65}.install{text-align:center}.steps{grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px;display:grid}.step{text-align:left;border:1px solid var(--line);background:linear-gradient(#24191a,#130f12);border-radius:28px;padding:30px}.step b{color:#130b08;background:#ffb16b;border-radius:999px;padding:8px 12px;display:inline-block}.step h3{font-size:25px}.step p{color:#c3b3aa;line-height:1.7}.compare{grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;display:grid}.panel{border:1px solid var(--line);background:#ffffff0b;border-radius:30px;min-height:220px;padding:34px}.panel span{color:#a9968a}.panel h3{margin:12px 0;font-size:38px}.panel p{color:#cbbab0;line-height:1.7}.panel.right{background:linear-gradient(135deg,#ffae622e,#ee6fa41f);box-shadow:0 30px 90px #ff78501f}.panel.right a{color:#ffb36b;margin-top:8px;font-weight:900;display:inline-block}.arrow{color:#ffb36b;font-size:36px}.faq details{border:1px solid var(--line);background:#ffffff0a;border-radius:20px;margin:14px 0;padding:22px 24px}.faq summary{cursor:pointer;font-size:20px;font-weight:800}.faq p{color:#c7b7ad;line-height:1.75}footer{border-top:1px solid var(--line);text-align:center;color:#b9aaa0;padding:36px 20px 50px}footer div{color:#fff;font-size:22px;font-weight:900}footer a{color:#ffb36b;font-weight:900}@media (width<=820px){.navLinks a:not(.navCta){display:none}.stats,.split,.steps,.compare,.skillGrid{grid-template-columns:1fr}.arrow{text-align:center;transform:rotate(90deg)}.lead{font-size:17px}.hero{margin-top:30px}h1{font-size:54px}.nav,.split,.install,.faq,.compare,.stats,.hero{width:calc(100% - 28px)}.stats{margin-bottom:80px}.heroCard{transform:none}.panel{min-height:auto}}.directory{border:1px solid var(--line);background:linear-gradient(145deg,#ffffff12,#ffffff06);border-radius:34px;width:min(1120px,100% - 40px);margin:0 auto 120px;padding:34px;box-shadow:0 30px 120px #00000040}.directoryHead{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.directoryHead h2{margin:10px 0 16px;font-family:Georgia,Songti SC,serif;font-size:clamp(34px,4.7vw,62px);line-height:1.05}.directoryHead p:not(.eyebrow){color:#c8b8ae;max-width:680px;font-size:17px;line-height:1.8}.directoryHead>a{color:#1c0f09;background:#ffae62;border-radius:14px;flex:none;margin-top:12px;padding:14px 18px;font-weight:900}.searchMock{border:1px solid var(--line);background:#00000038;border-radius:18px;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin:28px 0 18px;padding:13px 14px;display:grid}.searchMock input{color:#fff;width:100%;font:inherit;background:0 0;border:0;outline:0}.searchMock input::placeholder{color:#95867d}.searchMock a{background:#ffffff1a;border-radius:12px;padding:10px 18px;font-weight:800}.categoryCloud{flex-wrap:wrap;gap:10px;margin:18px 0 28px;display:flex}.categoryCloud a{color:#eaded6;background:#ffffff0b;border:1px solid #ffffff21;border-radius:999px;padding:10px 14px}.categoryCloud b{color:#ffb36b;margin-left:4px}.directoryCards{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}.directoryCard{border:1px solid var(--line);background:linear-gradient(#ffffff12,#00000014);border-radius:22px;min-height:210px;padding:20px;transition:transform .18s,border-color .18s;display:block}.directoryCard:hover{border-color:#ffae6273;transform:translateY(-4px)}.directoryCard div{color:#b9aaa0;justify-content:space-between;gap:12px;font-size:13px;display:flex}.directoryCard div span{color:#ffb36b}.directoryCard em{font-style:normal}.directoryCard h3{margin:20px 0 12px;font-size:22px}.directoryCard p{color:#c2b2a8;margin:0 0 18px;line-height:1.65}.directoryCard strong{color:#ffb36b}@media (width<=820px){.directory{width:calc(100% - 28px);padding:22px}.directoryHead{display:block}.directoryCards{grid-template-columns:1fr}.searchMock{grid-template-columns:auto 1fr}.searchMock a{text-align:center;grid-column:1/-1}.navLinks a[href=\#skills]{display:none}}.appDirectory{margin-top:30px}.tightHead{margin-bottom:8px}.tightHead h2{margin-bottom:10px}.searchDetailLayout{grid-template-columns:minmax(0,1fr) 390px;align-items:start;gap:22px;display:grid}.twoCols{grid-template-columns:repeat(2,minmax(0,1fr))}.skillCardButton{text-align:left;width:100%;color:inherit;font:inherit;cursor:pointer}.skillCardButton.selected{border-color:#ffae62cc;box-shadow:0 0 0 1px #ffae6233,0 24px 70px #ff78501f}.skillDetail{background:linear-gradient(160deg,#ffae621f,#ffffff0b);border:1px solid #ffae6247;border-radius:28px;padding:28px;position:sticky;top:92px;box-shadow:0 30px 100px #00000052}.detailMeta{flex-wrap:wrap;gap:10px;margin-bottom:18px;display:flex}.detailMeta span{border:1px solid var(--line);color:#ffd0a0;background:#00000029;border-radius:999px;padding:7px 11px;font-size:13px}.skillDetail h2{margin:0 0 16px;font-family:Georgia,Songti SC,serif;font-size:34px;line-height:1.12}.skillDetail>p{color:#eadbd1;font-size:16px;line-height:1.85}.detailBlock{border-top:1px solid var(--line);margin-top:18px;padding-top:18px}.detailBlock b{color:#ffbd79;margin-bottom:8px;display:block}.detailBlock p{color:#cdbdb3;margin:0;line-height:1.75}.detailCta{text-align:center;color:#1c0f09;background:linear-gradient(135deg,#ffbd72,#ff9257);border-radius:16px;margin-top:22px;padding:15px 18px;font-weight:900;display:block}.emptyDetail{color:#cdbdb3;line-height:1.8}.slimInstall{margin-bottom:80px}.twoSteps{grid-template-columns:repeat(2,1fr)}.navLinks .navCta{display:none}.compactHero{margin-bottom:20px}.heroSearch{background:#00000040;border:1px solid #ffffff29;border-radius:20px;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;width:min(820px,100%);margin:34px auto 0;padding:14px 15px;display:grid;box-shadow:0 25px 90px #00000040}.heroSearch input{color:#fff;font:inherit;background:0 0;border:0;outline:0;min-width:0}.heroSearch input::placeholder{color:#95867d}.heroSearch button{color:#1c0f09;cursor:pointer;background:#ffae62;border:0;border-radius:14px;padding:13px 22px;font-weight:900}.liveCats button{color:#eaded6;cursor:pointer;background:#ffffff0b;border:1px solid #ffffff21;border-radius:999px;padding:10px 14px}.liveCats button.active{color:#1c0f09;background:#ffae62;border-color:#ffae62}.liveCats button b{margin-left:4px}.resultBar{color:#d8c9bf;justify-content:space-between;align-items:center;gap:16px;margin:16px 0 22px;display:flex}.resultBar button,.pager button{border:1px solid var(--line);color:#f5e9df;cursor:pointer;background:#ffffff0f;border-radius:12px;padding:9px 12px}.pager{flex-wrap:wrap;gap:8px;margin-top:22px;display:flex}.pager button.active{color:#1c0f09;background:#ffae62;border-color:#ffae62}.pager button:disabled{opacity:.4;cursor:not-allowed}.errorBox,.emptyBox{color:#ffd3c8;background:#ff786414;border:1px solid #ff786459;border-radius:16px;margin:16px 0;padding:16px}@media (width<=980px){.searchDetailLayout{grid-template-columns:1fr}.skillDetail{position:static}.twoCols{grid-template-columns:1fr}}@media (width<=820px){.twoSteps{grid-template-columns:1fr}.heroSearch{grid-template-columns:auto 1fr}.heroSearch button{grid-column:1/-1}.navLinks a[href=\#detail]{display:none}}.heroSearch{background:linear-gradient(#ffffff1a,#00000038)!important;border:1px solid #ffae6259!important;box-shadow:0 24px 80px #ff784624,inset 0 1px #ffffff14!important}.heroSearch span{opacity:.9;font-size:20px}.heroSearch button,.resultBar button,.pager button,.liveCats button{appearance:none;font-family:inherit}.heroSearch button{justify-content:center;align-items:center;color:#1b0c06!important;background:linear-gradient(135deg,#ffc078,#ff8c52)!important;border:0!important;display:inline-flex!important;box-shadow:0 12px 34px #ff894847!important}.heroSearch button:hover{filter:brightness(1.04);transform:translateY(-1px)}.liveCats button{align-items:center;gap:4px;color:#f7eadf!important;background:#ffffff13!important;border:1px solid #ffffff29!important;display:inline-flex!important;box-shadow:inset 0 1px #ffffff0f!important}.liveCats button.active,.liveCats button:hover{color:#1c0f09!important;background:linear-gradient(135deg,#ffbd72,#ff9257)!important;border-color:#0000!important}.skillCardButton{appearance:none;background:linear-gradient(#ffffff16,#ffffff07)!important;border:1px solid #ffffff24!important;box-shadow:inset 0 1px #ffffff0e!important}.skillCardButton strong{background:#ffae621f;border-radius:999px;margin-top:6px;padding:8px 12px;display:inline-flex;color:#ffc17d!important}.skillCardButton.selected strong,.skillCardButton:hover strong{background:#ffae62;color:#1b0c06!important}.pager button,.resultBar button{color:#f7eadf!important;background:#ffffff13!important;border:1px solid #ffffff29!important}.pager button.active,.pager button:hover:not(:disabled),.resultBar button:hover{color:#1b0c06!important;background:#ffae62!important;border-color:#ffae62!important}.pill:after{content:"css v3";color:#ffbd79;margin-left:6px;font-weight:800}
