/* Пульт · Мошненко — светлая и тёмная тема, мягкие формы. Шрифты: Onest (текст), Montserrat 700 (логотип). */
@font-face{font-family:"Onest";src:url(/fonts/onest-cyrillic-400-normal.woff2) format("woff2");font-weight:400;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;ascent-override:96%;descent-override:24%;line-gap-override:0%;font-display:swap}
@font-face{font-family:"Onest";src:url(/fonts/onest-latin-400-normal.woff2) format("woff2");font-weight:400;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2122,U+2212;ascent-override:96%;descent-override:24%;line-gap-override:0%;font-display:swap}
@font-face{font-family:"Onest";src:url(/fonts/onest-cyrillic-500-normal.woff2) format("woff2");font-weight:500;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;ascent-override:96%;descent-override:24%;line-gap-override:0%;font-display:swap}
@font-face{font-family:"Onest";src:url(/fonts/onest-latin-500-normal.woff2) format("woff2");font-weight:500;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2122,U+2212;ascent-override:96%;descent-override:24%;line-gap-override:0%;font-display:swap}
@font-face{font-family:"Onest";src:url(/fonts/onest-cyrillic-600.woff2) format("woff2");font-weight:600 700;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;ascent-override:96%;descent-override:24%;line-gap-override:0%;font-display:swap}
@font-face{font-family:"Onest";src:url(/fonts/onest-latin-600.woff2) format("woff2");font-weight:600 700;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2122,U+2212;ascent-override:96%;descent-override:24%;line-gap-override:0%;font-display:swap}
@font-face{font-family:"Mont";src:url(/fonts/montserrat-cyrillic-700.woff2) format("woff2");font-weight:700;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;font-display:swap}
@font-face{font-family:"Mont";src:url(/fonts/montserrat-latin-700.woff2) format("woff2");font-weight:700;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2122,U+2212;font-display:swap}

:root{
  --bg:#F7F7F4; --col:#EFEFEB; --panel:#FFFFFF; --soft:#F5F5F2; --ink:#1B1C1E; --ink-2:#55585E; --mute:#9A9CA1; --line:#E7E6E1; --hover:#F1F1ED;
  --shadow:0 1px 2px rgba(28,28,25,.04),0 2px 8px rgba(28,28,25,.04); --shadow-up:0 6px 22px rgba(28,28,25,.10); --shadow-lg:0 24px 60px rgba(28,28,25,.18);
  --brand-red:#D7263D; --brand-green:#2FD48A; --logo:#1B1C1E;
  --c-slate:#64748B; --c-blue:#4F6BDE; --c-violet:#8B5CF6; --c-amber:#D9822B; --c-green:#3D9A6B; --c-rose:#E0567A; --c-teal:#1F9E95; --c-grey:#A1A3A8;
  --urgent:#D7263D; --important:#D9822B;
  --r-card:14px; --r-col:20px;
}
:root[data-theme="dark"]{
  --bg:#111214; --col:#17181B; --panel:#1E1F23; --soft:#232428; --ink:#ECECEA; --ink-2:#B3B5BA; --mute:#7D8086; --line:#2A2C30; --hover:#26272C;
  --shadow:0 1px 2px rgba(0,0,0,.35); --shadow-up:0 8px 26px rgba(0,0,0,.45); --shadow-lg:0 24px 60px rgba(0,0,0,.6);
  --brand-red:#FF4D62; --logo:#ECECEA;
  --c-slate:#94A3B8; --c-blue:#7D93F2; --c-violet:#A78BFA; --c-amber:#F0A458; --c-green:#5CC08C; --c-rose:#F27A99; --c-teal:#3CC4B9; --c-grey:#7D8086;
  --urgent:#FF5C6E; --important:#F0A458;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 14px/1.45 "Onest",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;transition:background .25s,color .25s}
button,input,textarea,select{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--c-blue);outline-offset:2px;border-radius:8px}
[hidden]{display:none!important}

