.hubble-case{--kamen-green:#c6b5ff;--kamen-panel:#24202f}.award-line{display:flex;align-items:center;gap:16px;margin-top:38px;padding-top:24px;border-top:1px solid var(--line);font:12px/1.8 monospace;color:var(--kamen-green)}.award-line>span{font-size:30px}.research-artifact{margin-block:36px}.research-artifact a{background:#f5f4f0;border-radius:8px}.research-artifact img{height:480px;object-fit:contain}.archive-grid .research-artifact{margin:0}.archive-grid .research-artifact img{height:220px;object-fit:contain}.full-archive{max-width:none;margin-block:80px}.kano-chart{margin-block:48px;padding:32px;background:#222027;border-radius:12px}.kano-legend{display:flex;flex-wrap:wrap;gap:14px 24px;font:11px monospace;margin-bottom:32px}.kano-legend span{display:flex;align-items:center;gap:8px}.kano-legend i{width:12px;height:12px}.cat-A{background:#bba3fc}.cat-O{background:#83b9dc}.cat-M{background:#e7c77b}.cat-I{background:#a4a29d}.cat-R{background:#eea28f}.cat-Q{background:#fff}.kano-row{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;padding:18px 0;border-top:1px solid #48414f}.kano-row h3{font:16px/1.5 Arial,sans-serif;margin:4px 0}.kano-row small,.kano-row>div>span{font:11px/1.5 monospace;color:var(--muted)}.kano-bar{display:flex;height:30px;gap:2px}.kano-bar span{display:grid;place-items:center;color:#19171d;font:12px monospace}.resource-links{display:flex;flex-wrap:wrap;gap:20px 40px;margin:36px 0}.prototype-frame{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#222; margin-top:36px}.prototype-frame iframe{display:block;width:100%;height:750px;max-height:85dvh;border:0}.hubble-screens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:40px;background:#26222f;border-radius:12px;margin:48px 0}.hubble-screens .screen a{border-radius:8px}.hubble-case .evidence-table th{width:auto}.hubble-case .image-dialog[data-wide] .dialog-image{overflow:auto}.hubble-case .image-dialog[data-wide] .dialog-image img{max-width:none;width:1600px}.hubble-case .image-dialog:not([data-wide]) .dialog-image img{max-width:100%;width:auto}.hubble-case .image-dialog{width:1200px}
@media(max-width:700px){.kano-chart{padding:20px 16px;margin-inline:-8px}.kano-row{grid-template-columns:1fr;gap:12px}.kano-row h3{font-size:16px}.research-artifact img{height:280px}.archive-grid .research-artifact img{height:170px}.hubble-screens{display:flex;overflow-x:auto;scroll-snap-type:x proximity;padding:24px 20px;gap:22px}.hubble-screens .screen{flex:0 0 85%;flex-basis:85%;flex-shrink:0;scroll-snap-align:start}.prototype-frame iframe{height:650px}.award-line{font-size:11px}.resource-links{display:grid}.hubble-case .image-dialog:not([data-wide]) .dialog-image{overflow:auto}.hubble-case .image-dialog:not([data-wide]) .dialog-image img{max-width:none;width:800px}}

.miro-overview{display:flex;align-items:center;gap:28px;padding:28px 0;margin:0 0 44px;border-block:1px solid var(--line)}.miro-brand{display:flex;align-items:center;gap:12px;flex:none;background:#ffd02f;color:#050038;border-radius:8px;padding:16px 20px}.miro-brand img{width:34px;height:34px}.miro-brand>span{font:700 32px/1 Arial,sans-serif;letter-spacing:-2px}.miro-context{display:grid;gap:10px;max-width:670px}.miro-context strong{font-size:20px;font-weight:400}.miro-context>span{font-size:16px;line-height:1.6;color:var(--muted)}.miro-overview>svg{width:24px;height:24px;margin-left:auto}.miro-overview:hover .miro-context strong{text-decoration:underline;text-underline-offset:5px}@media(max-width:700px){.miro-overview{flex-wrap:wrap;gap:20px;padding-block:24px}.miro-brand{padding:12px 16px}.miro-context{order:3;width:100%}.miro-context strong{font-size:19px}}
/* Keep the overview resource on the same editorial grid as its heading. */
.miro-overview{display:grid;grid-template-columns:1fr 2fr;gap:60px;position:relative}.miro-brand{justify-self:start}.miro-context{padding-right:48px;max-width:none;min-width:0}.miro-overview>svg{position:absolute;right:0;top:50%;transform:translateY(-50%)}#overview>.editorial{margin-left:calc((100% + 120px)/3)}
@media(max-width:1000px){.miro-overview{grid-template-columns:1fr 2.5fr;gap:32px}#overview>.editorial{margin-left:calc((100% + 80px)/3.5)}}
@media(max-width:700px){.miro-overview{grid-template-columns:1fr;gap:20px}.miro-context{order:initial;padding-right:0}.miro-overview>svg{top:44px;transform:none}#overview>.editorial{margin-left:0}}
.prototype-shell{width:min(100%,480px);margin:36px auto}.prototype-controls{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:58px;font:11px/1.5 monospace;color:var(--muted)}.prototype-stop{flex:none;background:none;color:var(--cream);font:12px monospace;border:1px solid var(--line);border-radius:20px;padding:10px 14px;cursor:pointer}.prototype-shell .prototype-frame{position:relative;margin:0;background:#101010}.prototype-shell iframe{width:100%;height:720px;max-height:80dvh;pointer-events:none}.prototype-shell.is-active iframe{pointer-events:auto}.prototype-start{position:absolute;inset:0;width:100%;border:0;padding:24px;background:#101010;color:var(--cream);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px}.prototype-start[hidden],.prototype-stop[hidden]{display:none}.prototype-start img{width:auto;height:calc(100% - 70px);max-width:100%;object-fit:contain}.prototype-start>span{padding:14px 22px;border-radius:28px;background:#7755ed;color:white;font:14px monospace}.prototype-stop:focus-visible,.prototype-start:focus-visible{outline:2px solid var(--cream);outline-offset:-4px}.award-artifact a{background:#101010}.award-artifact img,.archive-grid .award-artifact img{height:auto;aspect-ratio:auto;object-fit:initial}.hubble-case:has(.prototype-shell.is-active) .portfolio-cursor{display:none!important}.prototype-shell.is-active,.prototype-shell.is-active *{cursor:auto!important}
.prototype-controls{position:sticky;top:72px;z-index:9;background:#151410;padding-block:10px}@media(max-width:700px){.prototype-controls{top:60px}}

.hubble-cover>a{display:block;overflow:hidden}.hubble-cover img{transform:translate3d(var(--mouse-x,0px),var(--mouse-y,0px),0) scale(1.04);transition:transform .55s cubic-bezier(.22,1,.36,1)}.hubble-cover.is-tracking img{transition-duration:.35s}.hubble-cover:focus-within{outline:2px solid var(--cream);outline-offset:5px}@media(prefers-reduced-motion:reduce),(hover:none){.hubble-cover img{transform:none;transition:none}}
.hubble-case:has(.hubble-cover a:hover) .portfolio-cursor.is-case::before{content:'BEHANCE ↗'}