/* Neutral frame illustration; the internal markup/icons are shared with the current member UI. */
/* Modern generic device illustration. These rules never affect the Hero photograph. */
body.page-home.v148-app-showcase .v148-phone {
  width: min(368px, 100%);
  box-sizing: border-box;
  padding: 7px;
  border: 2px solid #33343a;
  border-radius: 54px;
  background: #18191d;
  transform: none;
  box-shadow: 0 28px 55px rgb(28 26 34 / 22%), inset 0 0 0 2px #747079;
}
body.page-home.v148-app-showcase .v148-phone-frame {
  min-height: 750px;
  border-radius: 46px;
  background: #fff;
  transform: none;
}
body.page-home.v148-app-showcase .v148-phone-notch {
  top: 15px;
  width: 86px;
  height: 25px;
  border-radius: 999px;
}
body.page-home.v148-app-showcase .v148-phone-status { height: 50px; padding: 0 24px; font-size: 12px; }
body.page-home.v148-app-showcase .v148-phone-status .v127-signal-bars { gap: 2px; }
body.page-home.v148-app-showcase .v148-phone-notch::after { content: ""; position: absolute; right: 9px; top: 9px; width: 6px; height: 6px; border-radius: 50%; background: #172334; box-shadow: inset 0 0 0 1px #263145; }
body.page-home.v148-app-showcase .v148-phone-status .v127-signal-bars::after { content: ""; width: 15px; height: 8px; margin-left: 4px; border: 1px solid currentColor; border-radius: 3px; background: currentColor; box-shadow: inset 0 0 0 1px #fff; }
@media (max-width: 600px) {
  body.page-home.v148-app-showcase .v148-phone { width: min(310px, 100%); border-radius: 46px; }
  body.page-home.v148-app-showcase .v148-phone-frame { min-height: 620px; border-radius: 38px; }
}
.koirea-public-member-preview { color: #18233b; font-size: 13px; }
/* The illustration uses the current member button roles, rather than the public CTA material. */
html body.page-home.v148-app-showcase .koirea-public-member-preview [data-button-role="primary"] { background: #c82d52 !important; border-color: #c82d52 !important; color: #fff !important; border-radius: 10px; box-shadow: none !important; }
html body.page-home.v148-app-showcase .koirea-public-member-preview :is([data-button-role="secondary"],[data-button-role="emotional"]) { background: #fff !important; border-color: #bbc4d2 !important; color: #17233a !important; border-radius: 10px; box-shadow: none !important; }
html body.page-home.v148-app-showcase .koirea-public-member-preview [data-button-role] .koirea-ui-icon { color: inherit !important; }
html body.page-home.v148-app-showcase .koirea-public-member-preview [data-button-role] .koirea-ui-icon [stroke] { stroke: currentColor !important; }
body.page-home .koirea-public-member-preview [data-button-role] .koirea-ui-icon [fill]:not([fill="none"]) { fill: currentColor !important; }
body.page-home.v148-app-showcase .v148-phone-frame::after { content: ""; position: absolute; bottom: 5px; left: 50%; width: 100px; height: 4px; border-radius: 999px; background: #17233a; transform: translateX(-50%); }
.koirea-public-member-preview .v148-phone-header img { width: 116px; height: 27px; }
.koirea-public-member-preview .koirea-ui-icon { width: 20px; height: 20px; flex: 0 0 20px; }
.koirea-public-member-preview__heading { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; }
.koirea-public-member-preview__heading strong { display: flex; align-items: center; gap: 8px; font-size: 18px; }
.koirea-public-member-preview__heading > span { color: #69778f; font-size: 11px; }
.koirea-public-member-preview__card { padding: 0 12px; }
/* Override the legacy global three-column member-row geometry inside this narrow illustration. */
.koirea-public-member-preview .v128c-member-card { display: grid; grid-template-columns: 88px minmax(0, 1fr) !important; gap: 12px !important; padding: 14px !important; margin: 0; border: 1px solid #e9dfe3; border-radius: 20px; background: #fff; box-shadow: 0 8px 24px rgb(55 36 43 / 6%); }
.koirea-public-member-preview .v639-member-photo { display: block; grid-column: 1 !important; grid-row: 1 !important; width: 88px !important; min-width: 88px !important; max-width: 88px !important; height: 110px !important; aspect-ratio: 4 / 5 !important; overflow: hidden; border-radius: 12px; }
.koirea-public-member-preview .v639-member-photo img { width: 100%; height: 100%; object-fit: cover; }
.koirea-public-member-preview .v639-member-main { grid-column: 2 !important; grid-row: 1 !important; min-width: 0; padding: 0 !important; align-self: start !important; gap: 6px !important; }
.koirea-public-member-preview .v639-member-title { display: block !important; }
.koirea-public-member-preview .v639-member-title h2 { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 16px; margin: 0 0 4px; white-space: normal !important; }
.koirea-public-member-preview .v639-member-title small { font-size: 11px; white-space: nowrap; }
.koirea-public-member-preview .v639-member-title p { font-size: 11px; margin: 0; overflow-wrap: anywhere; }
.koirea-public-member-preview .v639-presence { display: none; }
.koirea-public-member-preview .v639-member-badges:empty { display: none; }
.koirea-public-member-preview .v639-member-tags { display: flex; flex-wrap: wrap !important; gap: 4px; margin-top: 8px; }
.koirea-public-member-preview .v639-member-tags span { padding: 4px 6px; font-size: 10px; border-radius: 8px; background: var(--brand-primary-subtle); }
.koirea-public-member-preview .post-d-common-points { margin-top: 8px; }
.koirea-public-member-preview .post-d-common-points summary { padding: 8px; font-size: 12px; }
.koirea-public-member-preview .v639-member-actions { grid-column: 1 / -1 !important; grid-row: 2 !important; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.koirea-public-member-preview .v639-member-actions form { min-width: 0; margin: 0; }
.koirea-public-member-preview .v639-member-actions .button { display: flex; align-items: center; justify-content: center; gap: 5px; box-sizing: border-box; width: 100%; min-width: 0; min-height: 42px; margin: 0; padding: 8px; font-size: 12px; white-space: normal; }
.koirea-public-member-preview .koirea-app-bottom-nav { position: absolute; bottom: 40px; left: 0; right: 0; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); width: auto; margin-top: 20px; padding: 10px 6px; border-top: 1px solid #e9dfe3; background: #fff; }
.koirea-public-member-preview .koirea-app-bottom-nav a { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; color: #69778f; text-decoration: none; font-size: 9px; }
.koirea-public-member-preview .koirea-app-bottom-nav a.is-active { color: var(--brand-primary); }
.koirea-public-member-preview .koirea-app-nav-icon svg { width: 24px; height: 24px; }
.koirea-public-member-preview .ui2-phone-example { position: absolute; bottom: 8px; left: 12px; right: 12px; margin: 0; color: #69778f; font-size: 10px; line-height: 1.6; }