/* ============ шапка */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;padding:14px 24px;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}
.logo{display:flex;align-items:center;gap:11px;flex:none;color:var(--logo)}
.logo svg{width:34px;height:34px;display:block}
.logo .dot{fill:var(--brand-green)}
.logo b{font:700 21px/1 "Mont","Onest",sans-serif;letter-spacing:-.01em;color:var(--brand-red)}
.switch{display:inline-flex;padding:4px;border-radius:999px;background:var(--col);flex:none}
.switch button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 18px;border:0;border-radius:999px;background:none;cursor:pointer;color:var(--ink-2);font-weight:600;white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s}
.switch button b{font-weight:600;color:var(--mute);font-size:12.5px}
.switch button[aria-pressed="true"]{background:var(--panel);color:var(--ink);box-shadow:var(--shadow)}
.top__right{margin-left:auto;display:flex;align-items:center;gap:8px}
.search{display:flex;align-items:center;gap:8px;width:240px;height:38px;padding:0 12px;border-radius:999px;background:var(--panel);box-shadow:var(--shadow);transition:width .3s}
.search:focus-within{width:300px;box-shadow:0 0 0 2px color-mix(in srgb,var(--c-blue) 35%,transparent)}
.search svg{width:15px;height:15px;color:var(--mute);flex:none}
.search input{flex:1;min-width:0;border:0;outline:none;background:none}
.search input::placeholder{color:var(--mute)}
.btn{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 16px;border:0;border-radius:999px;background:var(--panel);box-shadow:var(--shadow);cursor:pointer;font-weight:600;white-space:nowrap;transition:transform .15s,box-shadow .15s,background .15s}
.btn,.mini,.chip,.switch button,.pick button,.tabs button{line-height:1;font-weight:500!important}
.chip[aria-pressed="true"],.switch button[aria-pressed="true"]{font-weight:500}
.btn .lbl{display:block;line-height:1}
.btn:hover{box-shadow:var(--shadow-up)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.6;cursor:default}
.btn svg{width:16px;height:16px;flex:none}
.btn.is-busy svg{animation:spin .9s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.btn--dark{background:var(--ink);color:var(--bg)}
.btn--ghost{background:none;box-shadow:none;color:var(--ink-2)}
.btn--ghost:hover{background:var(--hover);box-shadow:none}
.btn--danger{color:var(--urgent)}
.icon-btn{width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:999px;background:none;color:var(--ink-2);cursor:pointer;transition:background .15s}
.icon-btn:hover{background:var(--hover);color:var(--ink)}
.icon-btn svg{width:18px;height:18px}

/* ============ вторая строка */
.bar{display:flex;align-items:center;gap:10px;padding:2px 24px 14px}
.chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;padding:2px}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 13px;border:0;border-radius:999px;background:none;cursor:pointer;color:var(--ink-2);white-space:nowrap;transition:background .15s}
.chip:hover{background:var(--hover)}
.chip i{width:8px;height:8px;border-radius:50%;background:var(--pc,var(--mute))}
.chip b{font-weight:500;color:var(--mute)}
.chip[aria-pressed="true"]{background:var(--panel);color:var(--ink);box-shadow:var(--shadow);font-weight:600}
.sync{display:inline-flex;align-items:center;gap:7px;color:var(--mute);font-size:12.5px;white-space:nowrap}
.sync i{width:7px;height:7px;border-radius:50%;background:var(--c-green)}
.sync.is-warn i{background:var(--c-amber)}
.sync.is-busy i{background:var(--c-blue);animation:pulse 1.1s ease-in-out infinite}
@keyframes pulse{50%{opacity:.25}}
.toggle{flex:none;display:inline-flex;align-items:center;gap:7px;color:var(--ink-2);cursor:pointer;user-select:none;font-size:13px}
.toggle input{accent-color:var(--ink);width:15px;height:15px}

