/* ============================================================
   RENTAL DESK — диспетчерская сетка дня                   Палитра: глубокий графит + сигнальный оранжевый
   ============================================================ */
*{ box-sizing:border-box; margin:0; padding:0; }

/* tokens:start */
:root{ --gutter:52px; --header-h:64px;
--disp:'Unbounded','Golos Text',system-ui,sans-serif;
--body:'Golos Text',system-ui,'Segoe UI',sans-serif; }
:root[data-theme="dark"]{
color-scheme:dark;
--bg:#0B101D;
--text-primary:#EAF0FF;
--text-muted:#8B97B4;
--text-faint:#5C6884;
--accent:#FF7A1A;
--accent-light:#FFA04D;
--accent-deep:#F05E00;
--accent-grad-a:#FFB347;
--lead:#FFC24B;
--ok:#3FD68F;
--danger:#FF5D5D;
--surface:#182238;
--surface-2:#141D31;
--surface-modal:#1A2233;
--surface-toast:#161F34;
--surface-control:#232E4A;
--surface-control-hover:#28365A;
--surface-nav:#182136;
--surface-nav-hover:#1D2942;
--surface-inset:#0F1729;
--surface-gray:#2A3450;
--surface-mini-hover:#334062;
--surface-mini:#2C3A5E;
--surface-guide:#223052;
--timeline-grad-a:#101828;
--timeline-grad-b:#0D1424;
--line:rgba(148,166,210,.14);
--line-card:rgba(148,166,210,.16);
--line-modal:rgba(148,166,210,.18);
--line-guide:rgba(148,166,210,.2);
--line-tick:rgba(148,166,210,.28);
--line-dashed:rgba(148,166,210,.3);
--line-control:#2A3552;
--line-strong:#3A4666;
--scroll-thumb:#242F4C;
--text-row:#C7D3EE;
--text-hour:#AAB7D6;
--text-label:#7E8AA8;
--text-gray-btn:#C6D0E8;
--text-lead:#FFDF9E;
--on-accent:#1B0D00;
--on-accent-strong:#1A1005;
--veh-text:#BFDBFE;
--status-deposit-text:#FFD02E;
--danger-text:#FF9B9B;
--danger-text-strong:#FF7B7B;
--veh-bg:rgba(96,165,250,.12);
--veh-line:rgba(96,165,250,.4);
--ambient-blue:rgba(70,130,255,.10);
--ok-pulse:rgba(63,214,143,.5);
--ok-pulse-fade:rgba(63,214,143,0);
--accent-focus:rgba(255,122,26,.18);
--ambient-accent:rgba(255,122,26,.16);
--accent-line:rgba(255,122,26,.5);
--accent-line-strong:rgba(255,122,26,.55);
--accent-glow-brand:rgba(255,122,26,.45);
--accent-shadow:rgba(255,122,26,.35);
--accent-line-count:rgba(255,122,26,.3);
--accent-ring:rgba(255,122,26,.22);
--accent-bg-count:rgba(255,122,26,.14);
--chip-client-bg:rgba(255,122,26,.09);
--now-glow:rgba(255,122,26,.7);
--now-glow-fade:rgba(255,122,26,0);
--accent-hover-line:rgba(255,160,77,.5);
--accent-hover-line-strong:rgba(255,160,77,.55);
--lead-bg:rgba(255,194,75,.13);
--lead-line:rgba(255,194,75,.5);
--status-prebook:#FF7A00;
--status-deposit:#FACC15;
--status-ready:#22C55E;
--status-moved:#A855F7;
--status-canceled:#64748B;
--status-prebook-bg:rgba(255, 122, 0, 0.12);
--status-prebook-bg-hover:rgba(255, 122, 0, 0.22);
--status-deposit-bg:rgba(250, 204, 21, 0.12);
--status-deposit-bg-hover:rgba(250, 204, 21, 0.22);
--status-ready-bg:rgba(34, 197, 94, 0.12);
--status-ready-bg-hover:rgba(34, 197, 94, 0.22);
--status-moved-bg:rgba(168, 85, 247, 0.12);
--status-moved-bg-hover:rgba(168, 85, 247, 0.22);
--status-canceled-bg:rgba(100, 116, 139, 0.12);
--danger-bg:rgba(255,93,93,.1);
--danger-bg-2:rgba(255,93,93,.12);
--danger-bg-hover:rgba(255,93,93,.18);
--danger-bg-hover-2:rgba(255,93,93,.2);
--danger-line:rgba(255,93,93,.35);
--danger-line-2:rgba(255,93,93,.4);
--danger-line-3:rgba(255,93,93,.5);
--danger-line-4:rgba(255,93,93,.6);
--backdrop:rgba(4,7,15,.55);
--backdrop-modal:rgba(4,7,15,.62);
--backdrop-request:rgba(4,7,15,.35);
--shadow-menu:rgba(2,4,10,.6);
--shadow-modal:rgba(2,4,10,.7);
--shadow-trip:rgba(3,6,14,.45);
--shadow-trip-hover:rgba(3,6,14,.6);
--header-bg:rgba(11,16,29,.85);
--bar-bg:rgba(11,16,29,.92);
--tick-label-bg:rgba(11,16,29,.75);
--zoom-widget-bg:rgba(19,26,45,.92);
--inner-highlight:rgba(255,255,255,.35);
--ambient-stripe:rgba(255,255,255,.018);
}
/* tokens:end */


