:root{--p:#5B21B6;--s:#7C3AED;--a:#EC4899;--ink:#0F172A;--muted:#64748B;--line:#E2E8F0;--bg:#F8FAFC;--card:#fff;--shell:#0f0a1c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Poppins,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#ece9f4;color:var(--ink);overflow-x:hidden}button,input,textarea,select{font:inherit}.demoShell{min-height:100vh;display:grid;grid-template-columns:290px minmax(0,1fr)}.demoNav{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,#160d2b,#0d0917);color:white;padding:22px 16px;overflow:auto;z-index:90}.demoBrand{display:flex;align-items:center;gap:12px;padding:6px 8px 18px;border-bottom:1px solid rgba(255,255,255,.09);margin-bottom:14px}.demoBrand img{width:105px;filter:brightness(0) invert(1)}.demoBrand div{display:flex;flex-direction:column;gap:2px}.demoBrand b{font-size:13px}.demoBrand span{font-size:10px;color:#c4b5fd}.demoNav nav{display:grid;gap:7px}.demoNav nav button{display:flex;align-items:center;gap:11px;width:100%;border:1px solid transparent;background:transparent;color:#cbd5e1;border-radius:16px;padding:11px 12px;text-align:left;cursor:pointer;transition:.2s}.demoNav nav button>span{font-size:20px;width:28px;text-align:center}.demoNav nav button div{display:flex;flex-direction:column}.demoNav nav b{font-size:12px;color:#f8fafc}.demoNav nav small{font-size:9px;color:#94a3b8;margin-top:2px}.demoNav nav button:hover,.demoNav nav button.active{background:linear-gradient(135deg,rgba(124,58,237,.25),rgba(236,72,153,.12));border-color:rgba(196,181,253,.2)}.demoNav nav button.active{box-shadow:inset 3px 0 #c084fc}.demoTip{margin-top:18px;padding:12px;border:1px solid rgba(255,255,255,.09);border-radius:14px;color:#a8a1b5;font-size:9px;line-height:1.5}.stageWrap{min-width:0;min-height:100vh}.demoTopbar{position:sticky;top:0;z-index:80;height:64px;background:rgba(248,250,252,.9);backdrop-filter:blur(16px);border-bottom:1px solid #e2e8f0;display:flex;align-items:center;gap:12px;padding:0 18px}.navToggle{display:none;border:0;background:white;width:40px;height:40px;border-radius:12px;box-shadow:0 3px 12px rgba(15,23,42,.08)}.sceneTitle{display:flex;flex-direction:column;min-width:0}.sceneTitle span{font-size:8px;letter-spacing:.14em;color:#7c3aed;font-weight:900}.sceneTitle b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topPills{margin-left:auto;display:flex;gap:8px;align-items:center}.liveDot{font-size:9px;color:#16a34a;font-weight:900;background:#ecfdf5;padding:7px 10px;border-radius:999px}.topPills button{border:1px solid #e2e8f0;background:white;border-radius:999px;padding:7px 11px;font-size:10px;font-weight:800;color:#475569}.scene{display:none;min-height:calc(100vh - 64px)}.scene.activeScene{display:block}.app{max-width:820px;margin:auto;min-height:calc(100vh - 64px);background:var(--bg);box-shadow:0 0 60px rgba(15,23,42,.09)}.header{position:sticky;top:64px;z-index:50;height:66px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.9);backdrop-filter:blur(18px);border-bottom:1px solid rgba(226,232,240,.8)}.logo{height:28px;width:auto}.actions{display:flex;gap:8px}.iconbtn{position:relative;width:42px;height:42px;border:0;border-radius:50%;background:#fff;box-shadow:0 3px 14px rgba(15,23,42,.07);display:grid;place-items:center;color:#334155}.badge{position:absolute;right:-1px;top:-2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--a);color:#fff;font-size:10px;font-weight:800;display:grid;place-items:center}.avatarBtn{background:linear-gradient(135deg,#7c3aed,#ec4899);color:white;font-size:11px;font-weight:900}.hero{position:relative;height:310px;overflow:hidden;background:#261144;color:#fff}.heroVisual{position:absolute;inset:0;background:radial-gradient(circle at 75% 28%,rgba(244,114,182,.7),transparent 20%),radial-gradient(circle at 25% 65%,rgba(167,139,250,.75),transparent 24%),linear-gradient(135deg,#1e1238,#5b21b6 55%,#9d174d)}.heroVisual:before,.heroVisual:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.15);border-radius:50%}.heroVisual:before{width:330px;height:330px;right:-100px;top:-130px}.heroVisual:after{width:260px;height:260px;left:-90px;bottom:-120px}.cross{position:absolute;right:13%;top:14%;font-size:88px;color:rgba(255,255,255,.12);transform:rotate(12deg)}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,23,42,.05),rgba(15,23,42,.72))}.heroContent{position:absolute;z-index:2;left:20px;right:20px;bottom:24px}.eyebrow{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.2);border-radius:999px;font-size:12px;backdrop-filter:blur(12px)}.hero h1{font-size:clamp(30px,7vw,44px);line-height:1.05;margin:10px 0 8px}.heroMeta{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;opacity:.92}.content{padding:14px 14px 90px}.card{background:var(--card);border:1px solid #eef2f7;border-radius:24px;box-shadow:0 9px 32px rgba(15,23,42,.055)}.state{padding:16px;margin-top:-26px;position:relative;z-index:5;display:flex;gap:13px;align-items:center}.pixel{width:58px;height:58px;object-fit:contain}.state b{display:block;font-size:14px}.state p{margin:3px 0 0;color:var(--muted);font-size:12px;line-height:1.45}.countdown{font-weight:800;color:var(--s);font-size:13px;margin-top:5px}.questionCard{margin-top:14px;padding:17px;background:linear-gradient(135deg,#faf5ff,#fff1f7);border-color:#eadcf8}.questionEy{font-size:9px;font-weight:900;color:#7c3aed;letter-spacing:.12em}.questionCard h3{margin:4px 0 3px;font-size:17px}.questionCard>p{margin:0 0 11px;color:#64748b;font-size:11px}.promptBtn{display:block;width:100%;border:1px solid #e9d5ff;background:white;border-radius:16px;padding:12px 13px;text-align:left;color:#3b0764;cursor:pointer;margin-top:7px;font-weight:800;font-size:11px}.promptBtn span{display:block;color:#7c3aed;font-size:9px;margin-top:5px}.sectionHead{display:flex;align-items:center;justify-content:space-between;margin:22px 2px 10px}.sectionHead h2{font-size:18px;margin:0}.sectionHead span,.sectionHead button{font-size:11px;color:var(--s);border:0;background:none;font-weight:800}.stories{display:flex;gap:12px;overflow:auto;padding:2px 2px 6px;scrollbar-width:none}.story{border:0;background:none;padding:0;width:70px;flex:0 0 70px;text-align:center;cursor:pointer}.ring{width:64px;height:64px;padding:3px;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--a));margin:auto;display:grid;place-items:center}.story small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:5px;font-size:10px}.addRing{background:#ede9fe;color:var(--p);font-size:24px;border:2px dashed #c4b5fd}.storyAvatar{width:100%;height:100%;border-radius:50%;border:3px solid white;display:grid;place-items:center;color:white;font-weight:900;font-size:12px}.g1{background:linear-gradient(135deg,#f472b6,#7c3aed)}.g2{background:linear-gradient(135deg,#0ea5e9,#4f46e5)}.g3{background:linear-gradient(135deg,#16a34a,#14b8a6)}.g4{background:linear-gradient(135deg,#f59e0b,#ef4444)}.composer{padding:15px;margin-top:14px}.composeTop{display:flex;gap:10px;align-items:center}.avatarCircle{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:white;font-size:11px;font-weight:900;flex:none}.avatarCircle.me{background:linear-gradient(135deg,#5b21b6,#ec4899)}.avatarCircle.staff{background:linear-gradient(135deg,#0f766e,#2563eb)}.fakeInput{flex:1;height:44px;border:0;background:#f8fafc;border-radius:22px;padding:0 15px;text-align:left;color:#64748b;cursor:pointer}.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:12px;padding-top:12px;border-top:1px solid #f1f5f9}.quick button{border:0;background:white;padding:7px 3px;border-radius:12px;font-size:10px;color:#475569;cursor:pointer}.quick i{display:block;font-style:normal;font-size:18px;margin-bottom:5px}.pink{color:#db2777}.purple{color:#7c3aed}.blue{color:#2563eb}.amber{color:#d97706}.experienceGrid{display:grid;grid-template-columns:1fr;gap:10px;margin-top:14px}.experience{position:relative;padding:18px;overflow:hidden}.experience .ico{font-size:30px}.experience h3{margin:7px 0 4px;font-size:17px}.experience p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}.experience:before{content:"";position:absolute;width:130px;height:130px;border-radius:50%;right:-55px;top:-65px;background:linear-gradient(135deg,#ede9fe,#fce7f3);opacity:.8}.miniStats{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:12px}.miniStats div{background:#f8fafc;border-radius:13px;padding:9px 4px;text-align:center;font-size:10px}.miniStats b{display:block;font-size:14px;color:var(--p)}.storyProgress{position:relative;overflow:hidden;margin-top:14px;padding:18px;background:linear-gradient(135deg,#faf5ff,#fff1f2);border-color:#ede9fe}.storyProgress:after{content:"";position:absolute;width:150px;height:150px;border-radius:50%;right:-65px;top:-80px;background:linear-gradient(135deg,#ddd6fe,#fbcfe8);opacity:.48}.storyProgressTop{position:relative;z-index:1;display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.storyProgress .ey{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#7c3aed;font-weight:800}.storyProgress h3{margin:4px 0 2px;font-size:19px}.storyProgress p{margin:0;color:#64748b;font-size:11px}.storyLevelBadge{min-width:66px;height:58px;padding:0 10px;border-radius:18px;background:linear-gradient(135deg,var(--p),var(--a));color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 9px 22px rgba(124,58,237,.22)}.storyLevelBadge small{font-size:8px;text-transform:uppercase;letter-spacing:.08em;opacity:.8}.storyLevelBadge b{font-size:20px}.storyBar{height:10px;border-radius:999px;background:#ede9fe;overflow:hidden;margin-top:14px}.storyBar i{display:block;height:100%;background:linear-gradient(90deg,var(--p),var(--a));border-radius:inherit}.storyNext{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:#7c3aed;font-weight:700;margin-top:7px}.storyMetrics{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:13px}.storyMetrics div{background:rgba(255,255,255,.76);border:1px solid #f3e8ff;border-radius:12px;padding:7px 2px;text-align:center;font-size:8px;color:#64748b}.storyMetrics b{display:block;font-size:13px;color:#5b21b6}.feed{display:grid;gap:13px}.post{overflow:hidden}.postHeader{display:flex;align-items:center;padding:14px 14px 10px;gap:10px}.postAvatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:white;font-size:11px;font-weight:900}.postWho{flex:1}.postWho b{font-size:13px}.postWho span{display:block;color:#94a3b8;font-size:10px;margin-top:1px}.postText{padding:0 15px 13px;font-size:13px;line-height:1.55}.postMedia{height:310px;background:linear-gradient(135deg,#ddd6fe,#fce7f3);display:grid;place-items:center;position:relative;overflow:hidden}.postMedia:before{content:"";width:190px;height:190px;border-radius:50%;background:rgba(255,255,255,.5);filter:blur(2px);position:absolute;left:10%;top:17%}.postMedia .mediaIcon{position:relative;font-size:74px;filter:drop-shadow(0 10px 15px rgba(76,29,149,.18))}.postMedia.video{background:linear-gradient(135deg,#1e293b,#5b21b6)}.postMedia.video .mediaIcon{color:white}.special{margin:0 14px 13px;border-radius:19px;padding:22px;background:linear-gradient(135deg,#5b21b6,#ec4899);color:white}.special .cat{font-size:9px;letter-spacing:.12em;opacity:.78;font-weight:900}.special .txt{font-size:20px;font-weight:800;line-height:1.3;margin-top:6px}.postStats{display:flex;justify-content:space-between;gap:10px;padding:10px 14px;color:#64748b;font-size:10px}.reactionSummary{display:flex;gap:4px}.reactionChip{display:inline-flex;align-items:center;gap:2px;background:#f8fafc;border:1px solid #eef2f7;border-radius:999px;padding:3px 6px;font-size:10px}.postActions{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #f1f5f9}.postActions button{border:0;background:white;padding:12px;color:#475569;font-size:11px;font-weight:700;cursor:pointer}.postActions button.active{color:#7c3aed}.loadMore{width:100%;margin-top:12px;border:1px solid #e2e8f0;background:white;border-radius:15px;padding:12px;font-size:11px;font-weight:800;color:#5b21b6}.invitePage,.familyPage{min-height:calc(100vh - 64px);display:grid;place-items:center;padding:34px 18px;background:radial-gradient(circle at 10% 10%,#f5d0fe,transparent 28%),radial-gradient(circle at 90% 10%,#ddd6fe,transparent 25%),linear-gradient(180deg,#fbfaff,#f7f3fb);position:relative;overflow:hidden}.inviteGlow{position:absolute;width:460px;height:460px;border-radius:50%;background:rgba(124,58,237,.12);filter:blur(20px);right:-170px;bottom:-220px}.inviteCard,.familyCard{position:relative;z-index:2;width:min(620px,100%);background:rgba(255,255,255,.92);border:1px solid #ede9fe;box-shadow:0 30px 80px rgba(91,33,182,.13);border-radius:34px;padding:38px}.inviteSeal,.familyLock{width:70px;height:70px;border-radius:50%;display:grid;place-items:center;margin-bottom:22px;background:linear-gradient(135deg,#5b21b6,#ec4899);color:white;font-size:28px;box-shadow:0 14px 30px rgba(91,33,182,.25)}.inviteCard .kicker,.familyCard>span{font-size:9px;letter-spacing:.15em;font-weight:900;color:#7c3aed}.inviteCard h1,.familyCard h1{font-size:clamp(34px,7vw,58px);line-height:1.02;margin:12px 0}.inviteCard>p,.familyCard>p{font-size:14px;line-height:1.7;color:#64748b}.inviteMeta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0}.inviteMeta div{background:#faf8ff;border:1px solid #ede9fe;border-radius:17px;padding:13px}.inviteMeta small{display:block;font-size:8px;color:#7c3aed;font-weight:900;letter-spacing:.12em}.inviteMeta b{font-size:12px}.primaryWide{display:block;width:100%;border:0;border-radius:16px;padding:14px 16px;background:linear-gradient(135deg,#5b21b6,#7c3aed 60%,#ec4899);color:white;font-weight:900;cursor:pointer;box-shadow:0 10px 25px rgba(91,33,182,.2)}.registeredBox,.publicFormMini{margin-top:14px;border-radius:16px;padding:13px 14px}.registeredBox{background:#ecfdf5;color:#166534}.registeredBox b,.registeredBox span{display:block}.registeredBox span{font-size:10px;margin-top:2px}.publicFormMini{border:1px dashed #c4b5fd;background:#faf5ff}.publicFormMini span{font-size:8px;font-weight:900;color:#7c3aed}.publicFormMini b{display:block;margin-top:4px;font-size:12px}.publicFormMini p{margin:3px 0 0;color:#64748b;font-size:10px}.lockedScene{min-height:calc(100vh - 64px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;background:linear-gradient(180deg,#0f172a,#1e1238);color:white;position:relative;overflow:hidden}.lockedAura{position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,#7c3aed88,transparent 65%);top:10%;left:50%;transform:translateX(-50%)}.lockedScene>*:not(.lockedAura){position:relative}.lockedScene img{width:120px}.lockedScene>span,.lettersIntro>span,.reflectionPage>span{font-size:9px;letter-spacing:.18em;font-weight:900;color:#c4b5fd}.lockedScene h1,.lettersIntro h1,.reflectionPage h1{font-size:clamp(38px,8vw,68px);line-height:1.02;margin:12px 0}.lockedScene p,.lettersIntro p{max-width:560px;color:#cbd5e1;line-height:1.7;font-size:14px}.lockBadge{margin-top:20px;padding:11px 14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);border-radius:999px;font-size:10px}.lockedScene small{margin-top:16px;color:#94a3b8;max-width:520px;line-height:1.5}.lettersExperience{min-height:calc(100vh - 64px);display:grid;place-items:center;padding:30px;background:radial-gradient(circle at 50% 25%,#fbcfe8,transparent 28%),linear-gradient(180deg,#fff7fb,#f8f5ff)}.lettersIntro,.letterViewer{width:min(650px,100%);text-align:center}.heartPulse{font-size:66px;animation:pulse 1.7s infinite}@keyframes pulse{50%{transform:scale(1.08)}}.lettersIntro>span{color:#9d174d}.lettersIntro h1{color:#3b0a33}.lettersIntro p{color:#7a576f;margin-inline:auto}.lettersIntro button,.letterViewer button{border:0;border-radius:999px;background:#3b0a33;color:white;padding:13px 20px;font-weight:900;cursor:pointer}.letterViewer{display:none;background:white;border-radius:32px;padding:30px;box-shadow:0 24px 70px rgba(131,24,67,.12);border:1px solid #fce7f3}.letterViewer.show{display:block}.letterSteps{display:flex;gap:5px;justify-content:center;margin-bottom:20px}.letterSteps i{width:36px;height:4px;border-radius:99px;background:#fce7f3}.letterSteps i.on{background:#ec4899}.letterFrom{font-size:11px;font-weight:900;color:#9d174d;margin-bottom:10px}.paperLetter{background:#fffbf1;border:1px solid #f5e8ca;border-radius:20px;padding:25px;text-align:left;line-height:1.9;color:#4b4234;font-family:Georgia,serif;font-size:17px;box-shadow:inset 0 0 40px rgba(217,119,6,.04)}.letterMedia{margin:14px 0}.audioDemo{background:#faf5ff;border:1px solid #ede9fe;border-radius:18px;padding:14px;display:flex;gap:12px;align-items:center;text-align:left}.audioDemo button{width:42px;height:42px;padding:0}.audioDemo b{display:block;font-size:11px}.audioDemo small{color:#64748b;font-size:9px}.reflectionPage{min-height:calc(100vh - 64px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;background:linear-gradient(180deg,#f8fafc,#f5f3ff);text-align:center}.reflectionIcon{font-size:60px}.reflectionPage>span{color:#7c3aed}.reflectionPage h1{font-size:clamp(36px,8vw,60px)}.reflectionPage blockquote{max-width:620px;margin:6px 0 18px;padding:20px;border-left:4px solid #c4b5fd;background:white;border-radius:0 18px 18px 0;color:#4c1d95;font-family:Georgia,serif;font-size:18px;line-height:1.5}.reflectionPage>p{color:#64748b}.reflectionPage textarea{width:min(620px,100%);min-height:160px;border:1px solid #ddd6fe;border-radius:20px;padding:17px;resize:vertical;background:white;margin:10px 0 12px}.reflectionPage .primaryWide{max-width:620px}.reflectionSaved{display:none;margin-top:12px;color:#15803d;font-size:11px;font-weight:900}.reflectionSaved.show{display:block}.bookDemo{min-height:calc(100vh - 64px);padding:26px max(20px,calc((100% - 900px)/2));background:#eee7dc;color:#352d25;transition:.3s}.bookToolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.8);border-radius:18px;padding:12px 14px;margin-bottom:14px;position:sticky;top:78px;z-index:12;backdrop-filter:blur(12px)}.bookToolbar>div:first-child{display:flex;flex-direction:column}.bookToolbar span{font-size:8px;font-weight:900;letter-spacing:.12em}.bookToolbar b{font-size:12px}.themeChips{display:flex;gap:5px;flex-wrap:wrap}.themeChips button{border:1px solid #ded7cd;background:white;border-radius:999px;padding:7px 9px;font-size:9px;font-weight:800;cursor:pointer}.themeChips button.active{background:#4a3e32;color:white}.bookCover,.bookChapter{background:#fffaf0;border:1px solid #ded4c6;border-radius:28px;padding:clamp(26px,6vw,62px);margin-bottom:16px;box-shadow:0 20px 50px rgba(68,51,35,.08)}.bookCover{min-height:500px;display:flex;flex-direction:column;justify-content:flex-end;background:radial-gradient(circle at 78% 16%,#f3dfab,transparent 28%),linear-gradient(145deg,#fffaf0,#efe4d1)}.bookMark,.bookChapter>span{font-size:8px;letter-spacing:.18em;font-weight:900;opacity:.7}.bookCover h1{font-family:Georgia,serif;font-size:clamp(40px,8vw,70px);line-height:1;margin:12px 0}.bookCover p{max-width:600px;line-height:1.7}.bookDates{font-weight:900;margin-top:18px}.bookChapter h2{font-family:Georgia,serif;font-size:34px;margin:8px 0}.bookChapter p{line-height:1.7;color:#6b5c4f}.photoGrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:8px;height:240px;margin-top:20px}.ph{border-radius:16px;background:linear-gradient(135deg,#d8c6ff,#fbcfe8)}.ph.b{background:linear-gradient(135deg,#fde68a,#fb7185)}.ph.c{background:linear-gradient(135deg,#bfdbfe,#86efac)}.personal{border-color:#f0c8dc;background:#fff7fb}.quoteCard{margin-top:20px;padding:22px;border-radius:18px;background:#fff;border:1px solid #fbcfe8;font-family:Georgia,serif;font-size:18px}.quoteCard small{display:block;margin-top:10px;font-family:inherit;color:#9d174d}.bookDemo.theme-path{background:#dfe7dc;color:#2f3b2e}.bookDemo.theme-path .bookCover,.bookDemo.theme-path .bookChapter{background:#f3f1e7;border-color:#c6d2bf}.bookDemo.theme-journal{background:#ece7dd;color:#35302a}.bookDemo.theme-journal .bookCover,.bookDemo.theme-journal .bookChapter{background:repeating-linear-gradient(#fffdf7 0,#fffdf7 32px,#ece7dd 33px);border-color:#d6cbbd}.bookDemo.theme-premium{background:#0c0b10;color:#f8fafc}.bookDemo.theme-premium .bookCover,.bookDemo.theme-premium .bookChapter{background:linear-gradient(145deg,#17141f,#0e0d12);border-color:#3f354c;color:#fff}.bookDemo.theme-premium .bookChapter p{color:#cbd5e1}.bookDemo.theme-premium .bookToolbar{background:rgba(23,20,31,.85);border-color:#3f354c}.bookDemo.theme-premium .themeChips button{border-color:#3f354c;background:#0f0e14;color:#e5e7eb}.bookDemo.theme-premium .themeChips button.active{background:#d4af6a;color:#1f1810}.staffControl{max-width:820px;margin:auto;padding:16px;background:#0f172a;color:white}.staffTop{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.staffTop small{font-size:8px;letter-spacing:.15em;color:#c4b5fd;font-weight:900}.staffTop h3{margin:4px 0 3px;font-size:20px}.staffTop p{margin:0;color:#94a3b8;font-size:10px}.netBadge{font-size:9px;background:#052e23;color:#86efac;padding:7px 9px;border-radius:999px}.phaseRail{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:14px}.phaseRail button{border:1px solid #334155;background:#172033;color:#cbd5e1;border-radius:13px;padding:9px 4px;font-size:17px;cursor:pointer}.phaseRail button small{display:block;font-size:7px;margin-top:4px}.phaseRail button.active{background:linear-gradient(135deg,#5b21b6,#7c3aed);border-color:#8b5cf6;color:white}.staffStats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}.staffStats div{background:#172033;border-radius:13px;padding:9px;text-align:center}.staffStats b{display:block;font-size:17px}.staffStats span{font-size:7px;color:#94a3b8}.staffActions{display:flex;gap:7px;margin-top:10px}.staffActions button{border:1px solid #334155;background:#172033;color:#fff;border-radius:12px;padding:9px 11px;font-size:9px;font-weight:800;cursor:pointer}.staffHero{height:240px}.familyPage{background:radial-gradient(circle at 20% 15%,#fce7f3,transparent 25%),radial-gradient(circle at 85% 20%,#ede9fe,transparent 25%),#fafafa}.familyCard{width:min(650px,100%)}.familyLock{background:linear-gradient(135deg,#831843,#5b21b6)}.familyParticipant{display:flex;align-items:center;gap:10px;background:#faf5ff;border:1px solid #ede9fe;border-radius:18px;padding:11px;margin:18px 0}.familyParticipant>div:nth-child(2){display:flex;flex-direction:column;flex:1}.familyParticipant b{font-size:12px}.familyParticipant small{font-size:9px;color:#64748b}.familyParticipant>span{font-size:9px;color:#7c3aed}.familyCard label,.formGrid label{display:grid;gap:5px;font-size:9px;font-weight:800;color:#475569;margin-top:10px}.familyCard input,.familyCard select,.familyCard textarea,.formGrid input{border:1px solid #e2e8f0;border-radius:13px;padding:11px;background:white}.familyCard textarea{min-height:130px;resize:vertical}.familyUploads{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:11px 0}.familyUploads button{border:1px solid #ede9fe;background:#faf5ff;border-radius:12px;padding:10px 4px;color:#6d28d9;font-size:9px;font-weight:800}.familySuccess{display:none;margin-top:12px;background:#ecfdf5;color:#166534;border-radius:13px;padding:10px;font-size:10px;font-weight:800}.familySuccess.show{display:block}.privacyCopy{display:block;margin-top:12px;color:#94a3b8;line-height:1.5}.modal{position:fixed;z-index:200;inset:0;background:rgba(15,23,42,.52);display:none;align-items:flex-end;justify-content:center;padding:12px}.modal.show{display:flex}.sheet{width:min(640px,100%);max-height:88vh;overflow:auto;background:white;border-radius:26px;padding:18px;box-shadow:0 25px 80px rgba(15,23,42,.28)}.sheetHead{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.sheetHead h3{margin:0}.sheetHead button{border:0;background:#f1f5f9;width:36px;height:36px;border-radius:50%;font-size:20px}.sheet>textarea{width:100%;min-height:130px;border:1px solid #e2e8f0;border-radius:16px;padding:13px;resize:vertical}.mediaRow,.categoryRow{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:10px 0}.mediaRow button,.categoryRow button{border:1px solid #e2e8f0;background:white;border-radius:12px;padding:9px 4px;font-size:9px}.commentsList{display:grid;gap:9px;max-height:50vh;overflow:auto}.comment{display:flex;gap:9px}.commentAvatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:white;font-size:9px;font-weight:900;background:linear-gradient(135deg,#7c3aed,#ec4899)}.comment>div{background:#f8fafc;border-radius:14px;padding:9px 11px;flex:1}.comment b{display:block;font-size:10px}.comment p{margin:2px 0 0;font-size:10px;color:#475569}.commentForm{display:flex;gap:7px;margin-top:12px}.commentForm input{flex:1;border:1px solid #e2e8f0;border-radius:13px;padding:10px}.commentForm button{border:0;background:#5b21b6;color:white;border-radius:13px;padding:0 13px;font-size:10px;font-weight:800}.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.registerResult{display:none;margin-top:12px;padding:12px;background:#f0fdf4;border-radius:15px}.registerResult.show{display:grid;gap:7px}.registerResult b{color:#166534}.registerResult button{border:1px solid #bbf7d0;background:white;border-radius:11px;padding:9px;text-align:left;font-size:9px;font-weight:800}.storyViewer{position:fixed;z-index:250;inset:0;background:#07050a;color:white;display:none}.storyViewer.show{display:block}.storyBars{position:absolute;top:13px;left:13px;right:13px;display:flex;gap:4px}.storyBars i{height:3px;flex:1;background:rgba(255,255,255,.25);border-radius:99px}.storyBars i:first-child{background:white}.storyClose{position:absolute;right:14px;top:28px;border:0;background:rgba(255,255,255,.12);color:white;width:38px;height:38px;border-radius:50%;font-size:20px}.storyCenter{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;background:radial-gradient(circle at 50% 40%,#7c3aed88,transparent 28%),linear-gradient(180deg,#1e1238,#0f0717)}.storyBigAvatar{width:110px;height:110px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#f472b6,#7c3aed);font-size:30px;font-weight:900;border:4px solid white}.storyCenter h2{font-size:30px;margin:14px 0 3px}.storyCenter p{font-size:18px;color:#e2e8f0}.storyTap{position:absolute;top:18%;bottom:10%;width:38%;border:0;background:transparent;color:rgba(255,255,255,.5);font-size:50px}.storyTap.left{left:0;text-align:left;padding-left:20px}.storyTap.right{right:0;text-align:right;padding-right:20px}.toast{position:fixed;z-index:300;left:50%;bottom:24px;transform:translate(-50%,30px);opacity:0;background:#0f172a;color:white;border-radius:999px;padding:10px 15px;font-size:10px;font-weight:800;transition:.25s;pointer-events:none}.toast.show{transform:translate(-50%,0);opacity:1}
@media(max-width:900px){.demoShell{display:block}.demoNav{position:fixed;inset:0 auto 0 0;width:min(86vw,320px);transform:translateX(-102%);transition:.25s;box-shadow:20px 0 60px rgba(15,23,42,.3)}.demoNav.open{transform:translateX(0)}.navToggle{display:grid;place-items:center}.demoTopbar{padding:0 10px;height:58px}.scene{min-height:calc(100vh - 58px)}.header{top:58px}.bookToolbar{top:70px}.topPills .liveDot{display:none}.sceneTitle b{max-width:46vw}.app{box-shadow:none}.invitePage,.familyPage,.lockedScene,.lettersExperience,.reflectionPage{min-height:calc(100vh - 58px)}}
@media(max-width:620px){.hero{height:280px}.content{padding-inline:10px}.card{border-radius:20px}.state{margin-top:-20px}.storyMetrics{grid-template-columns:repeat(5,minmax(0,1fr))}.storyMetrics div{font-size:7px}.miniStats{grid-template-columns:repeat(4,minmax(0,1fr))}.inviteCard,.familyCard{padding:25px 18px;border-radius:26px}.inviteMeta{grid-template-columns:1fr}.formGrid{grid-template-columns:1fr}.familyUploads{grid-template-columns:repeat(2,1fr)}.bookDemo{padding:10px}.bookToolbar{align-items:flex-start;flex-direction:column}.photoGrid{height:180px}.phaseRail button small{display:none}.staffStats{grid-template-columns:repeat(2,1fr)}.staffActions{flex-direction:column}.mediaRow,.categoryRow{grid-template-columns:repeat(2,1fr)}.demoTopbar{gap:8px}.topPills button{font-size:0;width:38px;height:38px;padding:0}.topPills button:after{content:"↻";font-size:16px}.sceneTitle b{font-size:11px}.sceneTitle span{font-size:7px}.storyNext{font-size:8px}.paperLetter{font-size:15px;padding:18px}.bookCover,.bookChapter{padding:28px 20px}.bookCover{min-height:420px}.bookChapter h2{font-size:29px}.themeChips{width:100%;overflow:auto;flex-wrap:nowrap}.themeChips button{flex:none}.staffTop{flex-direction:column}.netBadge{align-self:flex-start}}

/* V2.1 · Fotos conectadas al feed */
.postActions{grid-template-columns:repeat(3,1fr)}.postActions button:last-child:only-child{grid-column:auto}.postMedia.photoVisual{position:relative;overflow:hidden}.photoVisual:after,.photoTile:after,.photoViewerMedia:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 25%,rgba(255,255,255,.5),transparent 18%),linear-gradient(180deg,transparent 45%,rgba(15,23,42,.25));pointer-events:none}.photoVisual.p1,.photoTile.p1,.photoViewerMedia.p1{background:linear-gradient(145deg,#9dd6b8,#3d7b6a 50%,#233e55)}.photoVisual.p2,.photoTile.p2,.photoViewerMedia.p2{background:linear-gradient(145deg,#f6d1bd,#d68c76 50%,#6a6678)}.photoVisual.p3,.photoTile.p3,.photoViewerMedia.p3{background:linear-gradient(145deg,#b5d7ff,#6c8ed1 48%,#472f72)}.photoVisual.p4,.photoTile.p4,.photoViewerMedia.p4{background:linear-gradient(145deg,#d4c2ff,#a46fe8 48%,#7d315f)}.photoVisual.p5,.photoTile.p5,.photoViewerMedia.p5{background:linear-gradient(145deg,#ffe0a3,#e8985a 48%,#6b3a5f)}.photoVisual.p6,.photoTile.p6,.photoViewerMedia.p6{background:linear-gradient(145deg,#b9f3e4,#52a6a2 48%,#2b4e75)}.photoVisual .mediaIcon{position:relative;z-index:2}.photoGlow{position:absolute;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.22);filter:blur(2px);right:16%;top:18%}.photosHero{min-height:205px;padding:42px 22px 26px;background:radial-gradient(circle at 80% 20%,rgba(244,114,182,.45),transparent 25%),linear-gradient(135deg,#1e1238,#5b21b6 60%,#9d174d);color:white;display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.photosHero span{font-size:9px;letter-spacing:.16em;font-weight:900;opacity:.75}.photosHero h1{font-size:42px;margin:4px 0}.photosHero p{margin:0;max-width:480px;font-size:12px;line-height:1.55;color:#ede9fe}.photosCount{width:78px;height:78px;border-radius:24px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(12px);display:grid;place-items:center;align-content:center}.photosCount b{font-size:27px}.photosCount small{font-size:8px;letter-spacing:.15em}.photosContent{padding-top:12px}.feedPhotoTabs{display:grid;grid-template-columns:1fr 1fr;background:#ede9fe;padding:4px;border-radius:15px;margin-bottom:12px}.feedPhotoTabs button{border:0;background:transparent;padding:10px;border-radius:12px;color:#6d28d9;font-size:10px;font-weight:900;cursor:pointer}.feedPhotoTabs button.active{background:white;box-shadow:0 3px 10px rgba(91,33,182,.08)}.photosInfo{padding:12px 14px;display:flex;gap:10px;align-items:center;margin-bottom:12px}.photosInfo>div{font-size:22px}.photosInfo p{margin:0;color:#64748b;font-size:10px;line-height:1.5}.photosInfo b{color:#0f172a}.photoGallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}.photoTile{position:relative;aspect-ratio:1;border:0;padding:0;overflow:hidden;cursor:pointer;min-width:0}.photoTileIcon{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);font-size:30px;filter:drop-shadow(0 2px 7px rgba(15,23,42,.25))}.photoTileMeta{position:absolute;z-index:3;left:7px;right:7px;bottom:7px;display:flex;justify-content:space-between;color:white;font-size:9px;text-shadow:0 1px 5px rgba(15,23,42,.5);opacity:0;transition:.2s}.photoTile:hover .photoTileMeta{opacity:1}.photoViewer{position:fixed;z-index:400;inset:0;background:#050509;display:none;grid-template-columns:minmax(0,1fr) 390px;color:#fff}.photoViewer.show{display:grid}.photoViewerMedia{position:relative;min-width:0;display:grid;place-items:center;overflow:hidden}.photoViewerMedia>span{position:relative;z-index:2;font-size:90px;filter:drop-shadow(0 8px 25px rgba(0,0,0,.25))}.photoSide{background:#fff;color:#0f172a;display:flex;flex-direction:column;min-height:0;padding:20px}.photoAuthor{display:flex;align-items:center;gap:10px;padding-bottom:14px;border-bottom:1px solid #eef2f7}.photoAuthor>div:last-child{display:flex;flex-direction:column}.photoAuthor b{font-size:12px}.photoAuthor span{font-size:9px;color:#64748b}.photoCaption{font-size:12px;line-height:1.55;margin:14px 0}.photoEngagement{display:flex;align-items:center;justify-content:space-between;border-block:1px solid #eef2f7;padding:10px 0}.photoEngagement button{border:0;background:transparent;color:#475569;font-size:10px;font-weight:900;cursor:pointer}.photoEngagement button.active{color:#7c3aed}.photoEngagement span{font-size:9px;color:#64748b}.photoComments{flex:1;min-height:0;overflow:auto;display:grid;align-content:start;gap:8px;padding:12px 0}.photoCommentForm{display:flex;gap:7px;padding-top:10px;border-top:1px solid #eef2f7}.photoCommentForm input{min-width:0;flex:1;border:1px solid #e2e8f0;border-radius:13px;padding:10px}.photoCommentForm button{border:0;background:#5b21b6;color:white;border-radius:13px;padding:0 12px;font-size:9px;font-weight:900}.photoViewerClose{position:absolute;z-index:5;left:16px;top:16px;width:42px;height:42px;border:0;border-radius:50%;background:rgba(0,0,0,.42);color:white;font-size:26px;cursor:pointer}.photoNav{position:absolute;z-index:5;top:50%;transform:translateY(-50%);width:45px;height:58px;border:0;border-radius:16px;background:rgba(0,0,0,.3);color:white;font-size:37px;cursor:pointer}.photoNav.prev{left:14px}.photoNav.next{right:404px}.emptyComments{padding:16px;text-align:center;color:#94a3b8;font-size:10px}
@media(max-width:900px){.photoViewer{grid-template-columns:1fr;grid-template-rows:minmax(45vh,1fr) minmax(280px,46vh)}.photoSide{padding:14px}.photoNav.next{right:14px}.photoViewerMedia>span{font-size:64px}.photoViewerClose{top:12px;left:12px}.photoGallery{grid-template-columns:repeat(3,minmax(0,1fr))}.photoTileMeta{opacity:1}.photosHero{padding-top:30px}.photosHero h1{font-size:34px}}
@media(max-width:620px){.postActions{grid-template-columns:repeat(3,minmax(0,1fr))}.postActions button{font-size:9px}.photosHero{min-height:185px;padding:28px 14px 20px}.photosHero p{font-size:10px}.photosCount{width:66px;height:66px;border-radius:20px}.photosCount b{font-size:23px}.photoGallery{gap:2px}.photoViewer{grid-template-rows:minmax(43vh,1fr) minmax(320px,49vh)}.photoNav{width:38px;height:50px;font-size:30px}.photoComments .comment>div{padding:7px 9px}}

/* V2.2 · Fotos tipo red social + etiquetado */
.photoProfileNav{display:flex;gap:4px;overflow:auto;background:#fff;border-bottom:1px solid #e2e8f0;padding:0 14px;scrollbar-width:none}.photoProfileNav::-webkit-scrollbar{display:none}.photoProfileNav button{position:relative;flex:none;border:0;background:transparent;color:#64748b;padding:15px 13px 14px;font-size:10px;font-weight:800;cursor:pointer}.photoProfileNav button.active{color:#6d28d9}.photoProfileNav button.active:after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:3px;border-radius:99px;background:linear-gradient(90deg,#5b21b6,#ec4899)}
.photosFacebookCard{padding:18px;margin-top:2px}.photosFbHead{display:flex;align-items:center;justify-content:space-between;gap:12px}.photosFbHead h1{font-size:24px;margin:0}.photosFbHead>div{display:flex;gap:8px}.addPhotosDemo,.dotsDemo{border:0;border-radius:12px;background:#f1f5f9;color:#475569;padding:10px 12px;font-size:9px;font-weight:900;cursor:pointer}.addPhotosDemo{background:#f3e8ff;color:#6d28d9}.dotsDemo{width:40px;padding:0;font-size:14px}.photoFbTabs{display:flex;align-items:center;gap:4px;border-bottom:1px solid #e2e8f0;margin-top:12px;overflow:auto;scrollbar-width:none}.photoFbTabs::-webkit-scrollbar{display:none}.photoFbTabs>button{position:relative;flex:none;border:0;background:transparent;color:#64748b;padding:12px 11px;font-size:9px;font-weight:900;cursor:pointer}.photoFbTabs>button.active{color:#6d28d9}.photoFbTabs>button.active:after{content:"";position:absolute;left:6px;right:6px;bottom:-1px;height:3px;background:#7c3aed;border-radius:99px}.photoSearch{margin-left:auto;position:relative;min-width:150px}.photoSearch span{position:absolute;left:11px;top:7px;color:#64748b}.photoSearch input{width:100%;height:34px;border:1px solid #e2e8f0;border-radius:999px;background:#f8fafc;padding:0 12px 0 29px;font-size:9px;outline:none}.photoFbSummary{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 2px 9px;color:#64748b;font-size:9px}.photoFbSummary b{color:#0f172a}.demoAlbums{display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.demoAlbums.show{display:grid}.demoAlbums button{min-height:145px;border:1px solid #e2e8f0;border-radius:16px;background:#fff;padding:16px;text-align:left;cursor:pointer}.demoAlbums span{display:grid;place-items:center;width:58px;height:58px;border-radius:16px;background:linear-gradient(135deg,#ede9fe,#fce7f3);font-size:29px;margin-bottom:10px}.demoAlbums b{display:block;font-size:11px}.demoAlbums small{display:block;color:#64748b;font-size:8px;margin-top:2px}.photoTagsLine{font-size:9px;color:#7c3aed;font-weight:800;padding:0 0 10px;min-height:10px}.photoTagsLine:empty{display:none}.photoEngagement{gap:5px}.photoEngagement>button{flex:none}.photoEngagement>span{margin-left:auto}.tagPeopleSearch{width:100%;height:42px;border:1px solid #e2e8f0;border-radius:13px;padding:0 12px;margin-bottom:8px}.tagPeopleList{display:grid;gap:2px;max-height:48vh;overflow:auto}.tagPerson{display:flex;align-items:center;gap:10px;padding:9px;border-radius:13px;cursor:pointer}.tagPerson:hover{background:#f8fafc}.tagPerson .commentAvatar{flex:none}.tagPerson span{flex:1;font-size:10px;font-weight:800}.tagPerson input{width:18px;height:18px;accent-color:#7c3aed}.photoTagBadge{position:absolute;z-index:4;right:7px;top:7px;min-width:27px;height:27px;border-radius:999px;background:#0f172ab8;color:#fff;display:flex;align-items:center;justify-content:center;padding:0 7px;font-size:8px;font-weight:900}.postTaggedDemo{display:block;color:#7c3aed!important;font-size:8px!important;margin-top:2px!important}
@media(max-width:620px){.photoProfileNav{padding-inline:5px}.photoProfileNav button{font-size:8px;padding:12px 9px}.photosFacebookCard{padding:12px}.photosFbHead h1{font-size:21px}.addPhotosDemo{font-size:0;width:40px;height:40px;padding:0}.addPhotosDemo:after{content:"＋";font-size:18px}.photoFbTabs>button{font-size:8px;padding-inline:8px}.photoSearch{min-width:36px;margin-left:2px}.photoSearch input{width:36px;padding:0;color:transparent}.photoSearch input:focus{width:150px;padding-left:29px;color:#0f172a}.demoAlbums{grid-template-columns:1fr 1fr;gap:7px}.demoAlbums button{min-height:125px;padding:12px}.photoEngagement{flex-wrap:wrap}.photoEngagement>span{width:100%;margin-left:0;text-align:right}}
/* V2.3 · Etiquetado visual por posición */
.photoViewerMedia.tagging{cursor:crosshair}.demoTagHint{position:absolute;z-index:8;left:50%;bottom:18px;transform:translateX(-50%) translateY(8px);background:#fff;color:#6d28d9;padding:9px 13px;border-radius:999px;font-size:9px;font-weight:900;opacity:0;pointer-events:none;transition:.18s;white-space:nowrap;box-shadow:0 10px 24px #0005}.demoTagHint.show{opacity:1;transform:translateX(-50%) translateY(0)}.demoTagLayer{position:absolute;z-index:7;inset:0;pointer-events:none}.demoTagPin{position:absolute;transform:translate(-50%,-50%);width:23px;height:23px;border:3px solid #fff;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#ec4899);box-shadow:0 3px 12px #0008;pointer-events:auto;cursor:pointer}.demoTagPin span{position:absolute;left:50%;top:27px;transform:translateX(-50%);background:#111827e8;color:white;padding:4px 7px;border-radius:7px;font-size:8px;font-weight:900;white-space:nowrap;opacity:0}.demoTagPin:hover span,.demoTagPin.open span{opacity:1}.photoTagsLine .manageDemoTags{border:0;background:#f5f3ff;color:#6d28d9;padding:5px 8px;border-radius:999px;font-size:8px;font-weight:900;margin-left:6px;cursor:pointer}
#tagPeopleModal{z-index:520}