/* Scoped presentation layer. It does not change availability, prices, forms or result content. */
[data-sjm-companion]{--sjmc-ink:#262137;--sjmc-paper:#fffaf7;--sjmc-accent:#b74f61;isolation:isolate;box-sizing:border-box;background:#191c31;color:#fffaf7;border-radius:28px;overflow:hidden;margin:22px auto 36px;max-width:1180px;box-shadow:0 20px 60px #26213714}
[data-sjm-companion] *{box-sizing:border-box}
.sjmc-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-rows:auto 1fr;gap:0 48px;padding:52px 56px 38px;position:relative;background:radial-gradient(ellipse at 90% 25%,#51537366,transparent 64%)}
.sjmc-intro{grid-column:1;position:relative;z-index:1}
.sjmc-eyebrow{margin:0 0 19px;color:#ebcbb4;font-size:12px;font-weight:700;letter-spacing:.13em}
.sjmc-intro h1{margin:0;color:#fffaf7;font-family:inherit;font-size:clamp(30px,3.5vw,46px);font-weight:750;letter-spacing:-.055em;line-height:1.25;word-break:keep-all}
.sjmc-lead{font-size:15px;line-height:1.9;color:#dddce9;margin:20px 0}
.sjmc-steps{display:flex;flex-wrap:wrap;gap:12px;font-size:11px;letter-spacing:.01em;color:#a5a5bf;margin:26px 0 24px}
.sjmc-steps [aria-current]{color:#f0d5bd}
.sjmc-visual{grid-column:2;grid-row:1 / 3;align-self:stretch;display:flex;align-items:center;justify-content:center;position:relative;border-radius:160px 160px 24px 24px;overflow:hidden;background:#141c2e;min-width:0}
.sjmc-portrait{width:100%;aspect-ratio:1 / 2;overflow:hidden;position:relative;z-index:1}
.sjmc-portrait img,.sjmc-result-portrait img{display:block;width:300%;max-width:none;height:100%;object-fit:fill;transform:translateX(0);transition:opacity .2s ease}
.sjmc-portrait[data-expression="listening"] img{transform:translateX(-33.333333%)}
.sjmc-portrait[data-expression="explaining"] img{transform:translateX(-66.666667%)}
.sjmc-portrait[data-expression] img{animation:sjmc-enter .35s ease both}
.sjmc-visual:after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(transparent 75%,#191c31)}
.sjmc-signature{position:absolute;bottom:26px;z-index:3;font-size:11px;color:#f0d5bd;letter-spacing:.14em}
.sjmc-orbit{position:absolute;inset:5%;border:1px solid #e7c9aa44;border-radius:50%;animation:sjmc-orbit 12s ease-in-out infinite;z-index:3;pointer-events:none}
.sjmc-conversation{grid-column:1;z-index:1;min-width:0}
.sjmc-speaker{display:flex;align-items:center;gap:10px;font-size:11px;color:#b8b6cc;margin-bottom:10px}
.sjmc-speaker strong{font-size:15px;color:#f3dbc4}
.sjmc-motion{margin-left:auto;background:transparent;border:0;border-bottom:1px solid #656079;color:#ddd7e8;font:inherit;font-size:11px;min-height:34px;cursor:pointer;padding:0 3px}
.sjmc-bubble{position:relative;margin:0 0 17px;background:#fffaf7;color:var(--sjmc-ink);border-radius:3px 18px 18px 18px;min-height:92px;padding:20px 22px;font-size:15px;line-height:1.75;word-break:keep-all;overflow-wrap:anywhere}
.sjmc-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:19px}
.sjmc-choices button{min-height:44px;padding:12px 10px;border:1px solid #77708d;border-radius:10px;background:#ffffff08;color:#f4eefa;font:inherit;font-size:13px;line-height:1.5;word-break:keep-all;cursor:pointer;transition:background .18s,border-color .18s}
.sjmc-choices button:hover,.sjmc-choices button[aria-pressed="true"]{background:#f4dcd122;color:#fff4d7;border-color:#f4c5ae}
.sjmc-next{display:flex;justify-content:space-between;align-items:center;min-height:52px;border-radius:12px;padding:15px 21px;background:#edc7b2;color:#332437;text-decoration:none;font-size:15px;font-weight:750;line-height:1.4;box-shadow:0 5px 15px #0002}
.sjmc-next:hover{background:#f8d9c8;color:#332437}
.sjmc-next span{font-size:21px}
.sjmc-note{color:#c2bdcf;font-size:11px;line-height:1.7;margin:12px 0 0;word-break:keep-all}
.sjmc-secondary{display:block;color:#ebcbb4;text-decoration:none;font-size:12px;margin-top:15px;padding:6px 0}
[data-sjm-companion] :focus-visible{outline:3px solid #f4d184;outline-offset:4px}
.sjmc-ready[data-sjm-page="home"] .r91-hero,.sjmc-ready[data-sjm-page="lifetime"] .v35-life-opening,.sjmc-ready[data-sjm-page="today"] #input-screen>.hero{display:none}
.sjmc-ready{background:#f7f4f6}
.sjmc-ready .sjm-header,.sjmc-ready .sjm-mobile-bottom-nav{background:#fffaf7}
.sjmc-ready .sjm-header-cta{background:#413954;color:#fffaf7}
.sjmc-ready[data-sjm-page="home"] [data-sjm-companion]{width:calc(100% - 40px)}
.sjmc-ready[data-sjm-page="lifetime"] .page-shell{max-width:1180px}
.sjmc-ready #birth-form,.sjmc-ready #fortune-form{scroll-margin-top:90px}
.sjmc-ready .question-entry-panel,.sjmc-ready .panel,.sjmc-ready .form-card{border-radius:20px}
.sjmc-ready .question-entry-card[aria-pressed="true"]{border-color:#a76278;background:#f8edf2}
.sjmc-result-guide{display:flex;gap:20px;align-items:center;padding:20px 24px;background:#eee7f0;color:#33283e;border-radius:18px;margin:0 0 22px}
.sjmc-result-guide[hidden]{display:none}
.sjmc-result-guide strong{font-size:14px}
.sjmc-result-guide p{font-size:14px;line-height:1.8;margin:7px 0 0;word-break:keep-all}
.sjmc-result-portrait{width:70px;aspect-ratio:1 / 2;overflow:hidden;flex-shrink:0;border-radius:50px}
.sjmc-result-portrait img{transform:translateX(-66.666667%)}
.sjmc-paused *{animation:none!important;transition:none!important}
@keyframes sjmc-orbit{0%,100%{transform:rotate(-8deg) scale(.97);opacity:.35}50%{transform:rotate(8deg) scale(1.02);opacity:.75}}
@keyframes sjmc-enter{from{opacity:.3}to{opacity:1}}
@media(max-width:760px){
 [data-sjm-companion]{border-radius:20px;margin:12px auto 26px}
 .sjmc-layout{grid-template-columns:minmax(0,1fr) 132px;grid-template-rows:auto auto;gap:0 8px;padding:27px 22px 25px}
 .sjmc-intro h1{font-size:28px;line-height:1.28}
 .sjmc-eyebrow{font-size:9px;letter-spacing:.05em;margin-bottom:18px}
 .sjmc-lead{font-size:12px;line-height:1.85;margin-top:16px}
 .sjmc-visual{grid-row:1;grid-column:2;margin:-10px -15px 0 -6px;border-radius:90px 90px 10px 10px;align-self:start}
 .sjmc-portrait{width:100%}
 .sjmc-signature{bottom:14px;font-size:8px;letter-spacing:0}
 .sjmc-orbit{display:none}
 .sjmc-steps{gap:7px;font-size:9px;line-height:1.7;margin:16px 0 22px}
 .sjmc-conversation{grid-column:1 / -1}
 .sjmc-bubble{padding:17px 18px;min-height:94px;font-size:14px}
 .sjmc-choices{gap:7px}
 .sjmc-choices button{font-size:12px;padding:10px 7px;min-height:44px}
 .sjmc-next{font-size:14px}
 .sjmc-ready[data-sjm-page="home"] [data-sjm-companion]{width:calc(100% - 24px)}
 .sjmc-result-guide{padding:16px;gap:13px}
 .sjmc-result-portrait{width:50px}
 .sjmc-result-guide p{font-size:13px}
}
@media(max-width:360px){.sjmc-layout{grid-template-columns:minmax(0,1fr) 104px;padding:25px 17px}.sjmc-intro h1{font-size:25px}.sjmc-steps{font-size:8px}.sjmc-speaker{gap:6px}}
/* 제목 줄바꿈 — 제목 칸의 실제 폭에 맞춰 끊는 자리와 크기를 정한다.
   좁은 칸: "지금 마음에 / 걸리는 이야기가 / 있나요?"  넓은 칸: "지금 마음에 걸리는 / 이야기가 있나요?"
   컨테이너 쿼리를 모르는 브라우저는 이 규칙을 건너뛰고 원래 모양(넓은 칸 줄바꿈)을 그대로 쓴다. */
.sjmc-br-m{display:none}
.sjmc-intro{container-type:inline-size}
@container (min-width:260px){.sjmc-intro h1{font-size:min(clamp(30px,3.5vw,46px),calc(100cqi / 9.4))}}
@media(max-width:760px){@container (min-width:260px){.sjmc-intro h1{font-size:min(28px,calc(100cqi / 9.4))}}}
@container (max-width:259.98px){.sjmc-br-m{display:inline}.sjmc-br-d{display:none}.sjmc-intro h1{font-size:min(26px,calc(100cqi / 8.1))}}
@media(prefers-reduced-motion:reduce){[data-sjm-companion] *,[data-sjm-companion] *:before,[data-sjm-companion] *:after{animation:none!important;transition:none!important}}
