:root{--publication-ratio:4/5;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#3d2a33;background:#fff;font-synthesis:none;--accent:#db0063;--line:#f1e7ec;--muted:#977b88}*{box-sizing:border-box}body{margin:0}a{color:var(--accent);text-decoration:none}button,input,textarea,select{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.55}#app{max-width:1280px;margin:auto;display:grid;grid-template-columns:250px minmax(0,650px) 300px;min-height:100vh}aside{position:sticky;top:0;height:100vh;padding:36px 28px;display:flex;flex-direction:column;border-right:1px solid var(--line)}.brand{font-size:38px;letter-spacing:-2px;font-weight:800;color:var(--accent);margin-bottom:46px}.brand span{font-size:15px;vertical-align:top;letter-spacing:0}nav{display:grid;gap:12px}.nav-link{color:#6e535f;padding:13px 10px;font-weight:600;font-size:17px;border-radius:10px}.nav-link:hover,.nav-link.selected{color:var(--accent);background:#feedf5}.sidebar-bottom{margin-top:auto;display:grid;gap:16px}.sidebar-bottom>small{margin-top:20px;font-size:11px;line-height:1.8}main{border-right:1px solid var(--line);min-width:0;padding-bottom:60px}header{padding:25px 28px;border-bottom:1px solid var(--line)}h1{font-size:23px;margin:0 0 7px;letter-spacing:-.6px}h2{font-size:20px;letter-spacing:-.4px}p{line-height:1.65}header p{margin:0;color:var(--muted);font-size:14px}small{color:var(--muted);font-size:13px;line-height:1.6}.welcome{margin:26px;padding:32px;border-radius:16px;background:linear-gradient(120deg,#ffedf5,#fcdcea);position:relative;overflow:hidden}.welcome:after{content:'♡';position:absolute;right:-18px;top:5px;font-size:200px;color:#f5bcd6;transform:rotate(-18deg);pointer-events:none}.welcome h2{position:relative;z-index:1;font-size:30px;max-width:330px;margin:14px 0}.welcome p{position:relative;z-index:1;max-width:280px;color:#805568;font-size:14px}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:800;color:#a92661}.pill{display:inline-block;font-size:11px;background:#ffffffb0;padding:8px 12px;border-radius:20px;color:#845269}.section-title{display:flex;align-items:center;justify-content:space-between;padding:0 28px;margin:22px 0 15px}.section-title h2{margin:0}.section-title span{font-size:12px;color:var(--muted)}.cards{padding:0 26px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.profile-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;color:inherit;transition:box-shadow .2s}.profile-card:hover{box-shadow:0 6px 25px #3d2a3314}.cover{height:110px;width:100%;object-fit:cover}.placeholder{background:linear-gradient(135deg,#f2cfdf,#eae2f3,#e9bcd0);display:flex;align-items:center;justify-content:center;color:#ffffff;font-size:34px}.avatar{width:62px;height:62px;object-fit:cover;border-radius:50%;border:3px solid white;flex-shrink:0}.card-body{padding:0 17px 18px}.card-body>.avatar{margin-top:-30px;position:relative}.card-body h2{font-size:17px;margin:8px 0 0}.card-body p{font-size:13px;color:#8b717d;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px}.verified{font-size:12px;background:var(--accent);color:white;border-radius:50%;padding:1px 4px;vertical-align:middle}.card-price{display:flex;justify-content:space-between;font-size:12px;color:var(--accent);border-top:1px solid var(--line);padding-top:14px;gap:6px}.card-price strong{color:#3d2a33}.card-price small{font-size:10px}.right-rail{padding:30px 24px}.info-card{background:#fbf6f8;border:1px solid var(--line);border-radius:14px;padding:24px}.info-card h2{font-size:25px;line-height:1.3}.info-card p{font-size:13px;color:var(--muted)}.info-card strong{font-size:14px}.divider{border-top:1px solid var(--line);margin:25px 0}.footnote{font-size:11px;color:#af9aa3;padding:0 8px}.button{border:0;border-radius:24px;padding:13px 21px;background:var(--accent);color:white;font-size:14px;font-weight:600;text-align:center;display:inline-flex;justify-content:center;gap:16px;align-items:center}.button:hover{background:#c50059}.secondary{background:#feeaf3;color:#c50059}.secondary:hover{background:#fdd8e9}.text-button{border:0;background:none;color:#977b88;font-size:13px;text-align:center}.empty{grid-column:1/-1;text-align:center;padding:45px 26px;border:1px dashed #ecdae2;border-radius:14px;margin:16px 26px}.cards .empty{margin:0}.empty>span{font-size:40px;color:var(--accent)}.empty p{font-size:14px;color:var(--muted)}.form-card{margin:26px;padding:28px;border:1px solid var(--line);border-radius:14px}.form-card h2{margin-top:0}.form-card form{display:grid;gap:17px}.form-card>p{font-size:14px}label{display:grid;gap:7px;font-size:13px;font-weight:600}input,select,textarea{width:100%;border:1px solid #ebdbe2;border-radius:9px;padding:12px;background:#fff;color:#3d2a33;font-size:14px}input:focus,textarea:focus,select:focus{outline:2px solid #f486b8;outline-offset:1px}input:disabled{background:#faf7f8}input[type=file]{font-size:12px}textarea{min-height:92px;resize:vertical}.check{display:flex;align-items:center;font-weight:400}.check input{width:17px;height:17px}.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px}.identity{display:flex;gap:10px;align-items:center}.identity .avatar{height:42px;width:42px}.identity strong{font-size:13px}.identity small,.post-header small{display:block}.hero-cover{height:205px;width:100%;object-fit:cover}.profile-content{padding:0 28px 26px}.profile-content>.avatar{width:95px;height:95px;margin-top:-44px;position:relative;border-width:4px}.profile-content h1{margin-top:12px}.profile-content p{white-space:pre-wrap;font-size:14px}.plans{display:grid;gap:10px;margin:24px 0 10px}.plans button{justify-content:space-between}.access-tag{margin-top:20px;padding:12px;background:#edf9f5;color:#328168;border-radius:8px;font-size:13px}.post{padding:22px 28px;border-top:1px solid var(--line)}.post-header{display:flex;align-items:center;gap:10px;font-size:14px}.post-header .avatar{width:44px;height:44px}.post>p{font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere}.locked{height:280px;background:radial-gradient(ellipse at 20% 20%,#e9ccd9,transparent 60%),radial-gradient(ellipse at 85% 90%,#dacfe7,transparent 65%),#f4eaef;display:flex;align-items:center;justify-content:center;flex-direction:column;border-radius:12px;color:#805267;text-align:center;padding:20px}.lock-icon{font-size:35px;margin-bottom:16px}.locked p{font-size:13px;margin:7px 0 20px}.locked span{font-size:11px;border:1px solid #ffffffaa;padding:8px 14px;border-radius:20px}.post-image{width:100%;max-height:700px;object-fit:contain;background:#faf5f7;border-radius:8px}.post-images{display:grid;gap:8px}.like{border:0;background:none;font-size:28px;color:#987a88;display:flex;gap:8px;align-items:center;margin-top:15px;padding:0}.like span{font-size:12px}.liked{color:#ed6686}.profile-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}.profile-row span{margin-left:auto;font-size:12px}.profile-row .avatar{width:44px;height:44px}#notice:not(:empty){position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#432e37;color:white;padding:15px 23px;border-radius:12px;box-shadow:0 5px 25px #0002;max-width:90vw;width:max-content;z-index:10;font-size:14px}@media(max-width:1150px){#app{grid-template-columns:220px minmax(0,650px);max-width:870px}.right-rail{display:none}}@media(max-width:650px){#app{display:block}aside{position:static;height:auto;padding:16px 18px;border-bottom:1px solid var(--line);border-right:0}.brand{font-size:29px;margin-bottom:14px}nav{display:flex;gap:4px;overflow-x:auto}.nav-link{font-size:12px;white-space:nowrap;padding:9px 8px}.sidebar-bottom{margin-top:12px;display:flex;align-items:center;justify-content:space-between}.sidebar-bottom>small{display:none}.sidebar-bottom .button{padding:8px 20px}.identity .avatar{width:30px;height:30px}.identity small{display:none}main{border:0}header{padding:20px}.welcome{margin:18px;padding:25px}.welcome h2{font-size:27px}.cards{padding:0 18px;gap:12px}.card-body{padding:0 12px 15px}.card-price{flex-direction:column}.form-card{margin:18px;padding:21px}.post{padding:20px}.section-title{padding:0 20px}.hero-cover{height:170px}.profile-content{padding:0 20px 20px}}

/* Visual identity: vivid blue, softer surfaces and a consistent icon system. */
:root { --accent:#f5177b; --line:#f4e9ee; --muted:#977584; color:#32232a; background:#fff8fb; }
.icon { width:22px; height:22px; flex-shrink:0; vertical-align:middle; }
#app { max-width:1380px; grid-template-columns:240px minmax(0,780px) 290px; }
aside { padding:38px 24px 26px; border:0; background:#fff; }
.brand { display:flex; align-items:center; gap:10px; font-size:36px; letter-spacing:-1.8px; color:#33242b; margin:0 12px 48px; }
.brand .brand-mark { display:grid; place-items:center; width:36px; height:39px; border-radius:12px; background:var(--accent); color:white; transform:rotate(-7deg); box-shadow:0 5px 12px #f5177b2b; }
.brand-mark .icon { width:25px; height:25px; }
nav { gap:9px; }
.nav-link { display:flex; align-items:center; gap:13px; padding:15px 17px; font-size:14px; font-weight:550; border-radius:14px; color:#8b6878; transition:background .2s,color .2s; }
.nav-link .icon { width:21px; height:21px; }
.nav-link.selected { background:#ffedf5; color:var(--accent); font-weight:650; }
.nav-link:hover { background:#fcf1f6; color:var(--accent); }
.sidebar-bottom { padding:0 9px; }
.sidebar-bottom>small { color:#a88c99; }
main { border:0; }
header { padding:32px 34px 24px; border-bottom:0; }
h1 { font-size:26px; letter-spacing:-.9px; font-weight:750; }
header p { font-size:13px; margin-top:5px; }
.welcome { margin:5px 30px 32px; min-height:290px; padding:32px; border-radius:24px; color:#fff; background:linear-gradient(112deg,#ef1477 0%,#f9157c 50%,#ff338f 100%); box-shadow:0 14px 28px -16px #df177175; isolation:isolate; }
.welcome:after { content:''; inset:auto -50px -150px auto; width:330px; height:330px; border:1px solid #ffffff20; border-radius:50%; transform:none; }
.welcome-copy { position:relative; z-index:2; max-width:78%; }
.welcome .eyebrow { display:flex; gap:8px; align-items:center; color:#ffd7e9; font-size:9px; letter-spacing:1.7px; }
.welcome .eyebrow .icon { width:14px; height:14px; }
.welcome h2 { margin:21px 0 14px; font-size:clamp(30px,3.2vw,43px); line-height:1.08; letter-spacing:-1.7px; max-width:none; font-weight:750; }
.welcome h2 em { font-style:normal; color:#fff; }
.welcome p { color:#ffe1ef; font-size:13px; line-height:1.6; margin:0 0 25px; max-width:none; }
.welcome-meta { display:flex; align-items:center; gap:8px; color:#ffe2ef; font-size:10px; }
.welcome-meta .icon { width:14px; height:14px; }
.welcome-meta>span { width:3px; height:3px; border-radius:50%; background:#ffb4d6; margin:0 2px; }
.welcome-art { position:absolute; width:205px; height:240px; right:6px; top:26px; z-index:1; pointer-events:none; }
.orbit { position:absolute; border:1px solid #ffffff24; border-radius:50%; width:240px; height:240px; left:5px; top:-8px; }
.orbit-two { width:310px; height:310px; top:-44px; left:-30px; }
.art-card { position:absolute; width:113px; height:147px; border-radius:19px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px solid #ffffff60; }
.art-back { top:20px; left:17px; transform:rotate(-17deg); background:#ffffff14; }
.art-back .icon { width:36px; height:36px; color:#ffdcec; }
.art-front { top:65px; left:68px; transform:rotate(14deg); background:linear-gradient(140deg,#ffffffed,#ffd9eaed); box-shadow:5px 14px 30px #b4075538; color:#f5177b; }
.art-front>.icon { height:44px; width:44px; margin-bottom:21px; stroke-width:1.3; }
.art-line { width:50px; height:4px; background:#f58fbd; border-radius:5px; }
.art-line.short { width:31px; margin-top:8px; opacity:.5; }
.art-dot { width:12px; height:12px; border:3px solid #ffffffc0; position:absolute; left:38px; top:207px; border-radius:50%; }
.section-title { padding:0 33px; margin:0 0 19px; }
.section-title h2 { font-size:20px; letter-spacing:-.65px; }
.section-title>span { background:#f8edf2; color:#987082; border-radius:7px; padding:5px 9px; font-size:11px; }
.cards { padding:0 30px; gap:20px; }
.profile-card { background:#fff; border:1px solid #f4e9ee; border-radius:20px; transition:transform .2s,box-shadow .2s; }
.profile-card:hover { transform:translateY(-4px); box-shadow:0 15px 32px #4530390e; }
.cover { height:130px; }
.placeholder { background:linear-gradient(135deg,#ffdcec,#ffb8d8); color:#ce5b8f; }
.placeholder .icon { width:29px; height:29px; }
.card-body { padding:0 19px 19px; }
.card-body h2 { color:#32232a; }
.card-price { align-items:center; }
.card-price>span { display:flex; align-items:center; gap:5px; font-size:11px; font-weight:600; }
.card-price .icon { width:13px; height:13px; }
.verified { display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; padding:2px; }
.verified .icon { width:12px; height:12px; stroke-width:3; }
.right-rail { padding:36px 24px 25px 10px; }
.info-card { background:#fff; border:1px solid #f4e9ee; border-radius:21px; padding:25px; box-shadow:0 5px 18px #51384303; }
.rail-icon { width:40px; height:40px; display:grid; place-items:center; color:var(--accent); background:#ffedf5; border-radius:13px; margin-bottom:23px; }
.eyebrow { color:#8e6175; font-size:9px; letter-spacing:1.5px; }
.info-card h2 { font-size:24px; letter-spacing:-.9px; margin:14px 0; }
.info-card p { font-size:12px; line-height:1.8; }
.rail-title { display:flex; gap:8px; align-items:center; }
.rail-title .icon { color:var(--accent); width:17px; height:17px; }
.info-card strong { font-size:12px; }
.footnote { padding:3px 9px; font-size:10px; line-height:1.9; }
.button { border-radius:13px; background:var(--accent); box-shadow:0 5px 12px #f5177b1a; padding:14px 21px; transition:background .2s,transform .2s; }
.button:hover { background:#d80665; transform:translateY(-1px); }
.secondary { color:var(--accent); background:#ffeaf3; box-shadow:none; }
.secondary:hover { background:#ffdaeb; }
.empty { border:1px solid #f4e5ec; border-radius:20px; background:#fff; padding:43px 26px; }
.empty .empty-icon { display:grid; place-items:center; margin:0 auto 20px; width:58px; height:58px; background:#fff0f7; border-radius:19px; color:var(--accent); }
.empty-icon .icon { width:27px; height:27px; stroke-width:1.4; }
.empty h2 { font-size:19px; margin:0 0 9px; letter-spacing:-.6px; }
.empty p { font-size:12px; max-width:280px; margin:0 auto 14px; line-height:1.8; }
.form-card { background:#fff; border-radius:20px; border-color:var(--line); }
input,select,textarea { border-radius:11px; border-color:#f0e0e7; padding:13px; }
input:focus,textarea:focus,select:focus { outline-color:#ffa4cd; border-color:#ff68ac; }
:where(a,button):focus-visible { outline:3px solid #ff7eb8; outline-offset:4px; }
.profile-detail { background:#fff; }
.post { background:#fff; margin:0 30px 18px; padding:23px; border:1px solid var(--line); border-radius:18px; }
.locked { background:radial-gradient(ellipse at 20% 20%,#ffd8ea,transparent 60%),radial-gradient(ellipse at 85% 90%,#ffdcec,transparent 65%),#ffeef6; }
.lock-icon { display:grid; place-items:center; width:50px; height:50px; border-radius:16px; background:#ffffff9e; color:var(--accent); }
.like .icon { width:23px; height:23px; }
.like.liked .icon { fill:currentColor; }
@media(min-width:1250px) { .welcome-art { right:28px; } .welcome { padding:37px; } }
@media(max-width:1150px) { #app { grid-template-columns:210px minmax(0,690px); max-width:900px; } .right-rail { display:none; } aside { padding:32px 18px; } }
@media(max-width:760px) and (min-width:651px) { .welcome-art { right:-65px; opacity:.5; } .welcome-copy { max-width:100%; } }
@media(max-width:650px) {
  #app { display:block; } aside { height:auto; padding:18px; border-bottom:1px solid var(--line); }
  .brand { margin:0 0 20px; font-size:29px; gap:8px; } .brand .brand-mark { width:29px; height:31px; border-radius:9px; } .brand-mark .icon { width:20px; height:20px; }
  nav { gap:5px; } .nav-link { gap:7px; padding:10px 12px; font-size:12px; border-radius:11px; } .nav-link .icon { width:17px; height:17px; }
  .sidebar-bottom { padding:0; margin-top:16px; } .sidebar-bottom .button { border-radius:9px; }
  header { padding:24px 21px 19px; } h1 { font-size:24px; }
  .welcome { margin:0 18px 27px; padding:27px; min-height:280px; border-radius:21px; }
  .welcome h2 { font-size:36px; } .welcome-art { right:-10px; transform:scale(.82); transform-origin:right center; } .welcome-copy { max-width:85%; }
  .welcome p { font-size:12px; } .welcome .eyebrow { font-size:8px; letter-spacing:1.1px; }
  .welcome-meta { font-size:9px; gap:6px; }
  .section-title { padding:0 21px; } .cards { padding:0 18px; gap:13px; }
  .card-body { padding:0 13px 16px; } .card-price { align-items:flex-start; }
  .empty { padding:34px 22px; } .post { margin:0 18px 16px; padding:18px; }
}
@media(max-width:390px) { .welcome-art { right:-62px; opacity:.48; } .welcome-copy { max-width:100%; } .welcome h2 { font-size:33px; } .cards { grid-template-columns:1fr; } .nav-link { padding:10px 8px; font-size:11px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; scroll-behavior:auto!important; } }

/* Locked cards only reuse the PUBLIC avatar as decoration, never the private photo. */
.locked { position:relative; overflow:hidden; isolation:isolate; }
.locked .locked-preview { position:absolute; inset:-15%; width:130%; height:130%; object-fit:cover; filter:blur(24px); opacity:.24; z-index:-2; pointer-events:none; }
.locked::after { content:''; position:absolute; inset:0; background:#fff0f78a; z-index:-1; }
.cover,.hero-cover { object-position:center 37%; }

/* Shareable creator offers and account/payment checkout. */
#app.funnel-app { display:block; max-width:none; min-height:100vh; background:radial-gradient(ellipse at 50% 0%,#ffe9f3 0%,#fdf7fa 48%); }
.funnel-wrap { max-width:1060px; margin:0 auto; padding:30px 32px 20px; }
.funnel-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:31px; }
.funnel-top .brand { margin:0; font-size:30px; }
.funnel-top .brand-mark { height:32px; width:30px; border-radius:10px; }
.funnel-top-note { display:flex; align-items:center; gap:7px; font-size:11px; color:#9a7083; }
.funnel-top-note .icon { width:14px; height:14px; }
.funnel-steps { display:flex; justify-content:center; align-items:center; gap:16px; padding:0 0 32px; }
.funnel-steps>span { display:flex; align-items:center; gap:9px; font-size:12px; color:#a68192; }
.funnel-steps b { display:grid; place-items:center; border:1px solid #eedce4; width:26px; height:26px; border-radius:50%; font-size:11px; background:#fff; }
.funnel-steps i { height:1px; width:65px; background:#f3d8e4; }
.funnel-steps .current { color:#de1771; font-weight:650; }
.funnel-steps .current b,.funnel-steps .complete b { background:var(--accent); color:#fff; border-color:var(--accent); }
.funnel-steps b .icon { width:14px; height:14px; }
.offer-page { max-width:820px; margin:0 auto; background:white; border:1px solid #f5e5ec; border-radius:27px; overflow:hidden; box-shadow:0 20px 65px #47323b08; }
.offer-portrait { position:relative; }
.offer-banner { width:100%; height:220px; object-fit:cover; object-position:center 35%; display:block; }
.offer-identity { display:flex; align-items:center; gap:13px; margin:-34px 38px 0; position:relative; color:#34242b; }
.offer-identity .avatar { width:92px; height:92px; border:5px solid white; }
.offer-identity>span { padding-top:36px; }
.offer-identity strong { font-size:16px; display:block; }
.offer-identity small { display:flex; gap:5px; align-items:center; font-size:11px; }
.offer-identity .icon { width:12px; height:12px; }
.offer-content { padding:32px 40px 35px; }
.offer-content .eyebrow { color:var(--accent); }
.offer-content h1 { font-size:34px; line-height:1.18; letter-spacing:-1.3px; margin:13px 0; overflow-wrap:anywhere; }
.offer-subtitle { color:#9a7083; font-size:14px; margin:0 0 29px; white-space:pre-wrap; overflow-wrap:anywhere; }
.offer-plans { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.offer-plan { border:1px solid #f1dce5; border-radius:18px; padding:22px; color:#32232a; transition:transform .2s,box-shadow .2s; background:#fff; }
.offer-plan:hover { transform:translateY(-3px); box-shadow:0 10px 22px #ac1e5e12; }
.offer-plan.annual { background:#fff5fa; border:1.5px solid #ff5ba5; }
.plan-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.plan-heading>span { display:flex; align-items:center; gap:7px; font-weight:650; font-size:14px; }
.plan-heading .icon { width:18px; height:18px; color:var(--accent); }
.savings { font-size:9px; padding:5px 7px; color:#cc1366; background:#ffe2ef; border-radius:6px; white-space:nowrap; }
.plan-price { font-size:29px; font-weight:750; letter-spacing:-1px; margin-top:23px; }
.plan-price small { font-weight:400; letter-spacing:0; font-size:12px; margin-left:3px; }
.offer-plan p { font-size:11px; color:#997485; margin:7px 0 21px; }
.plan-action { display:flex; align-items:center; justify-content:space-between; padding-top:16px; border-top:1px solid #f5e1ea; font-size:12px; font-weight:650; color:var(--accent); }
.plan-action .icon { width:16px; height:16px; }
.offer-benefits { display:flex; flex-wrap:wrap; gap:20px; margin:24px 0; }
.offer-benefits span { display:flex; align-items:center; gap:6px; font-size:11px; color:#8e6577; }
.offer-benefits .icon { color:var(--accent); width:14px; height:14px; }
.offer-profile-link { display:flex; gap:8px; align-items:center; font-size:12px; }
.offer-profile-link .icon { width:14px; height:14px; }
.offer-content>.button { margin:20px 0; }
.funnel-footer { text-align:center; color:#a88796; font-size:11px; padding:27px 0 10px; line-height:1.8; }
.funnel-footer small { font-size:10px; }
.funnel-back { color:#997183; font-size:12px; display:inline-block; margin:0 0 23px; }
.checkout-grid { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:32px; align-items:start; }
.checkout-main>h1 { margin:12px 0 8px; font-size:32px; letter-spacing:-1.2px; }
.checkout-intro { margin:0 0 23px; color:#997686; font-size:13px; }
.checkout-section { background:white; border:1px solid #f3e4eb; padding:25px; border-radius:19px; margin-bottom:20px; }
.checkout-section-title { display:flex; align-items:center; gap:10px; margin-bottom:20px; }
.checkout-section-title h2 { margin:0; font-size:16px; }
.step-icon { display:grid; place-items:center; background:#ffeef6; color:var(--accent); width:33px; height:33px; border-radius:10px; }
.step-icon .icon { width:17px; height:17px; }
.auth-tabs { display:flex; gap:5px; background:#faf2f6; border-radius:10px; padding:4px; margin-bottom:22px; }
.auth-tabs a { flex:1; text-align:center; padding:9px; font-size:12px; color:#9a7787; border-radius:7px; }
.auth-tabs a.active { color:#d02170; background:white; box-shadow:0 2px 7px #46303a0a; font-weight:650; }
#checkout-account-form { display:grid; gap:17px; }
#checkout-account-form label { font-size:12px; }
#checkout-account-form input { font-size:13px; }
#checkout-account-form .check { font-size:11px; color:#8f697a; }
.account-hint { text-align:center; font-size:10px; }
.order-summary { background:white; border:1px solid #f3e2ea; border-radius:22px; overflow:hidden; position:sticky; top:24px; box-shadow:0 15px 40px #48323c05; }
.checkout-banner { display:block; width:100%; height:148px; object-fit:cover; object-position:center 32%; }
.summary-profile { display:block; padding:0 25px; color:#32232a; }
.summary-profile .avatar { position:relative; margin-top:-31px; width:70px; height:70px; border-width:4px; }
.summary-profile h2 { font-size:19px; margin:12px 0 2px; }
.summary-profile>small { font-size:11px; }
.summary-content { padding:25px; }
.summary-content h3 { margin:0 0 17px; font-size:12px; font-weight:650; }
.summary-line,.summary-total { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:12px; }
.summary-line { color:#997384; }
.summary-line a { font-size:11px; }
.summary-total { border-top:1px solid #f4e8ed; padding-top:18px; margin-top:18px; }
.summary-total strong { font-size:22px; letter-spacing:-.8px; }
.summary-recurrence { font-size:10px; color:#a88b98; line-height:1.7; }
.summary-benefits { list-style:none; padding:19px 0 0; border-top:1px solid #f4e8ed; margin:20px 0; display:grid; gap:12px; }
.summary-benefits li { display:flex; align-items:center; gap:8px; color:#8b6274; font-size:11px; }
.summary-benefits .icon { width:14px; height:14px; color:var(--accent); }
.summary-view { display:flex; align-items:center; gap:8px; font-size:11px; }
.summary-view .icon { width:13px; height:13px; }
.card-label { margin-left:auto; font-size:10px; color:#a68192; }
.payment-notice { display:flex; gap:10px; padding:14px; border:1px solid #f9dfeb; border-radius:10px; color:#955270; background:#fff4f9; margin-bottom:21px; }
.payment-notice>.icon { width:16px; height:16px; margin-top:2px; }
.payment-notice strong { font-size:11px; }
.payment-notice p { font-size:11px; line-height:1.6; margin:4px 0 0; }
.card-preview { border:0; padding:0; margin:0 0 21px; display:grid; gap:16px; }
.card-preview label { font-size:11px; color:#a48794; }
.card-preview input { font-size:12px; }
.pay-button { width:100%; font-size:12px; }
.pay-button .icon { width:15px; height:15px; }
.payment-caption { display:block; font-size:10px; margin-top:13px; text-align:center; }
.checkout-account { display:flex; gap:10px; align-items:center; }
.checkout-account>.avatar { width:43px; height:43px; }
.checkout-account>div { min-width:0; flex:1; }
.checkout-account strong { font-size:12px; }
.checkout-account small { display:block; font-size:11px; overflow-wrap:anywhere; }
.checkout-account .text-button { font-size:10px; }
.done-label { color:#208666; font-size:10px; margin-left:auto; }
.checkout-error { background:white; padding:40px; border:1px solid var(--line); border-radius:20px; text-align:center; }
.offer-editor { border-top:1px solid var(--line); padding:10px 0 27px; margin-top:18px; }
.offer-editor .profile-row { border:0; margin-bottom:13px; }
.offer-editor .profile-row .icon { width:13px; height:13px; }
.offer-editor form { margin-top:20px; }
.offer-editor label { font-size:12px; }
.copy-field { display:flex; gap:8px; }
.copy-field input { font-size:11px; background:#fdf7fa; }
.icon-button { border:1px solid #f3dfe8; background:#ffeef6; border-radius:10px; padding:9px 12px; color:var(--accent); }
.icon-button .icon { width:17px; height:17px; }
.offer-preview-link { display:flex; gap:7px; align-items:center; font-size:12px; margin-top:11px; }
.offer-preview-link .icon { width:14px; height:14px; }
@media(max-width:800px) { .checkout-grid { grid-template-columns:minmax(0,1fr) 280px; gap:20px; } .funnel-wrap { padding:24px; } .checkout-section { padding:20px; } }
@media(max-width:650px) {
  .funnel-wrap { padding:22px 16px; } .funnel-top { margin-bottom:27px; } .funnel-top-note { font-size:9px; }
  .funnel-top .brand { font-size:26px; } .funnel-steps { gap:10px; padding-bottom:25px; overflow:visible; }
  .funnel-steps>span { font-size:10px; gap:6px; } .funnel-steps i { width:28px; }
  .offer-banner { height:170px; } .offer-identity { margin:-29px 22px 0; } .offer-identity .avatar { height:78px; width:78px; } .offer-identity>span { padding-top:29px; }
  .offer-content { padding:26px 22px; } .offer-content h1 { font-size:28px; } .offer-subtitle { font-size:12px; }
  .offer-plans { grid-template-columns:1fr; gap:12px; } .offer-plan { padding:21px; } .plan-price { margin-top:15px; }
  .checkout-grid { display:flex; flex-direction:column; gap:23px; } .order-summary { position:static; width:100%; order:-1; }
  .checkout-banner { height:120px; } .summary-content { padding:19px 22px; } .summary-profile { padding:0 22px; }
  .summary-benefits,.summary-view { display:none; } .summary-profile h2 { margin-top:7px; } .summary-content h3 { display:none; }
  .summary-total { margin-top:13px; padding-top:13px; } .summary-recurrence { margin-bottom:0; }
  .checkout-main { width:100%; } .checkout-main>h1 { font-size:28px; } .checkout-section { padding:20px; }
  .offer-benefits { gap:12px; } .offer-benefits span { font-size:10px; }
}

/* Mobile-first conversion pass: short offer, thumb-sized plans, compact checkout. */
.funnel-wrap { max-width:960px; padding-top:20px; }
.funnel-top { margin-bottom:20px; }
.funnel-steps { padding-bottom:20px; }
.offer-page { max-width:600px; border-radius:22px; }
.offer-banner { height:172px; }
.offer-identity { margin:-28px 25px 0; gap:10px; }
.offer-identity .avatar { height:72px; width:72px; border-width:4px; }
.offer-identity>span { padding-top:29px; }
.offer-identity strong { font-size:15px; }
.offer-content { padding:22px 26px 20px; }
.offer-content h1 { font-size:32px; line-height:1.1; margin:10px 0 12px; }
.offer-subtitle { font-size:14px; line-height:1.6; color:#8a6375; margin:0 0 21px; }
.plan-prompt { font-size:11px; font-weight:600; margin:0 0 10px; color:#8a6576; }
.offer-plans { grid-template-columns:1fr; gap:10px; }
.offer-plan { display:grid; grid-template-columns:1fr auto 22px; grid-template-areas:'heading price action' 'note note action'; align-items:center; gap:6px 10px; padding:17px 18px; border-radius:14px; min-height:88px; }
.plan-heading { grid-area:heading; justify-content:flex-start; flex-wrap:wrap; }
.plan-heading>span { font-size:14px; }
.plan-price { grid-area:price; margin:0; font-size:23px; white-space:nowrap; }
.plan-price small { font-size:11px; }
.offer-plan p { grid-area:note; margin:0; font-size:11px; }
.plan-action { grid-area:action; border:0; padding:0; }
.plan-action>span { display:none; }
.offer-plan.monthly { color:white; background:var(--accent); border-color:var(--accent); box-shadow:0 6px 14px #f5177b1f; }
.offer-plan.monthly .plan-heading .icon,.offer-plan.monthly .plan-action { color:white; }
.offer-plan.monthly p,.offer-plan.monthly .plan-price small { color:#ffe1ef; }
.offer-plan.annual { border:1px solid #fbd5e6; background:#fff7fb; }
.plan-heading .savings { font-size:9px; padding:3px 5px; }
.offer-benefits { gap:14px; margin:17px 0 8px; }
.offer-benefits span { font-size:11px; }
.offer-profile-link { min-height:44px; font-size:12px; }
.offer-profile-link:focus-visible { border-radius:5px; }
.funnel-footer { padding:16px 0 5px; }
.checkout-grid { grid-template-columns:minmax(0,1fr) 300px; gap:25px; }
.checkout-main>h1 { font-size:27px; }
.checkout-section { padding:21px; }
.checkout-section-title { margin-bottom:15px; }
#checkout-account-form { gap:13px; }
#checkout-account-form input { font-size:16px; min-height:46px; }
.password-field { display:block; }
.show-password { border:0; background:none; justify-self:end; color:#de1771; font-size:12px; min-height:44px; padding:8px 2px; margin-top:-13px; margin-bottom:-10px; }
.form-error:empty { display:none; }
.form-error { margin:0; border-radius:8px; padding:10px 12px; background:#fff1f2; color:#a3263a; font-size:12px; line-height:1.5; }
.payment-preview-details { margin:0 0 17px; }
.payment-preview-details summary { color:#8b6375; font-size:12px; cursor:pointer; min-height:44px; padding:12px 0; }
.payment-preview-details .card-preview { margin:8px 0 15px; }
.payment-notice { margin-bottom:4px; }
.auth-tabs a { display:flex; align-items:center; justify-content:center; min-height:44px; }
#checkout-account-form .check { min-height:44px; font-size:12px; line-height:1.4; }
.check input { flex-shrink:0; }
#checkout-account-form .check input { width:20px; height:20px; min-height:20px; }
.funnel-back { display:inline-flex; min-height:44px; align-items:center; margin-bottom:8px; }
.summary-line a { display:flex; align-items:center; justify-content:flex-end; min-height:44px; min-width:44px; }
.locked .locked-cta { display:flex; align-items:center; justify-content:center; gap:9px; min-height:44px; background:white; color:#d7196f; border:1px solid #fcdbea; border-radius:12px; font-size:13px; padding:0 18px; }
.locked-cta .icon { width:16px; height:16px; }
@media(max-width:650px) {
  .funnel-wrap { padding:12px 12px calc(12px + env(safe-area-inset-bottom)); }
  .funnel-top { margin:0 4px 12px; min-height:32px; }
  .funnel-top .brand { font-size:24px; gap:7px; }
  .funnel-top .brand-mark { width:27px; height:29px; border-radius:9px; }
  .funnel-top-note { font-size:10px; gap:5px; }
  .funnel-top-note .icon { width:12px; height:12px; }
  .funnel-steps { gap:10px; padding:0 0 13px; }
  .funnel-steps>span { font-size:10px; }
  .funnel-steps b { width:22px; height:22px; font-size:10px; }
  .funnel-steps i { width:21px; }
  .offer-page { border-radius:18px; }
  .offer-banner { height:120px; object-position:center 30%; }
  .offer-identity { margin:-22px 17px 0; gap:9px; }
  .offer-identity .avatar { width:58px; height:58px; border:3px solid white; }
  .offer-identity>span { padding-top:24px; }
  .offer-identity strong { font-size:14px; }
  .offer-identity small { font-size:10px; }
  .offer-content { padding:17px 17px 10px; }
  .offer-content .eyebrow { font-size:8px; letter-spacing:1.2px; }
  .offer-content h1 { font-size:28px; letter-spacing:-1px; margin:8px 0 10px; max-width:290px; }
  .offer-subtitle { font-size:13px; line-height:1.5; margin-bottom:15px; }
  .plan-prompt { font-size:11px; margin-bottom:9px; }
  .offer-plan { min-height:85px; padding:14px 13px; gap:7px 6px; grid-template-columns:1fr auto 17px; }
  .plan-heading { gap:4px; }
  .plan-heading>span { font-size:13px; gap:5px; }
  .plan-heading .icon { width:15px; height:15px; }
  .plan-heading .savings { font-size:8px; }
  .plan-price { font-size:22px; letter-spacing:-.7px; }
  .plan-price small { font-size:10px; margin-left:1px; }
  .offer-plan p { font-size:10px; }
  .offer-benefits { gap:12px; margin:13px 0 0; }
  .offer-benefits span { font-size:10px; }
  .offer-benefits .icon { width:12px; height:12px; }
  .offer-profile-link { font-size:11px; }
  .funnel-footer { padding:10px 0 0; }
  .funnel-footer small { font-size:9px; }
  .funnel-back { font-size:11px; min-height:36px; margin:0 2px 6px; }
  .checkout-grid { display:flex; gap:14px; }
  .order-summary { display:grid; grid-template-columns:1fr; border-radius:14px; }
  .checkout-banner { height:64px; object-position:center 26%; }
  .summary-profile { padding:0 14px; display:grid; grid-template-columns:43px 1fr; column-gap:9px; align-items:center; margin-top:-12px; }
  .summary-profile .avatar { grid-column:1; grid-row:1/3; margin:0; width:43px; height:43px; border-width:3px; }
  .summary-profile h2 { grid-column:2; font-size:14px; margin:14px 0 0; }
  .summary-profile>small { grid-column:2; font-size:10px; }
  .summary-content { display:grid; grid-template-columns:1fr auto; gap:0 10px; padding:0 14px 12px; }
  .summary-line { grid-column:1; justify-content:flex-start; font-size:11px; gap:9px; }
  .summary-line a { font-size:10px; }
  .summary-total { grid-column:2; border:0; padding:0; margin:0; justify-content:flex-end; }
  .summary-total>span { display:none; }
  .summary-total strong { font-size:21px; }
  .summary-recurrence { grid-column:1/-1; font-size:10px; margin:0; color:#8e697a; }
  .summary-benefits,.summary-view,.summary-content h3 { display:none; }
  .checkout-main>.eyebrow { display:none; }
  .checkout-main>h1 { font-size:22px; margin:0 3px 4px; letter-spacing:-.8px; }
  .checkout-intro { font-size:12px; margin:0 3px 12px; }
  .checkout-section { padding:16px; border-radius:14px; margin-bottom:12px; }
  .checkout-section-title { gap:8px; margin-bottom:12px; }
  .checkout-section-title h2 { font-size:14px; }
  .step-icon { width:28px; height:28px; border-radius:8px; }
  .auth-tabs { margin-bottom:14px; }
  .auth-tabs a { font-size:12px; }
  #checkout-account-form { gap:12px; }
  #checkout-account-form label { font-size:12px; gap:5px; }
  #checkout-account-form input { font-size:16px; padding:11px 12px; }
  #checkout-account-form .button { min-height:48px; font-size:14px; }
  .card-preview input { font-size:16px; }
  .account-hint { font-size:10px; }
  .payment-caption { font-size:10px; }
  .payment-notice p { font-size:11px; }
  .pay-button { min-height:48px; }
  #notice:not(:empty) { bottom:calc(12px + env(safe-area-inset-bottom)); }
}
@media(max-width:360px) {
  .offer-content { padding-left:13px; padding-right:13px; }
  .plan-price { font-size:20px; }
  .plan-heading .savings { display:block; }
  .funnel-top-note { font-size:9px; }
}

/* App-style purchase flow: one canvas, native-feeling header and thumb action dock. */
#app.funnel-app { background:#f8eaf0; min-height:100dvh; }
.funnel-app .funnel-wrap { max-width:480px; min-height:100dvh; margin:auto; padding:0 0 max(12px,env(safe-area-inset-bottom)); background:#fcf7f9; box-shadow:0 0 70px #4e36410b; }
.app-topbar { height:72px; padding:10px 18px; display:grid; grid-template-columns:44px 1fr 44px; gap:10px; align-items:center; position:sticky; top:0; z-index:8; background:#fcf7f9f5; backdrop-filter:blur(16px); border:0; }
.app-back,.app-brand { display:grid; place-items:center; height:44px; width:44px; border-radius:50%; }
.app-back { color:#432e37; background:white; border:1px solid #f5e9ee; box-shadow:0 2px 4px #432e3704; }
.app-back .icon { height:24px; width:24px; stroke-width:2; }
.app-back:active { transform:scale(.94); background:#ffeaf3; }
.app-brand { color:var(--accent); }
.app-brand .icon { height:25px; width:25px; }
.app-topbar-title { text-align:center; line-height:1.3; }
.app-topbar-title strong { font-size:15px; font-weight:700; letter-spacing:-.3px; }
.app-topbar-title small { display:block; font-size:10px; color:#a68896; margin-top:3px; }
.app-progress { display:flex; gap:5px; padding:0 22px 15px; }
.app-progress span { height:3px; flex:1; background:#f1e0e8; border-radius:3px; }
.app-progress span.complete { background:var(--accent); }
.app-screen { padding:0 18px; }
.funnel-app .funnel-footer { padding:13px 20px 6px; }
.funnel-footer small { font-size:9px; color:#a78997; }
.funnel-app .offer-page { border:0; background:transparent; border-radius:0; box-shadow:none; overflow:visible; }
.funnel-app .offer-banner { border-radius:22px; height:156px; object-position:center 31%; }
.funnel-app .offer-identity { margin:-26px 15px 0; gap:10px; }
.funnel-app .offer-identity .avatar { width:67px; height:67px; border:4px solid #fcf7f9; }
.funnel-app .offer-identity>span { padding-top:29px; }
.funnel-app .offer-identity strong { font-size:15px; }
.funnel-app .offer-identity small { font-size:11px; }
.funnel-app .offer-content { padding:23px 3px 0; }
.funnel-app .offer-content h1 { font-size:29px; letter-spacing:-1px; max-width:330px; margin:9px 0 12px; }
.funnel-app .offer-subtitle { font-size:13px; color:#967483; line-height:1.65; margin-bottom:20px; }
.funnel-app .plan-prompt { margin-bottom:11px; font-size:12px; }
.funnel-app .offer-plans { gap:10px; }
.funnel-app .offer-plan { border-radius:18px; min-height:85px; padding:16px; grid-template-columns:1fr auto 18px; }
.funnel-app .offer-plan:active { transform:scale(.985); }
.funnel-app .offer-plan.annual { background:white; border:1px solid #f1e3e9; }
.funnel-app .offer-benefits { margin:18px 2px 0; gap:14px; }
.funnel-app .offer-profile-link { justify-content:center; min-height:48px; font-size:12px; }
.funnel-app .checkout-grid { display:flex; flex-direction:column; gap:22px; }
.funnel-app .order-summary { position:relative; order:-1; width:100%; display:grid; grid-template-columns:1fr; border:0; border-radius:20px; background:white; box-shadow:0 3px 10px #432e3704; }
.funnel-app .checkout-banner { height:86px; width:100%; object-fit:cover; object-position:center 29%; }
.funnel-app .summary-profile { display:grid; grid-template-columns:48px 1fr; grid-template-rows:auto auto; gap:0 10px; align-items:center; margin:-17px 0 0; padding:0 16px; }
.funnel-app .summary-profile .avatar { grid-column:1; grid-row:1/3; width:48px; height:48px; margin:0; border:3px solid white; }
.funnel-app .summary-profile h2 { grid-column:2; margin:19px 0 0; font-size:15px; }
.funnel-app .summary-profile>small { grid-column:2; font-size:10px; }
.funnel-app .summary-content { display:grid; grid-template-columns:1fr auto; gap:0 8px; padding:2px 16px 13px; }
.funnel-app .summary-content h3,.funnel-app .summary-benefits,.funnel-app .summary-view { display:none; }
.funnel-app .summary-line { grid-column:1; justify-content:flex-start; gap:12px; font-size:11px; }
.funnel-app .summary-line a { color:#995272; font-size:10px; }
.funnel-app .summary-total { grid-column:2; margin:0; padding:0; border:0; justify-content:flex-end; }
.funnel-app .summary-total>span { display:none; }
.funnel-app .summary-total strong { font-size:21px; }
.funnel-app .summary-recurrence { grid-column:1/-1; margin:0; font-size:10px; line-height:1.5; color:#9d7d8b; }
.funnel-app .checkout-main { width:100%; }
.funnel-app .checkout-main>.eyebrow { display:none; }
.funnel-app .checkout-main>h1 { font-size:24px; letter-spacing:-.8px; margin:0 2px 5px; }
.funnel-app .checkout-intro { font-size:12px; color:#a68996; margin:0 2px 20px; }
.funnel-app .checkout-section { border:0; border-radius:0; box-shadow:none; background:transparent; padding:0; margin:0 0 25px; }
.funnel-app .checkout-section-title { gap:8px; margin-bottom:14px; }
.funnel-app .checkout-section-title h2 { font-size:13px; }
.funnel-app .step-icon { width:27px; height:27px; border-radius:9px; background:#ffeaf3; }
.funnel-app .step-icon .icon { width:15px; height:15px; }
.funnel-app .auth-tabs { padding:4px; gap:3px; border-radius:13px; background:#f5e9ee; margin-bottom:20px; }
.funnel-app .auth-tabs a { min-height:40px; border-radius:10px; font-size:12px; }
.funnel-app #checkout-account-form { gap:16px; }
.funnel-app #checkout-account-form label { font-size:11px; color:#8f6779; font-weight:500; gap:7px; }
.funnel-app #checkout-account-form input:not([type=checkbox]) { min-height:52px; border:1px solid #f2e5eb; border-radius:14px; background:white; padding:14px; font-size:16px; box-shadow:0 2px 5px #432e3702; }
.funnel-app #checkout-account-form input::placeholder { color:#bca1ad; }
.password-group { display:grid; gap:7px; }
.password-field { position:relative; }
.funnel-app #checkout-account-form .password-field input { padding-right:52px; }
.funnel-app .show-password { position:absolute; top:4px; right:4px; min-height:44px; width:44px; margin:0; padding:10px; border-radius:10px; color:#ab8998; display:grid; place-items:center; }
.show-password .icon { width:20px; height:20px; }
.funnel-app #checkout-account-form .check { display:flex; min-height:44px; font-size:11px; gap:10px; }
.funnel-app #checkout-account-form .check input { width:20px; height:20px; min-height:20px; accent-color:var(--accent); border-radius:6px; }
.checkout-action-dock { position:fixed; z-index:10; bottom:0; left:50%; transform:translateX(-50%); width:100%; max-width:480px; background:#ffffffed; backdrop-filter:blur(18px); border-top:1px solid #f4e8ed; box-shadow:0 -8px 24px #4f374205; padding:12px 20px max(12px,env(safe-area-inset-bottom)); }
.dock-price { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 0 10px; }
.dock-price>span { color:#a17f8e; font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dock-price>strong { font-size:18px; white-space:nowrap; letter-spacing:-.4px; }
.dock-price small { font-size:10px; font-weight:400; color:#a78997; margin-left:2px; }
.funnel-app #checkout-account-form .checkout-action-dock .button { width:100%; min-height:52px; border-radius:16px; font-size:14px; box-shadow:0 5px 12px #f5177b26; }
.checkout-action-dock .account-hint { display:block; font-size:9px; text-align:center; margin-top:8px; color:#b298a4; }
.funnel-app:has(.checkout-action-dock) .funnel-wrap { padding-bottom:155px; }
.funnel-app .payment-section { border-radius:18px; padding:17px; background:#f8eff3; }
.funnel-app .payment-notice { border:0; padding:0 0 4px; background:transparent; }
.funnel-app .payment-notice strong { color:#8c6577; }
.funnel-app .payment-notice p { font-size:11px; color:#a38593; }
.funnel-app .card-label { font-size:9px; }
.funnel-app .payment-preview-details { margin-bottom:8px; }
.funnel-app .payment-preview-details summary { font-size:11px; }
.funnel-app .pay-button { min-height:48px; border-radius:14px; font-size:12px; }
.funnel-app .payment-caption { font-size:9px; color:#a68b97; }
.funnel-app .checkout-account { padding:15px; border-radius:15px; background:white; }
.funnel-app .checkout-error { padding:25px 20px; border-radius:18px; }
.funnel-app.editing-account .checkout-action-dock { position:static; transform:none; width:100%; border:0; box-shadow:none; border-radius:16px; margin-top:0; padding:14px; }
.funnel-app.editing-account .funnel-wrap { padding-bottom:16px; }
body:has(.checkout-action-dock) #notice:not(:empty) { bottom:155px; }
@media(max-width:650px) {
  #app.funnel-app { background:#fcf7f9; }
  .funnel-app .funnel-wrap { max-width:480px; padding-top:0; }
  .app-topbar { padding-top:max(10px,env(safe-area-inset-top)); }
}
@media(max-width:360px) {
  .app-screen { padding:0 14px; }
  .app-topbar { padding-left:14px; padding-right:14px; }
  .funnel-app .offer-plan { padding:14px 12px; }
  .funnel-app .offer-content h1 { font-size:27px; }
  .funnel-app .offer-banner { height:130px; }
  .funnel-app .offer-benefits { gap:9px; }
  .checkout-action-dock { padding-left:16px; padding-right:16px; }
  .funnel-app .checkout-main>h1 { font-size:22px; }
}

/* Shared mobile application shell: feed, discovery, profile and account. */
#app.social-app { display:block; max-width:none; min-height:100dvh; background:#f8eaf0; }
.social-wrap { max-width:480px; min-height:100dvh; margin:auto; padding-bottom:calc(86px + env(safe-area-inset-bottom)); background:#fcf7f9; box-shadow:0 0 70px #4e36410b; }
.social-topbar { margin:0; border:0; }
.social-topbar .app-topbar-title { min-width:0; }
.social-topbar .app-topbar-title strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.top-account { display:grid; place-items:center; width:40px; height:40px; border-radius:50%; background:white; color:#996e81; border:1px solid #f5e8ee; }
.top-account .avatar { width:36px; height:36px; border:0; }
.top-account .placeholder { background:#ffeaf3; color:var(--accent); }
.social-app .social-main { display:block; min-width:0; width:auto; border:0; background:transparent; }
.social-main>header { background:transparent; border:0; padding:20px 20px 4px; }
.social-main>header h1 { font-size:24px; letter-spacing:-.8px; }
.social-main>header p { font-size:12px; }
.bottom-nav { position:fixed; z-index:9; bottom:0; left:50%; transform:translateX(-50%); width:100%; max-width:480px; display:flex; justify-content:space-around; gap:0; padding:8px 7px max(9px,env(safe-area-inset-bottom)); border-top:1px solid #f3e7ec; background:#fffffff5; backdrop-filter:blur(18px); box-shadow:0 -5px 24px #49333d04; overflow:visible; }
.bottom-nav .nav-link { flex:1; display:flex; flex-direction:column; gap:5px; padding:7px 0 3px; min-height:53px; border-radius:14px; font-size:9px; font-weight:500; color:#b494a2; text-align:center; white-space:nowrap; }
.bottom-nav .nav-link .icon { width:22px; height:22px; stroke-width:1.7; }
.bottom-nav .nav-link.selected { color:var(--accent); background:transparent; }
.bottom-nav .nav-link.selected .icon { stroke-width:2.2; filter:drop-shadow(0 3px 5px #f5177b2a); }
.bottom-nav .nav-link:active { background:#ffedf5; }
.social-app .button { border-radius:15px; min-height:48px; }
.feed-welcome,.discover-intro,.feed-heading { padding:24px 22px; }
.feed-welcome { margin:4px 18px 22px; padding:24px 22px; border-radius:22px; background:linear-gradient(125deg,#f5177b,#ff338f); color:white; box-shadow:0 8px 20px #f5177b1c; }
.feed-welcome .eyebrow { color:#ffd9ea; font-size:8px; letter-spacing:1.4px; display:flex; align-items:center; gap:6px; }
.feed-welcome .eyebrow .icon { width:14px; height:14px; }
.feed-welcome h1,.discover-intro h1,.feed-heading h1 { font-size:28px; line-height:1.18; letter-spacing:-1px; margin:13px 0 12px; }
.feed-welcome p { color:#ffd9ea; font-size:12px; line-height:1.7; margin:0 0 18px; }
.feed-welcome>a { font-size:12px; display:flex; align-items:center; justify-content:space-between; color:white; padding-top:14px; border-top:1px solid #ffffff30; }
.feed-welcome>a .icon { width:17px; }
.discover-intro { padding-top:15px; }
.discover-intro p { color:#a88997; font-size:12px; }
.feed-heading { padding-top:8px; padding-bottom:8px; }
.feed-heading h1 { font-size:24px; margin-top:8px; }
.social-app .section-title { padding:0 20px; margin:0 0 14px; }
.social-app .section-title h2 { font-size:15px; letter-spacing:-.3px; }
.section-title>a { font-size:10px; color:#ab8998; display:flex; align-items:center; gap:3px; }
.section-title>a .icon { width:13px; height:13px; }
.suggestion-strip { display:flex; gap:12px; overflow-x:auto; padding:0 18px 12px; scroll-snap-type:x proximity; scrollbar-width:thin; scrollbar-color:#f4dae6 transparent; }
.suggestion-strip>.profile-card { flex:0 0 170px; scroll-snap-align:start; }
.social-app .profile-card { display:block; min-width:0; border:1px solid #f4e9ee; background:white; border-radius:18px; box-shadow:none; }
.social-app .cover { width:100%; height:94px; object-position:center 30%; }
.social-app .card-body { padding:0 12px 13px; }
.social-app .card-body>.avatar { width:42px; height:42px; margin-top:-22px; border-width:3px; }
.social-app .card-body h2 { font-size:13px; margin:4px 0 2px; overflow-wrap:anywhere; }
.social-app .card-body>small { font-size:9px; color:#b398a4; }
.social-app .card-price { flex-direction:column; gap:6px; margin-top:12px; padding-top:10px; font-size:10px; }
.social-app .card-price strong { font-size:13px; }
.social-app .card-price strong small { font-weight:400; font-size:9px; color:#a98c99; }
.social-app .verified { display:inline-flex; align-items:center; justify-content:center; padding:0; width:13px; height:13px; }
.social-app .verified .icon { width:9px; height:9px; stroke-width:3; }
.social-app .cards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:0 18px; }
.discover-section { margin:0 0 22px; }
.discover-section .muted { padding:0 20px; font-size:12px; color:#a88997; }
.following-strip { display:flex; gap:18px; overflow-x:auto; padding:12px 22px 18px; }
.following-strip>a { flex:0 0 54px; display:flex; align-items:center; flex-direction:column; gap:7px; font-size:10px; color:#916f7e; }
.following-strip .avatar { width:54px; height:54px; padding:2px; border:2px solid #f5177b; }
.social-app .post { margin:0 0 14px; padding:18px; border:0; background:white; border-top:1px solid #f5edf1; border-bottom:1px solid #f5edf1; }
.social-app .post-header { gap:10px; color:inherit; }
.social-app .post-header .avatar { width:38px; height:38px; border:0; }
.social-app .post-header strong { font-size:12px; }
.social-app .post-header small { font-size:9px; margin-top:3px; color:#b79ba8; }
.post-exclusive { margin-left:auto; color:#c4a2b1; }
.post-exclusive .icon { width:17px; height:17px; }
.social-app .post>p { margin:15px 0; font-size:12px; color:#916f7e; line-height:1.7; }
.social-app .locked { height:300px; border-radius:18px; color:#fff; }
.social-app .locked strong { font-size:17px; letter-spacing:-.4px; }
.social-app .locked p { font-size:11px; }
.social-app .locked-cta { border-radius:13px; min-height:44px; font-size:12px; }
.social-app .lock-icon { width:45px; height:45px; border-radius:16px; margin-bottom:15px; }
.social-app .lock-icon .icon { width:22px; height:22px; }
.social-app .post-images { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:10px; }
.social-app .post-image { flex:0 0 100%; min-width:0; object-fit:contain; max-height:600px; border-radius:16px; scroll-snap-align:start; }
.post-actions { display:flex; justify-content:space-between; align-items:center; gap:8px; padding-top:7px; }
.social-app .like { margin:0; min-height:44px; gap:7px; }
.social-app .like .icon { width:22px; height:22px; }
.social-app .like span { font-size:10px; }
.post-actions>small { font-size:9px; color:#bda5b0; }
.social-app .profile-detail { border:0; background:white; margin:0; border-radius:0 0 24px 24px; overflow:hidden; }
.social-app .hero-cover { height:170px; object-position:center 28%; }
.social-app .profile-content { padding:0 20px 22px; }
.social-app .profile-content>.avatar { width:80px; height:80px; margin-top:-35px; border:4px solid white; }
.profile-badge { float:right; display:flex; gap:5px; align-items:center; margin-top:15px; color:#a88092; font-size:9px; }
.profile-badge .icon { height:13px; width:13px; }
.social-app .profile-content h1 { font-size:25px; letter-spacing:-.7px; margin:13px 0 3px; }
.social-app .profile-content>small { font-size:10px; color:#b498a5; }
.social-app .profile-content>p { font-size:12px; line-height:1.7; color:#936f7f; margin:16px 0; }
.profile-stats { display:flex; flex-wrap:wrap; gap:17px; font-size:10px; color:#aa8c9a; margin:19px 0; }
.profile-stats strong { color:#704659; font-size:12px; }
.profile-stats .icon { height:13px; width:13px; }
.social-app .profile-subscribe { display:flex; justify-content:space-between; gap:8px; padding:14px 16px; min-height:52px; font-size:12px; }
.profile-subscribe span:last-child { white-space:nowrap; }
.profile-subscribe small { font-size:9px; font-weight:400; }
.profile-subscribe .icon { width:16px; height:16px; margin-left:4px; }
.social-app .profile-content>.profile-plan-note { display:block; text-align:center; margin-top:10px; font-size:9px; }
.profile-tabs { display:flex; justify-content:space-between; align-items:center; padding:22px 20px 15px; font-size:12px; }
.profile-tabs>span { display:flex; align-items:center; gap:7px; color:var(--accent); font-weight:600; }
.profile-tabs .icon { width:16px; height:16px; }
.profile-tabs small { font-size:10px; color:#b698a6; }
.social-app .access-tag { display:flex; gap:8px; align-items:center; font-size:11px; border-radius:14px; }
.social-app .access-tag .icon { width:16px; height:16px; }
.renewal-banner { display:flex; gap:10px; align-items:center; margin:12px 18px 20px; padding:14px; border:1px solid #fce1ed; border-radius:17px; background:#ffedf5; }
.renewal-banner>span:nth-child(2) { flex:1; min-width:0; }
.renewal-banner strong { display:block; color:#853559; font-size:11px; line-height:1.5; }
.renewal-banner small { display:block; color:#ad8295; font-size:10px; margin-top:4px; line-height:1.5; }
.renewal-banner>.icon { height:16px; width:16px; }
.renewal-icon { display:grid; place-items:center; border-radius:12px; background:white; color:var(--accent); width:35px; height:35px; flex-shrink:0; }
.renewal-icon .icon { width:17px; height:17px; }
.renewal-sheet { position:fixed; inset:auto 0 0; width:min(100%,480px); max-width:100%; max-height:90dvh; margin:0 auto; padding:30px 25px max(28px,env(safe-area-inset-bottom)); border:0; border-radius:26px 26px 0 0; background:#fff; color:#32232a; text-align:center; box-shadow:0 -20px 80px #37262e20; }
.renewal-sheet::backdrop { background:#2d202680; backdrop-filter:blur(4px); }
.renewal-sheet>.avatar { width:76px; height:76px; margin:0 auto 18px; display:flex; }
.renewal-sheet>.eyebrow { display:block; font-size:8px; }
.renewal-sheet h2 { font-size:26px; letter-spacing:-.8px; line-height:1.2; margin:14px 0; }
.renewal-sheet p { color:#a68192; font-size:12px; line-height:1.8; margin-bottom:24px; }
.renewal-sheet>.button { width:100%; min-height:52px; border-radius:15px; font-size:13px; }
.sheet-close { position:absolute; right:14px; top:14px; display:grid; place-items:center; border:0; background:#faf3f6; width:40px; height:40px; border-radius:50%; color:#aa8a98; }
.sheet-close .icon { width:18px; height:18px; }
.sheet-later { display:block; background:none; border:0; color:#9a7485; min-height:48px; width:100%; font-size:12px; }
.renewal-sheet>small { display:block; color:#bba1ad; font-size:9px; line-height:1.6; }
.membership-card { background:white; border:1px solid #f5e8ee; border-radius:20px; margin:18px; padding:19px; }
.membership-profile { display:flex; gap:12px; align-items:center; color:inherit; }
.membership-profile .avatar { width:48px; height:48px; }
.membership-profile h2 { font-size:15px; margin:0 0 4px; }
.membership-profile small { font-size:10px; color:#b092a0; }
.membership-profile>.icon { margin-left:auto; color:#ba97a7; width:18px; }
.membership-status { display:inline-block; padding:6px 9px; background:#faf1f5; color:#a1798b; font-size:9px; border-radius:7px; margin-top:16px; }
.membership-status.is-active { background:#edf8f4; color:#46816e; }
.membership-card>p { color:#aa8c9a; font-size:11px; line-height:1.7; }
.membership-card>.button { width:100%; margin-top:6px; font-size:12px; }
.social-app .form-card { background:white; border-radius:20px; padding:22px; margin:18px; }
.social-app .form-card input:not([type=checkbox]),.social-app .form-card textarea,.social-app .form-card select { font-size:16px; min-height:48px; border-radius:12px; }
.social-app .empty { border:0; background:white; border-radius:20px; margin:18px; padding:30px 22px; }
.social-app .empty h2 { font-size:21px; letter-spacing:-.5px; }
.social-app .empty p { font-size:12px; }
.social-app .empty .button { font-size:12px; }
.account-logout { min-height:44px; display:block; margin:20px auto 0; }
.feed-more { margin:12px 18px 24px; width:calc(100% - 36px); }
body:has(.social-app) #notice:not(:empty) { bottom:calc(90px + env(safe-area-inset-bottom)); max-width:calc(100vw - 32px); z-index:12; }
@media(max-width:360px) { .social-app .hero-cover { height:145px; } .social-app .cards { gap:9px; padding:0 14px; } .social-app .card-body { padding-left:10px; padding-right:10px; } .social-app .card-body h2 { font-size:11px; } .social-app .profile-subscribe { padding:14px 12px; font-size:11px; } .social-app .profile-content { padding-left:16px; padding-right:16px; } }
.social-app .locked { background:#4e3741; }
.social-app .locked::after { background:#37262e70; }
.social-app .locked .locked-preview { opacity:.5; }
.social-app .locked p { color:#f2d9e4; }
.social-app .locked .lock-icon { background:#ffffff18; border:1px solid #ffffff24; color:white; }
.suggestion-strip { scroll-padding-inline:18px; }

:root { --accent:#ed0878; --line:#f2e7ed; background:#fff; }
/* One-form checkout with a persistent model identity. */
#app.funnel-app,#app.social-app { background:#fff4f8; }
.funnel-app .funnel-wrap,.social-wrap { background:#fff; }
.app-topbar { background:#fffffff5; }
.button:hover { background:#d50968; }
.button.secondary { background:#fff0f6; color:#c80c64; }
.feed-welcome { background:linear-gradient(125deg,#ed0878,#ff3f96); }
.feed-welcome .eyebrow,.feed-welcome p { color:#fff; }
.funnel-app .offer-plan.monthly { background:linear-gradient(110deg,#ed0878,#ff258a); }
.single-checkout .funnel-wrap { padding-bottom:14px; }
.single-checkout .app-screen { padding:0 20px; }
.checkout-pinned { position:sticky; top:0; z-index:9; background:#fff; box-shadow:0 8px 20px #51213609; padding-bottom:10px; }
.checkout-pinned .app-topbar { position:static; height:60px; padding-top:6px; padding-bottom:6px; }
.checkout-model { margin:0 14px; border:1px solid #f3e8ed; border-radius:18px; overflow:hidden; background:#fff; }
.pinned-cover { display:block; width:100%; height:72px; object-fit:cover; object-position:center 28%; }
.pinned-identity { display:flex; justify-content:space-between; gap:8px; padding:0 12px 12px; align-items:flex-end; }
.pinned-identity>a { display:flex; align-items:flex-end; gap:8px; color:inherit; min-width:0; }
.pinned-identity .avatar { height:48px; width:48px; margin-top:-17px; border:3px solid #fff; position:relative; }
.pinned-identity>a>span { min-width:0; }
.pinned-identity strong { display:block; font-size:12px; overflow-wrap:anywhere; line-height:1.5; }
.pinned-identity small { display:block; font-size:9px; color:#99818d; }
.pinned-identity .verified { display:inline-flex; align-items:center; justify-content:center; width:12px; height:12px; padding:0; }
.pinned-identity .verified .icon { width:8px; height:8px; stroke-width:3; }
.pinned-price { text-align:right; flex-shrink:0; padding-top:6px; }
.pinned-price>strong { font-size:15px; }
.pinned-price>strong small { display:inline; font-size:9px; font-weight:400; }
.pinned-price>a { display:block; font-size:9px; min-height:24px; padding-top:4px; }
.unified-checkout { padding-top:24px; }
.unified-checkout>h1 { font-size:23px; letter-spacing:-.8px; }
.single-checkout .checkout-intro { margin:6px 0 24px; font-size:12px; }
.single-checkout #checkout-account-form { display:block; }
.single-checkout .checkout-section { margin-bottom:25px; }
.checkout-login-link { margin:0 0 18px; font-size:11px; color:#8c7c85; }
.checkout-login-link a { font-weight:600; }
.unified-fields { display:grid; gap:15px; }
.single-checkout #checkout-account-form input:not([type=checkbox]) { background:#fff; border-color:#eadfe5; min-height:50px; }
.single-checkout #checkout-account-form label { color:#73606b; }
.single-checkout .step-icon { color:#ed0878; background:#fff0f6; }
.single-checkout .unified-payment { padding-top:22px; border-top:1px solid #f0e6ec; }
.single-checkout .card-preview { display:grid; gap:15px; padding:0; margin:0; border:0; opacity:1; }
.single-checkout #checkout-account-form .card-preview input { background:#faf7f9; opacity:1; }
.single-checkout .payment-notice { display:flex; align-items:flex-start; gap:8px; padding:12px; border-radius:12px; margin-top:14px; background:#fff1f7; color:#ae426f; }
.single-checkout .payment-notice .icon { width:14px; height:14px; margin-top:2px; }
.single-checkout .payment-notice p { margin:0; font-size:10px; line-height:1.65; color:#936579; }
.single-checkout .unified-total { display:flex; justify-content:space-between; align-items:center; padding:20px 0 15px; border-top:1px solid #f0e6ec; margin-top:17px; font-size:12px; color:#88717e; }
.unified-total strong { font-size:22px; color:#32242c; }
.unified-total strong small { font-size:11px; font-weight:400; margin-left:3px; }
.single-checkout #checkout-account-form .unified-submit { display:flex; justify-content:space-between; width:100%; min-height:54px; border-radius:16px; background:#ed0878; opacity:1; color:#fff; box-shadow:0 5px 14px #ed087820; }
.single-checkout .payment-caption { margin:12px 0; line-height:1.7; color:#8c7581; font-size:10px; }
.checkout-preview-note { display:block; text-align:center; font-size:9px; color:#a18c97; }
.single-checkout input { scroll-margin-top:230px; }
@media(max-width:360px) {
 .single-checkout .app-screen { padding:0 16px; }
 .checkout-model { margin:0 10px; }
 .pinned-cover { height:60px; }
 .pinned-identity { padding:0 9px 9px; }
 .pinned-identity strong { font-size:11px; }
 .pinned-price>strong { font-size:14px; }
 .pinned-identity .avatar { width:42px; height:42px; }
 .unified-checkout>h1 { font-size:21px; }
}
@media(max-height:550px) {
 .checkout-pinned .app-topbar { height:48px; }
 .pinned-cover { height:36px; }
 .pinned-identity .avatar { width:36px; height:36px; margin-top:-10px; }
 .single-checkout input { scroll-margin-top:160px; }
}
.test-mode-banner { margin:0 18px 12px; padding:9px 12px; border:1px dashed #efa9cb; border-radius:10px; background:#fff5fa; color:#ad3f75; font-size:10px; text-align:center; }
.test-checkout-panel { background:#fff2f8; padding:18px; border:1px dashed #efabd0; border-radius:18px; margin:0 0 22px; }
.test-checkout-panel .eyebrow { font-size:8px; }
.test-checkout-panel h2 { margin:8px 0; font-size:19px; }
.test-checkout-panel p { color:#916b7d; font-size:11px; }
.test-checkout-panel .button { display:flex; width:100%; min-height:48px; border-radius:13px; font-size:12px; }
.test-checkout-panel>small { display:block; margin-top:10px; font-size:9px; text-align:center; }
.test-expire { display:block; min-height:44px; margin:12px auto 0; padding:10px; background:none; border:0; color:#b04c7b; font-size:11px; text-decoration:underline; }
.checkout-account>div { min-width:0; }
.checkout-account small { overflow-wrap:anywhere; }
/* Compact administration, shared with the mobile application. */
.admin-app .admin-intro { margin:8px 18px 24px; padding:23px; background:linear-gradient(130deg,#fff0f7,#fff9fc); border:1px solid #f8e3ed; border-radius:22px; }
.admin-intro>.eyebrow { font-size:8px; letter-spacing:1.3px; }
.admin-intro h1 { font-size:27px; line-height:1.2; margin:12px 0; }
.admin-intro p,.admin-description { font-size:12px; color:#947c88; line-height:1.7; }
.admin-stats { display:flex; gap:25px; margin:19px 0; font-size:11px; color:#a18393; }
.admin-stats strong { font-size:23px; display:block; color:#4a2f3c; }
.admin-intro>.button { width:100%; font-size:12px; }
.admin-models { padding:0 18px; display:grid; gap:18px; }
.admin-model-card { border:1px solid #f0e3eb; border-radius:20px; overflow:hidden; background:white; }
.admin-card-cover { display:block; width:100%; height:100px; object-fit:cover; object-position:center 28%; }
.admin-model-body { padding:0 15px 8px; }
.admin-model-identity { display:flex; align-items:center; gap:10px; margin-top:-17px; position:relative; }
.admin-model-identity>.avatar { height:55px; width:55px; border:3px solid white; }
.admin-model-identity>div { padding-top:20px; min-width:0; }
.admin-model-identity h2 { font-size:15px; margin:0 0 4px; }
.admin-model-identity small { font-size:9px; overflow-wrap:anywhere; }
.admin-prices { display:flex; gap:24px; margin:18px 0; color:#9a8290; font-size:10px; }
.admin-prices strong { display:block; margin-top:4px; font-size:16px; color:#49313e; }
.admin-card-actions { display:grid; grid-template-columns:1fr 1.25fr; gap:8px; }
.admin-app .admin-card-actions .button { font-size:11px; padding:10px; min-height:44px; gap:6px; }
.admin-card-actions .icon { width:15px; height:15px; }
.admin-public-link { display:flex; min-height:44px; align-items:center; justify-content:center; gap:7px; font-size:11px; color:#9b7588; }
.admin-public-link .icon { width:14px; height:14px; }
.admin-back { display:flex; align-items:center; gap:5px; padding:4px 18px; min-height:44px; color:#9a7e8c; font-size:11px; }
.admin-back .icon { width:17px; height:17px; }
.admin-editor { margin:8px 18px 24px; }
.admin-editor>h1 { font-size:25px; }
.admin-editor form { display:grid; gap:16px; }
.admin-editor h2 { font-size:14px; margin:12px 0 0; }
.admin-profile-preview { overflow:hidden; border:1px solid #f2e5ec; border-radius:18px; margin:20px 0; }
.admin-profile-preview>.avatar { width:58px; height:58px; position:relative; margin:-22px 0 10px 15px; }
.admin-editor label,.admin-post-card label { font-size:11px; color:#896c7b; }
.admin-editor input,.admin-editor textarea,.admin-editor select,.admin-post-card textarea { font-size:16px; border:1px solid #eadfe5; border-radius:13px; min-height:48px; }
.admin-editor input[readonly] { background:#faf7f9; color:#9a8491; }
.admin-editor form>small { font-size:10px; line-height:1.7; }
.admin-editor .button { font-size:13px; }
.admin-editor .admin-upload { display:grid; grid-template-columns:28px 1fr; align-items:center; gap:10px; padding:15px; border:1px dashed #ebbed3; border-radius:15px; background:#fff8fc; }
.admin-upload>.icon { color:#d54189; width:22px; height:22px; }
.admin-upload small { display:block; font-size:9px; margin-top:4px; }
.admin-upload input { grid-column:1/-1; min-height:40px; font-size:11px; background:#fff; padding:8px; }
.admin-previews { display:flex; gap:8px; overflow-x:auto; font-size:11px; color:#a44e76; }
.admin-previews:empty { display:none; }
.admin-previews img { width:100px; height:100px; flex:0 0 100px; object-fit:cover; border-radius:12px; }
.admin-offer-copy { padding:14px; border:1px solid #f1e3eb; border-radius:14px; }
.admin-offer-copy summary { min-height:30px; font-size:12px; color:#885d72; cursor:pointer; }
.admin-offer-copy label { margin-top:14px; }
.admin-share { margin-top:12px; }
#admin-copy { display:block; margin:7px auto; min-height:44px; }
#admin-copy .icon { width:16px; height:16px; }
.admin-post-owner { display:flex; align-items:center; gap:10px; padding:12px; background:#fff5fa; border-radius:14px; font-size:12px; }
.admin-post-owner .avatar { width:42px; height:42px; }
.admin-post-owner small { display:block; font-size:9px; }
.admin-post-owner>.icon { margin-left:auto; width:16px; height:16px; color:#bc8aa1; }
.admin-posts { margin:0 18px; display:grid; gap:15px; }
.admin-post-card { padding:16px; border:1px solid #f1e3eb; border-radius:18px; }
.admin-post-card form { display:grid; gap:12px; margin-top:15px; }
.admin-post-card .button { font-size:11px; }
.social-app .subtle-discovery { margin:18px 0 22px; }
.social-app .subtle-discovery .section-title h2 { font-size:12px; color:#967d89; }
.social-app .subtle-discovery .suggestion-strip>.profile-card { flex:0 0 190px; border-radius:14px; }
.social-app .subtle-discovery .cover,.social-app .subtle-discovery .card-body>small,.social-app .subtle-discovery .card-price>span,.social-app .subtle-discovery .verified { display:none; }
.social-app .subtle-discovery .card-body { display:grid; grid-template-columns:38px 1fr; column-gap:9px; padding:12px; align-items:center; }
.social-app .subtle-discovery .card-body>.avatar { grid-row:1/3; width:38px; height:38px; border:0; margin:0; }
.social-app .subtle-discovery .card-body h2 { font-size:11px; margin:0; }
.social-app .subtle-discovery .card-price { border:0; padding:0; margin:3px 0 0; }
.social-app .subtle-discovery .card-price strong { font-size:10px; font-weight:500; color:#a18494; }
.admin-editor .admin-upload { position:relative; cursor:pointer; }
.admin-editor .admin-upload input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.admin-upload>span::after { content:'Toque para selecionar'; display:block; margin-top:9px; color:#d11673; font-size:10px; font-weight:600; }
.admin-upload:focus-within { outline:2px solid #ed0878; outline-offset:3px; }
/* Owner workspace: independent from the subscriber application. */
#app.admin-workspace { display:grid; grid-template-columns:240px minmax(0,1fr); max-width:none; min-height:100vh; padding:0; background:#f6f7fa; color:#292936; }
.workspace-sidebar { position:sticky; top:0; height:100vh; padding:32px 20px; background:white; border-right:1px solid #e9e9ef; display:flex; flex-direction:column; }
.workspace-brand { display:flex; align-items:center; gap:9px; color:#272732; font-size:22px; font-weight:750; }
.workspace-brand>span { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; background:#ed0878; color:white; }
.workspace-brand small { font-size:9px; letter-spacing:2px; color:#a48194; }
.workspace-sidebar>p { margin:45px 12px 14px; font-size:10px; letter-spacing:1.5px; color:#9695a2; }
.workspace-sidebar nav { display:grid; gap:7px; }
.workspace-sidebar .nav-link { display:flex; flex-direction:row; gap:12px; justify-content:flex-start; padding:13px; border-radius:9px; color:#727180; font-size:13px; }
.workspace-sidebar .nav-link.selected { background:#fff0f7; color:#d4076c; font-weight:600; }
.workspace-sidebar .icon { width:19px; height:19px; flex-shrink:0; }
.workspace-footer { margin-top:auto; display:grid; gap:18px; padding:20px 12px 0; }
.workspace-footer a { display:flex; gap:12px; align-items:center; color:#727180; font-size:12px; }
.workspace-footer small { color:#a09eaa; font-size:10px; }
.workspace-body { min-width:0; }
.workspace-header { height:78px; background:white; border-bottom:1px solid #e9e9ef; display:flex; align-items:center; justify-content:space-between; padding:0 36px; font-size:13px; color:#777583; }
.workspace-header b { padding:0 13px; color:#c8c6ce; font-weight:400; }
.admin-role { display:flex; align-items:center; gap:7px; background:#faf8fb; border:1px solid #ece9ef; padding:8px 12px; border-radius:20px; font-size:11px; }
.admin-role .icon { width:14px; height:14px; }
.admin-workspace .workspace-main { display:block; width:100%; max-width:1400px; padding:32px 36px 60px; margin:0 auto; border:0; background:transparent; }
.admin-workspace .admin-intro { display:grid; grid-template-columns:1fr auto; margin:0 0 30px; padding:0; background:none; border:0; border-radius:0; gap:0 30px; }
.admin-intro .eyebrow { grid-column:1/-1; color:#9994a3; }
.admin-workspace .admin-intro h1 { font-size:30px; margin:8px 0; }
.admin-workspace .admin-intro p { grid-column:1; font-size:13px; margin:0; }
.admin-workspace .admin-intro>.button { grid-column:2; grid-row:2/4; width:auto; align-self:center; padding:13px 20px; font-size:13px; border-radius:9px; }
.admin-workspace .admin-stats { grid-column:1/-1; border-top:1px solid #e5e4eb; padding-top:20px; margin:24px 0 0; gap:40px; }
.admin-workspace .section-title { margin:0 0 18px; padding:0; }
.admin-workspace .section-title h2 { font-size:16px; }
.admin-workspace .admin-models { padding:0; grid-template-columns:repeat(auto-fill,minmax(265px,1fr)); gap:22px; }
.admin-workspace .admin-model-card { border-radius:12px; border-color:#e6e5ec; box-shadow:0 3px 8px #25243c03; }
.admin-workspace .admin-card-cover { height:145px; }
.admin-workspace .admin-model-body { padding:0 20px 10px; }
.admin-workspace .admin-model-identity h2 { font-size:17px; }
.admin-workspace .admin-model-identity small { font-size:11px; }
.admin-workspace .admin-model-identity>.avatar { width:64px; height:64px; }
.admin-workspace .button { border-radius:8px; box-shadow:none; min-height:42px; }
.admin-card-footer { display:flex; justify-content:space-between; align-items:center; margin-top:10px; }
.delete-link { display:flex; align-items:center; gap:6px; background:none; border:0; color:#b34254; font-size:11px; padding:12px 0; cursor:pointer; }
.delete-link .icon { width:15px; height:15px; }
.admin-workspace .admin-back { padding:0; margin-bottom:12px; }
.admin-workspace .admin-editor { margin:0 0 28px; }
.admin-workspace .admin-editor>h1 { font-size:28px; margin:8px 0; }
.admin-workspace .admin-description { font-size:13px; }
.admin-edit-layout { display:grid; grid-template-columns:minmax(250px,.85fr) minmax(320px,1.4fr); align-items:start; gap:28px; margin-top:26px; }
.admin-visual-editor,#admin-model-form,#admin-post-form,.admin-workspace .admin-post-card { background:white; padding:24px; border:1px solid #e6e5ec; border-radius:12px; }
.admin-workspace .admin-profile-preview { margin:0 0 24px; border-radius:10px; }
.admin-workspace .admin-profile-preview>.avatar { height:76px; width:76px; margin-top:-32px; border:4px solid white; }
.admin-workspace .admin-upload { margin:14px 0; min-height:100px; background:#fcfafd; border-color:#d7c8d5; border-radius:9px; }
.admin-workspace .admin-upload small { font-size:11px; }
.admin-workspace .admin-upload>span::after { content:'Clique para escolher o arquivo'; font-size:11px; }
.admin-workspace .admin-editor label,.admin-workspace .admin-post-card label { font-size:12px; color:#686272; }
.admin-workspace .admin-editor input,.admin-workspace .admin-editor textarea,.admin-workspace .admin-editor select,.admin-workspace .admin-post-card textarea { font-size:14px; border-radius:7px; min-height:44px; }
.admin-workspace .admin-editor h2 { font-size:15px; color:#35303e; }
.admin-workspace #admin-post-form { max-width:740px; }
.admin-workspace .admin-posts { margin:0; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); }
.admin-workspace .admin-previews img { width:110px; height:110px; }
.admin-workspace .admin-share { max-width:600px; }
.admin-workspace #admin-copy { margin:5px 0; }
.delete-dialog { border:1px solid #e5dde3; border-radius:16px; padding:28px; max-width:460px; width:calc(100% - 32px); color:#39303a; }
.delete-dialog::backdrop { background:#25203280; }
.delete-dialog h2 { font-size:21px; }
.delete-dialog p { font-size:13px; line-height:1.6; }
.delete-dialog>div { display:flex; gap:12px; margin-top:24px; }
.button.danger { background:#bf2947; }
.top-account { overflow:hidden; flex-shrink:0; }
.top-account>.icon,.top-account .placeholder>.icon { width:21px; height:21px; margin:0; }
.top-account>.avatar { margin:0; object-fit:cover; }
.brand-letter { display:grid; place-items:center; font-size:23px; font-weight:750; line-height:1; color:#ed0878; }
@media(max-width:900px) { #app.admin-workspace { grid-template-columns:190px minmax(0,1fr); } .admin-workspace .workspace-main { padding:24px; } .admin-edit-layout { grid-template-columns:1fr; } .workspace-brand small { display:none; } }
@media(max-width:600px) { #app.admin-workspace { display:block; } .workspace-sidebar { position:relative; height:auto; padding:16px; } .workspace-sidebar>p,.workspace-footer { display:none; } .workspace-sidebar nav { display:flex; margin-top:15px; flex-wrap:wrap; } .workspace-sidebar .nav-link { font-size:11px; padding:8px; } .workspace-header { padding:16px; height:60px; } .admin-role { display:none; } .admin-workspace .workspace-main { padding:20px 16px; } .admin-workspace .admin-intro { display:block; } .admin-workspace .admin-intro>.button { margin:18px 0; } }
.admin-workspace .admin-models { grid-template-columns:repeat(auto-fit,minmax(265px,1fr)); }
.admin-workspace h1,.admin-workspace h2 { font-family:inherit; }
/* Subscriber post footer and balanced public teaser. Original photos stay protected. */
.post-actions { flex-direction:row-reverse; }
.social-app .locked .locked-preview { inset:-5%; width:110%; height:110%; filter:blur(12px); opacity:.82; }
.social-app .locked::after { background:linear-gradient(180deg,#30202a26,#30202a80); }
.social-app .locked strong,.social-app .locked p { text-shadow:0 1px 8px #20111c90; }
/* Media library and immersive viewer. */
.gallery-tabs { display:flex; padding:18px 18px 0; border-bottom:1px solid #f0e5eb; gap:22px; }
.gallery-tabs button { border:0; background:none; color:#927c88; padding:12px 4px; font:inherit; font-size:13px; border-bottom:3px solid transparent; cursor:pointer; }
.gallery-tabs button[aria-pressed=true] { color:#ed0878; border-bottom-color:#ed0878; font-weight:700; }
.gallery-count { padding:0 18px; font-size:11px; color:#9b8591; }
.media-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; padding:0 3px 20px; }
.media-tile { position:relative; aspect-ratio:var(--publication-ratio); min-width:0; padding:0; border:0; overflow:hidden; background:#e8dae2; cursor:pointer; }
.media-tile img,.media-tile video,.media-tile>.placeholder { width:100%; height:100%; object-fit:cover; }
.media-tile.is-locked .tile-preview { filter:blur(8px); transform:scale(1.12); opacity:.78; }
.tile-kind { position:absolute; right:8px; bottom:8px; color:white; background:#271d326b; padding:5px; border-radius:7px; display:flex; }
.tile-kind .icon { width:17px; height:17px; }
.gallery-empty { grid-column:1/-1; text-align:center; padding:30px 15px; color:#9b8591; font-size:13px; }
.feed-media { position:relative; flex:0 0 100%; min-width:0; scroll-snap-align:start; }
.feed-media>.post-image { display:block; width:100%; }
.open-media { position:absolute; right:12px; top:12px; border:0; border-radius:50%; width:40px; height:40px; display:grid; place-items:center; background:#ffffffdd; color:#7e526c; cursor:pointer; }
.open-media .icon { width:21px; height:21px; }

/* White social viewer: edge-to-edge media, compact chrome, natural proportions. */
body.viewer-open { overflow:hidden; }
.media-viewer { width:100vw; height:100dvh; max-width:none; max-height:none; margin:0; padding:0 0 max(24px,env(safe-area-inset-bottom)); border:0; background:#fff; color:#392e35; overflow:auto; }
.media-viewer[open] { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:0; }
.media-viewer::backdrop { background:#fff; }
.viewer-content { width:100%; max-width:540px; min-width:0; flex-shrink:0; order:0; }
.viewer-heading { display:flex; align-items:center; gap:10px; min-height:72px; padding:12px 66px 12px 16px; margin:0; background:white; }
.media-viewer .viewer-heading .avatar { width:38px; height:38px; border:0; margin:0; object-fit:cover; }
.viewer-heading strong { display:block; font-size:13px; font-weight:650; }
.viewer-heading small { display:block; font-size:10px; margin-top:3px; color:#9c8691; }
.viewer-close { position:fixed; right:max(12px,calc((100vw - 540px)/2 + 12px)); top:14px; width:42px; height:42px; border:1px solid #f0e6ec; border-radius:50%; background:#fff; color:#876b7a; display:grid; place-items:center; z-index:4; cursor:pointer; }
.viewer-close .icon { width:20px; height:20px; }
.viewer-stage { width:100%; height:auto; min-height:0; background:#fff; display:flex; justify-content:center; border-radius:0; overflow:hidden; touch-action:none; }
.viewer-media { display:block; width:100%; height:auto; max-height:78dvh; object-fit:contain; background:#fff; }
.viewer-stage img { user-select:none; -webkit-user-drag:none; }
.viewer-actions { display:flex; align-items:center; justify-content:space-between; padding:6px 16px 0; border:0; min-height:52px; }
.viewer-actions>small { display:flex; align-items:center; gap:5px; color:#a38c99; font-size:10px; }
.viewer-actions>small .icon { width:12px; height:12px; }
.viewer-like { border:0; background:none; display:flex; align-items:center; gap:7px; color:#927786; font-size:11px; min-height:44px; cursor:pointer; padding:0; }
.viewer-like .icon { width:23px; height:23px; }
.viewer-like[aria-pressed=true] { color:#ed0878; }
.viewer-like[aria-pressed=true] .icon { fill:currentColor; }
.viewer-like:disabled { opacity:.5; cursor:default; }
.viewer-caption { font-size:12px; line-height:1.7; white-space:pre-wrap; color:#8b7480; margin:0; padding:0 16px 12px; }
.viewer-controls { display:flex; justify-content:center; align-items:center; gap:12px; padding:0; }
.viewer-controls button { width:36px; height:36px; border-radius:50%; background:#fff4f9; color:#d3297c; border:0; display:grid; place-items:center; cursor:pointer; }
.viewer-controls .icon { width:16px; height:16px; }
.viewer-counter { font-size:10px; min-width:38px; text-align:center; color:#a08795; }
.viewer-hint { font-size:9px; color:#b19aa7; text-align:center; margin:5px 0 16px; }
.viewer-error { color:#b92662; font-size:12px; margin:0; padding:0 16px; }
.viewer-error:empty { display:none; }
.viewer-controls[hidden],.viewer-hint[hidden] { display:none; }
.media-viewer .viewer-recommendations { order:1; width:100%; max-width:540px; position:static; height:auto; min-height:0; display:block; padding:18px 0; border:0; border-top:6px solid #faf6f8; background:#fff; margin-top:8px; flex-shrink:0; }
.viewer-recommendations h2 { font-family:inherit; font-size:12px; font-weight:600; margin:0 16px 14px; color:#806774; }
.viewer-suggestions { display:flex; gap:10px; overflow-x:auto; padding:0 16px 5px; scrollbar-width:none; }
.viewer-suggestion { display:flex; align-items:center; gap:10px; border:1px solid #f1e5ec; border-radius:14px; padding:12px; background:#fff; color:#4e3844; flex:0 0 205px; }
.media-viewer .viewer-suggestion .avatar { width:42px; height:42px; border:0; margin:0; object-fit:cover; flex-shrink:0; }
.viewer-suggestion strong { display:block; font-size:11px; font-weight:600; }
.viewer-suggestion small { display:block; margin:3px 0; color:#ed0878; font-size:10px; }
.viewer-suggestion b { font-size:9px; font-weight:400; color:#a58a99; }
.viewer-locked { width:100%; min-height:390px; position:relative; display:grid; place-items:center; overflow:hidden; text-align:center; background:#f9edf3; }
.viewer-blur { position:absolute; width:110%; height:110%; object-fit:cover; filter:blur(14px); opacity:.4; }
.viewer-locked>div:not(.placeholder) { position:relative; padding:24px; }
.viewer-locked .icon { width:26px; height:26px; color:#9d3568; }
.viewer-locked h2 { font-family:inherit; font-size:22px; color:#4c2639; }
.viewer-locked p { font-size:12px; color:#705260; }
.viewer-locked .button { font-size:12px; border-radius:12px; }
.admin-previews video { width:150px; height:110px; object-fit:contain; border-radius:10px; background:#1c1721; }
@media(min-width:1050px){
 .media-viewer[open] { display:grid; grid-template-columns:210px 540px; align-items:start; justify-content:center; gap:32px; padding-top:24px; }
 .viewer-content { grid-column:2; grid-row:1; }
 .media-viewer .viewer-recommendations { grid-column:1; grid-row:1; border:0; padding-top:62px; margin:0; }
 .viewer-suggestions { flex-direction:column; padding:0; }
 .viewer-suggestion { flex:0 0 auto; }
 .viewer-recommendations h2 { margin-left:0; }
 .viewer-close { right:calc((100vw - 782px)/2 + 12px); top:38px; }
}
.feed-media:has(img) .open-media { inset:0; width:100%; height:100%; border-radius:16px; background:transparent; place-items:start end; padding:12px; }
.feed-media:has(img) .open-media .icon { box-sizing:content-box; padding:9px; border-radius:50%; background:#ffffffdd; }
/* Touch-first carousel and a compact, branded video player. */
.viewer-content { overflow:hidden; }
.viewer-frame { width:100%; flex:0 0 100%; position:relative; }
.viewer-frame.social-video { aspect-ratio:var(--publication-ratio); max-height:none; overflow:hidden; background:#faf5f8; }
.social-video .viewer-media { width:100%; height:100%; max-height:none; object-fit:cover; }
.social-video.show-whole .viewer-media { object-fit:contain; }
.video-play { position:absolute; inset:0; margin:auto; width:64px; height:64px; border:1px solid #ffffff70; border-radius:50%; background:#ffffffd9; color:#ed0878; display:grid; place-items:center; font-size:25px; padding-left:6px; box-shadow:0 5px 24px #54223b22; transition:opacity .2s; }
.video-play.is-playing { opacity:0; }
.video-play.is-playing:focus-visible,.video-play.is-playing:hover { opacity:1; }
.video-kind { position:absolute; top:16px; left:16px; border-radius:20px; padding:6px 10px; background:#30212b45; color:#fff; font-size:9px; font-weight:650; letter-spacing:1px; pointer-events:none; }
.video-tools { position:absolute; right:12px; bottom:42px; display:flex; gap:7px; }
.video-tools button { border:1px solid #ffffff40; background:#2e202b65; color:#fff; border-radius:22px; padding:9px 12px; min-height:36px; font-size:10px; }
.video-tools [data-fit] { font-size:19px; padding:3px 10px; }
.video-timeline { position:absolute; bottom:0; left:0; right:0; display:flex; gap:10px; align-items:center; padding:16px 14px 10px; background:linear-gradient(transparent,#21101e66); }
.video-time { flex-shrink:0; color:#fff; font-size:9px; font-variant-numeric:tabular-nums; }
.video-timeline input { width:100%; min-width:0; padding:0; height:18px; margin:0; border:0; accent-color:#ed0878; cursor:pointer; }
.viewer-controls { position:relative; min-height:28px; padding:4px 16px; }
.viewer-controls>.viewer-counter { position:absolute; right:16px; font-size:9px; }
.viewer-controls>[data-prev],.viewer-controls>[data-next] { display:none; }
.viewer-dots { display:flex; justify-content:center; gap:5px; max-width:80%; overflow:auto; scrollbar-width:none; }
.viewer-dots button { display:block; width:7px; min-width:7px; height:7px; padding:0; border:0; border-radius:50%; background:#e7dbe2; }
.viewer-dots button[aria-pressed=true] { width:19px; min-width:19px; border-radius:5px; background:#ed0878; }
.viewer-hint { display:none; }
.viewer-actions { padding-top:0; min-height:42px; }
.viewer-caption { padding-bottom:18px; }
@media(min-width:761px){.viewer-controls>[data-prev],.viewer-controls>[data-next] { display:grid; width:28px; height:28px; } .viewer-dots { order:1; } .viewer-controls>[data-next] { order:2; }}
@media(prefers-reduced-motion:reduce){.video-play { transition:none; }}
.video-timeline input { appearance:none; -webkit-appearance:none; height:22px; background:transparent; border-radius:0; }
.video-timeline input::-webkit-slider-runnable-track { height:3px; background:#ffffffa6; border-radius:4px; }
.video-timeline input::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:11px; height:11px; margin-top:-4px; background:#ed0878; border-radius:50%; border:2px solid white; }
.video-timeline input::-moz-range-track { height:3px; background:#ffffffa6; border-radius:4px; }
.video-timeline input::-moz-range-thumb { width:9px; height:9px; background:#ed0878; border:2px solid white; border-radius:50%; }
.viewer-dots { gap:0; }
.viewer-dots button,.viewer-dots button[aria-pressed=true] { width:28px; min-width:28px; height:28px; background:transparent; border-radius:0; display:grid; place-items:center; }
.viewer-dots button::after { content:''; width:6px; height:6px; background:#e7dbe2; border-radius:50%; }
.viewer-dots button[aria-pressed=true]::after { width:18px; border-radius:5px; background:#ed0878; }
.video-play:focus-visible,.video-tools button:focus-visible,.viewer-dots button:focus-visible { outline:2px solid #ed0878; outline-offset:3px; }
/* A consistent landscape preview; playback expands to the original ratio. */
.media-tile,.viewer-frame,.viewer-frame.social-video { aspect-ratio:var(--publication-ratio); }
.viewer-frame { overflow:hidden; }
.viewer-frame>.viewer-media { width:100%; height:100%; max-height:none; object-fit:cover; }
.viewer-frame.social-video { max-height:none; }
.viewer-frame.social-video.show-whole { aspect-ratio:var(--video-ratio,4/3); max-height:78dvh; }
.viewer-frame.social-video.show-whole>.viewer-media { object-fit:contain; }
.viewer-frame>.viewer-locked { min-height:0; height:100%; }
.social-app .feed-media { aspect-ratio:var(--publication-ratio); overflow:hidden; }
.social-app .feed-media>.post-image { width:100%; height:100%; max-height:none; object-fit:cover; border-radius:0; }
.social-app .feed-media>.open-media { inset:0; width:100%; height:100%; border-radius:0; background:transparent; }
.social-app .feed-media>.open-media .icon { position:absolute; right:12px; top:12px; background:#ffffffdf; padding:10px; width:40px; height:40px; border-radius:50%; }
.social-app .feed-media>.open-media.is-video .icon { inset:0; margin:auto; width:58px; height:58px; padding:18px; color:#ed0878; }
.discovery-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; padding-right:16px; }
.discovery-heading h2 { margin-bottom:0; }
.discovery-heading { margin-bottom:14px; }
.discovery-dismiss { background:none; border:0; color:#977b88; font-size:10px; padding:10px 4px; white-space:nowrap; }
.media-viewer .viewer-recommendations[hidden],.discover-section[hidden] { display:none; }
.social-app .feed-posts .post { display:flex; flex-direction:column; padding:0; margin:0; border:0; border-bottom:6px solid #faf6f8; border-radius:0; box-shadow:none; }
.social-app .feed-posts .post-header { order:0; padding:14px 16px; }
.social-app .feed-posts .post-images,.social-app .feed-posts .post>.locked { order:1; margin:0; border-radius:0; }
.social-app .feed-posts .post-images { gap:3px; }
.social-app .feed-posts .post-actions { order:2; padding:12px 16px 0; margin:0; }
.social-app .feed-posts .post>p { order:3; padding:8px 16px 18px; margin:0; font-size:12px; color:#8b7480; }
.social-app .feed-posts .post>.locked { aspect-ratio:var(--publication-ratio); height:auto; min-height:0; }
.social-app .post-caption .post-author { color:#3d2a33; font-weight:700; }
.social-app .post-caption .post-author:hover { color:var(--accent); }
.social-app .post-caption .post-date { display:block; margin-top:8px; font-size:10px; color:#a08b95; }
.social-app .feed-media>.open-media:focus-visible { outline:3px solid var(--accent); outline-offset:-3px; }

/* Fixed preview boxes: intrinsic image/video dimensions must never resize a post or grid cell. */
.social-app .post-images { align-items:flex-start; }
.social-app .feed-media,.media-tile { aspect-ratio:var(--publication-ratio); min-height:0; height:auto; }
.social-app .feed-media>.post-image,.media-tile>img,.media-tile>video,.media-tile>.placeholder { position:absolute; inset:0; width:100%; height:100%; max-height:none; object-fit:cover; display:block; }
/* Social discovery: identity first, quiet navigation, deliberate spacing. */
.social-app .social-topbar { min-height:66px; height:66px; padding:0 20px; gap:16px; background:#ffffffef; border-bottom:1px solid #f0edf0; box-shadow:none; backdrop-filter:blur(16px); }
.social-app .social-topbar .app-brand { width:auto; height:auto; background:none; box-shadow:none; margin:0; padding:0; }
.social-wordmark { font-family:inherit; font-size:25px; font-weight:800; letter-spacing:-1.3px; color:#28232a; }
.social-wordmark>span { color:#ed0878; }
.social-app .social-topbar .app-topbar-title { flex:1; text-align:left; min-width:0; }
.social-app .social-topbar .app-topbar-title strong { font-family:inherit; font-size:14px; font-weight:600; color:#746b73; letter-spacing:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; }
.social-app .social-topbar .top-account { width:38px; height:38px; min-width:38px; border:1px solid #eee8ed; background:#faf7f9; box-shadow:none; color:#5b4855; }
.account-initial { font-size:13px; font-weight:700; }
.social-app .social-topbar .app-back { width:38px; height:38px; border:0; box-shadow:none; background:#f7f4f6; }
.explore-page { padding:26px 18px 28px; }
.explore-heading h1 { font-family:inherit; font-size:27px; font-weight:750; letter-spacing:-1px; line-height:1.18; max-width:330px; margin:0 0 10px; color:#302831; }
.explore-heading p { font-size:13px; line-height:1.6; color:#8b8089; margin:0 0 22px; max-width:330px; }
.explore-search { display:flex; align-items:center; gap:10px; min-height:50px; padding:0 14px; background:#f6f4f6; border:1px solid transparent; border-radius:14px; }
.explore-search:focus-within { background:white; border-color:#ed0878; box-shadow:0 0 0 3px #ed08780c; }
.explore-search>.icon { width:20px; height:20px; flex-shrink:0; color:#9c8c97; }
.explore-search input { min-width:0; padding:14px 0; border:0; border-radius:0; background:transparent; font-size:13px; outline:none; box-shadow:none; }
.explore-search input:focus { outline:none; }
.explore-search input::-webkit-search-cancel-button { display:none; }
.explore-search button { border:0; background:none; padding:8px; color:#8b7984; }
.explore-search button[hidden] { display:none; }
.explore-search button .icon { width:16px; height:16px; }
.explore-filters { display:flex; gap:8px; margin:16px 0 28px; }
.explore-filters button { min-height:38px; padding:9px 14px; border:1px solid #eee8ed; background:white; color:#897985; border-radius:24px; font-size:11px; font-weight:600; }
.explore-filters button[aria-pressed=true] { background:#352c34; color:white; border-color:#352c34; }
.explore-results-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; gap:12px; }
.explore-results-heading h2 { font-size:14px; font-family:inherit; letter-spacing:-.2px; margin:0; color:#463b44; }
.explore-results-heading>span { font-size:11px; color:#9e8d99; }
.discovery-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:18px; }
.social-app .community-card { text-align:left; border:1px solid #eee8ec; border-radius:18px; overflow:hidden; transition:border-color .15s; }
.social-app .community-card:hover { border-color:#e5b8ce; box-shadow:none; }
.social-app .community-card:focus-visible { outline:2px solid #ed0878; outline-offset:3px; }
.social-app .community-card>.cover { height:132px; display:block; width:100%; object-fit:cover; object-position:center 38%; }
.social-app .community-card .card-body { position:relative; padding:0 16px 17px; }
.social-app .community-card .card-body>.avatar { width:58px; height:58px; margin-top:-29px; border:3px solid white; box-shadow:0 0 0 1px #f1e9ed; }
.social-app .community-card .card-body h2 { margin:9px 36px 2px 0; font-size:16px; font-weight:700; letter-spacing:-.3px; }
.social-app .community-card .card-body>small { font-size:11px; color:#9a8794; }
.community-open { position:absolute; right:16px; top:14px; display:grid; place-items:center; width:30px; height:30px; border-radius:50%; color:#ab8b9e; background:#faf5f8; }
.community-open .icon { width:16px; height:16px; }
.social-app .community-card .community-bio { font-size:12px; line-height:1.6; color:#877580; min-height:0; margin:10px 0 0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.community-member { display:inline-flex; align-items:center; gap:5px; font-size:10px; color:#886779; margin-top:12px; }
.community-member .icon { width:12px; height:12px; }
.explore-empty { text-align:center; padding:40px 16px; grid-column:1/-1; }
.explore-empty>.icon { width:30px; height:30px; color:#c0a8b5; }
.explore-empty h2 { font-size:16px; margin-top:18px; }
.explore-empty p { font-size:13px; color:#99828e; }
.suggestion-strip .community-card .community-bio { display:none; }
@media(min-width:700px){.discovery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.social-app .discovery-grid .community-card>.cover { height:110px; }}
@media(prefers-reduced-motion:reduce){.social-app .community-card { transition:none; }}
.social-app .social-topbar { display:flex; align-items:center; }
.social-app .social-topbar .app-brand,.social-app .social-topbar .app-back { flex-shrink:0; }
.social-app .social-topbar .top-account { margin-left:auto; }
/* Feed composition: familiar social posts, dedicated desktop columns. */
.feed-page .feed-section-heading { display:flex; align-items:center; justify-content:space-between; padding:18px 16px 12px; border-top:1px solid #f2edf0; }
.feed-section-heading h1 { font-size:15px; letter-spacing:-.3px; margin:0; }
.feed-section-heading>span { font-size:11px; color:#a08d98; }
.feed-page .following-strip { padding:18px 16px; gap:18px; scrollbar-width:none; background:white; }
.feed-page .following-strip>a { flex-basis:62px; font-size:11px; color:#6c5663; gap:8px; }
.feed-page .following-strip .avatar { width:62px; height:62px; padding:3px; border:1px solid #edccd9; }
.feed-post-author { order:0; display:flex; align-items:center; gap:10px; padding:14px 16px; color:#342b32; }
.feed-post-author .avatar { width:38px; height:38px; border:0; }
.feed-post-author>span { flex:1; min-width:0; }
.feed-post-author strong { display:block; font-size:13px; font-weight:650; }
.feed-post-author small { display:block; margin-top:2px; font-size:10px; color:#9b8591; }
.feed-post-author>.icon { width:17px; height:17px; color:#ae99a4; }
.feed-page .feed-posts .post { border-bottom:1px solid #ede5ea; margin-bottom:10px; }
.feed-page .feed-posts .post-actions { padding-top:5px; }
.feed-page .feed-posts .post-caption { font-size:13px; line-height:1.6; color:#76626e; }
.feed-desktop-rail { display:none; }
@media(min-width:1100px){
 #app.social-app.feed-page { background:#faf9fa; }
 .feed-page .social-wrap { max-width:1180px; display:grid; grid-template-columns:190px minmax(0,580px) 270px; column-gap:32px; align-items:start; padding:0 22px 40px; background:transparent; box-shadow:none; }
 .feed-page .social-topbar { grid-column:2; grid-row:1; position:sticky; top:0; z-index:8; border-left:1px solid #eee8ec; border-right:1px solid #eee8ec; }
 .feed-page .social-main { grid-column:2; grid-row:2; width:100%; padding-bottom:0; background:white; border:1px solid #eee8ec; border-top:0; }
 .feed-page .bottom-nav { grid-column:1; grid-row:1 / span 2; position:sticky; top:0; left:auto; bottom:auto; transform:none; width:100%; max-width:none; height:100dvh; display:flex; flex-direction:column; justify-content:flex-start; gap:8px; padding:32px 0; background:transparent; border:0; box-shadow:none; backdrop-filter:none; }
 .feed-page .bottom-nav::before { content:'apolis.'; display:block; padding:0 12px 30px; font-size:30px; font-weight:800; letter-spacing:-1.6px; color:#302530; }
 .feed-page .bottom-nav .nav-link { flex:none; flex-direction:row; align-items:center; text-align:left; gap:14px; min-height:48px; padding:12px; font-size:14px; border-radius:12px; color:#8a7682; }
 .feed-page .bottom-nav .nav-link.selected { background:#fcebf3; color:#db0063; }
 .feed-page .bottom-nav .nav-link:hover { background:#f2edf0; }
 .feed-page .feed-desktop-rail { grid-column:3; grid-row:1 / span 2; display:block; position:sticky; top:0; height:auto; width:auto; padding:30px 0; border:0; }
 .feed-rail-intro h2 { font-family:inherit; font-size:20px; letter-spacing:-.5px; margin:0 0 8px; }
 .feed-rail-intro p { color:#a08c98; font-size:12px; line-height:1.7; margin:0 0 30px; }
 .feed-rail-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
 .feed-rail-heading h3 { font-size:12px; color:#88727f; margin:0; }
 .feed-rail-heading>a { font-size:11px; }
 .feed-rail-profile { display:flex; align-items:center; gap:10px; padding:12px 0; color:#483642; }
 .feed-rail-profile .avatar { width:40px; height:40px; border:0; }
 .feed-rail-profile>span { flex:1; min-width:0; }
 .feed-rail-profile strong { font-size:12px; display:block; }
 .feed-rail-profile small { font-size:10px; display:block; color:#ab92a0; }
 .feed-rail-profile>.icon { width:15px; height:15px; color:#ad8f9f; }
 .feed-rail-discover { display:flex; align-items:center; gap:10px; padding:16px 0; margin-top:16px; border-top:1px solid #ebe3e8; font-size:12px; }
 .feed-rail-discover .icon { width:18px; height:18px; }
 .feed-rail-note,.feed-rail-empty { font-size:11px; color:#b09aa7; line-height:1.7; }
}
/* Visible media navigation and the model's complete library. */
.viewer-media-shell { position:relative; }
.viewer-arrow { position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:42px; height:42px; border:1px solid #ffffffb0; border-radius:50%; background:#ffffffdf; color:#5d3d50; box-shadow:0 2px 12px #35202a18; display:grid; place-items:center; padding:0; }
.viewer-arrow-prev { left:10px; }
.viewer-arrow-next { right:10px; }
.viewer-arrow .icon { width:22px; height:22px; }
.viewer-arrow[hidden] { display:none; }
.viewer-arrow:focus-visible { outline:3px solid #ed0878; outline-offset:2px; }
.viewer-library { border-top:6px solid #faf6f8; padding:20px 0 8px; }
.viewer-library-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 16px 15px; }
.viewer-library-heading h2 { font-family:inherit; font-size:14px; font-weight:650; letter-spacing:-.2px; margin:0; }
.viewer-library-count { font-size:10px; color:#a18a96; white-space:nowrap; }
.viewer-library-status { font-size:12px; color:#927687; padding:0 16px; }
.viewer-library-status:empty { display:none; }
.viewer-library-status button { border:0; background:none; color:#db0063; text-decoration:underline; padding:8px; }
.viewer-library-grid { gap:3px; padding:0 0 12px; }
.viewer-library-grid .media-tile { aspect-ratio:var(--publication-ratio); }
.viewer-library-grid .media-tile[aria-pressed=true] { outline:3px solid #ed0878; outline-offset:-3px; }
.viewer-current { position:absolute; bottom:7px; left:5px; right:5px; font-size:8px; font-weight:600; color:white; background:#d60063df; border-radius:5px; padding:4px 2px; }
.viewer-library-grid .tile-kind { top:6px; bottom:auto; right:6px; padding:4px; }
.viewer-library-grid .tile-kind .icon { width:13px; height:13px; }
.viewer-controls { min-height:36px; }
.viewer-views { position:absolute; left:16px; display:flex; align-items:center; gap:4px; font-size:10px; color:#987e8e; white-space:nowrap; }
.viewer-views>.icon { width:13px; height:13px; }
.viewer-views>span { font-size:8px; }
.viewer-controls .viewer-dots { max-width:30%; margin-left:25%; }
.viewer-load-more { display:block; width:calc(100% - 32px); margin:4px 16px 14px; min-height:44px; border:1px solid #eedee7; border-radius:12px; color:#b82a68; background:#fff; font-size:12px; font-weight:600; }
.viewer-load-more[hidden] { display:none; }
.media-viewer .viewer-content>.viewer-recommendations { width:100%; max-width:none; padding:18px 0; margin:0; border:0; border-top:6px solid #faf6f8; }
.viewer-content>.viewer-recommendations .viewer-suggestions { display:flex; flex-direction:row; gap:12px; padding:0 16px 8px; overflow-x:auto; overscroll-behavior-x:contain; touch-action:pan-x pan-y; scrollbar-width:none; }
.viewer-content>.viewer-recommendations .viewer-suggestion { flex:0 0 82%; min-width:0; padding:18px 14px; }
.viewer-content>.viewer-recommendations h2 { margin-left:16px; }
.viewer-content>.viewer-recommendations .viewer-suggestion .avatar { width:52px; height:52px; }
.viewer-content>.viewer-recommendations .viewer-suggestion strong { font-size:13px; }
@media(min-width:1050px){.media-viewer[open] { display:flex; padding-top:24px; }.media-viewer .viewer-close { right:max(12px,calc((100vw - 540px)/2 + 12px)); }}
@media(max-width:360px){.viewer-views { left:10px; }.viewer-views>span { font-size:7px; }.viewer-controls .viewer-dots { max-width:24%; margin-left:34%; }}
/* Allow the last carousel to reach the comfortable middle viewing zone. */
.media-viewer { padding-bottom:max(24px,20dvh,env(safe-area-inset-bottom)); scrollbar-width:none; }

/* Expanded photos keep their original framing; feed and grid use 4:5. */
.viewer-frame:has(>img.viewer-media) { aspect-ratio:auto; }
.viewer-frame>img.viewer-media { height:auto; max-height:78dvh; object-fit:contain; }
.viewer-library-count { flex-shrink:0; }
/* Social discovery and account surfaces */
.model-discovery { padding:12px 0 30px; border-top:6px solid #faf6f8; margin-top:24px; }
.model-discovery .section-title { padding:0 20px; gap:12px; }
.model-discovery h2,.explore-recent h2 { font-size:16px; letter-spacing:-.3px; }
.model-discovery .section-title a,.explore-recent .section-title a { display:flex; align-items:center; gap:5px; font-size:11px; white-space:nowrap; }
.model-carousel { display:flex; gap:12px; overflow:auto; scrollbar-width:none; padding:0 20px 12px; scroll-snap-type:x proximity; }
.model-slide { flex:0 0 82%; display:flex; gap:14px; align-items:center; padding:18px; border:1px solid #f1e7ec; border-radius:18px; color:inherit; scroll-snap-align:center; }
.model-slide .avatar { width:62px; height:62px; }
.model-slide span { min-width:0; }.model-slide strong { font-size:14px; }.model-slide small { display:block; font-size:11px; margin-top:4px; }.model-slide b { display:flex; align-items:center; gap:5px; color:var(--accent); font-size:11px; font-weight:500; margin-top:10px; }.model-slide b .icon { width:15px; }
.explore-recent { margin:0 0 24px; }.explore-recent .section-title { padding:0; margin:14px 0; }
.recent-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.recent-tile { position:relative; padding:0; border:0; border-radius:12px; overflow:hidden; aspect-ratio:var(--publication-ratio); background:#f8f1f5; }
.recent-tile>img,.recent-tile>video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border:0; border-radius:0; }
.recent-tile>span { position:absolute; bottom:0; left:0; right:0; padding:22px 9px 9px; background:linear-gradient(transparent,#0009); color:white; display:flex; gap:5px; align-items:center; }.recent-tile .avatar { width:24px; height:24px; border:1px solid #fff8; }.recent-tile strong { font-size:10px; flex:1; text-align:left; }.recent-tile .icon { width:15px; }
.post-actions .post-views,.viewer-post-views { display:flex; align-items:center; gap:4px; font-size:10px; }.post-views .icon,.viewer-post-views .icon { width:14px; height:14px; }
.modern-tabs.gallery-tabs { display:flex; gap:0; padding:0 12px; border-bottom:1px solid var(--line); background:white; }
.modern-tabs.gallery-tabs button { flex:1; position:relative; display:flex; justify-content:center; align-items:center; gap:6px; min-height:56px; padding:12px 4px; border:0; border-radius:0; background:transparent; font-size:12px; color:#947f8a; }
.modern-tabs button .icon { width:17px; height:17px; }.modern-tabs button small { font-size:9px; border-radius:6px; background:#f7f2f5; padding:2px 5px; }
.modern-tabs.gallery-tabs button[aria-pressed=true] { color:var(--accent); background:transparent; font-weight:650; }.modern-tabs button[aria-pressed=true]::after { content:''; position:absolute; bottom:0; left:22%; right:22%; height:3px; border-radius:3px; background:var(--accent); }
.gallery-toolbar { display:flex; justify-content:space-between; align-items:center; padding:14px 16px 0; gap:12px; }.gallery-toolbar select { border:0; background:#faf6f8; padding:9px 10px; border-radius:10px; color:#715d68; font-size:11px; width:auto; }.gallery-toolbar label { margin:0; }.gallery-liked { display:flex; align-items:center; gap:5px; border:1px solid #f0e5eb; border-radius:20px; padding:8px 12px; background:white; font-size:11px; color:#8c7280; }.gallery-liked .icon { width:14px; height:14px; }.gallery-liked[aria-pressed=true] { background:#fff0f6; color:var(--accent); border-color:#f5b8d3; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.tile-unlock { position:absolute; bottom:12px; left:5px; right:5px; font-size:10px; font-weight:600; color:white; text-shadow:0 1px 6px #000; }
.gallery-empty { grid-column:1/-1; padding:32px 20px; text-align:center; color:#947d88; }.gallery-empty>.icon { width:26px; height:26px; }.gallery-empty h3 { font-size:15px; }.gallery-empty p { font-size:12px; }
.account-page { padding:24px 20px 36px; }.account-hero { text-align:center; padding:24px 16px; border-radius:24px; background:linear-gradient(145deg,#fff0f7,#fff 75%); }.account-hero>.avatar { width:88px; height:88px; border:4px solid white; box-shadow:0 5px 22px #b7477415; }.account-hero h1 { margin:14px 0 0; font-size:23px; overflow-wrap:anywhere; }.account-hero p { margin:5px 0 18px; color:var(--muted); font-size:13px; }.account-membership { display:inline-flex; align-items:center; gap:7px; background:white; border:1px solid #f5d9e6; padding:10px 14px; border-radius:24px; font-size:12px; }.account-membership .icon { width:16px; }
.account-shortcuts { display:grid; gap:2px; margin:24px 0; }.account-shortcuts a { display:flex; align-items:center; gap:14px; padding:17px 4px; color:inherit; border-bottom:1px solid var(--line); }.account-shortcuts a>span { flex:1; font-size:14px; font-weight:600; }.account-shortcuts small { display:block; font-size:11px; font-weight:400; margin-top:4px; }.account-shortcuts a>.icon:first-child { color:var(--accent); }
.account-editor { border:1px solid var(--line); border-radius:16px; padding:0 16px; }.account-editor summary { list-style:none; display:flex; align-items:center; gap:10px; padding:18px 0; cursor:pointer; font-size:14px; }.account-editor summary::-webkit-details-marker { display:none; }.account-editor summary .icon:last-child { margin-left:auto; width:16px; }.account-editor[open] summary .icon:last-child { transform:rotate(90deg); }.account-editor form { padding:4px 0 18px; }.account-photo-edit { display:flex; align-items:center; gap:14px; margin:8px 0 20px; }.photo-picker { position:relative; overflow:hidden; display:flex; align-items:center; gap:7px; font-size:12px; color:var(--accent); cursor:pointer; }.photo-picker input { position:absolute; inset:0; opacity:0; cursor:pointer; }.photo-picker .icon { width:16px; }.account-page>.account-logout { display:block; margin:24px auto 0; font-size:12px; color:#9a7989; }
@media(min-width:760px){.model-slide { flex-basis:65%; }.account-page { max-width:580px; margin:auto; }}
.account-hero>.avatar { margin-left:auto; margin-right:auto; }
.viewer-controls .viewer-dots { margin-left:0; max-width:70%; }
.social-app .recent-tile>img,.social-app .recent-tile>video { width:100%; height:100%; max-height:none; object-fit:cover; }

@media(min-width:768px){
 #app.social-app.feed-page { background:#faf9fa; }
 .social-app .social-wrap { max-width:1180px; display:grid; grid-template-columns:190px minmax(0,580px) 270px; column-gap:32px; align-items:start; padding:0 22px 40px; background:transparent; box-shadow:none; }
 .social-app .social-topbar { grid-column:2; grid-row:1; position:sticky; top:0; z-index:8; border-left:1px solid #eee8ec; border-right:1px solid #eee8ec; }
 .social-app .social-main { grid-column:2; grid-row:2; width:100%; padding-bottom:0; background:white; border:1px solid #eee8ec; border-top:0; }
 .social-app .bottom-nav { grid-column:1; grid-row:1 / span 2; position:sticky; top:0; left:auto; bottom:auto; transform:none; width:100%; max-width:none; height:100dvh; display:flex; flex-direction:column; justify-content:flex-start; gap:8px; padding:32px 0; background:transparent; border:0; box-shadow:none; backdrop-filter:none; }
 .social-app .bottom-nav::before { content:'apolis.'; display:block; padding:0 12px 30px; font-size:30px; font-weight:800; letter-spacing:-1.6px; color:#302530; }
 .social-app .bottom-nav .nav-link { flex:none; flex-direction:row; align-items:center; text-align:left; gap:14px; min-height:48px; padding:12px; font-size:14px; border-radius:12px; color:#8a7682; }
 .social-app .bottom-nav .nav-link.selected { background:#fcebf3; color:#db0063; }
 .social-app .bottom-nav .nav-link:hover { background:#f2edf0; }
 .social-app .feed-desktop-rail { grid-column:3; grid-row:1 / span 2; display:block; position:sticky; top:0; height:auto; width:auto; padding:30px 0; border:0; }
 .feed-rail-intro h2 { font-family:inherit; font-size:20px; letter-spacing:-.5px; margin:0 0 8px; }
 .feed-rail-intro p { color:#a08c98; font-size:12px; line-height:1.7; margin:0 0 30px; }
 .feed-rail-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
 .feed-rail-heading h3 { font-size:12px; color:#88727f; margin:0; }
 .feed-rail-heading>a { font-size:11px; }
 .feed-rail-profile { display:flex; align-items:center; gap:10px; padding:12px 0; color:#483642; }
 .feed-rail-profile .avatar { width:40px; height:40px; border:0; }
 .feed-rail-profile>span { flex:1; min-width:0; }
 .feed-rail-profile strong { font-size:12px; display:block; }
 .feed-rail-profile small { font-size:10px; display:block; color:#ab92a0; }
 .feed-rail-profile>.icon { width:15px; height:15px; color:#ad8f9f; }
 .feed-rail-discover { display:flex; align-items:center; gap:10px; padding:16px 0; margin-top:16px; border-top:1px solid #ebe3e8; font-size:12px; }
 .feed-rail-discover .icon { width:18px; height:18px; }
 .feed-rail-note,.feed-rail-empty { font-size:11px; color:#b09aa7; line-height:1.7; }
}
@media(min-width:768px){
.social-app .social-wrap { width:100%; max-width:1280px; grid-template-columns:130px minmax(0,1fr) 220px; gap:24px; padding:0 24px 40px; }
.social-app:not(.feed-page) .social-wrap { max-width:1100px; grid-template-columns:150px minmax(0,1fr); }
.social-app .social-main { min-width:0; }
.social-app .feed-desktop-rail { min-width:0; padding:28px 16px; margin:0; overflow-wrap:anywhere; }
.feed-rail-intro { padding:0; margin:0 0 24px; }.feed-rail-intro p { margin:0; }.feed-rail-discover { line-height:1.6; }
.social-app .bottom-nav .nav-link { font-size:12px; padding:12px 8px; gap:8px; }
.subscriptions-page { padding:20px; }.subscriptions-page>header { padding:8px 4px 24px; }.subscriptions-page .membership-card { margin:0 0 16px; padding:22px; border-radius:16px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px 20px; align-items:center; }.membership-card .membership-profile { margin:0; }.subscriptions-page .membership-card>p { margin:0; }.subscriptions-page .membership-card>.button { margin:0; width:auto; min-width:160px; }.subscriptions-page .model-carousel { padding:0 4px 12px; }.subscriptions-page .model-slide { flex-basis:65%; }
}
.explore-recent { margin-left:-18px; margin-right:-18px; }.explore-recent .section-title { padding:0 18px; }.recent-grid { gap:2px; }.recent-tile { border-radius:0; }
.explore-page .discovery-grid { gap:2px; margin-left:-18px; margin-right:-18px; }.explore-page .community-card,.explore-page .community-card .cover { border-radius:0; }.explore-page .community-card { border:0; }
.viewer-heading { min-height:56px; padding:8px 16px; }.viewer-heading>a { display:flex; align-items:center; gap:9px; color:inherit; width:100%; }.viewer-heading>a>.icon { width:16px; height:16px; margin-left:auto; color:#ae8b9e; }
.media-viewer .viewer-content { padding-top:0; }.viewer-close { background:#ffffffeb; box-shadow:0 2px 10px #0001; }
@media(max-width:767px){.subscriptions-page>header { padding:24px 20px 14px; }.subscriptions-page .membership-card { margin:8px 20px 20px; padding:18px; border-radius:16px; }.subscriptions-page .membership-status { margin:12px 0 0; }.subscriptions-page .membership-card>.button { margin-top:10px; min-height:44px; }}

@media(min-width:768px){.social-app.feed-page .social-wrap { max-width:1100px; }.feed-rail-intro p,.feed-rail-note { white-space:normal; overflow-wrap:anywhere; }}
@media(min-width:768px){#app.social-app { background:#faf9fa; }.social-app .social-wrap { grid-template-rows:64px 1fr; row-gap:0; }.social-app .social-topbar { height:64px; }.social-app .social-main { align-self:start; }}
/* Consistent shell across all member routes. */
.social-app .top-account { display:flex; align-items:center; justify-content:center; padding:0; line-height:1; }
.social-app .top-account>.icon { display:block; width:20px; height:20px; flex-shrink:0; }
.social-app .top-account>.avatar { display:block; width:100%; height:100%; border:0; border-radius:50%; }
.account-hero>.placeholder { background:#fff0f7; color:#ce4a85; display:flex; align-items:center; justify-content:center; }
.account-hero>.placeholder>.icon { width:32px; height:32px; }
@media(min-width:768px){
#app.social-app { background:#f8f9fb; }
#app.social-app .social-wrap { display:grid; width:100%; max-width:1180px; grid-template-columns:160px minmax(0,1fr) 230px; grid-template-rows:68px minmax(0,1fr); column-gap:24px; row-gap:0; padding:0 24px 40px; margin:0 auto; background:transparent; box-shadow:none; align-items:start; }
#app.social-app .social-topbar { grid-column:2; grid-row:1; height:68px; min-height:68px; padding:0 24px; position:sticky; top:0; background:#fff; border:1px solid #ece8ec; border-top:0; }
#app.social-app .social-main { grid-column:2; grid-row:2; align-self:start; width:100%; min-width:0; min-height:calc(100dvh - 68px); margin:0; padding:0 0 32px; border:1px solid #ece8ec; border-top:0; background:#fff; }
#app.social-app .bottom-nav { grid-column:1; grid-row:1 / span 2; width:100%; padding:28px 0; margin:0; height:100dvh; }
#app.social-app .bottom-nav .nav-link { font-size:13px; gap:12px; padding:13px 12px; }
#app.social-app .feed-desktop-rail { grid-column:3; grid-row:1 / span 2; display:block; position:sticky; top:24px; min-width:0; width:100%; height:auto; margin:24px 0 0; padding:20px 16px; border:1px solid #ece8ec; border-radius:16px; background:#fff; }
.feed-rail-intro h2 { font-size:18px; }.feed-rail-intro p { font-size:12px; line-height:1.7; }.feed-rail-heading { margin-top:24px; }.feed-rail-profile { padding:12px 0; }.feed-rail-profile .avatar { margin:0; width:36px; height:36px; }.feed-rail-profile strong { overflow-wrap:anywhere; }.feed-rail-discover { margin-top:12px; padding:16px 0 0; gap:8px; font-size:11px; }.feed-rail-discover .icon { flex-shrink:0; width:16px; height:16px; }
.social-app .explore-page { padding:28px 24px; }.social-app .explore-heading h1 { font-size:25px; }.social-app .explore-recent,.social-app .explore-page .discovery-grid { margin-left:-24px; margin-right:-24px; }.social-app .explore-recent .section-title { padding:0 24px; }.recent-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.social-app .account-page { max-width:none; padding:28px 24px; }.social-app .account-hero { padding:24px; }.social-app .subscriptions-page { padding:28px 24px; }.social-app .subscriptions-page>header { padding:0 0 24px; }.subscriptions-page .membership-card { display:block; }.subscriptions-page .membership-card>.button { width:100%; }.subscriptions-page .membership-card>p { margin:12px 0; }
}
@media(min-width:768px) and (max-width:1000px){#app.social-app .social-wrap { grid-template-columns:110px minmax(0,1fr) 185px; column-gap:14px; padding:0 14px 32px; }#app.social-app .bottom-nav .nav-link { font-size:11px; gap:7px; padding:12px 6px; }#app.social-app .feed-desktop-rail { padding:16px 12px; }.feed-rail-heading { flex-wrap:wrap; gap:8px; }.feed-rail-profile .avatar { width:30px; height:30px; }.feed-rail-profile small { font-size:9px; }}
@media(max-width:767px){#app.social-app .feed-desktop-rail { display:none; }}
.social-app .explore-page .recent-tile,.social-app .explore-page .community-card,.social-app .explore-page .community-card>.cover { border-radius:0; }
.social-app .explore-page .community-card { border:0; }
/* Offer and checkout share the platform's type, color and spacing rules. */
#app.funnel-app { background:#f8f9fb; color:#3d2a33; }
.funnel-app .funnel-wrap { max-width:480px; min-height:100dvh; margin:0 auto; padding:0 0 24px; background:#fff; box-shadow:none; }
.funnel-app .app-topbar { display:flex; align-items:center; gap:14px; height:68px; min-height:68px; padding:0 20px; margin:0; border-bottom:1px solid #eee8ed; background:#fff; position:sticky; top:0; z-index:12; }
.funnel-app .app-back { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; padding:0; border:0; border-radius:50%; background:#f7f4f6; color:#715d68; box-shadow:none; }.funnel-app .app-back .icon { width:20px; height:20px; }
.funnel-app .app-topbar-title { flex:1; min-width:0; text-align:left; }.funnel-app .app-topbar-title strong { font-size:14px; font-weight:600; letter-spacing:0; }.funnel-app .app-topbar-title small { font-size:10px; color:#947f8a; }
.funnel-app .app-brand { width:auto; height:auto; padding:0; margin:0; background:none; border:0; box-shadow:none; }.funnel-app .social-wordmark { font-size:25px; }
.funnel-app .app-progress { padding:0; gap:2px; }.funnel-app .app-progress span { height:2px; border-radius:0; }
.funnel-app .app-screen { padding:0; }.funnel-app .offer-banner { display:block; width:100%; height:180px; border-radius:0; }.funnel-app .offer-identity { margin:-28px 20px 0; position:relative; }.funnel-app .offer-identity .avatar { border-color:white; }.funnel-app .offer-content { padding:24px 20px; }.funnel-app .offer-content h1 { max-width:none; font-size:28px; line-height:1.2; letter-spacing:-.7px; }.funnel-app .offer-subtitle { color:#8b7480; }.funnel-app .eyebrow { color:var(--accent); font-size:9px; letter-spacing:1.3px; }
.funnel-app .offer-plan { border-radius:14px; box-shadow:none; }.funnel-app .offer-plan.monthly { background:var(--accent); }.funnel-app .offer-plan.annual { border-color:#ecdfe6; }.funnel-app .offer-benefits { flex-wrap:wrap; font-size:11px; }
.funnel-app .checkout-pinned { top:68px; padding:0; background:white; box-shadow:0 6px 16px #3d2a3307; }.funnel-app .checkout-model { margin:0; border:0; border-radius:0; border-bottom:1px solid #eee8ed; }.funnel-app .pinned-cover { height:82px; }.funnel-app .pinned-identity { padding:0 20px 14px; }.funnel-app .pinned-identity strong { font-size:13px; }.funnel-app .pinned-price>strong { font-size:17px; }.funnel-app .pinned-price>a { font-size:11px; padding-top:6px; }
.funnel-app .unified-checkout { padding:24px 20px; }.funnel-app .unified-checkout>h1 { font-size:25px; line-height:1.25; }.funnel-app .checkout-section-title h2 { font-size:15px; letter-spacing:-.2px; }.funnel-app #checkout-account-form input:not([type=checkbox]) { border-radius:12px; border-color:#e9e1e6; box-shadow:none; }.funnel-app .checkout-account { border:1px solid #eee8ed; border-radius:12px; }.funnel-app .checkout-account>.avatar { margin:0; width:40px; height:40px; }.funnel-app .checkout-account>.placeholder { display:flex; align-items:center; justify-content:center; color:var(--accent); background:#fff0f7; }.funnel-app .checkout-account>.placeholder .icon { width:20px; height:20px; }
.funnel-app .button,.funnel-app #checkout-account-form .unified-submit { border-radius:12px; box-shadow:none; }.funnel-app .unified-submit:disabled { cursor:not-allowed; }.funnel-app .funnel-footer { padding:16px 20px; text-align:center; border-top:1px solid #f3edf0; }.funnel-app input:focus-visible,.funnel-app a:focus-visible,.funnel-app button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media(min-width:768px){
#app.funnel-app { padding:0 24px 40px; }.funnel-app .funnel-wrap { max-width:1050px; background:white; border:1px solid #eee8ed; border-top:0; }.funnel-app .app-topbar { padding:0 28px; }.funnel-app .offer-page { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:36px; padding:32px; align-items:start; }.funnel-app .offer-portrait { position:sticky; top:100px; }.funnel-app .offer-banner { height:300px; border-radius:16px; }.funnel-app .offer-identity { margin:-30px 20px 0; }.funnel-app .offer-identity .avatar { width:80px; height:80px; }.funnel-app .offer-identity strong { font-size:18px; }.funnel-app .offer-content { padding:0; }.funnel-app .offer-content h1 { font-size:32px; }.funnel-app .offer-plans { display:grid; grid-template-columns:1fr; }.funnel-app .offer-plan { min-height:106px; padding:20px; }
.funnel-app.single-checkout .funnel-wrap { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:0 32px; padding:0 32px; align-items:start; }.single-checkout .app-topbar { grid-column:1/-1; margin:0 -32px; }.single-checkout .checkout-pinned { grid-column:1; grid-row:2; position:sticky; top:100px; margin:32px 0; box-shadow:none; }.single-checkout .checkout-model { border:1px solid #eee8ed; border-radius:16px; }.single-checkout .pinned-cover { height:230px; }.single-checkout .pinned-identity { display:block; padding:0 20px 20px; }.single-checkout .pinned-identity .avatar { width:68px; height:68px; margin-top:-28px; }.single-checkout .pinned-identity strong { font-size:17px; }.single-checkout .pinned-identity>a { align-items:flex-end; gap:12px; }.single-checkout .pinned-price { text-align:left; display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:22px; padding-top:18px; border-top:1px solid #eee8ed; }.single-checkout .pinned-price>strong { font-size:23px; }.single-checkout .pinned-price>strong small { font-size:11px; }.single-checkout .app-screen { grid-column:2; grid-row:2; min-width:0; }.single-checkout .unified-checkout { padding:32px 0; }.single-checkout .funnel-footer { grid-column:1/-1; margin:0 -32px; }
}
@media(max-width:360px){.funnel-app .app-topbar { padding:0 16px; gap:10px; }.funnel-app .social-wordmark { font-size:22px; }.funnel-app .app-topbar-title strong { font-size:12px; }.funnel-app .offer-content,.funnel-app .unified-checkout { padding:22px 16px; }.funnel-app .pinned-identity { padding:0 16px 12px; }}
@media(min-width:768px){.funnel-app .offer-page { max-width:none; width:100%; margin:0; }}
.funnel-app .checkout-account>.avatar { flex:0 0 40px; min-width:40px; max-width:40px; width:40px; height:40px; border-radius:50%; }
.funnel-app #checkout-account-form .unified-submit:disabled { background:#d994b3; box-shadow:none; }
/* Compact model carousels: two full cards, with a hint of the next. */
.social-app .model-carousel,.viewer-content>.viewer-recommendations .viewer-suggestions { display:flex; flex-direction:row; gap:10px; padding:0 16px 12px; overflow-x:auto; scrollbar-width:none; scroll-snap-type:x proximity; scroll-padding-inline:16px; }
.social-app .model-carousel>.model-slide,.viewer-content>.viewer-recommendations .viewer-suggestions>.viewer-suggestion { flex:0 0 calc((100% - 28px)/2.15); min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:10px; padding:14px 12px; border:1px solid #eee5eb; border-radius:14px; scroll-snap-align:start; }
.social-app .model-carousel .avatar,.viewer-content>.viewer-recommendations .viewer-suggestions .avatar { width:52px; height:52px; margin:0; border:0; }
.social-app .model-carousel strong,.viewer-content>.viewer-recommendations .viewer-suggestions strong { font-size:12px; line-height:1.5; display:block; overflow-wrap:anywhere; }
.social-app .model-carousel small { font-size:9px; overflow-wrap:anywhere; }.social-app .model-carousel b { font-size:10px; gap:4px; margin-top:9px; }.social-app .model-carousel b .icon { width:12px; }
.viewer-content>.viewer-recommendations .viewer-suggestions small { font-size:10px; }.viewer-content>.viewer-recommendations .viewer-suggestions b { font-size:9px; }
/* Media edges stay square, including the nested images and videos. */
.social-app .explore-page .recent-tile,.social-app .explore-page .recent-tile>img,.social-app .explore-page .recent-tile>video,.social-app .explore-page .community-card,.social-app .explore-page .community-card>.cover { border:0; border-radius:0; box-shadow:none; }
.social-app .explore-page .recent-tile .post-image { border-radius:0; }.social-app .explore-page .recent-tile>span { border-radius:0; }
/* People suggestions sit on the page instead of inside outlined cards. */
.social-app .model-discovery,.media-viewer .viewer-content>.viewer-recommendations { background:#fff; border:0; margin-top:24px; padding-top:0; }
.social-app .model-discovery .section-title { margin-top:0; margin-bottom:20px; }.model-discovery .section-title h2,.viewer-recommendations h2 { color:#3d2a33; font-weight:700; }
.social-app .model-carousel>.model-slide,.viewer-content>.viewer-recommendations .viewer-suggestions>.viewer-suggestion { border:0; border-radius:0; box-shadow:none; background:transparent; align-items:center; text-align:center; padding:6px 8px 14px; gap:12px; }
.social-app .model-carousel .avatar,.viewer-content>.viewer-recommendations .viewer-suggestions .avatar { width:68px; height:68px; border:0; box-shadow:none; object-fit:cover; }
.social-app .model-carousel>.model-slide>span,.viewer-content>.viewer-recommendations .viewer-suggestions>.viewer-suggestion>span { width:100%; min-width:0; }
.social-app .model-carousel strong,.viewer-content>.viewer-recommendations .viewer-suggestions strong { font-size:13px; font-weight:650; line-height:1.5; }
.social-app .model-carousel small,.viewer-content>.viewer-recommendations .viewer-suggestions small { display:block; margin:3px 0 0; font-size:10px; color:#9a8794; }
.social-app .model-carousel b,.viewer-content>.viewer-recommendations .viewer-suggestions b { display:flex; align-items:center; justify-content:center; width:max-content; min-width:96px; min-height:34px; padding:8px 17px; margin:12px auto 0; border:0; border-radius:20px; background:#3d2a33; color:#fff; font-size:11px; line-height:1.5; font-weight:600; }
.social-app .model-carousel>.model-slide:hover b,.viewer-content>.viewer-recommendations .viewer-suggestions>.viewer-suggestion:hover b { background:#614252; }
.social-app .subscriptions-page { background:#fff; }.social-app .subscriptions-page .membership-card { border:0; border-radius:0; box-shadow:none; background:#fff; padding:0; margin:8px 20px 32px; }.social-app .subscriptions-page .membership-card>.button { background:#fff0f7; }.social-app .subscriptions-page .model-discovery { margin-top:28px; padding-bottom:24px; }
@media(min-width:768px){.social-app .subscriptions-page .membership-card { margin:0 0 36px; }.subscriptions-page .model-discovery .section-title { padding:0; }.subscriptions-page .model-carousel { padding-left:0; padding-right:0; }}
.cancel-subscription { display:block; margin:12px auto 0; border:0; background:none; padding:10px 14px; min-height:40px; font-size:11px; color:#8e7482; text-decoration:underline; text-underline-offset:3px; }
.retention-membership-note { display:block; font-size:10px; color:#ac3971; margin-top:12px; text-align:center; }
.subscription-sheet { width:calc(100% - 32px); max-width:440px; max-height:90dvh; overflow:auto; border:0; border-radius:20px; padding:32px 24px 24px; color:#3d2a33; box-shadow:0 18px 80px #32172526; }
.subscription-sheet::backdrop { background:#24141d66; backdrop-filter:blur(3px); }.subscription-sheet>.sheet-close { position:absolute; right:12px; top:12px; }.subscription-dialog-body>.avatar { display:block; width:60px; height:60px; margin:0 0 18px; }.subscription-dialog-body>.placeholder { display:flex; align-items:center; justify-content:center; color:var(--accent); }.subscription-dialog-body h2 { font-size:23px; letter-spacing:-.6px; margin:0 0 12px; }.subscription-dialog-body p { font-size:13px; color:#8b7480; line-height:1.7; margin:12px 0; }.subscription-dialog-actions { display:grid; gap:10px; margin-top:22px; }.subscription-dialog-actions .button { width:100%; border-radius:12px; min-height:48px; font-size:13px; }.subscription-dialog-actions .text-button { min-height:44px; font-size:12px; color:#775c6a; }.subscription-dialog-actions .cancel-confirm { background:#3d2a33; }.retention-price { padding:16px 0; margin:8px 0; border-top:1px solid #f3eaf0; border-bottom:1px solid #f3eaf0; }.retention-price>span { display:block; color:#957e8a; font-size:11px; margin-bottom:8px; }.retention-price strong { font-size:26px; color:var(--accent); }.retention-price del { font-size:15px; color:#a28c98; font-weight:400; margin-right:8px; }.subscription-dialog-body .retention-terms { font-size:11px; }.subscription-dialog-body .retention-local { font-size:10px; padding:10px 12px; border-radius:10px; background:#faf6f8; }.subscription-dialog-body .subscription-dialog-error { color:#b63a64; font-size:12px; }.subscription-sheet button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media(max-width:767px){.subscription-sheet { margin:auto 0 0; width:100%; max-width:none; max-height:92dvh; border-radius:22px 22px 0 0; padding-bottom:max(24px,env(safe-area-inset-bottom)); }}
.funnel-app .plan-choice { position:relative; display:grid; cursor:pointer; background:#fff; color:#3d2a33; border:1px solid #eee5eb; margin:0; padding-right:44px; }
.funnel-app .plan-choice input { position:absolute; width:1px; height:1px; opacity:0; }.funnel-app .plan-choice:focus-within { outline:2px solid var(--accent); outline-offset:3px; }
.funnel-app .plan-choice.is-selected { background:#fff1f7; border:2px solid var(--accent); box-shadow:none; }.funnel-app .plan-choice .plan-heading { color:#3d2a33; }.funnel-app .plan-choice .plan-price { color:#3d2a33; }.funnel-app .plan-choice .plan-price small,.funnel-app .plan-choice p { color:#977b88; }
.plan-choice-check { position:absolute; top:50%; right:15px; width:20px; height:20px; border:1px solid #d5beca; border-radius:50%; display:grid; place-items:center; transform:translateY(-50%); }.plan-choice-check .icon { width:13px; height:13px; opacity:0; }.is-selected .plan-choice-check { background:var(--accent); color:white; border-color:var(--accent); }.is-selected .plan-choice-check .icon { opacity:1; }
.funnel-app .offer-advance { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:50px; margin-top:16px; background:var(--accent); color:white; font-size:14px; }
.admin-image-context { min-width:0; margin:0 0 28px; }.admin-image-context>h2 { margin:0 0 6px; font-size:16px; }.admin-image-context>p { margin:0 0 16px; font-size:11px; line-height:1.6; color:#967b89; }.admin-context-preview { position:relative; margin-bottom:18px; padding-bottom:28px; }.admin-context-preview>.admin-card-cover { display:block; width:100%; height:110px; object-fit:cover; border-radius:10px; }.admin-context-preview>.avatar { position:absolute; bottom:0; left:12px; width:60px; height:60px; border:3px solid white; }.admin-image-context .admin-upload { margin-top:10px; }.admin-image-context .admin-previews:empty { display:none; }
.subscription-details-link { display:block; width:max-content; margin:12px auto 0; font-size:11px; color:#947986; text-underline-offset:3px; }.subscription-details-link:hover { text-decoration:underline; }
.subscription-status-page { padding:28px 24px 40px; text-align:center; }.status-back { display:flex; align-items:center; gap:6px; width:max-content; font-size:12px; color:#947986; margin-bottom:30px; }.status-back .icon { width:16px; }.status-model>.avatar { display:flex; margin:0 auto 14px; width:76px; height:76px; align-items:center; justify-content:center; }.status-model h1 { font-size:22px; }.status-model small { font-size:12px; }.status-symbol { margin:28px auto 16px; width:48px; height:48px; background:#fff0f7; border-radius:50%; display:grid; place-items:center; color:var(--accent); }.subscription-status-page>h2 { font-size:22px; margin:0 0 12px; }.subscription-status-page>p { color:#8b7480; font-size:13px; line-height:1.8; }.subscription-status-page>.button { display:flex; width:100%; justify-content:center; align-items:center; gap:12px; margin:24px 0 16px; }.status-explore { font-size:12px; }.status-feedback { font-size:11px!important; }
/* Standard compact video controls. */
.social-video .video-play { width:58px; height:58px; padding:0; border:0; background:#15131980; color:white; box-shadow:none; backdrop-filter:blur(5px); }.video-play>.icon { width:25px; height:25px; }
.social-video .video-timeline { display:flex; flex-direction:column; gap:2px; padding:26px 12px 8px; background:linear-gradient(transparent,#000b); color:#fff; z-index:3; }
.video-control-row { display:flex; align-items:center; gap:2px; width:100%; }.video-control-row>button { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; min-height:38px; border:0; padding:9px; border-radius:6px; background:transparent; color:white; opacity:.95; }.video-control-row>button:hover { background:#ffffff20; }.video-control-row>button:focus-visible { outline:2px solid white; outline-offset:-2px; }.video-control-row .icon { width:20px; height:20px; }.video-control-row .video-time { font-size:11px; margin-left:7px; }.video-control-spacer { flex:1; }
.social-video .video-timeline input { width:100%; height:20px; min-height:20px; padding:0; border:0; box-shadow:none; background:transparent; }.social-video .video-timeline input::-webkit-slider-runnable-track { height:3px; background:linear-gradient(to right,#fff var(--progress,0%),#ffffff60 var(--progress,0%)); }.social-video .video-timeline input::-webkit-slider-thumb { width:10px; height:10px; margin-top:-3.5px; background:white; border:0; }.social-video .video-timeline input::-moz-range-progress { background:white; height:3px; }.social-video .video-timeline input::-moz-range-thumb { background:white; border:0; }
.viewer-frame.social-video:fullscreen { display:block; width:100vw; height:100dvh; max-height:none; aspect-ratio:auto; background:#000; }.viewer-frame.social-video:fullscreen>.viewer-media { width:100%; height:100%; object-fit:contain; }.viewer-frame.social-video:fullscreen .video-timeline { padding-bottom:max(8px,env(safe-area-inset-bottom)); }
.model-verified { display:inline-flex; width:15px; height:15px; flex:0 0 15px; align-items:center; justify-content:center; margin-left:5px; color:var(--accent,#db0063); vertical-align:-2px; line-height:1; }
.model-verified>svg { display:block; width:100%; height:100%; }
.social-app .community-name-row { display:flex; align-items:center; flex-wrap:wrap; gap:6px 9px; padding:10px 34px 3px 0; }
.social-app .community-card .community-name-row h2 { margin:0; line-height:1.5; min-width:0; }
.social-app .community-name-row .community-member { display:inline-flex; align-items:center; flex-shrink:0; margin:0; padding:4px 8px; border-radius:20px; background:#ffe9f3; color:#be1a64; font-size:9px; font-weight:600; line-height:1.4; white-space:nowrap; }
.feed-rail-profile .model-verified { width:12px; height:12px; margin-left:3px; }.recent-tile .model-verified { color:#fff; width:11px; height:11px; margin-left:3px; }.model-carousel .model-verified,.viewer-suggestion .model-verified { width:13px; height:13px; flex-basis:13px; margin-left:4px; }
/* Subscription identity, access and management have distinct hierarchy. */
.social-app .subscriptions-page .membership-entry { display:block; margin:8px 20px 32px; padding:0; background:#fff; border:0; border-radius:0; }
.membership-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }.membership-heading>.membership-profile { flex:1; min-width:0; gap:12px; }.membership-heading .membership-profile>.avatar { width:52px; height:52px; margin:0; border:0; }.membership-heading .membership-profile>div { min-width:0; }.membership-heading .membership-profile h2 { font-size:16px; line-height:1.5; margin:0 0 3px; }.membership-heading .membership-profile small { font-size:11px; color:#9a8491; }.membership-heading>.membership-status { margin:0; padding:5px 9px; max-width:130px; border-radius:20px; font-size:10px; line-height:1.5; font-weight:600; text-align:center; }.membership-heading>.membership-status.is-active { color:#288065; background:#e9f7f0; }
.membership-access { display:flex; align-items:center; gap:8px; margin:18px 0; color:#9a8491; font-size:11px; line-height:1.7; }.membership-access>.icon { width:15px; height:15px; flex-shrink:0; color:#b19ca7; }.membership-access strong { color:#735b68; font-weight:500; }.membership-retention { display:block; font-size:10px; margin:-5px 0 16px; color:#b83271; }
.social-app .membership-entry>.membership-view { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:46px; margin:0; padding:12px 16px; border-radius:12px; font-size:12px; }.membership-entry>.membership-view .icon { width:18px; height:18px; }
.membership-management { margin-top:12px; }.membership-management>summary { list-style:none; display:flex; justify-content:space-between; align-items:center; min-height:42px; padding:8px 2px; font-size:11px; color:#927886; cursor:pointer; }.membership-management>summary::-webkit-details-marker { display:none; }.membership-management>summary>.icon { width:14px; height:14px; transform:rotate(-90deg); transition:transform .15s; }.membership-management[open]>summary>.icon { transform:rotate(90deg); }.membership-management-actions { padding:4px 0 0; border-top:1px solid #f3edf0; }.membership-management-actions>a,.membership-management-actions>button { display:flex; align-items:center; gap:9px; width:100%; min-height:46px; padding:12px 2px; border:0; border-radius:0; background:white; font-size:11px; color:#806673; text-align:left; text-decoration:none; }.membership-management-actions>a>.icon,.membership-management-actions>button>.icon { width:15px; height:15px; flex-shrink:0; }.membership-management-actions .icon:last-child { margin-left:auto; color:#b39ca8; }.membership-management-actions>button { color:#a15173; }.membership-management>summary:focus-visible,.membership-management-actions>a:focus-visible,.membership-management-actions>button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
@media(min-width:768px){.social-app .subscriptions-page .membership-entry { margin:0 0 36px; }.membership-heading .membership-profile h2 { font-size:17px; }.membership-access { margin:20px 0; }.membership-management-actions { display:flex; gap:20px; }.membership-management-actions>a,.membership-management-actions>button { flex:1; }}
.sandbox-notice{color:#be185d;background:#fff1f7;padding:10px 14px;font-size:12px;font-weight:600;line-height:1.5;border-radius:8px}
.payment-result .button{margin-top:14px}
.payment-result .status-feedback{min-height:24px}
/* Account assistance: same surfaces and spacing on mobile and desktop. */
.account-help{padding:24px 0;border-top:1px solid #eee;margin-top:24px}
.account-help h2,.help-history h2{font-size:18px;margin:0 0 16px}
.account-help a{display:flex;align-items:center;gap:12px;padding:16px 0;color:inherit;text-decoration:none}
.account-help a .icon:last-child{margin-left:auto}
.help-form{max-width:640px;margin:24px auto}
.help-form>p,.billing-help p{line-height:1.6;color:#656575}
.help-form small{display:block;line-height:1.6;color:#656575;margin-bottom:16px}
.help-form textarea,.help-ticket textarea{width:100%;resize:vertical;min-height:110px}
.help-feedback{line-height:1.6;color:#ad0754;overflow-wrap:anywhere}
.help-history{padding:24px 20px;max-width:700px;margin:auto}
.help-ticket{padding:24px 0;border-bottom:1px solid #eee;overflow-wrap:anywhere}
.help-ticket h3{margin:12px 0 8px}.help-ticket p{white-space:pre-wrap;line-height:1.6}
.help-ticket>div:first-child{display:flex;justify-content:space-between;gap:16px}
.help-ticket small,.help-muted{color:#747480;font-size:13px}
.help-state{font-size:12px;font-weight:600;color:#ad0754;background:#fff0f6;padding:5px 9px;border-radius:6px}
.help-reply{background:#fff5f9;padding:16px;margin-top:16px;border-left:3px solid #ed0878}
.help-admin-list{max-width:900px}.help-admin-list .help-ticket{background:white;padding:24px;margin-bottom:20px}
.billing-help{margin-top:28px;padding-top:24px;border-top:1px solid #eee;text-align:left}
.billing-help .button{display:flex;margin:16px 0}.billing-help>a:last-child{display:block;margin-top:16px;color:#ad0754}
@media(max-width:700px){.help-form{margin:16px 0}.help-history{padding:24px 16px}.help-admin-list .help-ticket{padding:16px}}

/* Model editor: natural document flow, without the subscriber aside sizing. */
.admin-workspace .model-editor { max-width:1160px; }
.model-editor-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:4px 0 24px; }
.model-editor-heading h1 { margin:0 0 8px; font-size:28px; }
.model-editor-heading p { margin:0; }
.model-editor-heading>.button { flex-shrink:0; }
.admin-workspace .model-editor #admin-model-form { display:block; background:transparent; padding:0; border:0; border-radius:0; min-width:0; }
.admin-model-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:24px; align-items:start; }
.admin-model-details,.admin-model-visuals { display:grid; gap:20px; min-width:0; }
.model-editor .model-panel { background:white; border:1px solid #e6e5ec; border-radius:12px; padding:24px; display:grid; gap:16px; min-width:0; margin:0; }
.model-panel-heading { display:flex; gap:12px; align-items:flex-start; }
.model-section-icon { width:36px; height:36px; flex:0 0 36px; border-radius:10px; display:grid; place-items:center; color:#cf0768; background:#fff0f7; }
.model-section-icon .icon { width:18px; height:18px; }
.admin-workspace .model-panel h2 { margin:0; font-size:15px; line-height:1.5; }
.model-panel-heading p,.model-share-panel>p,.model-copy-details>p { font-size:12px; line-height:1.6; margin:3px 0 0; color:#797481; }
.model-panel>label { display:grid; gap:7px; margin:0; font-weight:500; }
.model-panel input,.model-panel textarea { width:100%; min-width:0; }
.model-panel textarea { resize:vertical; line-height:1.65; }
.model-panel>small,.model-image-note { color:#88818d; font-size:11px; line-height:1.6; }
.model-panel .two-columns { gap:14px; }
.model-panel .two-columns label { display:grid; gap:7px; }
.model-panel #model-slug-hint { margin-top:-10px; }
.model-image-preview { position:relative; height:174px; margin:0; }
.model-cover-preview { height:132px; overflow:hidden; border-radius:8px; background:#f7f3f6; }
.model-cover-image { width:100%; height:100%; display:block; object-fit:cover; }
.model-cover-image.placeholder { display:flex; background:linear-gradient(110deg,#f6eaf0,#eeeaf5); color:#c4a8b7; }
.model-cover-image.placeholder .icon { width:28px; height:28px; }
.model-avatar-preview { position:absolute; left:14px; bottom:8px; }
.model-avatar-preview>.avatar { display:flex; width:68px; height:68px; border:4px solid white; margin:0; box-shadow:0 2px 6px #40303b0c; }
.model-avatar-preview>.placeholder { background:#f2e5ee; color:#bd8ca5; }
.model-avatar-preview .icon { width:24px; height:24px; }
.model-image-preview>span { position:absolute; bottom:10px; left:94px; font-size:11px; color:#8a7b84; }
.model-image-controls { display:grid; gap:10px; }
.model-upload-row { display:flex; align-items:center; gap:12px; min-width:0; }
.model-editor .model-upload-control { position:relative; display:flex; align-items:center; gap:10px; border:1px solid #e9e4eb; border-radius:8px; padding:11px 12px; flex:1; min-width:0; cursor:pointer; background:#fff; }
.model-upload-control:hover { border-color:#d673a4; background:#fffafd; }
.model-upload-control:focus-within { outline:2px solid var(--accent); outline-offset:2px; }
.model-upload-control>.icon { width:19px; height:19px; flex-shrink:0; color:#b7658d; }
.model-upload-control>span { min-width:0; color:#443b46; font-size:12px; font-weight:600; }
.model-upload-control small { display:block; max-width:230px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; font-weight:400; margin-top:2px; color:#958391; }
.model-editor .model-upload-control>input { position:absolute; inset:0; opacity:0; width:100%; height:100%; cursor:pointer; }
.model-upload-row>button { font-size:11px; padding:8px 0; color:#a30b55; }
.model-upload-row>[hidden] { display:none!important; }
.model-image-error { font-size:11px; color:#b32248; margin:0; }
.model-image-error:empty { display:none; }
.model-copy-details summary { display:flex; align-items:center; justify-content:space-between; gap:10px; cursor:pointer; font-size:13px; font-weight:600; color:#443b46; list-style:none; }
.model-copy-details summary::-webkit-details-marker { display:none; }
.model-copy-details summary>span { color:#b01461; font-size:11px; font-weight:500; }
.model-copy-details label { display:grid; gap:7px; margin-top:16px; }
.model-copy-details[open]>p { margin-top:14px; }
.model-editor .model-share-panel .admin-share { max-width:none; }
.model-share-actions { display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.admin-workspace .model-share-actions #admin-copy { margin:0; font-size:12px; }
.model-share-actions .admin-public-link { font-size:12px; }
.model-save-bar { position:sticky; bottom:16px; z-index:4; margin-top:24px; padding:16px 20px; background:#fff; border:1px solid #e6e5ec; border-radius:12px; box-shadow:0 6px 24px #28202a0a; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.model-save-bar>span { font-size:12px; line-height:1.5; color:#817585; }
.model-save-bar>div { display:flex; gap:10px; flex-shrink:0; }
.model-save-bar .button { font-size:12px; padding:12px 18px; }
.model-editor #admin-model-form>.form-error:not(:empty) { margin:0 0 20px; padding:14px 16px; border-radius:8px; background:#fff0f3; color:#b32248; }
@media(min-width:901px) and (max-width:1100px) { .admin-model-layout { grid-template-columns:1fr; }.admin-model-visuals { grid-template-columns:repeat(2,minmax(0,1fr)); }.model-editor .model-panel { padding:20px; } }
@media(max-width:900px) { .admin-model-layout { grid-template-columns:1fr; }.model-save-bar { bottom:10px; }.model-editor-heading { align-items:flex-start; }.model-editor-heading h1 { font-size:25px; } }
@media(max-width:600px) { .model-editor-heading { flex-direction:column; gap:12px; }.model-editor .model-panel { padding:18px; }.admin-model-layout { gap:20px; }.model-save-bar { flex-direction:column; align-items:stretch; gap:10px; padding:12px; bottom:8px; }.model-save-bar>span { font-size:11px; }.model-save-bar>div { display:grid; grid-template-columns:auto 1fr; }.model-save-bar .button { gap:8px; padding:12px; }.model-editor-heading>.button { font-size:12px; } }

/* Locked publications have no photographic preview for any unauthorized visitor. */
.locked-preview,.tile-preview,.viewer-blur { display:none!important; }
.social-app .locked,.viewer-locked { background:#f5f3f6; color:#5b4f59; }
.social-app .locked::after { display:none; }
.social-app .locked strong,.social-app .locked p { text-shadow:none; }
.social-app .locked p { color:#8a7b87; }
.social-app .locked .lock-icon { background:#fff; border:1px solid #ebe3e9; color:#b35681; }
.media-tile.is-locked { background:#f4f1f5; }
.locked-tile-placeholder { position:absolute; inset:0; display:grid; place-items:center; color:#b8a6b5; }
.locked-tile-placeholder>.icon { width:25px; height:25px; }
.media-tile.is-locked .tile-kind { display:none; }
.media-tile.is-locked .tile-unlock { color:#8b7787; text-shadow:none; font-size:10px; }
.viewer-locked>div { position:relative; padding:24px; }