*{box-sizing:border-box;margin:0;-webkit-tap-highlight-color:transparent}
:root{--brand:"Courgette","Kaushan Script",cursive;--pink:#ee9cc0;--lav:#a98ad8;--ink:#4e4466;--soft:#8a809f;--plum:#7d68a8;--serif:"Cormorant Garamond",Georgia,serif;--sans:"Inter","Jost",system-ui,sans-serif}
body{font-family:var(--sans);font-weight:300;color:var(--ink);min-height:100vh;overflow:hidden;background:linear-gradient(170deg,#e9dcf6 0%,#f1e2f0 40%,#f8e3e6 75%,#f6e6dc 100%)}
#bg i{position:fixed;border-radius:50%;filter:blur(70px);opacity:.55;animation:float 18s ease-in-out infinite}
#bg i:nth-child(1){width:300px;height:300px;background:#cdbfe8;top:-90px;left:-90px}
#bg i:nth-child(2){width:260px;height:260px;background:#b9d3ec;top:40%;right:-110px;animation-delay:-6s}
#bg i:nth-child(3){width:260px;height:260px;background:#efc7d8;bottom:-100px;left:10px;animation-delay:-11s}
@keyframes float{50%{transform:translate(18px,26px) scale(1.08)}}
#sparkles span{position:fixed;width:2px;height:2px;border-radius:50%;background:#fff;box-shadow:0 0 6px 1px #fff;animation:tw 5s ease-in-out infinite;pointer-events:none}
@keyframes tw{0%,100%{opacity:.1}50%{opacity:.8}}
#app{position:relative;max-width:430px;margin:auto;height:100vh}
.scr{position:absolute;inset:0;padding:26px 22px 20px;opacity:0;pointer-events:none;transition:opacity .7s;display:flex;flex-direction:column;align-items:center;gap:16px;overflow:hidden}
.scr.on{opacity:1;pointer-events:auto}
.glass{background:linear-gradient(140deg,rgba(255,255,255,.62),rgba(255,255,255,.28));border:1px solid rgba(255,255,255,.75);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 10px 30px rgba(92,72,140,.10),inset 0 1px 0 rgba(255,255,255,.9)}
.eyebrow{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--soft);font-weight:500}
.eyebrow.small{font-size:10px;letter-spacing:.18em}
header{text-align:center;margin-top:20px}
.logo{font-family:var(--serif);font-size:54px;font-weight:500;letter-spacing:.04em;line-height:1.05;background:linear-gradient(100deg,#8b72bf,#8fb3dc 55%,#cf93b4);-webkit-background-clip:text;color:transparent}
.sub{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--soft)}
.buddyBar{display:flex;gap:14px;align-items:center;width:100%;padding:12px 16px 12px 12px;border-radius:24px;cursor:pointer}
.buddyBar>div{flex:1}.msg{font-family:var(--serif);font-size:19px;font-style:italic;margin-top:2px}
.chev{font-size:24px;color:var(--soft);font-weight:200}
.av{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.9);box-shadow:0 0 0 1px #d8cbee,0 6px 18px rgba(110,80,160,.18);transition:.5s}
.av.sm{width:56px;height:56px}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%}
.tile{height:120px;border-radius:24px;font-family:var(--sans);color:var(--ink);display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:2px;padding:16px;cursor:pointer;text-align:left;transition:transform .4s}
.tile b{font-family:var(--serif);font-size:20px;font-weight:600;line-height:1.1}
.tile small{font-size:11px;color:var(--soft);letter-spacing:.04em}
.tile:active{transform:scale(.97)}
.ic{width:28px;height:28px;fill:none;stroke:var(--plum);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;margin-bottom:auto;filter:drop-shadow(0 0 6px rgba(200,180,255,.8))}
.fine{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);opacity:.75;margin-top:auto;text-align:center}
.top{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;width:100%}
.top h2{font-family:var(--serif);font-weight:500;font-size:28px;text-align:center;letter-spacing:.02em}
.back{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.8);background:rgba(255,255,255,.4);font-size:22px;font-weight:200;color:var(--plum);cursor:pointer}
.hint{font-size:13px;color:var(--soft);text-align:center;line-height:1.5;max-width:300px}
/* guide */
.guide{display:flex;align-items:flex-end;gap:10px;width:100%}
.guide img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:1.5px solid #fff;box-shadow:0 0 0 1px #d8cbee}
.guide p{font-family:var(--serif);font-style:italic;font-size:16px;padding:9px 14px;border-radius:18px 18px 18px 4px;flex:1}
/* energy */
.bodyWrap{position:relative;width:200px;height:360px}
.body{width:100%;height:100%;filter:drop-shadow(0 0 14px rgba(190,170,240,.55))}
.flow{animation:flow 2s linear infinite;filter:drop-shadow(0 0 4px #fff)}
.flow.stop{animation-play-state:paused;opacity:.2}
@keyframes flow{to{stroke-dashoffset:-32}}
.ch{position:absolute;width:16px;height:16px;margin:-8px;border-radius:50%;cursor:pointer;transition:all .8s;background:radial-gradient(#fff 15%,var(--c) 60%);box-shadow:0 0 14px 5px var(--c)}
.ch::before{content:"";position:absolute;inset:-10px;border-radius:50%}
.ch.blocked{box-shadow:none;background:rgba(160,150,180,.35);opacity:.8}
.ch.blocked::after{content:"";position:absolute;inset:-5px;border:1px solid #a79cbc;border-radius:50%}
#parts{position:absolute;inset:0;pointer-events:none}
.p{position:absolute;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 8px 3px var(--c);animation:mv 2.6s ease-in-out infinite both;opacity:0}
@keyframes mv{0%{opacity:0;transform:translate(0,0)}25%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y))}}
.emos{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.pill{border-radius:999px;padding:9px 16px;font:400 13px var(--sans);letter-spacing:.03em;color:var(--ink);cursor:pointer;transition:all .5s;background:rgba(255,255,255,.45);border:1px solid rgba(255,255,255,.85)}
.pill.on{background:linear-gradient(120deg,#9e88cf,#c7a2c6);color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(125,104,168,.3)}
.row{display:flex;gap:8px;justify-content:center}.wrap{flex-wrap:wrap}
/* counter */
.ringWrap{position:relative;width:280px;height:280px;margin-top:4px}
.ringWrap svg{width:100%;height:100%;transform:rotate(-90deg)}
.rbg{fill:none;stroke:rgba(255,255,255,.6);stroke-width:3}
.rfg{fill:none;stroke:url(#rg);stroke-width:5;stroke-linecap:round;stroke-dasharray:628;stroke-dashoffset:628;transition:stroke-dashoffset .6s;filter:drop-shadow(0 0 6px rgba(190,160,230,.9))}
#tap{position:absolute;inset:30px;border-radius:50%;border:1px solid rgba(255,255,255,.9);background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.95),rgba(232,224,248,.75) 50%,rgba(214,228,246,.6));box-shadow:0 0 50px rgba(200,180,240,.55),inset 0 -10px 30px rgba(255,255,255,.7);color:var(--plum);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;animation:pulse 4s ease-in-out infinite}
#tap b{font-family:var(--serif);font-size:72px;font-weight:500;line-height:1}#tap small{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}
@keyframes pulse{50%{box-shadow:0 0 70px rgba(236,190,215,.6),inset 0 -10px 30px rgba(255,255,255,.7)}}
.aff{font-family:var(--serif);font-style:italic;text-align:center;font-size:20px;padding:0 10px}
.toggle{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.05em}
.toggle input{display:none}.toggle span{width:44px;height:24px;border-radius:20px;background:rgba(255,255,255,.55);border:1px solid #fff;position:relative;transition:.4s}
.toggle span::after{content:"";position:absolute;width:18px;height:18px;top:2px;left:2px;border-radius:50%;background:#b8a6dc;transition:.4s}
.toggle input:checked+span{background:#b9a2e6}.toggle input:checked+span::after{left:22px;background:#fff}
.burst{position:fixed;pointer-events:none;font-size:14px;color:#fff;text-shadow:0 0 8px #c9a8ff;animation:burst 1.8s ease-out forwards}
@keyframes burst{to{transform:translate(var(--x),var(--y)) scale(.4);opacity:0}}
/* tranquil */
.glassDeep{border-radius:32px;border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 0 50px rgba(255,255,255,.6),0 14px 40px rgba(92,72,140,.12)}
#pond{width:100%;flex:1;max-height:520px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#eef4fb,#d3def0 55%,#dcd2ec)}
.bub{position:absolute;border-radius:50%;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.95) 0 8%,rgba(255,255,255,.15) 30%,var(--c) 75%,rgba(255,255,255,.6) 100%);box-shadow:0 0 24px var(--c),inset 0 0 10px rgba(255,255,255,.8);opacity:.85;cursor:pointer;animation:rise var(--d) linear forwards;transition:transform .6s,opacity .6s}
.bub.pop{transform:scale(1.5);opacity:0}
@keyframes rise{to{top:-120px}}
.rip{position:absolute;border:1px solid #fff;border-radius:50%;width:10px;height:10px;margin:-5px;animation:rip 2.4s ease-out forwards;pointer-events:none}
@keyframes rip{to{width:220px;height:220px;margin:-110px;opacity:0}}
.note{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);display:flex;align-items:center;gap:8px}
.dot{width:7px;height:7px;border-radius:50%;background:#c7a2c6;box-shadow:0 0 8px #c7a2c6;animation:tw 3s infinite}
/* inner child */
.nook{position:relative;width:100%;height:330px;border-radius:32px;overflow:hidden;background:radial-gradient(ellipse at 50% 20%,#fff3e6,#f1dfe6 45%,#d9cfe8);box-shadow:inset 0 0 60px rgba(255,240,225,.8),0 14px 40px rgba(92,72,140,.12);border:1px solid rgba(255,255,255,.8)}
.lamp{position:absolute;top:-80px;left:50%;width:320px;height:320px;margin-left:-160px;border-radius:50%;background:radial-gradient(rgba(255,232,200,.9),transparent 65%)}
.curtain{position:absolute;top:0;bottom:0;width:60px;background:linear-gradient(90deg,rgba(255,255,255,.5),rgba(235,215,235,.3));filter:blur(1px)}
.curtain.l{left:0;border-radius:0 0 60px 0}.curtain.r{right:0;border-radius:0 0 0 60px}
.frame{position:absolute;left:50%;top:44px;width:150px;height:190px;margin-left:-75px;border-radius:75px 75px 14px 14px;padding:8px;background:linear-gradient(145deg,#f4e6c8,#d8c09a);box-shadow:0 12px 30px rgba(120,90,60,.2),0 0 40px rgba(255,226,180,.6);transition:box-shadow 1s,transform 1s}
.photo{width:100%;height:100%;border-radius:68px 68px 9px 9px;background:linear-gradient(#fbf4ee,#efe3ec);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--soft);font-family:var(--serif);font-style:italic;font-size:15px;text-align:center;padding:10px}
.photo svg{width:30px;fill:none;stroke:#b8a6c8;stroke-width:1}
.frame.glow{box-shadow:0 12px 30px rgba(120,90,60,.2),0 0 70px 20px rgba(255,214,170,.9)}.frame.hug{transform:scale(1.05)}
.shelf{position:absolute;bottom:58px;left:40px;right:40px;height:6px;border-radius:3px;background:rgba(255,255,255,.7)}
.candle{position:absolute;bottom:64px;width:10px;height:22px;border-radius:3px;background:#fffaf2}
.candle::after{content:"";position:absolute;left:1px;top:-12px;width:8px;height:12px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:#ffd59a;box-shadow:0 0 16px 6px rgba(255,200,130,.7);animation:tw 3s infinite}
.c1{left:70px}.c2{right:70px;height:16px}
#hearts{position:absolute;inset:0;pointer-events:none}
.h{position:absolute;bottom:120px;font-size:20px;color:#e3a2bf;text-shadow:0 0 10px #fff;animation:up 2.8s ease-out forwards}
@keyframes up{to{transform:translate(var(--x),-160px);opacity:0}}
.bubble{border-radius:20px;padding:12px 18px;font-family:var(--serif);font-style:italic;font-size:18px;transition:opacity .6s;max-width:320px;text-align:center}
#talk{display:flex;width:100%;border-radius:999px;padding:5px}
#talk input{flex:1;border:0;background:none;padding:8px 14px;font:300 15px var(--sans);color:var(--ink);outline:none}
#talk button{border:0;width:38px;height:38px;border-radius:50%;background:linear-gradient(120deg,#9e88cf,#c7a2c6);color:#fff;font-size:16px}
/* script */
.notif{display:flex;gap:12px;align-items:center;width:100%;padding:14px;border-radius:22px;animation:drop 1s ease}
@keyframes drop{from{transform:translateY(-20px);opacity:0}}
.nic{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#9e88cf,#9fc2e4);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px}
.notif div:nth-child(2){flex:1}.notif b{font-weight:500;font-size:14px}.notif p{font-size:14px}.notif small{color:var(--soft);font-size:11px;align-self:flex-start}
.card{border-radius:28px;padding:26px 24px;width:100%}
.scriptCard h3{font-family:var(--serif);font-weight:500;font-size:30px;margin:6px 0 14px}.scriptCard p:not(.eyebrow){font-family:var(--serif);font-size:20px;line-height:1.5;margin-bottom:12px}
/* buddy */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 6px;width:100%;overflow:auto;padding:6px 0 10px}
.bd{display:flex;flex-direction:column;align-items:center;gap:6px;font-family:var(--serif);font-size:16px;font-weight:500;cursor:pointer}
.bd .av{width:70px;height:70px}
.bd.sel .av{box-shadow:0 0 0 2px #fff,0 0 0 4px #ae95d6,0 0 24px 6px rgba(190,160,230,.6)}
/* sky */
#skybox{position:relative;width:100%;height:370px;border-radius:32px;overflow:hidden;background:linear-gradient(#c9cbdc,#dcd5e8 60%,#efdde6);box-shadow:inset 0 0 50px rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.7);transition:background 2.5s}
#skybox.clear{background:linear-gradient(#cfe3f5,#ece4f6 60%,#f6e1ea)}
.cl{position:absolute;padding:14px 20px;border-radius:40px;background:radial-gradient(ellipse at 40% 30%,rgba(250,249,253,.95),rgba(190,186,208,.85));box-shadow:0 10px 26px rgba(110,100,140,.25);color:#5d577a;font-family:var(--serif);font-style:italic;font-size:17px;cursor:pointer;transition:opacity 1.8s,filter 1.8s,transform 1.8s;animation:drift 9s ease-in-out infinite alternate;text-align:center;max-width:170px;filter:blur(.2px)}
.cl.melt{opacity:0;filter:blur(12px);transform:scale(1.3)}
@keyframes drift{to{translate:12px 6px}}
#done{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;opacity:0;transition:opacity 2.8s;font-family:var(--serif);font-size:26px}
#done.on{opacity:1}
.phone{width:170px;padding:14px 16px;border-radius:20px;background:rgba(255,255,255,.85);box-shadow:0 0 40px rgba(236,190,215,.7);font-family:var(--sans);font-size:14px}
.phone small{display:block;color:var(--soft);font-size:11px;margin-bottom:4px}
.mglow{width:130px;height:130px;border-radius:50%;background:radial-gradient(#fffbe8,#f3d79a 45%,transparent 70%);box-shadow:0 0 80px 20px rgba(245,220,160,.7)}
#breath{width:96px;height:96px;border-radius:50%;border:1px solid #fff;background:radial-gradient(rgba(255,255,255,.9),rgba(220,208,244,.5));box-shadow:0 0 30px rgba(200,180,240,.7);display:flex;align-items:center;justify-content:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--plum);transform:scale(.8);transition:transform 4s ease-in-out}
#breath.in{transform:scale(1.1)}#breath.out{transform:scale(.8);transition-duration:6s}
.shot .scr,.shot .ch{transition:none}

.hero{position:relative;width:calc(100% + 44px);margin:-26px -22px 0;height:300px;overflow:hidden;border-radius:0 0 36px 36px;box-shadow:0 14px 40px rgba(120,80,150,.22)}
.hero img{width:100%;height:100%;object-fit:cover;object-position:50% 70%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(60,30,90,.05) 30%,rgba(196,150,220,.35) 65%,rgba(240,220,240,.97) 100%)}
.heroTxt{position:absolute;left:0;right:0;bottom:14px;z-index:1;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}
.hero .logo{font-family:var(--brand);font-size:52px;font-weight:400;letter-spacing:0;background:none;color:#fff;-webkit-text-fill-color:#fff;text-shadow:0 0 2px #b678c9,0 2px 0 #c58ad8,0 0 18px rgba(186,120,210,.9);line-height:1.1}
.hero .sub{font-family:var(--brand);font-style:normal;color:#8d5fae;font-size:16px}
.pillScript{display:inline-block;padding:5px 14px;border-radius:999px;background:linear-gradient(90deg,#f3a6c8,#c9a2ea);color:#fff;font-family:var(--brand);font-size:14px;box-shadow:0 4px 14px rgba(220,130,180,.4);border:1px solid rgba(255,255,255,.8)}
.pillScript.sm{font-size:12px;padding:3px 11px}
.top h2{font-family:var(--brand);font-weight:400;font-size:28px;background:linear-gradient(90deg,#9a6fd0,#e389b6);-webkit-background-clip:text;color:transparent}
.tile b{font-family:var(--brand);font-weight:400;font-size:18px;color:#7b5aa6}
.tile{height:104px}
.ic{stroke:#b07cc6}
.polaroid{position:absolute;right:16px;top:-26px;width:96px;padding:6px 6px 22px;background:#fffdf9;box-shadow:0 8px 20px rgba(100,70,120,.25);transform:rotate(5deg)}
.polaroid img{width:100%;display:block}.polaroid span{position:absolute;bottom:3px;left:0;right:0;text-align:center;font-family:var(--brand);font-size:13px;color:#8d5fae}
.scriptCard{position:relative;margin-top:24px}
.guide{margin-top:auto}
.guide p{font-size:15px}
.pill.on{background:linear-gradient(90deg,#f0a3c6,#b796e4)}
#tap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
#tap b,#tap small{display:block}
#tap small{margin-top:14px}#tap b{font-variant-numeric:lining-nums}

/* ================= v3 · chic / unisex ================= */
:root{--ink:#24212b;--soft:#857c72;--plum:#3d3247;--gold:#b08f57;--line:rgba(36,33,43,.12);--ivory:#f5f1ea;--cream:#ebe4d8;--serif:"Cormorant Garamond","Playfair Display",Georgia,serif;--sans:"Jost","Inter",system-ui,sans-serif;--brand:var(--serif)}
body{background:var(--ivory);color:var(--ink);font-family:var(--sans);font-weight:300}
#bg,#sparkles{display:none}
.scr{background:var(--ivory);padding:22px 22px 18px;gap:14px}
.scr.dark{background:radial-gradient(ellipse at 50% -10%,#3a2f45 0%,#1d1924 55%,#141219 100%);color:#efe8dc;--ink:#efe8dc;--soft:#a69d90;--line:rgba(239,232,220,.14)}
.glass{background:#fbf8f3;border:1px solid var(--line);box-shadow:0 1px 2px rgba(36,33,43,.04);backdrop-filter:none;-webkit-backdrop-filter:none}
.dark .glass{background:rgba(255,255,255,.04);border-color:var(--line);box-shadow:none}
.cap,.eyebrow{font:500 10.5px var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--soft)}
.gold{color:var(--gold)!important}
.top h2,.top h2.cap{font-family:var(--serif);font-weight:500;font-size:26px;letter-spacing:.01em;background:none;-webkit-background-clip:initial;color:var(--ink)}
.top h2.cap{font:500 10.5px var(--sans);letter-spacing:.28em}
.back{border:1px solid var(--line);background:transparent;color:var(--ink);font-size:20px}
.fine{font-size:9.5px;letter-spacing:.22em;color:var(--soft);opacity:.85}
.hint{color:var(--soft);font-size:13px}
/* home */
#home{overflow-y:auto;justify-content:flex-start}
.hero{height:250px;border-radius:0;box-shadow:none;margin:-22px -22px 0;width:calc(100% + 44px);flex:none}
.hero img{filter:grayscale(.55) sepia(.25) contrast(.92) brightness(.82);object-position:50% 12%}
.hero::after{background:linear-gradient(180deg,rgba(20,18,25,.05) 25%,rgba(20,18,25,.55) 100%)}
.heroTxt{bottom:22px;gap:6px}
.hero .logo{font:500 40px var(--serif);letter-spacing:.42em;margin-right:-.42em;color:#f5f1ea;-webkit-text-fill-color:#f5f1ea;text-shadow:none}
.hero .sub{font:italic 400 17px var(--serif);color:#e9e1d4}
.pillScript{background:transparent;border:1px solid rgba(176,143,87,.6);color:var(--gold);font:italic 400 14px var(--serif);box-shadow:none;padding:3px 12px;letter-spacing:.02em}
.hero .pillScript{color:#f5f1ea;border-color:rgba(245,241,234,.6)}
.buddyBar{border-radius:14px;padding:12px 14px;flex:none}
.av{border:none;box-shadow:0 0 0 1px var(--line);filter:saturate(.8)}
.msg{font-size:17px;color:var(--ink)}
.secHead{width:100%;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:14px;margin-top:4px;flex:none}
.chips{display:flex;gap:18px;width:100%;flex:none}
.chips button{background:none;border:0;padding:2px 0;font:400 13px var(--sans);color:var(--soft);border-bottom:1px solid transparent;letter-spacing:.04em}
.chips button.on{color:var(--ink);border-color:var(--ink)}
.gallery{display:flex;gap:14px;overflow-x:auto;width:calc(100% + 22px);margin-right:-22px;padding:6px 22px 10px 2px;flex:none;scrollbar-width:none}
.pol{flex:none;width:150px;background:#fff;padding:7px 7px 0;box-shadow:0 6px 18px rgba(36,33,43,.10);transform:rotate(var(--r))}
.pol img{width:100%;height:190px;object-fit:cover;display:block;filter:saturate(.85)}
.pol figcaption{padding:7px 2px 9px;display:flex;flex-direction:column}
.pol span{font:italic 500 16px var(--serif);color:var(--ink)}.pol small{font-size:10px;color:var(--soft);letter-spacing:.04em}
.tiles{gap:10px;flex:none}
.tile{height:96px;border-radius:14px;padding:14px}
.tile.wide{grid-column:1/3;height:76px}
.tile b{font:500 19px var(--serif);color:var(--ink);white-space:nowrap}
.tile small{font-size:10.5px;letter-spacing:.05em;color:var(--soft)}
.ic{stroke:var(--gold);stroke-width:1;filter:none;width:22px;height:22px}
.guide img{box-shadow:0 0 0 1px var(--line);border:none;filter:saturate(.8)}
.guide p{border-radius:12px 12px 12px 3px;font-size:15px;color:var(--ink)}
.pill{background:transparent;border:1px solid var(--line);color:var(--ink);font-size:12.5px}
.pill.on{background:var(--ink);color:var(--ivory);border-color:var(--ink);box-shadow:none}
.dark .pill.on{background:#efe8dc;color:#1d1924}
.linkBtn{background:none;border:0;font:400 13px var(--sans);color:var(--gold);letter-spacing:.06em;cursor:pointer;border-bottom:1px solid rgba(176,143,87,.4);padding:2px 0}
/* energy */
.body{filter:none}
.flow{filter:none}
.ch{box-shadow:0 0 10px 2px var(--c);width:13px;height:13px;margin:-6.5px}
.p{box-shadow:0 0 6px 2px var(--c)}
/* counter */
.rbg{stroke:var(--line)}.rfg{stroke:var(--gold);stroke-width:2;filter:none}
#tap{background:#fbf8f3;border:1px solid var(--line);box-shadow:0 20px 50px rgba(36,33,43,.08);animation:none;color:var(--ink)}
#tap b{font-weight:400}
.burst{color:var(--gold);text-shadow:none}
.aff{color:var(--ink)}
.toggle span{background:transparent;border-color:var(--line)}.toggle span::after{background:var(--soft)}.toggle input:checked+span{background:var(--ink)}
/* tranquil (dark) */
#pond{background:radial-gradient(ellipse at 50% 20%,#2c2536,#18151e 70%);border:1px solid var(--line);box-shadow:none;border-radius:20px}
.bub{background:radial-gradient(circle at 32% 28%,rgba(255,250,240,.55) 0 6%,rgba(255,255,255,.06) 35%,var(--c) 90%);box-shadow:inset 0 0 14px rgba(255,255,255,.12),0 0 30px var(--c);border:1px solid rgba(255,255,255,.18);opacity:.75}
.rip{border-color:rgba(201,169,106,.6)}
.dot{background:var(--gold);box-shadow:0 0 6px var(--gold)}
/* child */
.nook{background:radial-gradient(ellipse at 50% 15%,#f6ead6,#ece2d2 50%,#e2d8c9);border:1px solid var(--line);border-radius:18px;box-shadow:none}
.curtain{display:none}
.frame{background:linear-gradient(145deg,#d9c39a,#b69565);border-radius:8px;padding:7px}
.photo{border-radius:3px;background:#f7f2ea;color:var(--soft)}
.h{color:var(--gold);text-shadow:none;font-size:10px}
.bubble{color:var(--ink)}
#talk button{background:var(--ink)}
/* script (dark) */
.dark .notif b,.dark .notif p{color:#efe8dc}
.nic{background:transparent;border:1px solid var(--gold);color:var(--gold)}
.scriptCard h3{color:#f3ecdf}.scriptCard p:not(.eyebrow){color:#d9d0c2}
.polaroid{background:#f5f1ea;box-shadow:0 10px 24px rgba(0,0,0,.4)}
.polaroid img{filter:saturate(.8)}.polaroid span{font:italic 500 14px var(--serif);color:var(--ink)}
/* buddy */
.bd{font-size:15px}.bd .av{width:66px;height:66px}
.bd.sel .av{box-shadow:0 0 0 2px var(--ivory),0 0 0 3px var(--gold)}
/* sky (dark) */
#skybox{background:linear-gradient(#26212f,#3a3040 60%,#4b3d3f);border:1px solid var(--line);box-shadow:none;border-radius:20px}
#skybox.clear{background:linear-gradient(#3b3550,#7a6a74 60%,#c9a678)}
.cl{background:radial-gradient(ellipse at 40% 30%,rgba(120,112,130,.85),rgba(70,64,80,.85));color:#e3dccf;box-shadow:0 10px 30px rgba(0,0,0,.35)}
#breath{background:transparent;border:1px solid rgba(201,169,106,.7);box-shadow:0 0 30px rgba(201,169,106,.25);color:#e6d7b8}
.phone{background:rgba(255,255,255,.08);color:#efe8dc;box-shadow:0 0 40px rgba(201,169,106,.3);border:1px solid var(--line)}
#done{color:#f3ecdf}
.dark .pill{color:#efe8dc}
.dark .guide p{color:#efe8dc}
.dark .back{color:#efe8dc}
.dark .top h2{color:#f3ecdf}
.dark .pillScript{color:#d8bd88;border-color:rgba(216,189,136,.5)}
.dark .note{color:var(--soft)}
/* library */
.seg{display:flex;gap:6px;border:1px solid var(--line);border-radius:999px;padding:3px;align-items:center}
.seg button{background:none;border:0;border-radius:999px;padding:7px 14px;font:400 12.5px var(--sans);color:var(--soft);cursor:pointer}
.seg button.on{background:var(--ink);color:var(--ivory)}
.seg.dark button.on{background:#efe8dc;color:#1d1924}.seg .cap{padding:0 8px 0 10px;font-size:9px}
.libList{width:100%;overflow-y:auto;display:flex;flex-direction:column;flex:1;scrollbar-width:none}
.libH{padding:14px 0 6px;border-bottom:1px solid var(--line)}
.libCard{display:flex;align-items:center;gap:14px;width:100%;padding:12px 0;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;cursor:pointer;color:var(--ink);text-decoration:none}
.libCard img{width:58px;height:58px;object-fit:cover;border-radius:4px}
.libCard>div{flex:1;display:flex;flex-direction:column;gap:3px}.libCard b{font:500 19px var(--serif)}.libCard small{font-size:11px;color:var(--soft);letter-spacing:.03em}
.tag{font:500 9.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(176,143,87,.5);border-radius:999px;padding:5px 10px;white-space:nowrap;display:flex;align-items:center;gap:5px}
.tag.lock{color:var(--ink);border-color:var(--line);letter-spacing:.06em;font-size:11px}
.tag svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.5}
.tag.watch{color:var(--soft);border-color:var(--line);letter-spacing:.08em}
/* player */
.pCover{width:250px;height:250px;object-fit:cover;border-radius:6px;margin-top:10px;box-shadow:0 30px 60px rgba(0,0,0,.45);filter:saturate(.8)}
.pCover.tc{background:linear-gradient(150deg,#2b2433,#4a3b3a);border:1px solid rgba(201,169,106,.4)}
.pTitle{font:500 32px var(--serif);text-align:center;margin-top:-6px}
.prog{width:100%;height:2px;background:var(--line);border-radius:2px}.prog i{display:block;height:100%;background:var(--gold);width:0}
.times{display:flex;justify-content:space-between;width:100%;font-size:11px;color:var(--soft);margin-top:-6px;letter-spacing:.06em}
.ctrls{display:flex;gap:30px;align-items:center}.ctrls button{background:none;border:0;color:#efe8dc;font:300 14px var(--sans);cursor:pointer}
.playBtn{width:68px;height:68px;border-radius:50%;border:1px solid rgba(201,169,106,.7)!important;font-size:18px!important;color:#e6d7b8!important}
/* quiz */
.qProg{width:100%;height:2px;background:var(--line)}.qProg i{display:block;height:100%;background:var(--ink);transition:width .6s}
.qText{font:400 32px/1.15 var(--serif);text-align:center;max-width:320px;margin:4px 0 18px;min-height:110px;display:flex;align-items:center}
.scale{display:flex;flex-direction:column;gap:10px;width:100%}
.scale button{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:#fbf8f3;font:400 15px var(--sans);color:var(--ink);cursor:pointer;transition:all .4s;text-align:left}
.scale i{width:14px;height:14px;border-radius:50%;border:1px solid var(--soft)}
.scale button.on{border-color:var(--ink)}.scale button.on i{background:var(--ink);border-color:var(--ink);box-shadow:inset 0 0 0 3px #fbf8f3}
#quiz .qText{margin-top:auto}#quiz .linkBtn{margin-top:6px}
/* result */
#result{overflow-y:auto;justify-content:flex-start}
.resTop{display:flex;gap:10px;align-items:center;width:100%;flex:none}
.bodyWrap.sm{width:140px;height:252px;flex:none;position:relative}
.rc{position:absolute;left:50%;width:12px;height:12px;margin:-6px;border-radius:50%;display:inline-block}
.rc.open{background:var(--c);box-shadow:0 0 12px 3px var(--c)}
.rc.partly{background:radial-gradient(var(--c) 35%,transparent 40%);border:1px solid var(--c)}
.rc.blocked{background:transparent;border:1px dashed #9c9388}
.legend{list-style:none;padding:0;flex:1;display:flex;flex-direction:column;gap:9px}
.legend li{display:flex;align-items:center;gap:10px;font:500 16px var(--serif)}
.legend .rc{position:static;margin:0;flex:none}
.legend em{margin-left:auto;font:400 9.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--soft);font-style:normal}
.note2{width:100%;border-left:1px solid var(--gold);padding:2px 0 2px 14px;margin-bottom:10px}
.note2 b{font:500 17px var(--serif)}.note2 p{font-size:13px;color:var(--soft);line-height:1.5}
#resNotes{width:100%;flex:none}
.recs{display:flex;gap:10px;width:100%;flex:none}
.recCard{flex:1;background:none;border:0;padding:0;text-align:left;display:flex;flex-direction:column;gap:4px;cursor:pointer;color:var(--ink)}
.recCard img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:4px}
.recCard b{font:500 15px var(--serif);line-height:1.1}.recCard small{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
/* sheet */
.sheet{position:fixed;inset:0;background:rgba(20,18,25,.45);opacity:0;pointer-events:none;transition:opacity .6s;z-index:50;display:flex;align-items:flex-end;justify-content:center}
.sheet.on{opacity:1;pointer-events:auto}
.sheetIn{width:100%;max-width:430px;background:var(--ivory);border-radius:22px 22px 0 0;padding:14px 26px 22px;display:flex;flex-direction:column;align-items:center;gap:8px;transform:translateY(30px);transition:transform .6s}
.sheet.on .sheetIn{transform:none}
.grab{width:40px;height:3px;border-radius:2px;background:var(--line);margin-bottom:8px}
.sheetIn img{width:150px;height:150px;object-fit:cover;border-radius:6px;box-shadow:0 14px 30px rgba(36,33,43,.18)}
.sheetIn h3{font:500 30px var(--serif)}
.perks{list-style:none;padding:0;width:100%;border-top:1px solid var(--line);margin-top:6px}
.perks li{padding:10px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--ink)}
.perks li::before{content:"—";color:var(--gold);margin-right:10px}
.buyBtn{width:100%;padding:16px;border:0;border-radius:999px;background:var(--ink);color:var(--ivory);font:500 12px var(--sans);letter-spacing:.24em;text-transform:uppercase;margin-top:10px;cursor:pointer}
/* inspiration */
#inspo .libList{flex:none;overflow:visible}#inspo{overflow-y:auto;justify-content:flex-start}
.tCover{width:58px;height:58px;border-radius:4px;display:flex;align-items:flex-end;padding:6px;flex:none}
.tCover span{font:italic 500 13px var(--serif);color:#f3ecdf;line-height:1}
.c0{background:linear-gradient(160deg,#2b2433,#463a4a)}.c1{background:linear-gradient(160deg,#6f6556,#a39684)}.c2{background:linear-gradient(160deg,#3f4a45,#6f7f74)}.c3{background:linear-gradient(160deg,#5b4636,#9a7a55)}
.books{display:flex;gap:12px;overflow-x:auto;width:calc(100% + 22px);margin-right:-22px;padding:2px 22px 4px 0;flex:none;scrollbar-width:none}
.book{flex:none;width:112px;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.bCover{width:112px;height:160px;border-radius:2px 5px 5px 2px;padding:12px 10px;display:flex;flex-direction:column;color:#f3ecdf;box-shadow:inset 3px 0 0 rgba(255,255,255,.12),0 8px 18px rgba(36,33,43,.18)}
.bCover small{font:500 7.5px var(--sans);letter-spacing:.22em;text-transform:uppercase;opacity:.8}
.bCover b{font:500 18px/1.05 var(--serif);margin-top:auto}.bCover em{font:400 10px var(--sans);letter-spacing:.14em;opacity:.7;margin-top:8px;font-style:normal;border-top:1px solid rgba(201,169,106,.6);padding-top:6px;width:100%}
.dl{background:none;border:1px solid var(--line);border-radius:999px;padding:6px 10px;font:500 9px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ink);cursor:pointer}
.dl.ok{color:var(--gold);border-color:var(--gold)}
.pd{font-size:9px;color:var(--soft);letter-spacing:.04em}
/* ---- v4: tranquil hub + games ---- */
#tranquil{justify-content:flex-start}
.tqLead{font:italic 400 16px var(--serif);color:#d9d0c2;text-align:center}
.tqGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%}
.tqTile{position:relative;height:190px;border-radius:16px;border:1px solid rgba(201,169,106,.35);background:#1d1a23;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:14px;text-align:left;cursor:pointer;color:#efe8dc}
.tqTile i{position:absolute;inset:0}
.tqTile b{position:relative;font:500 21px var(--serif);color:#f3ecdf}
.tqTile small{position:relative;font-size:10.5px;letter-spacing:.05em;color:#b9ae9c}
.tw1{background:radial-gradient(circle at 50% 42%,transparent 0 14px,rgba(201,169,106,.55) 15px,transparent 17px,transparent 30px,rgba(201,169,106,.35) 31px,transparent 33px,transparent 48px,rgba(201,169,106,.18) 49px,transparent 51px),radial-gradient(ellipse at 50% 20%,#2a2433,#141218 80%)}
.tw2{background:radial-gradient(circle at 30% 30%,#f3ead9 0 15px,transparent 16px),radial-gradient(circle at 70% 30%,#d9c08f 0 15px,transparent 16px),radial-gradient(circle at 30% 58%,#d9c08f 0 15px,transparent 16px),radial-gradient(circle at 70% 58%,#f3ead9 0 15px,transparent 16px),#26222c}
.tw3{background:linear-gradient(115deg,transparent 47%,#18151d 47% 50%,transparent 50%),linear-gradient(160deg,#e9dfcf,#cdbca2 60%,#b9a688);clip-path:inset(18% 16% 32% 16% round 6px);}
.tw3{inset:0}
.tw4{background:radial-gradient(circle at 40% 40%,rgba(214,190,140,.7),transparent 30%),radial-gradient(circle at 62% 50%,rgba(150,170,150,.55),transparent 32%),radial-gradient(circle at 48% 62%,rgba(160,150,190,.5),transparent 30%),#16141a;filter:blur(2px)}
.tqg{justify-content:flex-start}
.tqc{width:100%;flex:1;min-height:0;border-radius:20px;border:1px solid var(--line);touch-action:none;display:block;background:#16141a}
.tqHint{font:italic 400 15px var(--serif);color:#cfc5b4}
.tqFoot{display:flex;justify-content:space-between;align-items:center;width:100%;flex:none}
.tqNote{color:#cfc5b4;font-size:11px;letter-spacing:.08em;display:flex;align-items:center;gap:8px}
.toggle.sm{font-size:11px;color:#b9ae9c;gap:8px}
/* spiral button */
.spiralBtn{flex:none;align-self:stretch;background:transparent;border:1px solid rgba(176,143,87,.55);color:var(--ink);font:italic 400 17px var(--serif);border-radius:14px;padding:11px 14px;cursor:pointer;letter-spacing:.01em}
.spiralBtn::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gold);margin-right:10px;vertical-align:middle;opacity:.8}
/* spiral screen */
#spiral{background:radial-gradient(ellipse at 50% 25%,#2a2531,#141217 75%);justify-content:flex-start;padding-top:56px;gap:14px}
.spAv{width:96px;height:96px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(201,169,106,.5),0 0 40px rgba(201,169,106,.15);filter:saturate(.8);flex:none}
#spMsgs{display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center;min-height:250px;flex:none}
#spMsgs p{font:italic 400 21px/1.3 var(--serif);color:#efe8dc;opacity:0;transform:translateY(6px);transition:opacity 1.6s,transform 1.6s;max-width:310px}
#spMsgs p.in{opacity:1;transform:none}
.spBreath{position:relative;width:120px;height:120px;display:grid;place-items:center;opacity:0;transition:opacity 2s;flex:none}
.spBreath.in{opacity:1}
.spBreath i{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(201,169,106,.7);box-shadow:0 0 30px rgba(201,169,106,.2);animation:spb 10s ease-in-out infinite}
.spBreath span{font:italic 400 14px var(--serif);color:#d9c9a8;letter-spacing:.08em}
@keyframes spb{0%,100%{transform:scale(.62)}50%{transform:scale(1)}}
.spBtns{opacity:0;transition:opacity 2s}.spBtns.in{opacity:1}
#spiral .pill{color:#efe8dc;border-color:rgba(239,232,220,.3)}#spiral .pill.on{background:#efe8dc;color:#1d1924}
.spFoot{margin-top:auto;font-size:11px;color:#a69b8a;text-align:center;letter-spacing:.03em}
/* I Stay */
#child{overflow-y:auto;justify-content:flex-start}
#child>*{flex:none}
.bookH{align-self:flex-start;border-top:1px solid var(--line);padding-top:14px;width:100%;margin-top:4px}
.iStay{display:flex;gap:16px;width:100%;align-items:center;border:1px solid var(--line);border-radius:14px;padding:14px;background:#fbf8f3}
.isCover{width:96px;height:140px;flex:none;background:linear-gradient(160deg,#1f1c26,#2c2733);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:10px;box-shadow:0 8px 20px rgba(36,33,43,.25);border-radius:2px 4px 4px 2px}
.isCover b{font:500 24px var(--serif);color:#f3ecdf;letter-spacing:.06em}
.isRule{width:28px;height:1px;background:var(--gold)}
.isCover small{font:italic 400 10px/1.25 var(--serif);color:#d9c9a8;text-align:center}
.isTxt h3{font:500 24px var(--serif);color:var(--ink);margin:2px 0}
.isTxt p:not(.cap){font:italic 400 15px var(--serif);color:var(--soft);margin-bottom:8px}
.tqTile i{inset:0 0 58px 0}.tw3{inset:0 0 58px 0!important;clip-path:inset(16% 18% 10% 18% round 6px)}
/* ---- v5: vision board ---- */
#vision{overflow-y:auto;justify-content:flex-start}#vision>*{flex:none}
.vsGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
.vsCard{position:relative;height:124px;border:0;border-radius:14px;overflow:hidden;padding:0;cursor:pointer;background:#1d1924;text-align:left}
.vsCard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.75) brightness(.7)}
.vsCard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,18,25,0) 30%,rgba(20,18,25,.75))}
.vsCard span{position:absolute;left:12px;bottom:10px;z-index:1;display:flex;flex-direction:column}
.vsCard small{font:500 8.5px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#d8bd88}
.vsCard b{font:500 22px var(--serif);color:#f5f1ea}
.vsCard i{position:absolute;top:10px;right:10px;z-index:1;width:26px;height:26px;border-radius:50%;border:1px solid rgba(245,241,234,.6);color:#f5f1ea;font-style:normal;font-size:9px;display:grid;place-items:center}
.linkBtn.sm{font-size:11px}
.vbBoard{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}
.vbT{aspect-ratio:3/4;border-radius:8px;overflow:hidden;background:#fbf8f3;border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:box-shadow .3s}
.vbT img{width:100%;height:100%;object-fit:cover;filter:saturate(.85)}
.vbT.w{background:var(--ink)}.vbT.w span{font:italic 400 17px/1.2 var(--serif);color:#efe8dc;text-align:center;padding:8px}
.vbT.u{border:1px dashed rgba(176,143,87,.6)}.vbT.u em{font-style:normal;color:var(--gold);font-size:22px;font-weight:200}.vbT.u small{font-size:9.5px;letter-spacing:.08em;color:var(--soft)}
.vbT.sel{box-shadow:0 0 0 2px var(--ivory),0 0 0 3px var(--gold)}
.vbLbl{align-self:flex-start}
.vbPicks{display:flex;gap:8px;overflow-x:auto;width:calc(100% + 22px);margin-right:-22px;padding-right:22px;scrollbar-width:none}
.vbPicks button{flex:none;width:52px;height:52px;padding:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;cursor:pointer;background:none}
.vbPicks img{width:100%;height:100%;object-fit:cover}
.vbWord{display:flex;gap:8px;width:100%}
.vbWord input{flex:1;min-width:0;border:1px solid var(--line);background:#fbf8f3;border-radius:999px;padding:11px 16px;font:400 13px var(--sans);color:var(--ink);outline:none}
.vbWord button{border:0;border-radius:999px;background:var(--ink);color:var(--ivory);padding:0 18px;font:500 11px var(--sans);letter-spacing:.18em;text-transform:uppercase}
/* session */
#vsPlay{padding:0;justify-content:space-between;background:#141217}
.vsStage{position:absolute;inset:0}
.vsStage{background:#141217}.vsStage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;filter:saturate(.8)}
.vsStage img.on{opacity:1}
.vsShade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,18,25,.6),rgba(20,18,25,.05) 30%,rgba(20,18,25,.1) 55%,rgba(20,18,25,.85))}
.vsTop{position:relative;text-align:center;padding-top:56px}
.vsTop h2{font:500 38px var(--serif);color:#f5f1ea;letter-spacing:.04em}
.vsWord{position:relative;font:italic 400 30px var(--serif);color:#f5f1ea;opacity:0;text-shadow:0 2px 18px rgba(0,0,0,.5)}
.vsWord.in{opacity:1}
.vsFoot{position:relative;width:100%;padding:0 22px 26px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px}
.vsFoot .tqNote{color:#e6dccb;font-size:10px}
.vsExit{width:100%;background:transparent;border:1px solid rgba(245,241,234,.45);color:#f5f1ea;border-radius:999px;padding:13px;font:italic 400 17px var(--serif);cursor:pointer}
.vsSafe{width:100%;text-align:center;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:#a69d90}
/* subliminal studio */
#subs,#subDiy,#subPro{justify-content:flex-start;overflow-y:auto}#subs>*,#subDiy>*,#subPro>*{flex:none}
.subOpt{width:100%;text-align:left;border:1px solid var(--line);background:#fbf8f3;border-radius:16px;padding:20px 18px;cursor:pointer;color:var(--ink);display:flex;flex-direction:column;gap:6px}
.subOpt h3{font:500 25px var(--serif)}.subOpt p{font-size:13px;color:var(--soft);line-height:1.5}
.subOpt.dk{background:linear-gradient(160deg,#1f1c26,#2c2733);border-color:rgba(201,169,106,.4);color:#efe8dc}.subOpt.dk p{color:#b9ae9c}
.subRow{display:flex;align-items:baseline;gap:10px;margin-top:8px;border-top:1px solid var(--line);padding-top:12px}
.subOpt.dk .subRow{border-color:rgba(239,232,220,.14)}
.subRow b{font:500 22px var(--serif)}.subRow small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);flex:1}.subOpt.dk .subRow small{color:#a69d90}
.sLbl{align-self:flex-start;margin-top:4px}
.sTxt{width:100%;height:120px;resize:none;border:1px solid var(--line);border-radius:12px;background:#fbf8f3;padding:14px;font:italic 400 16px/1.45 var(--serif);color:var(--ink);outline:none}
.dark .sTxt{background:rgba(255,255,255,.04);color:#efe8dc}
.sOpts{justify-content:flex-start;width:100%}
.sAct{width:100%;align-items:center;margin-top:6px}.sAct .pill{flex:none;padding:13px 16px}
.buyBtn.sm{flex:1;margin:0;padding:14px}
.buyBtn.lt{background:#efe8dc;color:#1d1924}
.sNote{font-size:12px;max-width:none}
.proAv{width:76px;height:76px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(201,169,106,.5);filter:saturate(.8)}
.vsWord{text-shadow:0 0 24px rgba(0,0,0,.85),0 2px 6px rgba(0,0,0,.6);font-size:32px}
/* ---------- v6: Let it go ---------- */
.scr.lg{padding:0;background:#0d1420;overflow:hidden}
#lgC{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.lgUi{position:absolute;left:0;right:0;top:0;padding:calc(env(safe-area-inset-top) + 54px) 26px 0;display:flex;flex-direction:column;align-items:center;text-align:center;transition:opacity .7s}
.lg.going .lgUi{opacity:0;pointer-events:none}
.lgEye{font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:#d6ba80;font-weight:500}
.lgH{font-family:var(--serif);font-weight:500;font-size:31px;line-height:1.18;color:#f7f1e6;margin:12px 0 22px;max-width:330px;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.lgRow{display:flex;gap:10px;width:100%;max-width:340px}
#lgIn{flex:1;min-width:0;height:56px;border-radius:28px;border:1px solid rgba(214,186,128,.55);background:rgba(247,241,230,.12);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#f7f1e6;font:400 19px var(--sans);padding:0 22px;outline:none}
#lgIn::placeholder{color:rgba(247,241,230,.6)}
.lgAdd{width:56px;height:56px;border-radius:50%;border:none;background:#d6ba80;color:#1a1520;font-size:30px;font-weight:300;cursor:pointer}
.lgPriv{font-family:var(--serif);font-style:italic;font-size:18px;color:rgba(247,241,230,.8);margin-top:14px}
.lgDone{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom) + 62px);height:60px;padding:0 46px;border-radius:30px;border:1px solid #e9d5a6;background:linear-gradient(180deg,#e3c98f,#c4a466);color:#1a1520;font:500 21px var(--sans);letter-spacing:.04em;box-shadow:0 8px 26px rgba(0,0,0,.35);cursor:pointer}
.lgSkip{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom) + 18px);background:none;border:none;color:rgba(247,241,230,.7);font:400 17px var(--sans);text-decoration:underline;text-underline-offset:4px;padding:8px 16px;cursor:pointer}
.lgBye{position:absolute;left:0;right:0;top:44%;text-align:center;font-family:var(--serif);font-size:30px;color:#1d2a3a;opacity:0;transition:opacity .8s;padding:0 30px;pointer-events:none}
.lg.bye .lgBye{opacity:1}
/* ===== Tarot ===== */
#tarot{overflow-y:auto;justify-content:flex-start;--gold:#c9a86a}
.tarotTile .ic{stroke:#b8955a}
.tStep{display:none;width:100%;max-width:420px;flex-direction:column;align-items:center;gap:16px}.tStep.on{display:flex;animation:tIn .6s ease}
@keyframes tIn{from{opacity:0;transform:translateY(8px)}}
.tHi{font-family:var(--serif);font-size:30px;text-align:center;color:#f3ecdf;line-height:1.2;margin-top:6px}
.tSub{font-size:18px;color:#cfc5b6;text-align:center;line-height:1.45}
.tNote{font-size:16px;color:#a69d90;text-align:center}
.tOpt{width:100%;display:flex;align-items:center;gap:16px;padding:20px 18px;border-radius:22px;border:1px solid rgba(201,168,106,.45);background:rgba(255,255,255,.04);color:#f3ecdf;text-align:left;cursor:pointer}
.tOpt div{flex:1}.tOpt b{display:block;font-family:var(--serif);font-size:26px;font-weight:500}.tOpt small{font-size:17px;color:#cfc5b6}
.tOpt em{font-style:normal;font-family:var(--serif);font-size:24px;color:var(--gold)}
.tOptIc{display:flex;gap:3px;width:52px;justify-content:center}.tOptIc i{width:14px;height:22px;border:1.4px solid var(--gold);border-radius:3px}
.tPrice{font-family:var(--serif);font-size:48px;color:var(--gold)}
.tGold{width:100%;padding:18px;border-radius:999px;border:0;background:linear-gradient(135deg,#e2c891,#b8955a);color:#1d1924;font:500 20px var(--sans);letter-spacing:.04em;cursor:pointer}
.tLink{background:none;border:0;color:#cfc5b6;font-size:18px;text-decoration:underline;cursor:pointer}
#tQ{width:100%;border-radius:18px;border:1px solid rgba(201,168,106,.5);background:rgba(255,255,255,.06);color:#f3ecdf;font:400 20px/1.4 var(--sans);padding:16px;resize:none}
#tQ::placeholder{color:#8f877c}
.tQShow{font-family:var(--serif);font-style:italic;font-size:22px;color:#f3ecdf;text-align:center;line-height:1.3}
.tShuf{position:relative;height:0;width:120px}.tShuf.go{height:190px}
.tSh{position:absolute;left:0;top:0;width:120px;animation:tSh 1.1s ease-in-out calc(var(--i)*.08s) 2 alternate}
.tSh svg,.tBack svg,.tFront svg{width:100%;display:block;filter:drop-shadow(0 6px 14px rgba(0,0,0,.45))}
@keyframes tSh{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(calc((var(--i) - 3)*26px),-10px) rotate(calc((var(--i) - 3)*7deg))}100%{transform:translate(calc((3 - var(--i))*14px),6px) rotate(calc((3 - var(--i))*-4deg))}}
.tSpread{display:flex;justify-content:center;gap:12px;width:100%}
.tSlot{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1;max-width:180px;animation:tDeal .7s ease both}.tSlot:nth-child(2){animation-delay:.15s}.tSlot:nth-child(3){animation-delay:.3s}
@keyframes tDeal{from{opacity:0;transform:translateY(-40px) scale(.9)}}
.n1 .tSlot{max-width:190px}
.tCard{width:100%;aspect-ratio:100/140;perspective:900px;cursor:pointer}
.tIn{position:relative;width:100%;height:100%;transition:transform 1s cubic-bezier(.3,.7,.3,1);transform-style:preserve-3d}
.tCard.flip .tIn{transform:rotateY(180deg)}
.tBack,.tFront{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.tFront{transform:rotateY(180deg)}
.tName{position:absolute;left:8%;right:8%;bottom:7%;text-align:center;font-family:var(--serif);font-weight:600;color:#6e5530;font-size:clamp(12px,4.2vw,19px);line-height:1.05}
.n1 .tName{font-size:21px}
.tPos{font-family:var(--serif);font-size:20px;color:var(--gold)}
.tRev{font-size:15px;color:#cfc5b6;margin-top:-4px}
.tReadBtn{opacity:0;pointer-events:none;transition:opacity .6s}.tReadBtn.in{opacity:1;pointer-events:auto}
.tMini{display:flex;gap:10px;justify-content:center}.tMini div{width:84px}.tMini.n1 div{width:110px}.tMini svg{width:100%}
.tAns{font-family:var(--serif);font-size:52px;color:var(--gold);line-height:1}
.tLead{font-size:19px;color:#f3ecdf;text-align:center}
.tMean{width:100%;border:1px solid rgba(201,168,106,.35);border-radius:18px;padding:14px 16px;margin-top:10px;background:rgba(255,255,255,.04)}
.tMean .cap{font-size:15px;letter-spacing:.06em;color:var(--gold);text-transform:none;margin-bottom:4px}
.tMean p:last-child{font-size:19px;line-height:1.45;color:#efe8dc}
.tVoice{font-family:var(--serif);font-size:22px;line-height:1.45;color:#f3ecdf;margin-top:14px}
.tDisc{font-size:15px;color:#a69d90;text-align:center;margin-top:auto;padding-top:8px}
.tName{bottom:6%;font-size:clamp(14px,4.4vw,20px)}.n1 .tName{font-size:22px}
.tAns{align-self:center;text-align:center}
.tMini div p{font-family:var(--serif);font-size:16px;color:#e9dcc3;text-align:center;margin-top:4px;line-height:1.1}

/* Sayumm77 deck images */
.tBack,.tFront,.tSh{display:flex;align-items:center;justify-content:center}
.tSh{height:168px}
.tImg{width:100%;height:100%;object-fit:contain;display:block;border-radius:10px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.4));user-select:none}
.tRevImg{transform:rotate(180deg)}
.tMini div{aspect-ratio:100/140;display:flex;flex-direction:column;align-items:center}
.tMini div .tImg{height:auto;max-height:100%}

.tSlot .tRev{visibility:hidden}
.tSlot.shown .tRev{visibility:visible}

/* v10 build my own + flashing safety */
.vbBuild{width:100%;border-radius:18px;padding:16px 14px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--line)}
.vbBoards{display:flex;gap:6px;flex-wrap:wrap}.vbNone{color:var(--soft);font-size:11px}
.vbNameIn{border:1px solid var(--line);background:#fbf8f3;border-radius:999px;padding:11px 16px;font:400 13px var(--sans);color:var(--ink);outline:none;width:100%}
.vbUp{display:flex;align-items:center;gap:12px;border:1px dashed rgba(176,143,87,.7);border-radius:14px;padding:14px;cursor:pointer;background:#fbf8f3}
.vbUp em{font-style:normal;color:var(--gold);font-size:28px;font-weight:200;width:40px;height:40px;border-radius:50%;border:1px solid var(--gold);display:grid;place-items:center}
.vbUp span{display:flex;flex-direction:column}.vbUp b{font:500 18px var(--serif);color:var(--ink)}.vbUp small{font-size:10.5px;color:var(--soft)}
.vbT{position:relative;justify-content:flex-start}.vbT img{height:auto;flex:1;min-height:0}
.vbTools{position:absolute;top:4px;left:4px;right:4px;display:flex;justify-content:space-between}
.vbTools button{width:24px;height:24px;border-radius:50%;border:0;background:rgba(20,18,25,.6);color:#f5f1ea;font-size:12px;padding:0;cursor:pointer}
.vbCap{border:0;border-top:1px solid var(--line);width:100%;padding:6px;font:italic 400 12px var(--serif);text-align:center;background:#fbf8f3;color:var(--ink);outline:none}
.vbEmpty{font:italic 400 14px var(--serif);color:var(--soft);text-align:center}
.vbActs{display:flex;gap:8px}.vbActs .btn{flex:1}
.vbMsg{min-height:14px;text-align:center;font-size:11px;color:var(--gold)}
.vsWarn{position:absolute;inset:0;z-index:5;background:rgba(20,18,25,.92);display:none;align-items:center;justify-content:center;padding:28px}.vsWarn.on{display:flex}
.vsWarnBox{background:#f5f1ea;border-radius:20px;padding:26px 22px;text-align:center;display:flex;flex-direction:column;gap:12px;border:1px solid #b08f57}
.vsWarnBox h3{font:500 28px var(--serif);color:#1d1924}.vsWarnBox p{color:#3a3440;font-size:15px;line-height:1.5}
.vsSpeed{width:100%;display:flex;gap:6px}.vsSpeed button{flex:1;border:1px solid rgba(245,241,234,.4);background:rgba(20,18,25,.4);color:#f5f1ea;border-radius:999px;padding:9px;font:500 11px var(--sans);letter-spacing:.14em;text-transform:uppercase}
.vsSpeed button.on{background:#d8bd88;color:#141217;border-color:#d8bd88}
.vsStop{background:#f5f1ea!important;color:#141217!important;font:500 20px var(--sans)!important;letter-spacing:.2em;padding:18px!important}
.vbActs .btn,.vsWarnBox .btn{border:0;border-radius:999px;background:var(--ink,#1d1924);color:var(--ivory,#f5f1ea);padding:14px;font:500 12px var(--sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.vbActs .btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.vsWarnBox .linkBtn{background:none;border:0;color:#6b6270;font-size:12px;cursor:pointer}
.vsWarnBox .btn{background:#1d1924!important;color:#f5f1ea!important;opacity:1}

#vbCol{overflow-y:auto}.vcWrap{padding:4px 14px 0}#vcCv{width:100%;height:auto;display:block;border-radius:6px;box-shadow:0 18px 40px rgba(78,68,102,.28)}
.vcActs{display:flex;flex-wrap:wrap;gap:8px;padding:14px;justify-content:center}.vcActs .btn{flex:1 1 40%}
.vbEx{display:block;width:100%;margin:4px 0 10px;padding:10px;border:1px dashed #c9a96b;border-radius:14px;background:rgba(255,250,240,.6);font-family:var(--serif);font-style:italic;font-size:16px;color:var(--ink)}
.vcActs .btn{border:0;border-radius:999px;background:var(--ink,#1d1924);color:var(--ivory,#f5f1ea);padding:14px 10px;font:500 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.vcActs .btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}.vcActs #vcPlay{flex-basis:100%}

.vsAff{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:40px 34px;background:#f5f1ea;z-index:3;pointer-events:none}
.vsAff.on{display:flex}.vsAff p{font:italic 500 44px/1.18 var(--serif);color:#24212b;text-align:center;max-width:16ch;overflow-wrap:break-word}
.vsAff p::before,.vsAff p::after{content:"✦";display:block;font:normal 18px var(--sans);color:#b08f57;margin:18px 0}
.vsMode{margin-bottom:6px}.vbAffs{resize:vertical;min-height:74px;font-family:var(--serif);font-size:17px}
.vbAff{font-style:italic}
.vsAff{background:radial-gradient(circle at 50% 45%,#2c2733,#141217)}.vsAff p{color:#f5f1ea}.vsAff p::before,.vsAff p::after{color:#d8bd88}
#vsPlay .vsFoot,#vsPlay .vsTop{z-index:4}

.vcLy{justify-content:center;margin:0 0 10px}
textarea.vbAff{resize:none;overflow:hidden;font-family:var(--serif);line-height:1.25;min-height:28px}
.vbT:focus-within{grid-column:1/-1;aspect-ratio:auto}.vbT:focus-within img{height:170px;flex:none}.vbT:focus-within textarea.vbAff{font-size:16px;padding:10px;text-align:left}

.vsAff{background:linear-gradient(180deg,transparent 25%,rgba(10,8,14,.55) 50%,transparent 75%)!important;z-index:2}
.vsAff p{text-shadow:0 2px 24px rgba(0,0,0,.85),0 1px 4px rgba(0,0,0,.7);font-size:46px}
.vsAff p::before,.vsAff p::after{display:none}

/* ---------- v13: Sayumm AI chat ---------- */
#chat{align-items:stretch;overflow:hidden}
#chat .top{flex:none}
.chatGear{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink);font-size:16px;cursor:pointer;line-height:1}
.chatHead{display:flex;gap:12px;align-items:center;width:100%;padding:12px 14px;border-radius:14px;flex:none}
.chatHead .msg{font-size:15px;line-height:1.35;margin-top:2px}
.chatModes{gap:14px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;flex:none}
.chatModes::-webkit-scrollbar{display:none}
.chatModes button{white-space:nowrap;flex:none}
.chatModes button[data-cm="held"].on{color:var(--gold);border-color:var(--gold)}
.chatLog{flex:1;min-height:0;width:100%;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:4px 2px 8px;-webkit-overflow-scrolling:touch}
.chatRow{display:flex;width:100%}
.chatRow.me{justify-content:flex-end}
.chatRow.bot{justify-content:flex-start;gap:8px;align-items:flex-end}
.chatRow.bot img{width:28px;height:28px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 1px var(--line);filter:saturate(.8)}
.chatBub{max-width:82%;padding:11px 14px;border-radius:16px;font:italic 400 16px/1.4 var(--serif);color:var(--ink);background:#fffdf9;border:1px solid var(--line)}
.chatRow.me .chatBub{background:var(--ink);color:var(--ivory);border-color:var(--ink);border-radius:16px 16px 4px 16px;font-style:normal;font-family:var(--sans);font-size:14px;font-weight:400}
.chatRow.bot .chatBub{border-radius:16px 16px 16px 4px}
.chatBub.typing{opacity:.55}
#chatForm{display:flex;width:100%;border-radius:999px;padding:5px;flex:none;align-items:center}
#chatForm input{flex:1;border:0;background:none;padding:8px 14px;font:300 15px var(--sans);color:var(--ink);outline:none;min-width:0}
#chatForm input::placeholder{color:var(--soft)}
#chatForm button{border:0;width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--ivory);font-size:16px;cursor:pointer;flex:none}
#buddyChat{width:100%;margin-top:4px;border:0;border-radius:999px;background:var(--ink);color:var(--ivory);padding:14px;font:500 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
#buddyChat:active{opacity:.85}

.peekBtn{flex:none;align-self:stretch;background:transparent;border:1px solid rgba(176,143,87,.55);color:var(--ink);font:italic 400 15px var(--serif);border-radius:14px;padding:10px 12px;cursor:pointer;letter-spacing:.01em}
.peekBtn::before{content:"✦ ";color:var(--gold);opacity:.85}
.peekBtn[hidden]{display:none!important}
.chatBub.peek{border-color:rgba(176,143,87,.55);color:var(--ink)}
.chatPeekMeta{display:block;font:500 10px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:6px;font-style:normal}
/* Share with Sayumm */
.shWrap{margin:14px 18px;padding:20px 18px;border-radius:24px}
.shTabs{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 16px}.shTabs button{flex:1 1 40%;padding:10px 4px;border-radius:999px;border:1px solid rgba(180,140,150,.35);background:rgba(255,255,255,.5);font:inherit;font-size:13px;color:inherit}
.shTabs button.on{background:linear-gradient(135deg,#f6d9df,#e9d3f0);border-color:transparent;box-shadow:0 4px 14px rgba(200,140,170,.25)}
#shForm label{display:block;font-size:13px;margin:10px 0;opacity:.9}#shForm label i{opacity:.6}
#shForm input:not([type=checkbox]),#shForm textarea{display:block;width:100%;box-sizing:border-box;margin-top:5px;padding:11px 13px;border-radius:14px;border:1px solid rgba(180,140,150,.3);background:rgba(255,255,255,.65);font:inherit;resize:vertical}
.shStars{font-size:30px;letter-spacing:4px;text-align:center;cursor:pointer}.shStars span{color:#e5d6da}.shStars span.on{color:#d9a86c;text-shadow:0 0 10px rgba(217,168,108,.5)}
.shOk{display:flex!important;gap:8px;align-items:center}.shThanks{text-align:center;padding:20px 0}


/* Video Corner */
.vcList{display:flex;flex-direction:column;gap:16px;width:100%;padding:0 2px 8px}
.vcCard{border:1px solid var(--line);border-radius:16px;background:#fbf8f3;overflow:hidden;padding:0 0 12px}
.vcFrame{position:relative;width:100%;padding-top:56.25%;background:#1a1520}
.vcFrame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vcMeta{padding:12px 14px 0}
.vcMeta b{display:block;font:italic 400 16px/1.35 var(--serif);color:var(--ink);margin-bottom:4px}
.vcMeta small{display:block;font:400 12px/1.4 var(--sans);color:var(--soft)}
.vcCredit{margin:8px 14px 0;font:italic 400 12px/1.4 var(--serif);color:var(--soft);opacity:.9}
.iStayMore{margin-top:12px;padding:14px;border-radius:14px;width:100%}
.iStayMore[hidden]{display:none!important}
.iStayMore h3{margin:.2em 0 .4em;font:italic 400 18px var(--serif)}
.iStayMore p{margin:0 0 .6em;font:300 14px/1.45 var(--sans);color:var(--ink)}