.tarot-theme, .tarot-theme body {
    background:#061421;
    color:#eedab5;
    margin:0;
    min-width:0;
    min-height:100vh
}
.tarot-shell, .tarot-shell * {
    box-sizing:border-box
}
.tarot-shell {
    font-family:-apple-system, PingFang SC, Microsoft YaHei, sans-serif;
    line-height:1.65
}
.tarot-shell button, .tarot-shell textarea {
    font-family:inherit
}
.tarot-theme .site-public-footer {
    color:#acb7c3;
    background:#061421;
    max-width:560px;
    margin:auto
}
.tarot-shell {
    --tarot-gold: #ecd1a0;
    --tarot-muted: #a8b2c1;
    position:relative;
    isolation:isolate;
    max-width:560px;
    min-height:100svh;
    margin:0 auto;
    overflow:hidden;
    background:radial-gradient(ellipse at 50% 30%, #14324788, transparent 65%), linear-gradient(rgba(5, 19, 33, .867), rgba(4, 21, 34, .867)), url(/assets/tarot/night-sky.webp) center top/cover;
    color:#f1dfbf;
    padding-bottom:max(24px, env(safe-area-inset-bottom))
}
.tarot-shell button, .tarot-shell a {
    touch-action:manipulation
}
.tarot-shell[aria-hidden=true] {
    pointer-events:none
}
.tarot-shell button {
    cursor:pointer
}
.tarot-shell button:disabled {
    cursor:default;
    opacity:.48
}
.tarot-shell :focus-visible {
    outline:2px solid #fff0c7;
    outline-offset:5px
}
.tarot-shell .modal-card, .tarot-shell .history-record-modal {
    color:#362b27
}
.tarot-loading {
    min-height:64vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:44px 0
}
.tarot-loading h1 {
    font:500 clamp(23px, 6vw, 30px)/1.6"Songti SC", serif;
    color:#f2dfbb;
    letter-spacing:2px;
    margin:12px 0
}
.tarot-loading p {
    max-width:360px;
    color:#bac1c9;
    font-size:13px;
    line-height:1.9
}
.tarot-loading .tarot-eyebrow {
    color:#c5aa75;
    font-size:10px;
    letter-spacing:4px;
    margin-top:30px
}
.tarot-loading-orbit {
    width:128px;
    height:128px;
    border:1px solid #d6b77766;
    border-radius:50%;
    position:relative;
    display:grid;
    place-items:center;
    box-shadow:0 0 45px rgba(184, 151, 77, .1)
}
.tarot-loading-orbit i {
    position:absolute;
    top:10px;
    right:10px;
    bottom:10px;
    left:10px;
    border:1px dashed #e9d09577;
    border-radius:50%;
    animation:tarot-orbit 24s linear infinite
}
.tarot-loading-orbit span {
    color:#f3d596;
    font-size:58px;
    text-shadow:0 0 28px #e2bf6b88;
    animation:tarot-starlight 2s ease-in-out infinite alternate
}
.tarot-loading-orbit b {
    position:absolute;
    top:-18px;
    right:7px;
    color:#eed5a2;
    font-size:35px;
    font-weight:400
}
.tarot-loading-orbit.is-paused * {
    animation:none
}
.tarot-recovery-backdrop {
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:1000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:28px 20px;
    overflow-y:auto;
    background:rgba(2, 10, 20, .85);
    backdrop-filter:blur(8px)
}
.tarot-recovery-modal.tarot-star-frame {
    width:100%;
    max-width:420px;
    max-height:calc(100svh - 56px);
    overflow-y:auto;
    padding:27px 24px 18px;
    background:radial-gradient(ellipse at 50% 0, #1c3a4d, #081b2b 70%);
    color:#f1dfbf;
    box-shadow:0 20px 80px rgba(0, 0, 0, .533), 0 0 35px rgba(188, 152, 92, .133);
    text-align:center
}
.tarot-recovery-modal .tarot-frame-crest {
    top:8px
}
.tarot-recovery-modal .tarot-frame-foot {
    bottom:8px
}
.tarot-recovery-modal .tarot-frame-ornaments:before {
    left:0
}
.tarot-recovery-modal .tarot-frame-ornaments:after {
    right:0
}
.tarot-recovery-close {
    position:absolute;
    top:12px;
    right:10px;
    background:transparent;
    border:0;
    color:#d5c3a0;
    font-size:28px;
    width:44px;
    height:44px
}
.tarot-recovery-mark {
    display:block;
    color:#edce93;
    font-size:56px;
    line-height:1.3;
    margin-top:14px;
    text-shadow:0 0 24px #c8a05477
}
.tarot-recovery-modal h2 {
    margin:8px 0 12px;
    font:500 25px/1.5 Songti SC, serif;
    letter-spacing:3px;
    color:#f2dfbb
}
.tarot-recovery-modal #record-recovery-hint {
    color:#aebaca;
    font-size:13px;
    line-height:1.9;
    margin:0 0 25px
}
.tarot-recovery-label {
    display:block;
    text-align:left;
    color:#dcc9a5;
    font-size:13px;
    margin-bottom:10px
}
.tarot-recovery-input {
    width:100%;
    min-width:0;
    min-height:52px;
    border:1px solid #a68b57;
    border-radius:9px;
    padding:12px 13px;
    background:rgba(4, 19, 33, .467);
    color:#fff1d5;
    font:inherit;
    font-size:16px
}
.tarot-recovery-input::placeholder {
    color:#929dac;
    font-size:13px
}
.tarot-recovery-modal .tarot-primary {
    justify-content:center;
    font-size:15px
}
.tarot-contact-phone-modal .contact-phone-backdrop {
    background:rgba(2, 10, 20, .85)
}
.tarot-contact-phone-modal .contact-phone-panel {
    padding:26px 24px 30px;
    border-radius:12px;
    border-color:#d4ae65;
    background:radial-gradient(ellipse at 50% 0, #1c3a4d, #081b2b 70%);
    color:#f1dfbf;
    box-shadow:0 20px 80px rgba(0, 0, 0, .533), 0 0 35px rgba(188, 152, 92, .133)
}
.tarot-contact-phone-modal .tarot-frame-crest {
    top:8px
}
.tarot-contact-phone-modal .tarot-frame-foot {
    bottom:8px
}
.tarot-contact-phone-modal .tarot-frame-ornaments:before {
    left:0
}
.tarot-contact-phone-modal .tarot-frame-ornaments:after {
    right:0
}
.tarot-phone-mark {
    display:block;
    margin:5px 0 9px;
    color:#edce93;
    font:48px/1 serif;
    text-align:center;
    text-shadow:0 0 24px #c8a05477
}
.tarot-contact-phone-modal .contact-phone-eyebrow {
    color:#d4b87e;
    text-align:center;
    font-size:11px
}
.tarot-contact-phone-modal .contact-phone-panel h2 {
    color:#f2dfbb;
    text-align:center;
    font:500 23px/1.6 Songti SC, serif;
    letter-spacing:2px
}
.tarot-contact-phone-modal #contact-phone-description {
    color:#aebaca;
    font-size:13px;
    line-height:1.9;
    text-align:center
}
.tarot-contact-phone-modal .contact-phone-record {
    border-color:rgba(182, 151, 92, .333);
    background:rgba(4, 19, 33, .467);
    border-radius:9px
}
.tarot-contact-phone-modal .contact-phone-record-number {
    color:#e5d3ae
}
.tarot-contact-phone-modal .contact-phone-panel label {
    color:#dcc9a5;
    font-size:13px
}
.tarot-contact-phone-modal .contact-phone-panel input {
    border-color:#a68b57;
    border-radius:9px;
    background:rgba(4, 19, 33, .467);
    color:#fff1d5;
    font-size:18px
}
.tarot-contact-phone-modal .contact-phone-panel input:focus {
    border-color:#ffe5a7;
    outline-color:rgba(233, 199, 134, .4)
}
.tarot-contact-phone-modal button[type=submit] {
    border-color:#eed5a2;
    border-radius:28px;
    color:#2d281e;
    background:linear-gradient(115deg, #edce93, #f7e5bd 50%, #d0aa6c);
    box-shadow:inset 0 1px #fff7dc, 0 5px 24px rgba(184, 151, 77, .145)
}
.tarot-contact-phone-modal .contact-phone-panel .contact-phone-record-copy {
    border-color:#a68b57;
    color:#edd5a3;
    background:transparent
}
.tarot-contact-phone-modal button:focus-visible {
    outline:2px solid #f3d596;
    outline-offset:3px
}
.tarot-contact-phone-modal .contact-phone-panel .contact-phone-copy-feedback {
    color:#dcc9a5
}
.tarot-contact-phone-modal .contact-phone-error {
    color:#ffd0b5!important
}
.tarot-stars {
    pointer-events:none;
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:-1;
    opacity:.55;
    background-image:radial-gradient(1px 1px at 12% 13%, #eed6a8 95%, transparent), radial-gradient(1px 1px at 72% 42%, #fff 95%, transparent), radial-gradient(2px 2px at 42% 67%, #d3c09e 95%, transparent);
    background-size:93px 157px, 137px 187px, 293px 241px;
    animation:tarot-starlight 5s ease-in-out infinite alternate
}
.tarot-header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:76px;
    padding:0 24px;
    gap:16px;
    border-bottom:1px solid #d7b77c1c
}
.tarot-brand {
    color:#f2dfbb;
    font-family:Songti SC, "Noto Serif CJK SC", serif;
    font-size:22px;
    text-decoration:none;
    letter-spacing:3px;
    display:flex;
    align-items:center
}
.tarot-service {
    color:#d5c9b3;
    text-decoration:none;
    font-size:12px;
    white-space:nowrap
}
.tarot-header-star {
    color:#d4b87e;
    font-size:30px
}
.tarot-back {
    font-size:34px;
    color:#ecd1a0;
    border:0;
    background:transparent;
    padding:0 10px 4px 0
}
.tarot-wordmark {
    letter-spacing:4px;
    font-family:serif
}
.tarot-main {
    padding:0 24px
}
.tarot-intro {
    text-align:center;
    padding:26px 0 22px
}
.tarot-intro h1 {
    font-family:Songti SC, "Noto Serif CJK SC", serif;
    font-size:clamp(29px, 8vw, 38px);
    font-weight:500;
    letter-spacing:4px;
    line-height:1.4;
    margin:8px 0 10px;
    text-shadow:0 0 25px #bca57055
}
.tarot-intro p {
    margin:6px 0;
    color:#bac1c9;
    font-size:13px;
    letter-spacing:1.6px
}
.tarot-intro .tarot-eyebrow {
    color:#c5aa75;
    font-size:10px;
    letter-spacing:4px
}
.tarot-cards {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
    margin:12px 0 16px;
    perspective:850px
}
.tarot-card-slot {
    margin:0;
    min-width:0;
    text-align:center
}
.tarot-card-empty, .tarot-card-reveal {
    aspect-ratio:.58;
    border:1px solid #a88e59;
    border-radius:8px;
    box-shadow:inset 0 0 0 4px #0b2233, inset 0 0 0 5px rgba(142, 117, 75, .4);
    overflow:hidden;
    background:rgba(11, 29, 43, .6);
    position:relative
}
.tarot-card-empty {
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center
}
.tarot-card-empty>span {
    font-size:42px;
    color:rgba(215, 181, 117, .6)
}
.tarot-card-empty>small {
    font-size:11px;
    color:#aca594;
    letter-spacing:4px
}
.tarot-card-reveal {
    animation:tarot-reveal .7s cubic-bezier(.17, .7, .25, 1) both;
    box-shadow:0 0 20px rgba(217, 182, 121, .2)
}
.tarot-card-reveal img {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block
}
.tarot-card-reveal img.is-reversed {
    transform:rotate(180deg)
}
.tarot-card-glimmer {
    position:absolute;
    top:-40%;
    right:-40%;
    bottom:-40%;
    left:-40%;
    background:linear-gradient(115deg, transparent 38%, #ffe6a688 50%, transparent 62%);
    transform:translate(150%);
    animation:tarot-glimmer 1s ease-out
}
.tarot-card-slot figcaption {
    font-size:12px;
    color:#d1c0a4;
    margin-top:9px
}
.tarot-card-slot figcaption small {
    display:block;
    color:#949faf;
    font-size:10px;
    margin-top:2px
}
.tarot-draw-progress {
    text-align:center;
    font-size:13px;
    letter-spacing:2px;
    margin-top:15px
}
.tarot-draw-progress p {
    margin:0 0 8px
}
.tarot-draw-progress>span {
    display:inline-flex;
    gap:31px;
    position:relative
}
.tarot-draw-progress>span:before {
    content:"";
    position:absolute;
    height:1px;
    background:#a78e58;
    left:6px;
    right:6px;
    top:5px
}
.tarot-draw-progress i {
    border:1px solid #d4b882;
    border-radius:50%;
    width:11px;
    height:11px;
    position:relative;
    background:#0a1e2d
}
.tarot-draw-progress i.is-filled {
    background:#e9c787;
    box-shadow:0 0 12px rgba(239, 212, 144, .733)
}
.tarot-deck {
    position:relative;
    height:238px;
    margin:0 -24px;
    perspective:800px
}
.tarot-orbit {
    position:absolute;
    width:310px;
    height:310px;
    top:-14px;
    left:calc(50% - 155px);
    border:1px solid #c7a56244;
    border-radius:50%;
    background:repeating-conic-gradient(from 10deg, transparent 0deg 14deg, #bba05a22 14deg 15deg);
    animation:tarot-orbit 80s linear infinite
}
.tarot-orbit:before, .tarot-orbit:after {
    content:"";
    position:absolute;
    top:18px;
    right:18px;
    bottom:18px;
    left:18px;
    border:1px dashed #dabc7755;
    border-radius:50%
}
.tarot-orbit:after {
    top:40px;
    right:40px;
    bottom:40px;
    left:40px;
    border-style:solid
}
.tarot-deck-card {
    --angle: 0deg;
    position:absolute;
    top:28px;
    left:calc(50% - 37px);
    width:74px;
    height:132px;
    padding:0;
    border:1px solid #c7a267;
    border-radius:7px;
    transform-origin:50% 170%;
    transform:rotate(var(--angle));
    background:#0a2435;
    box-shadow:-3px 0 8px rgba(0, 0, 0, .467);
    transition:filter .25s, opacity .5s, margin-top .3s;
    animation:tarot-fan .8s calc(var(--order) * 14ms) both cubic-bezier(.2, .8, .3, 1)
}
.tarot-deck-card img {
    width:100%;
    height:100%;
    border-radius:6px;
    pointer-events:none
}
.tarot-deck-card:not(:disabled):hover, .tarot-deck-card:not(:disabled):focus-visible {
    filter:brightness(1.5);
    z-index:30
}
.tarot-deck-card.is-selected {
    animation:none;
    opacity:0;
    pointer-events:none;
    margin-top:-40px
}
.tarot-primary, .tarot-secondary {
    width:100%;
    min-height:52px;
    border-radius:28px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:14px 22px;
    font-size:16px;
    text-decoration:none;
    font-weight:600;
    border:1px solid #eed5a2
}
.tarot-primary {
    color:#2d281e;
    background:linear-gradient(115deg, #edce93, #f7e5bd 50%, #d0aa6c);
    box-shadow:inset 0 1px #fff7dc, 0 5px 24px rgba(184, 151, 77, .145);
    margin:18px 0 12px
}
.tarot-secondary {
    color:#e4d0a7;
    background:rgba(13, 40, 55, .4);
    border-color:rgba(152, 126, 81, .4);
    margin:14px 0;
    font-size:14px;
    font-weight:400
}
.tarot-small {
    font-size:11px;
    color:#a3afbc;
    text-align:center;
    line-height:1.8;
    margin:13px 0
}
.tarot-endnote {
    margin:34px 0 0;
    text-align:center;
    font-size:10px;
    letter-spacing:3px;
    color:#a59981
}
.tarot-endnote:before {
    content:"";
    display:block;
    margin:0 auto 18px;
    width:28px;
    height:1px;
    background:#c4a168
}
.tarot-star-frame {
    position:relative;
    background:transparent;
    color:#fff0cb;
    border:1px solid #d4ae65;
    border-radius:12px;
    box-shadow:0 0 18px rgba(220, 184, 105, .094), inset 0 0 18px rgba(220, 184, 105, .04)
}
.tarot-star-frame:before {
    content:"";
    position:absolute;
    top:5px;
    right:5px;
    bottom:5px;
    left:5px;
    border:1px solid #d9b76f66;
    border-radius:8px;
    pointer-events:none
}
.tarot-frame-ornaments {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    color:#f4d18b;
    pointer-events:none;
    text-shadow:0 0 5px #071724, 0 0 12px #edc56d80
}
.tarot-frame-ornaments:before, .tarot-frame-ornaments:after {
    content:"✦";
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    font-size:14px;
    line-height:1
}
.tarot-frame-ornaments:before {
    left:-7px
}
.tarot-frame-ornaments:after {
    right:-7px
}
.tarot-frame-crest, .tarot-frame-foot {
    position:absolute;
    left:50%;
    transform:translate(-50%);
    line-height:1;
    white-space:nowrap
}
.tarot-frame-crest {
    top:-12px;
    font-size:15px;
    letter-spacing:7px;
    padding-left:7px
}
.tarot-frame-crest b {
    font-size:23px;
    font-weight:400
}
.tarot-frame-foot {
    bottom:-8px;
    font-size:16px
}
.tarot-question-trigger {
    justify-content:center;
    min-height:64px;
    margin-top:26px;
    letter-spacing:3px;
    font-weight:500;
    text-shadow:0 0 16px #e4c58066;
    transition:border-color .2s, box-shadow .2s
}
.tarot-question-trigger:hover, .tarot-star-frame:focus-within {
    border-color:#ffe5a7;
    box-shadow:0 0 24px rgba(220, 184, 105, .2)
}
.tarot-redraw {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    margin:0 auto;
    min-height:44px;
    padding:6px 18px;
    border:0;
    background:transparent;
    color:#e9cf9d;
    font-size:13px;
    letter-spacing:2px
}
.tarot-redraw>span {
    font-size:21px;
    line-height:1
}
.tarot-redraw:not(:disabled):hover {
    color:#fff0cb;
    text-shadow:0 0 12px #e2bd6d88
}
.tarot-question {
    display:block;
    padding:25px 22px 18px;
    margin-top:26px
}
.tarot-question>span {
    font-size:15px
}
.tarot-question textarea {
    display:block;
    width:100%;
    resize:vertical;
    background:transparent;
    border:0;
    color:#fff1d5;
    padding:14px 0;
    font-size:14px;
    line-height:1.9;
    caret-color:#ffe1a2
}
.tarot-question textarea:focus-visible {
    outline:none
}
.tarot-question textarea::placeholder {
    color:#b9bdc3;
    opacity:1
}
.tarot-question>small {
    display:block;
    text-align:right;
    color:#c7b58f;
    font-size:11px
}
.tarot-question-summary {
    display:block;
    background:linear-gradient(135deg, #fffbf1, #eee6d8);
    color:#352d27;
    border:1px solid #d4c2a5;
    border-radius:14px;
    box-shadow:inset 0 0 0 5px #fff7e7;
    padding:17px 20px;
    margin-top:0
}
.tarot-question-summary small {
    color:#91816b;
    font-size:11px
}
.tarot-question-summary p {
    margin:8px 0 0;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
    font-size:16px
}
.tarot-tiers {
    display:grid;
    gap:16px;
    padding:10px 0
}
.tarot-tier {
    position:relative;
    display:grid;
    grid-template-columns:64px 1fr;
    gap:12px;
    text-align:left;
    color:#42382c;
    background:linear-gradient(120deg, #f2ebdf, #e3dacb);
    padding:20px 18px;
    border:2px solid transparent;
    border-radius:14px;
    min-height:142px
}
.tarot-tier.is-selected {
    border-color:#ebc87e;
    box-shadow:0 0 0 3px rgba(218, 188, 125, .2), 0 0 30px rgba(222, 192, 115, .09);
    background:linear-gradient(125deg, #fff9ed, #ecddc2)
}
.tarot-tier h2 {
    font:19px Songti SC, serif;
    margin:0 0 10px
}
.tarot-tier p {
    font-size:11px;
    color:#766956;
    margin:0 0 5px
}
.tarot-tier small {
    font-size:10px;
    color:#857054
}
.tarot-tier>strong {
    grid-column:2;
    font-size:22px;
    font-weight:500;
    line-height:1;
    color:#815e28
}
.tarot-tier-portraits {
    display:flex;
    flex-wrap:wrap;
    align-content:center;
    justify-content:center;
    width:64px;
    gap:2px;
    grid-row:1 / 3
}
.tarot-tier-portraits img {
    width:29px;
    height:29px;
    border:1px solid #bfa271;
    border-radius:50%
}
.tarot-tier-portraits img:only-child {
    width:64px;
    height:64px
}
.tarot-radio {
    position:absolute;
    right:15px;
    bottom:17px;
    width:19px;
    height:19px;
    line-height:18px;
    border-radius:50%;
    text-align:center;
    font-size:12px;
    border:1px solid #a78c5e;
    color:#775929
}
.tarot-consents {
    color:#b9b2a4;
    font-size:11px;
    line-height:2;
    margin:16px 0
}
.tarot-consents input {
    vertical-align:middle;
    accent-color:#d8bb83;
    margin-right:6px
}
.tarot-consents button {
    font-size:inherit;
    background:transparent;
    border:0;
    color:#e5cc9f;
    padding:0
}
.tarot-error {
    padding:12px 14px;
    color:#ffc9bf;
    background:rgba(147, 47, 41, .16);
    border:1px solid #c45e5555;
    border-radius:10px;
    font-size:13px
}
.tarot-payment-summary {
    border:1px solid #b9a06a55;
    padding:24px;
    border-radius:16px;
    text-align:center;
    background:rgba(16, 45, 63, .533)
}
.tarot-payment-summary strong {
    display:block;
    color:#efd3a0;
    font-size:42px;
    font-family:Georgia, serif;
    font-weight:400
}
.tarot-payment-summary p {
    margin:6px 0;
    font-size:13px;
    color:#acb6c1
}
.tarot-payment-channels {
    display:grid;
    gap:12px;
    margin:24px 0
}
.tarot-payment-channels button {
    text-align:left;
    display:flex;
    justify-content:space-between;
    padding:18px;
    border-radius:12px;
    color:#d7dfe5;
    border:1px solid #57718477;
    background:rgba(23, 49, 69, .467)
}
.tarot-payment-channels button.is-selected {
    border-color:#dabb7e;
    background:rgba(175, 152, 101, .125);
    color:#efd5a3
}
.tarot-timeline {
    list-style:none;
    padding:6px 8px;
    margin:6px 0 0
}
.tarot-timeline li {
    display:flex;
    gap:19px;
    min-height:88px;
    position:relative;
    color:#84909c
}
.tarot-timeline li:not(:last-child):before {
    content:"";
    position:absolute;
    left:15px;
    top:32px;
    bottom:0;
    width:1px;
    background:rgba(99, 114, 122, .533)
}
.tarot-timeline li>span {
    width:32px;
    height:32px;
    flex:0 0 32px;
    border:1px solid #879798;
    text-align:center;
    line-height:30px;
    border-radius:50%
}
.tarot-timeline strong {
    font-size:14px;
    font-weight:500
}
.tarot-timeline p {
    font-size:11px;
    margin:6px 0 20px
}
.tarot-timeline .is-done>span {
    background:#ebcea1;
    border-color:#ebcea1;
    color:#132333
}
.tarot-timeline .is-current {
    color:#eed7af
}
.tarot-timeline .is-current>span {
    color:#f8e8bf;
    border-color:#d4af67;
    box-shadow:0 0 20px rgba(239, 208, 138, .4);
    animation:tarot-starlight 2s ease-in-out infinite alternate
}
.tarot-mail-scene {
    position:relative;
    height:210px;
    margin:0 -5px;
    overflow:hidden
}
.tarot-mail-orbit {
    position:absolute;
    width:240px;
    height:240px;
    border:1px solid #9c814655;
    border-radius:50%;
    right:-28px;
    top:-15px;
    box-shadow:0 0 0 12px rgba(213, 178, 113, .047), 0 0 0 14px rgba(213, 178, 113, .082), 0 0 0 30px rgba(213, 178, 113, .047)
}
.tarot-envelope {
    position:absolute;
    width:144px;
    left:3%;
    top:29px;
    transform:rotate(-12deg)
}
.tarot-envelope img {
    width:100%;
    border-radius:16px;
    mix-blend-mode:screen
}
.tarot-envelope>span {
    position:absolute;
    top:25%;
    right:15%;
    bottom:45%;
    left:15%;
    background:linear-gradient(#f1d29a, #b4a178);
    -webkit-clip-path:polygon(0 0, 100% 0, 50% 100%);
    clip-path:polygon(0 0, 100% 0, 50% 100%);
    transform-origin:center top;
    opacity:.6
}
.is-sending .tarot-envelope {
    animation:tarot-float 4s ease-in-out infinite
}
.is-sending .tarot-envelope>span {
    animation:tarot-flap 4s ease-in-out infinite
}
.tarot-wait-reader {
    position:absolute;
    width:118px;
    right:4%;
    top:55px;
    text-align:center
}
.tarot-wait-reader img {
    width:108px;
    height:108px;
    object-fit:cover;
    border-radius:50%;
    border:2px solid #d9b76c;
    box-shadow:0 0 28px rgba(201, 169, 100, .267)
}
.tarot-wait-reader span {
    display:block;
    font-size:10px;
    margin-top:6px;
    letter-spacing:4px
}
.tarot-flying-note {
    position:absolute;
    opacity:0;
    left:30%;
    top:85px;
    font:30px serif;
    color:#f5d997
}
.is-sending .tarot-flying-note {
    animation:tarot-send 4s 1s ease-in-out infinite
}
.is-sending .tarot-flying-note.second {
    animation-delay:1.7s;
    font-size:20px
}
.tarot-record {
    display:flex;
    gap:8px;
    justify-content:space-between;
    align-items:center;
    padding:14px;
    border:1px solid #b99b6655;
    background:rgba(5, 23, 36, .6);
    border-radius:10px;
    margin:20px 0 8px
}
.tarot-record small {
    display:block;
    color:#a4a5a1;
    font-size:10px
}
.tarot-record strong {
    font-size:13px;
    letter-spacing:.4px;
    font-weight:500;
    overflow-wrap:anywhere
}
.tarot-record button {
    color:#e7c898;
    background:transparent;
    border:1px solid #b69a6355;
    border-radius:6px;
    white-space:nowrap;
    font-size:11px;
    padding:6px 10px
}
.tarot-answer-progress {
    color:#aeb3b6;
    font-size:11px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin:18px 0
}
.tarot-answer-progress button {
    border:0;
    background:none;
    font-size:11px;
    color:#e8ce9f;
    text-decoration:underline
}
.tarot-answers {
    display:grid;
    gap:20px
}
.tarot-answer {
    background:linear-gradient(130deg, #f7f2e7, #eee4d3);
    color:#39352f;
    border-radius:16px;
    border:1px solid #e4c998;
    padding:20px;
    opacity:.55;
    transition:opacity .6s
}
.tarot-answer.is-active {
    opacity:1
}
.tarot-answer>header {
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:18px
}
.tarot-answer header img {
    width:50px;
    height:50px;
    flex:none;
    object-fit:cover;
    border-radius:50%;
    border:2px solid #baa171
}
.tarot-reader-info {
    min-width:0
}
.tarot-answer h2 {
    font-family:serif;
    font-size:20px;
    margin:0 0 5px;
    font-weight:500
}
.tarot-answer header span {
    color:#9a7c4c;
    font-size:10px
}
.tarot-answer header small {
    display:block;
    margin-top:4px;
    font-size:10px;
    color:#927e61
}
.tarot-reader-contact {
    flex:none;
    margin-left:auto;
    padding:9px 10px;
    min-height:40px;
    border:1px solid #b99b64;
    border-radius:20px;
    color:#624c27;
    background:linear-gradient(115deg, #f3e0b8, #f8edcf, #e4c78f);
    font-size:12px;
    font-weight:600;
    white-space:nowrap;
    box-shadow:inset 0 1px #fff7df, 0 3px 10px rgba(134, 109, 54, .125)
}
.tarot-reader-contact:focus-visible {
    outline:2px solid #856634;
    outline-offset:3px
}
.tarot-answer .tarot-reader-contact span {
    color:inherit;
    font-size:14px
}
.tarot-answer-body {
    padding:0 2px;
    font-size:15px;
    line-height:1.95;
    overflow-wrap:anywhere
}
.tarot-answer-body p {
    margin:0 0 14px
}
.tarot-answer-body p:last-child {
    margin-bottom:0
}
.tarot-answer-pending {
    color:#978c7c;
    font-size:13px
}
.tarot-caret {
    animation:tarot-caret 1s step-end infinite;
    color:#907343
}
.tarot-gift {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:12px;
    margin:24px 0;
    border:1px solid #ae915b;
    padding:20px;
    border-radius:16px;
    background:rgba(33, 51, 68, .333)
}
.tarot-gift>span {
    font:48px serif;
    color:#e9c991
}
.tarot-gift h2 {
    font-size:18px;
    font-family:serif;
    font-weight:500;
    margin:0
}
.tarot-gift p {
    font-size:11px;
    color:#aeb3b6;
    margin:7px 0
}
.tarot-gift .tarot-primary {
    margin:0;
    font-size:13px
}
@keyframes tarot-starlight {
    to {
        opacity:.5
    }
}
@keyframes tarot-orbit {
    to {
        transform:rotate(360deg)
    }
}
@keyframes tarot-reveal {
    0% {
        transform:rotateY(180deg) translateY(24px) scale(.7);
        opacity:0
    }
    to {
        transform:rotateY(0) translateY(0) scale(1);
        opacity:1
    }
}
@keyframes tarot-glimmer {
    0% {
        transform:translate(-150%)
    }
    to {
        transform:translate(150%)
    }
}
@keyframes tarot-fan {
    0% {
        transform:rotate(0) translateY(20px);
        opacity:0
    }
    to {
        transform:rotate(var(--angle));
        opacity:1
    }
}
@keyframes tarot-float {
    50% {
        transform:rotate(-5deg) translateY(-10px)
    }
}
@keyframes tarot-flap {
    25%, 65% {
        transform:rotateX(160deg)
    }
}
@keyframes tarot-send {
    0%, 15% {
        transform:translate(0) rotate(0);
        opacity:0
    }
    30% {
        opacity:1
    }
    80% {
        transform:translate(140px, -25px) rotate(50deg) scale(.4);
        opacity:0
    }
    to {
        opacity:0
    }
}
@keyframes tarot-caret {
    50% {
        opacity:0
    }
}
@media(min-width:700px) {
    .tarot-shell {
        margin:24px auto;
        border:1px solid #bfa77744;
        border-radius:24px
    }
    .tarot-main {
        padding:0 36px
    }
    .tarot-deck {
        margin-bottom:15px
    }
}
@media(max-width:350px) {
    .tarot-main, .tarot-header {
        padding:0 17px
    }
    .tarot-cards {
        gap:9px
    }
    .tarot-tier {
        padding:16px 12px;
        grid-template-columns:48px 1fr
    }
    .tarot-tier-portraits {
        width:48px
    }
    .tarot-tier-portraits img:only-child {
        width:48px;
        height:48px
    }
}
@media(prefers-reduced-motion:reduce) {
    .tarot-shell *, .tarot-shell *:before, .tarot-shell *:after {
        animation:none!important;
        transition:none!important
    }
    .tarot-card-glimmer {
        display:none
    }
}
.tarot-reading {
    min-height:270px
}
.tarot-starlight {
    position:relative;
    overflow:hidden;
    padding:24px 20px 18px;
    text-align:center;
    color:#e7cf9a;
    border:1px solid #cfad6b66;
    border-radius:14px;
    background:radial-gradient(ellipse at 50% 25%, #23394e, #102435 65%, #0a1b2b);
    box-shadow:inset 0 0 28px rgba(216, 180, 109, .05)
}
.tarot-starlight-crown {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:25px;
    color:#f1d298;
    text-shadow:0 0 20px #dcaa6666
}
.tarot-starlight-crown span {
    font-size:32px
}
.tarot-starlight-lines {
    display:grid;
    gap:21px;
    margin:27px 0
}
.tarot-starlight-lines>span {
    position:relative;
    height:3px;
    width:94%;
    border-radius:50%;
    background:linear-gradient(90deg, transparent, #b9915844, #f5dba477, #b9915844, transparent)
}
.tarot-starlight-lines>span:nth-child(2n) {
    width:77%;
    margin-left:8%
}
.tarot-starlight-lines>span:last-child {
    width:61%;
    margin-left:16%
}
.tarot-starlight-lines i {
    position:absolute;
    top:-13px;
    left:4%;
    font-size:20px;
    font-style:normal;
    opacity:.28
}
.is-shimmer .tarot-starlight-lines i {
    animation:tarot-starlight-travel 1.35s ease-in-out both;
    text-shadow:0 0 8px #fff0bf, 0 0 22px #e5b45b
}
.is-shimmer .tarot-starlight-lines>span:nth-child(2) i {
    animation-delay:.1s
}
.is-shimmer .tarot-starlight-lines>span:nth-child(3) i {
    animation-delay:.2s
}
.is-shimmer .tarot-starlight-lines>span:nth-child(4) i {
    animation-delay:.15s
}
.is-shimmer .tarot-starlight-lines>span:nth-child(5) i {
    animation-delay:.05s
}
.is-shimmer .tarot-starlight-crown {
    animation:tarot-starlight-breathe 1.4s ease-in-out
}
.tarot-starlight small {
    font-size:12px;
    letter-spacing:.1em;
    color:#b8a786
}
.tarot-reading.is-ready {
    animation:tarot-reading-arrive .6s ease-out both
}
@keyframes tarot-starlight-travel {
    0% {
        left:2%;
        opacity:0;
        transform:scale(.4) rotate(0)
    }
    45% {
        opacity:1;
        transform:scale(1.2) rotate(90deg)
    }
    to {
        left:96%;
        opacity:0;
        transform:scale(.4) rotate(180deg)
    }
}
@keyframes tarot-starlight-breathe {
    50% {
        filter:brightness(1.65);
        transform:scale(1.08)
    }
}
@keyframes tarot-reading-arrive {
    0% {
        opacity:0;
        transform:translateY(8px)
    }
    to {
        opacity:1;
        transform:translateY(0)
    }
}
@media(prefers-reduced-motion:reduce) {
    .tarot-reading, .tarot-starlight * {
        animation:none!important
    }
}
.tarot-shell[hidden] {
    display:none!important
}
.tarot-header-actions {
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    justify-content:flex-end
}
.tarot-feedback-trigger {
    border:1px solid #c7a96a66;
    border-radius:20px;
    background:#10293b;
    color:#ecd1a0;
    padding:8px 12px;
    min-height:40px;
    font-size:12px;
    white-space:nowrap
}
.tarot-footer-actions {
    text-align:center;
    margin:22px 0 0
}
.tarot-feedback .complaint-page {
    background:transparent;
    color:#f1dfbf;
    min-height:100svh
}
.tarot-feedback .complaint-page .reference-back {
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    min-height:76px;
    background:#0a2030;
    color:#ecd1a0;
    border-bottom:1px solid #c7a96a55
}
.tarot-feedback .reference-back h1 {
    font-size:21px;
    font-weight:500;
    letter-spacing:3px
}
.tarot-feedback .reference-back>button {
    position:absolute;
    left:12px;
    top:12px;
    width:48px;
    height:48px;
    background:transparent;
    border:0;
    color:#ecd1a0;
    font-size:34px
}
.tarot-feedback .complaint-reasons, .tarot-feedback .complaint-form {
    padding:20px
}
.tarot-feedback .complaint-reasons>p, .tarot-feedback .complaint-reasons h2 {
    color:#a8b2c1;
    padding:10px 0;
    font-size:14px;
    font-weight:400
}
.tarot-feedback .complaint-reasons section {
    margin:10px 0 24px
}
.tarot-feedback .complaint-reasons section>button {
    display:flex;
    justify-content:space-between;
    gap:12px;
    width:100%;
    min-height:54px;
    padding:14px;
    text-align:left;
    color:#f1dfbf;
    background:rgba(16, 41, 59, .8);
    border:1px solid #c7a96a44;
    border-radius:8px;
    margin:8px 0;
    font-size:15px
}
.tarot-feedback .complaint-reasons button span {
    color:#ecd1a0
}
.tarot-feedback .complaint-form>p {
    margin:0 0 12px;
    font-size:14px;
    line-height:1.8
}
.tarot-feedback .complaint-form strong {
    margin-left:8px;
    font-weight:500;
    color:#ecd1a0
}
.tarot-feedback .complaint-form label {
    position:relative;
    display:block;
    font-size:14px;
    margin:20px 0
}
.tarot-feedback .complaint-form input, .tarot-feedback .complaint-form textarea {
    display:block;
    width:100%;
    border:1px solid #c7a96a77;
    border-radius:10px;
    background:#061825;
    color:#fff1d5;
    padding:14px;
    font:inherit;
    font-size:16px;
    margin-top:10px
}
.tarot-feedback .complaint-form textarea {
    resize:vertical;
    padding-bottom:32px
}
.tarot-feedback input::placeholder, .tarot-feedback textarea::placeholder {
    color:#98a4b5
}
.tarot-feedback .complaint-form small {
    position:absolute;
    right:14px;
    bottom:8px;
    color:#a8b2c1;
    font-size:12px
}
.tarot-feedback .complaint-form .complaint-note {
    color:#a8b2c1;
    font-size:12px
}
.tarot-feedback .complaint-error {
    color:#ffd0b5
}
.tarot-feedback .complaint-submit, .tarot-feedback .complaint-success button {
    display:block;
    width:100%;
    margin:26px 0;
    padding:14px;
    border:1px solid #f8e1ae;
    border-radius:28px;
    background:linear-gradient(115deg, #edce91, #f9e7b8, #c99f5f);
    color:#29221b;
    font-size:17px;
    font-weight:600
}
.tarot-feedback .complaint-success, .tarot-feedback-loading {
    padding:50px 24px;
    text-align:center
}
.tarot-feedback .complaint-success>span {
    display:inline-grid;
    place-items:center;
    width:68px;
    height:68px;
    border-radius:50%;
    border:1px solid #ecd1a0;
    background:#183746;
    color:#ecd1a0;
    font-size:32px
}
.tarot-feedback .complaint-success h2 {
    margin:24px 0;
    font-size:24px;
    color:#ecd1a0
}
.tarot-feedback .complaint-success p {
    font-size:14px;
    line-height:1.9;
    overflow-wrap:anywhere;
    margin:14px 0
}
.tarot-feedback-loading>span {
    color:#ecd1a0;
    font-size:54px
}
.cultural-wait-scene {
    position:relative;
    width:min(100%, 370px);
    margin:10px auto 24px;
    isolation:isolate
}
.cultural-wait-scene svg {
    display:block;
    width:100%;
    height:auto;
    overflow:visible
}
.scene-caption {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    color:var(--c-gold);
    font-size:11px;
    letter-spacing:.18em
}
.scene-caption span {
    width:28px;
    height:1px;
    background:currentColor;
    opacity:.5
}
.scene-sparks circle, .scene-aura {
    opacity:.65
}
.dream-ripples ellipse {
    opacity:.4
}
.company-word rect {
    fill:#1b374d;
    stroke:#b79b67;
    stroke-width:.7
}
.company-word text {
    fill:#e8d19b;
    font-size:12px
}
.cultural-wait-scene.is-working .scene-aura {
    animation:scene-glow 5s ease-in-out infinite
}
.cultural-wait-scene.is-working .scene-sparks circle {
    animation:scene-spark 3.7s ease-in-out infinite
}
.scene-dream.is-working .dream-moon {
    animation:scene-float 6s ease-in-out infinite
}
.scene-dream.is-working .dream-lunar-ring {
    transform-origin:180px 130px;
    animation:scene-revolve 65s linear infinite
}
.scene-dream.is-working .cloud-far {
    animation:scene-drift 13s ease-in-out infinite
}
.scene-dream.is-working .cloud-near {
    animation:scene-drift 10s ease-in-out infinite reverse
}
.scene-dream.is-working .dream-crane {
    animation:scene-float 7s ease-in-out infinite reverse
}
.scene-dream.is-working .dream-ripples ellipse {
    transform-box:fill-box;
    transform-origin:center;
    animation:scene-ripple 4s ease-out infinite
}
.scene-dream.is-working .dream-ripples ellipse:nth-child(2) {
    animation-delay:1.2s
}
.scene-dream.is-working .dream-ripples ellipse:nth-child(3) {
    animation-delay:2.4s
}
.scene-company_naming.is-working .company-seal {
    animation:scene-float 5s ease-in-out infinite
}
.scene-company_naming.is-working .seal-trace {
    stroke-dasharray:430;
    animation:scene-engrave 7s ease-in-out infinite
}
.scene-company_naming.is-working .company-orbits {
    transform-origin:180px 163px;
    animation:scene-orbit-sway 12s ease-in-out infinite
}
.scene-company_naming.is-working .company-word {
    animation:scene-float 6s ease-in-out infinite
}
.scene-company_naming.is-working .word-right {
    animation-delay:-3s
}
.scene-company_naming.is-working .company-light {
    transform-origin:180px 263px;
    animation:scene-ripple 4s ease-out infinite
}
.scene-personal_naming.is-working .name-ink {
    stroke-dasharray:100;
    animation:scene-write 8s ease-in-out infinite
}
.scene-personal_naming.is-working .name-brush {
    transform-origin:245px 110px;
    animation:scene-brush 8s ease-in-out infinite
}
.scene-personal_naming.is-working .name-stamp {
    animation:scene-stamp 8s ease-in-out infinite
}
.scene-personal_naming.is-working .name-plum {
    transform-origin:60px 245px;
    animation:scene-branch 10s ease-in-out infinite
}
.scene-personal_naming.is-working .name-ink-ribbon {
    stroke-dasharray:300;
    animation:scene-engrave 8s ease-in-out infinite
}
.cultural-waiting {
    padding:28px 0 8px;
    min-height:0
}
.cultural-wait-copy h1 {
    font-size:26px;
    line-height:1.7;
    margin:16px 0;
    letter-spacing:.06em
}
.cultural-wait-copy>p {
    font-size:13px;
    line-height:2.1;
    color:var(--c-muted);
    max-width:480px;
    margin:0 auto;
    text-wrap:pretty
}
.cultural-waiting .cultural-wait-steps {
    padding:23px 0;
    gap:10px
}
.cultural-wait-steps li {
    min-width:0
}
.cultural-wait-steps li>div {
    display:flex;
    flex-direction:column;
    gap:7px
}
.cultural-wait-steps small {
    font-size:9px;
    font-weight:400;
    letter-spacing:.04em;
    color:var(--c-muted)
}
.cultural-wait-steps strong {
    font-size:12px;
    font-weight:500;
    line-height:1.8
}
.cultural-wait-steps .is-current span {
    animation:scene-glow 3s ease-in-out infinite
}
.waiting-dream .cultural-wait-scene {
    border-radius:48% 48% 8px 8px;
    background:radial-gradient(ellipse at 50% 45%, #fffbe9 0%, #dfe6d333 55%, transparent 72%)
}
.waiting-dream .cultural-wait-copy {
    padding:0 15px
}
.waiting-dream .cultural-record {
    border-radius:0;
    border-width:1px 0;
    background:linear-gradient(90deg, transparent, #e0e7d555, transparent)
}
.waiting-company_naming {
    position:relative;
    background:radial-gradient(ellipse at 50% 15%, #294558, #102639 73%);
    color:#f6e3b8;
    margin:0 -22px;
    padding:32px 22px 26px;
    border-bottom:3px double #b49961;
    isolation:isolate
}
.waiting-company_naming:before {
    content:"";
    position:absolute;
    top:16px;
    right:16px;
    bottom:16px;
    left:16px;
    border:1px solid #c5a96c38;
    pointer-events:none;
    z-index:-1
}
.waiting-company_naming .cultural-eyebrow, .waiting-company_naming .cultural-wait-copy>p, .waiting-company_naming .cultural-wait-steps small {
    color:#c6c1b0
}
.waiting-company_naming .cultural-wait-copy {
    text-align:left;
    padding:0 10px
}
.waiting-company_naming .cultural-wait-copy h1 {
    font-size:25px;
    max-width:270px
}
.waiting-company_naming .cultural-wait-steps {
    border:0;
    display:grid;
    grid-template-columns:1fr;
    gap:0;
    margin:25px 10px
}
.waiting-company_naming .cultural-wait-steps li {
    flex-direction:row;
    text-align:left;
    gap:16px;
    padding:15px 0;
    border-bottom:1px solid #bba27238;
    color:#f0ddba
}
.waiting-company_naming .cultural-wait-steps li>div {
    gap:3px
}
.waiting-company_naming .cultural-wait-steps span {
    border-radius:2px;
    transform:rotate(-4deg);
    width:35px;
    height:35px;
    border-color:#b99a61;
    color:#ead5a8
}
.waiting-company_naming .cultural-wait-steps .is-done span {
    background:#b89a63;
    color:#152c3b
}
.waiting-company_naming .cultural-wait-steps .is-current span {
    box-shadow:0 0 18px rgba(195, 166, 101, .19)
}
.waiting-company_naming .cultural-record {
    background:rgba(255, 255, 255, .024);
    border-color:rgba(200, 172, 113, .24);
    color:#f6e4bf
}
.waiting-company_naming .cultural-record small {
    color:#c6c1b0
}
.waiting-company_naming .cultural-record button {
    color:#f0dbb0
}
.waiting-personal_naming {
    padding-top:30px
}
.waiting-personal_naming .cultural-wait-scene {
    margin-bottom:22px;
    background:radial-gradient(ellipse, #f0debf44, transparent 72%)
}
.waiting-personal_naming .cultural-wait-copy {
    border-left:2px solid #ad6857;
    text-align:left;
    padding:0 0 0 20px;
    margin:26px 8px
}
.waiting-personal_naming .cultural-wait-copy h1 {
    font-size:27px;
    max-width:250px
}
.waiting-personal_naming .cultural-wait-steps {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    border:0;
    gap:8px;
    margin:22px 0;
    padding:10px 0
}
.waiting-personal_naming .cultural-wait-steps li {
    padding:17px 6px;
    border:1px solid #c4aa844f;
    background:rgba(255, 250, 240, .467);
    border-radius:42px 42px 3px 3px
}
.waiting-personal_naming .cultural-wait-steps span {
    border:0;
    background:none;
    color:#9b513b
}
.waiting-personal_naming .cultural-wait-steps .is-done span {
    background:none;
    color:#9b513b
}
.waiting-personal_naming .cultural-record {
    background:#fffbf2;
    border-style:dashed;
    border-radius:0;
    box-shadow:4px 4px rgba(216, 196, 164, .16)
}
.cultural-dream .cultural-form {
    border-radius:28px 4px
}
.cultural-dream .cultural-editorial {
    border-top:1px solid var(--c-line);
    padding:35px 14px 0
}
.cultural-dream .cultural-chapter-strip {
    background:transparent;
    border:0;
    box-shadow:none;
    gap:5px
}
.cultural-dream .cultural-chapter-strip b {
    width:33px;
    height:33px;
    display:grid;
    place-items:center;
    border:1px solid var(--c-line);
    border-radius:50%
}
.cultural-company_naming .cultural-form {
    border-radius:0;
    border-top:3px solid var(--c-gold);
    box-shadow:7px 7px rgba(209, 216, 220, .4)
}
.cultural-company_naming .cultural-form:before, .cultural-company_naming .cultural-form:after {
    display:none
}
.cultural-company_naming .cultural-section-heading {
    display:flex;
    gap:17px;
    align-items:center
}
.cultural-company_naming .cultural-section-heading>span {
    writing-mode:vertical-rl;
    border-right:1px solid var(--c-line);
    padding-right:12px;
    white-space:nowrap
}
.cultural-company_naming .cultural-editorial {
    text-align:left;
    border-left:3px solid var(--c-gold);
    padding-left:20px
}
.cultural-company_naming .cultural-editorial .cultural-seal {
    float:right;
    margin-left:16px
}
.cultural-personal_naming .cultural-form {
    border-radius:0;
    border-left:4px double var(--c-gold);
    border-right:4px double var(--c-gold);
    box-shadow:0 14px 25px rgba(116, 80, 54, .05)
}
.cultural-personal_naming .cultural-tabs {
    border-bottom:1px solid var(--c-line);
    gap:0
}
.cultural-personal_naming .cultural-tabs>button {
    border:0;
    border-radius:0;
    background:none
}
.cultural-personal_naming .cultural-tabs>button[aria-selected=true] {
    background:none;
    border-bottom:2px solid var(--c-accent)
}
.cultural-personal_naming .cultural-chapter-strip {
    border:0;
    background:transparent;
    box-shadow:none
}
.cultural-personal_naming .cultural-chapter-strip span {
    flex-direction:row;
    border-right:1px solid var(--c-line);
    padding-right:10px
}
.cultural-personal_naming .cultural-chapter-strip span:last-child {
    border:0;
    padding-right:0
}
.cultural-personal_naming .cultural-primary {
    border-radius:24px 4px
}
@keyframes scene-glow {
    0%, to {
        opacity:.45
    }
    50% {
        opacity:1
    }
}
@keyframes scene-spark {
    0%, to {
        opacity:.12;
        transform:translateY(3px)
    }
    50% {
        opacity:.95;
        transform:translateY(-5px)
    }
}
@keyframes scene-float {
    0%, to {
        transform:translateY(0)
    }
    50% {
        transform:translateY(-9px)
    }
}
@keyframes scene-drift {
    0%, to {
        transform:translate(-8px)
    }
    50% {
        transform:translate(9px)
    }
}
@keyframes scene-revolve {
    to {
        transform:rotate(360deg)
    }
}
@keyframes scene-ripple {
    0% {
        transform:scaleX(.7);
        opacity:.1
    }
    40% {
        opacity:.65
    }
    to {
        transform:scaleX(1.08);
        opacity:.05
    }
}
@keyframes scene-orbit-sway {
    0%, to {
        transform:rotate(-7deg)
    }
    50% {
        transform:rotate(7deg)
    }
}
@keyframes scene-engrave {
    0% {
        stroke-dashoffset:430;
        opacity:.25
    }
    60%, 85% {
        stroke-dashoffset:0;
        opacity:1
    }
    to {
        stroke-dashoffset:0;
        opacity:.25
    }
}
@keyframes scene-write {
    0%, 8% {
        stroke-dashoffset:100;
        opacity:0
    }
    18% {
        opacity:1
    }
    70%, 90% {
        stroke-dashoffset:0;
        opacity:1
    }
    to {
        stroke-dashoffset:0;
        opacity:0
    }
}
@keyframes scene-brush {
    0%, to {
        transform:translate(0) rotate(27deg)
    }
    35% {
        transform:translate(-28px, 17px) rotate(34deg)
    }
    70% {
        transform:translate(-10px, 56px) rotate(22deg)
    }
}
@keyframes scene-stamp {
    0%, 65%, to {
        opacity:0
    }
    78%, 90% {
        opacity:1
    }
}
@keyframes scene-branch {
    0%, to {
        transform:rotate(-1deg)
    }
    50% {
        transform:rotate(2deg)
    }
}
@media(min-width:600px) {
    .waiting-company_naming {
        margin-left:-45px;
        margin-right:-45px;
        padding:38px 55px
    }
    .waiting-company_naming .cultural-wait-copy h1 {
        max-width:none
    }
    .cultural-wait-scene {
        width:390px
    }
    .cultural-wait-copy h1 {
        font-size:30px
    }
}
@media(prefers-reduced-motion:reduce) {
    .cultural-wait-scene *, .cultural-wait-steps * {
        animation:none!important
    }
    .name-ink, .name-stamp {
        opacity:1!important;
        stroke-dashoffset:0!important
    }
}
html[data-cultural-product] {
    --c-bg:#f3f1e7;
    --c-paper:#fffdf5;
    --c-ink:#2c4c40;
    --c-muted:#708075;
    --c-accent:#355d4b;
    --c-gold:#b69a62;
    --c-line:#c8bea0;
    --c-soft:#e8ecdf;
    background:var(--c-bg);
    color:var(--c-ink)
}
html[data-cultural-product=company_naming] {
    --c-bg:#eef0f1;
    --c-paper:#fffdf7;
    --c-ink:#21364b;
    --c-muted:#677684;
    --c-accent:#213d56;
    --c-gold:#b89760;
    --c-line:#c9bea8;
    --c-soft:#e3e8ed
}
html[data-cultural-product=personal_naming] {
    --c-bg:#f6f0e5;
    --c-paper:#fffaf0;
    --c-ink:#573b30;
    --c-muted:#8d7768;
    --c-accent:#9d473a;
    --c-gold:#bc9663;
    --c-line:#d9c6a4;
    --c-soft:#f0e5d5
}
html[data-cultural-product] body {
    background:var(--c-bg);
    color:var(--c-ink);
    font-family:"Noto Serif SC", Songti SC, STSong, serif
}
.cultural-shell {
    max-width:780px;
    margin:auto;
    min-height:100vh;
    min-height:100svh;
    overflow:hidden;
    color:var(--c-ink);
    background:var(--c-bg)
}
.cultural-shell * {
    box-sizing:border-box
}
.cultural-shell button, .cultural-shell input, .cultural-shell textarea {
    font:inherit
}
.cultural-shell button, .cultural-shell a {
    -webkit-tap-highlight-color:transparent
}
.cultural-shell button {
    cursor:pointer
}
.cultural-shell button:disabled {
    cursor:default;
    opacity:.55
}
.cultural-shell button:focus-visible, .cultural-shell a:focus-visible {
    outline:2px solid var(--c-gold);
    outline-offset:4px
}
.cultural-header {
    height:68px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:0 24px;
    border-bottom:1px solid var(--c-line);
    font-size:15px;
    letter-spacing:.1em
}
.cultural-header>button {
    border:0;
    background:none;
    color:var(--c-ink);
    padding:0;
    font-size:30px;
    min-width:36px;
    min-height:36px
}
.cultural-header>a, .cultural-header-note {
    margin-left:auto;
    color:var(--c-muted);
    font-size:12px;
    text-decoration:none;
    letter-spacing:.03em
}
.cultural-seal {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:37px;
    height:40px;
    border:1px solid var(--c-gold);
    border-radius:4px 10px 4px 9px;
    font-size:24px;
    font-weight:400;
    color:var(--c-accent);
    outline:1px solid var(--c-gold);
    outline-offset:-4px;
    line-height:1
}
.cultural-main {
    padding:0 22px 42px
}
.cultural-eyebrow {
    color:var(--c-muted);
    font-size:11px;
    letter-spacing:.2em;
    line-height:1.8
}
.cultural-hero {
    position:relative;
    min-height:345px;
    margin:0 -22px;
    padding:37px 26px 64px;
    display:flex;
    align-items:center;
    isolation:isolate
}
.cultural-hero>img {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    z-index:-2
}
.cultural-hero:after {
    content:"";
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:-1;
    background:linear-gradient(90deg, rgba(243, 241, 231, .85), rgba(243, 241, 231, .09) 76%), linear-gradient(0deg, var(--c-bg), transparent 35%)
}
.cultural-hero-copy {
    width:66%;
    position:relative;
    z-index:1
}
.cultural-hero h1 {
    font-weight:500;
    font-size:clamp(30px, 7.7vw, 50px);
    line-height:1.65;
    letter-spacing:.13em;
    margin:12px 0 18px;
    white-space:nowrap
}
.cultural-hero-copy>p:last-child {
    font-size:12px;
    line-height:2.1;
    max-width:210px;
    color:var(--c-muted)
}
.cultural-hero-stamp {
    position:absolute;
    right:25px;
    bottom:40px;
    writing-mode:vertical-rl;
    border:1px solid var(--c-gold);
    color:var(--c-accent);
    padding:7px 4px;
    font-size:10px;
    letter-spacing:.14em;
    border-radius:2px
}
.cultural-company_naming .cultural-hero {
    color:#f3dfb4;
    min-height:380px;
    padding-bottom:115px
}
.cultural-company_naming .cultural-hero:after {
    background:linear-gradient(90deg, rgba(16, 39, 62, .94), rgba(16, 39, 62, .2)), linear-gradient(0deg, var(--c-bg), transparent 15%)
}
.cultural-company_naming .cultural-hero-copy>p, .cultural-company_naming .cultural-hero .cultural-eyebrow {
    color:#d1c29f
}
.cultural-company_naming .cultural-hero-stamp {
    color:#f3dfb4;
    bottom:65px
}
.cultural-personal_naming .cultural-hero:after {
    background:linear-gradient(90deg, rgba(246, 240, 229, .85), rgba(246, 240, 229, .063)), linear-gradient(0deg, var(--c-bg), transparent 30%)
}
.cultural-hero.is-small {
    min-height:220px;
    padding-top:20px;
    padding-bottom:20px
}
.cultural-hero.is-small h1 {
    font-size:27px;
    margin:8px 0
}
.cultural-hero.is-small .cultural-hero-copy>p:last-child {
    display:none
}
.cultural-chapter-strip {
    display:flex;
    position:relative;
    gap:10px;
    justify-content:space-around;
    margin:-21px 0 22px;
    padding:17px 8px;
    border-top:1px solid var(--c-line);
    border-bottom:1px solid var(--c-line);
    background:var(--c-paper);
    border-radius:3px;
    box-shadow:0 8px 20px rgba(19, 51, 34, .03)
}
.cultural-chapter-strip span {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:7px;
    font-size:10px;
    letter-spacing:.08em
}
.cultural-chapter-strip b {
    font-size:17px;
    color:var(--c-gold);
    font-weight:400
}
.cultural-card {
    position:relative;
    border:1px solid var(--c-line);
    background:var(--c-paper);
    padding:26px 22px;
    border-radius:5px;
    margin:20px 0;
    box-shadow:0 8px 26px rgba(27, 51, 35, .04)
}
.cultural-card:before, .cultural-card:after {
    content:"";
    position:absolute;
    width:12px;
    height:12px;
    border-color:var(--c-gold);
    pointer-events:none
}
.cultural-card:before {
    left:5px;
    top:5px;
    border-left:1px solid;
    border-top:1px solid
}
.cultural-card:after {
    right:5px;
    bottom:5px;
    border-right:1px solid;
    border-bottom:1px solid
}
.cultural-section-heading {
    margin-bottom:25px
}
.cultural-section-heading>span {
    font-size:11px;
    letter-spacing:.16em;
    color:var(--c-gold)
}
.cultural-section-heading h2 {
    font-size:20px;
    line-height:1.65;
    font-weight:500;
    letter-spacing:.06em;
    margin:8px 0 0
}
.cultural-field {
    display:flex;
    flex-direction:column;
    gap:10px;
    margin:21px 0;
    font-size:14px;
    color:var(--c-ink)
}
.cultural-field>span, .cultural-label {
    letter-spacing:.08em;
    font-size:13px
}
.cultural-field input, .cultural-field textarea, .cultural-field-picker {
    width:100%;
    min-height:48px;
    background:transparent;
    border:1px solid var(--c-line);
    border-radius:3px;
    padding:12px;
    color:var(--c-ink);
    font-size:15px;
    box-shadow:none
}
.cultural-field textarea {
    resize:vertical;
    line-height:1.9
}
.cultural-field input::placeholder, .cultural-field textarea::placeholder {
    color:var(--c-muted);
    font-size:13px;
    opacity:.8
}
.cultural-field-picker {
    display:flex;
    text-align:left;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    line-height:1.6
}
.cultural-field-picker b {
    font-weight:400;
    color:var(--c-gold)
}
.cultural-field>small {
    font-size:11px;
    color:var(--c-muted);
    line-height:1.8
}
.cultural-question {
    position:relative
}
.cultural-question textarea {
    padding-bottom:32px
}
.cultural-question>small {
    position:absolute;
    right:13px;
    bottom:9px
}
.cultural-choice, .cultural-tabs {
    display:flex;
    gap:10px
}
.cultural-choice>button, .cultural-tabs>button {
    flex:1;
    padding:11px 3px;
    background:transparent;
    color:var(--c-muted);
    border:1px solid var(--c-line);
    border-radius:3px;
    font-size:14px
}
.cultural-choice>button[aria-checked=true], .cultural-tabs>button[aria-selected=true] {
    background:var(--c-soft);
    border-color:var(--c-accent);
    color:var(--c-accent)
}
.cultural-tabs {
    margin:0 -3px 22px;
    gap:6px
}
.cultural-tabs>button {
    font-size:13px;
    padding:12px 2px
}
.cultural-industry-chips {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin:-8px 0 22px
}
.cultural-industry-chips button {
    font-size:10px;
    color:var(--c-muted);
    background:var(--c-soft);
    border:0;
    padding:6px 10px;
    border-radius:20px
}
.cultural-consents {
    font-family:system-ui, sans-serif;
    font-size:10px;
    line-height:2.4;
    color:var(--c-muted);
    margin:21px 0 15px
}
.cultural-consents label {
    display:inline-flex;
    align-items:center;
    gap:5px
}
.cultural-consents input {
    accent-color:var(--c-accent);
    width:14px;
    height:14px;
    vertical-align:middle
}
.cultural-consents button {
    font:inherit;
    border:0;
    background:none;
    color:var(--c-accent);
    padding:0 2px
}
.cultural-primary, .cultural-secondary {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    width:100%;
    min-height:52px;
    padding:13px 19px;
    border-radius:4px;
    text-align:center;
    font:inherit;
    font-size:16px;
    text-decoration:none;
    line-height:1.7
}
.cultural-primary {
    background:linear-gradient(110deg, var(--c-accent), color-mix(in srgb, var(--c-accent) 82%, #000));
    background-color:var(--c-accent);
    color:#fffaf0;
    border:1px solid var(--c-accent);
    box-shadow:0 5px 13px rgba(24, 50, 37, .07)
}
.cultural-primary span, .cultural-secondary span {
    margin-left:auto;
    font-size:22px
}
.cultural-secondary {
    background:transparent;
    border:1px solid var(--c-gold);
    color:var(--c-accent)
}
.cultural-small {
    font-family:system-ui, sans-serif;
    font-size:11px;
    color:var(--c-muted);
    line-height:1.9;
    text-align:center;
    margin:15px 0
}
.cultural-error {
    color:#ab493b;
    font-family:system-ui, sans-serif;
    font-size:13px;
    line-height:1.8
}
.cultural-editorial {
    text-align:center;
    margin:44px 5px 32px
}
.cultural-editorial .cultural-seal {
    margin-bottom:12px
}
.cultural-editorial h2 {
    font-size:20px;
    letter-spacing:.1em;
    font-weight:500
}
.cultural-editorial p {
    color:var(--c-muted);
    font-size:13px;
    line-height:2.1;
    text-align:justify
}
.cultural-endnote {
    display:flex;
    align-items:center;
    gap:15px;
    justify-content:center;
    letter-spacing:.22em;
    font-size:10px;
    color:var(--c-gold);
    margin:0 0 35px
}
.cultural-endnote:before, .cultural-endnote:after {
    content:"";
    width:25px;
    height:1px;
    background:var(--c-line)
}
.cultural-loading {
    text-align:center;
    padding:48px 6px 20px;
    min-height:65vh
}
.cultural-loading h1 {
    font-size:26px;
    line-height:1.7;
    letter-spacing:.08em;
    font-weight:500
}
.cultural-loading>p {
    font-size:13px;
    line-height:2;
    color:var(--c-muted)
}
.cultural-motion {
    width:160px;
    height:160px;
    position:relative;
    margin:35px auto;
    display:grid;
    place-items:center
}
.cultural-motion>span {
    font-size:48px;
    color:var(--c-accent);
    font-weight:400;
    animation:cultural-breathe 3s ease-in-out infinite
}
.cultural-motion>i {
    position:absolute;
    border:1px solid var(--c-gold);
    border-radius:50%;
    top:8px;
    right:8px;
    bottom:8px;
    left:8px;
    opacity:.6;
    animation:cultural-orbit 14s linear infinite
}
.cultural-motion>i:nth-child(2) {
    top:0;
    right:0;
    bottom:0;
    left:0;
    border:1px dashed var(--c-line);
    animation-direction:reverse
}
.cultural-motion>i:nth-child(3) {
    top:25px;
    right:25px;
    bottom:25px;
    left:25px;
    border-color:var(--c-line);
    border-radius:42%;
    animation-duration:18s
}
.cultural-motion>b {
    position:absolute;
    width:5px;
    height:5px;
    border-radius:50%;
    background:var(--c-gold);
    left:15px;
    top:35px;
    box-shadow:0 0 13px #c5ac71;
    animation:cultural-breathe 2s infinite
}
.cultural-motion>b:nth-last-child(2) {
    left:auto;
    right:15px;
    top:auto;
    bottom:20px;
    animation-delay:.7s
}
.cultural-motion>b:last-child {
    left:auto;
    right:24px;
    top:16px;
    animation-delay:1.4s
}
.motion-company_naming>i {
    border-radius:4px;
    top:24px;
    right:24px;
    bottom:24px;
    left:24px;
    transform:rotate(45deg);
    animation:cultural-breathe 4s ease-in-out infinite
}
.motion-company_naming>i:nth-child(2) {
    top:7px;
    right:7px;
    bottom:7px;
    left:7px;
    animation-delay:1s
}
.motion-company_naming>i:nth-child(3) {
    top:39px;
    right:39px;
    bottom:39px;
    left:39px;
    transform:rotate(45deg);
    animation-delay:2s
}
.motion-personal_naming>i {
    border-radius:2px;
    top:15px;
    right:37px;
    bottom:15px;
    left:37px;
    animation:cultural-scroll 4s ease-in-out infinite
}
.motion-personal_naming>i:nth-child(2) {
    top:5px;
    right:30px;
    bottom:5px;
    left:30px;
    border-style:solid;
    animation-delay:1s
}
.motion-personal_naming>i:nth-child(3) {
    top:26px;
    right:23px;
    bottom:26px;
    left:23px;
    animation-delay:2s
}
.cultural-motion.is-paused * {
    animation-play-state:paused
}
.cultural-wait-steps {
    padding:25px 8px;
    list-style:none;
    display:flex;
    gap:8px;
    justify-content:space-between;
    border-top:1px solid var(--c-line);
    border-bottom:1px solid var(--c-line);
    margin:28px 0
}
.cultural-wait-steps li {
    display:flex;
    flex:1;
    flex-direction:column;
    gap:11px;
    align-items:center;
    font-size:11px;
    color:var(--c-muted)
}
.cultural-wait-steps span {
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    border:1px solid var(--c-line);
    border-radius:50%;
    font-size:15px
}
.cultural-wait-steps .is-done span {
    background:var(--c-accent);
    color:var(--c-paper);
    border-color:var(--c-accent)
}
.cultural-wait-steps .is-current span {
    box-shadow:0 0 0 5px var(--c-soft);
    border-color:var(--c-gold)
}
.cultural-record {
    display:flex;
    align-items:center;
    padding:15px 13px;
    gap:10px;
    border:1px solid var(--c-line);
    border-radius:4px;
    margin:25px 0;
    text-align:left
}
.cultural-record>div {
    flex:1;
    min-width:0
}
.cultural-record small {
    display:block;
    color:var(--c-muted);
    font-size:10px;
    margin-bottom:7px
}
.cultural-record strong {
    font-family:system-ui, sans-serif;
    font-size:14px;
    word-break:break-all;
    font-weight:500
}
.cultural-record button {
    border:1px solid var(--c-gold);
    border-radius:3px;
    color:var(--c-accent);
    background:transparent;
    padding:8px 10px;
    white-space:nowrap;
    font-size:12px
}
.cultural-action-stack {
    display:flex;
    flex-direction:column;
    gap:12px
}
.cultural-contact {
    text-align:center
}
.cultural-contact>h2 {
    font-weight:500;
    font-size:23px
}
.cultural-contact>p {
    font-size:13px;
    line-height:2;
    text-align:justify;
    color:var(--c-muted)
}
.cultural-contact .enterprise-wechat-qr {
    margin-top:24px
}
.cultural-page-title {
    text-align:center;
    padding:27px 0 10px
}
.cultural-page-title h1 {
    font-weight:500;
    line-height:1.7;
    font-size:25px;
    letter-spacing:.06em
}
.cultural-page-title>p:last-child {
    font-size:12px;
    color:var(--c-muted)
}
.cultural-pillar-preview {
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    border-top:1px solid var(--c-line);
    border-bottom:1px solid var(--c-line)
}
.cultural-pillar-preview>div {
    padding:13px 0;
    text-align:center;
    display:flex;
    flex-direction:column;
    gap:10px;
    border-right:1px solid var(--c-line)
}
.cultural-pillar-preview>div:last-child {
    border-right:0
}
.cultural-pillar-preview small {
    font-size:11px;
    color:var(--c-muted)
}
.cultural-pillar-preview strong {
    font-weight:500;
    font-size:20px;
    letter-spacing:.12em
}
.cultural-preview-meta {
    display:flex;
    justify-content:space-around;
    padding:16px 0;
    font-size:12px;
    gap:8px
}
.cultural-preview-meta b {
    font-size:16px;
    font-weight:500;
    margin-left:8px
}
.cultural-element-preview {
    display:flex;
    justify-content:space-around;
    gap:5px;
    font-size:12px
}
.cultural-element-preview b {
    display:block;
    font-size:11px;
    font-weight:400;
    margin-top:6px;
    color:var(--c-muted)
}
.cultural-teachers {
    height:245px;
    display:flex;
    align-items:end;
    justify-content:space-between;
    margin:20px -5px 0;
    overflow:hidden;
    border-bottom:1px solid var(--c-line);
    background:radial-gradient(ellipse at bottom, #c4c5a854, transparent 70%)
}
.cultural-teachers>div {
    padding-bottom:25px;
    padding-left:18px;
    width:62%;
    z-index:1
}
.cultural-teachers h2 {
    font-size:23px;
    font-weight:500;
    line-height:1.8
}
.cultural-teachers p {
    font-size:12px;
    line-height:2;
    color:var(--c-muted)
}
.cultural-teachers>img {
    width:47%;
    height:235px;
    object-fit:contain;
    object-position:bottom;
    flex-shrink:0;
    margin-left:-40px
}
.cultural-teachers.has-two {
    height:210px
}
.cultural-teachers.has-two>img {
    width:35%;
    height:190px;
    margin:0 -10px
}
.cultural-teachers.has-two>div {
    align-self:flex-start;
    width:auto;
    text-align:center;
    padding:12px 0 0
}
.cultural-teachers.has-two h2 {
    font-size:17px;
    white-space:nowrap
}
.cultural-teachers.has-two p {
    font-size:10px
}
.cultural-price-card {
    text-align:center;
    padding:23px
}
.cultural-price-card>span {
    font-size:11px;
    color:var(--c-muted)
}
.cultural-price-card h2 {
    font-size:20px;
    font-weight:500;
    margin:8px 0
}
.cultural-price {
    font-family:Georgia, serif;
    font-size:46px;
    line-height:1.6;
    color:var(--c-accent)
}
.cultural-price small {
    font-size:20px;
    margin-right:5px
}
.cultural-price-card p {
    font-size:11px;
    line-height:1.8;
    color:var(--c-muted)
}
.cultural-payment h2 {
    font-size:17px;
    font-weight:500;
    margin:0 0 18px
}
.cultural-payment[role=radio] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:14px 12px;
    margin-bottom:11px;
    width:100%;
    border:1px solid var(--c-line);
    border-radius:3px;
    color:var(--c-ink);
    background:transparent;
    font-size:14px
}
.cultural-payment[aria-checked=true] {
    border-color:var(--c-accent);
    background:var(--c-soft)
}
.cultural-payment[role=radio] b {
    font-size:13px;
    font-weight:400;
    color:var(--c-accent)
}
.cultural-payment-recovery button {
    display:block;
    width:100%;
    margin-top:12px;
    min-height:45px;
    border:1px solid var(--c-line);
    background:transparent;
    color:var(--c-accent);
    font:inherit;
    border-radius:4px
}
html[data-cultural-product] .site-public-footer {
    background:var(--c-bg);
    color:var(--c-muted);
    font-family:system-ui, sans-serif;
    font-size:10px;
    border-color:var(--c-line)
}
html[data-cultural-product] .contact-phone-backdrop, html[data-cultural-product] .history-modal-backdrop, html[data-cultural-product] .teacher-contact-prompt-backdrop, html[data-cultural-product] .birth-profile-mobile-sheet-backdrop {
    background:rgba(24, 45, 40, .5);
    backdrop-filter:blur(4px)
}
html[data-cultural-product] .contact-phone-panel, html[data-cultural-product] .record-recovery-modal, html[data-cultural-product] .teacher-contact-prompt, html[data-cultural-product] .birth-profile-mobile-sheet, html[data-cultural-product] .agreement-modal {
    background:var(--c-paper);
    border:1px solid var(--c-gold);
    border-radius:8px;
    box-shadow:0 18px 70px rgba(16, 38, 31, .19);
    color:var(--c-ink);
    font-family:inherit
}
html[data-cultural-product] .contact-phone-panel h2, html[data-cultural-product] .record-recovery-modal h2, html[data-cultural-product] .teacher-contact-prompt h2 {
    font-weight:500;
    font-size:22px;
    color:var(--c-accent)
}
html[data-cultural-product] .contact-phone-panel p, html[data-cultural-product] .record-recovery-modal p, html[data-cultural-product] .teacher-contact-prompt p {
    color:var(--c-muted);
    font-size:12px;
    line-height:2
}
html[data-cultural-product] .contact-phone-panel input, html[data-cultural-product] .record-recovery-input {
    background:transparent;
    border:1px solid var(--c-line);
    border-radius:3px;
    color:var(--c-ink)
}
html[data-cultural-product] .contact-phone-panel button[type=submit], html[data-cultural-product] .record-recovery-modal .primary-button, html[data-cultural-product] .teacher-contact-prompt button {
    background:var(--c-accent);
    color:var(--c-paper);
    border:1px solid var(--c-accent);
    border-radius:4px
}
html[data-cultural-product] .contact-phone-record, html[data-cultural-product] .contact-phone-record-copy {
    color:var(--c-accent);
    background:var(--c-soft);
    border-color:var(--c-line)
}
html[data-cultural-product] .record-recovery-mark {
    border-color:var(--c-gold);
    color:var(--c-accent);
    background:none
}
html[data-cultural-product] .birth-sheet-header h2 {
    color:var(--c-accent)
}
html[data-cultural-product] .birth-wheel-highlight {
    background:transparent;
    border-color:var(--c-gold)
}
html[data-cultural-product] .birth-wheel-item.is-selected {
    color:var(--c-accent)
}
html[data-cultural-product] .birth-calendar-tabs .is-selected, html[data-cultural-product] .birth-sheet-button.is-primary {
    background:var(--c-accent);
    color:var(--c-paper)
}
html[data-cultural-product] .birth-wheel-picker[data-date-only=true] .birth-wheel-column, .cultural-city-wheels .birth-wheel-column {
    width:33.333333%
}
.cultural-city-wheels .birth-wheel-item {
    font-size:13px;
    white-space:normal;
    line-height:1.3;
    padding:0 3px
}
.cultural-city-sheet .birth-sheet-header {
    margin-bottom:15px
}
@keyframes cultural-breathe {
    0%, to {
        opacity:.45;
        filter:brightness(.95)
    }
    50% {
        opacity:1;
        filter:brightness(1.1)
    }
}
@keyframes cultural-orbit {
    to {
        transform:rotate(360deg)
    }
}
@keyframes cultural-scroll {
    0%, to {
        transform:scaleX(.82);
        opacity:.3
    }
    50% {
        transform:scaleX(1.12);
        opacity:.85
    }
}
@media(min-width:600px) {
    .cultural-main {
        padding-left:45px;
        padding-right:45px
    }
    .cultural-hero {
        margin-left:-45px;
        margin-right:-45px;
        padding-left:52px;
        min-height:430px
    }
    .cultural-hero h1 {
        font-size:48px
    }
    .cultural-card {
        padding:36px
    }
    .cultural-chapter-strip span {
        font-size:13px
    }
    .cultural-hero-copy>p:last-child {
        font-size:15px;
        max-width:300px
    }
    .cultural-teachers {
        height:300px
    }
    .cultural-teachers>img {
        height:300px
    }
    .cultural-teachers.has-two {
        height:280px
    }
    .cultural-teachers.has-two>img {
        height:265px
    }
    .cultural-teachers.has-two>div {
        align-self:center
    }
    .cultural-teachers.has-two h2 {
        font-size:25px
    }
    .cultural-teachers.has-two p {
        font-size:13px
    }
}
@media(prefers-reduced-motion:reduce) {
    .cultural-motion * {
        animation:none!important;
        transform:none!important
    }
}
.cultural-report-cover {
    position:relative;
    min-height:360px;
    isolation:isolate;
    text-align:center;
    margin:0 -22px;
    padding:48px 22px 38px;
    overflow:hidden
}
.cultural-report-cover>img {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    z-index:-2;
    opacity:.3
}
.cultural-report-cover:after {
    content:"";
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:-1;
    background:linear-gradient(0deg, var(--c-bg), transparent 70%)
}
.cultural-report-cover h1 {
    font-size:36px;
    letter-spacing:.22em;
    font-weight:500;
    line-height:1.8;
    margin:22px 0
}
.cultural-report-cover .cultural-seal {
    margin-top:20px
}
.cultural-report-cover p:last-child {
    font-size:13px;
    letter-spacing:.12em
}
.cultural-company_naming .cultural-report-cover {
    background:#142c42;
    color:#f7e2b8
}
.cultural-company_naming .cultural-report-cover .cultural-seal {
    color:#f7e2b8
}
.cultural-company_naming .cultural-report-cover .cultural-eyebrow {
    color:#d7c299
}
.cultural-report-brief blockquote {
    margin:15px 0;
    font-size:17px;
    line-height:2.1;
    border-left:2px solid var(--c-gold);
    padding-left:16px;
    overflow-wrap:anywhere
}
.cultural-report-brief>p {
    line-height:1.9
}
.cultural-report-dates {
    font-size:12px;
    line-height:2;
    padding:14px 18px;
    border:1px solid var(--c-line);
    background:var(--c-paper)
}
.cultural-report-dates>div {
    display:flex;
    gap:16px
}
.cultural-report-dates dt {
    flex-shrink:0;
    color:var(--c-muted);
    min-width:30px
}
.cultural-report-dates dd {
    margin:0
}
.cultural-facts {
    margin:35px 0
}
.cultural-facts .report-card {
    margin:15px 0;
    padding:0;
    border:1px solid var(--c-line);
    border-radius:4px;
    box-shadow:none;
    background:var(--c-paper)
}
.cultural-facts .table-scroll {
    overflow-x:auto
}
.cultural-facts .report-data-table {
    width:100%;
    min-width:280px;
    border-collapse:collapse;
    font-size:11px;
    text-align:center;
    color:var(--c-ink);
    table-layout:fixed
}
.cultural-facts .report-data-table th, .cultural-facts .report-data-table td {
    padding:13px 4px;
    border:1px solid var(--c-line);
    line-height:1.8;
    background:transparent;
    word-break:break-all;
    font-weight:400
}
.cultural-facts .report-data-table thead, .cultural-facts .report-data-table th[scope=row] {
    background:var(--c-soft);
    color:var(--c-accent)
}
.cultural-facts .report-pillar-item {
    display:block;
    white-space:normal
}
.cultural-facts .report-visually-hidden {
    position:absolute;
    width:1px;
    height:1px;
    clip:rect(0, 0, 0, 0);
    overflow:hidden
}
.cultural-report-index {
    border-top:1px solid var(--c-line);
    border-bottom:1px solid var(--c-line);
    padding:12px 0;
    margin:25px 0
}
.cultural-report-index a {
    display:flex;
    gap:14px;
    align-items:center;
    text-decoration:none;
    color:var(--c-ink);
    font-size:13px;
    padding:11px 5px
}
.cultural-report-index small {
    font-family:Georgia, serif;
    color:var(--c-gold)
}
.cultural-report-index span {
    margin-left:auto;
    color:var(--c-gold)
}
.cultural-report-section {
    scroll-margin-top:20px
}
.cultural-report-section>header {
    display:flex;
    align-items:center;
    gap:15px;
    border-bottom:1px solid var(--c-line);
    padding-bottom:19px;
    margin-bottom:25px
}
.cultural-section-number {
    font:italic 32px Georgia, serif;
    color:var(--c-gold)
}
.cultural-report-section h2 {
    font-size:23px;
    line-height:1.6;
    font-weight:500;
    margin:0
}
.cultural-report-section h3 {
    font-size:17px;
    line-height:1.8;
    font-weight:500;
    color:var(--c-accent);
    margin:25px 0 12px;
    padding-left:12px;
    border-left:2px solid var(--c-gold)
}
.cultural-report-section article p {
    font-size:15px;
    line-height:2.2;
    text-align:justify;
    overflow-wrap:anywhere;
    margin:14px 0
}
.cultural-report-highlights {
    padding:16px 19px 16px 34px;
    background:var(--c-soft);
    line-height:2;
    font-size:14px
}
.cultural-name-table-wrap {
    margin:27px 0;
    max-width:100%;
    min-width:0
}
.cultural-name-table {
    width:100%;
    min-width:0;
    max-width:100%;
    border-collapse:collapse;
    table-layout:fixed;
    font-size:13px
}
.cultural-name-table caption {
    font-size:18px;
    line-height:1.8;
    padding:15px;
    background:var(--c-soft);
    color:var(--c-accent)
}
.cultural-name-table th, .cultural-name-table td {
    border:1px solid var(--c-line);
    padding:15px 12px;
    line-height:2;
    overflow-wrap:anywhere;
    text-align:left
}
.cultural-name-table th:first-child {
    width:32%
}
.cultural-name-table thead th {
    background:var(--c-soft);
    font-size:11px;
    font-weight:400
}
.cultural-name-table tbody th {
    font-weight:500;
    text-align:center
}
.cultural-name-table tbody strong {
    font-size:18px;
    font-weight:500
}
.cultural-name-table small {
    display:block;
    font-family:Georgia, serif;
    font-size:15px;
    color:var(--c-gold)
}
.cultural-section-contact {
    margin-top:30px;
    border-top:1px dashed var(--c-line);
    padding-top:15px
}
.cultural-section-contact>p {
    font-size:12px;
    line-height:2;
    color:var(--c-muted)
}
.cultural-section-contact .report-explanation-contact, .cultural-contact .report-explanation-contact {
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    background:var(--c-accent);
    color:var(--c-paper);
    border:1px solid var(--c-accent);
    border-radius:4px;
    box-shadow:none;
    padding:14px;
    font-size:15px;
    text-decoration:none;
    line-height:1.7
}
html[data-cultural-product] .teacher-contact-modal .primary-button, html[data-cultural-product] .modal-card .secondary-button {
    background:var(--c-accent);
    color:var(--c-paper);
    border-color:var(--c-accent);
    border-radius:4px
}
html[data-cultural-product] .modal-card {
    background:var(--c-paper);
    color:var(--c-ink);
    border:1px solid var(--c-gold);
    border-radius:8px
}
html[data-cultural-product] .modal-backdrop {
    background:rgba(24, 45, 40, .5)
}
html[data-cultural-product] .site-public-footer {
    padding:24px;
    text-align:center
}
html[data-cultural-product] .page-shell, html[data-cultural-product] .status-main {
    visibility:hidden
}
@media(min-width:600px) {
    .cultural-report-cover {
        margin-left:-45px;
        margin-right:-45px;
        min-height:400px
    }
    .cultural-report-section article p {
        font-size:17px
    }
    .cultural-facts .report-data-table {
        font-size:14px
    }
}
html[data-cultural-product=marriage_analysis] {
    background:#b92727;
    --paper:#fff2db;
    --ink:#623124;
    --muted:#84665b;
    --accent:#a91e2e;
    --line:#d9ac75
}
html[data-cultural-product=marriage_analysis] body {
    background:#b92727
}
.marriage-shell, .landing-marriage {
    width:100%;
    max-width:750px;
    margin:0 auto;
    color:#623124;
    background:#b92727;
    font-family:Arial, Microsoft YaHei, sans-serif
}
.marriage-shell *, .landing-marriage * {
    box-sizing:border-box
}
.marriage-shell .reference-image {
    display:block;
    width:100%;
    height:auto
}
html[data-cultural-product=marriage_analysis] .landing-marriage.page-shell {
    padding:0;
    overflow:hidden;
    box-shadow:none;
    visibility:visible
}
.landing-marriage .marriage-home-hero {
    width:100%;
    padding:0
}
.landing-marriage .marriage-home-hero img {
    width:100%;
    height:auto;
    display:block
}
.landing-marriage .landing-content {
    position:relative;
    padding:0 5%;
    margin-top:-70%
}
.landing-marriage .landing-form-card {
    padding:0;
    background:none;
    border:0;
    box-shadow:none;
    border-radius:0
}
.landing-marriage .landing-form-card:before, .landing-marriage .landing-form-card:after {
    display:none
}
.landing-marriage .landing-card-notch, .landing-marriage .landing-form-heading, .landing-marriage .field-with-icon img, .landing-marriage .field-with-icon svg, .landing-marriage .landing-submit-arrow {
    display:none
}
.landing-marriage .landing-form {
    display:flex;
    flex-direction:column;
    gap:0;
    padding:0
}
.landing-marriage .landing-field {
    background:#fff0cf;
    margin:0;
    padding:12px 8%;
    min-height:48px;
    display:grid;
    grid-template-columns:84px minmax(0, 1fr);
    align-items:center;
    border:0;
    border-left:3px double #ba4538;
    border-right:3px double #ba4538;
    border-bottom:1px solid #e8cead
}
.landing-marriage .landing-field:first-of-type {
    border-top:3px double #ba4538;
    border-radius:2px 2px 0 0
}
.landing-marriage .landing-field:nth-of-type(4) {
    border-bottom:3px double #ba4538
}
.landing-marriage .field-label, .landing-marriage .field-with-icon {
    color:#942d24;
    font-size:14px;
    font-weight:700;
    letter-spacing:0;
    gap:0
}
.landing-marriage .text-input, .landing-marriage .birth-date-trigger {
    width:100%;
    min-height:30px;
    height:auto;
    border:0;
    background:none;
    border-radius:0;
    font-size:14px;
    padding:3px 0;
    color:#64372d
}
.landing-marriage .landing-phone-field {
    order:1;
    border-bottom:3px double #ba4538
}
.landing-marriage .landing-phone-hint {
    font-size:11px;
    color:#946b59;
    margin:4px 0 0;
    line-height:1.5
}
.landing-marriage .landing-gender {
    display:flex;
    gap:14px;
    border:0;
    background:none;
    padding:0
}
.landing-marriage .landing-gender label {
    padding:0;
    color:#603327;
    background:none;
    display:flex;
    align-items:center;
    gap:4px
}
.landing-marriage .landing-gender input {
    accent-color:#db151d;
    width:17px;
    height:17px
}
.landing-marriage .marriage-privacy {
    order:2;
    color:#fff1c9;
    font-size:12px;
    text-align:center;
    margin:9px -4% 6px;
    line-height:1.6
}
.landing-marriage .landing-action-footer {
    order:3;
    position:static;
    height:auto;
    margin:0 3%;
    padding:0;
    width:94%
}
.landing-marriage .landing-submit {
    position:static;
    min-height:44px;
    width:100%;
    aspect-ratio:603/80;
    padding:0;
    border:0;
    border-radius:50px;
    box-shadow:none;
    background:#ffd95d url(/assets/reference/marriage/yy2-but-0324.png) center/100% 100% no-repeat;
    color:#9d0000
}
.landing-marriage .landing-submit-label {
    opacity:0
}
.landing-marriage .agreement-list {
    order:4;
    margin:9px 0;
    font-size:12px;
    line-height:1.8;
    color:#fff5dc;
    padding:0
}
.landing-marriage .agreement-list .link-button {
    color:#ffd367
}
.landing-marriage .form-error {
    order:5;
    background:#fff0df;
    padding:10px;
    color:#ae1627
}
.landing-marriage .marriage-home-details {
    padding:14px 0 0
}
.landing-marriage .marriage-home-details img {
    width:100%;
    height:auto;
    display:block;
    margin-bottom:10px
}
.marriage-utilities {
    font-size:12px
}
.marriage-feedback {
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    overflow-y:auto;
    z-index:70;
    background:#fffaf3
}
.marriage-feedback .complaint-page {
    margin:0 auto;
    max-width:750px
}
.marriage-pay {
    padding-bottom:28px
}
.marriage-pay-scroll {
    position:relative;
    margin:-12% 2% 24px;
    padding:12% 11% 9%;
    background:url(/assets/reference/marriage/p-1.png) center/100% 100% no-repeat
}
.marriage-scroll-title {
    margin:0 -3% 15px;
    text-align:center;
    font-size:clamp(18px, 5.2vw, 32px);
    color:#fff2b1;
    padding:12px 0;
    line-height:1.4;
    background:linear-gradient(90deg, #ba161f, #ef3942, #bc1123);
    border-top:2px solid #e6b870;
    border-bottom:2px solid #e6b870;
    box-shadow:0 3px #8e2638
}
.marriage-pay-intro, .marriage-pay-profile {
    padding:10px;
    margin-bottom:12px;
    background:#fdd;
    font-size:14px;
    line-height:1.75
}
.marriage-pay-intro p {
    margin:0
}
.marriage-pay-intro strong {
    font-weight:500;
    color:#ce1725
}
.marriage-pay-profile .ref-order-details {
    font-size:14px
}
.marriage-pay-profile .ref-order-details div {
    gap:0
}
.marriage-price {
    padding:10px 0 16px;
    text-align:center;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:6px 10px;
    color:#b30d20
}
.marriage-price strong {
    font:700 clamp(28px, 8vw, 46px)/1.2 Georgia, serif
}
.marriage-price small {
    width:100%;
    font-size:11px;
    color:#956455
}
.marriage-channels {
    display:grid;
    gap:10px
}
.marriage-channels button {
    width:100%;
    display:flex;
    align-items:center;
    gap:9px;
    text-align:left;
    border:1px solid #eed4c3;
    background:#fff;
    border-radius:5px;
    min-height:46px;
    padding:9px;
    color:#4b332e;
    font-size:14px
}
.marriage-channels button span:not(.ref-payment-icon) {
    flex:1;
    min-width:0
}
.marriage-channels button.is-selected {
    border-color:#cc3540;
    box-shadow:0 0 0 1px #cc3540
}
.marriage-channels button b {
    color:#c32839
}
.marriage-channels .ref-payment-icon {
    flex:0 0 26px;
    width:26px;
    height:26px;
    border-radius:5px;
    display:grid;
    place-items:center;
    overflow:hidden
}
.marriage-channels .ref-payment-icon img {
    width:100%;
    display:block
}
.marriage-channels .is-wechat {
    background:#00bd3f
}
.marriage-channels .is-alipay {
    background:#009fe8;
    padding:2px
}
.marriage-channels button>i {
    font-style:normal;
    font-weight:700;
    background:#b99757;
    color:#fff;
    width:26px;
    line-height:26px;
    text-align:center;
    border-radius:3px
}
.marriage-primary, .marriage-secondary {
    display:block;
    width:100%;
    padding:14px 12px;
    margin:14px 0 0;
    border-radius:7px;
    font-family:inherit;
    font-size:16px;
    font-weight:600;
    line-height:1.5;
    text-align:center;
    cursor:pointer
}
.marriage-primary {
    border:1px solid #8d1627;
    background:linear-gradient(120deg, #d63543, #a21830);
    color:#fff3cf;
    box-shadow:inset 0 1px #ed7e7a, 0 4px 14px rgba(108, 23, 39, .14)
}
.marriage-secondary {
    background:#fff9ed;
    color:#953e3d;
    border:1px solid #d9ad85
}
.marriage-shell button:disabled {
    cursor:default;
    opacity:.55
}
.marriage-pay .return-link {
    width:100%;
    margin-top:12px;
    font-size:13px;
    border-color:#c9937b;
    color:#81312e
}
.marriage-pay-message {
    font-size:12px;
    line-height:1.6;
    text-align:center;
    color:#996858;
    margin:14px 0 0
}
.marriage-preview-button {
    display:block;
    width:100%;
    padding:0;
    background:none;
    border:0;
    cursor:pointer;
    margin:16px 0
}
.marriage-error {
    background:#fff0e8;
    color:#a31728;
    padding:10px;
    font-size:14px;
    line-height:1.7;
    overflow-wrap:anywhere
}
.marriage-waiting, .marriage-loading {
    color:#fff1d1;
    min-height:100svh;
    background:radial-gradient(ellipse at 50% 12%, #b64f50 0, transparent 55%), linear-gradient(160deg, #692637, #941f32 50%, #401d30);
    padding:24px 20px 48px;
    overflow:hidden
}
.marriage-waiting header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid #f7dca138;
    padding:0 0 18px;
    font:16px/1.5 Georgia, Songti SC, serif
}
.marriage-waiting header small {
    font:11px/1.5 sans-serif;
    color:#e6c5aa
}
.marriage-letter {
    text-align:center
}
.marriage-letter h1 {
    margin:10px auto 14px;
    font:500 clamp(23px, 6vw, 34px)/1.65"Songti SC", serif;
    max-width:15em
}
.marriage-letter>p:not(.marriage-eyebrow) {
    color:#edd6c3;
    font-size:14px;
    line-height:1.9;
    max-width:30em;
    margin:0 auto
}
.marriage-eyebrow {
    font-size:11px;
    letter-spacing:3px;
    color:#edd18d
}
.marriage-scene {
    position:relative;
    width:min(100%, 400px);
    aspect-ratio:1.12;
    margin:12px auto 20px;
    isolation:isolate
}
.marriage-scene-halo {
    position:absolute;
    top:13%;
    right:12%;
    bottom:13%;
    left:12%;
    border-radius:50%;
    background:radial-gradient(circle, #ffd68545, transparent 69%)
}
.marriage-orbit {
    position:absolute;
    top:14%;
    right:14%;
    bottom:11%;
    left:14%;
    border:1px solid #f6dcaa44;
    border-radius:50%;
    transform:rotate(-25deg)
}
.marriage-orbit-two {
    top:20%;
    right:7%;
    bottom:20%;
    left:7%;
    border-style:dashed;
    transform:rotate(25deg)
}
.marriage-thread {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    overflow:visible
}
.thread-line, .thread-glow {
    fill:none;
    stroke:#df6272;
    stroke-width:3;
    stroke-linecap:round;
    stroke-dasharray:940
}
.thread-glow {
    stroke:#ffbf81;
    stroke-width:8;
    opacity:.2;
    filter:blur(4px)
}
.marriage-ring {
    fill:rgba(155, 53, 69, .14);
    stroke:url(#marriage-thread-gold);
    stroke-width:4;
    filter:drop-shadow(0 0 6px #f5d27d66)
}
.marriage-ring.ring-two {
    stroke-width:3
}
.marriage-knot {
    fill:#ebcb8c;
    stroke:#ebcb8c;
    stroke-width:2
}
.marriage-scene-seal {
    position:absolute;
    top:39%;
    left:43%;
    width:14%;
    font:24px/1.3 Songti SC, serif;
    color:#ffedb7;
    text-align:center
}
.marriage-spark {
    position:absolute;
    left:calc(9% + mod(var(--i) * 29, 82)*1%);
    top:calc(10% + mod(var(--i) * 19, 60)*1%);
    color:#fbe3ad;
    font-size:10px;
    opacity:.45;
    font-style:normal
}
.spark-0, .spark-8 {
    left:12%;
    top:45%
}
.spark-1, .spark-9 {
    left:82%;
    top:35%
}
.spark-2, .spark-10 {
    left:35%;
    top:16%
}
.spark-3, .spark-11 {
    left:66%;
    top:70%
}
.spark-4, .spark-12 {
    left:21%;
    top:70%
}
.spark-5, .spark-13 {
    left:69%;
    top:20%
}
.spark-6, .spark-14 {
    left:48%;
    top:12%
}
.spark-7, .spark-15 {
    left:91%;
    top:60%
}
.marriage-mini-scroll {
    position:absolute;
    left:18%;
    right:18%;
    bottom:0;
    padding:15px 8px 12px;
    background:linear-gradient(90deg, #dcba7c, #fff1cf 12%, #f7e4bf 88%, #b38658);
    border-top:4px solid #e2b265;
    border-bottom:4px solid #e2b265;
    color:#8f3542;
    box-shadow:0 9px 25px rgba(35, 6, 19, .3);
    transform-origin:top
}
.marriage-mini-scroll span {
    display:block;
    font:22px/1.2 Songti SC, serif;
    letter-spacing:8px
}
.marriage-mini-scroll small {
    display:block;
    font-size:10px;
    margin-top:8px;
    letter-spacing:2px
}
.marriage-spark.spark-0 {
    --i:0
}
.marriage-spark.spark-1 {
    --i:1
}
.marriage-spark.spark-2 {
    --i:2
}
.marriage-spark.spark-3 {
    --i:3
}
.marriage-spark.spark-4 {
    --i:4
}
.marriage-spark.spark-5 {
    --i:5
}
.marriage-spark.spark-6 {
    --i:6
}
.marriage-spark.spark-7 {
    --i:7
}
.marriage-spark.spark-8 {
    --i:8
}
.marriage-spark.spark-9 {
    --i:9
}
.marriage-spark.spark-10 {
    --i:10
}
.marriage-spark.spark-11 {
    --i:11
}
.marriage-spark.spark-12 {
    --i:12
}
.marriage-spark.spark-13 {
    --i:13
}
.marriage-spark.spark-14 {
    --i:14
}
.marriage-spark.spark-15 {
    --i:15
}
.marriage-scene.is-active .thread-line {
    animation:marriage-thread 6s ease-in-out infinite
}
.marriage-scene.is-active .ring-one {
    animation:marriage-ring-left 6s ease-in-out infinite;
    transform-origin:center
}
.marriage-scene.is-active .ring-two {
    animation:marriage-ring-right 6s ease-in-out infinite;
    transform-origin:center
}
.marriage-scene.is-active .marriage-orbit {
    animation:marriage-orbit 16s linear infinite
}
.marriage-scene.is-active .marriage-orbit-two {
    animation-direction:reverse;
    animation-duration:24s
}
.marriage-scene.is-active .marriage-spark {
    animation:marriage-spark 3.4s ease-in-out infinite;
    animation-delay:calc(var(--i) * -.39s)
}
.marriage-scene.is-active .marriage-mini-scroll {
    animation:marriage-letter 6s ease-in-out infinite
}
.marriage-scene.is-ready .marriage-scene-halo {
    background:radial-gradient(circle, #ffe0a475, transparent 70%)
}
.marriage-progress {
    margin:28px 0;
    padding:0;
    display:flex;
    list-style:none;
    justify-content:space-between;
    gap:8px;
    position:relative
}
.marriage-progress:before {
    content:"";
    position:absolute;
    top:18px;
    left:15%;
    right:15%;
    height:1px;
    background:rgba(211, 170, 118, .333)
}
.marriage-progress li {
    flex:1;
    position:relative;
    color:#d0aba0;
    font-size:11px;
    line-height:1.7
}
.marriage-progress b {
    display:grid;
    place-items:center;
    width:36px;
    height:36px;
    margin:0 auto 9px;
    border-radius:50%;
    border:1px solid #d7ad76;
    color:#e5c796;
    background:#7b2f40;
    font:15px/1 Songti SC, serif
}
.marriage-progress .is-done b {
    background:#efd096;
    color:#7f2d3b
}
.marriage-progress .is-current b {
    box-shadow:0 0 0 5px rgba(236, 196, 135, .082), 0 0 20px rgba(236, 196, 135, .18)
}
.marriage-record {
    display:flex;
    align-items:center;
    justify-content:space-between;
    text-align:left;
    padding:17px 14px;
    border:1px solid #f5d69460;
    background:rgba(55, 21, 39, .15);
    border-radius:4px;
    gap:8px
}
.marriage-record div {
    min-width:0
}
.marriage-record small {
    display:block;
    font-size:11px;
    color:#dabbaa;
    margin-bottom:7px
}
.marriage-record strong {
    font-size:15px;
    overflow-wrap:anywhere;
    font-weight:500;
    letter-spacing:.3px
}
.marriage-record button {
    background:transparent;
    border:1px solid #e6c08980;
    border-radius:4px;
    color:#f7ddb0;
    font-size:12px;
    padding:7px 10px;
    white-space:nowrap
}
.marriage-teacher {
    margin-top:26px;
    padding:24px 21px;
    background:#fff1d8;
    color:#704237;
    border-radius:3px 26px;
    border:1px solid #e0b77b;
    position:relative
}
.marriage-teacher:before {
    content:"";
    position:absolute;
    top:6px;
    right:6px;
    bottom:6px;
    left:6px;
    border:1px solid #c393582d;
    pointer-events:none;
    border-radius:1px 20px
}
.marriage-teacher h2 {
    font:24px/1.3 Songti SC, serif;
    margin:10px 0
}
.marriage-teacher p {
    font-size:14px;
    line-height:1.9
}
.marriage-teacher .marriage-eyebrow {
    color:#ab7660
}
.marriage-actions {
    position:relative;
    margin-bottom:22px
}
.marriage-teacher .enterprise-wechat-placeholder {
    color:#896d58
}
.marriage-loading {
    text-align:center;
    padding-top:12vh
}
.marriage-loading h1 {
    font:28px/1.5 Songti SC, serif
}
.marriage-loading>p {
    font-size:14px
}
html[data-cultural-product=marriage_analysis] .contact-phone-panel {
    background:#fff2db;
    border:1px solid #d7ad76;
    color:#713832
}
html[data-cultural-product=marriage_analysis] .teacher-contact-modal .primary-button {
    background:#ad293b;
    color:#ffefc4
}
html[data-report-kind=marriage_analysis] body {
    background:#6d2738
}
html[data-report-kind=marriage_analysis] .report-card {
    background:#fff4e3;
    border:1px solid #dcb98b
}
html[data-report-kind=marriage_analysis] .report-hero {
    background:linear-gradient(145deg, #8a2339, #b64e54);
    color:#ffe6bb
}
html[data-report-kind=marriage_analysis] .report-section-contact {
    background:#ad293b;
    color:#fff0c8
}
@keyframes marriage-thread {
    0%, to {
        stroke-dashoffset:940;
        opacity:.3
    }
    50%, 80% {
        stroke-dashoffset:0;
        opacity:1
    }
}
@keyframes marriage-ring-left {
    0%, to {
        transform:translate(-12px) rotate(-7deg)
    }
    50% {
        transform:translate(3px) rotate(4deg)
    }
}
@keyframes marriage-ring-right {
    0%, to {
        transform:translate(12px) rotate(7deg)
    }
    50% {
        transform:translate(-3px) rotate(-4deg)
    }
}
@keyframes marriage-orbit {
    to {
        transform:rotate(335deg)
    }
}
@keyframes marriage-spark {
    0%, to {
        opacity:.15;
        transform:translateY(4px) scale(.5)
    }
    50% {
        opacity:1;
        transform:translateY(-6px) scale(1.2)
    }
}
@keyframes marriage-letter {
    0%, to {
        transform:scaleY(.9) translateY(3px)
    }
    50% {
        transform:scaleY(1) translateY(-3px)
    }
}
@media(min-width:600px) {
    .landing-marriage .landing-field {
        min-height:72px;
        grid-template-columns:120px 1fr;
        padding:16px 8%
    }
    .landing-marriage .text-input, .landing-marriage .birth-date-trigger, .landing-marriage .field-label, .landing-marriage .field-with-icon {
        font-size:21px
    }
    .marriage-pay-intro, .marriage-pay-profile, .marriage-pay-profile .ref-order-details {
        font-size:20px
    }
    .marriage-channels button {
        min-height:66px;
        font-size:19px
    }
}
@media(max-width:350px) {
    .landing-marriage .landing-field {
        padding:10px 5%;
        grid-template-columns:80px minmax(0, 1fr)
    }
    .marriage-pay-scroll {
        padding-left:10%;
        padding-right:10%
    }
    .marriage-pay-intro, .marriage-pay-profile .ref-order-details {
        font-size:13px
    }
    .marriage-channels button {
        font-size:12px
    }
    .marriage-waiting {
        padding-left:15px;
        padding-right:15px
    }
}
@media(prefers-reduced-motion:reduce) {
    .marriage-scene * {
        animation:none!important
    }
    .marriage-preview-button {
        scroll-behavior:auto
    }
}
.bazi-preview-mask {
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:1000;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(242, 232, 213, .7);
    backdrop-filter:blur(4px);
    animation:bazi-preview-in .32s ease;
    outline:none
}
.bazi-preview-stage {
    display:flex;
    flex-direction:column;
    align-items:center;
    animation:bazi-preview-pop .34s cubic-bezier(.34, 1.56, .64, 1)
}
.bazi-preview-visual {
    position:relative;
    width:190px;
    height:190px
}
.bazi-preview-ring {
    position:absolute;
    border:1px dashed #c9a05c;
    border-radius:50%
}
.bazi-preview-ring.is-outer {
    top:0;
    right:0;
    bottom:0;
    left:0;
    opacity:.35;
    animation:bazi-preview-spin 9s linear infinite
}
.bazi-preview-ring.is-inner {
    top:11px;
    right:11px;
    bottom:11px;
    left:11px;
    opacity:.6;
    animation:bazi-preview-spin 6s linear infinite reverse
}
.bazi-preview-orbit {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    animation:bazi-preview-spin 4s linear infinite
}
.bazi-preview-orbit i {
    position:absolute;
    left:50%;
    top:50%;
    width:6px;
    height:6px;
    margin:-3px;
    border-radius:50%;
    background:currentColor;
    box-shadow:0 0 5px currentColor;
    transform:rotate(var(--orbit-angle)) translateY(-95px)
}
.bazi-preview-orbit .is-metal {
    color:#bc9457
}
.bazi-preview-orbit .is-wood {
    color:#5f805b
}
.bazi-preview-orbit .is-water {
    color:#466c87
}
.bazi-preview-orbit .is-fire {
    color:#b84332
}
.bazi-preview-orbit .is-earth {
    color:#ab8050
}
.bazi-preview-breath {
    position:absolute;
    top:20px;
    right:20px;
    bottom:20px;
    left:20px;
    animation:bazi-preview-breathe 2.6s ease-in-out infinite
}
.bazi-preview-disk {
    width:100%;
    height:100%;
    border:1.5px solid #c9a05c;
    border-radius:50%;
    overflow:hidden;
    background:#f2e8d5;
    box-shadow:0 4px 15px rgba(46, 42, 36, .25), 0 0 20px rgba(201, 160, 92, .35);
    animation:bazi-preview-spin 3.2s linear infinite
}
.bazi-preview-disk img {
    display:block;
    width:104%;
    max-width:none;
    height:104%;
    margin:-2%;
    object-fit:contain
}
.bazi-preview-stage h2 {
    display:flex;
    align-items:center;
    margin:17px 0 0;
    font:400 20px/1.6 STKaiti, KaiTi, "Noto Serif SC", serif;
    letter-spacing:3px;
    color:#2e2a24
}
.bazi-preview-stage h2 span {
    display:flex;
    gap:5px;
    margin-left:5px
}
.bazi-preview-stage h2 i {
    width:4px;
    height:4px;
    border-radius:50%;
    background:#a8382d;
    animation:bazi-preview-dot 1.2s ease-in-out infinite
}
.bazi-preview-stage h2 i:nth-child(2) {
    animation-delay:.18s
}
.bazi-preview-stage h2 i:nth-child(3) {
    animation-delay:.36s
}
.bazi-preview-phases {
    position:relative;
    width:120px;
    height:22px;
    margin-top:7px
}
.bazi-preview-phases span {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    text-align:center;
    font-size:12px;
    letter-spacing:2px;
    color:#4b5969;
    opacity:0;
    transform:translateY(5px);
    transition:opacity .5s, transform .5s
}
.bazi-preview-phases .is-current {
    opacity:1;
    transform:none
}
.bazi-preview-progress {
    display:flex;
    align-items:center;
    gap:7px;
    width:140px;
    margin-top:11px
}
.bazi-preview-progress>div {
    flex:1;
    height:14px;
    overflow:hidden;
    border:1px solid #c9a05c4d;
    border-radius:7px;
    background:rgba(201, 160, 92, .25)
}
.bazi-preview-progress i {
    display:block;
    height:100%;
    border-radius:7px;
    background:linear-gradient(90deg, #c9a05c, #a8382d);
    box-shadow:0 0 4px rgba(201, 160, 92, .5);
    transition:width .3s
}
.bazi-preview-progress>span {
    min-width:28px;
    text-align:right;
    font-size:11px;
    color:#4b5969
}
@keyframes bazi-preview-spin {
    to {
        transform:rotate(360deg)
    }
}
@keyframes bazi-preview-breathe {
    50% {
        transform:scale(1.07)
    }
}
@keyframes bazi-preview-dot {
    0%, to {
        opacity:.3;
        transform:none
    }
    50% {
        opacity:1;
        transform:translateY(-4px)
    }
}
@keyframes bazi-preview-in {
    0% {
        opacity:0
    }
    to {
        opacity:1
    }
}
@keyframes bazi-preview-pop {
    0% {
        transform:scale(.82)
    }
    to {
        transform:scale(1)
    }
}
@media(min-width:961px) {
    .bazi-preview-stage {
        scale:1.6
    }
}
@media(prefers-reduced-motion:reduce) {
    .bazi-preview-mask, .bazi-preview-stage, .bazi-preview-ring, .bazi-preview-orbit, .bazi-preview-breath, .bazi-preview-disk, .bazi-preview-stage h2 i {
        animation:none
    }
    .bazi-preview-phases span, .bazi-preview-progress i {
        transition:none
    }
}
html[data-cultural-product=bazi_detailed] {
    background:#35240d
}
html[data-cultural-product=annual_2026], html[data-cultural-product=annual_2026_new_payment], html[data-cultural-product=annual_2027], html[data-cultural-product=annual_2027_new_payment] {
    background:#8e1616
}
html[data-cultural-product=birth_fortune], html[data-cultural-product=birth_fortune_new_payment] {
    background:#d8ccb0
}
html[data-cultural-product=bazi_detailed] body, html[data-cultural-product=annual_2026] body, html[data-cultural-product=birth_fortune] body, html[data-cultural-product=annual_2026_new_payment] body, html[data-cultural-product=birth_fortune_new_payment] body, html[data-cultural-product=annual_2027] body, html[data-cultural-product=annual_2027_new_payment] body {
    margin:0;
    background:transparent
}
.detailed-shell {
    --detail-ink: #583b19;
    --detail-accent: #7e381f;
    --detail-paper: #fff6df;
    width:100%;
    max-width:480px;
    min-height:100vh;
    margin:auto;
    color:var(--detail-ink);
    background:#eed6a3;
    font-family:-apple-system, BlinkMacSystemFont, PingFang SC, sans-serif;
    overflow:clip
}
.detailed-shell *, .detailed-shell *:before, .detailed-shell *:after {
    box-sizing:border-box
}
.detailed-shell button, .detailed-shell input {
    font:inherit
}
.detailed-shell button {
    cursor:pointer
}
.detailed-shell button:disabled {
    cursor:default;
    opacity:.55
}
.detailed-shell .sr-only {
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0, 0, 0, 0)
}
.detailed-image {
    display:block;
    width:100%;
    height:auto
}
.detailed-notice {
    position:relative;
    z-index:2;
    padding:7px 8px;
    margin:0;
    text-align:center;
    background:#20150e;
    color:#ead5a5;
    font-size:10px;
    line-height:1.6
}
.detailed-primary {
    display:block;
    width:100%;
    min-height:52px;
    border:1px solid #954722;
    border-radius:5px;
    padding:12px 16px;
    background:linear-gradient(#a4562f, #76311b);
    color:#fff6cd;
    font-weight:700;
    font-size:20px;
    letter-spacing:2px;
    box-shadow:inset 0 0 0 3px #d7a563
}
.detailed-back {
    border:0;
    color:var(--detail-ink);
    background:transparent;
    min-height:40px;
    padding:8px 2px;
    text-decoration:underline;
    text-underline-offset:3px
}
.detailed-small {
    text-align:center;
    font-size:11px;
    line-height:1.8;
    margin:10px 0
}
.detailed-bottom-note {
    padding:15px
}
.detailed-error {
    color:#9e201c;
    background:#fff4eb;
    padding:12px;
    border:1px solid #e9b6a4;
    border-radius:4px;
    font-size:13px;
    line-height:1.7
}
.detailed-birth-form {
    position:relative;
    z-index:1;
    margin:0 5%;
    padding:24px 18px 16px;
    background:var(--detail-paper);
    border:3px double #aa783b;
    border-radius:8px
}
.detailed-birth-form h2 {
    text-align:center;
    margin:0 0 22px;
    font-size:23px;
    font-family:Songti SC, SimSun, serif
}
.detailed-field {
    display:flex;
    align-items:center;
    gap:8px;
    width:100%;
    margin:12px 0;
    padding:0;
    border:0;
    min-width:0;
    font-size:14px
}
.detailed-field>span, .detailed-field>legend {
    flex:0 0 58px;
    padding:0
}
fieldset.detailed-field {
    display:block;
    position:relative;
    padding-left:66px;
    min-height:32px
}
fieldset.detailed-field legend {
    position:absolute;
    left:0;
    top:6px
}
.detailed-field>input, .detailed-field>button {
    min-width:0;
    flex:1;
    width:100%;
    background:#fffdf6;
    border:1px solid #c8a36c;
    padding:12px 8px;
    border-radius:3px;
    color:#624422;
    text-align:left;
    font-size:14px
}
.detailed-field>div {
    display:flex;
    gap:30px
}
.detailed-field>div label {
    display:flex;
    align-items:center;
    min-height:32px;
    gap:8px
}
.detailed-field input[type=radio], .detailed-consent input {
    accent-color:#933d24;
    width:17px;
    height:17px;
    flex-shrink:0
}
.detailed-consent {
    display:flex;
    align-items:flex-start;
    gap:5px;
    font-size:11px;
    line-height:1.8;
    margin:20px 0 14px
}
.detailed-consent input {
    margin-top:2px
}
.detailed-consent button {
    font-size:inherit;
    background:transparent;
    color:#8a331e;
    padding:0;
    border:0;
    text-decoration:underline
}
.detailed-bazi-hero {
    position:relative;
    height:148vw;
    max-height:710px;
    overflow:hidden
}
.detailed-bazi-hero>img {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0
}
.detailed-bazi-wheel {
    position:absolute;
    top:42.5%;
    left:15%;
    width:70%;
    aspect-ratio:1
}
.detailed-bazi-wheel img {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    height:100%;
    object-fit:contain
}
.detailed-bazi-wheel img:nth-child(2) {
    animation:detailed-turn 90s linear infinite
}
.detailed-bazi-wheel img:nth-child(3) {
    animation:detailed-turn 120s linear infinite reverse
}
.detailed-bazi-marketing {
    padding:18px 4%
}
.detailed-bazi-marketing section {
    padding-bottom:12px
}
.detailed-bazi-marketing h2 {
    font:700 21px/1.6 Songti SC, SimSun, serif;
    text-align:center;
    margin:8px 0 12px;
    color:#783615
}
.detailed-bottom-start {
    width:88%;
    margin:16px auto
}
.detailed-annual_2026, .detailed-annual_2027 {
    --detail-accent: #a62924;
    background:#ba2923
}
.detailed-annual_2026 .detailed-primary, .detailed-annual_2027 .detailed-primary {
    background:linear-gradient(#ffe3a6, #e9b463);
    color:#91241c;
    border-color:#f8d490;
    box-shadow:inset 0 0 0 3px #b77831
}
.detailed-annual-start {
    width:88%;
    margin:0 auto
}
.detailed-light {
    color:#ffdfb0
}
.detailed-zodiac-grid {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
    padding:22px 4%
}
.detailed-zodiac-grid button {
    padding:0;
    border:0;
    background:transparent;
    border-radius:10px
}
.detailed-annual-form {
    padding:12px 3% 0
}
.detailed-annual-form>.detailed-back {
    color:#ffe5b2
}
.detailed-annual-form .detailed-birth-form {
    margin:0;
    background:#fff2d8
}
.detailed-annual_2026 .detailed-bottom-note, .detailed-annual_2027 .detailed-bottom-note {
    color:#ffe2b6
}
.detailed-birth_fortune {
    --detail-ink: #604931;
    background:#ece0c1
}
.detailed-birth-hero {
    position:relative;
    height:134vw;
    max-height:640px;
    background:url(mp03.webp) center bottom/cover no-repeat
}
.detailed-birth-hero>img:first-child {
    position:relative;
    padding-top:16px;
    z-index:2
}
.detailed-birth-hero .detailed-book-cover {
    position:absolute;
    width:41%;
    left:33%;
    top:28%;
    transform:rotate(-6deg);
    z-index:1;
    filter:drop-shadow(8px 18px 12px #68472755)
}
.detailed-birth-hero .detailed-book-ornament {
    position:absolute;
    inset:10% 0 auto;
    width:100%;
    height:87%;
    object-fit:contain;
    pointer-events:none
}
.detailed-birth-tags {
    position:absolute;
    left:8%;
    top:39%;
    display:flex;
    flex-direction:column;
    gap:7px;
    font:16px/1.4 Songti SC, SimSun, serif
}
.detailed-birth-tags span {
    background:rgba(255, 239, 208, .733);
    border:1px solid #b89456;
    padding:4px 8px
}
.detailed-birth-marketing {
    padding:22px 4% 0
}
.detailed-birth-marketing>img {
    margin:14px 0
}
.detailed-birth-trend-preview {
    position:relative
}
.detailed-birth-trend-preview .detailed-marketing-line {
    position:absolute;
    width:88%;
    left:6%;
    bottom:12%
}
.detailed-book-form {
    padding:12px 4% 30px;
    min-height:88vh;
    background:linear-gradient(90deg, #d1b77d, #f4e5bb 6%, #fff5d8 95%, #c6a673);
    border:8px solid #9b7040;
    margin:20px 3%;
    box-shadow:5px 7px #bd9c69
}
.detailed-book-form-heading {
    display:flex;
    align-items:center;
    flex-direction:column;
    gap:12px;
    padding:14px 0 28px;
    font:36px/1.3 Songti SC, SimSun, serif
}
.detailed-book-form-heading small {
    font-size:12px;
    letter-spacing:3px
}
.detailed-book-form .detailed-birth-form {
    margin:0;
    padding:16px 10px;
    background:transparent;
    border-width:1px 0;
    border-radius:0
}
.detailed-confirm-overlay {
    position:fixed;
    z-index:1100;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background:rgba(36, 23, 13, .67);
    display:flex;
    align-items:flex-end;
    justify-content:center
}
.detailed-confirm {
    width:100%;
    max-width:480px;
    background:#fff6df;
    padding:24px 22px max(24px, env(safe-area-inset-bottom));
    border-radius:14px 14px 0 0
}
.detailed-confirm h2 {
    text-align:center;
    font-size:22px
}
.detailed-confirm dl>div {
    display:flex;
    padding:12px 0;
    border-bottom:1px solid #d8c9ad;
    font-size:14px
}
.detailed-confirm dt {
    flex:0 0 45px
}
.detailed-confirm dd {
    margin:0
}
.detailed-utilities {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
    padding:18px 10px;
    border-top:1px solid #be996b;
    background:#f7e8c9
}
.detailed-utilities button, .detailed-utilities a {
    padding:8px;
    background:transparent;
    border:0;
    font-size:12px;
    color:#704b2e;
    text-decoration:underline
}
.detailed-feedback {
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:1200;
    overflow:auto;
    background:#fff;
    color:#333
}
.detailed-feedback .complaint-page {
    min-height:100%;
    max-width:480px;
    margin:auto
}
.detailed-loading {
    display:grid;
    place-items:center;
    text-align:center;
    padding:32px
}
.detailed-loading h1 {
    font:26px/1.6 Songti SC, SimSun, serif
}
.detailed-loading p {
    font-size:14px;
    line-height:1.8
}
.detailed-seal {
    display:inline-grid;
    place-items:center;
    width:56px;
    height:56px;
    border:3px double currentColor;
    font-size:32px
}
.detailed-pay, .detailed-waiting {
    background:#f1dfbe
}
.detailed-pay-heading {
    text-align:center;
    background:#62451f;
    color:#ffe0a3;
    padding:25px 12px 20px;
    border-bottom:4px double #c59650
}
.detailed-pay-heading span {
    font-size:11px;
    letter-spacing:3px
}
.detailed-pay-heading h1 {
    font:700 30px/1.4 Songti SC, SimSun, serif;
    margin:12px 0
}
.detailed-pay-heading p {
    font-size:12px;
    letter-spacing:3px;
    margin:0
}
.detailed-pay-identity {
    padding:18px 5%;
    background:#ffefce
}
.detailed-pay-identity .ref-order-details {
    margin:0 0 15px
}
.detailed-pay-identity .cultural-birth-preview {
    background:#fff8e6;
    margin:0
}
.detailed-pay-compass {
    position:relative;
    padding:24px 0 5px;
    background:url(/assets/detailed/pay/bg.webp) center/cover;
    text-align:center
}
.detailed-pay-compass>div {
    position:relative;
    width:66%;
    aspect-ratio:1;
    margin:auto
}
.detailed-pay-compass img {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    height:100%;
    object-fit:contain
}
.detailed-pay-compass p {
    position:relative;
    font:17px/1.6 Songti SC, SimSun, serif
}
.detailed-checkout {
    margin:16px 4%;
    background:#fffbef;
    padding:22px 18px 14px;
    border:3px double #b7925f;
    border-radius:7px;
    text-align:center
}
.detailed-checkout h2 {
    font:700 21px/1.6 Songti SC, SimSun, serif;
    margin:0
}
.detailed-checkout>p {
    font-size:12px
}
.detailed-price {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    margin:25px 0
}
.detailed-price span {
    font-size:13px
}
.detailed-price strong {
    font:700 35px/1.2 Georgia, serif;
    color:#b53620
}
.detailed-payment-options {
    display:grid;
    gap:10px;
    margin:18px 0
}
.detailed-payment-options label {
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:10px;
    padding:12px;
    border:1px solid #d7c8b0;
    border-radius:4px;
    font-size:15px
}
.detailed-payment-options label.is-selected {
    border-color:#aa7040;
    background:#fff5dc
}
.detailed-payment-options input {
    accent-color:#a75d2e
}
.detailed-payment-options svg {
    width:26px;
    height:26px
}
.detailed-payment-message {
    line-height:1.8;
    color:#796042
}
.detailed-payment-recovery {
    display:grid;
    gap:10px;
    margin-top:12px
}
.detailed-pay-outline {
    margin:25px 5%;
    padding:20px 16px;
    background:#fff1d5;
    border:1px solid #ba9259
}
.detailed-pay-outline>h2 {
    text-align:center;
    font:700 23px/1.6 Songti SC, SimSun, serif
}
.detailed-pay-outline ol {
    list-style:none;
    padding:0
}
.detailed-pay-outline li {
    display:flex;
    align-items:center;
    gap:14px;
    padding:16px 0;
    border-bottom:1px solid #dac39a
}
.detailed-pay-outline li>span {
    display:grid;
    place-items:center;
    width:35px;
    height:35px;
    background:#98673e;
    color:#fff3ce;
    border-radius:50%;
    font:22px Songti SC, SimSun, serif;
    flex-shrink:0
}
.detailed-pay-outline li>div {
    flex:1
}
.detailed-pay-outline h3 {
    margin:0 0 5px;
    font-size:17px
}
.detailed-pay-outline p {
    margin:0;
    font-size:11px;
    line-height:1.6
}
.detailed-pay-outline i {
    color:#a28356
}
.detailed-wait-heading {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 15px;
    background:#674822;
    color:#ffe5b7
}
.detailed-wait-heading span {
    font-size:16px;
    font-family:Songti SC, SimSun, serif
}
.detailed-wait-heading small {
    font-size:9px
}
.detailed-wait-scroll {
    padding:30px 24px;
    margin:25px 4%;
    background:linear-gradient(90deg, #e2c696, #fff3d8 5%, #fff9e9 50%, #e8cba0);
    border-block:8px solid #ad7b48;
    box-shadow:0 5px 14px rgba(121, 81, 45, .15);
    text-align:center
}
.detailed-wait-art {
    position:relative;
    height:138px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px
}
.detailed-wait-art i {
    position:absolute;
    border:1px solid #c19a57;
    width:120px;
    height:120px;
    border-radius:50%
}
.detailed-wait-art span {
    font:42px Songti SC, SimSun, serif
}
.detailed-wait-art b {
    font-size:10px;
    letter-spacing:5px
}
.is-writing .detailed-wait-art i {
    border-top:3px solid #8b4e28;
    animation:detailed-turn 8s linear infinite
}
.detailed-wait-scroll h1 {
    font:700 24px/1.6 Songti SC, SimSun, serif;
    margin:22px 0 12px
}
.detailed-wait-scroll>p {
    font-size:13px;
    line-height:1.9
}
.detailed-wait-steps {
    display:flex;
    list-style:none;
    justify-content:space-between;
    padding:15px 0;
    margin:20px 0;
    border-block:1px solid #cdb18a
}
.detailed-wait-steps li {
    display:flex;
    align-items:center;
    flex-direction:column;
    gap:8px;
    color:#a6947d;
    font-size:10px
}
.detailed-wait-steps b {
    font:22px Songti SC, SimSun, serif
}
.detailed-wait-steps .is-done, .detailed-wait-steps .is-current {
    color:#874529
}
.detailed-record {
    display:flex;
    gap:8px;
    justify-content:space-between;
    align-items:center;
    border:1px dashed #aa8d63;
    padding:14px 10px;
    background:#fff8e9;
    text-align:left
}
.detailed-record small, .detailed-record strong {
    display:block
}
.detailed-record small {
    font-size:10px;
    margin-bottom:7px
}
.detailed-record strong {
    font-size:13px;
    overflow-wrap:anywhere
}
.detailed-record button {
    border:1px solid #a88045;
    background:transparent;
    color:#75582c;
    padding:8px;
    white-space:nowrap
}
.detailed-wait-contact {
    text-align:center;
    padding:0 24px 24px
}
.detailed-wait-contact h2 {
    font:22px/1.6 Songti SC, SimSun, serif
}
.detailed-wait-contact p {
    font-size:13px;
    line-height:1.8
}
.detailed-secondary {
    min-height:46px;
    width:100%;
    border:1px solid #a98049;
    background:#fff6df;
    color:#754a2a;
    padding:12px;
    margin:12px 0
}
@keyframes detailed-turn {
    to {
        transform:rotate(360deg)
    }
}
@media(prefers-reduced-motion:reduce) {
    .detailed-shell * {
        animation:none!important;
        scroll-behavior:auto!important
    }
}
.detailed-bazi_detailed.detailed-landing {
    background:#d3aa72
}
.detailed-bazi-hero {
    height:142.4vw;
    max-height:684px
}
.detailed-bazi-wheel {
    top:5.62%;
    left:34.667%;
    width:74.667%
}
.detailed-bazi-wheel img:nth-child(1) {
    animation:detailed-turn 80s linear infinite
}
.detailed-bazi-wheel img:nth-child(2) {
    inset:21.07% auto auto 21.428%;
    width:57.143%;
    height:57.143%;
    animation:none
}
.detailed-bazi-wheel img:nth-child(3) {
    inset:31.607% auto auto 32.143%;
    width:35.714%;
    height:35.714%
}
.detailed-bazi-wheel img:nth-child(4) {
    inset:40.357% auto auto 41.071%;
    width:17.857%;
    height:17.857%
}
.detailed-bazi_detailed.detailed-landing .detailed-birth-form {
    margin:0 3%;
    border:0;
    padding:10px 15px 16px;
    border-radius:4px;
    background:#fff0c9
}
.detailed-bazi_detailed.detailed-landing .detailed-birth-form h2 {
    display:none
}
.detailed-bazi_detailed .detailed-field {
    min-height:42px;
    background:#fff;
    border:1px solid #d5b27d;
    border-radius:20px;
    padding:2px 12px;
    gap:8px
}
.detailed-bazi_detailed .detailed-field>input, .detailed-bazi_detailed .detailed-field>button {
    background:transparent;
    border:0;
    padding:7px 0
}
.detailed-bazi_detailed fieldset.detailed-field {
    padding-left:82px
}
.detailed-bazi_detailed fieldset.detailed-field legend {
    left:12px;
    top:10px
}
.detailed-bazi_detailed .detailed-primary {
    border:3px double #e3b861;
    border-radius:0;
    -webkit-clip-path:polygon(3% 0, 97% 0, 100% 50%, 97% 100%, 3% 100%, 0 50%);
    clip-path:polygon(3% 0, 97% 0, 100% 50%, 97% 100%, 3% 100%, 0 50%);
    background:linear-gradient(#b76630, #a43b26);
    box-shadow:inset 0 0 0 2px #e5b565
}
.detailed-bazi-marketing section {
    background:#fff0c9;
    border-radius:5px;
    margin:10px 0 16px;
    padding:0 14px 14px
}
.detailed-bazi-marketing h2 {
    position:relative;
    margin:0 -6px 16px;
    padding:8px 8px 15px;
    background:url(/assets/detailed/bazi/m_bg_title.webp) center/100% 100% no-repeat;
    color:#fff0bd;
    font-size:19px
}
.detailed-annual_2026.detailed-landing, .detailed-annual_2027.detailed-landing {
    background:#82401c
}
.detailed-zodiac-grid {
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px 18px;
    padding:24px 5%
}
.detailed-annual_2026.detailed-landing .detailed-primary, .detailed-annual_2027.detailed-landing .detailed-primary {
    border:0;
    min-height:60px;
    background:url(/assets/detailed/annual/btn_bg.webp) center/100% 100% no-repeat;
    box-shadow:none;
    color:#fff5d3;
    font-size:22px;
    letter-spacing:0
}
.detailed-birth_fortune.detailed-landing {
    background:#f1c588
}
.detailed-birth-hero {
    height:117vw;
    max-height:562px;
    background-position:center top;
    background-size:110% auto
}
.detailed-birth-hero>img:first-child {
    padding-top:0
}
.detailed-birth-hero .detailed-book-cover {
    left:26.933%;
    top:21.197%;
    width:44.267%;
    transform:none;
    filter:drop-shadow(5px 8px 8px #68472755)
}
.detailed-birth-hero .detailed-book-ornament {
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:auto;
    object-fit:initial;
    z-index:2
}
.detailed-birth-tags {
    left:5%;
    right:5%;
    top:auto;
    bottom:2%;
    flex-direction:row;
    gap:4px;
    font-size:12px
}
.detailed-birth-tags span {
    flex:1;
    padding:3px 2px;
    text-align:center
}
.detailed-birth_fortune.detailed-landing .detailed-primary {
    -webkit-clip-path:polygon(5% 0, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0 50%);
    clip-path:polygon(5% 0, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0 50%);
    border:4px double #b85922;
    background:linear-gradient(#ffe19a, #efb656);
    box-shadow:none;
    color:#8b3f1c
}
.detailed-birth-marketing {
    padding:10px 2% 0
}
.detailed-birth-trend-preview .detailed-marketing-line {
    left:9.5%;
    width:82%;
    bottom:22%
}
.detailed-pay-compass img:nth-child(2) {
    top:6.52%;
    right:6.52%;
    bottom:6.52%;
    left:6.52%;
    width:86.96%;
    height:86.96%
}
.detailed-pay-compass img:nth-child(3) {
    top:17.39%;
    right:17.39%;
    bottom:17.39%;
    left:17.39%;
    width:65.22%;
    height:65.22%;
    border-radius:50%;
    background:#ff9724
}
.detailed-pay-compass img:nth-child(4) {
    top:32.61%;
    right:32.61%;
    bottom:32.61%;
    left:32.61%;
    width:34.78%;
    height:34.78%
}
.detailed-pay.detailed-annual_2026, .detailed-pay.detailed-birth_fortune, .detailed-pay.detailed-annual_2027 {
    background:#82401c
}
.detailed-pay.detailed-annual_2026 .detailed-pay-heading, .detailed-pay.detailed-birth_fortune .detailed-pay-heading, .detailed-pay.detailed-annual_2027 .detailed-pay-heading {
    background:#82401c;
    color:#ffcf76
}
.detailed-pay.detailed-annual_2026 .detailed-pay-identity, .detailed-pay.detailed-birth_fortune .detailed-pay-identity, .detailed-pay.detailed-annual_2027 .detailed-pay-identity {
    background:#82401c;
    color:#ffe4af
}
.detailed-pay .cultural-birth-preview {
    background:#fff2d9;
    color:#634122;
    box-shadow:none;
    border:1px solid #aa8045
}
.detailed-pay .cultural-section-heading {
    padding-bottom:8px
}
.detailed-pay .cultural-section-heading>span {
    color:#936b30
}
.detailed-pay .cultural-section-heading h2 {
    color:#6c431e;
    font-size:19px
}
.detailed-pay .cultural-pillar-preview strong {
    color:#703d22
}
.detailed-pay .cultural-element-preview span {
    background:#eee0bf;
    color:#73512c
}
.detailed-pay .detailed-pay-compass {
    color:#ffe1ac
}
.detailed-pay .detailed-bottom-note {
    color:#f9d8a3
}
.detailed-pay.detailed-bazi_detailed .detailed-bottom-note {
    color:#73512c
}
@media(prefers-reduced-motion:reduce) {
    .detailed-bazi-wheel img {
        animation:none!important
    }
}
.detailed-reference-pay {
    background:#874b2e;
    color:#ffe39d;
    min-height:100svh
}
.detailed-reference-pay.is-annual {
    background:#82401c
}
.detailed-reference-pay main {
    min-height:100svh
}
.detailed-reference-pay.is-preparing main {
    padding-bottom:40px
}
.detailed-reference-pay h1, .detailed-reference-pay h2, .detailed-reference-pay h3, .detailed-reference-pay p {
    margin:0
}
.detailed-bazi-pay-title {
    padding:42px 14px 27px;
    text-align:center;
    color:#fff0d1
}
.detailed-bazi-pay-title h1 {
    font-size:20px;
    line-height:1.5;
    margin-bottom:5px
}
.detailed-bazi-pay-title p {
    font-size:16px;
    line-height:1.5
}
.detailed-bazi-pay-title p span {
    margin-left:25px
}
.is-preparing .detailed-bazi-pay-title {
    padding:30px 12px 18px
}
.detailed-reference-pillars {
    display:flex;
    justify-content:space-around;
    text-align:center;
    padding:0 8%
}
.detailed-reference-pillars>div {
    width:30px;
    opacity:0;
    background:linear-gradient(#daaa78, transparent);
    transition:opacity .7s;
    padding-bottom:18px
}
.detailed-reference-pillars>.is-revealed {
    opacity:1
}
.detailed-reference-pillars span {
    display:block;
    width:30px;
    height:30px;
    border-radius:50%;
    background:#fff;
    color:#a7482c;
    border:1px solid #ce7f54;
    line-height:28px
}
.detailed-reference-pillars strong {
    display:block;
    width:1em;
    margin:6px auto 0;
    font-size:20px;
    font-weight:400;
    overflow-wrap:anywhere;
    line-height:1.3
}
.detailed-bazi-loading-copy {
    text-align:center;
    padding:22px 0 10px;
    font-size:16px
}
.detailed-reference-wheel {
    position:relative;
    width:min(84vw, 360px);
    aspect-ratio:1;
    margin:12px auto 0;
    font-family:Songti SC, SimSun, serif;
    font-weight:700
}
.detailed-wheel-branches, .detailed-wheel-stems {
    position:absolute;
    border-radius:50%;
    border:1px solid #dfa56b;
    transition:transform 1.5s linear
}
.detailed-wheel-branches {
    top:3.125%;
    right:3.125%;
    bottom:3.125%;
    left:3.125%;
    background:repeating-conic-gradient(from -15deg, #dfa56b, #dfa56b 1deg, #ffe29d 1deg, #ffe29d 30deg);
    box-shadow:inset 0 0 15px #ffcb70
}
.detailed-wheel-stems {
    top:15.625%;
    right:15.625%;
    bottom:15.625%;
    left:15.625%;
    background:repeating-conic-gradient(from -18deg, #e1a971, #e1a971 1deg, #fff7e3 1deg, #fff7e3 36deg)
}
.detailed-wheel-branches span, .detailed-wheel-stems span {
    position:absolute;
    top:0;
    left:calc(50% - 15px);
    width:30px;
    height:100%;
    text-align:center;
    padding-top:8px;
    color:#974325;
    transform:rotate(var(--angle));
    font-size:23px
}
.detailed-wheel-stems span {
    padding-top:9px;
    font-size:22px
}
.detailed-reference-wheel span.is-selected {
    color:#e22f16;
    text-shadow:0 0 5px #ff9620
}
.detailed-reference-wheel>img {
    position:absolute;
    top:26.5625%;
    right:26.5625%;
    bottom:26.5625%;
    left:26.5625%;
    width:46.875%;
    border:1px solid #ce7f54;
    border-radius:50%
}
.detailed-reference-checkout {
    margin:0 10px 10px;
    padding:20px 12px 15px;
    border-radius:6px;
    background:#ffeec6;
    color:#333
}
.detailed-reference-checkout>h2 {
    color:#f04925;
    font:700 25px/1.4 Songti SC, SimSun, serif;
    text-align:center;
    margin-bottom:18px
}
.detailed-reference-price {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    border:1px solid #d5bb7e;
    border-radius:6px;
    padding:15px 10px;
    background:#fffcf4;
    color:#444;
    font-size:14px
}
.detailed-reference-price strong {
    font-size:20px;
    color:#e72d28
}
.detailed-reference-price small {
    font-size:11px
}
.detailed-bazi-payment-buttons {
    display:grid;
    gap:10px;
    margin:10px 4px
}
.detailed-bazi-payment-buttons button {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    min-height:45px;
    background:#b44324;
    color:#fff;
    border:0;
    border-radius:4px;
    font-size:21px
}
.detailed-bazi-payment-buttons .is-alipay {
    background:#438ec5
}
.detailed-bazi-payment-buttons .is-wechat {
    background:#20af5b
}
.detailed-bazi-payment-buttons .ref-payment-icon {
    display:inline-flex;
    width:28px;
    height:28px
}
.detailed-bazi-payment-buttons .ref-payment-icon img {
    width:100%;
    height:100%;
    object-fit:contain
}
.detailed-reference-payment-note {
    font-size:11px;
    text-align:center;
    line-height:1.6;
    margin-top:8px!important
}
.detailed-bazi-locked-content {
    margin:10px;
    padding:20px 10px;
    background:#ffeec6;
    border-radius:6px;
    color:#444
}
.detailed-bazi-locked-content>h2 {
    display:table;
    margin:0 auto;
    padding:5px 25px;
    border:1px solid #ecc361;
    border-radius:6px;
    background:#fffced;
    color:#ea2929;
    font:24px/1.5 Songti SC, SimSun, serif
}
.detailed-bazi-locked-card {
    position:relative;
    padding-top:30px;
    margin-top:22px
}
.detailed-bazi-locked-card>h3 {
    position:absolute;
    z-index:1;
    top:0;
    left:50%;
    transform:translate(-50%);
    width:230px;
    height:40px;
    background:url(/assets/detailed/bazi/chapter-title.webp) center/100% 100% no-repeat;
    color:#fff;
    text-align:center;
    font-size:18px;
    line-height:40px
}
.detailed-bazi-locked-card>div {
    background:#fff;
    margin:0 10px;
    padding:20px;
    box-shadow:0 3px 3px #d7cdb4;
    font-size:15px;
    line-height:1.7
}
.detailed-bazi-locked-card button {
    display:block;
    background:#d90000;
    color:#fff;
    border:0;
    border-radius:3px;
    font-size:16px;
    margin:12px auto 0;
    padding:4px 15px;
    letter-spacing:1px
}
.detailed-bazi-chart-note {
    color:#ed4937;
    font-size:13px;
    margin-top:10px!important
}
.detailed-bazi-fixed-unlock {
    position:fixed;
    z-index:20;
    bottom:0;
    left:50%;
    transform:translate(-50%);
    width:min(100%, 480px);
    padding:7px 20px max(7px, env(safe-area-inset-bottom));
    background:rgba(57, 32, 14, .6);
    border:0
}
.detailed-bazi-fixed-unlock span {
    display:block;
    background:linear-gradient(#b86c35, #a44127);
    border:4px double #e9c783;
    -webkit-clip-path:polygon(4% 0, 96% 0, 100% 50%, 96% 100%, 4% 100%, 0 50%);
    clip-path:polygon(4% 0, 96% 0, 100% 50%, 96% 100%, 4% 100%, 0 50%);
    color:#fff0d7;
    font-size:22px;
    font-weight:700;
    line-height:42px
}
.detailed-reference-disclaimer {
    padding:25px 15px;
    text-align:center;
    font-size:11px;
    color:#ffe7c1;
    line-height:1.7
}
.detailed-reference-pay.is-bazi .detailed-utilities {
    padding-bottom:85px
}
.detailed-reference-overlay {
    position:fixed;
    z-index:1100;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background:rgba(0, 0, 0, .6);
    display:flex;
    align-items:flex-end;
    justify-content:center
}
.detailed-reference-sheet {
    position:relative;
    width:100%;
    max-width:480px;
    max-height:85svh;
    overflow:auto;
    border-radius:20px 20px 0 0;
    background:#fffbd7;
    padding:20px 20px max(30px, env(safe-area-inset-bottom));
    color:#333;
    animation:detailed-sheet-in .25s ease-out
}
.detailed-reference-sheet .detailed-reference-checkout {
    margin:0;
    padding:0;
    background:transparent
}
.detailed-sheet-close {
    position:absolute;
    right:8px;
    top:4px;
    padding:4px 8px;
    border:0;
    color:#8a582f;
    background:transparent;
    font-size:25px!important
}
.detailed-annual-pay-title {
    padding:28px 8px 0;
    font:700 clamp(21px, 6.9vw, 32px)/1.5"Songti SC", SimSun, serif;
    color:#fff;
    text-align:center;
    white-space:nowrap;
    letter-spacing:-1px
}
.detailed-annual-pay-title strong {
    color:#ffdf6d
}
.is-annual .detailed-reference-preparation {
    padding:0 5%
}
.is-annual .detailed-reference-preparation>.ref-order-details {
    margin:10px 0 20px;
    color:#f0f8ff;
    font-size:16px;
    line-height:1.5
}
.is-annual .ref-order-details>div {
    display:flex;
    margin:10px 0
}
.is-annual .ref-order-details dt {
    white-space:nowrap
}
.is-annual .ref-order-details dd {
    margin:0
}
.detailed-annual-progress-card {
    height:280px;
    border-radius:10px;
    background:#f0f8ff;
    color:#111;
    padding:0 5%
}
.detailed-annual-progress-tabs {
    display:flex;
    justify-content:space-around;
    align-items:center;
    height:50px;
    border-bottom:1px solid black;
    font-size:16px
}
.detailed-annual-progress-tabs b {
    color:red;
    font-weight:600
}
.detailed-annual-progress-body {
    display:flex;
    flex-direction:column;
    justify-content:space-evenly;
    height:215px;
    font-size:12px
}
.detailed-annual-progress-track {
    height:12px;
    border-radius:7px;
    background:#e1e6ec;
    overflow:hidden
}
.detailed-annual-progress-track i {
    display:block;
    width:0;
    height:100%;
    background:#dc352e;
    border-radius:inherit
}
.detailed-annual-progress-track .is-running {
    animation:detailed-progress 1.5s linear forwards
}
.detailed-annual-progress-track .is-second {
    animation-delay:1.5s
}
.detailed-annual-offer {
    width:90%;
    margin:50px auto 0;
    border-radius:20px;
    background:#ffb86c;
    padding:2px 5px 20px;
    color:#111;
    text-align:center
}
.detailed-annual-offer-intro {
    color:#fff;
    font-size:18px;
    line-height:1.5
}
.detailed-annual-offer>h2 {
    margin:10px 0 18px;
    font-size:20px
}
.detailed-annual-topic-circles {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:12px 9px
}
.detailed-annual-topic-circles span {
    display:grid;
    place-items:center;
    width:calc((100% - 27px)/4);
    aspect-ratio:1;
    background:#fff3ca;
    border:4px double #ed6a3b;
    border-radius:50%;
    box-shadow:0 2px 4px rgba(180, 78, 33, .333);
    color:#ba251d;
    white-space:pre-line;
    font:22px/1.05 Songti SC, SimSun, serif
}
.detailed-annual-topic-circles span:first-child {
    font-size:16px
}
.detailed-annual-topic-circles span:nth-child(2n) {
    border-color:#d19736;
    color:#864617
}
.detailed-annual-offer>p:last-of-type {
    font-size:14px;
    margin:18px 0 12px
}
.detailed-annual-offer>p strong {
    font-weight:400;
    color:#e3291a
}
.detailed-reference-unlock {
    display:block;
    width:90%;
    min-height:65px;
    margin:0 auto;
    padding:10px 0;
    border:0;
    background:url(/assets/detailed/annual/btn_bg.webp) center/100% 100% no-repeat;
    color:#fff3c0;
    font:700 24px/1.4 Songti SC, SimSun, serif!important
}
.detailed-annual-sheet-info {
    display:flex;
    align-items:center;
    gap:16px;
    border-bottom:1px solid #efe67d;
    padding:0 0 15px
}
.detailed-annual-sheet-info>img {
    flex:0 0 30%;
    width:30%
}
.detailed-annual-sheet-info>div {
    flex:1;
    min-width:0
}
.detailed-annual-sheet-info h2 {
    font-size:18px;
    line-height:1.5;
    padding-right:8px
}
.detailed-annual-sheet-info .ref-order-details {
    font-size:13px;
    margin:10px 0
}
.detailed-annual-sheet-info .ref-order-details dd {
    color:#a01d15;
    overflow-wrap:anywhere
}
.detailed-annual-sheet-info .ref-order-details>div:first-child {
    display:none
}
.detailed-annual-sheet-info p {
    font-size:14px;
    line-height:1.5
}
.is-annual .detailed-reference-price {
    margin:15px 0 0;
    border:0;
    border-bottom:1px solid #efe67d;
    border-radius:0;
    background:transparent;
    padding:8px 0 20px
}
.is-annual .detailed-reference-price>span {
    background:#c92727;
    border-radius:6px;
    color:#fff;
    padding:8px;
    font-size:14px
}
.is-annual .detailed-reference-price strong {
    color:#fff;
    font-size:16px;
    font-weight:400
}
.detailed-reference-channels {
    display:grid;
    gap:12px;
    margin:24px 10px
}
.detailed-reference-channels label {
    display:flex;
    align-items:center;
    gap:20px;
    min-height:40px;
    font-size:20px;
    font-weight:700
}
.detailed-reference-channels .ref-payment-icon {
    display:block;
    width:28px;
    height:28px
}
.detailed-reference-channels img {
    width:100%;
    height:100%;
    object-fit:contain
}
.detailed-reference-channels input {
    margin-left:auto;
    width:20px;
    height:20px;
    accent-color:#1a9fd4
}
.detailed-reference-pay-button {
    display:block;
    width:100%;
    border:0;
    border-radius:50px;
    min-height:52px;
    background:#cd2528;
    color:#fff;
    font-size:20px!important;
    font-weight:700!important
}
.detailed-annual_2026.detailed-landing .detailed-annual-form, .detailed-annual_2027.detailed-landing .detailed-annual-form {
    padding:14px 5% 0
}
.detailed-annual-form>.detailed-back {
    position:relative;
    z-index:1
}
.detailed-annual-form .detailed-birth-form {
    display:flex;
    flex-direction:column;
    background:url(/assets/detailed/annual/info_midbg.webp) center/100% auto repeat-y;
    border:0;
    border-radius:0;
    margin:0;
    padding:0 7% 20px
}
.detailed-annual-form .detailed-birth-form:after {
    content:"";
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    height:28px;
    background:url(/assets/detailed/annual/info_bottbg.webp) center/100% 100% no-repeat
}
.detailed-annual-form .detailed-birth-form h2 {
    margin:0 -8.14% 10px;
    min-height:60px;
    padding:8px 0 16px;
    background:url(/assets/detailed/annual/info_topbg.webp) center/100% 100% no-repeat;
    color:#ffedbd;
    font-size:18px;
    line-height:36px
}
.detailed-annual-form .detailed-field {
    background:#fff;
    border:0;
    border-radius:40px;
    padding:5px 10px;
    margin:5px 0;
    gap:8px;
    font-size:16px
}
.detailed-annual-form .detailed-field>input, .detailed-annual-form .detailed-field>button {
    background:transparent;
    border:0;
    color:#c72e2e;
    padding:8px 0
}
.detailed-annual-form fieldset.detailed-field {
    min-height:46px;
    padding-left:80px
}
.detailed-annual-form fieldset.detailed-field legend {
    left:10px;
    top:12px
}
.detailed-annual-form .detailed-consent {
    order:2;
    margin:15px 0 0;
    justify-content:center
}
.detailed-annual-form .detailed-small {
    order:3
}
.detailed-annual-form .detailed-primary {
    margin-top:15px
}
.detailed-annual-form>.detailed-image {
    margin-top:28px
}
@keyframes detailed-progress {
    to {
        width:100%
    }
}
@keyframes detailed-sheet-in {
    0% {
        transform:translateY(100%)
    }
    to {
        transform:translateY(0)
    }
}
@media(prefers-reduced-motion:reduce) {
    .detailed-reference-wheel *, .detailed-reference-pillars>div {
        transition:none
    }
}
.detailed-reference-pay, .detailed-book-form, .detailed-confirm {
    font-synthesis:weight
}
.detailed-annual-progress-tabs .is-current {
    color:red;
    font-weight:600
}
.detailed-annual-progress-body>div>p {
    margin-bottom:10px
}
.detailed-reference-unlock {
    width:85%;
    min-height:56px;
    border:5px double #fff0ab;
    -webkit-clip-path:polygon(5% 0, 95% 0, 98% 27%, 100% 50%, 98% 73%, 95% 100%, 5% 100%, 2% 73%, 0 50%, 2% 27%);
    clip-path:polygon(5% 0, 95% 0, 98% 27%, 100% 50%, 98% 73%, 95% 100%, 5% 100%, 2% 73%, 0 50%, 2% 27%);
    background:radial-gradient(ellipse at top, #fff0b4, #e9b34f);
    color:#a94721;
    box-shadow:inset 0 0 0 3px #ba4b29;
    text-shadow:0 1px #ffeeb2
}
.detailed-reference-pay.is-birth {
    background:#ffb259 url(/assets/detailed/pay/bg.webp) center top/100% 100svh no-repeat
}
.is-birth .detailed-annual-offer {
    width:100%;
    border-radius:0;
    background:transparent
}
.is-birth .detailed-annual-topic-circles {
    padding:0 2%
}
.is-birth .detailed-annual-topic-circles span {
    border-width:7px;
    box-shadow:0 0 0 2px #ffe9ab, 0 0 0 4px #d99332
}
.is-birth .detailed-reference-pillars>div {
    background:transparent
}
.is-birth .detailed-reference-pillars strong {
    font-size:16px;
    color:#fff
}
.detailed-rotary-preparation-stage {
    margin-top:50px
}
.detailed-reference-compass {
    position:relative;
    width:230px;
    height:230px;
    margin:35px auto
}
.detailed-reference-compass img {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%
}
.detailed-reference-compass .disc-1 {
    top:6.52%;
    right:6.52%;
    bottom:6.52%;
    left:6.52%;
    width:86.96%;
    height:86.96%;
    animation:detailed-compass-branch 2.5s ease-out both
}
.detailed-reference-compass .disc-2 {
    top:17.39%;
    right:17.39%;
    bottom:17.39%;
    left:17.39%;
    width:65.22%;
    height:65.22%;
    border-radius:50%;
    background:#ff9724;
    animation:detailed-compass-stem 2.5s ease-out both
}
.detailed-reference-compass .disc-3 {
    top:32.61%;
    right:32.61%;
    bottom:32.61%;
    left:32.61%;
    width:34.78%;
    height:34.78%
}
@keyframes detailed-compass-branch {
    0% {
        transform:rotate(calc(var(--branch-turn) - 360deg))
    }
    to {
        transform:rotate(var(--branch-turn))
    }
}
@keyframes detailed-compass-stem {
    0% {
        transform:rotate(calc(var(--stem-turn) + 360deg))
    }
    to {
        transform:rotate(var(--stem-turn))
    }
}
.detailed-birth_fortune.detailed-landing.is-form {
    background:#f1c588 url(mp03.webp) center 20px/110% auto no-repeat
}
.detailed-book-form {
    position:relative;
    margin:0 5% 20px 0;
    min-height:560px;
    padding:40px 7% 20px;
    border:0;
    background:url(ms53.webp) center/100% 100% no-repeat;
    box-shadow:none;
    perspective:1000px
}
.detailed-book-form .detailed-birth-form {
    border:0;
    padding:0
}
.detailed-book-form .detailed-birth-form h2 {
    color:#ffe1a2;
    font:700 20px/1.5 Songti SC, SimSun, serif;
    background:linear-gradient(#b16b31, #9b3b1a);
    padding:10px 0;
    border:4px double #dfae61;
    -webkit-clip-path:polygon(3% 0, 97% 0, 100% 50%, 97% 100%, 3% 100%, 0 50%);
    clip-path:polygon(3% 0, 97% 0, 100% 50%, 97% 100%, 3% 100%, 0 50%);
    margin:0 0 24px
}
.detailed-book-form .detailed-field {
    height:52px;
    margin:20px 0;
    padding:4px 12px;
    background:url(input.webp) center/100% 100% no-repeat;
    border:0;
    font-size:16px;
    color:#555;
    font-weight:700;
    gap:0
}
.detailed-book-form .detailed-field>span, .detailed-book-form .detailed-field>legend {
    flex-basis:63px
}
.detailed-book-form .detailed-field>input, .detailed-book-form .detailed-field>button {
    background:transparent;
    border:0;
    padding:0;
    font-size:14px;
    color:#777
}
.detailed-book-form fieldset.detailed-field {
    padding-left:75px
}
.detailed-book-form fieldset.detailed-field legend {
    left:12px;
    top:16px
}
.detailed-book-form .detailed-consent {
    margin:18px 0;
    font-weight:400
}
.detailed-book-form>.detailed-back {
    display:block;
    margin:15px auto 0;
    font-size:12px
}
.detailed-book-opening {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    pointer-events:none;
    z-index:3;
    perspective:1000px
}
.detailed-book-opening img {
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    transform-origin:left center;
    backface-visibility:hidden;
    animation:detailed-book-open 1s linear 2.5s forwards
}
.detailed-book-opening img:last-child {
    animation-delay:2s
}
.detailed-birth_fortune .detailed-confirm {
    position:relative;
    background:#fff;
    border-radius:20px 20px 0 0;
    padding:24px 20px 40px;
    color:#333
}
.detailed-birth_fortune .detailed-confirm h2 {
    margin:0;
    text-align:left;
    font-size:20px;
    padding-bottom:14px;
    border-bottom:1px solid #eee
}
.detailed-birth_fortune .detailed-confirm dl {
    text-align:center
}
.detailed-birth_fortune .detailed-confirm dl>div {
    display:block;
    border:0;
    padding:7px 0
}
.detailed-birth_fortune .detailed-confirm dt {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    color:#b97a16;
    font-size:16px;
    font-weight:700;
    margin-bottom:12px
}
.detailed-birth_fortune .detailed-confirm dt:before, .detailed-birth_fortune .detailed-confirm dt:after {
    content:"◇";
    width:65px;
    border-bottom:1px solid #ddb67d;
    height:8px;
    line-height:10px
}
.detailed-birth_fortune .detailed-confirm dd {
    line-height:1.8;
    font-size:16px
}
.detailed-birth_fortune .detailed-confirm>.detailed-back {
    display:block;
    margin:20px auto 10px;
    color:#b91616;
    font-weight:700;
    text-decoration:none
}
.detailed-birth_fortune .detailed-confirm>.detailed-primary {
    background:linear-gradient(#e57751, #c64b32);
    color:#fff;
    border:5px double #ffc87a;
    font-family:Songti SC, SimSun, serif;
    letter-spacing:0
}
@keyframes detailed-book-open {
    to {
        transform:rotateY(-90deg);
        opacity:0
    }
}
@media(prefers-reduced-motion:reduce) {
    .detailed-book-opening {
        display:none
    }
    .detailed-reference-compass img {
        animation:none
    }
}
.detailed-book-form {
    animation:detailed-book-appear 2s linear
}
@keyframes detailed-book-appear {
    0% {
        transform:scale(0)
    }
    to {
        transform:scale(1)
    }
}
.detailed-reference-unlock {
    width:90%;
    -webkit-clip-path:none;
    clip-path:none;
    min-height:70px;
    padding:0;
    border:solid transparent;
    border-width:17px 35px;
    border-image:url(/assets/detailed/pay/unlock-frame.webp) 42 100 / 17px 35px stretch;
    background:linear-gradient(#ffe7a0, #e8b955) padding-box;
    box-shadow:none;
    font-size:clamp(18px, 5.6vw, 25px)!important;
    white-space:nowrap
}
.detailed-book-form .detailed-birth-form h2 {
    -webkit-clip-path:none;
    clip-path:none;
    border:solid transparent;
    border-width:10px 22px;
    border-image:url(title-frame.webp) 20 60 / 10px 22px stretch;
    background:#9b3b1a padding-box;
    padding:4px 0;
    font-size:19px;
    white-space:nowrap
}
.detailed-birth_fortune .detailed-confirm>.detailed-primary {
    -webkit-clip-path:none;
    clip-path:none;
    border:solid transparent;
    border-width:10px 25px;
    border-image:url(confirm-frame.webp) 18 50 / 10px 25px stretch;
    background:#da704e padding-box;
    font-size:20px;
    font-weight:400;
    padding:8px 0
}
.detailed-bazi-fixed-unlock span {
    -webkit-clip-path:none;
    clip-path:none;
    border:solid transparent;
    border-width:7px 20px;
    border-image:url(/assets/detailed/bazi/unlock-frame.webp) 14 40 / 7px 20px stretch;
    background:linear-gradient(#b86c35, #a44127) padding-box;
    line-height:36px
}
.detailed-bazi-locked-card strong {
    color:#ef2b16;
    font-weight:700
}
.detailed-book-form .detailed-field>span {
    flex:0 0 42px;
    white-space:nowrap
}
.detailed-book-form fieldset.detailed-field {
    padding-left:54px
}
.detailed-annual_2027.detailed-landing {
    background:#fff0cf
}
.detailed-annual_2027.detailed-landing .detailed-notice {
    background:#aa382e;
    color:#ffe6b0
}
.annual-2027-home {
    background:#fff0cf;
    padding-bottom:12px
}
.annual-2027-home header>img {
    width:100%
}
.annual-2027-form {
    padding:0 5%
}
.annual-2027-form .detailed-birth-form {
    margin:0 0 22px;
    background:#fff9eb;
    border-color:#dfb25e
}
.annual-2027-note {
    margin:10px 0 22px;
    text-align:center;
    font-size:12px;
    color:#51442b
}
.annual-2027-zodiacs {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px 5%;
    padding:0 4.8%
}
.annual-2027-zodiacs>button {
    min-width:0;
    border:0;
    border-radius:24px;
    padding:17px 15px;
    background:#ffd776;
    color:#161616;
    cursor:pointer
}
.annual-2027-zodiac-card {
    display:block;
    position:relative;
    padding:8px 7px 12px;
    border-radius:24px;
    background:#fff
}
.annual-2027-years {
    position:relative;
    z-index:1;
    display:flex;
    justify-content:space-between;
    font:15px/1.2 Arial, sans-serif;
    letter-spacing:.4px
}
.annual-2027-zodiac-card>img {
    width:78%;
    margin:-12px auto;
    border-radius:50%
}
.annual-2027-zodiac-card>strong {
    display:block;
    position:relative;
    width:88%;
    margin:7px auto 0;
    padding:3px 0;
    border:3px double #c59617;
    border-radius:6px;
    background:#ffda7b;
    color:#dc2b22;
    font:700 16px/1.2 Songti SC, SimSun, serif;
    letter-spacing:2px;
    box-shadow:0 0 0 1px #efd27e
}
.annual-2027-zodiac-card>strong:before {
    content:"❧";
    position:absolute;
    top:-13px;
    left:40%;
    width:20%;
    background:#ffda7b;
    color:#bb8914;
    font-size:16px;
    line-height:12px
}
.detailed-annual_2027.detailed-landing .detailed-bottom-note {
    color:#76664c
}
.detailed-annual_2027.detailed-landing .detailed-utilities {
    background:#fff0cf;
    color:#675138
}
.bnp-hero>.bnp-annual-banner {
    position:absolute;
    inset:0 0 auto;
    width:100%;
    height:auto;
    pointer-events:none
}
@media(max-width:360px) {
    .annual-2027-zodiacs>button {
        padding:14px 10px;
        border-radius:20px
    }
    .annual-2027-zodiac-card {
        padding-inline:5px;
        border-radius:18px
    }
    .annual-2027-years {
        font-size:13px
    }
    .annual-2027-zodiac-card>strong {
        font-size:14px;
        letter-spacing:1px
    }
}
html[data-cultural-product=name_score] {
    --c-bg: #efce9b;
    --c-paper: #fff7e5;
    --c-ink: #54351f;
    --c-muted: #927451;
    --c-accent: #9f3020;
    --c-gold: #bd944b;
    --c-line: #d6b67c;
    --c-soft: #f2deb8;
    background:var(--c-bg)
}
.reference-shell.reference-name_score {
    width:100%;
    max-width:640px;
    margin:0 auto;
    padding:0 0 20px;
    color:#51331c;
    background:#efce9b;
    font-family:Arial, PingFang SC, Microsoft YaHei, sans-serif
}
.reference-name_score button, .reference-name_score input {
    font:inherit
}
.ns-image {
    display:block;
    width:100%;
    height:auto
}
.ns-hero {
    position:relative
}
.ns-hero .ns-book, .ns-hero .ns-flag {
    position:absolute;
    animation:ns-float 5s ease-in-out infinite
}
.ns-hero .ns-book {
    width:min(20.8vw, 93.6px)
}
.ns-book.ns-item-1 {
    top:min(18.67vw, 84px);
    left:min(4vw, 18px)
}
.ns-book.ns-item-2 {
    top:min(37.33vw, 168px);
    left:min(74.67vw, 336px);
    animation-delay:-.8s
}
.ns-book.ns-item-3 {
    top:min(26.67vw, 120px);
    left:min(4vw, 18px);
    animation-delay:-2.5s
}
.ns-book.ns-item-4 {
    top:min(26.67vw, 120px);
    left:min(74.67vw, 336px);
    animation-delay:-2s
}
.ns-hero .ns-flag {
    width:min(8.53vw, 38.4px)
}
.ns-flag.ns-item-1 {
    top:min(16vw, 72px);
    left:min(16vw, 72px)
}
.ns-flag.ns-item-2 {
    top:min(32vw, 144px);
    left:min(3.2vw, 14.4px);
    animation-delay:-.6s
}
.ns-flag.ns-item-3 {
    top:min(50.67vw, 228px);
    left:min(16vw, 72px);
    animation-delay:-.8s
}
.ns-flag.ns-item-4 {
    top:min(16vw, 72px);
    left:min(72vw, 324px);
    animation-delay:-.1s
}
.ns-flag.ns-item-5 {
    top:min(32vw, 144px);
    left:min(88vw, 396px);
    animation-delay:-1s
}
.ns-flag.ns-item-6 {
    top:min(50.67vw, 228px);
    left:min(72vw, 324px);
    animation-delay:-.5s
}
.ns-form {
    position:relative;
    width:92%;
    max-width:414px;
    margin:max(-4vw, -18px) auto min(4vw, 18px)
}
.ns-form>.ns-image {
    position:absolute;
    top:max(-1.86667vw, -8.4px);
    left:min(2vw, 9px);
    width:min(88vw, 396px);
    z-index:2
}
.ns-fields {
    border:1px solid #d09f6f;
    border-radius:12px;
    min-height:min(58.66667vw, 264px);
    padding:min(13.33333vw, 60px) 12px 0;
    background:#fff
}
.ns-field {
    position:relative;
    display:flex;
    align-items:center;
    min-height:min(14.66667vw, 66px);
    margin:0;
    padding:0;
    border:0;
    border-bottom:1px solid #d9c39b;
    font-size:17px
}
.ns-field:last-child {
    border-bottom:0
}
.ns-field>span, .ns-field legend {
    width:28%;
    flex-shrink:0;
    text-align:center
}
.ns-field legend {
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%)
}
.ns-field>div {
    display:flex;
    gap:28px;
    padding-left:28%
}
.ns-field>div label {
    display:flex;
    align-items:center;
    gap:7px
}
.ns-field input:not([type=radio]), .ns-field>button {
    min-width:0;
    width:72%;
    padding:6px 0;
    background:transparent;
    border:0;
    color:#9c2b23;
    font-size:16px;
    text-align:left
}
.ns-field input::placeholder {
    color:#986e48
}
.reference-name_score input[type=checkbox], .reference-name_score input[type=radio] {
    accent-color:#9c2b23;
    width:18px;
    height:18px;
    flex-shrink:0
}
.reference-name_score .ns-primary {
    display:block;
    width:100%;
    min-height:52px;
    border:0;
    border-radius:28px;
    background:linear-gradient(#e34634, #ba211b);
    box-shadow:0 3px #9d2019;
    color:#fff7d7;
    font-size:22px;
    font-weight:700;
    cursor:pointer
}
.ns-primary:disabled {
    opacity:.6;
    cursor:wait
}
.reference-name_score .ns-start {
    width:77%;
    max-width:346px;
    margin:20px auto
}
.ns-consent {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin:15px 12px 8px;
    font-size:12px;
    color:#3f2a1b
}
.ns-consent button {
    color:#8b281d;
    border:0;
    background:transparent;
    padding:3px 1px;
    text-decoration:underline
}
.ns-note {
    margin:8px 12px;
    text-align:center;
    color:#85603e;
    font-size:12px;
    line-height:1.65
}
.ns-error {
    margin:12px 18px;
    color:#a82318;
    font-size:14px;
    line-height:1.6
}
.reference-name_score .reference-utilities {
    position:static;
    width:auto;
    margin:20px 15px 0;
    flex-direction:row;
    justify-content:center
}
.reference-name_score .reference-utilities>button:not(:first-child), .reference-name_score .reference-utilities>a {
    width:auto;
    padding:6px 12px;
    flex-direction:row;
    background:transparent;
    color:#785332;
    box-shadow:none
}
.reference-name_score .reference-utilities>button:first-child {
    position:fixed;
    right:0;
    top:300px;
    z-index:20;
    width:30px;
    min-height:100px;
    padding:10px 4px;
    border-radius:10px 0 0 10px;
    writing-mode:vertical-rl;
    background:rgba(0, 0, 0, .533);
    color:#fff;
    letter-spacing:3px;
    font-size:16px
}
.reference-name_score .reference-utilities>button:first-child span {
    display:none
}
.ns-payment {
    padding-bottom:100px
}
.ns-order {
    width:92%;
    max-width:414px;
    margin:12px auto;
    padding:14px;
    border:1px solid #c69855;
    border-radius:6px;
    background:#fff4d8
}
.ns-order h2 {
    margin:0 0 12px;
    text-align:center;
    font-size:20px;
    color:#8d291d
}
.ns-previews {
    max-width:450px;
    margin:auto
}
.ns-previews button {
    display:block;
    width:100%;
    padding:0;
    border:0;
    background:transparent;
    cursor:pointer
}
.ns-fixed {
    position:fixed;
    bottom:0;
    left:50%;
    transform:translate(-50%);
    width:100%;
    max-width:640px;
    padding:10px 15px max(10px, env(safe-area-inset-bottom));
    z-index:25;
    background:rgba(0, 0, 0, .733)
}
.ns-fixed button {
    display:block;
    width:100%;
    max-width:410px;
    min-height:56px;
    margin:auto;
    border:0;
    background:url(/assets/name-score/btnbg.png) center / 100% 100% no-repeat;
    color:#ffefad;
    font-size:21px;
    font-weight:700;
    cursor:pointer
}
.ns-overlay {
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:1100;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:16px;
    background:rgba(0, 0, 0, .6)
}
.ns-pay-dialog {
    position:relative;
    width:100%;
    max-width:414px;
    max-height:calc(100dvh - 32px);
    overflow-y:auto;
    overscroll-behavior:contain;
    padding:18px 16px 22px;
    border-radius:9px;
    background:#fff5d9;
    box-shadow:0 10px 50px rgba(0, 0, 0, .333)
}
.ns-close {
    position:absolute;
    right:5px;
    top:3px;
    width:34px;
    height:34px;
    border:0;
    background:transparent;
    color:#754624;
    font-size:26px!important
}
.ns-pay-dialog h2 {
    display:flex;
    align-items:center;
    justify-content:center;
    width:90%;
    min-height:66px;
    margin:12px auto;
    padding:6px 16px;
    background:url(/assets/name-score/patbtn.png) center / 100% 100% no-repeat;
    color:#fff3bf;
    font-size:19px;
    text-align:center
}
.ns-pay-copy {
    font-size:15px;
    line-height:1.8;
    color:#51331c
}
.ns-pay-copy b {
    color:#b13b24
}
.ns-price {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:15px 0;
    color:#8b291d
}
.ns-price strong {
    font-size:28px
}
.ns-channels {
    display:grid;
    gap:8px;
    margin-bottom:16px
}
.ns-channels button {
    display:flex;
    align-items:center;
    gap:8px;
    padding:12px;
    border:1px solid #d9bd83;
    border-radius:6px;
    background:#fffdf5;
    color:#4d351b
}
.ns-channels button[aria-checked=true] {
    border:2px solid #b93120;
    padding:11px
}
.ns-channels button b {
    margin-left:auto;
    color:#b93120
}
.cultural-name_score {
    background:#efce9b
}
.ns-score-card {
    margin:20px 0;
    padding:26px 22px;
    border:2px solid #c39b52;
    border-radius:12px;
    background:linear-gradient(135deg, #fff9e9, #ffe8b3);
    text-align:center;
    color:#6e3c1f
}
.ns-score-card h2 {
    font-size:32px;
    margin:12px 0 0;
    letter-spacing:8px
}
.ns-score-card strong {
    color:#a6301f;
    font-size:88px;
    line-height:1.4
}
.ns-score-card p {
    font-size:16px;
    line-height:1.9
}
.ns-score-card small {
    color:#967049
}
@keyframes ns-float {
    0%, to {
        transform:translateY(0)
    }
    50% {
        transform:translateY(-7px)
    }
}
@media(prefers-reduced-motion:reduce) {
    .ns-hero .ns-book, .ns-hero .ns-flag {
        animation:none
    }
}
.ns-intro {
    position:relative;
    min-height:600px;
    background:#f5daaa
}
.ns-intro>.ns-image {
    width:100%;
    min-height:600px;
    object-fit:cover
}
.ns-intro-content {
    position:absolute;
    top:18%;
    left:9%;
    width:82%;
    color:#71381e;
    text-align:center
}
.ns-intro-content>p {
    margin:20px 0;
    font-size:14px
}
.ns-name-writing {
    display:flex;
    justify-content:center;
    gap:6px
}
.ns-name-writing span {
    width:22%;
    max-width:80px;
    aspect-ratio:1;
    display:flex;
    align-items:center;
    justify-content:center;
    background:url(/assets/name-score/font_bg.png) center / contain no-repeat;
    font-family:STKaiti, KaiTi, serif;
    font-size:clamp(32px, 9vw, 52px);
    animation:ns-ink 1.2s ease-out both
}
.ns-intro-content .ref-order-details {
    margin:24px auto;
    padding:16px;
    background:rgba(255, 246, 219, .733);
    border-radius:8px
}
@keyframes ns-ink {
    0% {
        opacity:0;
        transform:translateY(5px)
    }
    to {
        opacity:1;
        transform:translateY(0)
    }
}
@media(prefers-reduced-motion:reduce) {
    .ns-name-writing span {
        animation:none
    }
}
.event-page {
    --eu:calc(100vw / 375);
    max-width:750px;
    width:100%;
    margin:auto;
    font-family:Microsoft YaHei, PingFang SC, sans-serif;
    font-size:calc(14 * var(--eu));
    line-height:1.5;
    overflow:hidden;
    color:#56321e
}
@media(min-width:750px) {
    .event-page {
        --eu:2px
    }
}
.event-page * {
    box-sizing:border-box
}
.event-page button, .event-page input, .event-page select {
    font:inherit
}
.event-page button {
    cursor:pointer
}
.event-page button:disabled {
    cursor:wait;
    opacity:.65
}
.event-image {
    display:block;
    width:100%;
    height:auto
}
.event-page p, .event-page h1, .event-page h2, .event-page h3 {
    margin:0
}
.event-page .reference-utilities {
    font-size:12px
}
.event-page .reference-back {
    display:none
}
.event-page .event-field {
    display:flex;
    align-items:center;
    min-width:0;
    margin:0 0 calc(10 * var(--eu));
    height:calc(50 * var(--eu));
    border:1px solid #cda169;
    border-radius:calc(8 * var(--eu));
    padding:0 calc(13 * var(--eu));
    background:#fffcf1;
    color:#333
}
.event-field>span {
    flex-shrink:0;
    font-weight:700;
    min-width:calc(75 * var(--eu))
}
.event-field input:not([type=radio]) {
    width:100%;
    min-width:0;
    border:0;
    background:transparent;
    outline:none;
    color:#333;
    height:100%
}
.event-field input::placeholder {
    color:#b4a38e
}
.event-field button {
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    min-width:0;
    border:0;
    background:transparent;
    color:#68543b;
    text-align:left;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    padding:0
}
.event-field button i {
    margin-left:auto;
    font-style:normal;
    padding-left:5px
}
.event-page .event-gender {
    position:relative;
    padding-left:calc(88 * var(--eu))
}
.event-gender legend {
    position:absolute;
    left:calc(13 * var(--eu));
    top:50%;
    transform:translateY(-50%);
    font-weight:700
}
.event-gender>div {
    display:flex;
    gap:calc(24 * var(--eu));
    align-items:center
}
.event-gender label {
    display:flex;
    align-items:center;
    gap:6px
}
.event-gender input {
    accent-color:#ae3230;
    width:16px;
    height:16px
}
.event-consent {
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:2px;
    font-size:calc(11 * var(--eu));
    color:#755747;
    margin-top:calc(12 * var(--eu))
}
.event-consent label {
    display:flex;
    align-items:center;
    gap:4px
}
.event-consent button {
    border:0;
    padding:0;
    background:transparent;
    color:inherit;
    text-decoration:underline
}
.event-consent input {
    accent-color:#a82428
}
.event-submit {
    display:block;
    width:100%;
    padding:0;
    border:0;
    background:transparent;
    margin:calc(24 * var(--eu)) auto 0;
    min-height:calc(48 * var(--eu));
    color:#9e1e18;
    font-weight:700
}
.event-error {
    padding:10px;
    color:#a81223;
    text-align:center
}
.event-status, .event-form-note {
    text-align:center;
    font-size:calc(12 * var(--eu));
    padding:calc(10 * var(--eu))
}
.event-payment-note {
    font-size:calc(11 * var(--eu));
    text-align:center;
    padding:calc(10 * var(--eu)) 0
}
.event-payment-recovery {
    font-size:12px
}
.event-payment-recovery:empty {
    display:none
}
.event-page.jiri-page {
    background:#c24d3d
}
.event-page.jiri-page.is-form {
    background:#ae3230
}
.jiri-home-hero {
    position:relative
}
.jiri-home-slogan {
    position:absolute;
    width:64%;
    right:19.33%;
    top:81%
}
.jiri-home-wheel {
    position:absolute;
    left:65.73%;
    top:50.57%;
    width:18%
}
.jiri-home-wheel img {
    animation:jiri-wheel 3s linear infinite
}
.jiri-home-events {
    position:absolute;
    top:13%;
    right:6%;
    width:50%;
    display:flex;
    justify-content:space-between
}
.jiri-home-events span {
    writing-mode:vertical-rl;
    border:1px solid #d4b791;
    background:#fff7d9;
    border-radius:5px;
    color:#e23325;
    padding:5px;
    font-size:calc(15 * var(--eu));
    font-weight:700;
    opacity:0;
    animation:jiri-event-label 15s linear infinite
}
.jiri-event-selection {
    margin:0 auto;
    padding:0 calc(16 * var(--eu)) calc(6 * var(--eu));
    position:relative
}
.jiri-event-selection>.event-image {
    width:74%;
    margin:0 auto calc(26 * var(--eu))
}
.jiri-event-grid {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:calc(16 * var(--eu)) calc(9 * var(--eu))
}
.jiri-event-grid button {
    border:0;
    padding:0;
    background:transparent
}
.jiri-event-grid button:hover {
    transform:translateY(-2px)
}
.jiri-home-details {
    padding:0 calc(12 * var(--eu))
}
.jiri-home-details img {
    margin-bottom:5px
}
.jiri-form-wrap {
    min-height:100vh;
    padding:calc(20 * var(--eu)) calc(15 * var(--eu)) calc(80 * var(--eu));
    background-size:100% 100%
}
.jiri-back {
    border:0;
    background:transparent;
    color:#ffe0ad;
    padding:0 0 calc(12 * var(--eu));
    font-size:12px
}
.jiri-form {
    background:url(/assets/reference/auspicious-date/20250116153828747.png) center/100% 100% no-repeat;
    padding:calc(37 * var(--eu)) calc(16 * var(--eu)) calc(18 * var(--eu))
}
.jiri-form-title {
    display:flex;
    align-items:center;
    justify-content:center;
    height:calc(50 * var(--eu));
    margin:0 0 calc(10 * var(--eu))!important;
    background:url(/assets/reference/auspicious-date/20250116153830934.png) center/100% 100%;
    font-size:calc(20 * var(--eu));
    font-weight:700;
    color:#ae3230
}
.event-person h2 {
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-size:calc(16 * var(--eu));
    margin:calc(12 * var(--eu)) 0 calc(8 * var(--eu));
    color:#8d3529
}
.event-person h2 small {
    font-size:12px;
    font-weight:400
}
.event-person h2 button {
    border:0;
    background:transparent;
    color:#8d3529;
    padding:0 4px;
    text-decoration:underline
}
.event-person.is-groom, .event-person.is-bride {
    height:calc(92 * var(--eu));
    padding-left:calc(65 * var(--eu));
    background:url(/assets/reference/auspicious-date/20250116153829190.png) center/100% 100%;
    margin-bottom:calc(10 * var(--eu))
}
.event-person.is-bride {
    background-image:url(/assets/reference/auspicious-date/20250116153830877.png)
}
.event-person.is-groom .event-field, .event-person.is-bride .event-field {
    height:50%;
    margin:0;
    border:0;
    padding:0 calc(10 * var(--eu));
    background:transparent;
    font-size:calc(14 * var(--eu))
}
.event-person.is-groom .event-field>span, .event-person.is-bride .event-field>span {
    display:none
}
.jiri-range span {
    width:45%;
    text-align:right
}
.jiri-range select {
    width:55%;
    height:100%;
    padding:0 5px;
    border:0;
    background:transparent;
    font-weight:700;
    color:#333
}
.jiri-page .event-form-note {
    color:#f9b6a3
}
.jiri-page .reference-utilities {
    color:#fff1cf
}
.jiri-scene {
    background:#700300 url(/assets/reference/auspicious-date/20250116155420132.png) top center/100% 100% no-repeat;
    min-height:calc(700 * var(--eu));
    padding:calc(78 * var(--eu)) calc(28 * var(--eu)) calc(50 * var(--eu));
    color:#ffdf9d;
    text-align:center
}
.jiri-scene h1 {
    font:700 calc(25 * var(--eu))/1.5 serif;
    color:#ffe2a4;
    letter-spacing:2px
}
.jiri-scene>p {
    font-size:calc(12 * var(--eu));
    margin:calc(8 * var(--eu)) 0 calc(20 * var(--eu))
}
.jiri-scene-tabs {
    display:flex;
    justify-content:space-between;
    color:#ffe3b0;
    font-size:calc(16 * var(--eu));
    border-bottom:1px solid #d09e61;
    padding-bottom:10px
}
.jiri-scene-tabs span:first-child {
    color:#ffebc7;
    font-weight:700
}
.jiri-scene-dial {
    position:relative;
    width:85%;
    margin:calc(24 * var(--eu)) auto
}
.jiri-scene-dial>img {
    animation:jiri-dial 14s linear infinite;
    animation-play-state:paused
}
.jiri-scene.is-active .jiri-scene-dial>img {
    animation-play-state:running
}
.jiri-scene-dial>div {
    position:absolute;
    top:22%;
    right:22%;
    bottom:22%;
    left:22%;
    border:2px solid #bd8141;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#9b4227;
    box-shadow:0 0 0 8px rgba(239, 197, 132, .333)
}
.jiri-scene-dial strong {
    font-size:calc(35 * var(--eu));
    font-family:serif
}
.jiri-scene-dial b {
    font-size:calc(16 * var(--eu));
    letter-spacing:4px
}
.jiri-scene-progress>div {
    display:flex;
    align-items:center;
    gap:12px;
    font-size:calc(12 * var(--eu));
    margin:calc(12 * var(--eu)) 0
}
.jiri-scene-progress i {
    height:7px;
    flex:1;
    border:1px solid #d8ae70;
    border-radius:8px;
    overflow:hidden
}
.jiri-scene-progress i b {
    height:100%;
    display:block;
    background:#eaca91;
    transform-origin:left;
    animation:jiri-progress 1.5s linear both
}
.jiri-scene-progress em {
    font-style:normal
}
.jiri-scene:not(.is-active) .jiri-scene-progress i b {
    animation:none
}
.event-page.jiri-page.event-payment {
    background:#b44327
}
.jiri-payment-banner {
    width:100%;
    height:auto
}
.jiri-payment-heading {
    text-align:center;
    color:#ffe3b0;
    padding:35px
}
.jiri-payment-intro {
    color:#ffe3b0;
    font-size:calc(12 * var(--eu));
    text-align:center;
    padding:calc(5 * var(--eu)) calc(20 * var(--eu)) calc(12 * var(--eu))
}
.jiri-checkout {
    position:relative;
    width:93.6%;
    margin:0 auto calc(20 * var(--eu));
    padding:calc(20 * var(--eu)) calc(12 * var(--eu)) calc(18 * var(--eu));
    background:#fff4d9 url(/assets/reference/auspicious-date/20250116160904685.png) top center/100% 100% no-repeat;
    border-radius:calc(12 * var(--eu));
    color:#683d25
}
.jiri-checkout>h2 {
    text-align:center;
    color:#a43926;
    font-size:calc(17 * var(--eu));
    font-weight:700;
    margin-bottom:calc(18 * var(--eu))
}
.jiri-participants {
    display:flex;
    justify-content:center;
    position:relative;
    gap:calc(14 * var(--eu))
}
.jiri-participants>div {
    display:flex;
    align-items:center;
    flex-direction:column;
    flex:1;
    min-width:0;
    font-size:calc(11 * var(--eu));
    text-align:center
}
.jiri-participants>div img {
    width:calc(60 * var(--eu));
    height:calc(60 * var(--eu));
    object-fit:contain
}
.jiri-participants strong {
    font-size:calc(16 * var(--eu));
    margin:6px
}
.jiri-participant-heart {
    position:absolute;
    width:calc(25 * var(--eu));
    top:calc(20 * var(--eu));
    left:calc(50% - 12.5 * var(--eu))
}
.jiri-purchased-window {
    text-align:center;
    font-size:calc(12 * var(--eu));
    margin:calc(12 * var(--eu)) 0!important
}
.event-payment-price {
    text-align:center;
    padding:calc(10 * var(--eu)) 0;
    color:#944135;
    display:flex;
    align-items:baseline;
    justify-content:center;
    flex-wrap:wrap;
    gap:3px
}
.event-payment-price strong {
    font-size:calc(24 * var(--eu));
    color:#db1e21
}
.event-payment-price del {
    font-size:calc(12 * var(--eu));
    margin-left:8px;
    color:#a28776
}
.event-payment-channels {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
    margin:calc(10 * var(--eu)) 0
}
.event-payment-channels button {
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid #dcbaa1;
    border-radius:6px;
    background:#fffdf6;
    padding:8px 12px;
    color:#493322;
    min-width:110px
}
.event-payment-channels button[aria-checked=true] {
    border-color:#bd4b32
}
.event-payment-channels b {
    color:#d96058
}
.event-payment-channels .ref-payment-icon, .event-payment-submit .ref-payment-icon {
    width:24px;
    height:24px
}
.event-payment-submit {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    border:0;
    border-radius:6px;
    background:#20ad40;
    color:#fff;
    font-weight:700;
    font-size:calc(20 * var(--eu));
    padding:calc(13 * var(--eu));
    width:96%;
    margin:calc(12 * var(--eu)) auto
}
.jiri-payment-preview {
    padding:0 calc(12 * var(--eu)) calc(25 * var(--eu))
}
.jiri-payment-preview>img {
    margin-bottom:calc(12 * var(--eu))
}
.jiri-calendar-preview, .jiri-details-preview {
    width:100%;
    padding:0;
    border:0;
    background:#fff4d9;
    position:relative;
    overflow:hidden;
    border-radius:6px;
    margin-bottom:calc(14 * var(--eu))
}
.jiri-calendar-preview>span {
    position:absolute;
    top:3%;
    left:4%;
    width:92%;
    text-align:center;
    font-size:calc(15 * var(--eu));
    color:#8d2f20
}
.jiri-calendar-preview b {
    color:#c5151d
}
.jiri-calendar-preview small {
    display:block;
    padding:4px;
    background:#fff4d9;
    color:#85624d;
    font-size:11px
}
.jiri-details-preview>span {
    display:block;
    background:#db4133;
    border:2px solid #f5d499;
    border-radius:28px;
    color:#fff3b8;
    padding:calc(10 * var(--eu));
    margin:calc(8 * var(--eu)) calc(25 * var(--eu));
    font-size:calc(18 * var(--eu))
}
.jiri-service-scroll {
    height:calc(395 * var(--eu));
    overflow:hidden;
    color:#723a25;
    background:url(/assets/reference/auspicious-date/20250116160902718.png) center/100% 100%;
    padding:0 calc(18 * var(--eu)) calc(25 * var(--eu));
    font-size:calc(13 * var(--eu))
}
.jiri-service-scroll h2 {
    font-size:calc(20 * var(--eu));
    color:#fff;
    background:#cd673b;
    width:64%;
    height:calc(39 * var(--eu));
    text-align:center;
    margin:0 auto calc(40 * var(--eu))!important
}
.jiri-service-scroll>div {
    height:calc(295 * var(--eu));
    overflow:hidden
}
.jiri-service-scroll>div>div {
    animation:event-service-scroll 18s linear infinite
}
.jiri-service-scroll p {
    display:flex;
    justify-content:space-between;
    height:calc(48 * var(--eu));
    align-items:center;
    border-top:1px solid #baa487
}
.jiri-service-scroll b {
    color:#c72b21
}
.event-page.relationship-page {
    background:#fbc0b9;
    color:#5b250a
}
.relationship-hero {
    position:relative
}
.relationship-vista {
    position:absolute;
    top:7.8%;
    left:0;
    z-index:3
}
.relationship-title {
    position:absolute;
    bottom:20%;
    width:80%;
    left:10%;
    z-index:4
}
.relationship-couple {
    position:absolute;
    top:3.9%;
    inset-inline:0;
    height:70%;
    z-index:2
}
.relationship-couple>div {
    position:absolute;
    top:0;
    left:37.1%;
    width:55.5%;
    margin-top:3.9%;
    animation:relationship-couple-fade 8s ease-in-out infinite
}
.relationship-couple>div+div {
    left:43.9%;
    width:49.4%;
    margin-top:2.9%;
    animation-delay:-4s;
    opacity:0
}
.relationship-form-wrap {
    width:93.33%;
    margin:-24% auto 0;
    position:relative;
    z-index:5;
    padding:calc(39 * var(--eu)) calc(12 * var(--eu)) calc(8 * var(--eu));
    border-radius:calc(6 * var(--eu));
    background:#fffef8
}
.relationship-form-title {
    position:absolute;
    top:calc(15 * var(--eu));
    left:25%;
    width:50%
}
.relationship-form {
    padding-top:0
}
.relationship-page .event-person {
    margin:0
}
.relationship-page .event-field {
    width:90%;
    height:calc(26.5 * var(--eu));
    min-height:32px;
    margin:0 auto calc(8 * var(--eu));
    padding:0 calc(8 * var(--eu));
    border-color:#f1cfb5;
    border-radius:30px;
    background:#fff;
    font-size:calc(12 * var(--eu))
}
.relationship-page .event-field>span {
    min-width:calc(65 * var(--eu));
    font-weight:400;
    color:#6c461d
}
.relationship-page .event-gender {
    padding-left:calc(73 * var(--eu))
}
.relationship-page .event-gender legend {
    font-weight:400;
    color:#6c461d;
    left:calc(8 * var(--eu))
}
.relationship-page .event-gender>div {
    gap:calc(12 * var(--eu))
}
.relationship-page .event-gender label {
    display:block;
    position:relative;
    cursor:pointer
}
.relationship-page .event-gender input {
    position:absolute;
    opacity:0;
    width:22px;
    height:22px
}
.relationship-page .event-gender span {
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid #dcbfa0;
    border-radius:50%;
    width:calc(20 * var(--eu));
    height:calc(20 * var(--eu));
    min-width:22px;
    min-height:22px;
    color:#333
}
.relationship-page .event-gender input:checked+span {
    background:#9d2e41;
    color:#fff
}
.relationship-page .event-submit {
    width:85%;
    margin:calc(12 * var(--eu)) auto calc(8 * var(--eu));
    min-height:0
}
.relationship-page .event-submit>.event-image {
    animation:relationship-button 1.5s linear infinite
}
.relationship-page .event-consent {
    font-size:calc(10 * var(--eu));
    margin:6px 0
}
.relationship-sample {
    width:96.5%;
    margin:auto;
    border-left:1px solid #ee8e95;
    border-right:1px solid #ee8e95;
    background:#fffef8;
    padding:calc(16 * var(--eu));
    text-align:center;
    font-family:serif
}
.relationship-sample>div:first-child {
    background:#fff4db;
    border:1px solid #c86843;
    padding:15px;
    margin-bottom:10px
}
.relationship-sample h2 {
    color:#a92020;
    font-size:calc(25 * var(--eu))
}
.relationship-sample p {
    letter-spacing:4px;
    margin:8px 0
}
.relationship-sample span {
    font-size:11px;
    color:#9b7761
}
.relationship-partner-section {
    position:relative
}
.relationship-partner-art {
    position:relative;
    width:100%;
    height:0;
    padding-top:122%;
    overflow:hidden
}
.relationship-partner-art img {
    position:absolute;
    top:0;
    left:0;
    width:100%
}
.relationship-mentor {
    width:97%;
    margin:0 auto calc(24 * var(--eu));
    padding:calc(8 * var(--eu)) calc(15 * var(--eu)) calc(14 * var(--eu));
    background:#fffef8;
    border:1px solid #f1a5ab;
    border-top:0;
    border-radius:0 0 16px 16px
}
.relationship-score-sample {
    background:#fffef8;
    text-align:center;
    padding:calc(14 * var(--eu));
    margin:0 1.6%;
    font-size:calc(15 * var(--eu));
    border:1px solid #f4adab;
    border-top:0
}
.relationship-score-sample b {
    color:#d33939;
    display:inline-block;
    font-size:calc(20 * var(--eu));
    animation:relationship-score 2s ease-in-out infinite
}
.relationship-star {
    padding:calc(17 * var(--eu)) calc(11 * var(--eu))
}
.relationship-star header {
    background:#b83b35;
    border-radius:7px 7px 0 0;
    padding:calc(10 * var(--eu))
}
.relationship-star header img {
    width:48%;
    margin:auto
}
.relationship-star>img {
    background:#fef8f3;
    border-radius:0 0 7px 7px;
    padding:calc(15 * var(--eu))
}
.relationship-fixed-action {
    border:0;
    background:transparent!important;
    width:100%;
    padding:0!important;
    box-shadow:none!important
}
.relationship-fixed-action img {
    width:100%;
    height:auto
}
.relationship-page.event-payment, .relationship-page.event-waiting {
    background:#fbc0b9 url(/assets/reference/relationship-count/bg-CGjVaV5-.jpg) top center/100% auto no-repeat
}
.relationship-scroll {
    padding-top:calc(40 * var(--eu));
    text-align:center
}
.relationship-scroll>h1 {
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    -webkit-clip-path:inset(50%);
    clip-path:inset(50%)
}
.relationship-scroll-paper {
    width:85%;
    height:calc(365 * var(--eu));
    margin:calc(3 * var(--eu)) auto calc(24 * var(--eu));
    padding:calc(23 * var(--eu)) calc(20 * var(--eu));
    background-position:center;
    background-size:100% 100%;
    background-repeat:no-repeat;
    display:flex;
    color:#681e15
}
.relationship-scroll-grid {
    width:85%;
    border:1px solid #d45b3e;
    display:flex;
    flex-direction:column
}
.relationship-scroll-columns {
    display:flex;
    border-bottom:3px double #d45b3e
}
.relationship-scroll-columns>div {
    width:25%;
    display:flex;
    flex-direction:column;
    border-right:1px solid #d45b3e;
    text-align:center
}
.relationship-scroll-columns>div:last-child {
    border-right:0
}
.relationship-scroll-columns b {
    font:700 calc(14 * var(--eu))/2 serif;
    border-bottom:1px solid #d45b3e
}
.relationship-scroll-columns strong {
    display:flex;
    align-items:center;
    justify-content:center;
    height:calc(66 * var(--eu));
    font-size:calc(20 * var(--eu));
    writing-mode:vertical-rl;
    letter-spacing:3px;
    width:100%;
    opacity:0;
    animation:event-reveal .6s linear forwards
}
.relationship-scroll-columns span {
    font-size:calc(11 * var(--eu));
    border-top:1px solid #d45b3e;
    opacity:0;
    animation:event-reveal .5s linear forwards
}
.relationship-scroll-poem {
    display:flex;
    flex:1;
    justify-content:space-around;
    align-items:center;
    flex-direction:row-reverse
}
.relationship-scroll-poem p {
    writing-mode:vertical-rl;
    font:700 calc(14 * var(--eu))/1.5 serif;
    letter-spacing:2px;
    opacity:0;
    animation:event-reveal .7s linear forwards
}
.relationship-scroll-stages {
    border-top:1px solid #d45b3e;
    display:flex
}
.relationship-scroll-stages span {
    width:16.66%;
    border-right:1px solid #d45b3e;
    padding:4px 0;
    font-size:calc(10 * var(--eu));
    writing-mode:vertical-rl;
    opacity:0;
    animation:event-reveal .5s linear forwards
}
.relationship-scroll-paper aside {
    width:15%;
    border:1px solid #d45b3e;
    border-left:0;
    display:flex;
    align-items:center;
    flex-direction:column;
    overflow:hidden;
    padding:calc(8 * var(--eu)) 2px;
    opacity:0;
    animation:event-reveal 1s .5s forwards
}
.relationship-scroll-paper aside b {
    display:block;
    border-radius:50px;
    background:#dc634c;
    color:#fff;
    font-size:calc(17 * var(--eu));
    line-height:1.2;
    padding:4px
}
.relationship-scroll-paper aside span {
    writing-mode:vertical-rl;
    letter-spacing:2px;
    font-size:calc(12 * var(--eu));
    margin-top:8px
}
.relationship-card {
    width:97%;
    margin:calc(28 * var(--eu)) auto calc(30 * var(--eu));
    padding:calc(55 * var(--eu)) calc(15 * var(--eu)) calc(20 * var(--eu));
    background:#fffef8;
    border:1px solid #ec9fa2;
    border-radius:calc(13 * var(--eu));
    position:relative;
    box-shadow:inset 0 0 0 5px #fffaf1, inset 0 0 0 6px #f1bdbe
}
.relationship-card:before, .relationship-card:after {
    content:"✿";
    position:absolute;
    color:#d9777f;
    font-size:calc(13 * var(--eu));
    left:7px;
    top:4px
}
.relationship-card:after {
    left:auto;
    right:7px
}
.relationship-card>h2 {
    position:absolute;
    left:12%;
    top:calc(-7 * var(--eu));
    width:76%;
    height:calc(40 * var(--eu));
    padding-top:calc(6 * var(--eu));
    text-align:center;
    background:linear-gradient(#ee7963, #c91d25);
    color:#fff4d7;
    text-shadow:1px 1px #9c251c;
    border-radius:12px 12px 25px 25px;
    box-shadow:0 4px 4px rgba(178, 84, 62, .2);
    font:700 calc(19 * var(--eu))/1.4 serif
}
.relationship-checkout .ref-order-details {
    padding:0 calc(22 * var(--eu));
    font-size:calc(13 * var(--eu));
    color:#555
}
.relationship-checkout-copy {
    font-size:calc(14 * var(--eu));
    line-height:1.5;
    color:#555;
    padding:calc(12 * var(--eu)) calc(22 * var(--eu)) calc(8 * var(--eu))
}
.relationship-price-card {
    padding:calc(10 * var(--eu)) calc(10 * var(--eu)) 0
}
.relationship-page .event-payment-price {
    justify-content:flex-start;
    background:#fff;
    border:1px solid #ffefd9;
    border-bottom:0;
    border-radius:12px 12px 0 0;
    padding:calc(14 * var(--eu)) calc(15 * var(--eu)) calc(8 * var(--eu));
    text-align:left;
    color:#555;
    font-weight:700
}
.relationship-page .event-payment-price strong {
    font-size:calc(20 * var(--eu));
    color:#fa6060
}
.relationship-page .event-payment-price del {
    font-size:calc(12 * var(--eu));
    flex-basis:100%;
    margin:4px 0 0;
    font-weight:400
}
.relationship-page .event-payment-channels {
    justify-content:flex-start;
    margin:0;
    padding:calc(8 * var(--eu)) calc(15 * var(--eu)) calc(24 * var(--eu));
    border:1px solid #ffefd9;
    border-top:0;
    border-radius:0 0 12px 12px;
    background:#fff;
    flex-wrap:wrap
}
.relationship-page .event-payment-channels button {
    background:transparent;
    border:0;
    padding:0;
    font-size:calc(14 * var(--eu));
    min-width:0
}
.relationship-unlock {
    position:relative;
    background:transparent;
    color:#a52d40;
    border-radius:0;
    font-family:serif;
    font-size:calc(20 * var(--eu));
    margin-top:calc(28 * var(--eu));
    padding:0;
    min-height:calc(54 * var(--eu))
}
.relationship-unlock>.event-image {
    animation:relationship-button 1.5s linear infinite
}
.relationship-unlock-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:calc(12 * var(--eu));
    margin:0 calc(10 * var(--eu)) calc(20 * var(--eu));
    padding-bottom:calc(8 * var(--eu));
    border-bottom:1px solid #fff4ec
}
.relationship-unlock-row>.relationship-unlock-art {
    width:43%;
    flex-shrink:0;
    border-radius:8px;
    aspect-ratio:257/263;
    position:relative;
    overflow:hidden
}
.relationship-unlock-art img {
    position:absolute;
    width:291.829%;
    max-width:none;
    top:0;
    left:0
}
.row-0 .relationship-unlock-art img {
    left:-23.347%;
    top:-57.034%
}
.row-1 .relationship-unlock-art img {
    left:-167.315%
}
.row-2 .relationship-unlock-art {
    aspect-ratio:257/292
}
.row-2 .relationship-unlock-art img {
    left:-21.79%
}
.row-3 .relationship-unlock-art {
    aspect-ratio:257/295
}
.row-3 .relationship-unlock-art img {
    left:-169.65%
}
.relationship-unlock-row>div:not(.relationship-unlock-art) {
    flex:1;
    min-width:0;
    font-size:calc(14 * var(--eu));
    font-weight:500;
    line-height:1.55
}
.relationship-unlock-row b {
    color:#e83e2c
}
.relationship-unlock-row.row-1, .relationship-unlock-row.row-3 {
    flex-direction:row-reverse
}
.relationship-unlock-row button {
    color:#fff;
    background:linear-gradient(#ff7b4b, #ef1b0a);
    border:0;
    border-radius:30px;
    padding:6px 16px;
    margin-top:8px;
    font-size:calc(14 * var(--eu))
}
.relationship-pay-mentor {
    margin:0 calc(-8 * var(--eu))
}
.relationship-page .event-payment-note {
    color:#986f61
}
.event-waiting-card {
    text-align:center
}
.jiri-page.event-waiting {
    background:#710300
}
.event-waiting .jiri-scene {
    min-height:0;
    padding-bottom:calc(20 * var(--eu))
}
.event-waiting .jiri-scene-progress {
    display:none
}
.event-waiting .jiri-checkout {
    margin-top:calc(-10 * var(--eu));
    padding-top:calc(25 * var(--eu))
}
.event-waiting-record {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:12px;
    border:1px dashed #d4a184;
    border-radius:8px
}
.event-waiting-record small {
    flex-basis:100%;
    font-size:11px
}
.event-waiting-record strong {
    font-size:calc(15 * var(--eu));
    overflow-wrap:anywhere
}
.event-waiting-record button {
    border:1px solid #bd8062;
    border-radius:5px;
    background:#fff4e0;
    color:#773b25;
    padding:3px 8px
}
.event-waiting-contact {
    padding:calc(22 * var(--eu)) 0 calc(12 * var(--eu))
}
.event-waiting-contact h3 {
    font-size:calc(23 * var(--eu));
    color:#a72f24
}
.event-waiting-contact p {
    font-size:calc(13 * var(--eu));
    padding:8px 0
}
.event-teacher-button {
    width:100%;
    border:0;
    border-radius:7px;
    background:linear-gradient(#45c245, #16a431);
    color:#fff;
    font-weight:700;
    font-size:calc(16 * var(--eu));
    padding:calc(13 * var(--eu)) 8px;
    margin:8px 0
}
.event-waiting-status {
    border-top:1px solid #e8cbb4;
    padding:calc(18 * var(--eu)) 0
}
.event-waiting-status h3 {
    font-size:calc(18 * var(--eu));
    color:#a23e29
}
.event-waiting-status p {
    font-size:calc(13 * var(--eu));
    padding:10px 0
}
.event-report-button {
    border:1px solid #cf9e6e;
    border-radius:7px;
    color:#a6402d;
    background:#fff1d5;
    width:100%;
    padding:12px;
    font-weight:700
}
.event-working-dot {
    display:inline-block;
    border:2px solid #d1a27f;
    border-top-color:#a33525;
    width:14px;
    height:14px;
    border-radius:50%;
    vertical-align:middle;
    margin-left:8px;
    animation:jiri-dial 1s linear infinite
}
.event-waiting-qr {
    padding-top:10px
}
.event-waiting-qr>small {
    display:block;
    font-size:12px;
    padding:8px
}
.event-service-link {
    display:inline-block;
    margin-top:12px;
    text-decoration:underline
}
.event-waiting .relationship-scroll-paper {
    height:calc(350 * var(--eu))
}
@keyframes jiri-wheel {
    0%, 66% {
        transform:rotate(0)
    }
    to {
        transform:rotate(360deg)
    }
}
@keyframes jiri-event-label {
    0%, 18% {
        opacity:1
    }
    22%, to {
        opacity:0
    }
}
@keyframes jiri-dial {
    to {
        transform:rotate(360deg)
    }
}
@keyframes jiri-progress {
    0% {
        transform:scaleX(0)
    }
    to {
        transform:scaleX(1)
    }
}
@keyframes relationship-couple-fade {
    0%, 40% {
        opacity:1
    }
    50%, 90% {
        opacity:0
    }
    to {
        opacity:1
    }
}
@keyframes relationship-button {
    0%, to {
        transform:scale(1)
    }
    50% {
        transform:scale(1.045)
    }
}
@keyframes relationship-score {
    0%, to {
        transform:translateY(-3px)
    }
    50% {
        transform:translateY(3px)
    }
}
@keyframes event-reveal {
    to {
        opacity:1
    }
}
@keyframes event-service-scroll {
    to {
        transform:translateY(calc(-48 * var(--eu)))
    }
}
@media(prefers-reduced-motion:reduce) {
    .event-page * {
        animation-duration:.01ms!important;
        animation-delay:0s!important;
        animation-iteration-count:1!important
    }
    .relationship-couple>div+div {
        display:none
    }
    .jiri-home-events span {
        opacity:1
    }
}
.auspicious-dates details {
    border-top:1px solid #d7bda0;
    padding:14px 0
}
.auspicious-dates summary {
    cursor:pointer;
    line-height:1.7
}
.auspicious-dates summary span {
    font-size:.85em
}
.auspicious-dates dl {
    display:grid;
    gap:10px
}
.auspicious-dates dd {
    margin:4px 0;
    font-size:.88em
}
.cultural-auspicious_date {
    --c-red:#a52017;
    --c-ink:#542c25;
    --c-bg:#fff4de
}
.cultural-relationship_count {
    --c-red:#c53b56;
    --c-ink:#622332;
    --c-bg:#fff3ef
}
.jiri-page.event-waiting .jiri-scene {
    padding:22px 24px 12px
}
.jiri-page.event-waiting .jiri-scene h1 {
    font-size:21px
}
.jiri-page.event-waiting .jiri-scene>p {
    font-size:12px;
    margin:4px 0 10px
}
.jiri-page.event-waiting .jiri-scene-tabs {
    font-size:12px;
    padding-bottom:6px
}
.jiri-page.event-waiting .jiri-scene-dial {
    width:42%;
    max-width:148px;
    margin:12px auto 4px
}
.jiri-page.event-waiting .jiri-scene-dial strong {
    font-size:25px
}
.jiri-page.event-waiting .jiri-scene-dial b {
    font-size:10px;
    letter-spacing:2px
}
.jiri-page.event-waiting .jiri-checkout {
    padding-top:16px
}
.jiri-page.event-waiting .jiri-checkout>h2 {
    margin-bottom:8px
}
.jiri-page.event-waiting .event-waiting-contact {
    padding:8px 0 12px
}
.jiri-page.event-waiting .event-waiting-contact h3 {
    font-size:21px
}
.jiri-page.event-waiting .event-waiting-contact p {
    padding:5px 0
}
.jiri-page.event-waiting .event-teacher-button {
    font-size:16px;
    padding:12px 8px
}
.auspicious-dates-more {
    position:relative;
    margin-top:8px;
    padding:14px 0 0
}
.auspicious-dates-veiled {
    height:110px;
    overflow:hidden;
    filter:blur(4px);
    opacity:.55;
    -webkit-mask-image:linear-gradient(#000, transparent);
    mask-image:linear-gradient(#000, transparent);
    pointer-events:none;
    -webkit-user-select:none;
    user-select:none
}
.auspicious-dates-veiled>div {
    display:flex;
    align-items:center;
    gap:14px;
    height:38px;
    border-top:1px solid #d7bda0
}
.auspicious-dates-veiled i, .auspicious-dates-veiled span, .auspicious-dates-veiled b {
    display:block;
    height:9px;
    background:#b49879;
    border-radius:5px
}
.auspicious-dates-veiled i {
    width:25%
}
.auspicious-dates-veiled span {
    width:40%
}
.auspicious-dates-veiled b {
    width:14%
}
.auspicious-dates-invitation {
    position:relative;
    margin-top:-40px;
    text-align:center
}
.auspicious-dates-invitation h3 {
    color:var(--c-red);
    font-size:19px
}
.auspicious-dates-invitation p {
    font-size:14px;
    line-height:1.9;
    text-align:left
}
.auspicious-dates-invitation .cultural-primary {
    display:flex
}