/* ============ доска */
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,1fr);gap:16px;padding:0 24px 40px;align-items:start;overflow-x:auto}
.col{background:var(--col);border-radius:var(--r-col);display:flex;flex-direction:column;max-height:calc(100vh - 140px);transition:box-shadow .15s,background .15s}
.col.is-over{box-shadow:inset 0 0 0 2px var(--c)}
.col__head{display:flex;align-items:center;gap:8px;padding:14px 16px 10px;flex:none}
.col__head h2{margin:0;font-size:14px;font-weight:600}
.col__dot{width:9px;height:9px;border-radius:50%;background:var(--c)}
.col__count{color:var(--mute);font-weight:600;font-size:13px}
.col__hint{margin-left:auto;color:var(--mute);font-size:12px}
.col__body{display:flex;flex-direction:column;gap:10px;padding:2px 10px 14px;overflow-y:auto;flex:1;scrollbar-width:thin}
.col__empty{padding:26px 8px;text-align:center;color:var(--mute);font-size:13px}
.col__more,.col__stale{display:flex;align-items:center;justify-content:center;gap:6px;padding:9px;border:0;border-radius:12px;background:none;color:var(--mute);cursor:pointer;font-size:12.5px;font-weight:500}
.col__more:hover,.col__stale:hover{background:var(--hover);color:var(--ink)}
.col--add{background:none;border:2px dashed var(--line);display:grid;place-items:center;min-height:120px;color:var(--mute);cursor:pointer;font-weight:600}
.col--add:hover{color:var(--ink);border-color:var(--mute)}

.quick{display:flex;align-items:center;gap:8px;height:42px;padding:0 14px;border-radius:var(--r-card);background:var(--panel);box-shadow:var(--shadow)}
.quick:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--c) 40%,transparent)}
.quick span{color:var(--mute);font-size:18px;line-height:1}
.quick input{flex:1;min-width:0;border:0;outline:none;background:none}
.quick input::placeholder{color:var(--mute)}

