*{box-sizing:border-box}body{margin:0;font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;background:#08070d;color:#eee;min-height:100vh}
body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 50% 10%,#3b225e55,transparent 38%),radial-gradient(circle at 20% 80%,#182d4850,transparent 35%);pointer-events:none}
.app{width:min(1080px,94vw);margin:auto;position:relative;z-index:1;padding:42px 0 70px}.brand{text-align:center;letter-spacing:.25em;color:#d9b875;font-size:12px}.title{text-align:center;font-size:42px;margin:12px 0 8px;font-weight:600}.sub{text-align:center;color:#aaa1b5;margin-bottom:34px}
.panel{background:#ffffff09;border:1px solid #ffffff14;border-radius:24px;padding:28px;backdrop-filter:blur(16px);box-shadow:0 18px 70px #0008}
textarea{width:100%;height:110px;resize:none;background:#090811;border:1px solid #ffffff18;border-radius:16px;color:#fff;padding:18px;font-size:16px;outline:none}
textarea:focus{border-color:#b79555}.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.tag{padding:9px 13px;border:1px solid #ffffff18;border-radius:99px;color:#bfb5c9;cursor:pointer}.tag:hover{border-color:#b79555;color:#e8d5aa}
button{border:0;border-radius:14px;padding:14px 22px;background:linear-gradient(135deg,#d5b46e,#a77a39);color:#160f08;font-weight:700;cursor:pointer;font-size:15px;box-shadow:0 10px 30px #a77a3930}button.secondary{background:#ffffff0b;color:#eee;border:1px solid #ffffff18;box-shadow:none}
.center{text-align:center}.hidden{display:none!important}.draw-stage .fan-deck{visibility:visible!important}.cards{display:flex;justify-content:center;gap:28px;flex-wrap:wrap;margin:30px 0}.slot{width:190px;text-align:center}.slot h3{font-size:13px;color:#a99dae;font-weight:500}.card{height:290px;border-radius:16px;position:relative;cursor:pointer;perspective:900px}.face{position:absolute;inset:0;border-radius:16px;backface-visibility:hidden;transition:transform .75s cubic-bezier(.2,.8,.2,1);display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden}.back{background:linear-gradient(145deg,#171126,#2a1840);border:1px solid #b7955566}.back:after{content:"✦";font-size:55px;color:#d8b56d;text-shadow:0 0 25px #d8b56d88}.back:before{content:"";position:absolute;inset:12px;border:1px solid #d8b56d55;border-radius:10px}.front{background:linear-gradient(160deg,#21162e,#0f0d16);border:1px solid #d8b56d66;transform:rotateY(180deg);padding:18px}.card.flipped .back{transform:rotateY(-180deg)}.card.flipped .front{transform:rotateY(0)}.symbol{font-size:58px;color:#d8b56d;margin-bottom:14px}.name{font-size:22px}.orientation{font-size:13px;color:#c8ad77;margin-top:8px}.meaning{font-size:12px;color:#aaa1b5;text-align:center;line-height:1.7;margin-top:14px}
.reading{max-width:850px;margin:20px auto}.reading h2{font-size:20px;margin:24px 0 10px;color:#e7cf9c}.reading p{line-height:1.95;color:#d6d0d9;margin:8px 0}.typing{min-height:90px}.question{color:#e3c98f}.divider{height:1px;background:#ffffff12;margin:28px 0}
.loading{color:#c7b4d3}.dots:after{content:"";animation:d 1.2s infinite}@keyframes d{0%{content:"."}33%{content:".."}66%{content:"..."}}
footer{text-align:center;color:#756d7d;font-size:12px;margin-top:28px;line-height:1.8}

.deck-wrap{position:relative;margin:26px auto 10px;max-width:100%;overflow:hidden;border-radius:20px}
.deck{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:18px 34px 26px;cursor:grab;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.deck::-webkit-scrollbar{display:none}.deck:active{cursor:grabbing}
.mini-card{flex:0 0 108px;height:168px;scroll-snap-align:center;border-radius:13px;background:linear-gradient(145deg,#171126,#2a1840);border:1px solid #b7955566;position:relative;display:flex;align-items:center;justify-content:center;transition:.25s;box-shadow:0 8px 25px #0005}
.mini-card:before{content:"✦";font-size:36px;color:#d8b56d;text-shadow:0 0 18px #d8b56d88}
.mini-card:hover{transform:translateY(-8px);border-color:#d8b56d}.mini-card.selected{border-color:#e7cf9c;box-shadow:0 0 0 2px #d8b56d55,0 12px 35px #d8b56d22;transform:translateY(-12px)}
.mini-card.disabled{opacity:.35;pointer-events:none}.selected-badge{position:absolute;bottom:7px;font-size:10px;color:#d8b56d;letter-spacing:.1em}
.scroll-hint{color:#918899;font-size:12px;margin:0 0 8px}.draw-count{color:#d8b56d;font-size:13px;margin-top:12px}

.deck-wrap{position:relative;margin:28px auto 8px;width:100%;overflow:hidden;border-radius:22px;background:linear-gradient(180deg,#0b0913aa,#0a0911);border:1px solid #ffffff0d}
.deck{display:flex;align-items:center;gap:14px;width:100%;min-height:225px;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scroll-snap-type:x proximity;padding:28px 42px 30px;cursor:grab;touch-action:pan-x;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.deck::-webkit-scrollbar{display:none}
.deck.dragging{cursor:grabbing;scroll-behavior:auto}
.mini-card{box-sizing:border-box;display:flex!important;flex:0 0 112px!important;width:112px!important;height:174px!important;min-width:112px!important;min-height:174px!important;position:relative;align-items:center;justify-content:center;border-radius:14px;background:linear-gradient(145deg,#171126 0%,#2d1943 100%);border:1px solid #b7955566;box-shadow:0 10px 28px #0008;scroll-snap-align:center;cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;visibility:visible!important;opacity:1!important}
.mini-card:before{content:"✦";font-size:40px;color:#d8b56d;text-shadow:0 0 18px #d8b56d88}
.mini-card:after{content:"";position:absolute;inset:10px;border:1px solid #d8b56d35;border-radius:9px;pointer-events:none}
.mini-card:hover{transform:translateY(-8px);border-color:#d8b56d;box-shadow:0 18px 38px #000b}
.mini-card.selected{transform:translateY(-16px) scale(1.03);border-color:#f0d99f;box-shadow:0 0 0 2px #d8b56d44,0 20px 45px #d8b56d25}
.selected-badge{position:absolute;z-index:2;bottom:7px;left:0;right:0;text-align:center;font-size:10px;color:#f0d99f;letter-spacing:.08em}

/* V5 — fan-shaped tarot deck */
.draw-stage{position:relative;height:430px;margin:10px auto 0;overflow:hidden;border-radius:24px;
background:radial-gradient(circle at 50% 95%,#39205255 0,#17121f22 35%,transparent 66%)}
.fan-deck{position:absolute;left:50%;bottom:-88px;width:760px;height:390px;transform:translateX(-50%);touch-action:none;user-select:none}
.fan-card{position:absolute;left:50%;bottom:20px;width:92px;height:164px;margin-left:-46px;
border-radius:13px;background:linear-gradient(145deg,#151020,#32204b);
border:1px solid #c7a45e88;box-shadow:0 16px 32px #0009;
transform-origin:50% 118%;cursor:pointer;transition:transform .55s cubic-bezier(.2,.85,.2,1),filter .3s,opacity .3s}
.fan-card:before{content:"✦";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
font-size:35px;color:#d8b56d;text-shadow:0 0 20px #d8b56d88}
.fan-card:after{content:"";position:absolute;inset:8px;border:1px solid #d8b56d42;border-radius:9px}
.fan-card:hover{filter:brightness(1.18);z-index:90!important}
.fan-card.selected{filter:brightness(1.3);border-color:#f1d898;box-shadow:0 0 0 2px #d8b56d55,0 22px 44px #d8b56d35}
.fan-card.selected:before{content:"✓";font-size:25px}
.fan-card .pick{position:absolute;z-index:3;left:0;right:0;bottom:8px;text-align:center;color:#f0d99f;font-size:10px}
.fan-deck.shuffling .fan-card{animation:shuffleFan .7s ease-in-out}
@keyframes shuffleFan{0%{transform:translate(0,0) rotate(var(--r))}35%{transform:translate(var(--sx),-55px) rotate(calc(var(--r) * -1))}70%{transform:translate(calc(var(--sx) * -.6),-18px) rotate(var(--r))}100%{transform:translate(0,0) rotate(var(--r))}}
.deck-tip{position:absolute;left:0;right:0;top:12px;text-align:center;color:#958b9e;font-size:12px;z-index:95}
.shuffle-btn{position:relative;z-index:110;margin-top:8px}
@media(max-width:700px){
 .draw-stage{height:350px}
 .fan-deck{width:620px;height:330px;bottom:-92px}
 .fan-card{width:76px;height:138px;margin-left:-38px}
 .fan-card:before{font-size:28px}
}

/* V6 cinematic reading experience */
body:after{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 100%,#d8b56d08,transparent 35%)}
.brand{animation:brandPulse 3.5s ease-in-out infinite}
@keyframes brandPulse{50%{text-shadow:0 0 22px #d8b56d44}}
.draw-stage:before{content:"";position:absolute;left:50%;bottom:20px;width:460px;height:110px;transform:translateX(-50%);background:#b7955520;filter:blur(35px);border-radius:50%}
.reveal-grid{display:flex;justify-content:center;gap:22px;flex-wrap:wrap;margin:20px 0 6px}
.reveal-slot{width:190px;text-align:center}
.reveal-card{height:300px;perspective:1000px;cursor:pointer}
.reveal-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.reveal-card.open .reveal-inner{transform:rotateY(180deg)}
.card-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:18px;overflow:hidden}
.card-back{background:linear-gradient(145deg,#130e1e,#34204a);border:1px solid #d8b56d77;display:flex;align-items:center;justify-content:center}
.card-back:before{content:"✦";font-size:66px;color:#d8b56d;text-shadow:0 0 28px #d8b56d88}
.card-back:after{content:"";position:absolute;inset:13px;border:1px solid #d8b56d55;border-radius:12px}
.card-front{transform:rotateY(180deg);background:radial-gradient(circle at 50% 35%,#3b2851,#120e18 72%);border:1px solid #d8b56d88;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.arcana-symbol{font-size:60px;color:#e5ca91;text-shadow:0 0 25px #d8b56d55;margin-bottom:14px}
.arcana-name{font-size:23px;color:#f3e8d1}
.arcana-num{font-size:11px;letter-spacing:.22em;color:#9f8caa;margin-bottom:8px}
.arcana-dir{font-size:13px;color:#d8b56d;margin-top:9px}
.reveal-key{font-size:11px;color:#aaa0b0;line-height:1.7;margin-top:12px}
.ai-stream{white-space:pre-wrap;line-height:2;color:#ddd6df}
.ai-cursor{display:inline-block;width:7px;height:17px;background:#d8b56d;margin-left:4px;vertical-align:-2px;animation:blink .8s infinite}
@keyframes blink{50%{opacity:0}}
.reading-head{text-align:center;color:#9e93a5;font-size:12px;margin-bottom:16px}
.action-row{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:24px}
.small-note{font-size:11px;color:#756c7d;text-align:center;margin-top:14px}

/* ===== V7 product polish ===== */
:root{--gold:#d8b56d;--gold2:#f0d99f;--ink:#09080f;--muted:#a59bab;--panel:#12101a}
*{scrollbar-color:#4b3a54 #09080f}
.app{max-width:1120px}
.screen-title{font-size:30px;text-align:center;margin:8px 0 10px}
.progress{display:flex;justify-content:center;gap:8px;margin:16px 0 28px}
.progress span{width:34px;height:4px;border-radius:99px;background:#ffffff12;transition:.4s}
.progress span.on{background:var(--gold);box-shadow:0 0 15px #d8b56d55}
.question-pill{display:inline-flex;max-width:min(800px,90%);padding:9px 16px;border:1px solid #d8b56d35;border-radius:999px;background:#d8b56d09;color:#e5d4ac;font-size:13px}
.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:15px}
.category{padding:13px;border:1px solid #ffffff12;border-radius:14px;background:#ffffff05;color:#aaa1b5;cursor:pointer;text-align:left}
.category b{display:block;color:#ddd2df;margin-bottom:4px}.category small{font-size:11px}
.category.active{border-color:#d8b56d66;background:#d8b56d0d}
.primary-wide{min-width:190px}
.card-glow{position:absolute;inset:-40px;background:radial-gradient(circle,#d8b56d18,transparent 65%);pointer-events:none}
.result-toolbar{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin:18px 0}
.result-toolbar button{padding:10px 15px;font-size:13px}
.history-empty{text-align:center;color:#8c8291;padding:30px}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:11px 16px;border-radius:999px;background:#25202d;color:#eee;border:1px solid #ffffff1a;z-index:9999;transition:.25s}
.toast.show{opacity:1;transform:translate(-50%,0)}
.reading p{font-size:15px}
.reading h2{margin-top:28px}
@media(max-width:700px){.category-grid{grid-template-columns:1fr}.title{font-size:34px}.panel{padding:20px}.result-toolbar{gap:7px}}

/* ===== V8 visual identity ===== */
.card-back{background:#120d19 url('/assets/card-back.svg') center/cover no-repeat!important}
.fan-card:before{content:""!important;background:url('/assets/card-back.svg') center/cover no-repeat;position:absolute;inset:0;border-radius:13px;z-index:0}
.fan-card:after{z-index:1}.fan-card .pick{z-index:3}
.reveal-card .card-back:before{content:""!important;background:url('/assets/card-back.svg') center/cover no-repeat;position:absolute;inset:0}
.hero-orb{position:absolute;inset:-120px;pointer-events:none;background:radial-gradient(circle at 50% 48%,#d8b56d12,transparent 28%,#6e3b9020 52%,transparent 70%);filter:blur(3px)}
.sound-toggle{position:fixed;right:18px;top:18px;z-index:1000;border:1px solid #ffffff15;background:#100d17cc;color:#cfc5d3;border-radius:999px;padding:9px 12px;font-size:12px;backdrop-filter:blur(10px)}
.daily{margin:15px auto 0;max-width:760px;padding:14px 17px;border:1px solid #d8b56d20;background:#d8b56d07;border-radius:15px;text-align:left}
.daily b{color:#e5d4ac;font-size:12px}.daily span{display:block;color:#9f96a6;font-size:12px;margin-top:5px;line-height:1.7}
.ai-badge{display:inline-flex;align-items:center;gap:6px;border:1px solid #d8b56d25;color:#cdb889;padding:5px 9px;border-radius:999px;font-size:10px;margin-bottom:10px}
.ai-dot{width:6px;height:6px;border-radius:50%;background:#d8b56d;box-shadow:0 0 9px #d8b56d;animation:dotpulse 1.3s infinite}
@keyframes dotpulse{50%{opacity:.35;transform:scale(.7)}}

/* ===== V9 deck visibility fix ===== */
html,body{overflow-x:hidden!important}
.draw-stage{
 position:relative!important;
 height:390px!important;
 margin:22px auto 8px!important;
 overflow:visible!important;
 border-radius:24px;
}
.fan-deck{
 position:absolute!important;
 left:50%!important;
 bottom:18px!important;
 width:min(900px,94vw)!important;
 height:315px!important;
 transform:translateX(-50%)!important;
 overflow:visible!important;
 z-index:20!important;
 pointer-events:auto!important;
}
.fan-card{
 position:absolute!important;
 left:50%!important;
 bottom:0!important;
 width:104px!important;
 height:178px!important;
 min-width:104px!important;
 min-height:178px!important;
 margin-left:-52px!important;
 display:block!important;
 visibility:visible!important;
 opacity:1!important;
 overflow:hidden!important;
 z-index:20!important;
}
.fan-card:before{
 content:""!important;
 position:absolute!important;
 inset:0!important;
 display:block!important;
 background:url('/assets/card-back.svg') center/cover no-repeat!important;
 border-radius:13px!important;
 z-index:0!important;
}
.fan-card:after{
 content:""!important;
 position:absolute!important;
 inset:8px!important;
 display:block!important;
 border:1px solid #d8b56d66!important;
 border-radius:9px!important;
 z-index:1!important;
}
.fan-card .pick{
 z-index:4!important;
 text-shadow:0 1px 8px #000!important;
}
.deck-tip{z-index:100!important}
.shuffle-btn{z-index:150!important}
@media(max-width:700px){
 .draw-stage{height:330px!important}
 .fan-deck{width:620px!important;height:270px!important;bottom:8px!important}
 .fan-card{width:78px!important;height:140px!important;min-width:78px!important;min-height:140px!important;margin-left:-39px!important}
}

/* ===== V10: robust horizontal swipe deck ===== */
html,body{overflow-x:hidden!important}
.draw-stage-v10{
 position:relative!important;
 width:100%!important;
 height:300px!important;
 margin:22px auto 10px!important;
 border-radius:22px!important;
 background:
   radial-gradient(circle at 50% 100%,rgba(112,72,150,.22),transparent 52%),
   linear-gradient(180deg,rgba(7,6,12,.5),rgba(15,11,22,.9))!important;
 border:1px solid rgba(255,255,255,.06)!important;
 overflow:hidden!important;
}
.deck-tip-v10{
 position:absolute!important;
 top:14px!important;
 left:0!important;
 right:0!important;
 z-index:50!important;
 text-align:center!important;
 color:#b9afc0!important;
 font-size:12px!important;
}
.deck-viewport{
 position:absolute!important;
 left:0!important;
 right:0!important;
 top:42px!important;
 bottom:16px!important;
 overflow-x:auto!important;
 overflow-y:hidden!important;
 z-index:20!important;
 scrollbar-width:none!important;
 -webkit-overflow-scrolling:touch!important;
 touch-action:pan-x!important;
 cursor:grab!important;
}
.deck-viewport::-webkit-scrollbar{display:none!important}
.deck-viewport:active{cursor:grabbing!important}
.deck-v10{
 height:100%!important;
 min-width:max-content!important;
 display:flex!important;
 align-items:center!important;
 gap:14px!important;
 padding:12px 42px 16px!important;
}
.card-v10{
 position:relative!important;
 flex:0 0 106px!important;
 width:106px!important;
 height:172px!important;
 border-radius:14px!important;
 border:1px solid rgba(216,181,109,.58)!important;
 background:#130e1b url('/assets/card-back.svg') center/cover no-repeat!important;
 box-shadow:0 12px 28px rgba(0,0,0,.6)!important;
 cursor:pointer!important;
 transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,filter .2s ease!important;
 overflow:hidden!important;
}
.card-v10:before{
 content:""!important;
 position:absolute!important;
 inset:9px!important;
 border:1px solid rgba(240,217,159,.42)!important;
 border-radius:9px!important;
 pointer-events:none!important;
}
.card-v10:hover{
 transform:translateY(-8px)!important;
 filter:brightness(1.12)!important;
 border-color:#f0d99f!important;
}
.card-v10.selected{
 transform:translateY(-14px)!important;
 border-color:#f4d98f!important;
 box-shadow:0 0 0 2px rgba(216,181,109,.4),0 18px 40px rgba(216,181,109,.22)!important;
}
.card-v10 .selected-badge{
 position:absolute!important;
 left:0!important;
 right:0!important;
 bottom:8px!important;
 z-index:5!important;
 color:#f0d99f!important;
 text-align:center!important;
 font-size:10px!important;
 letter-spacing:.08em!important;
 text-shadow:0 2px 6px #000!important;
}
.card-v10.selected:after{
 content:"✓"!important;
 position:absolute!important;
 top:8px!important;
 right:9px!important;
 width:21px!important;
 height:21px!important;
 line-height:21px!important;
 text-align:center!important;
 border-radius:50%!important;
 background:#d8b56d!important;
 color:#1a1209!important;
 font-weight:800!important;
 z-index:6!important;
}
.deck-fade{
 position:absolute!important;
 top:0!important;
 bottom:0!important;
 width:90px!important;
 z-index:40!important;
 pointer-events:none!important;
}
.deck-fade.left{left:0!important;background:linear-gradient(90deg,#0c0912,transparent)!important}
.deck-fade.right{right:0!important;background:linear-gradient(270deg,#0c0912,transparent)!important}
.shuffle-btn{position:relative!important;z-index:60!important}
@media(max-width:700px){
 .draw-stage-v10{height:265px!important}
 .deck-viewport{top:40px!important;bottom:12px!important}
 .deck-v10{gap:10px!important;padding:10px 28px 14px!important}
 .card-v10{flex-basis:82px!important;width:82px!important;height:136px!important;border-radius:11px!important}
 .deck-fade{width:45px!important}
}

/* V11 fallback: never allow an invisible card back */
.card-v10{
 background-color:#1d1430!important;
 background-image:
   radial-gradient(circle at 30% 25%,rgba(240,217,159,.18) 0 1px,transparent 2px),
   radial-gradient(circle at 70% 68%,rgba(216,181,109,.16) 0 1px,transparent 2px),
   linear-gradient(145deg,#171126,#31204a)!important;
}
.card-v10:before{
 content:"✦"!important;
 position:absolute!important;
 inset:0!important;
 display:flex!important;
 align-items:center!important;
 justify-content:center!important;
 border:1px solid rgba(240,217,159,.4)!important;
 border-radius:10px!important;
 color:#d8b56d!important;
 font-size:38px!important;
 text-shadow:0 0 22px rgba(216,181,109,.8)!important;
 background:linear-gradient(transparent,transparent)!important;
 z-index:1!important;
}

/* ===== V12 original 78-card artwork ===== */
.card-front{padding:0!important;background:#0d0a12!important}
.tarot-art{width:100%;height:100%;display:block;object-fit:cover;border-radius:18px;transition:filter .3s}
.reveal-card.reversed .card-front .tarot-art{transform:rotate(180deg)}
.reveal-card.open .card-front .tarot-art{filter:drop-shadow(0 0 18px rgba(216,181,109,.14))}
.reveal-slot>div:last-child{letter-spacing:.03em}

.transition-layer{position:fixed;inset:0;z-index:9000;background:radial-gradient(circle,#2d1e3b,#08070d 62%);display:flex;align-items:center;justify-content:center;flex-direction:column;color:#e6d2a1;letter-spacing:.2em;opacity:0;pointer-events:none;animation:fadeinout 1.05s ease forwards}
.transition-star{font-size:64px;margin-bottom:12px;text-shadow:0 0 40px #d8b56d99}
@keyframes fadeinout{0%{opacity:0}22%{opacity:1}75%{opacity:1}100%{opacity:0}}
.ai-section{margin:0 0 8px}.ai-section h2{scroll-margin-top:20px}
.reveal-label{font-size:13px;color:#b7acbd;margin-top:9px}
@media(max-width:700px){.reveal-grid{gap:14px}.reveal-slot{width:118px}.reveal-card{height:225px}.reveal-label{font-size:12px}}

/* ===== V15 live AI tarot chat ===== */
.chat-reading{max-width:800px;margin:0 auto}
.chat-msg{display:flex;gap:12px;align-items:flex-start;margin:18px 0}
.chat-msg.user{justify-content:flex-end}
.chat-msg.user .chat-avatar{order:2;background:#2a2030;color:#d8b56d}
.chat-avatar{width:34px;height:34px;flex:0 0 34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#1b1526;border:1px solid #d8b56d33;color:#d8b56d;font-size:15px}
.chat-bubble{max-width:calc(100% - 48px);padding:15px 18px;border-radius:17px;background:#ffffff07;border:1px solid #ffffff12;color:#ddd6df;line-height:1.95;font-size:14px}
.chat-msg.user .chat-bubble{background:#d8b56d0d;border-color:#d8b56d24;color:#ead9b4}
.live-card{border:1px solid #ffffff12;background:linear-gradient(180deg,#ffffff08,#ffffff03);border-radius:20px;padding:18px 20px;margin:14px 0}
.live-title{display:flex;align-items:center;gap:8px;color:#ead29b;font-weight:700;font-size:15px;margin-bottom:10px}
.live-title .spark{font-size:18px}
.live-body{min-height:22px;white-space:pre-wrap;line-height:1.95;color:#ddd6df}
.live-card.waiting .live-body{color:#8d8392}
.live-card.done{border-color:#d8b56d20}
.typing-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#d8b56d;margin-left:4px;animation:dotPulse .85s infinite}
@keyframes dotPulse{0%,100%{opacity:.25;transform:scale(.75)}50%{opacity:1;transform:scale(1)}}
.live-status{text-align:center;font-size:11px;color:#83798b;margin:14px 0}
.next-hint{text-align:center;color:#988d9e;font-size:11px;margin-top:8px}
@media(max-width:700px){
 .chat-bubble{font-size:13px;padding:13px 14px}
 .live-card{padding:15px 15px}
}

/* ===== V16 card library + detail pages ===== */
.card-library-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:20px}
.library-filter{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:16px}
.lib-filter.active{border-color:#d8b56d66;background:#d8b56d0e;color:#ead7aa}
.lib-card{background:#ffffff06;border:1px solid #ffffff12;border-radius:18px;padding:12px;cursor:pointer;transition:.2s;display:flex;flex-direction:column;align-items:center;text-align:center}
.lib-card:hover{transform:translateY(-6px);border-color:#d8b56d55;box-shadow:0 12px 26px #0005}
.lib-card img{width:100%;aspect-ratio:3/5;object-fit:cover;border-radius:12px}
.lib-name{margin-top:10px;color:#f0d99f;font-size:13px}
.lib-sub{font-size:11px;color:#93889b;margin-top:4px}
.card-detail-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.card-detail-backdrop{position:absolute;inset:0;background:#08070ddd;backdrop-filter:blur(8px)}
.card-detail-sheet{position:relative;z-index:2;width:min(1180px,94vw);max-height:92vh;overflow:auto;background:#0f0c14;border:1px solid #ffffff14;border-radius:28px;padding:22px;box-shadow:0 30px 80px #000a}
.detail-close{position:absolute;top:16px;right:16px;border:none;background:#ffffff0c;border:1px solid #ffffff14;color:#eee;border-radius:999px;width:38px;height:38px;cursor:pointer}
.detail-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:24px}
.detail-scene{width:100%;border-radius:22px;border:1px solid #ffffff14;display:block}
.detail-card-frame{margin-top:16px;display:flex;justify-content:center}
.detail-card-art{width:250px;max-width:100%;border-radius:22px;border:1px solid #d8b56d33;background:#0d0911}
.detail-overline{font-size:11px;letter-spacing:.24em;color:#9b8ea6;margin-top:10px}
.detail-title{font-size:34px;margin:10px 0 12px;color:#f0d99f}
.detail-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.detail-chips span{padding:7px 10px;border-radius:999px;background:#d8b56d12;color:#ead7aa;border:1px solid #d8b56d20;font-size:12px}
.detail-block{padding:14px 0;border-top:1px solid #ffffff0e}
.detail-block h3{font-size:14px;color:#e8d19c;margin:0 0 8px}
.detail-block p{font-size:14px;line-height:1.9;color:#ddd6df;margin:0}
.reveal-card{cursor:pointer}
.reveal-card:hover{transform:translateY(-4px)}
@media(max-width:1100px){.card-library-grid{grid-template-columns:repeat(4,1fr)}.detail-layout{grid-template-columns:1fr}}
@media(max-width:700px){.card-library-grid{grid-template-columns:repeat(2,1fr)}.detail-title{font-size:26px}.card-detail-sheet{padding:16px}}