/* Общая система DOC-04, 10.09.2026. Роли и основания — DESIGN.md. */
.period{display:flex; align-items:center; justify-content:space-between; gap:8px;
        margin-bottom:10px}
.period h1{text-transform:capitalize}
.period .icon-btn svg{width:18px; height:18px}

.strip{display:flex; margin-bottom:12px;
       border-top:1px solid var(--hair); border-bottom:1px solid var(--hair)}
.strip .d{flex:1; text-align:center; padding:8px 0 6px; cursor:pointer;
          background:none; border:none; border-radius:0}
.strip .d .wd{font-family:var(--font-body); font-size:var(--fs-label);
              letter-spacing:0; text-transform:none; color:var(--muted)}
.strip .d .n{font-family:var(--font-body); font-size:var(--fs-body);
             font-variant-numeric:tabular-nums; letter-spacing:0}
.strip .d.sel{background:var(--ink); color:var(--on-ink)}
.strip .d.sel .wd{color:var(--on-ink)}

.strip .pip{width:8px; height:2px; background:var(--muted); margin:3px auto 0}
.strip .d.sel .pip{background:var(--on-ink)}

.grid{display:grid; grid-template-columns:repeat(7,1fr); gap:4px}
.grid .wc{text-align:center; font-family:var(--font-body); font-size:var(--fs-label);
          letter-spacing:0; text-transform:none; color:var(--muted); padding:3px 0}
.cell{
  aspect-ratio:1; background:none; border:none; border-radius:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-family:var(--font-body); font-size:var(--fs-body);
  font-variant-numeric:tabular-nums; cursor:pointer;
}
.cell.empty{cursor:default; color:transparent}

.cell.today{color:var(--acc); box-shadow:inset 0 -2px 0 var(--acc)}
.cell .pip{width:8px; height:2px; background:var(--muted); margin-top:3px}
.cell .pip.imp{background:var(--st-hot)}

.item{
  position:relative; display:flex; gap:10px; align-items:baseline; cursor:pointer;
  background:var(--surface); border:1px solid var(--hair); border-radius:var(--radius);
  padding:12px; margin:0 0 8px; --st:var(--st-wait);
}

.item::before{display:none}
.item.s-over{--st:var(--st-hot)}
.item.s-imp{--st:var(--st-hot)}
.item.s-done,.item.s-cancelled{--st:var(--st-wait)}

.item.s-over .tm,.item.s-imp .tm{background:var(--st-hot-bg);border-radius:var(--radius)}

.item .tm{flex:0 0 44px; font-family:var(--font-body); font-size:var(--fs-data);
          font-variant-numeric:tabular-nums; letter-spacing:0; color:var(--ink)}
.item .tm.none{color:var(--muted)}
.item.s-over .tm,.item.s-imp .tm{color:var(--st)}
.item.s-done .tm,.item.s-cancelled .tm{color:var(--muted)}
.item .ic{width:18px; flex:0 0 auto; color:var(--muted); display:grid; place-items:center}
.item .ic svg{width:16px; height:16px}
.item.s-over .ic,.item.s-imp .ic{color:var(--st)}
.item .body{flex:1; min-width:0}
.item .t{font-size:var(--fs-body); font-weight:600; line-height:1.35;
         letter-spacing:-.01em; word-break:break-word}
.item.s-done .t,.item.s-cancelled .t{text-decoration:line-through; color:var(--muted)}
.item .meta{font-size:var(--fs-sub); color:var(--muted); margin-top:2px}
.item .meta .imp{color:var(--st-hot)}

.day-head{font-weight:600;display:flex; align-items:baseline; gap:8px; margin:18px 0 8px;
          font-family:var(--font-body); font-size:var(--fs-label);
          letter-spacing:0; text-transform:none; color:var(--muted)}
.day-head .n{font-weight:400}
.day-head .n.over{color:var(--st-hot)}
.day-head .c{margin-left:auto; font-variant-numeric:tabular-nums}
.day-empty{color:var(--muted); font-size:var(--fs-sub); padding:2px 0 6px}

.log{display:flex; flex-direction:column; gap:14px}
.msg{max-width:86%; word-break:break-word; white-space:pre-wrap;
     font-size:var(--fs-body); line-height:1.45; background:none; border-radius:0;
     padding:0}
