

.act--six { background: var(--g0); color: var(--ink); }
.six-slide { position: relative; isolation: isolate; color: var(--ink); }
.six-slide--g0 { --ground: var(--g0); --pool: color-mix(in oklab, var(--teal) 7%, transparent); --face: var(--g2); }
.six-slide--pine { --ground: var(--pine); --pool: color-mix(in oklab, var(--teal) 12%, transparent); --face: #10403A; }
.six-slide__ground { position: absolute; inset: 0; z-index: -1; background: radial-gradient(40% 50% at 30% 58%, var(--pool), transparent 72%), var(--ground); }

.six-hud { max-width: var(--maxw); margin-inline: auto; padding: calc(var(--band) * 0.7) var(--gutter) var(--s4); }
.six-hud__h { font-family: var(--f-display); font-weight: 600; font-size: var(--t-2xl); line-height: 1.04; letter-spacing: var(--track-snug); text-wrap: balance; max-width: 24ch; }
.six-ticks, .six-line, .six-exit { display: none; }
.six-slide__body {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: var(--s7); align-items: center;
  max-width: var(--maxw); margin-inline: auto; padding: var(--s7) var(--gutter);
}
.six-scene { position: relative; width: min(100%, 36rem); aspect-ratio: 4 / 3; justify-self: center; container-type: inline-size; }
.six-copy__h { font-family: var(--f-display); font-weight: 600; font-size: clamp(2.2rem, 1.2rem + 3vw, 4.2rem); line-height: 1; letter-spacing: var(--track-tight); }
.six-copy__hi { display: block; }
.six-copy__line { margin-top: var(--s4); font-size: var(--t-lg); line-height: 1.45; color: var(--ink-soft); max-width: 26ch; text-wrap: pretty; }
@media (max-width: 860px) {
  .six-slide__body { grid-template-columns: minmax(0, 1fr); gap: var(--s4); padding-block: var(--s6); }
  .six-scene { width: min(100%, 26rem); }
  .six-copy__h { font-size: clamp(2rem, 9vw, 2.75rem); }
  .six-copy__line { font-size: var(--t-base); margin-top: var(--s2); }
}

html.sc-flat .six-scene { width: min(100%, 36rem, calc((100svh - var(--bar-h) - 2.5rem) * 1.3333)); }
@media (max-width: 860px) { html.sc-flat .six-scene { width: min(100%, 26rem, calc((100svh - var(--bar-h) - 2.5rem) * 1.3333)); } }

html.six-stack:not(.sc-fail) .six-stage { display: block; padding: 0; background: var(--g0); }
html.six-stack:not(.sc-fail) .six-hud {
  position: absolute; z-index: 20; top: var(--bar-h); left: 0; right: 0; max-width: none; margin: 0;
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s6);
  padding: var(--s5) var(--gutter) 0; pointer-events: none;
}

html.six-stack:not(.sc-fail) .six-hud.is-leading { position: fixed; }
html.six-stack:not(.sc-fail) .six-hud__h { flex: 0 1 auto; font-size: var(--t-xl); line-height: 1.12; max-width: 34ch; }
html.six-stack:not(.sc-fail) .six-ticks { display: flex; gap: 0.45rem; }
.six-ticks li { width: 1.15rem; height: 0.63rem; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); background: var(--hair-strong); transition: background-color var(--d-base) var(--ease); }
.six-ticks li.is-lit { background: var(--teal); }
html.six-stack:not(.sc-fail) .six-slides { position: absolute; inset: 0; }

html.six-stack:not(.sc-fail) .six-slide { position: absolute; inset: 0; opacity: 0; pointer-events: none; }
html.six-stack:not(.sc-fail) .six-slide.is-on { opacity: 1; }
html.six-stack:not(.sc-fail) .six-slide__body {
  position: absolute; inset: 0; max-width: none; margin: 0;
  padding: calc(var(--bar-h) + var(--hud-h, 6rem)) var(--gutter) var(--s6);
}
html.six-stack:not(.sc-fail) .six-scene { width: min(100%, 38rem, calc((100svh - var(--bar-h) - var(--hud-h, 6rem) - 4.5rem) * 1.3333)); }

