:root{
  --ink:#17202a;--muted:#667085;--line:#e6e9ef;--paper:#fff;--soft:#f7f8fb;
  --accent:#6557e8;--accent2:#7b6df1;--shadow:0 18px 60px rgba(25,31,50,.10)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper)}
button,input{font:inherit}
button{cursor:pointer}
.topbar{height:72px;display:flex;align-items:center;gap:38px;padding:0 max(24px,calc((100vw - 1180px)/2));border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);z-index:20}
.brand{font-size:25px;font-weight:850;letter-spacing:-1.1px;color:var(--ink);text-decoration:none}
.topbar nav{display:flex;gap:26px;flex:1}
.topbar nav a,.muted-link{color:#4b5565;text-decoration:none;font-weight:650;font-size:14px}
.account-actions{display:flex;gap:9px}
.ghost,.primary{border:0;border-radius:10px;padding:10px 15px;font-weight:750}
.ghost{background:transparent}.primary{background:var(--ink);color:white}.small{padding:9px 14px}
.hero{max-width:940px;margin:0 auto;padding:100px 24px 82px;text-align:center;position:relative}
.eyebrow{font-size:12px;font-weight:850;letter-spacing:.17em;color:var(--accent);margin-bottom:15px}
h1{font-size:clamp(44px,6vw,72px);line-height:.98;letter-spacing:-.055em;margin:0;font-weight:850}
.lead{font-size:19px;color:var(--muted);margin:24px auto 36px;max-width:650px;line-height:1.6}
.search-shell{height:68px;border:1px solid #d8dce5;border-radius:18px;display:flex;align-items:center;background:#fff;box-shadow:var(--shadow);padding:0 18px;position:relative;z-index:5}
.search-shell:focus-within{border-color:#aaa2f7;box-shadow:0 18px 65px rgba(71,59,187,.15),0 0 0 4px rgba(101,87,232,.08)}
.search-icon{font-size:28px;color:#717989;margin-right:10px;transform:rotate(-20deg)}
.search-shell input{border:0;outline:0;flex:1;font-size:17px;color:var(--ink);min-width:0}
.search-shell input::placeholder{color:#969daa}
kbd{border:1px solid #dfe2e8;background:#f7f8fa;border-radius:7px;padding:4px 8px;color:#777f8e;font-size:12px}
.search-results{position:absolute;left:24px;right:24px;top:282px;background:white;border:1px solid var(--line);border-radius:16px;box-shadow:0 25px 70px rgba(20,26,45,.16);z-index:10;text-align:left;overflow:hidden;padding:8px}
.search-results button{display:grid;grid-template-columns:1fr auto;gap:3px 15px;width:100%;border:0;background:white;padding:12px 14px;border-radius:10px;text-align:left}
.search-results button:hover{background:var(--soft)}
.search-results strong{font-size:14px}.search-results span{font-size:12px;color:var(--accent);font-weight:750}.search-results small{grid-column:1/-1;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.no-result{padding:18px;display:flex;flex-direction:column;gap:5px}.no-result span{color:var(--muted);font-size:13px}
.quick-links{display:flex;justify-content:center;gap:8px;align-items:center;flex-wrap:wrap;margin-top:22px;color:#89909d;font-size:13px}
.quick-links button{border:0;background:#f3f2ff;color:#5146c8;padding:7px 10px;border-radius:999px;font-size:12px;font-weight:750}
.browse{background:var(--soft);padding:74px max(24px,calc((100vw - 1180px)/2)) 100px;border-top:1px solid #eff1f4}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:30px}
.section-heading h2{font-size:38px;letter-spacing:-.035em;margin:0}.section-heading p{color:var(--muted);max-width:390px;line-height:1.6;margin:0 0 4px}
.category-tabs{display:flex;gap:8px;overflow:auto;padding-bottom:20px}
.category-tabs button{white-space:nowrap;border:1px solid #dfe3e9;background:white;border-radius:999px;padding:10px 15px;font-weight:700;color:#525b69}
.category-tabs button.active{background:var(--ink);color:white;border-color:var(--ink)}
.creation-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.creation-card{background:white;border:1px solid var(--line);border-radius:16px;padding:20px;display:grid;grid-template-columns:42px 1fr auto;gap:14px;align-items:start;min-height:128px;transition:.18s ease}
.creation-card:hover{transform:translateY(-2px);box-shadow:0 12px 35px rgba(30,38,60,.08);border-color:#d8d3ff}
.creation-card[hidden]{display:none}
.card-icon{width:42px;height:42px;border-radius:12px;background:#f0eeff;color:var(--accent);display:grid;place-items:center;font-size:20px;font-weight:900}
.creation-card h3{font-size:16px;margin:2px 0 7px}.creation-card p{font-size:13px;line-height:1.5;color:var(--muted);margin:0}.arrow{color:#9ca3af;font-size:20px}
.empty-state{text-align:center;padding:50px 20px;color:var(--muted)}.empty-state strong,.empty-state span{display:block}.empty-state strong{color:var(--ink);margin-bottom:6px}
footer{min-height:100px;padding:32px max(24px,calc((100vw - 1180px)/2));display:flex;justify-content:space-between;align-items:center;color:#7c8491;font-size:13px}footer strong{color:var(--ink);font-size:18px}
@media(max-width:850px){.topbar nav{display:none}.creation-grid{grid-template-columns:repeat(2,1fr)}.section-heading{display:block}.section-heading p{margin-top:12px}.hero{padding-top:70px}.search-results{top:252px}}
@media(max-width:560px){.topbar{height:64px}.account-actions .ghost{display:none}.hero{padding:55px 18px 55px}h1{font-size:43px}.lead{font-size:16px;margin:18px auto 27px}.search-shell{height:60px;border-radius:15px}.search-shell input{font-size:15px}.search-results{left:18px;right:18px;top:223px}.browse{padding:55px 18px 70px}.section-heading h2{font-size:30px}.creation-grid{grid-template-columns:1fr}.creation-card{min-height:auto}.quick-links span{width:100%}footer{padding:28px 18px;display:block}footer span{display:block;margin-top:8px}}
