#page-home{--ink: #26314a; --muted: #758098; --rose: #ff5f83; --paper: #fff; --wash: #fff6f8;}
#page-home *{box-sizing: border-box;}
#page-home{margin: 0px; background: linear-gradient(rgb(255, 255, 255) 0px, rgb(255, 247, 249) 38%, rgb(255, 255, 255) 100%); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", sans-serif;}
#page-home .page{width: min(100%, 720px); min-height: 100vh; margin: auto; padding-bottom: calc(96px + env(safe-area-inset-bottom));}
#page-home .hero{position: relative; aspect-ratio: 16 / 8.6; overflow: hidden; background: linear-gradient(135deg, rgb(255, 228, 235), rgb(255, 211, 223));}
#page-home .hero img{width: 100%; height: 100%; object-fit: cover;}
#page-home .hero::after{content: ""; position: absolute; inset: auto 0px 0px; height: 42%; background: linear-gradient(transparent, rgba(23, 25, 38, 0.44));}
#page-home .hero-copy{position: absolute; z-index: 1; right: 16px; bottom: 15px; left: 16px; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.28) 0px 2px 14px;}
#page-home h1{margin: 0px; font-size: clamp(23px, 6vw, 38px); letter-spacing: -0.03em;}
#page-home .hero-copy p{margin: 6px 0px 0px; font-size: 13px;}
#page-home .member-link{position: absolute; z-index: 2; top: 12px; right: 12px; padding: 8px 11px; border-radius: 999px; background: rgba(255, 255, 255, 0.92); color: rgb(215, 71, 106); font-size: 11px; font-weight: 800; text-decoration: none; backdrop-filter: blur(8px);}
#page-home .home-language{position: absolute; z-index: 2; top: 12px; left: 12px;}
#page-home .home-language summary{padding: 8px 11px; border: 1px solid rgba(255, 255, 255, 0.8); border-radius: 999px; background: rgba(255, 255, 255, 0.92); color: rgb(215, 71, 106); font-size: 11px; font-weight: 800; cursor: pointer; list-style: none; backdrop-filter: blur(8px);}
#page-home .home-language summary::-webkit-details-marker{display: none;}
#page-home .home-language-menu{display: grid; max-height: 300px; min-width: 170px; overflow: auto; margin-top: 7px; padding: 6px; border: 1px solid rgb(241, 230, 233); border-radius: 13px; background: rgba(255, 255, 255, 0.98); box-shadow: rgba(33, 18, 26, 0.22) 0px 16px 40px;}
#page-home .home-language-menu a{padding: 8px 10px; border-radius: 8px; color: var(--ink); font-size: 11px; text-decoration: none;}
#page-home .home-language-menu a[aria-current="true"]{background: rgb(255, 240, 244); color: rgb(215, 71, 106); font-weight: 900;}
#page-home .contact-notice{display: block; margin: 10px; padding: 13px 15px; border: 1px solid rgb(255, 208, 220); border-radius: 14px; background: linear-gradient(135deg, rgb(255, 240, 244), rgb(255, 248, 250)); box-shadow: rgba(215, 71, 106, 0.12) 0px 8px 20px; color: rgb(215, 71, 106); text-align: center; text-decoration: none; font-size: 14px; font-weight: 900; line-height: 1.5;}
#page-home .portrait-strip{overflow-x: auto; padding: 9px 0px 10px; border-bottom: 1px solid rgb(244, 231, 235); background: rgb(255, 255, 255); scrollbar-width: none; touch-action: pan-x;}
#page-home .portrait-strip::-webkit-scrollbar{display: none;}
#page-home .portrait-track{display: flex; width: max-content; gap: 7px; padding: 0px 10px;}
#page-home .portrait-thumb{display: grid; position: relative; width: 62px; flex: 0 0 62px; overflow: hidden; padding: 0px; border: 0px; border-radius: 10px; background: rgb(255, 255, 255); box-shadow: rgba(76, 31, 47, 0.12) 0px 3px 10px; cursor: pointer; scroll-snap-align: start; grid-template-rows: 82px auto;}
#page-home .portrait-thumb img{width: 100%; height: 82px; object-fit: cover;}
#page-home .portrait-thumb span{position: static; overflow: hidden; padding: 4px 3px; background: rgb(255, 255, 255); color: rgb(215, 71, 106); font-size: 9px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap;}
#page-home .grid{display: grid; grid-auto-rows: 1fr; grid-template-columns: repeat(2, minmax(0px, 1fr)); align-items: stretch; gap: 8px; padding: 10px;}
#page-home .card{display: flex; min-width: 0px; height: 100%; overflow: hidden; flex-direction: column; border: 1px solid rgb(241, 230, 233); border-radius: 16px; background: var(--paper); box-shadow: rgba(99, 47, 64, 0.07) 0px 8px 22px;}
#page-home .photo{position: relative; width: 100%; overflow: hidden; aspect-ratio: 4 / 5; padding: 0px; border: 0px; background: rgb(247, 237, 240); cursor: pointer;}
#page-home .photo:focus-visible{outline: 3px solid var(--rose); outline-offset: -3px;}
#page-home .photo img{width: 100%; height: 100%; object-fit: cover;}
#page-home .distance{position: absolute; bottom: 8px; left: 8px; padding: 5px 7px; border-radius: 999px; background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(8px); font-size: 10px; font-weight: 700;}
#page-home .content{display: flex; min-height: 0px; flex: 1 1 0%; flex-direction: column; gap: 9px; padding: 10px;}
#page-home .card-head{display: flex; align-items: center; justify-content: space-between; gap: 6px;}
#page-home .name{min-width: 0px; margin: 0px; font-size: 17px;}
#page-home .like{display: flex; min-height: 32px; flex: 0 0 auto; align-items: center; gap: 4px; padding: 5px 8px; border: 0px; border-radius: 999px; background: rgb(255, 240, 244); color: rgb(215, 71, 106); font-size: 11px; font-weight: 800; cursor: pointer;}
#page-home .like .heart{font-size: 16px; line-height: 1;}
#page-home .like.is-liked{background: rgb(255, 95, 131); color: rgb(255, 255, 255);}
#page-home .like:disabled{cursor: wait; opacity: 0.7;}
#page-home .tags{display: flex; flex-wrap: wrap; gap: 4px;}
#page-home .tag{padding: 4px 6px; border-radius: 999px; background: var(--wash); color: rgb(215, 71, 106); font-size: 9px; font-weight: 700;}
#page-home .facts{display: grid; grid-template-columns: 1fr; gap: 6px; margin: 0px; font-size: 10px; color: var(--muted);}
#page-home .facts b{display: block; color: var(--ink); font-size: 12px;}
#page-home .intro{margin: 0px; color: rgb(95, 104, 124); font-size: 11px; line-height: 1.5;}
#page-home .detail{width: 100%; min-height: 42px; margin-top: auto; padding: 9px 4px; border: 0px; border-radius: 11px; background: rgb(255, 240, 244); color: rgb(215, 71, 106); font-size: 12px; font-weight: 800; cursor: pointer;}
#page-home .bar{position: fixed; z-index: 10; bottom: 0px; left: 50%; width: min(100%, 720px); transform: translateX(-50%); padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(50, 31, 40, 0.08); background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(18px);}
#page-home .cta{display: flex; align-items: center; justify-content: center; min-height: 54px; border-radius: 16px; background: linear-gradient(135deg, rgb(255, 102, 136), rgb(255, 70, 112)); box-shadow: rgba(255, 70, 112, 0.28) 0px 13px 26px; color: rgb(255, 255, 255); text-align: center; text-decoration: none; font-size: 16px; font-weight: 800;}
#page-home .empty{grid-column: 1 / -1; padding: 60px 20px; text-align: center; color: var(--muted);}
#page-home dialog{width: min(680px, 100% - 20px); max-height: 92vh; padding: 0px; border: 0px; border-radius: 20px; box-shadow: rgba(33, 18, 26, 0.35) 0px 25px 80px;}
#page-home dialog::backdrop{background: rgba(18, 14, 20, 0.72); backdrop-filter: blur(5px);}
#page-home .modal-head{display: flex; align-items: center; justify-content: space-between; padding: 16px;}
#page-home .modal-head h2{margin: 0px;}
#page-home .close{width: 38px; height: 38px; border: 0px; border-radius: 50%; background: rgb(244, 244, 246); font-size: 20px; cursor: pointer;}
#page-home .gallery{display: grid; grid-template-columns: 1fr; gap: 8px; padding: 0px 12px 12px;}
#page-home .gallery a{display: block;}
#page-home .gallery img,#page-home .gallery video{display: block; width: 100%; aspect-ratio: 4 / 5; border-radius: 14px; background: rgb(17, 17, 17); object-fit: cover;}
#page-home .modal-body{padding: 0px 16px 18px;}
#page-home .modal-body .cta{margin-top: 18px;}
#page-home .modal-empty{padding: 30px; text-align: center; color: var(--muted);}
@media (min-width: 600px) {#page-home .hero-copy{right: 24px; bottom: 20px; left: 24px;}
#page-home .hero-copy p{font-size: 14px;}
#page-home .portrait-thumb{width: 72px; flex-basis: 72px;}
#page-home .grid{gap: 14px; padding: 18px;}
#page-home .card{border-radius: 22px;}
#page-home .content{gap: 11px; padding: 13px 13px 15px;}
#page-home .name{font-size: 18px;}
#page-home .tag{font-size: 10px;}
#page-home .facts{grid-template-columns: 1fr 1fr; font-size: 11px;}
#page-home .detail{font-size: 13px;}
#page-home .gallery{grid-template-columns: repeat(2, minmax(0px, 1fr)); padding: 0px 16px 16px;}
#page-home .bar{padding: 13px 18px calc(13px + env(safe-area-inset-bottom));}}
@media (max-width: 350px) {#page-home .grid{gap: 6px; padding: 7px;}
#page-home .content{padding: 8px;}
#page-home .name{font-size: 15px;}
#page-home .detail{font-size: 11px;}
#page-home .portrait-thumb{width: 56px; flex-basis: 56px;}}
#page-home .hero-action{display: inline-flex; min-height: 44px; align-items: center; justify-content: center; margin-top: 14px; padding: 0px 22px; border-radius: 999px; background: rgb(255, 255, 255); color: rgb(200, 61, 99); font-weight: 900; text-decoration: none;}
#page-home .online-indicator{white-space: nowrap; font-weight: 800;}
#page-home .online-indicator b{color: rgb(237, 45, 99); font-variant-numeric: tabular-nums;}
#page-home .persona-interactions{display: flex; flex-wrap: wrap; gap: 5px; color: rgb(215, 71, 106); font-size: 10px; font-weight: 800;}
#page-home .persona-interactions span{padding: 3px 5px; border-radius: 999px; background: rgb(255, 240, 244);}
#page-home .listing-pagination{display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0px 10px 18px; padding: 12px; border: 1px solid rgb(241, 230, 233); border-radius: 14px; background: rgb(255, 255, 255); color: rgb(95, 104, 124); font-size: 12px; font-weight: 800;}
#page-home .listing-next{border: 0px; background: transparent; color: rgb(215, 71, 106); font-style: inherit; font-variant: inherit; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 800; cursor: pointer;}
#page-home .listing-next-dialog{width: min(420px, 100% - 28px); border: 0px; border-radius: 18px; box-shadow: rgba(33, 18, 26, 0.35) 0px 25px 80px;}
#page-home .listing-next-dialog::backdrop{background: rgba(18, 14, 20, 0.72); backdrop-filter: blur(5px);}
#page-home .is-disabled{cursor: not-allowed; opacity: 0.62;}
#page-home .portrait-thumb{min-height: 82px; text-decoration: none;}
#page-home .portrait-thumb:focus-visible,#page-home .site-nav-item:focus-visible,#page-home .hero-action:focus-visible,#page-home .detail:focus-visible,#page-home .like:focus-visible,#page-home .close:focus-visible,#page-home .listing-next:focus-visible{outline: 3px solid var(--rose); outline-offset: 2px;}
#page-home .site-nav{display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); padding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);}
#page-home .site-nav--five{grid-template-columns: repeat(5, minmax(0px, 1fr));}
#page-home .site-nav-item{display: grid; min-width: 0px; height: 78px; place-items: center; padding: 7px 2px; color: rgb(142, 113, 128); font-size: 11px; text-align: center; text-decoration: none;}
#page-home .site-nav-item span{font-size: 26px;}
#page-home .site-nav-item .support-icon{font-size: 29px;}
#page-home .site-nav-item b{overflow: hidden; max-width: 100%; text-overflow: ellipsis; white-space: nowrap;}
#page-home .site-nav-item.is-active{background: linear-gradient(135deg,#f45483,#ff9aaf); color: rgb(255, 255, 255);}
#page-home dialog{overflow: auto;}
@media (max-width: 340px) {#page-home .site-nav-item{font-size: 9px;}
#page-home .site-nav-item span{font-size: 22px;}
#page-home .site-nav-item .support-icon{font-size: 24px;}}
#page-home,#page-home{max-width: 100%; overflow-x: hidden;}
#page-home .member-link{max-width: 46%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#page-home .name{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#page-home .like{min-width: 0px; max-width: 48%; overflow: hidden;}
#page-home .tag,#page-home .facts b,#page-home .intro,#page-home .contact-notice,#page-home .cta,#page-home .modal-head h2{min-width: 0px; max-width: 100%; overflow-wrap: anywhere; word-break: break-word;}
#page-home .gallery img,#page-home .gallery video{max-width: 100%;}
#page-home .site-nav-item .support-icon{font-size: 29px;}
#page-home .site-nav-item .support-icon + b{font-size: 12px;}
@media (max-width: 340px) {#page-home .site-nav-item .support-icon{font-size: 24px;}
#page-home .site-nav-item .support-icon + b{font-size: 10px;}}
#page-home .facts--core{grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 4px;}
#page-home .facts--core > span{min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#page-home .facts--measurement{grid-template-columns: 1fr; margin-top: -2px;}
#page-home .facts--measurement > span{min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#page-home .persona-interactions{flex-wrap: nowrap; gap: 3px;}
#page-home .persona-interactions button{display: inline-flex; min-width: 0px; min-height: 26px; flex: 1 1 0px; align-items: center; justify-content: center; gap: 2px; padding: 2px 4px; border: 0px; border-radius: 999px; background: rgb(255, 240, 244); color: rgb(215, 71, 106); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 9px; font-weight: 800; cursor: pointer;}
#page-home .persona-interactions button:disabled{cursor: wait; opacity: 0.65;}
#page-home .persona-interactions button.is-interacted{background: rgb(215, 71, 106); color: rgb(255, 255, 255); cursor: default; opacity: 1;}
#page-home .persona-interactions button.interaction-error{outline: rgb(215, 71, 106) solid 2px; outline-offset: 1px;}
#page-home .persona-interactions button:focus-visible{outline: 3px solid var(--rose); outline-offset: 2px;}
@media (max-width: 767px) {#page-home input,#page-home select,#page-home textarea{font-size: 16px !important;}}
#page-home .site-nav{grid-template-columns: repeat(4, minmax(0px, 1fr));}
#page-home .site-nav--five{grid-template-columns: repeat(5, minmax(0px, 1fr));}
#page-home .site-nav-item{height: 60px; min-height: 60px; align-content: center; gap: 2px; font-size: 9px; line-height: 1.1;}
#page-home .site-nav-item span{font-size: 18px; line-height: 1;}
#page-home .site-nav-item .support-icon{font-size: 19px;}
#page-home .site-nav-item .support-icon + b{font-size: 9px; line-height: 1.1;}
#page-home .site-nav-item{height: 48px; min-height: 48px; padding: 3px 2px; gap: 1px; font-size: 8px;}
#page-home .site-nav-item span{font-size: 16px;}
#page-home .site-nav-item .support-icon{font-size: 17px;}
#page-home .site-nav-item .support-icon + b{font-size: 8px;}