.portfolio-projects { background: var(--ob-glass-thick, #f7f6f2); }
.portfolio-projects > .editorial-shell { padding-block: 40px 88px; }
.portfolio-projects > .editorial-shell > .editorial-label { margin-bottom: 24px; }
.portfolio-mihen { display: grid; grid-template-columns: minmax(200px,.7fr) minmax(0,1.3fr); border: 1px solid var(--ob-line,#ddd); border-radius: 24px; overflow: hidden; background: var(--ob-card,#fff); }
.portfolio-brand { display: flex; justify-content: center; align-items: center; gap: 18px; min-height: 270px; background: #efeee9; }
.portfolio-brand img { width: 82px; height: 82px; object-fit: contain; }
.portfolio-brand span { font-size: 32px; letter-spacing: .22em; font-weight: 650; color: #171714; }
.portfolio-project-copy { padding: clamp(26px,4vw,48px); }
.portfolio-project-copy h2 { margin: 10px 0 16px; font-size: 32px; font-weight: 580; letter-spacing: -.04em; }
.portfolio-project-copy > p:not(.editorial-label) { max-width: 55ch; color: var(--ob-muted,#62625f); line-height: 1.7; }
.portfolio-model-heading { margin: 64px 0 26px; }
.portfolio-model-heading h2 { font-size: clamp(25px,3vw,36px); font-weight: 580; letter-spacing: -.035em; }
.portfolio-model-heading p { margin-top: 10px; color: var(--ob-muted,#62625f); }
.portfolio-model-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.portfolio-model-card { min-width: 0; border: 1px solid var(--ob-line,#ddd); border-radius: 22px; overflow: hidden; background: var(--ob-card,#fff); }
.portfolio-jelly-card { grid-column: 1 / -1; }
.portfolio-jelly-card .portfolio-model-stage { aspect-ratio: 16 / 9; }
.portfolio-model-stage { position: relative; aspect-ratio: 4/3; background: #e5e3dd; }
.portfolio-model-stage > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.portfolio-model-stage model-viewer { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; }
.portfolio-model-stage.is-interactive model-viewer { opacity: 1; }
.portfolio-model-stage.is-interactive > img { visibility: hidden; }
.portfolio-model-stage.is-interactive .portfolio-jelly-poster { visibility: hidden; }
.portfolio-model-stage .portfolio-jelly-frame { position:absolute; inset:0; display:block; width:100%; height:100%; border:0; opacity:0; background:#17121c; }
.portfolio-model-stage.is-interactive .portfolio-jelly-frame { opacity:1; }
.portfolio-jelly-poster { position:absolute; inset:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); place-items:center; gap:7% 3%; padding:8% 6%; overflow:hidden; background:radial-gradient(ellipse at 50% 15%,#43324b 0,#28212e 42%,#19151d 100%); }
.jelly-toy { position:relative; display:grid; place-items:center; width:min(76%,90px); height:min(72%,92px); border-radius:42% 45% 39% 43%; color:#fff4dc; font:700 clamp(13px,2.1vw,22px)/1 system-ui,sans-serif; text-shadow:0 1px 2px #4a1745; box-shadow:inset -7px -10px 16px #25141e77,inset 4px 5px 10px #fff7,0 10px 22px #09060b80; background:linear-gradient(135deg,#ffb260 0%,#ff742f 54%,#c92d48 100%); transform:rotate(-6deg); }
.jelly-toy::after { content:""; position:absolute; width:35%; height:17%; top:12%; left:15%; border-radius:50%; background:#fff9; filter:blur(4px); transform:rotate(-36deg); }
.jelly-toy b { z-index:1; font-weight:800; }
.jelly-toy.ghost { background:linear-gradient(135deg,#fff 0%,#bfc7e9 70%,#7d63ac 100%); border-radius:48% 48% 25% 25%; }
.jelly-toy.skull { background:linear-gradient(135deg,#d7a5ff,#834dde 75%,#45246e); border-radius:46% 46% 35% 35%; }
.jelly-toy.witch-hat { clip-path:polygon(50% 0,72% 68%,100% 78%,93% 91%,7% 91%,0 78%,37% 68%); background:linear-gradient(135deg,#d68cff,#8139b8 70%,#3a2057); border-radius:0; }
.jelly-toy.candy-corn { clip-path:polygon(50% 0,99% 100%,1% 100%); background:linear-gradient(to bottom,#fff1cc 0 25%,#ffac2e 25% 63%,#ed4c35 63%); border-radius:0; color:#fff; }
.jelly-toy.pill { width:min(85%,102px); height:min(55%,68px); border-radius:999px; background:linear-gradient(120deg,#ff72bd,#e52b88 48%,#85266f); }
.jelly-toy.bat { clip-path:polygon(50% 6%,62% 34%,98% 19%,87% 72%,73% 58%,63% 93%,50% 70%,37% 93%,27% 58%,13% 72%,2% 19%,38% 34%); border-radius:0; background:linear-gradient(135deg,#9a89ff,#5749c9 65%,#28265f); }
.portfolio-model-start { position: absolute; z-index: 2; bottom: 16px; inset-inline-start: 16px; border: 1px solid #d1d0cb; border-radius: 999px; padding: 11px 17px; background: #fff; color: #20201e; font: inherit; font-size: 13px; font-weight: 600; min-height: 44px; cursor: pointer; }
.portfolio-model-start:disabled { opacity: .6; cursor: wait; }
.portfolio-model-status { position: absolute; z-index: 3; inset: 12px 12px auto; background: #fff; padding: 10px; border-radius: 10px; font-size: 13px; }
.portfolio-model-start[hidden], .portfolio-model-status[hidden] { display: none; }
.portfolio-model-copy { padding: 24px; }
.portfolio-model-copy h3 { font-size: 20px; font-weight: 580; letter-spacing: -.02em; }
.portfolio-model-copy p { margin-top: 10px; font-size: 13px; color: var(--ob-muted,#62625f); line-height: 1.6; }
.portfolio-model-copy a { display: inline-flex; gap: 10px; align-items: center; min-height: 44px; margin-top: 8px; font-size: 13px; text-decoration: underline; text-underline-offset: 4px; }
.portfolio-projects :is(a,button):focus-visible { outline: 2px solid #175cd3; outline-offset: 4px; }
@media(max-width: 760px) { .portfolio-mihen { grid-template-columns: 1fr; } .portfolio-brand { min-height: 190px; } .portfolio-model-grid { grid-template-columns: 1fr; } .portfolio-projects > .editorial-shell { padding-block: 30px 60px; } .portfolio-model-heading { margin-top: 44px; } .portfolio-jelly-card .portfolio-model-stage { aspect-ratio: 1 / 1; } }

.portfolio-model-links { display: flex; flex-wrap: wrap; gap: 0 16px; }

.portfolio-crypto { margin-top: 24px; }
.portfolio-crypto .portfolio-brand img { width: 128px; height: 128px; }
.portfolio-crypto .editorial-link { overflow-wrap: anywhere; }