html.six-stack:not(.sc-fail) .six-copy { min-height: var(--copy-h, 0px); }
html.six-stack:not(.sc-fail) .six-copy__h { overflow: clip; padding-bottom: 0.1em; margin-bottom: -0.1em; }
html.six-stack:not(.sc-fail) .six-copy__hi { transform: translateY(calc((1 - var(--hv, 1)) * 112%)); }
html.six-stack:not(.sc-fail) .six-copy__line { opacity: var(--lv, 1); transform: translateY(calc((1 - var(--lv, 1)) * 0.75rem)); }

html.six-stack:not(.sc-fail) .six-line {
  display: block; position: absolute; z-index: 18; top: 0; bottom: 0; left: 0; width: 2px; margin-left: -1px;
  background: var(--teal); box-shadow: 0 0 14px 1px var(--teal-hair); opacity: 0; pointer-events: none;
}
html.six-stack:not(.sc-fail) .six-line::before {
  content: ""; position: absolute; top: 0; bottom: 0; right: 100%; width: min(9rem, 18vw);
  background: linear-gradient(to left, color-mix(in oklab, var(--teal) 14%, transparent), transparent);
}

html.six-stack:not(.sc-fail) .six-exit {
  display: block; position: absolute; z-index: 19; left: 0; right: 0; bottom: -2px; height: 36vh;
  background: var(--g2); pointer-events: none;
  clip-path: ellipse(calc(55% + var(--exit, 0) * 65%) calc(var(--exit, 0) * 100%) at 50% 100%);
}
html.six-stack:not(.sc-fail) .six-slide.is-play .obj { pointer-events: auto; }
.six-slide.is-hold *, .six-slide.is-hold *::before, .six-slide.is-hold *::after { animation-play-state: paused !important; }
@media (max-width: 860px) {
  html.six-stack:not(.sc-fail) .six-hud { column-gap: var(--s4); row-gap: var(--s2); padding-top: var(--s4); }
  html.six-stack:not(.sc-fail) .six-hud__h { font-size: var(--t-lg); max-width: 26ch; }
  html.six-stack:not(.sc-fail) .six-slide__body { grid-template-rows: auto auto; align-content: center; padding: calc(var(--bar-h) + var(--hud-h, 6.5rem)) var(--gutter) var(--s5); }
  html.six-stack:not(.sc-fail) .six-scene { width: min(100%, 26rem, calc(40svh * 1.3333)); }
}
@media (max-width: 860px) and (max-height: 700px) {
  html.six-stack:not(.sc-fail) .six-scene { width: min(100%, calc(34svh * 1.3333)); }
  html.six-stack:not(.sc-fail) .six-copy__h { font-size: clamp(1.6rem, 7.5vw, 2rem); }
  html.six-stack:not(.sc-fail) .six-copy__line { font-size: var(--t-sm); }
}

