:root{--sc-bg:#090b10;--sc-panel:#11151d;--sc-panel-2:#171d28;--sc-text:#f5f7fb;--sc-muted:#a8b0bf;--sc-border:rgba(255,255,255,.12);--sc-accent:#83d4ff;--sc-accent-2:#b6ffcf;--sc-danger:#ff9f9f;--sc-radius:1.15rem;--sc-shadow:0 22px 60px rgba(0,0,0,.24)}
.showcase-shell{width:min(1180px,calc(100% - 2rem));margin:0 auto;padding:clamp(2rem,5vw,5rem) 0 6rem;color:var(--sc-text)}
.showcase-shell *{box-sizing:border-box}.showcase-shell a{color:inherit}.showcase-preview-banner{padding:.75rem 1rem;margin-bottom:1.5rem;border:1px solid rgba(255,205,105,.5);border-radius:.75rem;background:rgba(255,205,105,.12);color:#ffe2a2}
.showcase-hero{padding:clamp(1.5rem,4vw,3.5rem);border:1px solid var(--sc-border);border-radius:calc(var(--sc-radius) * 1.3);background:radial-gradient(circle at 85% 10%,rgba(131,212,255,.14),transparent 32%),linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.012));box-shadow:var(--sc-shadow)}
.showcase-hero h1,.showcase-detail__hero h1{max-width:18ch;margin:.2rem 0 1rem;font-size:clamp(2.4rem,7vw,5.6rem);line-height:.96;letter-spacing:-.055em}.showcase-hero>p:not(.showcase-kicker){max-width:70ch;color:var(--sc-muted);font-size:clamp(1rem,2vw,1.22rem);line-height:1.7}.showcase-kicker{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:800;color:var(--sc-accent)}
.showcase-view-nav{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.5rem}.showcase-view-nav a{padding:.65rem .9rem;border:1px solid var(--sc-border);border-radius:999px;text-decoration:none;color:var(--sc-muted)}.showcase-view-nav a:hover,.showcase-view-nav a:focus-visible,.showcase-view-nav a[aria-current=page]{color:var(--sc-text);border-color:rgba(131,212,255,.65);background:rgba(131,212,255,.1)}
.showcase-featured,.showcase-catalog{margin-top:clamp(2rem,5vw,4rem)}.showcase-section-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1rem}.showcase-section-heading h2{margin:.1rem 0;font-size:clamp(1.55rem,3vw,2.3rem)}.showcase-section-heading>p{color:var(--sc-muted)}
.showcase-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,285px),1fr));gap:1rem}.showcase-grid--featured{grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr))}.showcase-card{display:flex;min-width:0;flex-direction:column;overflow:hidden;border:1px solid var(--sc-border);border-radius:var(--sc-radius);background:var(--sc-panel);box-shadow:0 10px 35px rgba(0,0,0,.16);transition:transform .18s ease,border-color .18s ease}.showcase-card:hover{transform:translateY(-3px);border-color:rgba(131,212,255,.42)}.showcase-card__media{position:relative;display:grid;min-height:190px;place-items:center;overflow:hidden;background:linear-gradient(135deg,#172236,#0d111a);text-decoration:none}.showcase-card__media img{width:100%;height:100%;min-height:190px;max-height:260px;object-fit:cover}.showcase-card__placeholder{font-size:4rem;font-weight:900;color:rgba(255,255,255,.22)}.showcase-card__featured-label{position:absolute;top:.7rem;right:.7rem;padding:.35rem .55rem;border-radius:999px;background:rgba(9,11,16,.86);font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.showcase-card__body{display:flex;flex:1;flex-direction:column;padding:1.1rem}.showcase-card__eyebrow,.showcase-card__meta{display:flex;flex-wrap:wrap;gap:.5rem;color:var(--sc-muted);font-size:.78rem}.showcase-card__eyebrow span+span:before,.showcase-card__meta span+span:before{content:"·";margin-right:.5rem}.showcase-card__title{margin:.55rem 0 .5rem;font-size:1.35rem}.showcase-card__title a{text-decoration:none}.showcase-card__summary{margin:0 0 1rem;color:var(--sc-muted);line-height:1.58}.showcase-card__actions{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:auto;padding-top:1rem}
.showcase-chip-list{display:flex;flex-wrap:wrap;gap:.4rem;margin:.8rem 0 0;padding:0;list-style:none}.showcase-chip-list li{padding:.3rem .55rem;border:1px solid var(--sc-border);border-radius:999px;color:var(--sc-muted);font-size:.72rem}.showcase-status{font-weight:750}.showcase-status--healthy,.showcase-status--available{color:var(--sc-accent-2)}.showcase-status--degraded,.showcase-status--paused,.showcase-status--deploying{color:#ffd57a}.showcase-status--unavailable{color:var(--sc-danger)}
.showcase-button{display:inline-flex;align-items:center;justify-content:center;min-height:2.55rem;padding:.62rem .9rem;border:1px solid var(--sc-border);border-radius:.7rem;background:transparent;color:var(--sc-text);font:inherit;font-weight:750;text-decoration:none;cursor:pointer}.showcase-button:hover,.showcase-button:focus-visible{border-color:var(--sc-accent);outline:none}.showcase-button--primary{border-color:rgba(131,212,255,.55);background:var(--sc-accent);color:#071017}.showcase-button--quiet{color:var(--sc-muted)}
.showcase-filters{display:grid;grid-template-columns:minmax(220px,2fr) repeat(5,minmax(130px,1fr));gap:.7rem;padding:1rem;margin-bottom:1rem;border:1px solid var(--sc-border);border-radius:var(--sc-radius);background:var(--sc-panel)}.showcase-filters label{display:flex;min-width:0;flex-direction:column;gap:.35rem;color:var(--sc-muted);font-size:.75rem;font-weight:700}.showcase-filters input,.showcase-filters select{width:100%;min-height:2.6rem;padding:.55rem .65rem;border:1px solid var(--sc-border);border-radius:.65rem;background:var(--sc-bg);color:var(--sc-text);font:inherit}.showcase-filters input:focus,.showcase-filters select:focus{border-color:var(--sc-accent);outline:2px solid rgba(131,212,255,.14)}.showcase-filter-actions{display:flex;align-items:end;gap:.5rem}.showcase-collections{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1rem}.showcase-collections a{padding:.48rem .7rem;border:1px solid var(--sc-border);border-radius:999px;text-decoration:none;color:var(--sc-muted)}.showcase-collections span{color:var(--sc-accent)}
.showcase-pagination{display:flex;justify-content:center;gap:.4rem;margin-top:2rem}.showcase-pagination a,.showcase-pagination span{display:grid;min-width:2.5rem;height:2.5rem;place-items:center;border:1px solid var(--sc-border);border-radius:.6rem;text-decoration:none}.showcase-pagination span[aria-current=page]{border-color:var(--sc-accent);background:rgba(131,212,255,.12)}.showcase-empty{padding:3rem;border:1px dashed var(--sc-border);border-radius:var(--sc-radius);text-align:center;color:var(--sc-muted)}
.showcase-breadcrumb{display:flex;gap:.55rem;margin-bottom:1rem;color:var(--sc-muted)}.showcase-detail__hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);gap:2rem;align-items:center;padding:clamp(1.4rem,4vw,3rem);border:1px solid var(--sc-border);border-radius:calc(var(--sc-radius)*1.2);background:var(--sc-panel)}.showcase-detail__summary{max-width:68ch;color:var(--sc-muted);font-size:1.15rem;line-height:1.7}.showcase-detail__actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.3rem}.showcase-detail__cover{margin:0;overflow:hidden;border-radius:var(--sc-radius);background:var(--sc-bg)}.showcase-detail__cover img{display:block;width:100%;max-height:420px;object-fit:cover}.showcase-detail__cover figcaption,.showcase-media-grid figcaption{padding:.55rem;color:var(--sc-muted);font-size:.75rem}.showcase-detail__layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(250px,.78fr);gap:2rem;margin-top:2rem}.showcase-detail__main section,.showcase-detail__aside section{margin-bottom:1rem;padding:1.3rem;border:1px solid var(--sc-border);border-radius:var(--sc-radius);background:var(--sc-panel)}.showcase-detail__main h2,.showcase-detail__aside h2{margin-top:0}.showcase-prose{color:var(--sc-muted);line-height:1.75}.showcase-prose p:last-child{margin-bottom:0}.showcase-aside-row+.showcase-aside-row{padding-top:.85rem;margin-top:.85rem;border-top:1px solid var(--sc-border)}.showcase-aside-row p,.showcase-aside-row small{display:block;margin:.25rem 0;color:var(--sc-muted)}.showcase-media-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.7rem}.showcase-media-grid figure{margin:0;overflow:hidden;border-radius:.8rem;background:var(--sc-bg)}.showcase-media-grid img{width:100%;height:180px;object-fit:cover}.showcase-related{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:.65rem}.showcase-related a{display:flex;flex-direction:column;gap:.25rem;padding:1rem;border:1px solid var(--sc-border);border-radius:.8rem;text-decoration:none}.showcase-related span,.showcase-related small{color:var(--sc-muted)}
.showcase-timeline{position:relative;margin-top:2rem}.showcase-timeline:before{content:"";position:absolute;top:0;bottom:0;left:5.3rem;width:1px;background:var(--sc-border)}.showcase-timeline__group{display:grid;grid-template-columns:4.4rem minmax(0,1fr);gap:1.8rem;margin-bottom:2rem}.showcase-timeline__group>h2{position:relative;margin:0;text-align:right;font-size:1rem;color:var(--sc-accent)}.showcase-timeline__group>h2:after{content:"";position:absolute;top:.35rem;right:-2.25rem;width:.75rem;height:.75rem;border:2px solid var(--sc-bg);border-radius:50%;background:var(--sc-accent)}.showcase-timeline__group>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.7rem}.showcase-timeline article{padding:1rem;border:1px solid var(--sc-border);border-radius:var(--sc-radius);background:var(--sc-panel)}.showcase-timeline article>p:first-child{color:var(--sc-muted);font-size:.75rem}.showcase-timeline h3{margin:.25rem 0}.showcase-timeline h3 a{text-decoration:none}
.showcase-helix{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,.75fr);gap:1rem;margin-top:2rem}.showcase-helix__stage,.showcase-helix__panel{border:1px solid var(--sc-border);border-radius:var(--sc-radius);background:var(--sc-panel)}.showcase-helix__stage{position:relative;min-height:620px;overflow:hidden}.showcase-helix canvas{display:block;width:100%;height:620px;outline:none;touch-action:none}.showcase-helix canvas:focus-visible{box-shadow:inset 0 0 0 3px var(--sc-accent)}.showcase-helix__controls{position:absolute;left:1rem;bottom:1rem;display:flex;gap:.35rem}.showcase-helix__controls button{min-width:2.6rem;min-height:2.6rem;border:1px solid var(--sc-border);border-radius:.65rem;background:rgba(9,11,16,.88);color:var(--sc-text);cursor:pointer}.showcase-helix__panel{padding:1.2rem}.showcase-helix__panel h2{font-size:1.7rem}.showcase-helix__panel>p{color:var(--sc-muted);line-height:1.6}.showcase-helix__panel dl div{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-top:1px solid var(--sc-border)}.showcase-helix__panel dt{color:var(--sc-muted)}.showcase-helix-fallback{margin-top:1rem;padding:1.2rem;border:1px solid var(--sc-border);border-radius:var(--sc-radius);background:var(--sc-panel)}.showcase-helix-fallback>p{color:var(--sc-muted)}.showcase-helix-fallback ol{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.5rem;padding:0;list-style:none}.showcase-helix-fallback a{display:flex;flex-direction:column;gap:.25rem;padding:.8rem;border:1px solid var(--sc-border);border-radius:.7rem;text-decoration:none}.showcase-helix-fallback span{color:var(--sc-muted);font-size:.76rem}
@media(max-width:1050px){.showcase-filters{grid-template-columns:repeat(3,minmax(0,1fr))}.showcase-search{grid-column:span 2}.showcase-filter-actions{align-items:center}.showcase-detail__layout,.showcase-helix{grid-template-columns:1fr}.showcase-helix__stage{min-height:520px}.showcase-helix canvas{height:520px}}
@media(max-width:720px){.showcase-shell{width:min(100% - 1rem,1180px)}.showcase-hero,.showcase-detail__hero{padding:1.2rem}.showcase-detail__hero{grid-template-columns:1fr}.showcase-filters{grid-template-columns:1fr 1fr}.showcase-search{grid-column:1/-1}.showcase-filter-actions{grid-column:1/-1}.showcase-timeline:before{left:.4rem}.showcase-timeline__group{grid-template-columns:1fr;padding-left:1.6rem}.showcase-timeline__group>h2{text-align:left}.showcase-timeline__group>h2:after{left:-1.55rem;right:auto}.showcase-helix__stage{min-height:430px}.showcase-helix canvas{height:430px}}
@media(prefers-reduced-motion:reduce){.showcase-card{transition:none}.showcase-card:hover{transform:none}}