html{ scrollbar-color:var(--scroll-thumb) transparent; }
body{
  font-family:var(--body); background:var(--bg); color:var(--text-primary);
  min-height:100vh; -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:transparent;
touch-action:manipulation;
}
body.modal-open{ overflow:hidden; }
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(1100px 520px at 88% -8%, var(--ambient-accent), transparent 62%),
    radial-gradient(900px 640px at -8% 24%, var(--ambient-blue), transparent 60%),
    repeating-linear-gradient(115deg, var(--ambient-stripe) 0 2px, transparent 2px 16px);
}
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input,select{ font:inherit; }
:focus-visible{ outline:2px solid var(--accent-light); outline-offset:2px; border-radius:6px; }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-thumb{ background:var(--scroll-thumb); border-radius:8px; border:2px solid var(--bg); }
::-webkit-scrollbar-track{ background:transparent; }

#loader{ position:fixed; top:0; left:0; right:0; height:3px; z-index:90; opacity:0; transition:opacity .2s; pointer-events:none; overflow:hidden; }
body.loading #loader{ opacity:1; }
#loader span{ display:block; height:100%; width:32%; border-radius:8px;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  animation:loader-slide 1.1s linear infinite; }
@keyframes loader-slide{ from{ transform:translateX(-110%);} to{ transform:translateX(420%);} }

.app{
  position:fixed; left:0; right:0; top:0; z-index:50; min-height:var(--header-h);
  display:flex; align-items:center; gap:14px; flex-wrap:nowrap;
  padding:10px 16px;
  background:var(--header-bg); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.brand{ display:flex; align-items:center; gap:10px; margin-right:6px; }
.brand-flag{
  width:30px; height:30px; border-radius:8px; flex:none; position:relative;
  background:conic-gradient(from 220deg, var(--accent-grad-a), var(--accent), var(--accent-deep), var(--accent-grad-a));
  box-shadow:0 0 16px var(--accent-glow-brand);
}
.brand-flag::after{ content:""; position:absolute; inset:7px 12px; background:var(--bg); transform:skewX(-18deg); border-radius:2px; }
.brand-txt{ display:flex; flex-direction:column; line-height:1.18; }
.brand-txt strong{ font-family:var(--disp); font-size:12px; letter-spacing:.14em; font-weight:700; }
.brand-txt span{ font-size:11px; color:var(--text-muted); display:flex; align-items:center; gap:5px; }
.pulse-dot{ width:6px; height:6px; border-radius:50%; background:var(--ok); flex:none; animation:pulse-dot 2s infinite; }
@keyframes pulse-dot{ 0%,100%{ box-shadow:0 0 0 0 var(--ok-pulse);} 50%{ box-shadow:0 0 0 5px var(--ok-pulse-fade);} }

.date-nav{ display:flex; align-items:center; gap:8px; }
.nav-btn{
  width:38px; height:38px; border-radius:12px; flex:none;
  background:var(--surface-nav); border:1px solid var(--line); color:var(--text-muted);
  font-size:13px; display:grid; place-items:center;
  transition:border-color .15s, color .15s, transform .12s, background .15s;
}
.nav-btn:hover{ border-color:var(--accent); color:var(--accent-light); background:var(--surface-nav-hover); }
.nav-btn:active{ transform:scale(.93); }
.today-btn{ width:auto; padding:0 14px; font-size:12px; font-weight:600; letter-spacing:.03em; color:var(--accent-light); }
.date-box{ display:flex; flex-direction:column; align-items:center; min-width:0; }
.date-box.swap h1{ animation:date-swap .35s ease; }
@keyframes date-swap{ from{ opacity:0; transform:translateY(7px);} }
.date-box h1{ font-family:var(--disp); font-weight:700; font-size:clamp(15px,2.6vw,21px); letter-spacing:.02em; white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis; }
.date-sub{ display:flex; align-items:center; gap:6px; min-height:16px; }
.badge-today{
  font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent-light); border:1px solid var(--accent-line); border-radius:8px; padding:1px 8px;
  animation:badge-in .4s ease;
}
@keyframes badge-in{ from{ transform:scale(.6); opacity:0; } }
.spacer{ flex:1; }

