:root{--bg:#090909;--gold:#b08a43;--accent:#d6b36a;--text:#f4f1ea;--muted:#a69c89;--line:rgba(214,179,106,.24);--serif:"Noto Serif KR",serif;--sans:Pretendard,"Noto Sans KR",system-ui,sans-serif;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);word-break:keep-all}button,a{font:inherit}button{color:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-80px;left:16px;z-index:100;padding:12px 18px;background:var(--accent);color:#090909}.skip-link:focus{top:16px}.noise{position:fixed;inset:0;z-index:50;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}.site-header{position:fixed;z-index:40;top:0;left:0;right:0;height:76px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(214,179,106,.12);mix-blend-mode:normal}.brand{font-family:var(--serif);font-weight:700;color:var(--text);text-decoration:none;letter-spacing:-.04em}.brand span{color:var(--accent)}.edition{font-size:10px;letter-spacing:.18em;color:var(--muted)}.scene{position:relative;min-height:100svh;overflow:hidden}.scene[hidden]{display:none}.overline{margin:0;color:var(--accent);font-size:10px;font-weight:600;letter-spacing:.25em}.scene--intro{display:grid;place-items:center;padding:100px 24px 60px;background:radial-gradient(circle at 72% 50%,#241708 0,rgba(36,23,8,.35) 22%,transparent 48%),linear-gradient(120deg,#050505,#0b0a08 58%,#080604)}.scene--intro:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.8%,rgba(214,179,106,.07) 50%,transparent 50.2%);opacity:.45}.intro-copy{position:relative;z-index:2;width:min(760px,100%);text-align:center}.intro-copy h1{margin:24px 0 54px;font:700 clamp(46px,9vw,108px)/1 var(--serif);letter-spacing:-.08em;text-shadow:0 2px 36px rgba(214,179,106,.14)}.intro-copy h1 span{color:var(--accent)}.intro-message{margin:0;font:600 clamp(23px,3.2vw,38px)/1.65 var(--serif)}.intro-message--sub{margin-top:26px;color:#c8c0b1;font-size:clamp(17px,2.1vw,23px)}.button{border:0;cursor:pointer}.button--enter,.button--reveal{margin-top:48px;min-width:190px;padding:17px 22px;background:transparent;border:1px solid var(--gold);display:inline-flex;justify-content:space-between;gap:45px;align-items:center;color:var(--text);transition:.4s ease}.button--enter:hover,.button--enter:focus-visible,.button--reveal:hover:not(:disabled),.button--reveal:focus-visible{background:var(--accent);color:#090909;box-shadow:0 0 32px rgba(214,179,106,.18);outline:0}.button--reveal:disabled{opacity:.28;cursor:not-allowed}.intro-index{position:absolute;left:clamp(20px,5vw,72px);bottom:30px;margin:0;font-size:9px;letter-spacing:.18em;color:#6f6759}.intro-candle{position:absolute;right:12%;bottom:0;width:62px;height:38%;filter:blur(.2px)}.wax{position:absolute;bottom:-30px;left:15px;width:32px;height:75%;background:linear-gradient(90deg,#5d4b2c,#c8ad72 48%,#554324);border-radius:5px 5px 0 0}.wick{position:absolute;z-index:2;bottom:calc(75% - 2px);left:30px;width:2px;height:13px;background:#211509}.flame{position:absolute;z-index:3;bottom:calc(75% + 8px);left:21px;width:20px;height:43px;background:radial-gradient(ellipse at 50% 72%,#fff5bf 0 14%,#e8a52d 38%,#7e3106 68%,transparent 70%);border-radius:50% 50% 48% 48%;transform-origin:50% 100%;filter:drop-shadow(0 0 18px #c77a1d)}
.scene--reading{background:#080706;isolation:isolate}.master{position:fixed;inset:0 50% 0 0;z-index:-1}.master-image{position:absolute;inset:0;background:url("../assets/master/tarot-master.png") center 32%/cover no-repeat;filter:saturate(.78) contrast(1.05)}.master-vignette{position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,9,9,.08),rgba(9,9,9,.22) 62%,#090909 100%),linear-gradient(0deg,#090909 0,transparent 30%,rgba(0,0,0,.4) 100%)}.reading-content{width:50%;min-height:100svh;margin-left:50%;padding:120px clamp(28px,5vw,86px) 70px;background:linear-gradient(90deg,#090909,rgba(9,9,9,.96))}.dialog{min-height:128px;margin:27px 0 16px;font:600 clamp(19px,2vw,29px)/1.7 var(--serif);white-space:pre-line}.dialog .dots,.closing-dialog .dots{color:var(--accent);letter-spacing:.32em}.selection-status{display:flex;justify-content:space-between;align-items:end;padding:16px 0 12px;border-bottom:1px solid var(--line);font-size:11px;letter-spacing:.13em;color:var(--muted)}.selection-status strong{font:500 17px var(--serif);color:var(--text)}.selection-status b{color:var(--accent)}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px}.tarot-card{position:relative;aspect-ratio:2/3;padding:0;border:1px solid rgba(214,179,106,.32);background:#100e0a;cursor:pointer;perspective:900px;transition:transform .35s ease,filter .35s ease}.tarot-card:hover,.tarot-card:focus-visible{transform:translateY(-7px);filter:drop-shadow(0 10px 12px rgba(176,138,67,.18));outline:1px solid var(--accent);outline-offset:3px}.tarot-card[aria-pressed=true]{transform:translateY(-9px);border-color:var(--accent)}.tarot-card[aria-pressed=true]:after{content:"✓";position:absolute;z-index:4;right:6px;top:6px;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#090909;font-size:11px}.tarot-card:disabled:not([aria-pressed=true]){opacity:.35;cursor:not-allowed}.card-back{position:absolute;inset:6px;display:grid;place-items:center;border:1px solid var(--line);background:radial-gradient(circle,transparent 0 18%,rgba(176,138,67,.12) 19% 20%,transparent 21%),repeating-conic-gradient(from 45deg,rgba(176,138,67,.06) 0 8deg,transparent 8deg 18deg)}.card-back:before{content:"✦";display:grid;place-items:center;width:54%;aspect-ratio:1;border:1px solid var(--gold);transform:rotate(45deg);color:var(--accent);font-size:20px}.button--reveal{width:100%;margin-top:22px}
.scene--result{padding:110px clamp(22px,6vw,110px) 70px;background:radial-gradient(circle at 14% 22%,rgba(176,138,67,.09),transparent 34%),#090909}.result-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid var(--line)}.result-header>span{color:var(--muted);font:11px var(--serif);letter-spacing:.1em}.chosen-cards{width:min(720px,100%);margin:56px auto 42px;display:flex;justify-content:center;align-items:center;gap:clamp(26px,7vw,110px)}.chosen-card{width:clamp(120px,18vw,210px);text-align:center}.chosen-card__art{position:relative;aspect-ratio:2/3;border:1px solid var(--gold);padding:9px;background:linear-gradient(145deg,#17130d,#0a0907);box-shadow:0 18px 50px rgba(0,0,0,.55)}.chosen-card__art:before{content:"";position:absolute;inset:8px;border:1px solid rgba(214,179,106,.25)}.arcana{position:absolute;inset:15% 12%;display:grid;place-items:center;color:var(--accent);font:clamp(34px,6vw,72px) var(--serif);text-shadow:0 0 24px rgba(214,179,106,.3)}.roman{position:absolute;top:18px;left:0;right:0;color:var(--muted);font:10px var(--serif);letter-spacing:.2em}.chosen-card h3{margin:17px 0 4px;font:600 clamp(15px,2vw,20px) var(--serif);letter-spacing:.07em}.chosen-card p{margin:0;color:var(--accent);font-size:12px}.chosen-cards:after{content:"×";position:absolute;color:var(--gold);font:300 30px var(--serif)}.interpretation{max-width:860px;margin:0 auto;text-align:center}.result-label{margin:0 0 22px;color:var(--accent);font-size:10px;letter-spacing:.22em}.interpretation h2{margin:0;font:600 clamp(30px,5vw,58px)/1.4 var(--serif);letter-spacing:-.04em}.interpretation>p:last-child{max-width:620px;margin:28px auto 0;color:#c7c0b4;font:500 clamp(17px,2vw,22px)/1.9 var(--serif);white-space:pre-line}.closing-dialog{max-width:420px;min-height:130px;margin:90px auto 70px;text-align:center;color:var(--muted);font:500 16px/2 var(--serif);white-space:pre-line}.daily-story{max-width:1080px;margin:auto;padding-top:70px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr minmax(270px,430px);align-items:center;gap:8vw}.story-heading h3{margin:14px 0 18px;font:600 clamp(40px,6vw,72px) var(--serif);letter-spacing:-.06em}.story-heading>p:last-child{max-width:360px;margin:0;color:var(--muted);line-height:1.8}.article-card{width:100%;aspect-ratio:4/5;border:0;background:none;padding:0;perspective:1400px;cursor:pointer}.article-card__inner{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.2,.7,.15,1)}.article-card.is-flipped .article-card__inner{transform:rotateY(180deg)}.article-card__face{position:absolute;inset:0;display:flex;flex-direction:column;backface-visibility:hidden;border:1px solid var(--gold);overflow:hidden}.article-card__back{align-items:center;justify-content:center;background:repeating-conic-gradient(from 45deg,#15110b 0 7deg,#0c0a07 7deg 15deg);box-shadow:inset 0 0 0 10px #0c0b08,inset 0 0 0 11px var(--line)}.article-card__back b{font:600 23px var(--serif)}.article-card__back small{margin-top:12px;color:var(--muted);letter-spacing:.14em}.card-sigil{margin-bottom:35px;color:var(--accent);font-size:54px}.article-card__front{transform:rotateY(180deg);text-align:left;background:#111;color:var(--text)}.article-image{height:47%;background-position:center;background-size:cover;filter:saturate(.75)}.article-copy{flex:1;padding:24px;display:flex;flex-direction:column}.article-category{color:var(--accent);font-size:9px;letter-spacing:.2em}.article-copy strong{margin:12px 0;font:600 clamp(19px,2.2vw,27px)/1.45 var(--serif)}.article-copy p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}.article-link{margin-top:auto;color:var(--text);font-size:13px;font-weight:700}.result-actions{max-width:1080px;margin:70px auto 0;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between}.text-button{border:0;background:none;padding:8px 0;color:var(--muted);cursor:pointer}.text-button:hover,.text-button:focus-visible{color:var(--accent);outline:0}.toast{height:24px;margin:20px 0 0;text-align:center;color:var(--accent);font-size:12px}footer{min-height:120px;padding:35px clamp(22px,6vw,110px);display:flex;align-items:center;gap:28px;border-top:1px solid var(--line);font-family:var(--serif)}footer span{font-weight:700}footer small{color:var(--muted)}footer a{margin-left:auto;color:var(--accent);font:10px var(--sans);letter-spacing:.14em;text-decoration:none}
