/* Профиль и «Приведи друга» — «Карман Ai Помощник». Подключать после ../../tokens.css и ../../components.css */
.pf-screen{padding-bottom:calc(var(--screen-tabbar) + var(--s-6))}
.pf-screen.is-cut{height:var(--screen-height);min-height:0}
.status{position:relative}
.pf-tabbar{position:fixed;left:0;right:0;bottom:0;width:var(--screen-width);margin:0 auto;z-index:4}
.pf-tabbar .tab{text-decoration:none}
.homebar{position:fixed;z-index:8}
.pf-head{padding-top:var(--s-3)}
.pf-gap{margin-top:var(--s-4)}
.lbl{font:var(--t-caption);letter-spacing:.6px;text-transform:uppercase;color:var(--c-text-subtle);margin:0 0 var(--s-2) 2px}
/* Пользователь */
.pf-user{display:flex;align-items:center;gap:var(--s-3);margin-top:var(--s-3)}
.pf-user .av{width:52px;height:52px;border-radius:50%;background:var(--c-accent-sand);color:var(--c-text-heading);display:flex;align-items:center;justify-content:center;font:600 22px/1 var(--font-display)}
.pf-user b{display:block;font:var(--t-title);font-size:17px;color:var(--c-text)}
.pf-user span span{display:block;font:var(--t-small);color:var(--c-text-muted);margin-top:2px}
/* Блок Pro */
.pro{border-radius:var(--r-xl);padding:16px 18px 18px;margin-top:var(--s-4)}
.pro-on{background:var(--c-secondary);color:var(--c-text-on-primary)}
.pro-free{background:var(--c-surface);box-shadow:var(--sh-card)}
.pro-top{display:flex;justify-content:space-between;align-items:center;min-height:26px}
.pro-k{font:700 13px/1 var(--font-body);opacity:.75}
.pro-free .pro-k{color:var(--c-text-muted);opacity:1}
.plan-pill-s{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 10px;border-radius:var(--r-pill);background:rgba(251,244,234,.14);color:var(--c-accent-sand);font:800 12px/1 var(--font-body)}
.pro-t{font:var(--t-h2);margin-top:6px}
.pro-free .pro-t{color:var(--c-text-heading)}
.pro-s{font:var(--t-small);margin-top:4px;opacity:.8}
.pro-free .pro-s{color:var(--c-text-muted);opacity:1}
.pro-btn{margin-top:var(--s-4);text-decoration:none}
.pro-link{display:inline-flex;align-items:center;gap:4px;margin-top:var(--s-3);font:800 14px/1 var(--font-body);color:var(--c-accent-sand);text-decoration:none}
/* Строки списка */
.pf-row{display:flex;align-items:center;gap:12px;padding:12px 14px;text-decoration:none;color:var(--c-text)}
.pf-row + .pf-row{border-top:1px solid var(--c-line)}
.pf-row:active{background:var(--c-surface-2)}
.pf-row .rt{flex:1;min-width:0}
.pf-row .rt b{display:block;font:var(--t-title);font-size:15px;line-height:19px}
.pf-row .rs{display:block;font:var(--t-small);font-size:12.5px;line-height:16px;color:var(--c-text-muted);margin-top:2px}
.pf-row .chev{color:var(--c-text-subtle)}
.pf-foot{text-align:center;margin-top:var(--s-5)}
.pf-foot a{font:700 14px/1 var(--font-body);color:var(--c-danger);text-decoration:none}
/* Баннер «Приведи друга»: тёплый песочный, кармашек выглядывает справа снизу */
.ref-banner{position:relative;display:flex;overflow:hidden;min-height:156px;border-radius:var(--r-xl);background:var(--c-accent-sand);text-decoration:none;color:var(--c-text);padding:16px 18px 18px}
.ref-banner::before{content:"";position:absolute;right:-50px;top:-60px;width:200px;height:200px;border-radius:50%;background:#F8E6C8}
.rb-text{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;max-width:222px}
.rb-k{display:inline-flex;align-items:center;gap:6px;font:800 12px/1 var(--font-body);letter-spacing:.5px;text-transform:uppercase;color:var(--c-primary-pressed)}
.rb-t{font:var(--t-h2);color:var(--c-text-heading);margin-top:8px}
.rb-s{font:var(--t-small);color:#5A4A3A;margin-top:4px}
.rb-btn{display:inline-flex;align-items:center;gap:6px;margin-top:12px;height:36px;padding:0 14px;border-radius:var(--r-pill);background:var(--c-secondary);color:var(--c-text-on-primary);font:800 14px/1 var(--font-body)}
.rb-m{position:absolute;right:-6px;bottom:-14px;transform:rotate(-8deg);z-index:1}
.ref-banner:active{filter:brightness(.97)}
/* Экран приглашения */
.inv-hero{text-align:center;padding-top:var(--s-2)}
.ih-m{display:block;margin:0 auto}
.inv-hero h1{margin-top:4px}
.inv-hero p{font:var(--t-body);margin:6px auto 0;max-width:300px}
.inv-link{margin-top:var(--s-5)}
.lnk{display:flex;align-items:center;gap:10px;background:var(--c-surface);border-radius:var(--r-m);padding:14px 16px;box-shadow:inset 0 0 0 1.5px var(--c-line-strong);color:var(--c-text-subtle)}
.lnk span{font:700 13px/20px var(--font-body);color:var(--c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.eg{font:600 12px/16px var(--font-body);color:var(--c-text-subtle);margin:6px 0 0 4px}
.inv-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:var(--s-3)}
.inv-btns .btn{padding:0 12px}
.inv-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.inv-stats .st{padding:14px 16px}
.inv-stats b{display:block;font:600 30px/36px var(--font-display);color:var(--c-text-heading)}
.inv-stats span{display:block;font:var(--t-small);color:var(--c-text-muted);margin-top:2px}
.inv-wait{display:flex;align-items:center;gap:6px;font:var(--t-small);color:var(--c-text-muted);margin:10px 0 0 2px}
.inv-empty{padding:16px 18px;text-align:center}
.ie-t{font:var(--t-h3);color:var(--c-text-heading)}
.ie-s{font:var(--t-small);color:var(--c-text-muted);margin-top:4px}
.inv-steps{list-style:none;padding:6px 16px}
.inv-steps-w .inv-steps{padding:0}
.inv-steps li{display:flex;align-items:center;gap:12px;padding:10px 0;font:700 14.5px/19px var(--font-body);color:var(--c-text)}
.inv-steps li + li{border-top:1px solid var(--c-line)}
.inv-steps i{font-style:normal;width:28px;height:28px;border-radius:50%;flex:none;background:var(--c-primary-soft);color:var(--c-primary);display:flex;align-items:center;justify-content:center;font:600 13px/1 var(--font-display)}
.inv-rules{text-align:center;margin-top:var(--s-3)}
.inv-rules a{font:700 14px/1 var(--font-body);color:var(--c-primary);text-decoration:none}
.pf-toast{bottom:calc(var(--screen-tabbar) + 14px);z-index:6}
.pf-toast .i{color:var(--c-accent-sage)}
.pro-bank{display:flex;align-items:center;gap:12px;margin-top:var(--s-3);padding:12px 14px;border-radius:var(--r-m);background:var(--c-accent-sand);color:var(--c-primary-pressed)}
.pro-bank b{display:block;font:600 18px/24px var(--font-display);color:var(--c-text-heading)}
.pro-bank .pb-k{display:block;font:700 13px/16px var(--font-body);color:#5A4A3A}
.pro-bank b{font-size:22px;line-height:28px}
.pro-bonus{display:flex;align-items:center;gap:6px;margin-top:8px;font:700 13px/18px var(--font-body);color:var(--c-accent-sage)}
.inv-note{font:var(--t-small);color:var(--c-secondary);background:var(--c-secondary-soft);border-radius:var(--r-m);padding:8px 12px;margin:10px auto 0;max-width:330px}
.inv-other{text-align:center;margin-top:var(--s-3)}
.inv-other a{font:700 13px/1 var(--font-body);color:var(--c-text-muted);text-decoration:underline;text-underline-offset:3px}
.inv-steps-w{padding:6px 16px 12px}
.inv-steps-w .inv-steps{padding:0}
.inv-cap{display:flex;align-items:center;gap:8px;border-top:1px solid var(--c-line);padding-top:10px;font:var(--t-small);color:var(--c-text-muted)}
.inv-cap .i{color:var(--c-text-subtle)}
.sp-ov{z-index:6}
.sp-sheet{z-index:7;padding-bottom:44px}
.sp-tx{font:var(--t-body);color:var(--c-text-muted);margin-top:4px}
.sp-list{margin:var(--s-4) 0 var(--s-2)}
.icon-tile.primary{background:var(--c-primary-soft);color:var(--c-primary)}
.pf-row.is-soon .icon-tile{background:var(--c-line);color:var(--c-text-subtle)}
.pf-row.is-soon .rt b{color:var(--c-text-muted)}
.pf-row.is-soon .rs{color:var(--c-text-subtle)}
.pf-row.is-soon:active{background:transparent}
.cc-badge-s{flex:none;border-radius:var(--r-pill);padding:5px 9px;font:800 11px/1 var(--font-body);letter-spacing:.2px;background:var(--c-surface-2);color:var(--c-text-subtle)}
.pro-s2{margin-top:10px}
.pro-until{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;font:var(--t-small);color:var(--c-text-subtle)}
.inv-capbox{display:flex;gap:10px;align-items:flex-start;background:var(--c-secondary-soft);color:var(--c-secondary);border-radius:var(--r-m);padding:12px 14px;margin-bottom:10px;font:var(--t-small);line-height:19px}
.inv-capbox .i{margin-top:0}

.pro-later{margin-top:6px;width:100%;height:44px}
