/* life-hub: Пульт и Жизнь. Стили вынесены из терминала (Polymarket_dashboard/terminal) 24.09.2026,
   торговые панели и финансы остались там. */
:root{
  --bg:#ffffff; --bg2:#f8fafc; --bg3:#f1f5f9;
  --line:#e5e7eb; --line2:#eef2f7;
  --text:#1f2937; --muted:#64748b; --faint:#94a3b8;
  --green:#16a34a; --greenbg:rgba(38,166,154,.14);
  --red:#dc2626; --redbg:rgba(239,83,80,.14);
  --blue:#2563eb;
  --r:8px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{
  font-family:'Segoe UI',system-ui,-apple-system,Roboto,Arial,sans-serif;
  color:var(--text); background:var(--bg2); font-size:13px;
  -webkit-font-smoothing:antialiased;
}
b{font-weight:700}
.muted{color:var(--muted)} .faint{color:var(--faint)}
button{font-family:inherit;cursor:pointer}
input,select{font-family:inherit;color:var(--text)}

/* ---------- TOPBAR ---------- */
.topbar{
  display:flex; align-items:center; gap:16px;
  background:var(--bg); border:1px solid var(--line); border-radius:var(--r);
  padding:0 14px;
}
.tb-left{display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:0}
.logo{font-weight:800;letter-spacing:.3px;color:var(--blue);white-space:nowrap}
.grow{flex:1}
.icon-btn{border:1px solid var(--line);background:var(--bg2);border-radius:6px;width:28px;height:26px;color:var(--muted);font-size:13px}
.icon-btn:hover{background:var(--bg3)}
/* toast */
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%) translateY(20px);
  background:#111827;color:#fff;padding:10px 16px;border-radius:8px;font-size:13px;
  opacity:0;pointer-events:none;transition:.2s;z-index:99;max-width:80vw}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.err{background:var(--red)} .toast.ok{background:var(--green)}
.mode-switch{display:inline-flex;background:var(--bg3);border-radius:7px;padding:2px;gap:2px;flex:0 0 auto}
.mode-switch button{border:0;background:transparent;color:var(--muted);font-weight:700;font-size:12px;
  padding:5px 12px;border-radius:5px}
.mode-switch button.active{background:var(--bg);color:var(--blue);box-shadow:0 1px 2px rgba(0,0,0,.06)}
.fin-tabs{display:flex;align-items:center;gap:4px;background:var(--bg);border:1px solid var(--line);
  border-radius:var(--r);padding:6px 8px}
.fin-tabs .grow{flex:1 1 auto}
.fin-tabs > button:not(.icon-btn){border:0;background:transparent;color:var(--muted);font-weight:700;
  font-size:12.5px;padding:6px 14px;border-radius:6px}
.fin-tabs > button.active{background:var(--bg3);color:var(--text)}
.fin-body{flex:1 1 auto;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:8px}
.badge{display:inline-block;padding:1px 7px;border-radius:999px;font-size:11px;font-weight:700;
  background:var(--bg3);color:var(--muted);white-space:nowrap}
