/* CEOroom v3 — «Пункт управления», «Задачи», «Разработка», «Ещё» (app/home.js) и экран фокуса (#kfocus.v3f, app/kanban.js).
   Эталон вида — макет ~/pf-private/ceo-home/redesign-apple/v3/mockup.html (принципы HIG: Layout, Typography, Color, Dark Mode,
   Buttons, Widgets — не копия приложений Apple). Иконки линейные (Lucide), без эмодзи. Текст ≥ 13 px, иконка–текст ≥ 12 px.
   Роли — своя палитра (золото / фиолетовый / сине-серый / медь) и своя форма (полоса), без колец и цветов «Фитнеса».
   Все правила — внутри .v3 (у прежних экранов свои токены и классы в styles.css). Тема — <html data-theme="light|warm|dark">. */
:root,:root[data-theme="dark"]{
  --v-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",system-ui,sans-serif;
  --v-bg:#000; --v-card:#1c1c1e; --v-card2:#2c2c2e; --v-line:rgba(84,84,88,.45);
  --v-text:#fff; --v-text2:rgba(235,235,245,.66);
  --v-accent:#0a84ff; --v-orange:#ff9f0a; --v-green:#30d158; --v-red:#ff453a; --v-purple:#bf5af2;
  --v-indigo:#5e5ce6; --v-teal:#40c8e0; --v-pink:#ff375f; --v-brown:#ac8e68; --v-gray:#8e8e93;
  --v-shadow:none; --v-onaccent:#fff;
  --v-wall:radial-gradient(900px 640px at 12% 8%,#1d3a6b 0%,transparent 62%),radial-gradient(900px 700px at 90% 95%,#3b1f5f 0%,transparent 60%),#0a0c12;
  --v-mod:rgba(255,255,255,.11); --v-off:rgba(255,255,255,.16); --v-fillon:#fff; --v-onfill:#000;
  --r-own:#e3b341; --r-man:#a391f5; --r-spe:#8aa6d8; --r-fde:#e3825a; --v-onrole:#141414;
  --v-focusbg:#0b0b0d;
}
:root[data-theme="light"]{
  --v-bg:#f2f2f7; --v-card:#fff; --v-card2:#f2f2f7; --v-line:rgba(60,60,67,.18);
  --v-text:#000; --v-text2:rgba(60,60,67,.72);
  --v-accent:#007aff; --v-orange:#c75f00; --v-green:#248a3d; --v-red:#d70015; --v-purple:#8944ab;
  --v-indigo:#5856d6; --v-teal:#0e7c93; --v-pink:#d30f45; --v-brown:#7f6545; --v-gray:#6e6e73;
  --v-shadow:0 1px 2px rgba(0,0,0,.04),0 6px 20px rgba(0,0,0,.05); --v-onaccent:#fff;
  --v-wall:radial-gradient(900px 640px at 12% 8%,#cddcff 0%,transparent 62%),radial-gradient(900px 700px at 90% 95%,#f0d9ff 0%,transparent 60%),#eef0f6;
  --v-mod:rgba(255,255,255,.78); --v-off:rgba(0,0,0,.07); --v-fillon:#007aff; --v-onfill:#fff;
  --r-own:#a87a0e; --r-man:#6a55d6; --r-spe:#566c8c; --r-fde:#c0582c; --v-onrole:#fff;
  --v-focusbg:#f2f2f7;
}
:root[data-theme="warm"]{
  --v-bg:#d6cfc4; --v-card:#e8e2d8; --v-card2:#ddd6cb; --v-line:rgba(52,42,32,.16);
  --v-text:#25201b; --v-text2:rgba(37,32,27,.72);
  --v-accent:#1f5fbf; --v-orange:#a8550a; --v-green:#23773b; --v-red:#b3332a; --v-purple:#7d43a3;
  --v-indigo:#4c4bb8; --v-teal:#1f7484; --v-pink:#b0284c; --v-brown:#7a5f3f; --v-gray:#6d655c;
  --v-shadow:0 1px 2px rgba(60,40,20,.06),0 8px 24px rgba(60,40,20,.07); --v-onaccent:#fff;
  --v-wall:radial-gradient(900px 640px at 12% 8%,#e9d8bd 0%,transparent 62%),radial-gradient(900px 700px at 90% 95%,#cfb9a0 0%,transparent 60%),#d6cfc4;
  --v-mod:rgba(255,250,242,.58); --v-off:rgba(52,42,32,.09); --v-fillon:#1f5fbf; --v-onfill:#fff;
  --r-own:#8a6208; --r-man:#5e4bbf; --r-spe:#4e627e; --r-fde:#a84b22; --v-onrole:#fff;
  --v-focusbg:#d6cfc4;
}

/* ── оболочка: на экранах v3 нет прежних верха, панели, вкладок и плавающих кнопок ── */
.shell.v3s .topbar,.shell.v3s .side,.shell.v3s .tabbar,.shell.v3s .fab,.shell.v3s .devbar{display:none}
.shell.v3s .body{background:var(--v-wall)}
.shell.v3s .main{display:block;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
.v3{font-family:var(--v-font);color:var(--v-text);-webkit-font-smoothing:antialiased;font-size:17px;line-height:1.3;letter-spacing:-.01em}
.v3 *{box-sizing:border-box}
.v3 h1,.v3 h2,.v3 p,.v3 ol,.v3 ul{margin:0;padding:0}
.v3 svg.i{width:22px;height:22px;stroke-width:1.8}
/* все поля и кнопки v3 — шрифтом приложения, не шрифтом браузера по умолчанию (Times в select/option) */
.v3 select,.v3 option,.v3 input,.v3 textarea,#v3pick button,#kfocus select,#kfocus option,#kfocus input,#kfocus textarea,#kfocus button{font-family:var(--v-font)}
.v3 button,.v3 a{font:inherit;color:inherit;border:0;background:none;cursor:pointer;text-align:left;letter-spacing:inherit;text-decoration:none}
.v3 button:disabled{opacity:.55;cursor:default}
.v3 :focus-visible{outline:3px solid color-mix(in srgb,var(--v-accent) 70%,transparent);outline-offset:2px}
.v3 .c-acc{color:var(--v-accent)}.v3 .c-or,.v3 .c-orange{color:var(--v-orange)}.v3 .c-green{color:var(--v-green)}.v3 .c-ind{color:var(--v-indigo)}.v3 .c-t2,.v3 .t2{color:var(--v-text2)}
.v3 .b-orange{background:var(--v-orange)}.v3 .b-green{background:var(--v-green)}.v3 .b-accent{background:var(--v-accent)}.v3 .b-purple{background:var(--v-purple)}
.v3 .b-red{background:var(--v-red)}.v3 .b-teal{background:var(--v-teal)}.v3 .b-pink{background:var(--v-pink)}.v3 .b-brown{background:var(--v-brown)}.v3 .b-gray{background:var(--v-off);color:var(--v-text)!important}
.v3 .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.v3 .vsp{flex:1}
.v3 .vnote,.v3 .vp{font-size:15px;line-height:21px;color:var(--v-text2)}
.v3 .vp{font-size:17px;line-height:24px;color:inherit}
.v3 .vp.t2{color:var(--v-text2)}

/* кнопки (HIG Buttons): высота ≥ 44, иконка–текст 12 */
.v3 .btn3{height:50px;padding:0 22px;border-radius:25px;font-size:17px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:12px;white-space:nowrap;flex:none}
.v3 .btn3 svg.i{width:20px;height:20px}
.v3 .btn3.pri{background:var(--v-accent);color:var(--v-onaccent)}
.v3 .btn3.ok{background:var(--v-green);color:#fff}
.v3 .btn3.sec{background:var(--v-off);color:var(--v-accent)}
.v3 .btn3.ter{background:var(--v-off);color:var(--v-text)}
.v3 .btn3.wide{width:100%}
.v3 .count{font-size:17px;color:var(--v-text2);font-variant-numeric:tabular-nums;flex:none;font-weight:400}
.v3 .vpill{display:inline-flex;align-items:center;gap:12px;height:44px;padding:0 20px;border-radius:22px;background:var(--v-mod);font-size:17px;font-weight:600;white-space:nowrap;flex:none}
.v3 .vpill svg.i{width:20px;height:20px}
.v3 .tpill{display:inline-flex;align-items:center;gap:12px;height:44px;padding:0 18px;border-radius:22px;background:var(--v-off);font-size:17px;font-weight:600;white-space:nowrap;flex:none}
.v3 .tpill svg.i{width:20px;height:20px;color:var(--v-accent)}
.v3 .tpill .tt{font-family:ui-rounded,var(--v-font);font-size:20px;font-variant-numeric:tabular-nums}

/* роли: своя палитра, свой значок */
.v3 .ro-owner{--rc:var(--r-own)}.v3 .ro-manager{--rc:var(--r-man)}.v3 .ro-specialist{--rc:var(--r-spe)}.v3 .ro-fde{--rc:var(--r-fde)}
.v3 .rchip{display:inline-flex;align-items:center;gap:12px;min-height:36px;padding:6px 16px 6px 14px;border-radius:18px;background:var(--v-off);font-size:17px;font-weight:600;line-height:22px;flex:none;max-width:100%}
.v3 .rchip svg.i{width:20px;height:20px;color:var(--rc)}
.v3 .rdot{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex:none;background:color-mix(in srgb,var(--rc) 22%,transparent);color:var(--rc)}
.v3 .rdot svg.i{width:22px;height:22px;stroke-width:2}
.v3 .rcol{color:var(--rc)}
.v3 .dot.ro-fde{background:var(--r-fde)}

/* кольцо таймера — CSS, внутри только время */
.v3 .ring{position:relative;width:150px;height:150px;flex:none;border-radius:50%}
.v3 .ring::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--v-accent) 0 var(--p,100%),var(--v-off) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 10px),#000 calc(100% - 9px));mask:radial-gradient(farthest-side,transparent calc(100% - 10px),#000 calc(100% - 9px))}
.v3 .ring .in{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.v3 .ring .t{font-family:ui-rounded,var(--v-font);font-size:30px;line-height:34px;font-weight:600;font-variant-numeric:tabular-nums}
.v3 .ring .l{font-size:15px;line-height:18px;font-weight:600;color:var(--v-text2)}

/* ═════════ (А) Пункт управления ═════════ */
.vhome{min-height:100%}
.vhome .vwrap{width:min(1228px,calc(100% - 48px));margin:0 auto;padding:40px 0 48px}
.v3 .vbar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px;padding:0 4px}
.v3 .vbar h1{font-size:28px;line-height:34px;font-weight:700;letter-spacing:-.02em}
.v3 .vnav{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.vhome .vgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-auto-rows:160px;gap:18px;
  grid-template-areas:"f f f f w r t" "f f f f m r t" "o o o a a k k" "o o o a a k k"}
.v3 .vm{background:var(--v-mod);border-radius:30px;padding:20px;display:flex;flex-direction:column;position:relative;overflow:hidden;box-shadow:var(--v-shadow);min-width:0}
.vhome .g-f{grid-area:f;padding:26px}.vhome .g-w{grid-area:w}.vhome .g-mu{grid-area:m}.vhome .g-r{grid-area:r;padding:0}.vhome .g-t{grid-area:t}
.vhome .g-a{grid-area:a}.vhome .g-k{grid-area:k}.vhome .g-o{grid-area:o;padding:22px}
.v3 .dot{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;flex:none}
.v3 .dot svg.i{width:22px;height:22px;stroke-width:2}
.v3 .mh{display:flex;align-items:center;gap:12px;font-size:17px;line-height:22px;font-weight:600}
.v3 .mh .count{margin-left:auto}
.vhome .why{display:flex;align-items:center;gap:16px;margin-top:16px;flex-wrap:wrap;row-gap:10px}
.vhome .why .rs{font-size:15px;line-height:20px;font-weight:500;color:var(--v-text2);flex:1 1 280px;min-width:0}
.vhome .fb{display:grid;grid-template-columns:1fr auto;grid-template-rows:1fr auto;column-gap:28px;row-gap:18px;flex:1;padding-top:14px;min-height:0}
.vhome .fb h2{font-size:26px;line-height:32px;font-weight:700;letter-spacing:-.02em;grid-column:1;grid-row:1;align-self:end;overflow-wrap:anywhere}
.vhome .fb h2.long{font-size:21px;line-height:27px}
.vhome .acts{display:flex;gap:12px;grid-column:1;grid-row:2}
.vhome .row2{display:contents}
.vhome .row2 .ring{grid-column:2;grid-row:1/3;align-self:center}
.vhome .fb-empty{display:flex;flex-direction:column;justify-content:flex-end;gap:18px}
.vhome .g-w .dot{width:40px;height:40px}
.vhome .g-w .num{font-family:ui-rounded,var(--v-font);font-size:36px;line-height:40px;font-weight:700;margin-top:auto;font-variant-numeric:tabular-nums}
.vhome .cap{font-size:15px;line-height:19px;font-weight:600}
.vhome .g-w .cap{margin-top:6px}.vhome .g-mu .cap{margin-top:auto}
.vhome .g-r .fill{position:absolute;left:0;right:0;bottom:0;height:var(--h,0%);background:var(--v-green)}
.vhome .g-r .vrt{position:relative;padding:18px 14px 0;display:block}
.vhome .g-r .pct{font-family:ui-rounded,var(--v-font);font-size:30px;line-height:34px;font-weight:700;display:block}
.vhome .g-r .lb{display:block;font-size:14px;line-height:18px;font-weight:600;margin-top:4px;letter-spacing:-.02em}
.vhome .g-r .hi{position:absolute;left:0;right:0;bottom:22px;display:flex;justify-content:center;color:var(--v-text)}
.vhome .g-r .hi svg.i{width:30px;height:30px;stroke-width:2}
.vhome .vopts{display:flex;flex-direction:column;gap:14px;margin-top:auto;align-items:center}
.vhome .vopt{display:flex;flex-direction:column;align-items:center;gap:12px;font-size:15px;font-weight:600;line-height:18px}
.vhome .vopt .dot{width:42px;height:42px;background:var(--v-off);color:var(--v-text)}
.vhome .vopt .dot svg.i{width:21px;height:21px}
.vhome .vopt.on .dot{background:var(--v-fillon);color:var(--v-onfill)}
/* Роль дня + время по ролям: одна сегментная полоса (не кольца) */
.vhome .dbar{display:flex;gap:4px;height:22px;margin-top:20px}
.vhome .dbar span{border-radius:11px;background:var(--rc);min-width:8px}
.vhome .dbar span.rest{background:var(--v-off);flex:1}
.vhome .roles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto}
.vhome .role{display:flex;align-items:center;gap:14px;padding:14px 14px 14px 12px;border-radius:22px;min-height:96px;min-width:0}
.vhome .role .rdot{width:52px;height:52px}.vhome .role .rdot svg.i{width:25px;height:25px}
.vhome .role.on{background:var(--v-off)}
.vhome .role.on .rdot{background:var(--rc);color:var(--v-onrole)}
.v3 .vtx{display:flex;flex-direction:column;min-width:0}
.vhome .role .vnm{font-size:17px;line-height:22px;font-weight:600}
.vhome .role .vtm{font-size:17px;line-height:22px;font-variant-numeric:tabular-nums}
.vhome .ags{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));row-gap:16px;column-gap:8px;margin-top:auto}
.vhome .ag{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;min-width:0}
.vhome .ag .dot{width:48px;height:48px;position:relative}
.vhome .ag .badge{position:absolute;top:-4px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#ff453a;color:#fff;font-size:13px;font-weight:700;line-height:20px;text-align:center;box-shadow:0 0 0 2px var(--v-card, #1c1c1e)}
.vhome .ag .dot svg.i{width:24px;height:24px}
.vhome .ag .vnm{font-size:15px;line-height:19px;font-weight:600;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vhome .ag .vwt{color:var(--v-orange);display:block}
.vhome .tk{display:flex;flex-direction:column;gap:12px;margin-top:auto}
.vhome .tr{display:flex;align-items:center;gap:14px;height:72px;padding:0 18px 0 16px;border-radius:20px;background:var(--v-off)}
.vhome .tr .dot{width:40px;height:40px}
.vhome .tr .dot svg.i{width:20px;height:20px}
.vhome .tr .vnm{font-size:17px;font-weight:600}
.vhome .tr .n{margin-left:auto;font-family:ui-rounded,var(--v-font);font-size:28px;font-weight:700;font-variant-numeric:tabular-nums}

/* ═════════ (Б) Фокус — одна задача на весь экран ═════════ */
#kfocus.v3f{background:var(--v-focusbg);color:var(--v-text);font-family:var(--v-font)}
#kfocus.v3f .kf-b{flex:1;min-height:0;overflow-y:auto}
.v3f .fo{width:min(1120px,calc(100% - 48px));margin:0 auto;padding:44px 0 40px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start}
.v3f .ph{display:none}
.v3f .fo-t{font-size:34px;line-height:41px;font-weight:700;letter-spacing:-.02em;overflow-wrap:anywhere}
.v3f .frole{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:14px 0 22px}
.v3f .fo-sug{font-size:15px;color:var(--v-text2)}
.v3 .card{background:var(--v-card);border-radius:24px;padding:20px 24px;box-shadow:var(--v-shadow)}
.v3f .fo-main>.card+.card,.v3f .fo-main>.card+.ask,.v3f .fo-main>.ask+.kf-more,.v3f .fo-main>.kf-more+.kf-more{margin-top:14px}
.v3f .card.note{border:1px solid color-mix(in srgb,var(--v-indigo) 40%,transparent)}
.v3 .ch{display:flex;align-items:center;gap:12px;font-size:17px;line-height:22px;font-weight:600;margin-bottom:14px}
.v3 .ch svg.i{width:20px;height:20px;color:var(--v-text2)}
.v3f .fo-p{font-size:17px;line-height:24px}
.v3f .fo-calm{margin-top:14px;font-size:15px;line-height:20px;color:var(--v-text2)}
.v3f .reasons{display:flex;flex-wrap:wrap;gap:12px 32px}
.v3f .reasons>span{display:flex;align-items:center;gap:12px;font-size:17px;line-height:22px;font-weight:500}
.v3f .reasons svg.i{width:20px;height:20px;color:var(--v-text2)}
.v3f .reasons svg.i.rcol{color:var(--rc)}
.v3f .steps{list-style:none;display:flex;flex-direction:column;gap:12px}
.v3f .steps li{display:flex;gap:14px;font-size:17px;line-height:24px;overflow-wrap:anywhere}
.v3f .steps b{color:var(--v-accent);font-variant-numeric:tabular-nums;min-width:14px;flex:none}
.v3f .links .lk{display:flex;align-items:center;gap:14px;min-height:52px;padding:8px 0;border-top:1px solid var(--v-line);font-size:17px;color:var(--v-text)}
.v3f .links .ch{margin-bottom:6px}
.v3f .lk svg.i{width:20px;height:20px;color:var(--v-accent)}
.v3f .lk .lt{flex:1;min-width:0;overflow-wrap:anywhere}
.v3 .ask{display:flex;align-items:center;gap:14px;min-height:60px;padding:6px 8px 6px 22px;border-radius:30px;background:var(--v-card);box-shadow:var(--v-shadow);border:1px solid var(--v-line)}
.v3 .ask>svg.i{color:var(--v-text2)}
.v3 .ask textarea,.v3 .ask input{flex:1;min-width:0;border:0;background:transparent;outline:none;font:inherit;font-size:17px;line-height:24px;color:var(--v-text);resize:none;padding:12px 0}
.v3 .ask textarea::placeholder,.v3 .ask input::placeholder,.v3 .qadd input::placeholder{color:var(--v-text2);opacity:1}
.v3 .send{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--v-accent);color:#fff;flex:none}
.v3 .send svg.i{width:20px;height:20px}
.v3 .ib3{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:var(--v-text2);flex:none;margin-left:auto}
.v3 .ib3 svg.i{width:20px;height:20px}
.v3f .fo-side{background:var(--v-card);border-radius:28px;padding:24px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--v-shadow);position:sticky;top:24px}
.v3f .fo-side .ch{margin-bottom:6px}
.v3f .fo-side .ring{width:220px;height:220px;margin:6px auto 18px}
.v3f .fo-side .ring::before{-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 12px),#000 calc(100% - 11px));mask:radial-gradient(farthest-side,transparent calc(100% - 12px),#000 calc(100% - 11px))}
.v3f .fo-side .ring .t{font-size:48px;line-height:54px}
.v3f .kf-set{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0;padding:12px 14px;border-radius:18px;background:var(--v-card2);font-size:15px}
.v3f .kf-set label{display:flex;align-items:center;gap:12px}
.v3f .kf-set input{width:64px;height:40px;padding:0 10px;border:0;border-radius:12px;background:var(--v-card);color:var(--v-text);font:inherit;font-size:17px}
.v3f .kf-set .btn3{height:44px}
.v3f .kf-more{border-radius:24px;background:var(--v-card)}
.v3f .kf-more summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:0 24px;cursor:pointer;font-size:17px;font-weight:600;color:var(--v-text)}
.v3f .kf-more summary::-webkit-details-marker{display:none}
.v3f .kf-more summary svg.i{width:20px;height:20px;color:var(--v-text2)}
.v3f .kf-more-b{padding:0 24px 18px}
.v3f .kf-x{font-size:16px;line-height:1.5;color:var(--v-text2);white-space:pre-wrap;overflow-wrap:anywhere}
.v3f .kf-hist{border-left-color:var(--v-line)}
.v3f .kf-hist .w{font:500 13px ui-monospace,Menlo,monospace;color:var(--v-text2)}
.v3f .kf-hist .who{font-size:13px;color:var(--v-text2)}
.v3f .kf-hist .tx{font-size:15px;color:var(--v-text)}
.v3f .fo-acts{gap:10px;margin-bottom:16px}
.v3f .fo-acts:empty{display:none!important}
/* Фокусник: следующая задача */
.v3f .fo-next{width:min(640px,calc(100% - 32px));margin:0 auto;padding:12vh 0 48px;display:flex;flex-direction:column;gap:18px}
.v3f .fo-nx-k{display:flex;align-items:center;gap:12px;font-size:17px;font-weight:600;color:var(--v-accent)}
.v3f .fo-nx-k svg.i{width:20px;height:20px}
.v3f .fo-nx-h{font-size:22px;line-height:28px;font-weight:600;color:var(--v-text2)}
.v3f .fo-nx-c{padding:24px 26px}
.v3f .fo-nx-c .frole{margin:0 0 14px}
.v3f .fo-nx-c .fo-t{font-size:28px;line-height:34px}
.v3f .fo-row{display:flex;flex-wrap:wrap;gap:12px}
/* пауза поверх задачи */
.v3f .kf-rest{background:rgb(4 5 6 / .95);color:#f2f2f7;font-family:var(--v-font)}
.v3f .kf-rest h2{font-size:44px;font-weight:700}
.v3f .kf-rest p{font-size:22px;color:rgba(235,235,245,.75)}
.v3f .kf-rest-t{font:600 20px ui-rounded,var(--v-font);color:rgba(235,235,245,.66)}
.v3f .kf-rest .btn3.sec{background:rgba(255,255,255,.14);color:#f2f2f7}

/* ═════════ (В) Режим разработки ═════════ */
.vdev{min-height:100%;background:var(--v-focusbg)}
.vdev .dv{width:min(1280px,calc(100% - 48px));margin:0 auto;padding:30px 0 36px}
.vdev .dv-top{display:flex;align-items:center;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.vdev .dv-top h1{font-size:28px;line-height:34px;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
.vdev .strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:20px}
.vdev .sc{background:var(--v-card);border-radius:22px;padding:16px 18px 18px;display:flex;flex-direction:column;gap:10px;position:relative;box-shadow:var(--v-shadow);border:2px solid transparent;overflow:hidden;min-width:0}
.vdev .sc.act{border-color:var(--v-accent)}
.vdev .sc .st{display:flex;align-items:center;gap:12px;font-size:15px;line-height:20px;font-weight:600}
.vdev .sc .st svg.i{width:18px;height:18px}
.vdev .sc .st .k{margin-left:auto;font-size:15px;font-weight:600;color:var(--v-text2);border:1px solid var(--v-line);border-radius:7px;padding:1px 7px;font-variant-numeric:tabular-nums}
.vdev .sc .tl{font-size:17px;line-height:22px;font-weight:600;overflow-wrap:anywhere}
.vdev .sc .pg{position:absolute;left:0;bottom:0;height:4px;background:var(--v-accent);border-radius:0 2px 2px 0}
.vdev .sc.done .tl{color:var(--v-text2)}
.vdev .sc.add{gap:16px;background:none;border:2px dashed var(--v-line);box-shadow:none;justify-content:center;align-items:flex-start;color:var(--v-accent)}
.vdev .sc.add .st{font-size:17px}
.vdev .sc.add .st svg.i{width:20px;height:20px}
.vdev .sc.add .nn{font-size:15px;line-height:20px;color:var(--v-text2)}
.vdev .dv-main{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:20px;align-items:start}
.vdev .big{background:var(--v-card);border-radius:28px;padding:26px 28px;box-shadow:var(--v-shadow)}
.vdev .stp{display:inline-flex;align-items:center;gap:12px;height:36px;padding:0 16px 0 14px;border-radius:18px;font-size:17px;font-weight:600;background:color-mix(in srgb,currentColor 16%,transparent);white-space:nowrap}
.vdev .stp svg.i{width:20px;height:20px}
.vdev .hd{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.vdev .hd .ago{margin-left:auto;font-size:17px;color:var(--v-text2)}
.vdev .big h2{font-size:30px;line-height:36px;font-weight:700;letter-spacing:-.02em;margin:14px 0 6px;overflow-wrap:anywhere}
.vdev .big>.vp{margin-top:12px}
.vdev .sec2{margin-top:22px}
.vdev .sec2 .ch{margin-bottom:12px}
.vdev .did{list-style:none;display:flex;flex-direction:column;gap:10px}
.vdev .did li{display:flex;align-items:flex-start;gap:12px;font-size:17px;line-height:24px;overflow-wrap:anywhere;white-space:pre-wrap}
.vdev .did svg.i{width:20px;height:20px;color:var(--v-green);margin-top:2px}
.vdev .tests{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.vdev .sec2 .tests{margin-top:0}
.vdev .tests .btn3{height:44px;padding:0 18px;white-space:normal;text-align:left}
.vdev .foot{display:flex;align-items:center;gap:12px;margin-top:24px;flex-wrap:wrap}
.vdev .foot .ask{flex:1 1 320px;min-height:52px;box-shadow:none;background:var(--v-card2);border:0;padding-left:20px}
.vdev .side2{display:flex;flex-direction:column;gap:14px}
.vdev .ctx .blk+.blk{margin-top:14px}
.vdev .ctx .lb{font-size:15px;line-height:20px;font-weight:600;color:var(--v-accent)}
.vdev .ctx .vtx{font-size:17px;line-height:23px;margin-top:4px;overflow-wrap:anywhere;white-space:pre-wrap}
.vdev .algo{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.vdev .algo li{display:flex;gap:14px;font-size:17px;line-height:23px}
.vdev .algo b{color:var(--v-accent);min-width:14px;flex:none}

/* ═════════ (Г) Задачи — канбан ═════════ */
.vtasks{min-height:100%}
.vtasks .vco{width:min(1312px,calc(100% - 48px));margin:0 auto;padding:34px 0 40px}
.vtasks .vco-top{display:flex;align-items:center;gap:18px;margin-bottom:18px;flex-wrap:wrap}
.vtasks .vseg,.vtasks .rseg{display:flex;background:var(--v-mod);border-radius:12px;padding:3px;gap:2px;box-shadow:var(--v-shadow);flex-wrap:wrap}
.vtasks .vseg button,.vtasks .rseg button{min-height:38px;border-radius:9px;padding:0 14px;display:flex;align-items:center;gap:12px;font-size:15px;font-weight:600;white-space:nowrap}
.vtasks .vseg button{font-size:17px;min-height:40px}
.vtasks .vseg em,.vtasks .rseg em{font-style:normal;font-weight:400;color:inherit;opacity:.7;font-variant-numeric:tabular-nums}
.vtasks .rseg button svg.i{width:18px;height:18px;color:var(--rc)}
.vtasks .vseg button.on,.vtasks .rseg button.on{background:var(--v-fillon);color:var(--v-onfill)}
.vtasks .qadd{display:flex;align-items:center;gap:14px;min-height:56px;padding:6px 10px 6px 16px;border-radius:18px;background:var(--v-mod);box-shadow:var(--v-shadow);margin-bottom:22px;flex-wrap:wrap}
.vtasks .plus{width:30px;height:30px;border-radius:50%;background:var(--v-accent);color:#fff;display:grid;place-items:center;flex:none}
.vtasks .plus svg.i{width:18px;height:18px;stroke-width:2.2}
.vtasks .qadd input{flex:1 1 200px;min-width:0;height:44px;border:0;background:transparent;outline:none;font:inherit;font-size:17px;color:var(--v-text)}
.vtasks .opt2{position:relative;display:flex;align-items:center;height:40px;border-radius:12px;background:var(--v-off);font-size:15px;font-weight:600;white-space:nowrap}
.vtasks .opt2 .qsel{display:flex;align-items:center;gap:10px;height:40px;padding:0 10px 0 14px;border-radius:12px;font-size:15px;font-weight:600;color:var(--v-text)}
.vtasks .opt2 .qsel:focus-visible{outline:2px solid var(--v-accent);outline-offset:2px}
.vtasks .opt2 svg.i{width:18px;height:18px;color:var(--v-text2)}
.vtasks .opt2.set .qsel>svg.i:first-child{color:var(--v-accent)}
.vtasks .opt2 svg.qch{width:14px;height:14px;margin-left:-2px}
/* свой выпадающий список (вместо нативного select — тот на Mac рисовал пункты шрифтом Times) */
.vtasks .qmenu{position:absolute;z-index:30;top:calc(100% + 6px);left:0;min-width:100%;max-height:320px;overflow:auto;padding:6px;border-radius:14px;
  background:var(--v-card);box-shadow:0 10px 30px rgba(0,0,0,.18),0 0 0 1px var(--v-line);display:flex;flex-direction:column;gap:2px}
.vtasks .qmenu[hidden]{display:none}
.vtasks .qmenu button{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:38px;padding:0 12px;border-radius:9px;font-size:15px;font-weight:500;color:var(--v-text);white-space:nowrap}
.vtasks .qmenu button:hover,.vtasks .qmenu button:focus-visible{background:var(--v-off);outline:none}
.vtasks .qmenu button[aria-selected="true"]{font-weight:700}
.vtasks .qmenu svg.i{width:16px;height:16px;color:var(--v-accent)}
.vtasks .kbd{font-size:15px;font-weight:600;color:var(--v-text2);border:1px solid var(--v-line);border-radius:8px;padding:5px 10px}
.vtasks .add-go{height:44px;padding:0 18px}
.vtasks .vnote{margin:0 4px 16px}
.vtasks .vkb{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:start}
.vtasks .chd{display:flex;align-items:center;gap:12px;padding:0 6px 0 8px;min-height:40px;margin-bottom:8px}
.vtasks .chd .vnm{font-size:17px;font-weight:700}
.vtasks .cards{display:flex;flex-direction:column;gap:10px}
.vtasks .cards .vnote{margin:4px 8px}
.vtasks .kc{background:var(--v-mod);border-radius:20px;padding:14px 14px 14px 16px;box-shadow:var(--v-shadow)}
.vtasks .kc .r1{display:flex;align-items:flex-start;gap:12px}
.vtasks .kc .ck{width:24px;height:24px;border-radius:50%;border:2px solid var(--pc,var(--v-gray));flex:none;background:color-mix(in srgb,var(--pc,transparent) 10%,transparent);display:grid;place-items:center;margin-top:-1px}
.vtasks .kc .kt{flex:1;min-width:0;font-size:17px;line-height:22px;font-weight:500;overflow-wrap:anywhere}
.vtasks .kc .rdot{width:32px;height:32px;margin-top:-5px}
.vtasks .kc .rdot svg.i{width:17px;height:17px}
.vtasks .kc .rdot.sug{background:transparent;border:1.5px dashed color-mix(in srgb,var(--rc) 70%,transparent)}
.vtasks .kc .r2{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;margin:10px 0 0 36px;font-size:15px;line-height:20px}
.vtasks .kc .m2{display:flex;align-items:center;gap:12px;white-space:nowrap}
.vtasks .kc .r2 svg.i{width:17px;height:17px;color:var(--v-text2)}
.vtasks .kc .m2.c-acc svg.i,.vtasks .kc .m2.c-or svg.i{color:inherit}
.vtasks .kc .pj{display:flex;align-items:center;gap:12px;color:var(--v-text2);min-width:0;overflow-wrap:anywhere}
.vtasks .kc .pj i{width:8px;height:8px;border-radius:50%;background:var(--v-gray);flex:none}
.vtasks .kc .fl{margin-left:auto;display:flex}
.vtasks .kc .fl svg.i{color:var(--pc)}
.vtasks .kc .late{color:var(--v-orange)}
.vtasks .kc .late svg.i{color:var(--v-orange)}
.v3 .kc.p1{--pc:var(--v-red)}.v3 .kc.p2{--pc:var(--v-orange)}.v3 .kc.p3{--pc:var(--v-accent)}.v3 .kc.p4{--pc:var(--v-gray)}
.vtasks .kc.done{opacity:.72}
.vtasks .kc.done .ck{background:var(--v-green);border-color:var(--v-green);color:#fff}
.vtasks .kc.done .ck svg.i{width:14px;height:14px;stroke-width:3}
.vtasks .kc.done .kt{text-decoration:line-through;color:var(--v-text2)}

/* ═════════ Ещё ═════════ */
.vmore{min-height:100%}
.vmore .vwrap2{width:min(720px,calc(100% - 32px));margin:0 auto;padding:34px 0 48px}
.vmore .vh1{font-size:34px;line-height:41px;font-weight:700;letter-spacing:-.02em;margin:6px 4px 18px}
.vmore .vlist{display:flex;flex-direction:column;gap:10px}
.vmore .vrow{display:flex;align-items:center;gap:16px;min-height:72px;padding:12px 18px;border-radius:20px;background:var(--v-mod);box-shadow:var(--v-shadow)}
.vmore .vrow .vtx{flex:1}
.vmore .vrow .vnm{font-size:17px;line-height:22px;font-weight:600}
.vmore .vrow .vsub{font-size:15px;line-height:20px;color:var(--v-text2)}
.vmore .vrow .chev{width:20px;height:20px;color:var(--v-text2)}

/* ═════════ выбор роли ═════════ */
#v3pick{position:fixed;inset:0;z-index:60;background:rgb(0 0 0 / .5);display:grid;place-items:center;padding:16px}
#v3pick .vpick-in{width:min(520px,100%);max-height:calc(100% - 32px);overflow-y:auto;background:var(--v-card);border-radius:28px;padding:24px;box-shadow:0 24px 60px rgb(0 0 0 / .35);display:flex;flex-direction:column;gap:12px}
#v3pick h2{font-size:22px;line-height:28px;font-weight:700}
#v3pick .vpr-l{display:flex;flex-direction:column;gap:8px;margin-top:4px}
#v3pick .vpr{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:20px;background:var(--v-off);min-height:68px}
#v3pick .vpr.on{outline:2px solid var(--rc)}
#v3pick .vpr .vnm{font-size:17px;line-height:22px;font-weight:600}
#v3pick .vpr .vsub{font-size:15px;line-height:20px;color:var(--v-text2)}
#v3pick .vpick-a{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}

/* ═════════ планшет: «Пункт управления» в две колонки ═════════ */
@media (max-width:1100px){
  .vhome .vgrid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:auto;gap:14px;grid-template-areas:"f f" "w m" "o o" "k a" "r t"}
  .vhome .g-r{min-height:96px}
  .vhome .g-t{min-height:240px}
  .vhome .g-w,.vhome .g-mu{min-height:150px}
  .vhome .g-o,.vhome .g-a,.vhome .g-k{min-height:330px}
  .vhome .g-f{min-height:338px}
  .vdev .strip{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vdev .dv-main{grid-template-columns:minmax(0,1fr)}
  .vtasks .vkb{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v3f .fo{grid-template-columns:minmax(0,1fr) 300px}
}

/* ═════════ телефон ═════════ */
@media (max-width:760px){
  .v3 .ph{display:flex}.v3 .dt{display:none!important}
  .v3 .vpill .pt{display:none}.v3 .vpill{width:44px;padding:0;justify-content:center}
  /* А */
  .vhome .vwrap{width:auto;padding:16px 16px 40px}
  .v3 .vbar{margin-bottom:14px;gap:12px}
  .v3 .vbar h1{font-size:24px;line-height:30px}
  .vhome .vgrid{grid-template-columns:1fr 1fr;gap:12px;grid-template-areas:"f f" "w m" "o o" "k k" "a a" "r r" "t t"}
  .v3 .vm{border-radius:24px;padding:16px 18px}
  .vhome .g-f{padding:20px;min-height:0}.vhome .g-o{padding:18px;min-height:0}.vhome .g-a,.vhome .g-k{min-height:0}
  .vhome .why{margin-top:14px}
  .vhome .fb{display:flex;flex-direction:column;gap:16px;padding-top:14px}
  .vhome .fb h2{font-size:22px;line-height:28px}
  .vhome .fb h2.long{font-size:19px;line-height:25px}
  .vhome .row2{display:flex;align-items:center;gap:18px}
  .vhome .acts{flex-direction:column;flex:1;gap:10px}
  .vhome .acts .btn3{height:44px}
  .vhome .row2 .ring{width:120px;height:120px}
  .vhome .row2 .ring .t{font-size:24px;line-height:28px}
  .vhome .g-w,.vhome .g-mu{flex-direction:row;align-items:center;gap:12px;min-height:76px}
  .vhome .g-w .num{margin-top:0;font-size:28px;line-height:32px}
  .vhome .g-w .cap{margin-top:0;max-width:64px}.vhome .g-mu .cap{margin-top:0}
  .vhome .g-r{height:64px;min-height:64px;flex-direction:row;align-items:center}
  .vhome .g-r .fill{top:0;bottom:0;left:0;right:auto;width:var(--h,0%);height:auto}
  .vhome .g-r .hi{position:relative;bottom:auto;left:auto;right:auto;padding-left:18px}
  .vhome .g-r .hi svg.i{width:26px;height:26px}
  .vhome .g-r .vrt{padding:0 0 0 12px;display:flex;align-items:baseline;gap:10px}
  .vhome .g-r .pct{font-size:24px;line-height:28px}.vhome .g-r .lb{margin:0}
  .vhome .g-t{min-height:0}
  .vhome .vopts{flex-direction:row;justify-content:space-around;align-items:flex-start;margin-top:14px}
  .vhome .dbar{margin:14px 0 14px}
  .vhome .roles{gap:8px}
  .vhome .roles{gap:6px}
  .vhome .role{padding:10px 6px 10px 6px;gap:12px;min-height:64px}
  .vhome .role .rdot{width:32px;height:32px}.vhome .role .rdot svg.i{width:18px;height:18px}
  .vhome .role .vnm,.vhome .role .vtm{font-size:15px;line-height:20px}
  .vhome .ags{margin-top:14px}
  .vhome .tk{margin-top:14px}.vhome .tr{height:56px}
  /* Б */
  .v3f .fo{width:auto;display:block;padding:14px 16px 32px}
  .v3f .fo-ph-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
  .v3f .fo-ph-top .btn3{height:44px;padding:0 18px}
  .v3f .fo-t{font-size:26px;line-height:32px}
  .v3f .frole{margin:12px 0 16px}
  .v3f .fo-acts .btn3{flex:1;height:48px}
  .v3 .card{padding:16px 18px;border-radius:20px}
  .v3f .reasons{flex-direction:column;gap:10px}
  .v3f .steps li,.v3f .links .lk{font-size:16px}
  .v3 .ask{min-height:56px;padding-left:18px;gap:12px}
  .v3f .fo-acts2{margin-top:16px}
  .v3f .fo-next{padding-top:32px}
  .v3f .fo-row .btn3{flex:1 1 auto}
  /* В */
  .vdev .dv{width:auto;padding:14px 16px 32px}
  .vdev .dv-top{gap:12px}
  .vdev .dv-top h1{font-size:24px;line-height:30px;flex-basis:100%}
  .vdev .dv-top .vsp{display:none}
  .vdev .strip{grid-template-columns:1fr;gap:10px}
  .vdev .big{padding:18px}
  .vdev .big h2{font-size:22px;line-height:28px}
  .vdev .hd .ago{margin-left:0}
  .vdev .tests{flex-direction:column}
  .vdev .foot{flex-direction:column;align-items:stretch}
  .vdev .foot .ask{flex:none}
  .vdev .foot .btn3{width:100%}
  /* Г */
  .vtasks .vco{width:auto;padding:14px 16px 32px}
  .vtasks .vco-top{gap:12px}
  .vtasks .vco-top .vsp{display:none}
  .vtasks .vseg{flex:1}
  .vtasks .vseg button{padding:0 10px;gap:8px;font-size:15px}
  .vtasks .rseg{width:100%;justify-content:space-between}
  .vtasks .rseg button .rl{display:none}
  .vtasks .rseg button{padding:0 12px}
  .vtasks .rseg button:first-child .rl,.vtasks .rseg button:first-child span{display:inline}
  .vtasks .qadd .kbd{display:none}
  .vtasks .opt2{flex:1 1 40%}
  .vtasks .add-go{flex:1 1 100%}
  .vtasks .vkb{grid-template-columns:1fr}
  /* Ещё */
  .vmore .vh1{font-size:28px;line-height:34px}
}