.six-scene--pre::before { content: ""; position: absolute; inset: 5% 1%; border-radius: 4cqi; background: #070B0A; box-shadow: var(--e3), inset 0 0 0 1px var(--hair-strong), 0 0 0 1px color-mix(in oklab, var(--teal) 14%, transparent); }
.pm { position: absolute; inset: calc(5% + 2.2cqi) calc(1% + 2.2cqi); border-radius: 2.4cqi; overflow: hidden; background: var(--paper); }
.pm__page {
  position: absolute; inset: 0; padding: 5cqi 6cqi 6cqi; display: grid;
  grid-template-columns: 1.15fr 0.85fr; grid-template-rows: auto auto auto auto 1fr; column-gap: 5cqi; row-gap: 2.2cqi;
}
.pm__bar { grid-column: 1 / -1; display: flex; gap: 2.2cqi; align-items: center; margin-bottom: 3.5cqi; }
.pm__bar i { display: block; height: 1.5cqi; width: 7cqi; border-radius: 1cqi; background: color-mix(in oklab, var(--ink-p) 24%, transparent); }
.pm__bar i:first-child { width: 12cqi; height: 2.2cqi; margin-right: auto; background: var(--ink-p); }
.pm__h { grid-column: 1; height: 4.6cqi; border-radius: 0.8cqi; background: var(--ink-p); }
.pm__h--2 { width: 70%; }
.pm__t { grid-column: 1; height: 1.8cqi; width: 88%; margin-top: 1.2cqi; border-radius: 1cqi; background: color-mix(in oklab, var(--ink-p) 30%, transparent); }
.pm__photo { grid-column: 2; grid-row: 2 / 6; border-radius: 1.6cqi; background: linear-gradient(150deg, #A6DCD3, #4F9E93 58%, #2A6961); }
.pm__btn { grid-column: 1; grid-row: 5; align-self: end; width: 44%; height: 5.4cqi; border-radius: 1cqi; background: var(--teal-p); }
.pm__curtain { position: absolute; inset: 0; background: radial-gradient(60% 70% at 50% 34%, #13201E, #0A0F0E 72%); clip-path: ellipse(150% 58% at 50% 0%); }
.pm__mark { position: absolute; left: 50%; top: 27%; width: 19cqi; height: auto; overflow: visible; transform: translate(-50%, -50%); }
@media (prefers-reduced-motion: no-preference) {
  .six-slide.is-play .pm__curtain { animation: pm-curtain 5.4s var(--ease-in-out) infinite; }
  .six-slide.is-play .pm__page { animation: pm-page 5.4s var(--ease) infinite; }
  .six-slide.is-play .pm__p--1 { animation: pm-rise-1 5.4s var(--ease) infinite; }
  .six-slide.is-play .pm__p--2 { animation: pm-rise-2 5.4s var(--ease) infinite; }
  .six-slide.is-play .pm__p--3 { animation: pm-rise-3 5.4s var(--ease) infinite; }
}
@keyframes pm-curtain {
  0%, 30% { clip-path: ellipse(150% 150% at 50% 0%); }
  46% { clip-path: ellipse(150% 0% at 50% 0%); }
  88% { clip-path: ellipse(150% 0% at 50% 0%); }
  92%, 100% { clip-path: ellipse(150% 150% at 50% 0%); }
}
@keyframes pm-page { 0%, 32% { transform: translateY(3cqi); } 50%, 100% { transform: none; } }
@keyframes pm-rise-1 { 0% { transform: translateY(14px); opacity: 0; } 9%, 100% { transform: none; opacity: 0.34; } }
@keyframes pm-rise-2 { 0%, 3% { transform: translateY(14px); opacity: 0; } 12%, 100% { transform: none; opacity: 0.62; } }
@keyframes pm-rise-3 { 0%, 6% { transform: translateY(14px); opacity: 0; } 15% { transform: none; opacity: 1; } 18%, 24% { transform: none; opacity: 1; filter: drop-shadow(0 0 3px #35D6C4); } 30%, 100% { transform: none; opacity: 1; filter: none; } }

.obj { position: absolute; inset: 0; perspective: 1000px; perspective-origin: 50% 20%; touch-action: pan-y; }
.obj__floor { position: absolute; left: 20%; right: 20%; bottom: 7%; height: 18%; border-radius: 50%; background: radial-gradient(closest-side, rgba(3, 8, 7, 0.55), transparent); }
.obj__spin {
  --spin: -13deg; position: absolute; left: 50%; top: 66%; width: 0; height: 0;
  transform-style: preserve-3d; transform: rotateX(57deg) rotateZ(calc(45deg + var(--spin)));
}
.slab { position: absolute; transform-style: preserve-3d; left: calc(var(--s) / -2); top: calc(var(--s) / -2); width: var(--s); height: var(--s); transform: translateZ(var(--z)); --t: 2.6cqi; }
.slab--1 { --s: 30.2cqi; --z: 0cqi; --top: color-mix(in oklab, var(--ink) 38%, var(--pine)); --lo: 16%; --hi: 34%; --tone: var(--ink); }
.slab--2 { --s: 25.5cqi; --z: 19.6cqi; --top: color-mix(in oklab, var(--ink) 64%, var(--pine)); --lo: 22%; --hi: 46%; --tone: var(--ink); }
.slab--3 { --s: 20.9cqi; --z: 39.2cqi; --top: var(--teal); --lo: 38%; --hi: 78%; --tone: var(--teal); }
.f { position: absolute; display: block; }
.f--top { inset: 0; transform: translateZ(var(--t)); border: calc(var(--s) * 0.11) solid var(--top); }
.f--side {
  left: 0; top: calc(50% - var(--t) / 2); width: var(--s); height: var(--t);
  transform: rotateZ(var(--n)) translateY(calc(var(--s) / 2)) translateZ(calc(var(--t) / 2)) rotateX(90deg);
  background: color-mix(in oklab, var(--tone) calc(var(--lo) + (var(--hi) - var(--lo)) * (0.5 + 0.5 * cos(calc(var(--n) + var(--spin))))), #06100E);
}
.slab--3 .f--top { box-shadow: 0 0 2.4cqi color-mix(in oklab, var(--teal) 30%, transparent); }
@media (hover: hover) and (pointer: fine) { html.six-stack .six-slide.is-play .obj { cursor: grab; } html.six-stack .six-slide.is-play .obj:active { cursor: grabbing; } }

.spd { position: absolute; inset: 3% 2%; display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 6cqi; align-items: center; }
.spd__phone { justify-self: end; width: 31cqi; aspect-ratio: 9 / 18.5; padding: 1.5cqi; border-radius: 5cqi; background: #070B0A; box-shadow: var(--e3), inset 0 0 0 1px var(--hair-strong); }
.spd__screen { position: relative; height: 100%; overflow: hidden; border-radius: 3.6cqi; background: var(--g2); display: grid; align-content: start; gap: 1.7cqi; padding: 2.6cqi 2.4cqi; }
.sp { display: block; border-radius: 0.7cqi; }
.sp--bar { height: 3.2cqi; margin: -2.6cqi -2.4cqi 2cqi; border-radius: 0; background: color-mix(in oklab, var(--ink) 12%, var(--g1)); }
.sp--h { height: 3cqi; width: 92%; background: var(--ink); }
.sp--h2 { width: 58%; }
.sp--t { height: 1.4cqi; width: 96%; margin-top: 0.6cqi; background: color-mix(in oklab, var(--ink-soft) 55%, transparent); }
.sp--t2 { width: 72%; margin-top: 0; }
.sp--photo { height: 17cqi; margin-top: 1.6cqi; border-radius: 1.4cqi; background: linear-gradient(150deg, #A6DCD3, #4F9E93 58%, #2A6961); }
.sp--mark { justify-self: center; width: 10cqi; margin-top: 2.4cqi; }
.sp--mark svg { width: 100%; height: auto; overflow: visible; }
.spd__film { display: grid; gap: 2.2cqi; width: 46cqi; }
.spd__f { position: relative; display: grid; grid-template-columns: 1.2fr 0.8fr; align-content: start; gap: 1cqi 1.6cqi; height: 13cqi; padding: 1.8cqi 2.2cqi; border-radius: 1.6cqi; background: var(--g2); box-shadow: inset 0 0 0 1px var(--hair); }
.spd__f--4 { box-shadow: inset 0 0 0 1.5px var(--teal); }
.sf { display: block; border-radius: 0.5cqi; }
.sf--bar { grid-column: 1 / -1; height: 1.3cqi; background: color-mix(in oklab, var(--ink) 16%, transparent); }
.sf--h { grid-column: 1; height: 1.9cqi; width: 92%; background: var(--ink); }
.sf--t { grid-column: 1; height: 1cqi; width: 80%; background: color-mix(in oklab, var(--ink-soft) 55%, transparent); }
.sf--photo { grid-column: 2; grid-row: 2 / 5; min-height: 6.5cqi; background: #4F9E93; }
.sf--mark { grid-column: 1; width: 3.4cqi; height: 1.9cqi; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); background: var(--teal); }
@media (prefers-reduced-motion: no-preference) {
  .six-slide.is-play .sp--bar { animation: spd-in-1 4.8s linear infinite; }
  .six-slide.is-play :is(.sp--h, .sp--t) { animation: spd-in-2 4.8s linear infinite; }
  .six-slide.is-play .sp--photo { animation: spd-in-3 4.8s linear infinite; }
  .six-slide.is-play .sp--mark { animation: spd-in-4 4.8s linear infinite; }
  .six-slide.is-play .spd__f--1 { animation: spd-f-1 4.8s linear infinite; }
  .six-slide.is-play .spd__f--2 { animation: spd-f-2 4.8s linear infinite; }
  .six-slide.is-play .spd__f--3 { animation: spd-f-3 4.8s linear infinite; }
  .six-slide.is-play .spd__f--4 { animation: spd-f-4 4.8s linear infinite; }
}
@keyframes spd-in-1 { 0%, 3% { opacity: 0; } 4%, 90% { opacity: 1; } 95%, 100% { opacity: 0; } }
@keyframes spd-in-2 { 0%, 8% { opacity: 0; transform: translateY(0.8cqi); } 10%, 90% { opacity: 1; transform: none; } 95%, 100% { opacity: 0; } }
@keyframes spd-in-3 { 0%, 15% { opacity: 0; } 17%, 90% { opacity: 1; } 95%, 100% { opacity: 0; } }
@keyframes spd-in-4 { 0%, 22% { opacity: 0; transform: scale(0.9); } 24%, 90% { opacity: 1; transform: none; } 95%, 100% { opacity: 0; } }
@keyframes spd-f-1 { 0%, 3% { box-shadow: inset 0 0 0 1px var(--hair); } 4%, 9% { box-shadow: inset 0 0 0 1.5px var(--teal); } 10%, 100% { box-shadow: inset 0 0 0 1px var(--hair); } }
@keyframes spd-f-2 { 0%, 9% { box-shadow: inset 0 0 0 1px var(--hair); } 10%, 16% { box-shadow: inset 0 0 0 1.5px var(--teal); } 17%, 100% { box-shadow: inset 0 0 0 1px var(--hair); } }
@keyframes spd-f-3 { 0%, 16% { box-shadow: inset 0 0 0 1px var(--hair); } 17%, 23% { box-shadow: inset 0 0 0 1.5px var(--teal); } 24%, 100% { box-shadow: inset 0 0 0 1px var(--hair); } }
@keyframes spd-f-4 { 0%, 23% { box-shadow: inset 0 0 0 1px var(--hair); } 24%, 90% { box-shadow: inset 0 0 0 1.5px var(--teal); } 95%, 100% { box-shadow: inset 0 0 0 1px var(--hair); } }

.kb { position: absolute; inset: 3% 3% 2%; }
.kb__panel {
  position: absolute; inset: 0 0 24% 0; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 4cqi 5cqi;
  padding: 6cqi 7cqi; align-items: center; border-radius: 2.4cqi; background: #101413; box-shadow: var(--e3), inset 0 0 0 1px var(--hair);
}
.kb__c { position: relative; display: flex; align-items: center; gap: 2.2cqi; justify-self: start; padding: 2cqi 2.4cqi; }
.kb__link { display: block; width: 15cqi; height: 2.3cqi; border-radius: 0.8cqi; background: var(--ink); box-shadow: 0 1.3cqi 0 -0.8cqi var(--teal); }
.kb__link--long { width: 22cqi; }
.kb__btn { display: block; width: 23cqi; height: 7.6cqi; border-radius: 1.4cqi; background: var(--teal); }
.kb__switch { position: relative; display: block; width: 11cqi; height: 6.2cqi; border-radius: 3.1cqi; background: var(--teal); }
.kb__switch b { position: absolute; top: 0.9cqi; left: 0.9cqi; width: 4.4cqi; height: 4.4cqi; border-radius: 50%; background: var(--teal-ink); transform: translateX(4.8cqi); }
.kb__word { font-style: normal; font-family: var(--f-display); font-weight: 500; font-size: max(0.7rem, 3.3cqi); color: var(--ink); }
.kb__ring { position: absolute; inset: 0; border-radius: 1.8cqi; box-shadow: 0 0 0 0.55cqi var(--teal); opacity: 0; pointer-events: none; }
.kb__c--4 .kb__ring { opacity: 1; }
.kb__key {
  position: absolute; left: 0; bottom: 2cqi; padding: 1.6cqi 4.6cqi; border-radius: 1.4cqi; background: var(--g3);
  box-shadow: 0 0.9cqi 0 #050807, inset 0 0 0 1px var(--hair-strong);
  font-family: var(--f-display); font-weight: 600; font-size: max(0.72rem, 3.4cqi); line-height: 1.2; color: var(--ink);
}
.kb__pair { position: absolute; right: 3%; bottom: calc(2% + 2cqi); display: flex; align-items: center; gap: 2.4cqi; margin: 0; }
.kb__aa { display: grid; place-items: center; width: 12cqi; height: 8.4cqi; border-radius: 1.4cqi; background: #101413; color: #F2F0EA; box-shadow: inset 0 0 0 1px var(--hair-strong); font-family: var(--f-display); font-weight: 600; font-size: max(0.9rem, 4.2cqi); line-height: 1; }
@media (prefers-reduced-motion: no-preference) {
  .six-slide.is-play .kb__c--1 .kb__ring { animation: kb-ring-1 6.4s var(--ease) infinite; }
  .six-slide.is-play .kb__c--2 .kb__ring { animation: kb-ring-2 6.4s var(--ease) infinite; }
  .six-slide.is-play .kb__c--3 .kb__ring { animation: kb-ring-3 6.4s var(--ease) infinite; }
  .six-slide.is-play .kb__c--4 .kb__ring { animation: kb-ring-4 6.4s var(--ease) infinite; }
  .six-slide.is-play .kb__key { animation: kb-key 6.4s linear infinite; }
  .six-slide.is-play .kb__switch { animation: kb-switch 6.4s var(--ease) infinite; }
  .six-slide.is-play .kb__switch b { animation: kb-knob 6.4s var(--ease) infinite; }
}
@keyframes kb-ring-1 { 0% { opacity: 1; transform: scale(1.12); } 3%, 17% { opacity: 1; transform: none; } 18%, 100% { opacity: 0; } }
@keyframes kb-ring-2 { 0%, 17% { opacity: 0; } 18% { opacity: 1; transform: scale(1.12); } 21%, 35% { opacity: 1; transform: none; } 36%, 100% { opacity: 0; } }
@keyframes kb-ring-3 { 0%, 35% { opacity: 0; } 36% { opacity: 1; transform: scale(1.12); } 39%, 53% { opacity: 1; transform: none; } 54%, 100% { opacity: 0; } }
@keyframes kb-ring-4 { 0%, 53% { opacity: 0; } 54% { opacity: 1; transform: scale(1.12); } 57%, 100% { opacity: 1; transform: none; } }
@keyframes kb-key { 0%, 2.5%, 18%, 20.5%, 36%, 38.5%, 54%, 56.5% { transform: translateY(0.7cqi); box-shadow: 0 0.2cqi 0 #050807, inset 0 0 0 1px var(--teal); } 1.5%, 4%, 17.9%, 19.5%, 22%, 35.9%, 37.5%, 40%, 53.9%, 55.5%, 58%, 100% { transform: none; box-shadow: 0 0.9cqi 0 #050807, inset 0 0 0 1px var(--hair-strong); } }
@keyframes kb-switch { 0%, 64% { background: color-mix(in oklab, var(--ink) 22%, #101413); } 70%, 96% { background: var(--teal); } 100% { background: color-mix(in oklab, var(--ink) 22%, #101413); } }
@keyframes kb-knob { 0%, 64% { transform: none; background: var(--ink); } 70%, 96% { transform: translateX(4.8cqi); background: var(--teal-ink); } 100% { transform: none; background: var(--ink); } }

.flip { position: absolute; inset: 8% 3%; display: grid; gap: 4cqi; align-content: center; }
.flip__card { display: grid; gap: 4cqi; }
.flip__face {
  display: grid; align-content: center; gap: 2.4cqi; padding: 5cqi 6cqi; margin: 0; border-radius: 2.4cqi;
  background: var(--face); box-shadow: var(--e3), inset 0 1px 0 color-mix(in oklab, var(--ink) 10%, transparent), inset 0 0 0 1px var(--hair);
}
.flip__tag { font-family: var(--f-display); font-weight: 600; font-size: max(0.72rem, 2.7cqi); letter-spacing: var(--track-wide); color: var(--teal); }
.flip__text { font-family: var(--f-display); font-weight: 600; font-size: max(1.1rem, 6.6cqi); line-height: 1.08; letter-spacing: var(--track-snug); color: var(--ink); text-wrap: balance; }
.flip__face--zh :is(.flip__tag, .flip__text) { font-family: var(--f-cjk); letter-spacing: 0.04em; }

html.six-stack:not(.sc-fail) .flip { inset: 18% 2%; display: block; perspective: 1400px; }
html.six-stack:not(.sc-fail) .flip__card { position: relative; display: block; height: 100%; transform-style: preserve-3d; }
html.six-stack:not(.sc-fail) .flip__face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
html.six-stack:not(.sc-fail) .flip__face--zh { transform: rotateX(180deg); }
html.six-stack:not(.sc-fail) .flip__text { font-size: max(1.35rem, 8.2cqi); }
@media (prefers-reduced-motion: no-preference) {
  .six-slide.is-play .flip__card { animation: flip 6s var(--ease-in-out) infinite; }
}
@keyframes flip { 0%, 36% { transform: rotateX(0deg); } 50%, 86% { transform: rotateX(-180deg); } 100% { transform: rotateX(-360deg); } }

.own { position: absolute; inset: 6% 2%; color: var(--ink); }
.own__line { position: absolute; left: 40%; top: 3%; bottom: 3%; width: 2px; margin-left: -1px; background: var(--teal); box-shadow: 0 0 12px 1px var(--teal-hair); }
.own__plate { position: absolute; left: 47%; right: 0; top: 6%; bottom: 6%; border-radius: 2.4cqi; background: var(--face); box-shadow: var(--e3), inset 0 1px 0 color-mix(in oklab, var(--ink) 10%, transparent), inset 0 0 0 1px var(--hair); }
.own__item { position: absolute; display: flex; align-items: center; gap: 1.6cqi; }
.own__item svg { display: block; width: 100%; height: auto; overflow: visible; }
.own__item--domain {
  left: 51%; top: 15%; padding: 2cqi 3cqi; border-radius: 3.8cqi; background: #0A0F0E; box-shadow: inset 0 0 0 1px var(--hair-strong);
  font-family: var(--f-text); font-weight: 500; font-size: max(0.62rem, 3.15cqi); line-height: 1; white-space: nowrap; color: var(--ink);
}
.own__item--domain .own__lock { width: 2.7cqi; flex: none; color: var(--teal); }
.own__item--files { left: 53%; top: 42%; width: 20cqi; color: var(--ink); }
.own__item--key { left: 77%; top: 47.5%; width: 18cqi; color: var(--teal); }
@media (prefers-reduced-motion: no-preference) {
  .six-slide.is-play .own__item { animation: own-cross 1.25s var(--ease) both; }
  .six-slide.is-play .own__item--domain { animation-delay: 0.25s; }
  .six-slide.is-play .own__item--files { animation-delay: 0.85s; }
  .six-slide.is-play .own__item--key { animation-delay: 1.45s; }
  
  .six-slide.is-play .own__plate { animation: own-plate 0.6s var(--ease) 2.55s both; }
}
@keyframes own-plate {
  from { box-shadow: var(--e3), inset 0 1px 0 color-mix(in oklab, var(--ink) 10%, transparent), inset 0 0 0 1px var(--hair); }
  to { box-shadow: var(--e3), inset 0 1px 0 color-mix(in oklab, var(--ink) 10%, transparent), inset 0 0 0 1.5px var(--teal); }
}
@keyframes own-cross {
  0% { transform: translate(-44cqi, 0); opacity: 0.55; }
  55% { transform: translate(-16cqi, -4.5cqi); opacity: 1; }
  100% { transform: none; opacity: 1; }
}
