.suniva-life {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 42px 0 100px;
    color: #17384d;
}

.suniva-life__back {
    display: inline-block;
    margin-bottom: 24px;
    color: #687b87;
    text-decoration: none;
}

.suniva-life__hero {
    padding: clamp(54px, 9vw, 110px);
    border-radius: 38px;
    text-align: center;
    background:
        radial-gradient(circle at 80% 10%, #ffe4ed, transparent 34%),
        radial-gradient(circle at 10% 90%, #dceeff, transparent 38%),
        linear-gradient(135deg, #fffdf8, #fff7e8);
}

.suniva-life__hero > span {
    color: #bd8622;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .22em;
}

.suniva-life__hero h1 {
    margin: 20px 0;
    font-family: serif;
    font-size: clamp(32px, 6vw, 64px);
    font-weight: 500;
    line-height: 1.4;
}

.suniva-life__hero p {
    color: #758692;
    line-height: 2;
}

.suniva-life__hero a,
.suniva-life-empty a {
    display: inline-flex;
    margin-top: 24px;
    padding: 15px 30px;
    border-radius: 999px;
    background: linear-gradient(135deg, #ddb14a, #bd8120);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.suniva-life-post {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr);
    gap: 54px;
    margin-top: 54px;
    align-items: start;
}

.suniva-life-post__image {
    margin: 0;
}

.suniva-life-post__image img {
    display: block;
    width: 100%;
    border-radius: 30px;
    box-shadow: 0 24px 60px rgba(24, 56, 77, .13);
}

.suniva-life-post__form {
    padding: 38px;
    border: 1px solid #eee3cf;
    border-radius: 30px;
    background: #fff;
}

.suniva-life-post__author,
.suniva-life-story__author {
    display: flex;
    align-items: center;
    gap: 14px;
}

.suniva-life-post__author {
    margin-bottom: 28px;
}

.suniva-life-post__author img,
.suniva-life-story__author img,
.suniva-life-post__author > span,
.suniva-life-story__author > span {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
}

.suniva-life-post__author > span,
.suniva-life-story__author > span {
    display: grid;
    place-items: center;
    background: #fff4d8;
    font-size: 24px;
}

.suniva-life-post__author small,
.suniva-life-story__author time {
    display: block;
    color: #91a0a9;
    font-size: 11px;
}

.suniva-life-post label {
    display: block;
    margin: 20px 0 9px;
    font-weight: 700;
}

.suniva-life-post input,
.suniva-life-post textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 15px 16px;
    border: 1px solid #d9e0e4;
    border-radius: 14px;
    font: inherit;
}

.suniva-life-post textarea {
    resize: vertical;
    line-height: 1.8;
}

.suniva-life-post__notice {
    color: #8b7650;
    font-size: 12px;
}

.suniva-life-post button {
    width: 100%;
    margin-top: 16px;
    padding: 17px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, #ddb14a, #bd8120);
    color: #fff;
    font-weight: 700;
    cursor: pointer;
}

.suniva-life__alert {
    margin: 24px 0;
    padding: 16px 20px;
    border-radius: 14px;
}

.suniva-life__alert.is-success {
    background: #e0f7eb;
    color: #17603f;
}

.suniva-life__alert.is-error {
    background: #fff0f0;
    color: #9d3333;
}

.suniva-life-feed {
    width: min(760px, 100%);
    margin: 64px auto 0;
}

.suniva-life-story {
    margin-bottom: 70px;
}

.suniva-life-story__author {
    margin-bottom: 16px;
}

.suniva-life-story__image {
    display: block;
    width: 100%;
    border-radius: 30px;
}

.suniva-life-story__copy {
    padding: 24px 8px 0;
}

.suniva-life-story__copy h2 {
    margin: 0 0 12px;
    font-family: serif;
    font-size: 28px;
    font-weight: 500;
}

.suniva-life-story__copy p {
    color: #617681;
    line-height: 1.9;
}

.suniva-life-empty {
    padding: 90px 20px;
    text-align: center;
}

.suniva-life-empty > span {
    font-size: 46px;
}

.suniva-life-empty h2 {
    font-family: serif;
    font-weight: 500;
}

.suniva-life-post-link {
    display: inline-flex !important;
    margin-top: 10px;
    padding: 11px 18px;
    border-radius: 999px;
    background: #17384d;
    color: #fff !important;
    font-weight: 700;
    text-decoration: none !important;
}

@media (max-width: 767px) {
    .suniva-life {
        width: min(100% - 24px, 1180px);
        padding-top: 20px;
    }

    .suniva-life__hero {
        padding: 54px 22px;
        border-radius: 28px;
    }

    .suniva-life-post {
        grid-template-columns: 1fr;
        gap: 28px;
        margin-top: 30px;
    }

    .suniva-life-post__form {
        padding: 24px 18px;
    }

    .suniva-life-story__image,
    .suniva-life-post__image img {
        border-radius: 22px;
    }
}

.suniva-life-post-link.is-published {
    background: #e0f7eb;
    color: #17603f !important;
    box-shadow: inset 0 0 0 1px rgba(23, 96, 63, .14);
}

.suniva-life-post__ai-note {
    margin: 10px 0 0;
    color: #8b7650;
    font-size: 12px;
    line-height: 1.7;
}

.suniva-life-story__hashtags {
    color: #bd8622 !important;
    font-weight: 700;
    word-spacing: .3em;
}

/* SUNIVA LIFE Instagram-style grid 2026-07-28 */

.suniva-life--timeline {
    width: min(1180px, calc(100% - 32px));
}

.suniva-life--timeline .suniva-life__hero {
    margin-bottom: 32px;
    padding: clamp(42px, 6vw, 76px);
}

.suniva-life-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
    width: 100%;
}

.suniva-life-grid__item {
    position: relative;
    display: block;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #eef1f2;
    color: #fff;
    text-decoration: none;
}

.suniva-life-grid__item:first-child {
    border-top-left-radius: 22px;
}

.suniva-life-grid__item:nth-child(3) {
    border-top-right-radius: 22px;
}

.suniva-life-grid__item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition:
        transform .35s ease,
        filter .35s ease;
}

.suniva-life-grid__overlay {
    position: absolute;
    inset: auto 0 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 40px 16px 14px;
    opacity: 0;
    background:
        linear-gradient(
            transparent,
            rgba(11, 37, 53, .82)
        );
    transition: opacity .25s ease;
}

.suniva-life-grid__overlay strong {
    overflow: hidden;
    font-size: 15px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.suniva-life-grid__overlay small {
    color: rgba(255, 255, 255, .82);
}

.suniva-life-grid__item:hover img,
.suniva-life-grid__item:focus-visible img {
    transform: scale(1.035);
    filter: brightness(.82);
}

.suniva-life-grid__item:hover
.suniva-life-grid__overlay,
.suniva-life-grid__item:focus-visible
.suniva-life-grid__overlay {
    opacity: 1;
}

.suniva-life--detail {
    width: min(1180px, calc(100% - 32px));
}

.suniva-life-detail {
    display: grid;
    grid-template-columns:
        minmax(0, 1.3fr)
        minmax(340px, .7fr);
    overflow: hidden;
    border: 1px solid #ebe3d6;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(23, 56, 77, .09);
}

.suniva-life-detail__visual {
    display: grid;
    min-height: 640px;
    margin: 0;
    place-items: center;
    background: #f3f4f4;
}

.suniva-life-detail__visual img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: 820px;
    object-fit: contain;
}

.suniva-life-detail__content {
    display: flex;
    flex-direction: column;
    padding: 34px;
}

.suniva-life-detail__author {
    display: flex;
    gap: 13px;
    align-items: center;
    padding-bottom: 22px;
    border-bottom: 1px solid #eee7dc;
}

.suniva-life-detail__author img,
.suniva-life-detail__author > span {
    display: grid;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    overflow: hidden;
    border-radius: 50%;
    place-items: center;
    background: #fff6df;
    object-fit: cover;
}

.suniva-life-detail__author div {
    display: flex;
    flex-direction: column;
}

.suniva-life-detail__author strong {
    color: #17384d;
    font-size: 16px;
}

.suniva-life-detail__author time {
    margin-top: 3px;
    color: #8796a0;
    font-size: 12px;
}

.suniva-life-detail__copy {
    flex: 1;
    padding: 28px 0;
}

.suniva-life-detail__copy h1 {
    margin: 0 0 18px;
    color: #17384d;
    font-family: serif;
    font-size: clamp(25px, 3vw, 36px);
    font-weight: 500;
}

.suniva-life-detail__copy p {
    margin: 0;
    color: #526976;
    font-size: 15px;
    line-height: 2;
}

.suniva-life-detail__tags {
    margin-top: 22px;
    color: #2e7191;
    font-size: 14px;
    line-height: 1.9;
}

.suniva-life-detail__create {
    display: flex;
    justify-content: center;
    padding: 15px 22px;
    border-radius: 999px;
    background:
        linear-gradient(135deg, #ddb14a, #bd8120);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

@media (max-width: 767px) {
    .suniva-life--timeline,
    .suniva-life--detail {
        width: 100%;
        padding-top: 16px;
    }

    .suniva-life--timeline .suniva-life__hero {
        width: calc(100% - 24px);
        margin-right: auto;
        margin-bottom: 18px;
        margin-left: auto;
        padding: 35px 18px;
        border-radius: 24px;
    }

    .suniva-life--timeline .suniva-life__hero h1 {
        font-size: 29px;
    }

    .suniva-life--timeline .suniva-life__alert {
        width: calc(100% - 24px);
        margin-right: auto;
        margin-left: auto;
    }

    .suniva-life-grid {
        gap: 2px;
    }

    .suniva-life-grid__item:first-child,
    .suniva-life-grid__item:nth-child(3) {
        border-radius: 0;
    }

    .suniva-life-grid__overlay {
        display: none;
    }

    .suniva-life--detail .suniva-life__back {
        margin-left: 16px;
    }

    .suniva-life-detail {
        display: block;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .suniva-life-detail__visual {
        min-height: 0;
    }

    .suniva-life-detail__visual img {
        width: 100%;
        height: auto;
        max-height: none;
    }

    .suniva-life-detail__content {
        padding: 22px 18px 34px;
    }
}

@media (hover: none) {
    .suniva-life-grid__overlay {
        display: none;
    }
}

/* LIFE fixed navigation and SUN reaction */

.suniva-life-page {
    padding-bottom: 92px;
}

.suniva-life__alert.is-sun {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid #efd28d;
    background: linear-gradient(135deg, #fff9e8, #fff2c8);
    color: #795515;
}

.suniva-life-detail__actions {
    display: flex;
    gap: 14px;
    align-items: center;
    padding: 20px 0;
    border-bottom: 1px solid #eee7dc;
}

.suniva-life-detail__actions form {
    margin: 0;
}

.suniva-life-like {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    padding: 10px 18px;
    border: 0;
    border-radius: 999px;
    background: #fff0f4;
    color: #d84f78;
    font: inherit;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}

.suniva-life-like.is-liked {
    background: #e4f7ea;
    color: #248251;
}

.suniva-life-like.is-disabled {
    background: #f0f1f2;
    color: #8a969d;
}

.suniva-life-like-count {
    color: #536c79;
    font-size: 14px;
}

.suniva-life-nav {
    position: fixed;
    z-index: 1000;
    right: 50%;
    bottom: max(12px, env(safe-area-inset-bottom));
    display: grid;
    width: min(620px, calc(100% - 24px));
    grid-template-columns: repeat(5, 1fr);
    padding: 9px 14px;
    transform: translateX(50%);
    border: 1px solid rgba(213, 199, 174, .75);
    border-radius: 28px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 48px rgba(23, 56, 77, .18);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.suniva-life-nav__item {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
    align-items: center;
    justify-content: center;
    color: #6c7c85;
    text-decoration: none;
}

.suniva-life-nav__item > span {
    font-size: 25px;
    line-height: 1;
}

.suniva-life-nav__item > small {
    overflow: hidden;
    max-width: 100%;
    font-size: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.suniva-life-nav__item.is-active {
    color: #23936a;
}

.suniva-life-nav__item.is-create > span {
    display: grid;
    width: 49px;
    height: 49px;
    margin-top: -24px;
    border-radius: 50%;
    place-items: center;
    background: linear-gradient(135deg, #e2b64d, #bd811e);
    color: #fff;
    box-shadow: 0 10px 25px rgba(189, 129, 30, .32);
}

.suniva-life-nav__item.is-create > small {
    color: #8a661d;
}

@media (max-width: 767px) {
    .suniva-life-page {
        padding-bottom: 82px;
    }

    .suniva-life__alert.is-sun {
        display: block;
        margin-right: 12px;
        margin-left: 12px;
    }

    .suniva-life__alert.is-sun strong {
        display: block;
        margin-top: 5px;
    }

    .suniva-life-nav {
        bottom: max(7px, env(safe-area-inset-bottom));
        width: calc(100% - 14px);
        padding: 9px 7px;
        border-radius: 24px;
    }

    .suniva-life-nav__item > span {
        font-size: 23px;
    }

    .suniva-life-nav__item.is-create > span {
        width: 47px;
        height: 47px;
    }

    .suniva-life-detail__actions {
        flex-wrap: wrap;
    }
}

/* ===== SUNIVA LIFE post edit 20260728 ===== */

.suniva-life__alert.is-success {
    border: 1px solid #a9dcc1;
    background: linear-gradient(135deg, #effbf4, #e2f7eb);
    color: #246d4a;
}

.suniva-life-edit-button {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    padding: 10px 18px;
    border: 1px solid #dcc28a;
    border-radius: 999px;
    background: linear-gradient(135deg, #fffdf7, #fff5dc);
    color: #8a621d;
    font-weight: 700;
    text-decoration: none;
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}

.suniva-life-edit-button:hover {
    transform: translateY(-1px);
    background: #fff8e6;
    color: #795313;
    box-shadow: 0 8px 20px rgba(143, 99, 24, .14);
}

.suniva-life--edit {
    max-width: 1180px;
    margin: 0 auto;
}

.suniva-life-edit__hero {
    max-width: 820px;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.suniva-life-edit__visibility {
    display: grid;
    gap: 12px;
    margin: 28px 0 0;
    padding: 0;
    border: 0;
}

.suniva-life-edit__visibility legend {
    margin-bottom: 10px;
    color: #314c59;
    font-weight: 700;
}

.suniva-life-edit__visibility label {
    display: flex;
    gap: 13px;
    align-items: flex-start;
    padding: 17px 18px;
    border: 1px solid #e5ddd0;
    border-radius: 18px;
    background: #fff;
    cursor: pointer;
    transition:
        border-color .2s ease,
        background .2s ease,
        box-shadow .2s ease;
}

.suniva-life-edit__visibility label:has(input:checked) {
    border-color: #d6ae55;
    background: #fffbf1;
    box-shadow: 0 8px 24px rgba(164, 119, 32, .10);
}

.suniva-life-edit__visibility input {
    width: 20px;
    height: 20px;
    margin: 2px 0 0;
    accent-color: #c28d2f;
}

.suniva-life-edit__visibility span {
    display: grid;
    gap: 3px;
}

.suniva-life-edit__visibility strong {
    color: #314c59;
}

.suniva-life-edit__visibility small {
    color: #798991;
    line-height: 1.6;
}

.suniva-life-edit__note {
    margin: 24px 0;
    padding: 18px 20px;
    border-radius: 18px;
    background: linear-gradient(135deg, #f7fbff, #f3f8f6);
    color: #536c79;
}

.suniva-life-edit__note strong {
    display: block;
    margin-bottom: 5px;
    color: #2d6f5b;
}

.suniva-life-edit__note p {
    margin: 0;
    line-height: 1.7;
}

@media (max-width: 767px) {
    .suniva-life-edit__hero {
        margin-right: 12px;
        margin-left: 12px;
    }

    .suniva-life-edit__hero h1 {
        font-size: 28px;
    }

    .suniva-life-edit__visibility label {
        padding: 15px;
    }

    .suniva-life-edit-button {
        min-height: 42px;
        padding: 9px 15px;
    }
}

/* ===== LIFE direct media post 20260728 ===== */

.suniva-life--create-menu,
.suniva-life--direct {
    max-width: 1120px;
    margin: 0 auto;
}

.suniva-life-create-menu {
    display: grid;
    max-width: 920px;
    gap: 18px;
    margin: 38px auto 90px;
}

.suniva-life-create-choice {
    display: grid;
    grid-template-columns: 72px 1fr auto;
    gap: 24px;
    align-items: center;
    padding: 30px 34px;
    border: 1px solid #e7dcc7;
    border-radius: 28px;
    background: rgba(255, 255, 255, .94);
    color: #294653;
    text-decoration: none;
    box-shadow: 0 18px 55px rgba(42, 65, 76, .08);
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}

a.suniva-life-create-choice:hover {
    transform: translateY(-3px);
    border-color: #d9bd7d;
    color: #294653;
    box-shadow: 0 24px 65px rgba(42, 65, 76, .14);
}

.suniva-life-create-choice__icon {
    display: grid;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    place-items: center;
    background: linear-gradient(135deg, #fff7dc, #eed28f);
    color: #9b6d16;
    font-size: 31px;
}

.suniva-life-create-choice small {
    color: #b0842b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
}

.suniva-life-create-choice h2 {
    margin: 5px 0 8px;
    color: #294653;
    font-size: 24px;
}

.suniva-life-create-choice p {
    margin: 0;
    color: #71838c;
    line-height: 1.8;
}

.suniva-life-create-choice > strong {
    color: #b78728;
    font-size: 25px;
}

.suniva-life-create-choice.is-ai {
    background: linear-gradient(135deg, #fff, #fff8eb);
}

.suniva-life-create-choice.is-world {
    background: linear-gradient(135deg, #f7fbfc, #f4f7f4);
}

.suniva-life-create-choice.is-coming {
    opacity: .72;
}

.suniva-life-create-choice em {
    padding: 7px 12px;
    border-radius: 999px;
    background: #e7eeec;
    color: #668078;
    font-size: 12px;
    font-style: normal;
    white-space: nowrap;
}

.suniva-life-direct {
    max-width: 920px;
    margin: 35px auto 100px;
    padding: 38px;
    border: 1px solid #e8decd;
    border-radius: 32px;
    background: #fff;
    box-shadow: 0 20px 65px rgba(38, 63, 75, .10);
}

.suniva-life-direct__author {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-bottom: 28px;
}

.suniva-life-direct__author img,
.suniva-life-direct__author > span {
    display: grid;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    object-fit: cover;
    place-items: center;
    background: #fff7e5;
    font-size: 26px;
}

.suniva-life-direct__author div {
    display: grid;
}

.suniva-life-direct__author small {
    color: #91a0a6;
}

.suniva-life-direct__author strong {
    color: #294653;
    font-size: 18px;
}

.suniva-life-upload__picker {
    display: grid;
    min-height: 210px;
    padding: 28px;
    border: 2px dashed #d9c18f;
    border-radius: 26px;
    place-items: center;
    align-content: center;
    background: linear-gradient(135deg, #fffdf8, #f7fbfb);
    color: #536c79;
    text-align: center;
    cursor: pointer;
}

.suniva-life-upload__picker > span {
    display: grid;
    width: 60px;
    height: 60px;
    margin-bottom: 12px;
    border-radius: 50%;
    place-items: center;
    background: linear-gradient(135deg, #e8bc54, #c78a25);
    color: #fff;
    font-size: 34px;
}

.suniva-life-upload__picker strong {
    font-size: 19px;
}

.suniva-life-upload__picker small {
    margin-top: 6px;
    color: #8a999f;
}

#suniva-life-media {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.suniva-life-upload__status {
    margin: 14px 0;
    color: #637983;
    text-align: center;
}

.suniva-life-upload__status.is-error {
    color: #c94e5f;
    font-weight: 700;
}

.suniva-life-upload__preview {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.suniva-life-upload-card {
    position: relative;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 19px;
    background: #f2f4f3;
    cursor: grab;
}

.suniva-life-upload-card.is-cover {
    border-color: #d8a83e;
    box-shadow: 0 0 0 3px rgba(216, 168, 62, .16);
}

.suniva-life-upload-card.is-dragging {
    opacity: .45;
}

.suniva-life-upload-card img,
.suniva-life-upload-card video {
    display: block;
    width: 100%;
    aspect-ratio: 1;
    background: #e8edeb;
    object-fit: cover;
}

.suniva-life-upload-card__order,
.suniva-life-upload-card__type,
.suniva-life-upload-card__remove {
    position: absolute;
    top: 9px;
    display: grid;
    min-width: 29px;
    height: 29px;
    border: 0;
    border-radius: 999px;
    place-items: center;
}

.suniva-life-upload-card__order {
    left: 9px;
    background: rgba(255, 255, 255, .92);
    color: #294653;
    font-weight: 700;
}

.suniva-life-upload-card__type {
    left: 45px;
    padding: 0 9px;
    background: rgba(41, 70, 83, .82);
    color: #fff;
    font-size: 11px;
}

.suniva-life-upload-card__remove {
    right: 9px;
    background: rgba(255, 255, 255, .92);
    color: #c34f60;
    font-size: 20px;
    cursor: pointer;
}

.suniva-life-upload-card__footer {
    display: grid;
    gap: 7px;
    padding: 10px;
}

.suniva-life-upload-card__footer small {
    overflow: hidden;
    color: # cursor: pointer;
}

.suniva-life-upload-card__footer {
    display: grid;
   71838c;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.suniva-life-upload-card__cover {
    padding: 7px;
    border: 0;
    border-radius: 999px;
    background: #fff3d4;
    color: #906515;
    font-weight: 700;
    cursor: pointer;
}

.suniva-life-upload__help {
    margin: 13px 0 30px;
    color: #829198;
    font-size: 13px;
    line-height: 1.7;
}

.suniva-life-direct__fields {
    display: grid;
}

.suniva-life-direct__fields > label {
    margin: 19px 0 8px;
    color: #294653;
    font-weight: 700;
}

.suniva-life-direct__fields > input,
.suniva-life-direct__fields > textarea {
    width: 100%;
    padding: 16px 18px;
    border: 1px solid #dce2e4;
    border-radius: 16px;
    background: #fff;
    color: #294653;
    font: inherit;
    box-sizing: border-box;
}

.suniva-life-direct__notice {
    margin: 24px 0;
    padding: 18px 20px;
    border-radius: 18px;
    background: linear-gradient(135deg, #fff8df, #fffdf8);
    color: #76561d;
}

.suniva-life-direct__notice p {
    margin: 5px 0 0;
    line-height: 1.7;
}

.suniva-life-direct__fields > button {
    min-height: 58px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, #e2b443, #c8871d);
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 13px 30px rgba(199, 135, 29, .24);
}

.suniva-life-direct__fields > button:disabled {
    opacity: .65;
    cursor: wait;
}

@media (max-width: 767px) {
    .suniva-life-create-menu {
        margin: 24px 12px 80px;
    }

    .suniva-life-create-choice {
        grid-template-columns: 55px 1fr;
        gap: 15px;
        padding: 22px 18px;
        border-radius: 22px;
    }

    .suniva-life-create-choice__icon {
        width: 52px;
        height: 52px;
        font-size: 25px;
    }

    .suniva-life-create-choice > strong,
    .suniva-life-create-choice > em {
        display: none;
    }

    .suniva-life-create-choice h2 {
        font-size: 20px;
    }

    .suniva-life-direct {
        margin: 20px 0 80px;
        padding: 22px 14px 32px;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .suniva-life-upload__preview {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .suniva-life-upload__picker {
        min-height: 180px;
    }
}

/* SUNIVA LIFE AI CAPTION 20260728 */
.suniva-life-ai-caption {
    max-width: 960px;
    margin: 34px auto 8px;
    padding: 32px;
    text-align: center;
    background:
        linear-gradient(
            135deg,
            rgba(238, 248, 255, 0.96) 0%,
            rgba(255, 250, 240, 0.98) 48%,
            rgba(255, 239, 244, 0.96) 100%
        );
    border: 1px solid rgba(218, 177, 91, 0.34);
    border-radius: 28px;
    box-shadow:
        0 18px 50px rgba(23, 55, 72, 0.07);
}

.suniva-life-ai-caption__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: min(100%, 520px);
    min-height: 62px;
    padding: 15px 28px;
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.02em;
    background:
        linear-gradient(
            120deg,
            #d79a23 0%,
            #ebb846 52%,
            #c88718 100%
        );
    border: 0;
    border-radius: 999px;
    box-shadow:
        0 14px 30px rgba(202, 139, 28, 0.25);
    cursor: pointer;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        opacity 0.2s ease;
}

.suniva-life-ai-caption__button:hover {
    transform: translateY(-2px);
    box-shadow:
        0 18px 38px rgba(202, 139, 28, 0.3);
}

.suniva-life-ai-caption__button:focus-visible {
    outline: 3px solid rgba(55, 159, 128, 0.28);
    outline-offset: 4px;
}

.suniva-life-ai-caption__button:disabled {
    opacity: 0.68;
    cursor: wait;
    transform: none;
}

.suniva-life-ai-caption__button.is-loading span {
    animation: suniva-life-ai-light 1.1s ease-in-out infinite;
}

.suniva-life-ai-caption__help {
    max-width: 620px;
    margin: 15px auto 0;
    color: #71858f;
    font-size: 13px;
    line-height: 1.85;
}

.suniva-life-ai-caption__status {
    min-height: 24px;
    margin: 12px auto 0;
    color: #48616d;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
}

.suniva-life-ai-caption__status.is-success {
    color: #278160;
}

.suniva-life-ai-caption__status.is-error {
    color: #b14e4e;
}

@keyframes suniva-life-ai-light {
    0%,
    100% {
        opacity: 0.55;
        transform: scale(0.9);
    }

    50% {
        opacity: 1;
        transform: scale(1.2);
    }
}

@media (max-width: 767px) {
    .suniva-life-ai-caption {
        margin: 24px 0 6px;
        padding: 24px 16px;
        border-radius: 22px;
    }

    .suniva-life-ai-caption__button {
        min-height: 58px;
        padding: 14px 18px;
        font-size: 15px;
    }

    .suniva-life-ai-caption__help {
        font-size: 12px;
        line-height: 1.75;
    }

    .suniva-life-ai-caption__status {
        font-size: 13px;
    }
}

/* SUNIVA LIFE CAROUSEL 20260728 */
.suniva-life-carousel {
    position: relative;
    min-width: 0;
    min-height: 640px;
    overflow: hidden;
    background:
        linear-gradient(
            145deg,
            #f5f6f6 0%,
            #ecefef 100%
        );
}

.suniva-life-carousel__viewport {
    width: 100%;
    height: 100%;
    min-height: 640px;
    overflow: hidden;
    touch-action: pan-y pinch-zoom;
}

.suniva-life-carousel__track {
    display: flex;
    width: 100%;
    min-height: 640px;
    transition:
        transform 0.38s cubic-bezier(
            0.22,
            0.61,
            0.36,
            1
        );
    will-change: transform;
}

.suniva-life-carousel__track.is-no-animation {
    transition: none;
}

.suniva-life-carousel__slide {
    display: grid;
    width: 100%;
    min-width: 100%;
    min-height: 640px;
    margin: 0;
    place-items: center;
    background: #f3f4f4;
}

.suniva-life-carousel__slide img,
.suniva-life-carousel__slide video {
    display: block;
    width: 100%;
    height: 100%;
    max-height: 820px;
    object-fit: contain;
    background: #eef0f0;
}

.suniva-life-carousel__slide video {
    outline: none;
}

.suniva-life-carousel__arrow {
    position: absolute;
    z-index: 4;
    top: 50%;
    display: grid;
    width: 48px;
    height: 48px;
    padding: 0 0 5px;
    color: #17384d;
    font-family: Arial, sans-serif;
    font-size: 42px;
    font-weight: 300;
    line-height: 1;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(218, 177, 91, 0.35);
    border-radius: 50%;
    box-shadow:
        0 10px 28px rgba(23, 56, 77, 0.17);
    place-items: center;
    cursor: pointer;
    transform: translateY(-50%);
    transition:
        background 0.2s ease,
        transform 0.2s ease;
    backdrop-filter: blur(8px);
}

.suniva-life-carousel__arrow:hover {
    background: #fff;
}

.suniva-life-carousel__arrow:focus-visible {
    outline: 3px solid rgba(218, 167, 56, 0.45);
    outline-offset: 3px;
}

.suniva-life-carousel__arrow.is-prev {
    left: 18px;
}

.suniva-life-carousel__arrow.is-next {
    right: 18px;
}

.suniva-life-carousel__counter {
    position: absolute;
    z-index: 4;
    top: 18px;
    right: 18px;
    display: inline-flex;
    gap: 5px;
    align-items: center;
    min-width: 60px;
    padding: 8px 13px;
    color: #fff;
    font-size: 13px;
    background: rgba(15, 42, 57, 0.7);
    border-radius: 999px;
    justify-content: center;
    backdrop-filter: blur(8px);
}

.suniva-life-carousel__dots {
    position: absolute;
    z-index: 4;
    bottom: 22px;
    left: 50%;
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 8px 12px;
    background: rgba(255, 255, 255, 0.78);
    border-radius: 999px;
    transform: translateX(-50%);
    backdrop-filter: blur(8px);
}

.suniva-life-carousel__dot {
    width: 8px;
    height: 8px;
    padding: 0;
    background: #a8b3b8;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    transition:
        width 0.2s ease,
        background 0.2s ease;
}

.suniva-life-carousel__dot.is-active {
    width: 22px;
    background:
        linear-gradient(
            90deg,
            #e2ad32,
            #c98b1f
        );
    border-radius: 999px;
}

.suniva-life-carousel__swipe {
    display: none;
}

@media (max-width: 767px) {
    .suniva-life-detail {
        grid-template-columns: 1fr;
    }

    .suniva-life-carousel,
    .suniva-life-carousel__viewport,
    .suniva-life-carousel__track,
    .suniva-life-carousel__slide {
        min-height: auto;
    }

    .suniva-life-carousel__slide {
        aspect-ratio: 1 / 1;
    }

    .suniva-life-carousel__slide img,
    .suniva-life-carousel__slide video {
        width: 100%;
        height: 100%;
        max-height: none;
    }

    .suniva-life-carousel__arrow {
        width: 42px;
        height: 42px;
        font-size: 36px;
    }

    .suniva-life-carousel__arrow.is-prev {
        left: 10px;
    }

    .suniva-life-carousel__arrow.is-next {
        right: 10px;
    }

    .suniva-life-carousel__counter {
        top: 12px;
        right: 12px;
        padding: 7px 11px;
    }

    .suniva-life-carousel__dots {
        bottom: 14px;
    }

    .suniva-life-carousel__swipe {
        position: absolute;
        z-index: 3;
        right: 12px;
        bottom: 14px;
        display: block;
        margin: 0;
        color: rgba(23, 56, 77, 0.68);
        font-size: 9px;
        pointer-events: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .suniva-life-carousel__track {
        transition: none;
    }
}

/* SUNIVA LIFE MEDIA EDIT 20260728 */
.suniva-life-edit-media {
    width: min(1040px, 100%);
    margin: 48px auto 0;
    padding: clamp(24px, 4vw, 48px);
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #ebe3d6;
    border-radius: 32px;
    box-shadow:
        0 24px 70px rgba(23, 56, 77, 0.08);
}

.suniva-life-edit-media__author {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-bottom: 32px;
}

.suniva-life-edit-media__author img,
.suniva-life-edit-media__author > span {
    display: grid;
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    overflow: hidden;
    background: #fff5db;
    border-radius: 50%;
    place-items: center;
    object-fit: cover;
}

.suniva-life-edit-media__author small {
    display: block;
    color: #91a0a9;
    font-size: 11px;
}

.suniva-life-edit-media__author strong {
    color: #17384d;
    font-size: 17px;
}

.suniva-life-edit-media__section {
    padding: clamp(20px, 3vw, 34px);
    background:
        linear-gradient(
            135deg,
            rgba(238, 248, 255, 0.72),
            rgba(255, 250, 240, 0.82),
            rgba(255, 239, 244, 0.68)
        );
    border: 1px solid rgba(218, 177, 91, 0.32);
    border-radius: 28px;
}

.suniva-life-edit-media__heading {
    display: flex;
    gap: 20px;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 24px;
}

.suniva-life-edit-media__heading span {
    color: #c48a20;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.2em;
}

.suniva-life-edit-media__heading h2 {
    margin: 5px 0 0;
    color: #17384d;
    font-family: serif;
    font-size: clamp(25px, 3vw, 34px);
    font-weight: 500;
}

.suniva-life-edit-media__heading > strong {
    color: #7b673e;
    font-size: 14px;
    white-space: nowrap;
}

.suniva-life-edit-media__picker {
    display: flex;
    min-height: 132px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #496470;
    background: rgba(255, 255, 255, 0.78);
    border: 2px dashed rgba(211, 156, 44, 0.55);
    border-radius: 22px;
    cursor: pointer;
    transition:
        background 0.2s ease,
        border-color 0.2s ease;
}

.suniva-life-edit-media__picker:hover {
    background: #fff;
    border-color: #d39c2d;
}

.suniva-life-edit-media__picker > span {
    display: grid;
    width: 44px;
    height: 44px;
    margin-bottom: 8px;
    color: #fff;
    font-size: 30px;
    font-weight: 300;
    background:
        linear-gradient(
            135deg,
            #e5b239,
            #ca891c
        );
    border-radius: 50%;
    place-items: center;
}

.suniva-life-edit-media__picker small {
    margin-top: 5px;
    color: #91a0a9;
    font-size: 11px;
}

.suniva-life-edit-media__input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.suniva-life-edit-media__status {
    min-height: 24px;
    margin: 13px 0;
    color: #617984;
    font-size: 13px;
    text-align: center;
}

.suniva-life-edit-media__status.is-error {
    color: #ae4747;
}

.suniva-life-edit-media__list {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.suniva-life-edit-media-card {
    min-width: 0;
    overflow: hidden;
    background: #fff;
    border: 2px solid transparent;
    border-radius: 19px;
    box-shadow:
        0 12px 30px rgba(23, 56, 77, 0.09);
    cursor: grab;
    transition:
        border-color 0.2s ease,
        opacity 0.2s ease,
        transform 0.2s ease;
}

.suniva-life-edit-media-card.is-cover {
    border-color: #e1aa31;
}

.suniva-life-edit-media-card.is-dragging {
    opacity: 0.45;
    transform: scale(0.97);
}

.suniva-life-edit-media-card__preview {
    position: relative;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #edf0f1;
}

.suniva-life-edit-media-card__preview img,
.suniva-life-edit-media-card__preview video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.suniva-life-edit-media-card__order,
.suniva-life-edit-media-card__type {
    position: absolute;
    top: 9px;
    z-index: 2;
    display: grid;
    min-width: 26px;
    height: 26px;
    padding: 0 7px;
    box-sizing: border-box;
    color: #17384d;
    font-size: 10px;
    font-weight: 700;
    background: rgba(255, 255, 255, 0.91);
    border-radius: 999px;
    place-items: center;
}

.suniva-life-edit-media-card__order {
    left: 9px;
}

.suniva-life-edit-media-card__type {
    left: 42px;
}

.suniva-life-edit-media-card__remove {
    position: absolute;
    z-index: 3;
    top: 8px;
    right: 8px;
    display: grid;
    width: 29px;
    height: 29px;
    padding: 0 0 2px;
    color: #bd5c5c;
    font-size: 21px;
    line-height: 1;
    background: rgba(255, 255, 255, 0.94);
    border: 0;
    border-radius: 50%;
    place-items: center;
    cursor: pointer;
}

.suniva-life-edit-media-card__footer {
    display: flex;
    min-height: 54px;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
    padding: 9px 11px;
}

.suniva-life-edit-media-card__footer small {
    overflow: hidden;
    color: #617984;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.suniva-life-edit-media-card__footer > span {
    color: #91a0a9;
    font-size: 10px;
}

.suniva-life-edit-media-card__cover {
    flex: 0 0 auto;
    padding: 8px 11px;
    color: #8a6418;
    font-size: 10px;
    font-weight: 700;
    background: #fff2cf;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
}

.suniva-life-edit-media-card.is-cover
.suniva-life-edit-media-card__cover {
    color: #fff;
    background:
        linear-gradient(
            135deg,
            #e3ad32,
            #c9891d
        );
}

.suniva-life-edit-media__help {
    margin: 16px 0 0;
    color: #738892;
    font-size: 11px;
    line-height: 1.8;
}

.suniva-life-edit-media__fields {
    margin-top: 36px;
}

.suniva-life-edit-media__fields > label {
    display: block;
    margin: 22px 0 9px;
    color: #17384d;
    font-weight: 700;
}

.suniva-life-edit-media__fields > input,
.suniva-life-edit-media__fields > textarea {
    width: 100%;
    padding: 16px 17px;
    box-sizing: border-box;
    font: inherit;
    line-height: 1.8;
    background: #fff;
    border: 1px solid #d9e0e4;
    border-radius: 15px;
}

.suniva-life-edit-media__fields > textarea {
    resize: vertical;
}

.suniva-life-edit-media__submit {
    width: 100%;
    min-height: 60px;
    margin-top: 24px;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    background:
        linear-gradient(
            135deg,
            #64b780,
            #4c9765
        );
    border: 0;
    border-radius: 999px;
    box-shadow:
        0 14px 28px rgba(65, 139, 91, 0.2);
    cursor: pointer;
}

.suniva-life-edit-media__submit:disabled {
    opacity: 0.65;
    cursor: wait;
}

@media (max-width: 767px) {
    .suniva-life-edit-media {
        margin-top: 28px;
        padding: 20px 14px;
        border-radius: 24px;
    }

    .suniva-life-edit-media__section {
        padding: 18px 12px;
        border-radius: 22px;
    }

    .suniva-life-edit-media__heading {
        align-items: flex-start;
    }

    .suniva-life-edit-media__list {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .suniva-life-edit-media-card {
        border-radius: 15px;
    }

    .suniva-life-edit-media-card__footer {
        min-height: 49px;
        padding: 7px;
    }

    .suniva-life-edit-media-card__footer small {
        max-width: 72px;
    }

    .suniva-life-edit-media-card__cover {
        padding: 7px 8px;
        font-size: 9px;
    }
}

/* Phase2.6 LIFE総合・投稿・イベント・ポータル */
.suniva-life-tabs {
    display: flex;
    gap: 10px;
    margin: 0 0 24px;
    padding: 5px;
    overflow-x: auto;
    border: 1px solid #e9e3d7;
    border-radius: 999px;
    background: #fbfaf7;
}
.suniva-life-tabs a {
    display: inline-flex;
    flex: 1 0 auto;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 46px;
    padding: 0 18px;
    border-radius: 999px;
    color: #536a61;
    font-weight: 800;
    text-decoration: none;
}
.suniva-life-tabs a span {
    display: grid;
    min-width: 25px;
    height: 25px;
    padding: 0 6px;
    border-radius: 999px;
    place-items: center;
    background: #fff;
    color: #7d8b85;
    font-size: 11px;
}
.suniva-life-tabs a.is-active {
    background: #214f43;
    color: #fff;
    box-shadow: 0 8px 20px rgba(33, 79, 67, .2);
}
.suniva-life-grid__overlay em {
    align-self: flex-start;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .9);
    color: #31594e;
    font-size: 9px;
    font-style: normal;
    font-weight: 900;
}
.suniva-life-grid__overlay small {
    display: flex;
    align-items: center;
    gap: 7px;
}
.suniva-life-grid__overlay small img {
    width: 24px;
    height: 24px;
    border: 2px solid rgba(255,255,255,.85);
    border-radius: 50%;
    object-fit: cover;
}
.suniva-life-grid__overlay small b {
    padding: 2px 6px;
    border-radius: 999px;
    background: #e7f5ed;
    color: #1f7658;
    font-size: 9px;
}
.suniva-life-detail__profile-link {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: center;
    gap: 14px;
    color: inherit;
    text-decoration: none;
}
.suniva-life-detail__profile-link:hover strong { text-decoration: underline; }
.suniva-life-detail__author form { margin-left: auto; }
.suniva-life-follow {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    border: 1px solid #2f9369;
    border-radius: 999px;
    background: #2f9369;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}
.suniva-life-follow.is-following { background: #fff; color: #2f765b; }
.suniva-life-follower-count { color: #70827b; white-space: nowrap; }
@media (max-width: 767px) {
    .suniva-life-tabs {
        justify-content: flex-start;
        border-radius: 17px;
    }
    .suniva-life-tabs a {
        min-height: 42px;
        padding: 0 13px;
        font-size: 13px;
    }
    .suniva-life-grid__overlay {
        opacity: 1;
        padding: 34px 9px 8px;
    }
    .suniva-life-grid__overlay strong {
        font-size: 12px;
    }
    .suniva-life-grid__overlay small {
        font-size: 10px;
    }
}


/* =========================================================
   SUNIVA LIFE V3 Phase1
   Instagram-class familiar UX + SUNIVA WORLD portal stories
   2026-08-20
   ========================================================= */

.suniva-life-v3-page .ec-layoutRole__main,
.suniva-life-v3-page .ec-layoutRole__contents {
    background: #fff;
}

.suniva-life-v3 {
    width: min(680px, 100%);
    margin: 0 auto;
    padding: 0 0 108px;
    color: #17242b;
}

.life-v3-topbar {
    position: sticky;
    z-index: 100;
    top: 0;
    display: grid;
    min-height: 64px;
    grid-template-columns: 54px 1fr 54px;
    align-items: center;
    padding: max(8px, env(safe-area-inset-top)) 12px 8px;
    border-bottom: 1px solid rgba(25, 39, 47, .08);
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.life-v3-topbar__icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 50%;
    color: #15252d;
    font-size: 30px;
    line-height: 1;
    text-decoration: none !important;
}

.life-v3-topbar__icon:last-child {
    justify-self: end;
    font-size: 28px;
}

.life-v3-topbar__brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #17384d;
    text-decoration: none !important;
}

.life-v3-topbar__brand small {
    color: #b48a34;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .24em;
}

.life-v3-topbar__brand strong {
    margin-top: -1px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: .03em;
}

.life-v3-light {
    padding: 15px 0 12px;
    border-bottom: 1px solid #eef0f1;
}

.life-v3-light__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 0 16px 10px;
}

.life-v3-light__head strong { font-size: 14px; }
.life-v3-light__head span { color: #9a7a3c; font-size: 11px; }

.life-v3-light__rail {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding: 0 14px 3px;
    scrollbar-width: none;
}
.life-v3-light__rail::-webkit-scrollbar { display: none; }

.life-v3-light__item {
    display: flex;
    width: 66px;
    flex: 0 0 66px;
    flex-direction: column;
    gap: 5px;
    align-items: center;
    color: #31454f;
    text-decoration: none !important;
}

.life-v3-light__ring {
    display: grid;
    width: 58px;
    height: 58px;
    padding: 2px;
    border-radius: 50%;
    place-items: center;
    background: linear-gradient(145deg,#e7c466,#b88025,#79a97f);
}

.life-v3-light__ring img {
    width: 52px;
    height: 52px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #fff;
    object-fit: cover;
}

.life-v3-light__item small {
    overflow: hidden;
    width: 100%;
    font-size: 10px;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.life-v3-controls {
    padding: 12px 14px;
    border-bottom: 1px solid #edf0f1;
    background: #fff;
}

.life-v3-feed-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 10px;
    padding: 3px;
    border-radius: 999px;
    background: #f2f4f4;
}

.life-v3-feed-tabs a {
    padding: 9px 12px;
    border-radius: 999px;
    color: #71818a;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    text-decoration: none !important;
}

.life-v3-feed-tabs a.is-active {
    background: #fff;
    color: #17384d;
    box-shadow: 0 3px 12px rgba(23,56,77,.08);
}

.life-v3-search {
    display: grid;
    grid-template-columns: 28px 1fr auto;
    align-items: center;
    min-height: 44px;
    padding: 0 12px;
    border: 1px solid #e4e8e9;
    border-radius: 16px;
    background: #f7f8f8;
}

.life-v3-search > span {
    color: #86969d;
    font-size: 22px;
}

.life-v3-search input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: #253a44;
    font-size: 14px;
}

.life-v3-search a {
    padding: 4px 7px;
    color: #8a999f;
    font-size: 18px;
    text-decoration: none !important;
}

.life-v3-search-state {
    display: flex;
    gap: 5px;
    flex-direction: column;
    padding: 11px 3px 2px;
}

.life-v3-search-state strong { color: #17384d; font-size: 14px; }
.life-v3-search-state span { color: #809097; font-size: 11px; }

.life-v3-kind-tabs {
    display: flex;
    gap: 7px;
    overflow-x: auto;
    padding-top: 10px;
    scrollbar-width: none;
}
.life-v3-kind-tabs::-webkit-scrollbar { display: none; }

.life-v3-kind-tabs a {
    flex: 0 0 auto;
    padding: 7px 12px;
    border: 1px solid #e3e7e8;
    border-radius: 999px;
    color: #6c7d85;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none !important;
}

.life-v3-kind-tabs a.is-active {
    border-color: #d7bd7d;
    background: #fff9e9;
    color: #8e6822;
}

.life-v3-feed {
    background: #fff;
}

.life-v3-post {
    padding-bottom: 18px;
    border-bottom: 8px solid #f6f7f7;
}

.life-v3-post__author {
    display: grid;
    min-height: 62px;
    grid-template-columns: 44px 1fr 36px;
    gap: 10px;
    align-items: center;
    padding: 9px 13px;
}

.life-v3-post__avatar img {
    display: block;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #f0f1f1;
    object-fit: cover;
}

.life-v3-post__who {
    display: flex;
    min-width: 0;
    flex-direction: column;
    color: #243841;
    text-decoration: none !important;
}

.life-v3-post__who strong {
    overflow: hidden;
    font-size: 13px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.life-v3-post__who span {
    overflow: hidden;
    margin-top: 2px;
    color: #87969c;
    font-size: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.life-v3-post__more {
    border: 0;
    background: transparent;
    color: #51656e;
    font-size: 18px;
    letter-spacing: .05em;
}

.life-v3-post__visual {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    background: #f1f2f2;
}

.life-v3-post__visual img {
    display: block;
    width: 100%;
    max-height: 780px;
    object-fit: cover;
}

.life-v3-post__badge {
    position: absolute;
    top: 12px;
    right: 12px;
    padding: 6px 9px;
    border: 1px solid rgba(255,255,255,.55);
    border-radius: 999px;
    background: rgba(17,42,54,.72);
    color: #fff;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .12em;
    backdrop-filter: blur(12px);
}

.life-v3-post__actions {
    display: flex;
    gap: 18px;
    align-items: center;
    padding: 11px 14px 5px;
}

.life-v3-post__actions a {
    color: #17242b;
    font-size: 25px;
    line-height: 1;
    text-decoration: none !important;
}

.life-v3-post__actions a small {
    margin-left: 2px;
    font-size: 11px;
    vertical-align: middle;
}

.life-v3-post__reason {
    margin-left: auto;
    color: #a17c35;
    font-size: 10px;
    font-weight: 700;
}

.life-v3-post__copy {
    padding: 5px 14px 3px;
}

.life-v3-post__copy p {
    margin: 0;
    color: #344a54;
    font-size: 13px;
    line-height: 1.65;
}

.life-v3-post__copy p strong {
    margin-right: 5px;
    color: #172d38;
}

.life-v3-post__tags {
    margin-top: 5px;
    color: #3b7189;
    font-size: 12px;
    line-height: 1.6;
}

.life-v3-portal {
    display: grid;
    grid-template-columns: 34px 1fr auto;
    gap: 8px;
    align-items: center;
    margin: 10px 13px 0;
    padding: 12px;
    border: 1px solid #eadfca;
    border-radius: 17px;
    background: linear-gradient(135deg,#fffdf8,#fff8e9);
    color: #263b45;
    text-decoration: none !important;
}

.life-v3-portal__pin {
    display: grid;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    place-items: center;
    background: #fff;
    box-shadow: 0 4px 12px rgba(120,90,35,.08);
}

.life-v3-portal__body {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.life-v3-portal__body small {
    color: #ac8130;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .12em;
}

.life-v3-portal__body strong {
    overflow: hidden;
    margin-top: 1px;
    color: #17384d;
    font-size: 13px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.life-v3-portal__body em {
    overflow: hidden;
    margin-top: 2px;
    color: #87969c;
    font-size: 9px;
    font-style: normal;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.life-v3-portal__go {
    color: #987328;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.life-v3-empty {
    padding: 82px 24px 120px;
    text-align: center;
}
.life-v3-empty > span { font-size: 42px; }
.life-v3-empty h2 { color: #17384d; font-family: Georgia,serif; font-weight: 500; }
.life-v3-empty p { color: #75878f; line-height: 1.8; }

.life-v3-bottom-nav {
    grid-template-columns: repeat(5,1fr) !important;
}

.suniva-life-v3-page .suniva-life-line-entry {
    display: none !important;
}

@media (max-width: 767px) {
    .suniva-life-v3-page .ec-headerRole,
    .suniva-life-v3-page .ec-headerNaviRole,
    .suniva-life-v3-page .ec-layoutRole__header,
    .suniva-life-v3-page .suniva-common-navigation {
        display: none !important;
    }

    .suniva-life-v3 {
        width: 100%;
    }

    .life-v3-post__visual img {
        max-height: none;
        aspect-ratio: auto;
        object-fit: contain;
        background: #f3f4f4;
    }

    .suniva-life__alert {
        margin: 9px 12px;
    }

    .life-v3-bottom-nav {
        width: calc(100% - 16px);
    }
}

@media (min-width: 768px) {
    .suniva-life-v3 {
        margin-top: 22px;
        overflow: hidden;
        border: 1px solid #ece6dc;
        border-radius: 28px;
        box-shadow: 0 24px 70px rgba(23,56,77,.08);
    }
}


/* =========================================================
   SUNIVA LIFE V3 Phase1.1 — Mobile Experience Finish
   2026-08-20
   ========================================================= */

/* body_classに依存せず、LIFE V3が存在する画面を確実に全幅化 */
@media (max-width: 767px) {
    html:has(.suniva-life-v3),
    body:has(.suniva-life-v3) {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        overflow-x: hidden !important;
        background: #fff !important;
    }

    body:has(.suniva-life-v3) .ec-layoutRole,
    body:has(.suniva-life-v3) .ec-layoutRole__contents,
    body:has(.suniva-life-v3) .ec-layoutRole__main,
    body:has(.suniva-life-v3) .ec-layoutRole__mainWithColumn,
    body:has(.suniva-life-v3) .ec-layoutRole__mainBetweenColumn,
    body:has(.suniva-life-v3) .ec-layoutRole__mainNarrow,
    body:has(.suniva-life-v3) .ec-layoutRole__contentTop,
    body:has(.suniva-life-v3) .ec-layoutRole__contentBottom {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
    }

    /* LIFEトップはアプリ体験に統一 */
    body:has(.suniva-life-v3) .ec-headerRole,
    body:has(.suniva-life-v3) .ec-headerNaviRole,
    body:has(.suniva-life-v3) .ec-layoutRole__header,
    body:has(.suniva-life-v3) header.ec-headerRole,
    body:has(.suniva-life-v3) .suniva-common-navigation,
    body:has(.suniva-life-v3) .ec-topicpath,
    body:has(.suniva-life-v3) .suniva-trust-footer,
    body:has(.suniva-life-v3) footer:not(.life-v3-post__footer) {
        display: none !important;
    }

    .suniva-life-v3 {
        width: 100vw !important;
        max-width: 100vw !important;
        margin: 0 !important;
        padding: 0 0 104px !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: #fff !important;
    }

    .life-v3-topbar {
        min-height: 58px;
        grid-template-columns: 52px 1fr 52px;
        padding: max(7px, env(safe-area-inset-top)) 12px 6px;
        border-bottom-color: rgba(23,56,77,.07);
    }

    .life-v3-topbar__brand small {
        font-size: 8px;
    }

    .life-v3-topbar__brand strong {
        font-size: 24px;
    }

    .life-v3-topbar__icon {
        width: 44px;
        height: 44px;
        font-size: 31px;
    }

    /* 今日の光：Instagram級に視認しやすく */
    .life-v3-light {
        padding: 13px 0 11px;
    }

    .life-v3-light__head {
        padding: 0 14px 9px;
    }

    .life-v3-light__head strong {
        font-size: 13px;
    }

    .life-v3-light__rail {
        gap: 10px;
        padding: 0 11px 2px;
    }

    .life-v3-light__item {
        width: 70px;
        flex-basis: 70px;
    }

    .life-v3-light__ring {
        width: 64px;
        height: 64px;
        padding: 2px;
    }

    .life-v3-light__ring img {
        width: 58px;
        height: 58px;
    }

    .life-v3-light__item small {
        font-size: 10px;
    }

    .life-v3-controls {
        padding: 10px 12px 11px;
    }

    .life-v3-feed-tabs {
        margin-bottom: 9px;
    }

    .life-v3-search {
        min-height: 46px;
        border-radius: 15px;
    }

    /* 投稿を画面の主役に */
    .life-v3-post {
        width: 100%;
        padding-bottom: 20px;
        border-bottom: 7px solid #f5f6f6;
    }

    .life-v3-post__author {
        min-height: 60px;
        grid-template-columns: 43px 1fr 34px;
        gap: 9px;
        padding: 8px 12px;
    }

    .life-v3-post__avatar img {
        width: 42px;
        height: 42px;
    }

    .life-v3-post__who strong {
        font-size: 13px;
    }

    .life-v3-post__who span {
        font-size: 10px;
    }

    .life-v3-post__visual {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-right: calc(50% - 50vw) !important;
        margin-left: calc(50% - 50vw) !important;
        border-radius: 0 !important;
    }

    .life-v3-post__visual img {
        display: block;
        width: 100vw !important;
        max-width: 100vw !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 !important;
        object-fit: contain !important;
        background: #f5f6f6;
    }

    .life-v3-post__actions {
        gap: 20px;
        padding: 12px 13px 5px;
    }

    .life-v3-post__actions a {
        font-size: 27px;
    }

    .life-v3-post__reason {
        max-width: 42%;
        overflow: hidden;
        font-size: 9px;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .life-v3-post__copy {
        padding: 5px 13px 2px;
    }

    .life-v3-post__copy p {
        font-size: 13px;
        line-height: 1.62;
    }

    .life-v3-post__tags {
        font-size: 12px;
    }

    /* WORLDカード：投稿の主役を邪魔せず、次の一歩を明確に */
    .life-v3-portal {
        grid-template-columns: 38px minmax(0,1fr) auto;
        gap: 9px;
        margin: 11px 12px 0;
        padding: 13px 12px;
        border-color: #e7d4a8;
        border-radius: 18px;
        background:
            radial-gradient(circle at 100% 0, rgba(229,197,119,.18), transparent 38%),
            linear-gradient(135deg,#fffdf8,#fff8e8);
        box-shadow: 0 7px 22px rgba(122,91,31,.07);
    }

    .life-v3-portal__pin {
        width: 38px;
        height: 38px;
        font-size: 17px;
    }

    .life-v3-portal__body small {
        font-size: 8px;
        letter-spacing: .15em;
    }

    .life-v3-portal__body strong {
        font-size: 14px;
    }

    .life-v3-portal__go {
        padding: 7px 9px;
        border-radius: 999px;
        background: #fff;
        color: #8a651f;
        font-size: 10px;
        box-shadow: 0 3px 10px rgba(128,93,28,.08);
    }

    /* 2026 Instagram型の浮遊感。ただしSUNIVAの白・ゴールド */
    .life-v3-bottom-nav.suniva-life-nav {
        z-index: 2500 !important;
        right: 50% !important;
        bottom: max(8px, env(safe-area-inset-bottom)) !important;
        width: calc(100% - 18px) !important;
        max-width: 520px !important;
        min-height: 62px;
        padding: 8px 8px !important;
        transform: translateX(50%) !important;
        border: 1px solid rgba(210,196,169,.72) !important;
        border-radius: 31px !important;
        background: rgba(250,249,246,.92) !important;
        box-shadow: 0 15px 38px rgba(23,56,77,.18) !important;
        backdrop-filter: blur(22px) saturate(1.15) !important;
        -webkit-backdrop-filter: blur(22px) saturate(1.15) !important;
    }

    .life-v3-bottom-nav .suniva-life-nav__item {
        min-height: 48px;
        color: #52636b;
    }

    .life-v3-bottom-nav .suniva-life-nav__item > span {
        font-size: 24px;
    }

    .life-v3-bottom-nav .suniva-life-nav__item > small {
        margin-top: 2px;
        font-size: 9px;
    }

    .life-v3-bottom-nav .suniva-life-nav__item.is-active {
        color: #17384d;
    }

    .life-v3-bottom-nav .suniva-life-nav__item.is-create > span {
        width: 48px;
        height: 48px;
        margin-top: -21px;
        background: linear-gradient(135deg,#e5ba50,#c78c22);
        box-shadow: 0 9px 22px rgba(190,132,30,.3);
    }
}

/* PCは中央フィードを上質に。スマホ用全幅指定の影響を受けない */
@media (min-width: 768px) {
    .suniva-life-v3 {
        width: min(680px, calc(100% - 40px));
    }
}


/* SUNIVA LIFE V3 Phase1.2 — contextual navigation integration */
body:has(.suniva-life-v3) .sn-live-bottom {
    display: none !important;
}
.suniva-life-v3 {
    padding-bottom: 112px !important;
}
