/* 연애 사주 입력 시트·무료 결과 (2026-11-09). 입력 시트 규칙은 css/newyear-saju.css의 신년 입력 시트에서 그대로 옮겼다(.ny-page → .ls-real). */
.ls-real{--ny-navy:#172b46;--ny-gold:#c7a072;--ny-rose:#bc6d7b;--ny-border:#e0c7a9;--ny-serif:"Noto Serif KR","Batang",serif}
.ny-primary{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;border:1px solid var(--ny-gold);outline:1px solid #c7a072;outline-offset:3px;border-radius:32px;padding:13px 20px;background:#192b42;color:#fff8ef;text-decoration:none;font:600 1.125rem/1.5 var(--ny-serif);cursor:pointer}
.ny-primary .icon{width:21px;height:21px}
.ny-primary:disabled{cursor:default;opacity:.55}
.ny-caption{text-align:center;color:#818591;font-size:.75rem;line-height:1.75;margin:18px 0 0;word-break:keep-all}
.ny-date{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:8px}
.ny-date label{min-width:0}
.ny-calendar{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:16px 0 12px;border:1px solid #dfcbb4;border-radius:28px;overflow:hidden}
.ny-calendar label{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:7px;cursor:pointer;font-size:.875rem}
.ny-calendar label:has(input:checked){color:#a04f5b;background:#fae9e8;font-weight:700;box-shadow:inset 0 0 0 1px #bc6d7b;border-radius:28px}
.ny-calendar input{accent-color:var(--ny-rose);margin:0}
.ny-check{display:flex;align-items:center;gap:9px;min-height:44px;cursor:pointer;font-size:.8125rem;line-height:1.6}
.ny-check input{flex:0 0 20px;width:20px;height:20px;margin:0;accent-color:var(--ny-navy)}
.ny-field-error{color:#ad3446!important;margin:8px 0;font-size:.75rem!important}
.ny-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.ny-gender{grid-template-columns:repeat(3,minmax(0,1fr));margin:5px 0}
.ny-gender label{font-size:.8125rem;gap:5px;white-space:nowrap}
html.ny-input-open,body.ny-input-open{overflow:hidden;overscroll-behavior:none}
.ny-input-sheet{position:fixed;inset:auto 0 var(--ny-sheet-bottom,0px);width:100%;max-width:450px;height:min(68svh,780px);max-height:calc(var(--ny-sheet-vh,100dvh) - max(12px,env(safe-area-inset-top)));margin:0 auto;padding:0;border:0;border-radius:22px 22px 0 0;background:#fff;color:#142745;box-shadow:0 -8px 40px #101c2a22;overflow:hidden;container-type:inline-size;font-family:var(--app-font);line-height:1.6}
.ls-real .ny-input-sheet[open]{display:flex;flex-direction:column;animation:ny-input-rise .4s cubic-bezier(.2,.8,.2,1) both!important}
.ny-input-sheet::backdrop{background:#0b12224d;backdrop-filter:none;-webkit-backdrop-filter:none;animation:ny-input-dim .24s ease both}
.ls-real .ny-input-sheet.is-closing[open]{animation:ny-input-leave .2s ease both!important;pointer-events:none}
.ny-input-sheet.is-closing::backdrop{animation:ny-input-dim-out .2s ease both}
.ny-input-sheet.is-compact{height:calc(var(--ny-sheet-vh,100dvh) - 12px)}
.ny-sheet-handle{flex:none;display:block;width:44px;height:4px;border-radius:10px;background:#c7cbd2;margin:12px auto 3px}
.ny-sheet-close{position:absolute;right:9px;top:8px;z-index:2;display:grid;place-items:center;width:44px;height:44px;padding:10px;border:0;border-radius:50%;background:transparent;color:#1b2a45;cursor:pointer}
.ny-sheet-close .icon{width:24px;height:24px}
.ny-sheet-header{flex:none;padding:0 20px 14px;text-align:center}
.ny-sheet-steps{position:relative;display:flex;justify-content:space-between;list-style:none;gap:0;padding:0;margin:10px 40px 18px;color:#9196a2;font-size:.6875rem;line-height:1.5}
.ny-sheet-steps:before{content:"";position:absolute;left:16.66%;right:16.66%;top:5px;height:1px;background:#c6c9d0}
.ny-sheet-steps li{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;white-space:nowrap}
.ny-sheet-steps li:before{content:"";display:block;width:10px;height:10px;border:1px solid #c0c4cd;border-radius:50%;background:#fff;box-sizing:border-box}
.ny-sheet-steps li[aria-current]{color:#c46c7f;font-weight:700}
.ny-sheet-steps li[aria-current]:before{border-color:#d78292;background:#d78292}
.ny-sheet-header h2{margin:0;font:700 clamp(1.4rem,6.4cqw,2.1rem)/1.45 var(--ny-serif);letter-spacing:-.055em;color:#132542;word-break:keep-all}
.ny-sheet-header>p{margin:7px 0 0;font-size:.8125rem;line-height:1.6;color:#7d8492}
.ny-input-sheet [data-ny-form]{display:flex;flex-direction:column;flex:1;min-height:0;margin:0;overflow:hidden}
.ny-sheet-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scroll-padding:14px;padding:8px 20px 10px;-webkit-overflow-scrolling:touch}
.ny-sheet-fields{display:grid;gap:20px}
.ny-sheet-field{min-width:0;margin:0;padding:0;border:0}
.ny-sheet-field legend,.ny-sheet-label{display:block;width:100%;padding:0;margin:0 0 8px;font:700 .9375rem/1.6 var(--ny-serif);color:#132542}
.ny-sheet-field legend>span,.ny-sheet-label>span{margin-left:6px;color:#9199a7;font:400 .6875rem/1.5 var(--app-font)}
.ny-input-sheet input[type=text],.ny-input-sheet input[type=time],.ny-input-sheet select{display:block;width:100%;min-height:44px;margin:0;border:1px solid #d3d7df;border-radius:6px;padding:9px 11px;background:#fff;color:#172b46;font:400 16px/1.5 var(--app-font);box-sizing:border-box}
.ny-input-sheet input::placeholder{color:#9ca3ae;font-size:.8125rem}
.ny-input-sheet .ny-date{grid-template-columns:1.12fr 1fr 1fr;gap:7px}
.ny-input-sheet .ny-calendar{margin:10px 0 0;border-color:#d6dae2;border-radius:999px}
.ny-input-sheet .ny-calendar label{min-height:42px;padding:7px 5px;font-size:.8125rem;gap:6px;color:#455268}
.ny-input-sheet .ny-calendar label:has(input:checked){background:#fbebed;color:#b84864;box-shadow:inset 0 0 0 1px #db8798;border-radius:999px}
.ny-input-sheet .ny-calendar input{accent-color:#ca6a80}
.ny-input-sheet .ny-gender{margin:0;gap:4px;border:0;overflow:visible}
.ny-input-sheet .ny-gender label{border:1px solid #d6dae2;border-radius:999px;background:#fcfcfd;font-size:.75rem;gap:5px}
.ny-input-sheet .ny-gender label:has(input:checked){border-color:#db8798;box-shadow:none}
.ny-input-sheet .ny-check{min-height:36px;font-size:.8125rem;margin-top:6px;color:#5c6779}
.ny-input-sheet .ny-check input{flex-basis:18px;width:18px;height:18px}
.ny-sheet-actions{flex:none;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid #f0f0f3;background:#fff}
.ny-input-sheet .ny-primary{min-height:50px;padding:11px 16px;border:0;border-radius:999px;outline:0;background:linear-gradient(100deg,#20384e,#192d43);color:#fff;font:600 1.0625rem/1.5 var(--ny-serif)}
.ny-sheet-actions .ny-caption{margin:8px 0 0;font-size:.625rem;line-height:1.5;color:#9298a3}
.ny-sheet-confirm{padding:4px 0 0;margin:0;border:0;background:#fff;text-align:left}
.ny-sheet-confirm h3{margin:0;padding:8px 12px;border-radius:8px;background:#fae9ed;color:#162c48;font:700 clamp(1rem,4.4cqw,1.4rem)/1.6 var(--ny-serif);overflow-wrap:anywhere}
.ny-confirm-list{margin:2px 0 0;padding:0}
.ny-confirm-list>div{display:grid;grid-template-columns:34% minmax(0,1fr);align-items:center;gap:8px;min-height:36px;border-bottom:1px solid #d9dde4;padding:7px 10px}
.ny-confirm-list dt{margin:0;color:#7a8393;font:400 .875rem/1.5 var(--app-font)}
.ny-confirm-list dd{margin:0;color:#132947;font:700 .9375rem/1.5 var(--app-font);overflow-wrap:anywhere}
.ny-sheet-confirm .ny-confirm-note{margin:12px 0 6px;color:#858b97;text-align:center;font:400 .75rem/1.7 var(--app-font);word-break:keep-all}
.ny-sheet-header h2{white-space:pre-line}
.ny-sheet-steps li.is-complete:before{content:"✓";display:grid;place-items:center;background:#d78292;border-color:#d78292;color:#fff;font:700 9px/1 var(--app-font)}
.ny-sheet-button-row{display:flex;align-items:stretch;gap:7px}
.ny-sheet-button-row .ny-primary{flex:1;min-width:0;width:auto}
.ny-sheet-edit{flex:0 0 34%;min-height:50px;padding:10px 6px;border:1px solid #8d96a5;border-radius:999px;background:#fff;color:#17304f;font:600 1rem/1.5 var(--ny-serif);cursor:pointer}
.ny-sheet-edit:disabled{opacity:.55;cursor:default}
.ny-input-sheet:is([data-step="confirm"],[data-step="reading"]) .ny-sheet-actions{border-top:0;padding-top:14px;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
.ny-input-sheet:is([data-step="confirm"],[data-step="reading"]) .ny-sheet-actions .ny-caption{display:none}
.ny-input-sheet[data-step="confirm"] .ny-sheet-header{padding-bottom:16px}
.ny-input-sheet[data-step="confirm"] .ny-sheet-scroll{padding-top:8px}
.ny-input-sheet :is(button,input,select):focus-visible{outline:2px solid #426d9b;outline-offset:2px}
.ny-input-sheet [data-ny-sheet-title]:focus{outline:none}
@media(min-width:768px){.ny-input-sheet{height:min(82svh,820px)}.ny-sheet-header{padding-bottom:20px}.ny-sheet-scroll{padding-left:28px;padding-right:28px}.ny-sheet-header>p{font-size:.9375rem}}
@media(max-height:560px){.ny-sheet-steps{margin-bottom:10px}.ny-sheet-header{padding-bottom:10px}.ny-sheet-header h2{font-size:1.25rem}.ny-sheet-header>p{margin-top:3px;font-size:.75rem}.ny-sheet-actions{padding-top:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}.ny-sheet-actions .ny-caption{margin-top:5px}}
@keyframes ny-input-rise{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes ny-input-leave{to{transform:translateY(100%)}}
@keyframes ny-input-dim{from{opacity:0}to{opacity:1}}
@keyframes ny-input-dim-out{to{opacity:0}}
.ls-input-sheet .ls-sheet-hint{margin:6px 0 0;font-size:.75rem;line-height:1.6;color:#8a909c;word-break:keep-all}
.ls-input-sheet [hidden]{display:none!important}
.ls-input-sheet .ny-message{padding:12px 14px;border-radius:9px;color:#5c6577;background:#f2f3f8;font-size:.8125rem;line-height:1.7}.ls-input-sheet .ny-message.is-error{background:#fbecee;color:#9e3146}
.ls-input-sheet .ny-message{margin:14px 0 4px}
@media(prefers-reduced-motion:reduce){.ls-real .ny-input-sheet[open],.ls-real .ny-input-sheet.is-closing[open],.ny-input-sheet::backdrop{animation:none!important}}
/* 무료 결과: 신년 무료 결과(.ny-free-result)와 같은 화면. 기본 사이트 머리글·분류 메뉴·앱 설치 띠는 숨기고 그림 위 머리글을 쓴다. */
body[data-love-saju-view=result]:has(.ls-free-result) .app-shell>.site-header,body[data-love-saju-view=result]:has(.ls-free-result) .category-nav,body[data-love-saju-view=result]:has(.ls-free-result) [data-pwa-banner]{display:none!important}
.ls-free-result .ls-hero{height:196px;overflow:hidden}
.ls-free-result .ls-hero-art{object-position:50% 11%}
.ls-free-result .ls-hero:after{z-index:1;background:linear-gradient(180deg,#1a0d1866,transparent 42%),linear-gradient(90deg,#33170c15,transparent 50%)}
.ls-free-result .ls-hero-blossoms{top:92px;opacity:.9}
.ls-free-result .ls-result-header{z-index:5}
.ls-free-result .nyr-title>p{color:#b0566f}
.ls-free-result .ls-avatar{background:#f3e6ea}
.ls-free-result .ls-avatar img{width:300%;height:auto;left:-116%;top:-72%;object-fit:fill}
.ls-elements{margin:6px 0 4px;padding:14px 12px 12px;border:1px solid #f0e4e7;border-radius:10px;background:#fffafb}
.ls-free-result .ls-mini-title{font:700 16px/1.5 var(--nyr-serif);color:var(--nyr-navy);letter-spacing:-.3px;margin:0 0 10px}
.ls-elements ul{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;list-style:none;margin:0;padding:0}
.ls-elements li{display:grid;justify-items:center;gap:1px;padding:8px 2px 7px;border-radius:8px;background:var(--s);color:var(--d)}
.ls-elements li>span{font:700 20px/1.25 var(--nyr-serif)}
.ls-elements b{font-size:11px;line-height:1.4;font-weight:500;color:#6b7387}
.ls-elements strong{font:700 17px/1.3 system-ui,sans-serif;color:var(--nyr-navy)}
.ls-elements strong small{margin-left:1px;font-size:11px;font-weight:500}
.ls-elements li.is-zero{opacity:.5}
.ls-free-result .ls-elements>p{margin:9px 0 0;font-size:12px;line-height:1.65;color:#747e91;word-break:keep-all}
.ls-el-wood{--s:#edf5ef;--d:#4f7a62}.ls-el-fire{--s:#fcefed;--d:#a65b55}.ls-el-earth{--s:#f8f1e3;--d:#93713a}.ls-el-metal{--s:#f1eff6;--d:#6c6585}.ls-el-water{--s:#ebf2f9;--d:#456c8f}
.ls-free-result .ls-limit-note{margin:-6px 0 0}
.ls-free-result .ls-save-actions{grid-template-columns:1fr;max-width:280px;margin:0 auto}
.ls-free-result .ls-save-status{margin:10px 0 0;font-size:12px;line-height:1.6;color:#8a4a62}
.ls-free-result .nyr-library-link{display:inline-flex;align-items:center;gap:2px;min-height:36px;margin:8px 0 0;color:#4c5a70;font-size:13px;text-decoration:none}
.ls-free-result .nyr-library-link .icon{width:14px;height:14px}
.ls-free-result .nyr-payment-note a{color:#8a3a5a}
@media(max-width:370px){.ls-free-result .ls-hero{height:180px}.ls-elements{padding-inline:8px}.ls-elements ul{gap:4px}.ls-elements li>span{font-size:18px}}