/* ============ карточка */
.card{position:relative;background:var(--panel);border-radius:var(--r-card);padding:13px 14px 11px;box-shadow:var(--shadow);cursor:pointer;transition:box-shadow .18s,transform .18s,opacity .3s}
.card:hover{box-shadow:var(--shadow-up);transform:translateY(-1px)}
.card.is-selected{box-shadow:0 0 0 2px var(--c),var(--shadow-up)}
.card.is-dragging{opacity:.35}
.card.is-stale{opacity:.7}
.card.is-closed{opacity:.6}
.card.is-closed .card__title{text-decoration:line-through;text-decoration-color:var(--mute)}
.card.prio-2{box-shadow:inset 3px 0 0 var(--urgent),var(--shadow)}
.card.prio-1{box-shadow:inset 3px 0 0 var(--important),var(--shadow)}
.card__top{display:flex;align-items:center;gap:6px;margin-bottom:7px;min-width:0}
.proj{display:inline-flex;align-items:center;gap:6px;max-width:62%;height:22px;padding:0 9px;border-radius:999px;background:color-mix(in srgb,var(--pc) 12%,transparent);color:color-mix(in srgb,var(--pc) 85%,var(--ink));font-size:11.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.src{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;color:var(--mute);font-weight:500;white-space:nowrap}
.src svg{width:12px;height:12px}
.ago{margin-left:auto;color:var(--mute);font-size:11.5px;white-space:nowrap;flex:none}
.card__title{margin:0;font-size:14.5px;font-weight:600;line-height:1.38;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card__next{margin:6px 0 0;color:var(--ink-2);font-size:13px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card__next.is-arrow::before{content:"→ ";color:var(--c);font-weight:700}
.card__foot{display:flex;align-items:center;gap:6px;margin-top:10px;min-height:26px}
.flag{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;font-size:11.5px;font-weight:600}
.flag--2{background:color-mix(in srgb,var(--urgent) 12%,transparent);color:var(--urgent)}
.flag--1{background:color-mix(in srgb,var(--important) 14%,transparent);color:var(--important)}
.flag--m1{background:var(--soft);color:var(--mute)}
.tag{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;font-size:11.5px;background:var(--soft);color:var(--ink-2)}
.tag--new{background:color-mix(in srgb,var(--c-green) 14%,transparent);color:var(--c-green);font-weight:600}
.card__acts{margin-left:auto;display:flex;gap:4px;opacity:0;transition:opacity .15s}
.card:hover .card__acts,.card:focus-within .card__acts{opacity:1}
.mini{height:28px;min-width:28px;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 9px;border:0;border-radius:999px;background:var(--soft);color:var(--ink-2);cursor:pointer;font-size:12px;font-weight:600}
.mini:hover{background:var(--hover);color:var(--ink)}
.mini svg{width:13px;height:13px}
.mini--ok:hover{background:color-mix(in srgb,var(--c-green) 16%,transparent);color:var(--c-green)}

/* ============ панель */
.scrim{position:fixed;inset:0;z-index:30;background:rgba(17,17,15,.24);animation:fade .2s}
:root[data-theme="dark"] .scrim{background:rgba(0,0,0,.5)}
@keyframes fade{from{opacity:0}}
.drawer{position:fixed;top:12px;right:12px;bottom:12px;z-index:31;width:min(460px,calc(100vw - 24px));background:var(--panel);border-radius:24px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden;animation:slide .28s cubic-bezier(.2,.8,.2,1)}
@keyframes slide{from{transform:translateX(24px);opacity:0}}
.drawer__head{display:flex;align-items:center;gap:8px;padding:16px 18px 6px}
.drawer__head .icon-btn{margin-left:auto}
.drawer__body{flex:1;overflow-y:auto;padding:10px 22px 26px;display:flex;flex-direction:column;gap:20px}
.drawer h2{margin:0;font-size:20px;line-height:1.3;font-weight:600}
.title-input{width:100%;border:0;border-radius:12px;padding:8px 10px;margin:-8px -10px;background:none;font-size:20px;font-weight:600;line-height:1.3;outline:none}
.title-input:hover,.title-input:focus{background:var(--soft)}
.flbl{display:block;margin-bottom:8px;color:var(--mute);font-size:12px;font-weight:600}
.field p{margin:0;color:var(--ink-2);line-height:1.6}
.next-box{padding:13px 15px;border-radius:16px;background:color-mix(in srgb,var(--c) 9%,var(--panel));color:var(--ink);font-weight:500;line-height:1.55}
.pick{display:flex;flex-wrap:wrap;gap:6px}
.pick button{height:34px;padding:0 13px;border:0;border-radius:999px;background:var(--soft);cursor:pointer;color:var(--ink-2);font-weight:600;display:inline-flex;align-items:center;gap:7px;transition:background .15s}
.pick button:hover{background:var(--hover)}
.pick button i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.pick button[aria-pressed="true"]{background:color-mix(in srgb,var(--c) 15%,var(--panel));color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--c)}
.field textarea,.field input[type=text]{width:100%;border:0;border-radius:14px;padding:11px 13px;background:var(--soft);resize:vertical;min-height:96px;outline:none;line-height:1.5}
.field input[type=text]{min-height:0;height:40px}
.field textarea:focus,.field input[type=text]:focus{box-shadow:0 0 0 2px color-mix(in srgb,var(--c-blue) 35%,transparent);background:var(--panel)}
.drawer__foot{display:flex;flex-wrap:wrap;gap:8px;padding:14px 18px 18px}
.drawer__foot .btn--danger{margin-left:auto}
.meta-line{display:flex;flex-wrap:wrap;gap:6px 14px;color:var(--mute);font-size:12.5px}

/* редактор воронки */
.stages{display:flex;flex-direction:column;gap:8px}
.stage{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 12px;border-radius:14px;background:var(--soft)}
.stage input{flex:1;min-width:0;border:0;background:none;outline:none;font-weight:600;height:30px}
.stage .final{font-size:11.5px;color:var(--mute);white-space:nowrap}
.colors{display:flex;gap:4px}
.colors button{width:16px;height:16px;border-radius:50%;border:0;background:var(--c);cursor:pointer;padding:0;opacity:.45}
.colors button[aria-pressed="true"]{opacity:1;box-shadow:0 0 0 2px var(--panel),0 0 0 3.5px var(--c)}
.stage .icon-btn{width:30px;height:30px}
.stage .icon-btn svg{width:15px;height:15px}

/* ============ вход */
.login{min-height:100vh;display:grid;place-items:center;padding:20px}
.login form{width:min(380px,100%);background:var(--panel);border-radius:28px;padding:34px 30px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;gap:14px}
.login .logo{margin-bottom:10px}
.login input{height:46px;border:0;border-radius:14px;padding:0 15px;background:var(--soft);outline:none}
.login input:focus{box-shadow:0 0 0 2px color-mix(in srgb,var(--c-blue) 35%,transparent)}
.login .btn{justify-content:center;height:46px}
.login .err{color:var(--urgent);font-size:13px;min-height:1.2em}

.toast{position:fixed;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:50;display:flex;align-items:center;gap:16px;padding:11px 18px;border-radius:999px;background:var(--ink);color:var(--bg);box-shadow:var(--shadow-lg);font-weight:600;max-width:calc(100vw - 32px)}
.toast button{border:0;background:none;color:var(--brand-green);font-weight:700;cursor:pointer;padding:0}

/* ============ телефон */
.tabs{display:none}
@media (max-width:900px){
  .top{padding:10px 14px;gap:10px;flex-wrap:wrap}
  .logo svg{width:30px;height:30px} .logo b{font-size:19px}
  .top__right{display:contents}
  .top__right>.icon-btn:first-of-type{margin-left:auto}
  .switch{order:3;flex:1 0 100%;justify-content:stretch}
  .switch button{flex:1;justify-content:center;padding:0 10px}
  .search{order:4;flex:1 0 100%;width:auto}
  .search:focus-within{width:auto}
  .chips{flex:1 0 100%}
  .btn .lbl{display:none}
  .btn{padding:0 12px}
  .bar{padding:0 14px 8px;flex-wrap:wrap}
  .tabs{display:flex;gap:6px;padding:0 14px 10px;overflow-x:auto;scrollbar-width:none}
  .tabs button{flex:none;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border:0;border-radius:999px;background:none;cursor:pointer;font-weight:600;color:var(--ink-2)}
  .tabs button i{width:8px;height:8px;border-radius:50%;background:var(--c)}
  .tabs button b{color:var(--mute);font-weight:500}
  .tabs button[aria-pressed="true"]{background:var(--panel);color:var(--ink);box-shadow:var(--shadow)}
  .board{display:block;padding:0 14px 40px}
  .col{display:none;max-height:none;background:none}
  .col.is-active{display:flex}
  .col__head,.col--add{display:none}
  .col__body{padding:0;overflow:visible}
  .card__acts{opacity:1}
  .drawer{top:auto;left:8px;right:8px;bottom:8px;width:auto;max-height:88vh;border-radius:24px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ============ сроки, связи с Claude, «Сегодня» */
.switch button b.hot{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--brand-red);color:#fff;display:inline-grid;place-items:center;font-size:11.5px}
.due{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:999px;font-size:11.5px;font-weight:600;background:var(--soft);color:var(--ink-2)}
.due svg{width:11px;height:11px}
.due--over{background:color-mix(in srgb,var(--urgent) 13%,transparent);color:var(--urgent)}
.due--today{background:color-mix(in srgb,var(--c-amber) 16%,transparent);color:var(--c-amber)}
.due--soon{background:color-mix(in srgb,var(--c-blue) 11%,transparent);color:var(--c-blue)}
.tag--claude{gap:4px;background:color-mix(in srgb,var(--c-violet) 12%,transparent);color:var(--c-violet);font-weight:600}
.tag--claude svg{width:11px;height:11px}
.due-field{display:flex;flex-direction:column;gap:8px}
.due-field input[type=date]{width:180px;height:38px;border:0;border-radius:12px;padding:0 12px;background:var(--soft);outline:none;color-scheme:light dark}
.due-field input[type=date]:focus{box-shadow:0 0 0 2px color-mix(in srgb,var(--c-blue) 35%,transparent)}
.due-field .pick button{height:30px;padding:0 11px;font-size:12.5px}
.linked{display:flex;flex-direction:column;gap:4px;width:100%;text-align:left;padding:12px 14px;border:0;border-radius:14px;background:var(--soft);color:inherit;margin-bottom:8px}
.linked b{font-weight:600;line-height:1.35}
.linked p{margin:0;color:var(--ink-2);font-size:13px;line-height:1.45}
.linked .lnk{align-self:flex-start;margin-top:4px;color:var(--c-violet);font-weight:600;font-size:13px}
.linked__top{display:flex;align-items:center;gap:8px}
.linked__col{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--ink-2)}
.linked__col i{width:7px;height:7px;border-radius:50%;background:var(--c)}
button.linked--task{cursor:pointer}
button.linked--task:hover{background:var(--hover)}
.stage__pad{width:30px;flex:none}