.msg.me{align-self:flex-end; text-align:right;
        border-right:2px solid var(--edge); padding-right:10px}
.msg.bot{align-self:flex-start; color:var(--ink-soft);
         border-left:2px solid var(--ink); padding-left:10px}
.msg img{max-width:100%; border-radius:var(--radius); display:block}
.msg audio{width:230px; max-width:100%; display:block}
.typing{align-self:flex-start; color:var(--muted); font-size:var(--fs-sub)}

body.with-composer{padding-bottom:calc(var(--tabbar-h) + 74px + env(safe-area-inset-bottom))}

.composer{
  position:fixed; left:0; right:0; z-index:45; display:flex; gap:8px; align-items:flex-end;
  bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom));
  padding:8px var(--pad); background:var(--bg); border-top:1px solid var(--rule);
}
.composer textarea{flex:1; margin:0; max-height:96px; border-radius:var(--radius)}
.composer button{padding:0 16px; height:44px; border-radius:var(--radius);
                 display:grid; place-items:center}
.composer button svg{width:18px; height:18px}

body.standalone{
  max-width:660px; margin:0 auto;
  padding-bottom:calc(140px + env(safe-area-inset-bottom));
}

.pick{display:flex; align-items:baseline; gap:12px; cursor:pointer;
      padding:12px 0; border-top:1px solid var(--hair)}
.pick.coming{opacity:.55; cursor:default}

.pick .mi{flex:0 0 auto; width:22px; color:var(--muted); display:grid; place-items:center}
.pick .mi svg{width:20px; height:20px}
.pick.on .mi{color:var(--ink)}
.pick .body{flex:1; min-width:0}
.pick .title{font-size:var(--fs-body); font-weight:400}
.pick .desc{color:var(--muted); font-size:var(--fs-sub); margin-top:2px}
.pick .price{color:var(--muted); font-family:var(--font-body); font-size:var(--fs-data);
             font-variant-numeric:tabular-nums; margin-top:4px}
.pick .check{width:18px; height:18px; border:1px solid var(--edge);
             border-radius:var(--radius); flex:0 0 auto; display:grid;
             place-items:center; color:transparent}
.pick .check svg{width:12px; height:12px}
.pick.on .check{border-color:var(--ink); color:var(--ink)}

.cab .pick{text-decoration:none; color:var(--ink); padding:14px 0;border-top:none}

.cab .pick .desc{display:block}
.cab .pick .ci{flex:0 0 auto; width:24px; color:var(--muted); display:grid; place-items:center}
.cab .pick .ci svg{width:22px; height:22px}
.cab .pick .go{flex:0 0 auto; color:var(--muted); display:grid; place-items:center}
.cab .pick .go svg{width:18px; height:18px}
.cathead{display:flex; align-items:baseline; gap:8px; margin:20px 0 8px;
         font-family:var(--font-body); font-size:var(--fs-label);
         letter-spacing:0; text-transform:none; color:var(--muted)}
.cathead .ci{display:grid; place-items:center; color:var(--muted)}
.cathead .ci svg{width:15px; height:15px; vertical-align:-2px}
.cathead .ct{font-weight:400}
.cathead .cg{margin-left:auto; font-variant-numeric:tabular-nums}

.plats{display:flex; gap:8px; flex-wrap:wrap}
.plat{flex:1; min-width:90px; background:none; border:1px solid var(--edge);
      border-radius:var(--radius); padding:12px 8px; text-align:center; cursor:pointer}
.plat.on{border-color:var(--ink)}
.plat.off{opacity:.45; cursor:not-allowed}

.plat .pe{width:26px; height:26px; margin:0 auto 6px; border:1px solid var(--edge);
          border-radius:var(--radius); display:grid; place-items:center;
          font-family:var(--font-body); font-size:var(--fs-data); color:var(--muted)}
.plat.on .pe{border-color:var(--ink); color:var(--ink)}
.plat .pn{font-size:var(--fs-sub)}
.plat .ps{font-family:var(--font-body); font-size:var(--fs-data); color:var(--muted)}

.footbar{position:fixed; left:0; right:0; bottom:0; z-index:45;
         padding:12px var(--pad) calc(12px + env(safe-area-inset-bottom));
         background:var(--bg); border-top:1px solid var(--rule)}
