:root{font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;color:#f1e9e4;background:#171322;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 55% 0%,#332344 0%,#171322 52%);min-height:100vh}button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #e3c68f;outline-offset:2px}.top{max-width:1000px;margin:auto;padding:22px 22px 8px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:10px;color:#e7cf9d;font-weight:700;font-size:19px}.brand small{display:block;letter-spacing:2px;font-size:8px;font-weight:400;color:#af9cbe}.sigil{font-size:31px}.topright{font-size:12px;color:#e0c38c;border:1px solid #584563;border-radius:20px;padding:9px 13px}.wrap{max-width:1000px;padding:15px 22px 115px;margin:auto;min-height:80vh}.view{display:none}.view.active{display:block}.hero{min-height:380px;border:1px solid #594771;border-radius:22px;padding:50px 24px;background:radial-gradient(circle at 50% 5%,#624c78 0,#322643 38%,#231b32 88%);text-align:center;position:relative;overflow:hidden}.hero:before,.hero:after{content:'✧';position:absolute;font-size:80px;color:#ae8cbd22;top:30px;left:8%}.hero:after{top:auto;bottom:0;left:auto;right:9%}.halo{font-size:45px;color:#d9bf8d;letter-spacing:17px;margin:4px 0 25px}.eyebrow{letter-spacing:3px;font-size:10px;color:#d3b580;text-transform:uppercase}.hero h1{font-size:clamp(26px,4.5vw,43px);line-height:1.55;margin:12px auto;color:#f5e8d5}.hero p:not(.eyebrow){color:#c7bbce}.primary{border:0;background:linear-gradient(120deg,#d9bc83,#ae8f5c);color:#251b2a;padding:14px 25px;border-radius:28px;font-weight:700;margin-top:14px}.secondary{border:1px solid #8d789b;background:transparent;color:#efe4dd;padding:13px 19px;border-radius:26px}.full{width:100%;margin-top:26px}.wrap h2{font-size:20px;margin:30px 0 18px;color:#ead8b5}.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}.tiles button{border:1px solid #4e405a;color:#f1e8e3;border-radius:14px;background:#2b2239;padding:20px;text-align:left;display:flex;flex-direction:column;gap:9px}.tiles b{color:#d8bc83;font-size:28px}.tiles small{color:#b9aabe}.note,.hint{color:#a99bb3;font-size:12px;line-height:1.8;margin-top:24px}.view>h1{font-size:27px;color:#f0dfc1;margin:10px 0 23px}.view label{display:block;margin:22px 0 10px;font-weight:600}.chips{display:flex;flex-wrap:wrap;gap:9px}.chip{border:1px solid #6d5d79;background:#2b2239;color:#d9ceda;border-radius:23px;padding:9px 15px}.chip.selected,.options button.selected{border-color:#e0c38b;background:#59456b;color:#fff}.view textarea,.view input:not([type=file]){width:100%;background:#241d31;color:#fff;border:1px solid #554664;border-radius:12px;padding:14px;resize:vertical}.options{display:flex;gap:12px}.options button{flex:1;min-height:85px;background:#2b2239;border:1px solid #594a66;color:#f2e5dd;border-radius:14px;font-weight:700}.options small{display:block;margin-top:6px;font-weight:400;color:#c3b7cb}.cards{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.tarotcard{width:min(29vw,160px);min-width:94px;aspect-ratio:2/3;background:linear-gradient(135deg,#443353,#21192f);border:3px double #d7bc85;border-radius:12px;box-shadow:0 9px 25px #0004;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:8px}.tarotcard .star{font-size:40px;color:#cbb281}.tarotcard b{font-size:15px;color:#efdbad;margin:10px 0}.tarotcard em{font-size:11px;color:#c6b8ce;font-style:normal}.tarotcard.reversed{border-color:#9c8bb0}.report{margin-top:25px}.panel{background:#291f37;border:1px solid #50405f;border-radius:15px;padding:20px;margin:13px 0;line-height:1.9}.panel h3{color:#e8cf9d;margin:0 0 10px;font-size:18px}.panel p{color:#d4c7d6;line-height:1.9;margin:0 0 12px}.panel p:last-child{margin:0}.sub{color:#b9aabd;line-height:1.8}.actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.actions .primary{margin-top:0}.library{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:20px}.library details{background:#292036;border:1px solid #4e405a;border-radius:12px;padding:15px}.library summary{color:#e9d5af;cursor:pointer}.library p{color:#c9bdcf;line-height:1.7;font-size:13px}.entry{background:#281f35;border:1px solid #554263;border-radius:14px;padding:16px;margin:13px 0}.entry small{color:#a998b7}.entry h3{margin:8px 0;color:#e5ce9e}.tabbar{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:min(5vw,55px);background:#21192df2;border-top:1px solid #4b3a5b;padding:12px 4px max(12px,env(safe-area-inset-bottom));z-index:5;backdrop-filter:blur(10px)}.tabbar button{background:none;border:0;color:#d1b783;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:21px;width:62px}.tabbar span{font-size:11px;color:#c7b9ce}.tabbar button.active span{color:#e8ca8e}@media(min-width:800px){.tiles{grid-template-columns:repeat(4,1fr)}.library{grid-template-columns:repeat(3,1fr)}.hero{min-height:430px}.wrap{padding-top:30px}}@media(max-width:400px){.wrap{padding-left:14px;padding-right:14px}.top{padding-left:15px;padding-right:15px}.library{grid-template-columns:1fr}}

/* V2: layered atmosphere and tactile reading ritual */
body{isolation:isolate;overflow-x:hidden}
.ambient{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 60% 12%,#39244a 0%,transparent 60%)}
.aurora{position:absolute;width:70vw;height:65vw;min-width:350px;min-height:350px;left:15%;top:-35%;border-radius:50%;background:radial-gradient(circle,#9270b02e,transparent 63%);filter:blur(18px);animation:auroraBreath 14s ease-in-out infinite alternate}
.orb{position:absolute;border-radius:50%;filter:blur(2px);box-shadow:0 0 100px 20px #9c78a32a}.orb-a{width:200px;height:200px;left:-150px;top:38%;background:#a487b01c;animation:orbDrift 18s ease-in-out infinite alternate}.orb-b{width:160px;height:160px;right:-100px;bottom:12%;background:#dbc48615;animation:orbDrift 21s ease-in-out infinite alternate-reverse}
.stars{position:absolute;inset:0;background-image:radial-gradient(#ffe4ba9c .8px,transparent 1.2px),radial-gradient(#f7d3ff70 .9px,transparent 1.3px),radial-gradient(#ffedc980 1px,transparent 1.6px);background-size:109px 112px,163px 146px,211px 204px;background-position:9px 15px,61px 45px,16px 113px;opacity:.42;animation:starFloat 30s linear infinite}
.top{position:relative;z-index:3;animation:floatIn .7s both}.sigil{display:inline-block;filter:drop-shadow(0 0 12px #e2b47999);animation:sigilGlow 5s ease-in-out infinite}
.hero{background:radial-gradient(circle at 50% 10%,#6f507c 0%,#3c2a4e 35%,#221a30 88%);box-shadow:inset 0 0 65px #10101c75,0 20px 85px #0005;animation:floatIn .8s both}
.halo{position:relative;width:180px;height:155px;margin:0 auto 8px;display:grid;place-items:center;border:1px solid #d9bc8350;border-radius:50%;box-shadow:inset 0 0 30px #e5c89318,0 0 38px #d7a77820;letter-spacing:0;animation:haloPulse 6s ease-in-out infinite}
.halo:before,.halo:after{content:'';position:absolute;inset:15px;border:1px dashed #e4c58e57;border-radius:50%;animation:haloRotate 50s linear infinite}.halo:after{inset:32px;border-style:solid;animation-direction:reverse;opacity:.5}
.moon-ring{font-size:90px;line-height:1;color:#f1d7a7;text-shadow:0 0 18px #d9b8799a;animation:moonHover 6s ease-in-out infinite}.orbit-dot{position:absolute;color:#fbeac1;font-size:19px;text-shadow:0 0 16px #fff}.dot-one{top:14px;left:10px;animation:twinkle 4s infinite}.dot-two{bottom:18px;right:8px;animation:twinkle 5s 1s infinite}
.primary,.tiles button,.chip,.options button,.secondary{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease}.primary:hover,.tiles button:hover,.options button:hover,.secondary:hover{transform:translateY(-3px)}.primary:active,.tiles button:active,.fan-card:active{transform:scale(.97)}.glow-button{position:relative;box-shadow:0 4px 25px #dfb66c55;overflow:hidden}.glow-button:after{content:'';position:absolute;top:-50%;left:-50%;height:200%;width:35%;background:linear-gradient(90deg,transparent,#fff7,transparent);transform:rotate(20deg) translateX(-200%);animation:buttonShimmer 5s ease-in-out infinite}
.tiles button{animation:floatIn .65s both}.tiles button:nth-child(2){animation-delay:.09s}.tiles button:nth-child(3){animation-delay:.17s}.tiles button:nth-child(4){animation-delay:.25s}.tiles button:hover{box-shadow:0 14px 35px #0005;border-color:#b498bd}
.view.active>h1,.view.active>.eyebrow{animation:floatIn .55s both}
.ritual-sub{text-align:center}.ritual-stage{position:relative;height:410px;max-width:750px;margin:10px auto;display:flex;align-items:center;justify-content:center;perspective:1100px;overflow:hidden;border:1px solid #6f54744a;border-radius:24px;background:radial-gradient(circle at center,#57385a55,transparent 70%)}
.ritual-stage:before{content:'';position:absolute;width:270px;height:270px;border:1px solid #dabb8155;border-radius:50%;box-shadow:0 0 0 28px #dabb8108,0 0 0 59px #dabb8106,inset 0 0 65px #dabb810c;animation:haloRotate 42s linear infinite}
.ritual-cosmos{position:absolute;inset:0;pointer-events:none}.ritual-cosmos span{position:absolute;color:#ecd6a6aa;font-size:23px;animation:twinkle 3.5s infinite}.ritual-cosmos span:nth-child(1){top:12%;left:12%}.ritual-cosmos span:nth-child(2){right:13%;top:19%;animation-delay:1s}.ritual-cosmos span:nth-child(3){bottom:15%;left:20%;animation-delay:2s}
.ritual-deck{position:absolute;width:116px;height:177px;transition:opacity .6s ease,transform .8s ease;z-index:3;filter:drop-shadow(0 18px 25px #0008)}.deck-layer{position:absolute;inset:0;border:2px solid #cfac74;border-radius:11px;background:linear-gradient(140deg,#362444,#1a1429);box-shadow:inset 0 0 0 5px #4e365a,inset 0 0 0 7px #b69b65,inset 0 0 24px #000a}.deck-layer:after{content:'☾';position:absolute;color:#dfc995;font-size:65px;inset:0;display:grid;place-items:center}.deck-layer:nth-child(1){transform:translate(5px,-5px) rotate(2deg)}.deck-layer:nth-child(2){transform:translate(-5px,4px) rotate(-3deg)}
.shuffling .deck-layer:nth-child(1){animation:shuffleLeft .67s ease-in-out 3}.shuffling .deck-layer:nth-child(2){animation:shuffleRight .67s ease-in-out 3}.shuffling .deck-layer:nth-child(3){animation:deckPulse 1s ease-in-out infinite}
.spread .ritual-deck{opacity:0;transform:translateY(-45px) scale(.55);pointer-events:none}
.fan{position:absolute;inset:0;pointer-events:none}.fan-card{position:absolute;left:50%;top:43%;width:85px;height:134px;border:0;padding:0;background:none;opacity:0;transform:translate(-50%,-50%) rotate(0) scale(.6);pointer-events:none;transform-origin:50% 135%;transition:transform .75s cubic-bezier(.2,.7,.25,1),opacity .5s ease,filter .25s ease;transition-delay:calc(var(--i) * 55ms)}
.spread .fan-card{opacity:1;transform:translate(calc(-50% + (var(--i) - 5) * 33px),calc(-42% + var(--offset))) rotate(var(--rotation));pointer-events:auto}
.fan-card:hover,.fan-card:focus-visible{filter:brightness(1.3) drop-shadow(0 0 12px #e8c77d88);z-index:20!important}.spread .fan-card:hover{transform:translate(calc(-50% + (var(--i) - 5) * 33px),calc(-42% + var(--offset) - 23px)) rotate(var(--rotation)) scale(1.08)}.fan-card.picked{opacity:0!important;pointer-events:none}
.mystic-back{position:absolute;inset:0;border:2px solid #d0b17c;border-radius:9px;background:linear-gradient(145deg,#452d57,#22162f 60%,#362343);box-shadow:inset 0 0 0 4px #27182f,inset 0 0 0 5px #ab8a65,inset 0 0 25px #0f0b1d,0 7px 25px #0008;color:#ddbe84}.mystic-back:before{content:'';position:absolute;inset:13px;border:1px solid #cbaa75a8;border-radius:45%;transform:rotate(30deg)}.back-sigil{position:absolute;inset:0;display:grid;place-items:center;font-size:49px;text-shadow:0 0 18px #d8bb88}.back-corner{position:absolute;top:8px;left:10px;font-size:12px}.back-lower{position:absolute;bottom:8px;right:10px;font-size:12px}
.chosen{position:absolute;left:0;right:0;bottom:11px;display:flex;gap:9px;justify-content:center;z-index:50}.chosen-card{width:95px;height:148px;perspective:800px;animation:chooseRise .6s both}.flip-inner{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform 1.05s cubic-bezier(.2,.65,.2,1)}.chosen-card.flipped .flip-inner{transform:rotateY(180deg)}.flip-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:10px}.flip-front{transform:rotateY(180deg);border:2px double #edce90;background:radial-gradient(circle at 50% 20%,#735783,#322340 65%,#1b142a);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:8px;gap:9px;box-shadow:0 0 20px #c5a16f36}.flip-front strong{font-size:14px;color:#ffe7b7}.flip-front small{color:#d3bcd9}.flip-glyph{font-size:32px;color:#e4c784}
.ritual-progress{text-align:center;letter-spacing:2px;color:#ddc494}.ritual-actions{justify-content:center}.result-sub{text-align:center;color:#b7a6c3;margin:19px auto}.tarotcard{position:relative;overflow:hidden;animation:cardReveal .9s cubic-bezier(.2,.7,.3,1) both;animation-delay:calc(var(--card-index) * .2s);box-shadow:0 14px 40px #0008,0 0 22px #a87a8b2a}.card-shine{position:absolute;right:12px;top:12px;color:#f4dea3;animation:twinkle 4s infinite}.reveal-panel{animation:floatIn .68s both;animation-delay:calc(.35s + var(--panel-index) * .12s)}.panel{backdrop-filter:blur(8px);background:linear-gradient(135deg,#312440f0,#231b32f0)}
.toggle-label{display:flex!important;align-items:center;gap:12px}.toggle-label input{accent-color:#d0b57c;width:20px;height:20px}
@keyframes floatIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes auroraBreath{to{transform:scale(1.3) translate(40px,60px)}}@keyframes orbDrift{to{transform:translate(90px,-100px)}}@keyframes starFloat{to{background-position:109px 127px,224px 191px,227px 317px}}@keyframes sigilGlow{50%{filter:drop-shadow(0 0 22px #f0c887)}}@keyframes haloPulse{50%{box-shadow:inset 0 0 40px #e8c89d30,0 0 45px #e2af7845}}@keyframes haloRotate{to{transform:rotate(360deg)}}@keyframes moonHover{50%{transform:translateY(-7px)}}@keyframes twinkle{0%,100%{opacity:.35;transform:scale(.75)}50%{opacity:1;transform:scale(1.15)}}@keyframes buttonShimmer{0%,60%{transform:rotate(20deg) translateX(-350%)}100%{transform:rotate(20deg) translateX(800%)}}@keyframes shuffleLeft{50%{transform:translate(-65px,-18px) rotate(-19deg)}}@keyframes shuffleRight{50%{transform:translate(65px,-18px) rotate(19deg)}}@keyframes deckPulse{50%{transform:translateY(-8px)}}@keyframes chooseRise{from{opacity:0;transform:translateY(70px) scale(.75)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes cardReveal{from{opacity:0;transform:rotateY(80deg) translateY(18px) scale(.8)}to{opacity:1;transform:rotateY(0) translateY(0) scale(1)}}
@media(max-width:600px){.ritual-stage{height:375px}.fan-card{width:67px;height:111px}.spread .fan-card{transform:translate(calc(-50% + (var(--i) - 5) * 23px),calc(-50% + var(--offset))) rotate(var(--rotation))}.spread .fan-card:hover{transform:translate(calc(-50% + (var(--i) - 5) * 23px),calc(-50% + var(--offset) - 12px)) rotate(var(--rotation)) scale(1.04)}.chosen-card{width:82px;height:126px}.back-sigil{font-size:39px}.flip-glyph{font-size:26px}.hero{min-height:410px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
body.reduce-effects *,body.reduce-effects *:before,body.reduce-effects *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}

.mystic-back img{width:100%;height:100%;display:block;border-radius:12px}.image-card{width:100%;height:100%;display:flex;align-items:center;justify-content:center;transform-origin:center}.image-card img{width:100%;height:100%;object-fit:cover;border-radius:14px;display:block;box-shadow:0 10px 24px #0004}.image-card.reversed img{transform:rotate(180deg)}.tarotcard{background:none;padding:0;border:none;box-shadow:none}.tarotcard .image-card{max-width:200px}.card-caption{margin-top:10px;text-align:center;color:#ead5a6;display:flex;flex-direction:column;gap:4px}.card-caption em{color:#bda8d0;font-style:normal}.cards{align-items:flex-start}.flip-front{background:linear-gradient(180deg,#392743,#24192f)}.small-face{width:70px;height:112px;margin-top:6px}.small-face img{border-radius:10px;object-fit:cover}.library-item summary{display:flex;align-items:center;gap:12px;list-style:none}.library-item summary::-webkit-details-marker{display:none}.library-thumb{width:56px;height:90px;flex:0 0 56px;display:block}.library-thumb img{width:100%;height:100%;object-fit:cover;border-radius:8px;box-shadow:0 6px 16px #0003}.library-meta{display:flex;flex-direction:column;gap:4px}.library-meta strong{color:#f1deb2}.library-meta small{color:#c4b0d8}.library-body{padding:0 6px 10px 6px}.fan-card .mystic-back{padding:0;border:none;background:none;box-shadow:0 8px 18px #0005}.fan-card .mystic-back img{border-radius:12px}.tarotcard.reversed .card-caption{padding-top:0}.library details{padding:12px}.chosen-card{background:none}.flip-face{overflow:hidden}.cards .tarotcard{display:flex;flex-direction:column;align-items:center}.cards .tarotcard .image-card{width:180px;height:300px}.cards{gap:18px}.reversed .image-card{transform:rotate(180deg)}
@media(max-width:600px){.cards .tarotcard .image-card{width:140px;height:233px}.small-face{width:58px;height:93px}.library-thumb{width:48px;height:78px;flex-basis:48px}}

/* V4: complete illustrated Rider–Waite–Smith artwork, not textual placeholders */
.flip-front{padding:0;display:block;background:#201829;border:2px solid #e2c387}.flip-front .image-card,.flip-front .image-card img{width:100%;height:100%;max-width:none;border-radius:8px;object-fit:cover}.image-card img{background:#f1e1bd}.image-card.reversed img{transform:rotate(180deg)}.reversed .image-card{transform:none!important}.mystic-back{overflow:hidden}.chosen-card .flip-front .image-card{margin:0;width:100%;height:100%}.flip-glyph{display:none}.image-card.image-error{background:#493758;border:2px solid #ceac76;color:#fff}.image-card.image-error:after{content:'牌面加载失败，请检查网络';position:absolute;font-size:11px;color:#e2d7bc;text-align:center;max-width:100px}.image-card.image-error img{opacity:.06}.library-thumb img{object-fit:cover}

.image-error{min-height:170px;position:relative;background:#32243f;border:2px solid #caab7d;border-radius:12px}.image-error:after{content:"牌面尚未导入，请联系站长";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;text-align:center;color:#eadbbd;font-size:14px;background:#36283fda;border-radius:10px}.image-error img{visibility:hidden}
