

.w2-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.w2-list > li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; align-items: center; padding: 10px 12px; border: 1.5px solid var(--stone); border-radius: 12px; background: var(--field); font-size: .92rem; color: var(--brown); }
.w2-list > li > b { color: var(--ink); font-weight: 700; }
.w2-list > li > small { grid-column: 1 / -1; color: var(--muted); font-size: .84rem; line-height: 1.4; }
.w2-list > li.you { border-color: var(--ink); background: var(--tint); }
.w2-k { font: 600 11px/1.2 var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 4px 0 0; }
.w2-q { margin: 0; font-weight: 700; color: var(--ink); }
.w2-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.w2-who { display: inline-flex; align-items: center; gap: 6px; font-size: .84rem; color: var(--muted); }

.w2-sw { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.w2-sw li { display: grid; gap: 4px; font-size: .8rem; color: var(--brown); }
.w2-sw i { display: block; height: 40px; border-radius: 10px; border: 2px solid var(--fixed-ink); }
.w2-sw b { font: 600 11px/1 var(--mono); color: var(--ink); }
.w2-words { display: flex; flex-wrap: wrap; gap: 6px; }
.w2-words span { font: 700 .85rem/1 var(--body); padding: 7px 11px; border-radius: 999px; border: 1.5px solid var(--ink); background: var(--surface); }
.w2-font { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: .9rem; color: var(--brown); }
.w2-font b { font: 800 1.15rem/1 var(--display); font-stretch: 84%; color: var(--ink); }
.w2-logo { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; border: 2px solid var(--fixed-ink); background: #2F6B4F; color: #FFF8EE; font: 800 1.1rem/1 var(--display); }

.w2-mira { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 2px solid var(--fixed-ink); background: var(--sun); position: relative; }
.w2-mira::before, .w2-mira::after { content: ""; position: absolute; width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--fixed-ink); }
.w2-mira::before { background: #C4552A; left: 7px; top: 9px; }
.w2-mira::after { background: #2F5D8A; right: 7px; top: 12px; }

.w2-sizes { display: flex; align-items: end; gap: 12px; flex-wrap: wrap; }
.w2-sizes span { display: grid; place-items: center; border: 2px solid var(--ink); border-radius: 8px; background: var(--field); font: 600 11px/1 var(--mono); color: var(--ink); }
.w2-sizes .r916 { width: 45px; height: 80px; }
.w2-sizes .r11 { width: 64px; height: 64px; }
.w2-sizes .r169 { width: 104px; height: 58px; }

.w2-chat { border: 2px solid var(--ink); border-radius: 16px; overflow: hidden; background: var(--field); }
.w2-chat-top { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: #2F6B4F; color: #FFF8EE; font-weight: 700; }
.w2-chat-top i { width: 10px; height: 10px; border-radius: 50%; background: #B4E3C5; border: 1.5px solid #FFF8EE; }
.w2-chat-body { padding: 4px 12px 12px; }

.w2-seven { counter-reset: w2; }
.w2-seven > li { counter-increment: w2; position: relative; padding-top: 44px; }
.w2-seven > li::before { content: counter(w2); position: absolute; left: 20px; top: 16px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--sun); color: var(--fixed-ink); border: 2px solid var(--fixed-ink); font: 800 13px/1 var(--display); }

.w2-credits { margin: 22px 0 0; font-size: .86rem; color: var(--muted); max-width: 760px; }

@media (max-width: 480px) {
  .w2-list > li { grid-template-columns: 1fr; }
  .w2-list > li > .pill, .w2-list > li > .mini-btn, .w2-list > li > .ev-sw { justify-self: start; }
}

.more { position: relative; }
.more::before { content: ""; position: absolute; left: -4px; right: -4px; top: 50%; height: 44px; transform: translateY(-50%); }
.learn-more { row-gap: 16px; }
.tech summary { padding-block: 16px; }
.jump a { min-height: 44px; }
.ev-index a { padding-block: 11px; }

.mi-hero { position: relative; }
.mi-ch { position: absolute; left: 26px; top: -114px; height: 118px; width: auto; pointer-events: none; }
.pl-hero .mi-hero { margin-top: 110px; }
.mi-looks { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mi-looks li { display: grid; gap: 4px; justify-items: start; }
.mi-looks b { color: var(--ink); font-weight: 700; font-size: .92rem; }
.mi-looks small { font: 600 10.5px/1.2 var(--mono); color: var(--muted); }
.mi-art { display: grid; align-content: end; gap: 5px; width: 100%; aspect-ratio: 3 / 4; padding: 10px; box-sizing: border-box; border: 2px solid var(--fixed-ink); border-radius: 10px; }
.mi-art i { display: block; height: 7px; border-radius: 4px; }
.mi-art i:first-child { height: 16px; width: 80%; }
.mi-art i:nth-child(2) { width: 60%; }
.mi-art i:last-child { width: 44%; height: 12px; border-radius: 999px; }
.mi-bold .mi-art { background: #2F6B4F; }
.mi-bold .mi-art i { background: #FFD23F; }
.mi-clean .mi-art { background: #FFFFFF; }
.mi-clean .mi-art i { background: #2F6B4F; }
.mi-clean .mi-art i:last-child { background: #C4552A; }
.mi-warm .mi-art { background: #F4E4DC; }
.mi-warm .mi-art i { background: #5B3A2E; }
.mi-warm .mi-art i:last-child { background: #2F6B4F; }
@media (max-width: 640px) {
  .mi-ch { display: none; }
  .pl-hero .mi-hero { margin-top: 0; }
  .mi-looks { gap: 8px; }
}

.ft-index { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; }
.ft-index a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border: 1.5px solid var(--ink); border-radius: 999px; color: var(--ink); text-decoration: none; font-weight: 600; font-size: .9rem; background: var(--surface); }
.ft-index a:hover, .ft-index a:focus-visible { background: var(--tint); }
.ft-area { margin: 0 0 36px; scroll-margin-top: 90px; }
.ft-h { font: 800 1.6rem/1.1 var(--display); font-stretch: 84%; letter-spacing: -.02em; margin: 0 0 14px; color: var(--ink); }
.ft-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ft-list li { padding: 14px 16px; border: 1.5px solid var(--stone); border-radius: 14px; background: var(--surface); }
.ft-list h3 { margin: 0 0 4px; font-size: 1rem; line-height: 1.3; }
.ft-list h3 a { color: var(--ink); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.ft-list p { margin: 0; color: var(--brown); font-size: .93rem; line-height: 1.45; }
@media (max-width: 1000px) { .ft-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .ft-list { grid-template-columns: minmax(0, 1fr); } .ft-h { font-size: 1.35rem; } }
