:root{--bg:#070809;--panel:#0b0d0f;--ink:#ece8df;--muted:#ece8df8f;--faint:#ece8df6b;--line:#ece8df24;--line-soft:#ece8df14;--orange:#ff7a1a;--orange-soft:#ff7a1a24;--mono:"Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--pad:clamp(18px, 4.5vw, 64px);--showcase-header-height:44px}*{box-sizing:border-box}html{background:var(--bg);min-height:100%}body{background:radial-gradient(circle at 82% -8%, #ff7a1a1a, transparent 34rem), var(--bg);min-height:100%;color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;font-size:13px;overflow-x:hidden}::selection{background:var(--orange);color:#08090a}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}:focus-visible{outline:1px solid var(--orange);outline-offset:4px}.showcase-header{z-index:20;height:var(--showcase-header-height);padding:0 var(--pad);border-bottom:1px solid var(--line);backdrop-filter:blur(14px);background:#070809db;justify-content:space-between;align-items:center;gap:24px;display:flex;position:sticky;top:0}.showcase-brand{letter-spacing:-.02em;align-items:center;gap:.55rem;font-size:11px;display:inline-flex}.showcase-brand span{color:var(--faint);letter-spacing:.12em;text-transform:uppercase;font-size:9px}.showcase-nav{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;align-items:center;gap:clamp(14px,2.5vw,28px);font-size:9px;display:flex}.showcase-nav a{transition:color .16s}.showcase-nav a:hover{color:var(--orange)}.showcase-main{width:min(100%,1680px);padding:0 var(--pad);margin:0 auto}.showcase-compositions{margin-bottom:clamp(30px,5vw,68px)}.showcase-main .cmp-section{width:100%;max-width:none}.showcase-main .cmp-section--compact .cmp-head{margin-bottom:18px}.showcase-hero{padding:clamp(58px,9vw,112px) 0 clamp(28px,4vw,46px)}.showcase-eyebrow{color:var(--orange);letter-spacing:.18em;text-transform:uppercase;align-items:center;gap:12px;margin:0 0 22px;font-size:9px;display:flex}.showcase-eyebrow:before{background:var(--orange);content:"";width:22px;height:1px}.showcase-hero h1{letter-spacing:-.07em;max-width:12ch;margin:0;font-size:clamp(2.8rem,6.8vw,6.2rem);font-weight:500;line-height:.88}.showcase-hero h1 em{color:var(--orange);font-style:normal}.showcase-lede{max-width:46ch;color:var(--muted);margin:24px 0 0;font-size:11px;line-height:1.8}.showcase-hero__stage{border:1px solid var(--line);background:#070809;margin-top:34px;position:relative;overflow:hidden}.showcase-hero__frame{aspect-ratio:16/9;background:#070809;width:100%;position:relative}.showcase-hero__frame>*{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.showcase-hero__caption{z-index:2;backdrop-filter:blur(10px);pointer-events:none;background:#070809b8;border:1px solid #ece8df2e;gap:4px;padding:9px 11px;display:grid;position:absolute;bottom:clamp(14px,3vw,26px);right:clamp(14px,3vw,26px)}.showcase-hero__caption span{color:var(--faint);letter-spacing:.16em;text-transform:uppercase;font-size:7px}.showcase-hero__caption strong{color:var(--ink);letter-spacing:-.01em;font-size:11px;font-weight:500}.showcase-toolbar{top:var(--showcase-header-height);z-index:12;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg);justify-content:space-between;align-items:center;gap:20px;padding:15px 0;display:flex;position:sticky}.showcase-filters{flex-wrap:wrap;gap:5px;display:flex}.showcase-filter{border:1px solid var(--line);color:var(--muted);letter-spacing:.14em;text-transform:uppercase;background:0 0;align-items:center;gap:7px;padding:7px 9px;font-size:8px;transition:border-color .14s,color .14s,background-color .14s;display:inline-flex}.showcase-filter span{color:var(--faint);font-variant-numeric:tabular-nums}.showcase-filter:hover{border-color:var(--orange);color:var(--ink)}.showcase-filter.is-active{border-color:var(--orange);background:var(--orange-soft);color:var(--orange)}.showcase-filter.is-active span{color:var(--orange)}.showcase-count{color:var(--faint);letter-spacing:.14em;text-transform:uppercase;flex:none;margin:0;font-size:8px}.showcase-grid{columns:4 280px;column-gap:14px;padding:24px 0}.showcase-card{break-inside:avoid;border:1px solid var(--line-soft);background:var(--panel);margin:0 0 14px;transition:border-color .16s;display:block}.showcase-card:hover{border-color:#ff7a1a8c}.showcase-card__media{display:block}.showcase-card figure{margin:0}.showcase-card picture{display:block}.showcase-card__frame{aspect-ratio:4/3;background:#0b0d0f;display:block;position:relative;overflow:hidden}.showcase-card__preview{display:block;position:absolute;inset:0;overflow:hidden}.showcase-card__preview>*{width:100%;height:100%;display:block}.showcase-card__live{z-index:2;opacity:1;pointer-events:none;background:#070809;position:absolute;inset:0;overflow:hidden}.showcase-card__live>*{width:100%;height:100%;display:block}.showcase-card img{background:#0b0d0f;width:100%;height:auto;display:block}.showcase-card figcaption{border-top:1px solid var(--line-soft);gap:3px;padding:10px 11px 11px;display:grid}.showcase-card figcaption span{color:var(--faint);letter-spacing:.16em;text-transform:uppercase;font-size:8px}.showcase-card figcaption strong{letter-spacing:-.01em;font-size:11px;font-weight:500}.showcase-card:hover figcaption strong{color:var(--orange)}.showcase-card__actions{border-top:1px solid var(--line-soft);color:var(--faint);letter-spacing:.12em;text-transform:uppercase;justify-content:space-between;align-items:center;gap:10px;padding:7px 10px 8px;font-size:7px;display:flex}.showcase-card__actions a{color:var(--muted);transition:color .14s}.showcase-card__actions a:hover{color:var(--orange)}.showcase-card__actions button{color:var(--faint);font:inherit;letter-spacing:.12em;text-transform:uppercase;background:0 0;border:0;padding:0;font-size:7px;transition:color .14s}.showcase-card__actions button:hover{color:var(--orange)}.showcase-card[data-category=scene] figcaption span{color:#7fbcff}.showcase-card[data-category=webgl] figcaption span{color:#7ee787}.showcase-card[data-category=kanji] figcaption span{color:var(--orange)}.showcase-card[data-category=component] figcaption span{color:#e8d5a8}.showcase-card[hidden]{display:none}.showcase-empty{color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin:0 0 70px;font-size:10px}.showcase-more{justify-content:center;padding:22px 0 70px;display:flex}.showcase-more button{border:1px solid var(--orange);color:var(--orange);font:inherit;letter-spacing:.14em;text-transform:uppercase;background:0 0;padding:9px 13px;font-size:8px;transition:background-color .14s,color .14s}.showcase-more button:hover{background:var(--orange);color:var(--bg)}.showcase-more button[hidden]{display:none}.showcase-footer{padding:22px var(--pad) 40px;border-top:1px solid var(--line);color:var(--faint);letter-spacing:.14em;text-transform:uppercase;justify-content:space-between;align-items:center;gap:20px;font-size:8px;display:flex}.showcase-footer a{color:var(--muted)}.showcase-footer a:hover{color:var(--orange)}@media (width<=1200px){.showcase-grid{columns:3 260px}}@media (width<=900px){.showcase-grid{columns:2 240px}}@media (width<=620px){:root{--showcase-header-height:42px}.showcase-header{padding:0 var(--pad)}.showcase-nav{gap:12px;font-size:8px}.showcase-nav a:first-child{display:none}.showcase-hero{padding-top:48px}.showcase-hero h1{font-size:clamp(2.5rem,13vw,4rem)}.showcase-toolbar{flex-direction:column;align-items:flex-start;gap:10px}.showcase-grid{columns:1;padding-top:16px}.showcase-more{padding-bottom:44px}.showcase-footer{flex-direction:column;align-items:flex-start;gap:8px}}@media (prefers-reduced-motion:reduce){.showcase-nav a,.showcase-filter,.showcase-card,.showcase-card__live{transition:none}}