.badge.active{background:rgba(16,185,129,.14);color:var(--green)}
.badge.paused{background:rgba(245,158,11,.16);color:#b45309}
.badge.archived{background:var(--bg3);color:var(--faint)}
.badge.done{background:rgba(59,130,246,.14);color:var(--blue)}
.badge.warn{background:rgba(239,68,68,.12);color:var(--red)}
/* stat row */
.fin-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.stat{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px}
.stat .lbl{color:var(--faint);font-size:11px;text-transform:uppercase;letter-spacing:.3px}
.stat .val{font-size:20px;font-weight:800;margin-top:3px}
.stat .val.pos{color:var(--green)} .stat .val.neg{color:var(--red)}
.stat .sub{color:var(--muted);font-size:11.5px;margin-top:2px}

/* cards grid */
.fin-cols{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-width:900px){.fin-cols{grid-template-columns:1fr}}
.card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.card h3{margin:0 0 8px;font-size:12.5px;color:var(--muted);font-weight:700;
  text-transform:uppercase;letter-spacing:.3px}
.badge{font-size:11px;font-weight:700;padding:3px 8px;border-radius:20px;background:var(--bg3);color:var(--muted)}
.badge.warn{background:var(--redbg);color:var(--red)}
.badge.ok{background:var(--greenbg);color:var(--green)}
.fin-empty{color:var(--faint);padding:24px;text-align:center;font-size:13px}
.life-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:8px;align-items:start}
.life-grid .card.wide{grid-column:1 / -1}
.life-grid.inner{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.life-list{display:flex;flex-direction:column;gap:1px}
.chk{display:flex;align-items:flex-start;gap:8px;padding:5px 6px;border-radius:6px;cursor:pointer;
  font-size:12.5px;line-height:1.35}
.chk:hover{background:var(--bg3)}
.chk input{margin:2px 0 0;accent-color:var(--green);flex:0 0 auto}
.chk > span{flex:1 1 auto}
.chk.on > span{color:var(--muted);text-decoration:line-through}
.chk .del{margin-left:auto;border:0;background:transparent;color:var(--faint);font-size:14px;padding:0 4px;line-height:1}
.chk .del:hover{color:var(--red)}
.tag{flex:0 0 auto;font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:999px;
  background:var(--bg3);color:var(--muted);white-space:nowrap}
.tag.warn{background:var(--redbg);color:var(--red)}
.life-view input,.life-view select,.life-view textarea{border:1px solid var(--line);border-radius:6px;
  background:var(--bg2);color:var(--text);font-size:12.5px;padding:5px 8px;font-family:inherit}
.life-view input:focus,.life-view select:focus,.life-view textarea:focus{outline:none;border-color:var(--blue);background:#fff}
.life-view .btn{border:1px solid var(--line);border-radius:6px;background:var(--bg3);color:var(--text);
  font-size:12.5px;font-weight:700;padding:5px 12px}
.life-view .btn:hover{border-color:var(--blue);color:var(--blue)}
.life-add{display:flex;gap:6px;margin-top:8px}
.life-add input{flex:1 1 auto;min-width:0}
.life-hint{font-size:11.5px;color:var(--muted);background:var(--bg3);border-radius:6px;padding:6px 9px;margin-bottom:8px}
.life-rows .row{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.life-rows .row:last-child{border-bottom:0}
.life-rows .row > span:first-child{color:var(--muted);flex:1 1 auto}
.life-rows .row b.warn{color:var(--red)}
.row.wheel{display:grid;grid-template-columns:1fr 90px 26px;align-items:center}
.lbar{height:5px;border-radius:99px;background:var(--bg3);overflow:hidden}
.lbar i{display:block;height:100%;background:var(--green);border-radius:99px}
.lbar.red i{background:var(--red)}
.chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:6px}
.chip{font-size:11px;padding:2px 8px;border-radius:999px;background:var(--bg3);color:var(--muted)}
.chip.ok{background:var(--greenbg);color:var(--green)}
.life-field{margin-bottom:11px}
.life-field .lbl,.hor .lbl,.life-grid.inner .lbl{font-size:10.5px;color:var(--faint);letter-spacing:.4px;
  text-transform:uppercase;font-weight:700;margin-bottom:3px}
.life-field p{margin:0;font-size:12.5px;white-space:pre-wrap;line-height:1.45}
.life-ul{margin:0;padding-left:16px;font-size:12.5px;line-height:1.5}
.life-ul li{margin:3px 0}
.hor{margin-bottom:10px}
.stage .badge{float:right;margin-left:8px}
.stage-period{font-size:11.5px;margin:-4px 0 7px}
.card.stage.warn{border-color:var(--red)}
.card.stage.done{opacity:.7}
.wchart{width:100%;height:70px;margin-bottom:8px}
.wchart polyline{fill:none;stroke:var(--green);stroke-width:2}
.wchart circle{fill:var(--green)}
.life-note-form{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.life-note{border-bottom:1px solid var(--line);padding:5px 0;font-size:12.5px}
.life-note:last-child{border-bottom:0}
.life-note p{margin:2px 0 0;white-space:pre-wrap}
.life-goal p{margin:0 0 8px;font-size:13px}
.stat .sub.warn,.stat .val.warn{color:var(--red)}
@media(max-width:820px){
  body.mode-life .topbar{padding:0 10px;gap:10px}
  .life-grid{grid-template-columns:1fr}
  .sub-add{display:flex}
  #lifeTabs,#finTabs{flex-wrap:wrap}
}
.row.hor-row{display:grid;grid-template-columns:54px 1fr;align-items:baseline;gap:8px}
.row.hor-row b{font-weight:600;white-space:pre-wrap}

/* Задачи: группы, подзадачи, план недели */
.task{padding:3px 0;border-bottom:1px solid var(--line);}
.task:last-of-type{border-bottom:0}
.task > .chk{align-items:flex-start}
.subs{margin:0 0 2px 24px;border-left:2px solid var(--line);padding-left:6px}
.subs .chk{font-size:12px;padding:3px 6px}
.sub-add{display:none;margin:2px 0 6px 30px}
.sub-add input{font-size:11.5px;padding:3px 7px}
.sub-add .btn{padding:3px 9px;font-size:11.5px}
.task:hover .sub-add,.sub-add:focus-within{display:flex}
.task-note{margin:0 0 6px 30px;font-size:11px}
.pin{margin-left:auto;border:1px solid var(--line);background:var(--bg2);color:var(--muted);
  border-radius:99px;font-size:10.5px;font-weight:700;padding:1px 8px;white-space:nowrap}
.pin:hover{border-color:var(--blue);color:var(--blue)}
.pin.on{background:#e8eefc;border-color:#c7d7f7;color:var(--blue)}
.chk .pin + .del{margin-left:4px}
.week-group{margin-bottom:8px}
.week-group .lbl{font-size:10.5px;color:var(--faint);letter-spacing:.4px;text-transform:uppercase;
  font-weight:700;margin:6px 0 2px}
.week-more{width:100%;margin-top:8px}
.newgroup{max-width:420px}
/* на телефоне наведения нет — поле «шаг» показываем всегда */
@media(max-width:820px){.sub-add{display:flex}}
.home-title{font-size:12.5px;padding-left:6px}
.home-view .lbl{font-size:10.5px;color:var(--faint);letter-spacing:.4px;text-transform:uppercase;font-weight:700}
.home-view .btn{border:1px solid var(--line);border-radius:6px;background:var(--bg3);color:var(--text);
  padding:5px 10px;font-size:12px;font-weight:600}
.home-view .btn:hover{border-color:var(--blue);color:var(--blue)}
.home-view .warn{color:var(--red)}
.north{font-size:12.5px;color:var(--muted);padding:2px 4px;line-height:1.45}
.north .lbl{margin-right:8px}
.hbar{height:7px;border-radius:99px;background:var(--bg3);overflow:hidden;margin:7px 0 5px}
.hbar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#60a5fa,var(--blue))}
.hbar.ok i{background:var(--green)}
.hbar.red i{background:var(--red)}
.hbar.dim i{background:#cbd5e1}
/* главная цель */
.goal-hero{padding:16px 18px;border-radius:12px;
  background:linear-gradient(135deg,#f5f8ff 0%,#fff 55%);border-color:#dbe5fb}
.gh-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.gh-head h2{margin:0;font-size:17px;font-weight:800}
.gh-ico{font-size:24px;width:44px;height:44px;border-radius:12px;background:#e8eefc;display:grid;place-items:center;flex:0 0 44px}
.gh-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.gh-big{font-size:24px;font-weight:800;margin-top:4px;white-space:nowrap}
.gh-big span{font-size:13px;color:var(--muted);font-weight:600}
.gh-sub{font-size:11.5px;color:var(--muted);line-height:1.4}
.gh-col.eta .gh-big{color:var(--blue)}
.gh-lever{margin-top:8px;font-size:12px;background:#ecfdf5;color:#047857;border-radius:8px;padding:6px 9px}
.ms-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:14px;
  padding-top:12px;border-top:1px solid var(--line2)}
.ms-top{display:flex;gap:7px;align-items:flex-start;font-size:12px;font-weight:600;line-height:1.35;min-height:32px}
.ms-dot{flex:0 0 16px;height:16px;border-radius:50%;border:2px solid #cbd5e1;font-size:10px;display:grid;place-items:center;margin-top:1px}
.ms.done .ms-dot{background:var(--green);border-color:var(--green);color:#fff}
.ms.done .ms-text{color:var(--muted)}
.ms .hbar{height:5px;margin:6px 0 3px}
.ms-sub{font-size:11px;color:var(--faint)}
.gh-note{font-size:11px;margin-top:10px}
/* цели-сферы */
.goal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.goal{border-radius:12px;padding:14px;cursor:pointer;display:flex;flex-direction:column;
  transition:border-color .15s,box-shadow .15s}
.goal:hover{border-color:#cbd5e1;box-shadow:0 6px 18px rgba(15,23,42,.07)}
.g-head{display:flex;align-items:center;gap:9px}
.g-ico{font-size:18px;width:34px;height:34px;border-radius:10px;background:var(--bg3);display:grid;place-items:center}
.g-title{font-weight:800;font-size:14px;flex:1}
.g-go{color:var(--faint);font-weight:700}
.goal:hover .g-go{color:var(--blue)}
.g-why{font-size:11.5px;color:var(--faint);margin-top:6px;line-height:1.4}
.g-metric{font-size:20px;font-weight:800;margin-top:10px}
.g-metric span{font-size:12.5px;color:var(--muted);font-weight:600}
.g-sub{font-size:11.5px;color:var(--muted);line-height:1.4}
.g-stages{display:flex;gap:3px;margin-top:8px}
.g-stages i{flex:1;height:4px;border-radius:9px;background:var(--bg3)}
.g-stages i.ok{background:var(--green)}
.g-stages i.late{background:#fca5a5}
.g-next{margin-top:auto;padding-top:10px}
.g-next > .lbl{margin-bottom:3px}
.g-next{font-size:12px;line-height:1.4}
.goal .g-next{border-top:1px dashed var(--line);margin-top:12px}
/* внимание и неделя */
.home-cols{display:grid;grid-template-columns:1.2fr 1fr;gap:8px;align-items:start}
.sig-list,.wk-list{display:flex;flex-direction:column;gap:2px}
.sig{display:flex;align-items:baseline;gap:8px;padding:7px 8px;border-radius:7px;font-size:12.5px;line-height:1.4}
.sig.link{cursor:pointer}
.sig.link:hover{background:var(--bg2)}
.sig-dot{flex:0 0 8px;height:8px;border-radius:50%;background:var(--blue);transform:translateY(-1px)}
.sig.red .sig-dot{background:var(--red)}
.sig.amber .sig-dot{background:#f59e0b}
.sig-area{flex:0 0 64px;font-size:10.5px;color:var(--faint);text-transform:uppercase;font-weight:700;letter-spacing:.3px}
.sig-text{flex:1}
.wk{display:flex;align-items:baseline;gap:8px;padding:6px 4px;font-size:12.5px;border-bottom:1px solid var(--line2)}
.wk-box{flex:0 0 15px;height:15px;border-radius:4px;border:1.5px solid #cbd5e1;font-size:10px;display:grid;place-items:center;transform:translateY(2px)}
.wk.done .wk-box{background:var(--green);border-color:var(--green);color:#fff}
.wk.done .wk-text{color:var(--faint);text-decoration:line-through}
.wk-text{flex:1}
.wk-grp{font-size:11px;color:var(--faint);white-space:nowrap}
.home-view .week-more{margin-top:10px}
.home-stack{display:flex;flex-direction:column;gap:8px;min-width:0}
.focus-day{background:#fff7ed;border:1px solid #fed7aa;border-radius:10px;padding:9px 12px;font-size:13.5px;font-weight:700}
.focus-day .lbl{margin-right:10px;color:#c2410c}
.ib-list{display:flex;flex-direction:column}
.ib{display:flex;gap:10px;align-items:flex-start;padding:8px 2px;border-bottom:1px solid var(--line2)}
.ib-text{flex:1;min-width:0;font-size:12.5px;line-height:1.4;white-space:pre-wrap;word-break:break-word}
.ib-meta{display:block;color:var(--faint);font-size:11px;margin-top:2px}
.ib-ctl{display:flex;gap:4px;flex:0 0 auto;align-items:center}
.ib-ctl select{border:1px solid var(--line);border-radius:6px;background:var(--bg2);font-size:11.5px;padding:4px 5px;max-width:130px}
.ib-ctl .btn{padding:4px 8px;font-size:11.5px}
.ib-add{display:flex;gap:6px;margin-top:10px}
.ib-add input{flex:1;border:1px solid var(--line);border-radius:6px;background:var(--bg2);padding:6px 9px;font-size:12.5px}
.ib-add input:focus{outline:none;border-color:var(--blue);background:#fff}
@media(max-width:1100px){.goal-grid{grid-template-columns:1fr 1fr}.home-cols{grid-template-columns:1fr}}
@media(max-width:820px){
  body.mode-home .topbar{padding:0 10px;gap:10px}
  /* четыре режима не влезают рядом с логотипом — оставляем от него только ромб */
  .logo-name{display:none}
  .mode-switch button{padding-left:9px;padding-right:9px}
  .gh-cols,.goal-grid{grid-template-columns:1fr}
  .gh-cols{gap:14px}
  .home-title{display:none}
  .wk{flex-wrap:wrap}
  .wk-grp{width:100%;padding-left:23px}
  .sig-area{flex-basis:56px}
  .ib{flex-direction:column;gap:6px}
  .ib-ctl{flex-wrap:wrap}
}


/* ---------- раскладка хаба: обычная прокрутка страницы, без сетки терминала ---------- */
.page{max-width:1440px;margin:0 auto;padding:8px;display:flex;flex-direction:column;gap:8px;min-height:100vh}
.topbar{min-height:52px}
.home-view,.life-view{display:none;flex-direction:column;gap:8px}
body.mode-home .home-view,body.mode-life .life-view{display:flex}
.fin-body{overflow:visible;flex:none}
.logout{margin-left:auto}
/* вход */
.login{max-width:420px;margin:18vh auto 0;text-align:center;padding:28px 24px}
.login h1{font-size:20px;margin:6px 0 10px}
.login p{color:var(--muted);line-height:1.5;margin:6px 0}
.login .big{font-size:34px}