.footbar .in{max-width:640px; margin:0 auto}
.footbar .count{color:var(--muted); font-family:var(--font-body);
                font-size:var(--fs-data); text-align:center; margin-bottom:8px}

.finish{position:fixed; inset:0; z-index:70; background:var(--bg); display:none;
        flex-direction:column; justify-content:center; align-items:center;
        padding:24px; text-align:center}
.finish.show{display:flex}
.finish h3{margin:0 0 6px; font-size:var(--fs-title); font-weight:600;
           letter-spacing:-.01em}
.finish p{color:var(--muted); font-size:var(--fs-sub); margin:0 0 22px; max-width:340px}
.finish .go{display:block; width:100%; max-width:340px; text-decoration:none;
            text-align:center; background:var(--ink); color:var(--on-ink);
            border-radius:var(--radius); padding:14px; font-size:var(--fs-btn)}
.finish .back{color:var(--muted); margin-top:16px; font-size:var(--fs-sub)}

.tile{padding:12px 0; margin:0; border:0;border-radius:0;background:none;min-height:44px}
.tile.tap{cursor:pointer}
.tile .head{display:flex; align-items:baseline; gap:10px}
.tile .head .act{margin-left:auto; font-family:var(--font-body);
                 font-size:var(--fs-data); letter-spacing:0; color:var(--acc);
                 white-space:nowrap}
.tile .head .act.off{color:var(--muted); opacity:.75}
.tile .diag{padding-top:8px; border-top:1px solid var(--hair); margin-top:8px}

.tile .head .mi{flex:0 0 auto; width:22px; color:var(--muted); display:grid;
                place-items:center; align-self:center}
.tile .head .mi svg{width:20px; height:20px}
.tile .head .title{font-size:var(--fs-body); font-weight:600}
.tile .desc{color:var(--muted); font-size:var(--fs-sub); margin:4px 0 0 32px}
.tile .out{margin-top:10px}
.tile .out p{white-space:pre-wrap; margin:0}
.tile .out img{max-width:100%; border-radius:var(--radius)}
.tile .out audio{width:100%; margin-top:6px}
.balance{font-family:var(--font-body); font-size:var(--fs-data); color:var(--muted);
         font-variant-numeric:tabular-nums}
.balance b{color:var(--ink); font-weight:400}

.wallet-balance{font-family:var(--font-body); font-size:32px;font-weight:600;
                font-variant-numeric:tabular-nums; letter-spacing:0; margin-top:2px;
                color:var(--ink)}
.wallet-tester{padding:11px 0; border-top:1px solid var(--hair)}
.wallet-tester .hint{margin-top:4px}
.wallet-row{display:flex; justify-content:space-between; align-items:baseline; gap:10px;
            padding:11px 0; border-top:1px solid var(--hair)}
.wallet-amt{font-family:var(--font-body); font-size:var(--fs-data);
            font-variant-numeric:tabular-nums; white-space:nowrap}
.wallet-amt.in{color:var(--st-live)}

.quiet-times{gap:8px; margin-top:6px}
.quiet-times input[type="time"]{flex:0 0 auto; width:auto; min-width:112px; margin:0;
                                font-family:var(--font-body);
                                font-variant-numeric:tabular-nums;
                                font-size:var(--fs-data); padding:8px 10px}

.seats-n{width:auto; min-width:56px; margin:0; padding:2px 0;
         border:none; border-bottom:1px solid var(--hair); border-radius:0;
         background:none; font-family:var(--font-body);
         font-variant-numeric:tabular-nums; font-size:var(--fs-body)}
.seats-n:focus{border-bottom:1px solid var(--ink)}

.legend .v{font-size:var(--fs-sub); color:var(--ink-soft); line-height:1.45}

.mbody .seg{margin:0; padding:2px 0 0; border-bottom:none; gap:14px}

.hint.pay{padding:8px 0 2px}

.empty.chat-empty{padding:32px 0}
.chat-empty h2{font-size:20px;font-weight:600;margin:0 0 8px;color:var(--ink)}
.chat-empty p{font-size:var(--fs-sub);margin:0;line-height:1.45}