/* Плитки из FeatureMocks (content_zavod), скоуп .fmini */
.fmini{--violet:#7d4ccf; --violet-12:#efe9f9; --violet-7:#f5f1fb;
    --orange:#ffa100; --orange-12:#fff3e0;
    --red:#f44336;    --red-12:#fde8e6;
    --green:#4caf51;  --green-12:#e9f5ea;
    --blue:#2f80ed;   --blue-12:#e6f1fb;
    --t1:#2d2d2d; --t2:#757575; --t3:#9e9e9e;
    --bd:#ececec; --surf:#f6f6f7; --page:#c9c9cf;}
.fmini *{box-sizing:border-box; margin:0; padding:0;}
.fmini{font-family:"Inter",system-ui,sans-serif; background:var(--page); color:var(--t1);
    -webkit-font-smoothing:antialiased; padding:36px;}
.fmini .card{position:relative; width:240px; background:#fff; border-radius:16px; box-shadow:0 0 40px -20px rgba(40,40,60,.45);
    padding:12px; overflow:hidden;}
.fmini .h180{height:176px;}
.fmini .h210{height:212px;}
.fmini /* atoms */
  .ttl{font-size:11px; font-weight:600; margin-bottom:9px;}
.fmini .lab{font-size:8.5px; color:var(--t2);}
.fmini .val{font-size:8.5px; color:var(--t1); font-weight:500;}
.fmini .row{display:flex; align-items:center; gap:6px;}
.fmini .sp{flex:1;}
.fmini .line{height:6px; border-radius:3px; background:#eef0f2;}
.fmini /* app shell: sidebar + board */
  .shell{display:flex; gap:8px; height:100%;}
.fmini .side{width:30px; flex:none; display:flex; flex-direction:column; gap:7px; padding-top:2px;}
.fmini .side .sr{height:5px; border-radius:3px; background:#edeef0;}
.fmini .side .pr{display:flex; align-items:center; gap:4px; margin-top:2px;}
.fmini .side .pr i{width:6px; height:6px; border-radius:50%; background:var(--violet); flex:none;}
.fmini .side .pr b{height:5px; width:20px; border-radius:3px; background:#d9d2ee;}
.fmini .side::after{content:""; flex:1; min-height:6px; background:repeating-linear-gradient(to bottom,#edeef0 0 5px,transparent 5px 12px);}
.fmini .main{flex:1; min-width:0;}
.fmini .tb{display:flex; align-items:center; gap:4px; margin-bottom:8px;}
.fmini .tb i{width:14px; height:12px; border-radius:3px; background:var(--surf); border:1px solid var(--bd); flex:none;}
.fmini .tb i.a{background:var(--violet-12); border-color:#d9c9f3;}
.fmini .cols{display:grid; grid-template-columns:repeat(4,1fr); gap:5px;}
.fmini .ch{font-size:7px; color:var(--t3); font-weight:600; margin-bottom:4px; white-space:nowrap;}
.fmini .cc{height:13px; border-radius:4px; margin-bottom:4px;}
.fmini .cc.v{background:var(--violet-12)}
.fmini .cc.o{background:var(--orange-12)}
.fmini .cc.r{background:var(--red-12)}
.fmini .cc.g{background:var(--green-12)}
.fmini .cc.b{background:var(--blue-12)}
.fmini .cc.n{background:#f0f0f2}
.fmini .chip{display:inline-block; font-size:8px; font-weight:600; padding:2px 7px; border-radius:9px; white-space:nowrap;}
.fmini .chip.v{background:var(--violet-12);color:var(--violet)}
.fmini .chip.o{background:var(--orange-12);color:#b87400}
.fmini .chip.r{background:var(--red-12);color:var(--red)}
.fmini .chip.g{background:var(--green-12);color:#2f7d33}
.fmini .chip.solid-o{background:var(--orange);color:#fff}
.fmini .chip.solid-g{background:var(--green);color:#fff}
.fmini .chip.solid-r{background:var(--red);color:#fff}
.fmini .av{border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:8px; font-weight:600; color:#fff; flex:none;}
.fmini .field{border:1px solid var(--bd); border-radius:6px; padding:4px 7px; font-size:8.5px;}
.fmini .cb{width:11px;height:11px;border-radius:3px;border:1.5px solid #ccc;flex:none;}
.fmini .cb.on{background:var(--violet);border-color:var(--violet);position:relative}
.fmini .cb.on::after{content:"";position:absolute;left:50%;top:50%;width:3px;height:6px;border:1.5px solid #fff;border-top:0;border-left:0;transform:translate(-50%,-58%) rotate(45deg)}
.fmini .rb{width:12px;height:12px;border-radius:50%;border:1.5px solid #7d4ccf;background:#fff;flex:none}
.fmini .rb.on{background:#7d4ccf;position:relative}
.fmini .rb.on::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:4px;height:4px;border-radius:50%;background:#fff}
.fmini .tg{width:22px;height:13px;border-radius:8px;background:#d6d6d6;position:relative;flex:none}
.fmini .tg.on{background:var(--violet)}
.fmini .tg::after{content:"";position:absolute;top:1.5px;left:1.5px;width:10px;height:10px;border-radius:50%;background:#fff}
.fmini .tg.on::after{left:auto;right:1.5px}
.fmini .stc{width:11px;height:11px;border-radius:50%;border:1.5px solid #d4d4d4;flex:none}
.fmini .tabs{display:flex;gap:10px;border-bottom:1px solid var(--bd);margin-bottom:8px}
.fmini .tabs span{font-size:8px;font-weight:600;color:var(--t3);padding-bottom:5px;letter-spacing:.03em}
.fmini .tabs span.a{color:var(--violet);border-bottom:2px solid var(--violet)}
.fmini .cal{display:grid;grid-template-columns:repeat(7,1fr);border:1px solid #eee;border-radius:5px;overflow:hidden}
.fmini .cd{font-size:6px;color:var(--t3);text-align:center;padding:2px 0;line-height:1.4;border-right:1px solid #f2f2f2;border-bottom:1px solid #f2f2f2}
.fmini .cal .cd:nth-child(7n){border-right:0}
.fmini .cd.h{background:#fafafb;color:var(--t2);font-weight:600}
.fmini .cd.d1{background:var(--orange-12);color:#b87400;font-weight:700}
.fmini .pr.act{background:var(--violet-12);border-radius:4px;padding:1px 3px;margin:0 -3px}
.fmini .pop{position:absolute;right:0;bottom:0;width:150px;background:#fff;border:1.4px solid var(--orange);border-radius:9px;box-shadow:0 8px 18px -8px rgba(0,0,0,.28);padding:6px}
.fmini .vc{display:flex;flex-direction:column;height:100%}
.fmini .vcg{flex:1;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:4px}
.fmini .vct{background:#f5f5f5;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;overflow:hidden}
.fmini .vct .circ{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;line-height:1}
.fmini .vct .nm{font-size:8px;color:#1a1a1e}
.fmini .vcbar{display:flex;gap:4px;align-items:flex-end;justify-content:center;flex:0 0 36px;padding-bottom:2px}
.fmini .vcbtn{width:22px;height:15px;border-radius:4px;display:flex;align-items:center;justify-content:center}
.fmini .vcbtn svg{width:10px;height:10px}
.fmini .vcbtn.v{background:#7d4ccf}
.fmini .vcbtn.g{background:rgba(217,217,217,.55)}
.fmini .vcbtn.ai{width:15px;font-size:6px;font-weight:600;color:#818286}
.fmini .kbsh{display:flex;height:100%}
.fmini .kbside{width:50px;flex:none;display:flex;flex-direction:column;gap:6px;padding:2px 9px 0 0;border-right:1px solid #eee}
.fmini .kbside .hd{height:6px;width:95%;border-radius:3px;background:#e0e0e0;margin-bottom:2px}
.fmini .kbrow{display:flex;align-items:center;gap:4px}
.fmini .kbrow .dot{width:5px;height:5px;border-radius:50%;background:#e0e0e0;flex:none}
.fmini .kbrow .ln{flex:1;height:5px;border-radius:3px;background:#eee}
.fmini .kbside .pj{display:flex;align-items:center;gap:4px;background:#efe9f9;border-radius:5px;padding:3px 5px;margin:0 -2px 0 -5px}
.fmini .kbside .pj i{width:5px;height:5px;border-radius:50%;background:#7d4ccf;flex:none}
.fmini .kbside .pj b{font-size:8px;font-weight:600;color:#424242}
.fmini .kbmain{flex:1;min-width:0;padding-left:9px}
.fmini .vtb{display:flex;align-items:center;background:#efefef;border-radius:6px;padding:1.5px;width:100%;margin-bottom:7px}
.fmini .vtb .vi{flex:1;height:18px;display:flex;align-items:center;justify-content:center;color:#6e6e72;position:relative}
.fmini .vtb .vi svg{width:12px;height:12px}
.fmini .vtb .vi:not(:last-child)::after{content:"";position:absolute;right:0;top:3px;bottom:3px;width:1px;background:#dbdbdb}
.fmini .vtb .vi.act{background:#fff;border-radius:5px;color:#2d2d2d}
.fmini .vtb .vi.act::after{display:none}
.fmini .bttl{font-size:9.5px;font-weight:600;color:#424242;margin-bottom:8px}
.fmini .kboard{display:grid;grid-template-columns:repeat(4,1fr)}
.fmini .kcol{padding:0 5px;border-right:1px solid #eee;display:flex;flex-direction:column;gap:5px;min-width:0}
.fmini .kcol:last-child{border-right:0}
.fmini .kcol .kh{font-size:7px;color:#898989;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fmini .kk{border-radius:4px}
.fmini .kk.r{background:#fde8e6}
.fmini .kk.o{background:#fff0d9}
.fmini .kk.g{background:#e9f5ea}
.fmini .kk.n{background:#f5f5f5}
.fmini .kk.fo{background:#fff0d9}
.fmini .kk.fg{background:#e9f5ea}
.fmini .swhdr{font-size:10px;font-weight:600;color:#424242;margin-bottom:6px}
.fmini .swlane{border-top:1px solid #eee;padding:4px 0 3px;font-size:8.5px;font-weight:600;color:#3a3a3a}
.fmini .swlane.dim{color:#3a3a3a;border-top-color:#f2f2f2}
.fmini .mobstage{display:flex;align-items:center;justify-content:center;height:100%}
.fmini .phone{width:102px;height:176px;background:#fff;border:1px solid #dcdce2;border-radius:15px;box-shadow:0 10px 24px -10px rgba(40,40,60,.42);padding:8px 7px 0;display:flex;flex-direction:column;gap:7px;overflow:hidden}
.fmini .phhdr{display:flex;align-items:center;gap:3px;padding-bottom:4px;border-bottom:1px solid #f0f0f2}
.fmini .phhdr .knm{font-size:7.5px;font-weight:700;color:#2d2d2d}
.fmini .phhdr .dot{width:3.5px;height:3.5px;border-radius:50%;background:#d5d5da}
.fmini .phsec{display:flex;align-items:center;font-size:7px;font-weight:700;color:#3a3a3a;margin-top:4px;border-bottom:1px solid #f0f0f2;padding-bottom:4px}
.fmini .phhdr + .phsec{margin-top:-5px}
.fmini .phcols{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:-3px}
.fmini .phcol{display:flex;flex-direction:column;gap:5px;min-width:0}
.fmini .phcol .ch{font-size:6.5px;color:#9a9a9a;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:-2px}
.fmini .phcard{border-radius:4px;padding:6px 4px;display:flex;flex-direction:column;gap:4px;justify-content:center}
.fmini .phcard.r{background:#fde8e6}
.fmini .phcard.o{background:#fff0d9}
.fmini .phcard.n{background:#f5f5f5}
.fmini .phcard.n .l{background:#e2e2e6}
.fmini .phcard.g{background:#e9f5ea}
.fmini .phcard .l{height:2.5px;border-radius:1px;background:rgba(255,255,255,.8)}
.fmini .lz{display:flex;flex-direction:column;height:100%;border:1px solid #ececec;border-radius:8px;overflow:hidden}
.fmini .lzhead{display:flex;align-items:stretch;border-bottom:1px solid #eee}
.fmini .lzhead .nm{flex:0 0 56px;min-width:0;white-space:nowrap;overflow:hidden;font-size:8px;font-weight:600;color:#2d2d2d;background:#f3f3f4;padding:4px 6px;border-right:1px solid #eee;display:flex;align-items:center}
.fmini .lzhead .wk{flex:1;text-align:center;font-size:7px;color:#898989;padding:4px 0;align-self:center}
.fmini .lzrow{display:flex;align-items:center;flex:1;min-height:0;border-bottom:1px solid #f5f5f5}
.fmini .lzwho{flex:0 0 56px;display:flex;align-items:center;gap:4px;background:#f7f7f8;border-right:1px solid #eee;padding:0 6px;align-self:stretch}
.fmini .lzwho .d{width:6px;height:6px;border-radius:50%;flex:none}
.fmini .lzwho .ln{flex:1;height:5px;border-radius:3px;background:#e2e2e2}
.fmini .lztrack{flex:1;position:relative;height:13px;margin:0 5px}
.fmini .lzbar{position:absolute;height:8px;border-radius:3px;top:2.5px}
.fmini .lzdiv{border-top:1.5px solid #e2e2e2}
.fmini .lzcells{flex:1;display:grid;grid-template-columns:repeat(10,1fr);gap:2px;margin:0 5px;align-items:center}
.fmini .lzcells span{height:9px;border-radius:2px;background:#f1f1f3}
.fmini .lzcells span.r{background:#fde8e6}
.fmini .lzcells span.g{background:#e9f5ea}