.btn-add{
  font-family:var(--disp); font-weight:600; font-size:13px; letter-spacing:.04em;
  color:var(--on-accent); padding:11px 20px; border-radius:13px;
  background:linear-gradient(135deg,var(--accent-grad-a), var(--accent) 45%, var(--accent-deep));
  box-shadow:0 8px 22px var(--accent-shadow), inset 0 1px 0 var(--inner-highlight);
  transition:transform .14s, box-shadow .14s, filter .14s;
}
.btn-add:hover{ transform:translateY(-1px); filter:brightness(1.07); box-shadow:0 12px 28px var(--accent-glow-brand), inset 0 1px 0 var(--inner-highlight); }
.btn-add:active{ transform:scale(.96); }

.zoom-widget{
  display:flex; align-items:center; gap:6px;
  background:var(--zoom-widget-bg); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-radius:8px;
  padding:5px 8px; font-size:12px;
}
#zoomLabel{ font-weight:600; letter-spacing:.03em; min-width:84px; text-align:center; font-variant-numeric:tabular-nums; }
.zw-btn{ width:26px; height:26px; border-radius:50%; background:var(--surface-control); border:1px solid var(--line); color:var(--accent-light); font-weight:700; line-height:1; transition:background .15s, transform .12s; }
.zw-btn:hover{ background:var(--surface-mini); }
.zw-btn:active{ transform:scale(.9); }
.zw-sep{ width:1px; height:16px; background:var(--line); }
.zw-reset{ color:var(--text-muted); font-size:12px; padding:3px 6px; border-radius:8px; transition:color .15s, background .15s; }
.zw-reset:hover{ color:var(--accent-light); background:var(--surface-control); }


main{ padding:12px 2px 130px; max-width:1440px; margin:0 auto; overflow-x:auto; }
/* v9mvp-LAYOUT-1: сегмент [Обзор|План], tap-цели ≥48dp */
.view-segment{ display:flex; gap:4px; background:var(--surface-inset); border:1px solid var(--line); border-radius:10px; padding:3px; }
.seg-btn{ min-width:64px; min-height:48px; padding:0 14px; border-radius:8px; font-size:12px; font-weight:700; letter-spacing:.03em; color:var(--text-muted); background:transparent; border:0; transition:background .15s, color .15s; }
.seg-btn.active{ background:var(--surface-control); color:var(--accent-light); }
.seg-btn:active{ transform:scale(.96); }
.client{ min-height:40px; }
.client .c-count{ margin-left:auto; color:var(--text-muted); }
.client.chip-s{ min-height:44px; } .client.chip-s .c-name{ font-size:14px; } .client.chip-s .c-count{ font-size:14px; }
.client.chip-m{ min-height:56px; } .client.chip-m .c-name{ font-size:15px; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } .client.chip-m .c-count{ font-size:12px; }
.client.chip-l{ min-height:64px; } .client.chip-l .c-name{ font-size:16px; white-space:normal; } .client.chip-l .c-count{ font-size:18px; } .client.chip-l .c-note{ font-size:13px; color:var(--text-muted); }
/* CUSTOMER-ITER-7: длинный тап не выделяет текст интерфейса. */
body{ -webkit-user-select:none; user-select:none; }
input, textarea{ -webkit-user-select:text; user-select:text; }
/* CUSTOMER-ITER-10: сжимается только дата, кнопки и меню не сжимаются. */
.app > *{ flex-shrink:0; }
.date-box{ flex-shrink:1; }