/* Phase 7 integrated workspace and Three.js helix */
.showcase-shell--integrated{max-width:1480px}
.showcase-hero--integrated{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:end}
.showcase-workspace-status{display:flex;min-width:8rem;flex-direction:column;align-items:flex-end;padding:1rem 1.15rem;border:1px solid var(--sc-border);border-radius:var(--sc-radius);background:rgba(14,20,30,.72)}
.showcase-workspace-status strong{font-size:2rem;line-height:1;color:var(--sc-accent)}
.showcase-workspace-status span{margin-top:.3rem;color:var(--sc-muted);font-size:.76rem}
.showcase-view-nav--switcher{position:sticky;top:.65rem;z-index:20;display:inline-flex;padding:.35rem;border:1px solid var(--sc-border);border-radius:999px;background:rgba(8,12,18,.88);box-shadow:0 15px 40px rgba(0,0,0,.24);backdrop-filter:blur(18px)}
.showcase-view-nav--switcher a{padding:.68rem 1rem;border-radius:999px}
.showcase-view-nav--switcher a[aria-selected=true]{background:var(--sc-accent);color:#071017}
.showcase-view-panel{margin-top:1.25rem;animation:showcase-panel-in .22s ease}
.showcase-view-panel[hidden]{display:none!important}
@keyframes showcase-panel-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.showcase-filter-drawer{margin:1rem 0;border:1px solid var(--sc-border);border-radius:var(--sc-radius);background:var(--sc-panel)}
.showcase-filter-drawer>summary{display:flex;justify-content:space-between;gap:1rem;padding:.9rem 1rem;color:var(--sc-text);font-weight:800;cursor:pointer}
.showcase-filter-drawer>summary span{color:var(--sc-muted);font-size:.78rem;font-weight:600}
.showcase-filter-drawer .showcase-filters{margin:0;border-width:1px 0 0;border-radius:0;background:transparent}
.showcase-filter-drawer .showcase-collections{padding:0 1rem 1rem;margin:0}
.showcase-helix--integrated{grid-template-columns:minmax(0,2.4fr) minmax(290px,.72fr);margin-top:0}
.showcase-helix--integrated .showcase-helix__stage{min-height:min(74vh,850px);background:radial-gradient(circle at 52% 48%,rgba(41,94,128,.25),rgba(7,12,19,.92) 48%,rgba(4,7,12,.98));box-shadow:inset 0 0 80px rgba(0,0,0,.42),0 20px 60px rgba(0,0,0,.2)}
.showcase-helix--integrated canvas{height:min(74vh,850px);min-height:600px}
.showcase-helix__loading{position:absolute;inset:0;display:grid;place-items:center;color:var(--sc-muted);pointer-events:none}
.showcase-helix__loading[hidden]{display:none}
.showcase-helix__legend{position:absolute;top:1rem;left:1rem;display:flex;align-items:center;gap:.55rem;padding:.45rem .65rem;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(6,10,16,.7);color:var(--sc-muted);font-size:.69rem;letter-spacing:.04em;text-transform:uppercase;pointer-events:none}
.showcase-helix__legend i{display:block;width:2.2rem;height:1px;background:linear-gradient(90deg,var(--sc-accent),var(--sc-accent-2))}
.showcase-helix__controls{flex-wrap:wrap;max-width:calc(100% - 2rem)}
.showcase-helix__controls button{padding:0 .75rem;backdrop-filter:blur(12px)}
.showcase-helix__panel{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(21,31,45,.98),rgba(10,15,23,.98))}
.showcase-helix__cover{margin:-1.2rem -1.2rem 1rem;aspect-ratio:16/9;overflow:hidden;background:var(--sc-bg)}
.showcase-helix__cover img{width:100%;height:100%;object-fit:cover}
.showcase-helix__panel-actions{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1rem}
.showcase-helix-fallback{margin-top:.8rem}
.showcase-helix-fallback>summary{font-weight:800;cursor:pointer}
.showcase-timeline__cover{display:block;margin:-1rem -1rem .85rem;overflow:hidden;border-radius:var(--sc-radius) var(--sc-radius) 0 0;background:var(--sc-bg)}
.showcase-timeline__cover img{display:block;width:100%;height:145px;object-fit:cover}
.showcase-card__placeholder{display:grid;position:absolute;inset:0;place-items:center;background:radial-gradient(circle at 30% 20%,rgba(131,212,255,.24),transparent 38%),linear-gradient(145deg,#17263a,#0b111b);font-size:4rem}
.showcase-card__placeholder:after{content:"";position:absolute;inset:14%;border:1px solid rgba(255,255,255,.08);border-radius:50%;box-shadow:0 0 0 2rem rgba(255,255,255,.018),0 0 0 4rem rgba(255,255,255,.012)}
@media(max-width:1050px){.showcase-hero--integrated{grid-template-columns:1fr}.showcase-workspace-status{align-items:flex-start}.showcase-helix--integrated{grid-template-columns:1fr}.showcase-helix--integrated .showcase-helix__stage{min-height:600px}.showcase-helix--integrated canvas{height:600px;min-height:600px}.showcase-view-nav--switcher{position:relative;top:auto}}
@media(max-width:720px){.showcase-view-nav--switcher{display:grid;grid-template-columns:1fr;width:100%;border-radius:var(--sc-radius)}.showcase-view-nav--switcher a{text-align:center}.showcase-helix--integrated .showcase-helix__stage{min-height:480px}.showcase-helix--integrated canvas{height:480px;min-height:480px}.showcase-helix__legend{display:none}}
@media(prefers-reduced-motion:reduce){.showcase-view-panel{animation:none}}