/* Marketplace cabinet. Same tokens as the author portal, own bundle: 749 authors must not
   download the client's marketplace on every phone load. Desktop sets the shape (a client
   funds budgets and sorts through 130 applications at a desk), the phone gets a first-class
   layout of its own rather than a squeezed table. */
:root{
  --bg:#f0f2f5; --surface:#ffffff; --surface-2:#f7f8fa; --line:#e4e6eb;
  --text:#050505; --muted:#65676b; --brand:#2f6fed; --brand-soft:#e7f0ff;
  --ok:#31a24c; --warn:#f7b928; --danger:#e41e3f; --violet:#6d4bd8;
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --radius:14px;
  --shadow:0 1px 2px rgba(0,0,0,.08), 0 4px 16px rgba(0,0,0,.06);
  --glass:linear-gradient(180deg,rgba(255,255,255,.86),rgba(247,248,250,.74));
  --glass-b:rgba(255,255,255,.6);
  --glass-s:0 20px 56px rgba(15,23,42,.24), inset 0 1px 0 rgba(255,255,255,.7);
  --row:rgba(0,0,0,.028); --head:#7a7d84; --field:#fbfcfd; --track:rgba(0,0,0,.07);
  --speed:.22s; --nav-h:56px;
  --sat:env(safe-area-inset-top,0px); --sab:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#17181c; --surface:#232428; --surface-2:#2b2d33; --line:#34363c;
    --text:#e7e9ee; --muted:#9aa0a8; --brand:#5b8dff; --brand-soft:#22304d; --violet:#b39cff;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 20px rgba(0,0,0,.3);
    --glass:linear-gradient(180deg,rgba(40,42,48,.88),rgba(26,27,31,.8));
    --glass-b:rgba(255,255,255,.1);
    --glass-s:0 20px 56px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.09);
    --row:rgba(255,255,255,.035); --head:#8a8f97; --field:#1e1f24; --track:rgba(255,255,255,.09);
  }
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html,body{overflow-x:hidden; max-width:100%; -webkit-text-size-adjust:100%;}
body{margin:0; background:var(--bg); color:var(--text); font:15px/1.45 var(--font);
  -webkit-font-smoothing:antialiased; touch-action:manipulation;}
input,select,textarea,button{font:inherit; color:inherit;}
input,select,textarea{font-size:16px;}          /* меньше 16 — и Safari зумит форму */
a{color:var(--brand); text-decoration:none;} a:hover{text-decoration:underline;}
.num{font-variant-numeric:tabular-nums;}
.muted{color:var(--muted);}
[hidden]{display:none !important;}

.top{position:sticky; top:0; z-index:50; display:flex; align-items:center; gap:14px;
  height:calc(var(--nav-h) + var(--sat)); padding:var(--sat) 16px 0;
  background:var(--glass); border-bottom:1px solid var(--glass-b);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
  -webkit-backdrop-filter:blur(24px) saturate(180%); backdrop-filter:blur(24px) saturate(180%);}
.brand{display:flex; align-items:center; gap:9px; font-weight:800; letter-spacing:-.3px;}
.tabs{display:flex; gap:4px;}
.tab{padding:7px 13px; border-radius:999px; color:var(--muted); cursor:pointer; border:1px solid transparent;
  background:none; min-height:36px;}
.tab.on{color:var(--brand); background:var(--brand-soft); border-color:var(--glass-b); font-weight:650;}
body.is-guest .tabs, body.is-guest .bal, body.is-guest .bottom{display:none;}
.bal{display:flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px;
  background:var(--surface-2); border:1px solid var(--line); font-weight:700;}

.wrap{max-width:1320px; margin:0 auto; padding:16px;}
.cols{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:16px; align-items:start;}
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:16px; margin-bottom:14px;}
.pane{border-radius:22px; padding:18px; margin-bottom:14px; background:var(--glass);
  border:1px solid var(--glass-b); box-shadow:var(--glass-s);
  -webkit-backdrop-filter:blur(24px) saturate(180%); backdrop-filter:blur(24px) saturate(180%);}
