*{margin:0;padding:0;box-sizing:border-box}
:root{--ink:#111;--muted:#727272;--line:#dcdcdc;--soft:#f4f4f4;--purple:#6c5ce7;--green:#0a7a4a}
html,body{width:100%;overflow-x:hidden}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:#f2f2f2;color:var(--ink);min-height:100vh}
a{color:inherit}
.header{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:10px max(12px,calc((100vw - 1400px)/2 + 12px))}
.logo{font-size:1.15rem;font-weight:800;color:#111;text-decoration:none}.logo span{color:var(--purple)}
.header-right{display:flex;align-items:center;gap:10px}.social-row{display:flex;gap:8px}.social-row a{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);background:#fff;color:#333}.social-row a svg{width:16px;height:16px;fill:currentColor}
.burger{width:36px;height:36px;border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer}.burger span{display:block;width:18px;height:2px;background:#222}
.menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:200;opacity:0;pointer-events:none;transition:opacity .2s}.menu-overlay.open{opacity:1;pointer-events:auto}
.menu-panel{position:fixed;top:0;right:0;width:min(300px,85vw);height:100%;background:#fff;border-left:1px solid var(--line);z-index:210;transform:translateX(100%);transition:transform .25s;padding:20px 16px;display:flex;flex-direction:column;gap:8px;overflow-y:auto}.menu-panel.open{transform:translateX(0)}
.menu-close{align-self:flex-end;width:36px;height:36px;border:1px solid var(--line);background:#fff;font-size:1.2rem;cursor:pointer}.menu-panel>a{display:block;width:100%;padding:12px 10px;border:1px solid #eee;color:#222;text-decoration:none;font-weight:600;font-size:.95rem}.menu-social{margin-top:auto;padding-top:16px;border-top:1px solid #eee}.menu-social p{font-size:.75rem;color:#888;margin-bottom:8px}
.main{padding:16px 12px 48px;max-width:1400px;margin:0 auto}.intro{padding:12px 0 18px;text-align:center}.eyebrow{font-size:.68rem;letter-spacing:.14em;font-weight:800;color:var(--purple);margin-bottom:8px}.intro h1{font-size:clamp(1.45rem,3vw,2.2rem);line-height:1.12;margin-bottom:8px}.hero-copy{color:var(--muted);font-size:.9rem;line-height:1.5;max-width:650px;margin:auto}
.hero{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;justify-content:center;margin:0 auto 18px;max-width:650px}.hero-icon-btn{border:none;background:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:7px;text-decoration:none}.hero-icon-box{width:100%;height:76px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:#fff;border:1px solid #333;transition:transform .15s ease,background .15s ease}.hero-icon-box svg{width:26px;height:26px;fill:#111}.hero-icon-box .tag{font-size:.62rem;font-weight:700;letter-spacing:.04em;color:#999;text-transform:uppercase}.hero-icon-btn:hover .hero-icon-box,.hero-icon-btn.active .hero-icon-box{background:#f0efff;border-color:var(--purple)}.hero-icon-btn:active .hero-icon-box{transform:scale(.96)}.hero-icon-btn span.label{font-size:.78rem;font-weight:700;color:#111}
.ad-slot{width:100%;max-width:980px;margin:16px auto;min-height:0}.ad-slot:empty{display:none}.demo-ad{min-height:86px;border:1px dashed #c4c4c4;background:#fff;color:#8a8a8a;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;text-align:center;padding:14px}.demo-ad span{font-size:.6rem;letter-spacing:.12em;font-weight:800;color:#aaa}.demo-ad strong{font-size:.85rem;color:#666}.demo-ad small{font-size:.7rem;color:#999}.demo-ad-compact{min-height:64px}
.toolbar{background:#fff;border:1px solid var(--line);padding:10px;margin:14px 0 16px}.category-row{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding-bottom:10px}.category-row::-webkit-scrollbar{display:none}.category{flex:0 0 auto;border:1px solid var(--line);background:#fff;color:#222;padding:8px 12px;font:600 .78rem inherit;cursor:pointer;text-decoration:none}.category span{font-size:.68rem;color:#999;margin-left:3px}.category.active,.category:hover{background:#111;border-color:#111;color:#fff}.category.active span,.category:hover span{color:#ddd}.search-wrap{display:block}.search-wrap input{width:100%;padding:11px 12px;border:1px solid #c9c9c9;background:#fafafa;font-size:.9rem;outline:none}.search-wrap input:focus{border-color:var(--purple);background:#fff}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}.section-head h2{font-size:1rem}.count{font-size:.76rem;color:#888}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.card{background:#fff;border:1px solid #ccc;overflow:hidden;display:flex;flex-direction:column;position:relative;min-width:0;transition:transform .15s,box-shadow .15s}.card:hover{transform:translateY(-2px);box-shadow:0 7px 18px rgba(0,0,0,.08)}.badge{position:absolute;top:6px;left:6px;z-index:2;background:rgba(0,0,0,.76);color:#fff;font-size:.62rem;font-weight:700;padding:3px 6px;line-height:1.2}.card-img{width:100%;aspect-ratio:9/12;background:#e8e8e8;overflow:hidden;border-bottom:1px solid #ddd}.card-img img{width:100%;height:100%;object-fit:cover;display:block}.card-body{padding:9px;display:flex;flex-direction:column;gap:8px;flex:1}.card-title{font-size:.77rem;font-weight:650;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2em;text-decoration:none}.card-type{font-size:.63rem;color:var(--purple);text-transform:uppercase;letter-spacing:.08em;font-weight:800}.copy-btn{width:100%;padding:9px 6px;border:1px solid #333;background:#222;color:#fff;font-size:.75rem;font-weight:600;cursor:pointer}.copy-btn:hover{background:#444}.copy-btn.copied{background:var(--green);border-color:var(--green)}.more-wrap{margin-top:16px;text-align:center}.more-btn{width:100%;max-width:320px;padding:12px;border:1px solid #333;background:#fff;font-weight:700;font-size:.9rem;cursor:pointer}.err{padding:12px;border:1px solid #e74c3c;background:#fff5f5;color:#c0392b;font-size:.85rem;margin-bottom:12px;display:none}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(60px);background:var(--green);color:#fff;padding:10px 18px;font-size:.85rem;font-weight:600;opacity:0;transition:.25s;z-index:9999;pointer-events:none}.toast.show{transform:translateX(-50%) translateY(0);opacity:1}.footer{text-align:center;padding:20px 12px;font-size:.75rem;color:#999;border-top:1px solid var(--line);background:#fff;margin-top:20px}.footer a{color:#666}.footer span{margin:0 5px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:600px){.main{padding-left:20px;padding-right:20px}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.card-title{font-size:.82rem}}
@media(min-width:900px){.main{padding-top:24px}.grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.toolbar{display:flex;align-items:center;gap:16px}.category-row{padding:0;flex:1}.search-wrap{width:300px;flex:0 0 300px}.card-title{font-size:.84rem}}
@media(min-width:1280px){.grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}.header{padding-left:max(18px,calc((100vw - 1400px)/2 + 18px));padding-right:max(18px,calc((100vw - 1400px)/2 + 18px))}.card-body{padding:10px}}
.grid .ad-slot{grid-column:1/-1;max-width:none;margin:12px 0}
.developer-credit{display:block;margin-top:8px;color:#888}.developer-credit a{font-weight:700;color:#6c5ce7;text-decoration:none}