.home{background:var(--surface)}.home__head{padding-block:var(--s-10) var(--s-8);max-width:1000px;margin-inline:auto}.home__kicker{font-size:var(--t-nano-size);letter-spacing:var(--t-nano-caps-ls);color:var(--text-secondary);margin-bottom:var(--s-4)}.home__title{font-size:var(--t-h1-size);line-height:var(--t-h1-lh);letter-spacing:var(--t-h1-caps-ls);margin-bottom:var(--s-6)}.home__lede{max-width:68ch;font-size:var(--t-p-xl-size);line-height:var(--t-p-xl-lh);letter-spacing:var(--t-p-xl-ls);color:var(--text-secondary);margin-bottom:var(--s-5)}.home__hint{max-width:68ch;color:var(--text-secondary);padding:var(--s-4) var(--s-5);border-left:2px solid var(--c-obsidian);background:var(--surface-sunken)}code{font-family:var(--font-mono);font-size:.85em;padding:2px 5px;background:var(--surface-sunken);border:1px solid var(--border-subtle);border-radius:2px}.home__hint code{background:var(--c-white)}.home__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--grid-gutter);padding-block:var(--s-7)}.exp{position:relative;display:block;padding:var(--s-5);border:1px solid var(--border-subtle);border-radius:2px;background:var(--surface);transition:border-color var(--mo-transition-quick),box-shadow var(--mo-transition-base),transform var(--mo-transition-quick)}.exp:hover{border-color:var(--border-strong);box-shadow:0 18px 48px #00000014}.exp__index{position:absolute;top:var(--s-5);right:var(--s-5);font-size:var(--t-nano-size);letter-spacing:var(--t-nano-caps-ls);color:var(--c-dark-stone)}.exp__thumb{display:block;height:132px;border-radius:2px;margin-bottom:var(--s-5);overflow:hidden;position:relative}.exp__thumb--hero{background:linear-gradient(155deg,var(--p-caribbean-blue),var(--c-dark-obsidian))}.exp__thumb--story{background:linear-gradient(90deg,var(--p-royal-blue) 33%,var(--p-mauve) 33% 66%,var(--p-sandstone) 66%)}.exp__thumb--grid{background-color:var(--surface-sunken);background-image:linear-gradient(var(--p-navy) 0 0),linear-gradient(var(--p-burgundy) 0 0),linear-gradient(var(--p-hunter-green) 0 0),linear-gradient(var(--p-graphite) 0 0);background-repeat:no-repeat;background-size:22% 44%;background-position:6% 18%,34% 18%,62% 18%,90% 18%}.exp__thumb--pdp{background:linear-gradient(90deg,var(--p-navy) 0 62%,var(--surface-sunken) 62%)}.exp__body{display:block}.exp__name{display:block;font-size:var(--t-h5-size);line-height:var(--t-h5-lh);letter-spacing:var(--t-h5-caps-ls);font-weight:700;margin-bottom:var(--s-3)}.exp__desc{display:block;color:var(--text-secondary);font-size:var(--t-p-m-size);line-height:var(--t-p-m-lh);margin-bottom:var(--s-4)}.exp__tags{display:flex;flex-wrap:wrap;gap:var(--s-2)}.exp__tags span{font-size:10px;letter-spacing:1px;text-transform:uppercase;font-weight:700;color:var(--text-secondary);padding:var(--s-1) var(--s-3);border:1px solid var(--border-subtle);border-radius:999px}.tokens{padding-block:var(--s-9);border-top:1px solid var(--border-subtle)}.tokens__title{font-size:var(--t-h3-size);line-height:var(--t-h3-lh);letter-spacing:var(--t-h3-caps-ls);margin-bottom:var(--s-4)}.tokens__note{max-width:62ch;color:var(--text-secondary);margin-bottom:var(--s-7)}.tokens__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--s-6)}.tokens__group h3{font-size:var(--t-nano-size);letter-spacing:var(--t-nano-caps-ls);text-transform:uppercase;color:var(--text-secondary);padding-bottom:var(--s-3);border-bottom:1px solid var(--border-subtle);margin-bottom:var(--s-3)}.tokens__row{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);padding-block:var(--s-2);font-size:var(--t-p-s-size)}.tokens__row code{background:none;border:none;padding:0;color:var(--text-primary)}.tokens__row b{font-variant-numeric:tabular-nums;color:var(--text-secondary);font-weight:400}.tokens__demo{position:relative;flex:1;height:2px;background:var(--border-subtle);max-width:88px}.tokens__dot{position:absolute;top:-3px;left:0;width:8px;height:8px;border-radius:50%;background:var(--c-obsidian)}.home__foot{padding-block:var(--s-7) var(--s-10);border-top:1px solid var(--border-subtle);color:var(--text-secondary)}@media(max-width:900px){.home__grid{grid-template-columns:1fr}}