.lbl{font-size:12px; font-weight:700; letter-spacing:.5px; color:var(--muted); margin-bottom:10px;}
.btn{background:var(--brand); color:#fff; border:0; border-radius:10px; padding:11px 16px;
  font-weight:650; cursor:pointer; min-height:44px; transition:filter var(--speed) ease;}
.btn:hover{filter:brightness(1.06);} .btn:disabled{opacity:.5; cursor:default; filter:none;}
.btn.ghost{background:transparent; color:var(--text); border:1px solid var(--line);}
.btn.glass{background:var(--glass); color:var(--brand); border:1px solid var(--glass-b);
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);}
.btn.wide{width:100%;}
.fld{width:100%; background:var(--field); border:1px solid var(--line); border-radius:11px;
  padding:12px 13px; margin-bottom:10px;}
.pill{display:inline-block; padding:4px 9px; border-radius:999px; font-size:12px; font-weight:700;}
.pill.t1{background:rgba(101,103,107,.16); color:var(--muted);}
.pill.t2{background:rgba(47,111,237,.16); color:var(--brand);}
.pill.t3{background:rgba(124,92,255,.2); color:var(--violet);}
.pill.warnp{background:rgba(247,185,40,.16); color:var(--warn);}
.pill.okp{background:rgba(49,162,76,.16); color:var(--ok);}

.tbl{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); overflow:hidden; margin-bottom:14px;}
.tr{display:grid; gap:10px; align-items:center; padding:12px 16px; border-bottom:1px solid var(--line);
  transition:background var(--speed) ease;}
