/* ===== v38 ===== */
/* the reaction faces */
.ei.ei38,.ei:has(> .rx38){background:none!important;box-shadow:none!important}
.rx38{width:100%;height:100%;display:block;object-fit:contain;filter:drop-shadow(0 1px 2px rgba(27,42,68,.18))}
.rxpick .r .ei,.rx .r .ei{width:34px;height:34px}
.rxpick .r:hover .rx38{transform:translateY(-3px) scale(1.12);transition:transform .15s}
/* picture backgrounds: the words above, the picture at the bottom */
.scn-pic{padding:0}
.scn-pic .scn-txt{padding:22px 22px 6px;min-height:0}
.scn-pici{display:flex;justify-content:center;line-height:0;margin-top:auto}
.scn-pici img{width:min(56%,230px);height:auto;display:block;-webkit-mask-image:radial-gradient(ellipse 72% 82% at 50% 60%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 72% 82% at 50% 60%,#000 62%,transparent 100%)}
.bgb.bgp38{background-size:cover!important;background-position:center!important}

/* ---------- the Premium button in the header ---------- */
.pbtn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;padding:7px 14px 7px 10px;font:inherit;font-weight:800;font-size:.85rem;color:#fff;cursor:pointer;
 background:linear-gradient(135deg,#2a63e8 0%,#6a44e6 60%,#a855f7 100%);box-shadow:0 6px 16px rgba(106,68,230,.35),inset 0 1px 0 rgba(255,255,255,.35)}
.pbtn svg{width:17px;height:17px;color:#ffd65c;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}
.pbtn::after{content:"";position:absolute;top:-20%;bottom:-20%;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-18deg);animation:pb38 3.6s ease-in-out infinite}
@keyframes pb38{0%,70%{left:-60%}100%{left:130%}}
.pbtn.on{background:linear-gradient(135deg,#F2A900,#ff8a3d);box-shadow:0 6px 16px rgba(242,169,0,.35)}.pbtn.on svg{color:#fff}
@media (prefers-reduced-motion:reduce){.pbtn::after{animation:none;display:none}}

/* ---------- the plan cards that slide ---------- */
.h38{display:none!important}
.pcs38{margin:6px -6px 4px}
.pcrow{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:26px 10% 12px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.pcrow::-webkit-scrollbar{display:none}
.pc38{flex:0 0 80%;max-width:300px;scroll-snap-align:center;position:relative;background:#fff;border-radius:20px;padding:44px 0 14px;text-align:center;color:#1b2a44;cursor:pointer;
 box-shadow:0 8px 24px rgba(27,42,68,.12);border:2px solid transparent;transition:transform .2s,border-color .2s,box-shadow .2s}
.pc38.on{border-color:var(--pc);transform:translateY(-4px);box-shadow:0 14px 30px rgba(27,42,68,.18)}
.pc-free{--pc:#2BB39B;--pc2:#5fe3c1}.pc-monthly{--pc:#2a63e8;--pc2:#6cb4ff}.pc-yearly{--pc:#6a44e6;--pc2:#b39bff}
.pcr{position:absolute;top:-2px;left:50%;transform:translateX(-50%);width:62%;height:46px;border-radius:0 0 999px 999px;background:linear-gradient(180deg,var(--pc2),var(--pc));display:grid;place-items:center;box-shadow:0 6px 12px rgba(27,42,68,.15)}
.pcr::before,.pcr::after{content:"";position:absolute;top:0;width:10px;height:10px;background:var(--pc);filter:brightness(.7)}.pcr::before{left:-10px;border-radius:10px 0 0 0}.pcr::after{right:-10px;border-radius:0 10px 0 0}
.pcr b{color:#fff;font-size:1.05rem;letter-spacing:.02em;display:flex;flex-direction:column;align-items:center;line-height:1.1}
.pcr b .tr38{color:rgba(255,255,255,.85)}
.pcp{padding:14px 12px 8px}.pcp>b{display:block;font-size:2.3rem;line-height:1;font-weight:900;letter-spacing:-.02em}
.pcp small{display:block;font-weight:700;margin-top:4px}.pcp em{display:block;font-style:normal;font-size:.75rem;color:#6b7a92;margin-top:4px}
.pc38 ul{list-style:none;margin:8px 0 12px;padding:0;text-align:left}
.pc38 li{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap;padding:8px 16px;font-size:.85rem;line-height:1.3}.pc38 li:nth-child(odd){background:#f4f6fa}
.pc38 li svg{flex:none;width:16px;height:16px;color:var(--pc);margin-top:1px}.pc38 li span{flex:1}.pc38 li .tr38{flex-basis:100%;padding-left:24px}
.pcb{margin:0 16px;width:calc(100% - 32px);border:0;border-radius:999px;padding:10px;font:inherit;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--pc2),var(--pc));cursor:pointer;display:flex;flex-direction:column;align-items:center}
.pcb .tr38{color:rgba(255,255,255,.85)}
.pc-free .pcb{background:#eef7f4;color:#13866f}.pc-free .pcb .tr38{color:#13866f}
.pcdots{display:flex;justify-content:center;gap:8px;margin:2px 0 6px}.pcdots button{width:8px;height:8px;border-radius:99px;border:0;background:#d3dae6;padding:0;cursor:pointer;transition:width .2s,background .2s}
.pcdots button.on{width:22px;background:linear-gradient(90deg,#2a63e8,#6a44e6)}
.pw38 .pw-cta{background:linear-gradient(135deg,#2a63e8,#6a44e6 60%,#a855f7)!important;box-shadow:0 10px 22px rgba(106,68,230,.35)!important;border-radius:999px!important}
.tr38{display:block;font-size:.78em;font-weight:500;opacity:.8;margin-top:2px;line-height:1.3}
.ctatr38{text-align:center;margin:4px 0 0}

/* ---------- saved notes ---------- */
.ntlist{display:flex;flex-direction:column;gap:10px;margin-top:12px}.ntit small{color:#6b7a92}.ntit p{margin:6px 0 0;line-height:1.5}
.learn .tr38{font-size:.85em}.lchips .chip .tr38{font-size:.72em}

/* ---------- avatars ---------- */
.avg38{margin:10px 0 14px;text-align:center}.avg38 b{display:block}.avg38 small{display:block;margin-bottom:8px}
.avgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.avb{border:3px solid transparent;border-radius:50%;padding:0;background:none;cursor:pointer;aspect-ratio:1;overflow:hidden;transition:transform .15s}
.avb img{width:100%;height:100%;display:block;border-radius:50%}.avb:hover{transform:scale(1.06)}.avb.on{border-color:#2a63e8;box-shadow:0 0 0 3px rgba(42,99,232,.2)}
.learn .lhead{flex-wrap:wrap}.learn .lhead h3,.learn .lhead p{flex:1 1 100%}
.pw38 .pw-body{padding-top:4px}