.tr:last-child{border-bottom:0;}
.tr.head{font-size:11.5px; font-weight:700; letter-spacing:.5px; color:var(--head); padding:11px 16px;}
.tr.row:hover{background:var(--row);}
.tr.camp{grid-template-columns:minmax(0,1fr) 176px 76px 68px 92px 112px;}
.tr.app{grid-template-columns:34px minmax(0,1fr) 92px 74px 96px 104px;}
.tr.inv{grid-template-columns:96px 74px minmax(0,1fr) 100px 96px 100px 92px;}
.right{text-align:right;}
.cover{width:48px; height:48px; border-radius:8px; flex-shrink:0; display:grid; place-items:center;
  background:linear-gradient(135deg,#f97316,#db2777); color:rgba(255,255,255,.92); font-weight:800;}
.ava{width:34px; height:34px; border-radius:50%; flex-shrink:0; display:grid; place-items:center;
  color:#fff; font-weight:700; font-size:12.5px; background:linear-gradient(135deg,#7c5cff,#2f6fed);}
.ell{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
/* Строка «иконка + текст» одинакова на десктопе и на телефоне: без этого правила класс
   получал display:flex только в мобильном медиазапросе, и обложка вставала над названием. */
.m-row{display:flex; align-items:center; gap:0;}
.bar{height:6px; border-radius:999px; background:var(--track); overflow:hidden;}
.bar i{display:block; height:100%; border-radius:999px; background:var(--brand);
  transform-origin:left center; animation:growX .7s cubic-bezier(.22,1,.36,1) both;}
@keyframes growX{from{transform:scaleX(0);} to{transform:scaleX(1);}}
@keyframes riseIn{from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;}}
.rise{animation:riseIn .4s cubic-bezier(.22,1,.36,1) both;}
@media (prefers-reduced-motion: reduce){ .bar i,.rise{animation:none; transform:none;} }

.amount{display:flex; align-items:baseline; gap:6px;}
.amount .cur{font-size:38px; font-weight:800; color:var(--muted); letter-spacing:-1.2px;}
.amount input{font-size:56px; font-weight:900; letter-spacing:-2.5px; line-height:1; border:0;
  background:none; width:100%; padding:0; outline:none; color:var(--text);}
.scale{position:relative; height:52px; margin:14px 0 4px;}
.scale .rail{position:absolute; top:24px; left:0; right:0; height:8px; border-radius:999px;
  background:var(--track); overflow:hidden;}
.scale .rail i{display:block; height:100%;}
.scale .mark{position:absolute; top:0; transform:translateX(-50%); text-align:center; font-size:11.5px;
  font-weight:700; color:var(--muted); white-space:nowrap;}
/* Крайние подписи прижимаются к своей стороне: центрированная последняя метка уезжала
   за правый край и ломалась на две строки. */
.scale .mark.first{transform:none; text-align:left;}
.scale .mark.last{transform:translateX(-100%); text-align:right;}
.scale .mark.first s{margin-left:1px;} .scale .mark.last s{margin-right:1px;}
.scale .mark s{display:block; width:2px; height:13px; border-radius:1px; background:var(--track);
  margin:5px auto 0;}
.scale .thumb{position:absolute; top:28px; width:26px; height:26px; border-radius:50%;
  background:var(--surface); border:3px solid var(--brand); box-shadow:0 4px 14px rgba(15,23,42,.28);
  transform:translate(-50%,-50%); transition:left var(--speed) ease;}
.toast{position:fixed; left:50%; bottom:calc(24px + var(--sab)); transform:translateX(-50%);
  background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow);
  border-radius:12px; padding:12px 18px; z-index:200; max-width:90vw;}
.promi{display:flex; gap:12px; margin-bottom:14px;}
.promi .face{width:44px; height:44px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg,#7c5cff,#2f6fed); display:grid; place-items:center;}
.promi .bubble{border-radius:20px; border-top-left-radius:7px; padding:14px 16px; background:var(--glass);
  border:1px solid var(--glass-b); box-shadow:var(--glass-s); font-size:14.5px;
  -webkit-backdrop-filter:blur(24px) saturate(180%); backdrop-filter:blur(24px) saturate(180%);}

/* Таб-бар описан ДО медиазапроса: медиазапрос не добавляет специфичности, и правило,
   стоящее после него, просто перебивало включение (грабли D8). */
.bottom{display:none; position:fixed; left:0; right:0; bottom:0; z-index:60;
  align-items:center; justify-content:space-around; height:calc(66px + var(--sab));
  padding-bottom:var(--sab); background:var(--glass); border-top:1px solid var(--glass-b);
  -webkit-backdrop-filter:blur(24px) saturate(180%); backdrop-filter:blur(24px) saturate(180%);}
.bottom b{display:flex; flex-direction:column; align-items:center; gap:3px; font-size:11px;
  font-weight:500; color:var(--muted); min-width:64px; min-height:44px; justify-content:center;
  cursor:pointer;}
.bottom b.on{color:var(--brand); font-weight:700;}

@media (max-width: 900px){
  .cols{grid-template-columns:minmax(0,1fr);}
  .wrap{padding:12px 12px calc(84px + var(--sab));}
  .tabs{display:none;}
  .tr.camp,.tr.app,.tr.inv{grid-template-columns:minmax(0,1fr); gap:8px;}
  .tr.head{display:none;}
  .tr{padding:14px 14px;}
  .tr .m-hide{display:none;}
  .tr [data-l]{display:flex; align-items:baseline; justify-content:space-between; text-align:left;}
  .tr [data-l]::before{content:attr(data-l); font-size:11.5px; font-weight:700; letter-spacing:.5px;
    color:var(--head);}
  .tr [data-l] > *{text-align:right;}
  .tr .m-row{gap:10px;}
  .amount input{font-size:42px;}
  .bottom{display:flex;}
}


/* Тот же самохост Inter, что и в авторском портале: один шрифт на всех платформах. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/static/fonts/inter-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/static/fonts/inter-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/static/fonts/inter-greek-ext.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/static/fonts/inter-greek.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/static/fonts/inter-vietnamese.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/static/fonts/inter-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/static/fonts/inter-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}