:root{--bg: #0f1115;--card: #1b1f27;--border: #2c323d;--text: #e8ebf0;--muted: #9aa4b2;--accent: #3b82f6;--danger: #ef4444;--warn: #f59e0b;--radius: 10px;--content-width: 1100px}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);-webkit-text-size-adjust:100%}.app-header{position:sticky;top:0;z-index:10;background:var(--card);border-bottom:1px solid var(--border)}.header-inner{display:flex;align-items:center;gap:10px;padding:8px 12px}.date-bar{display:flex;align-items:center;gap:6px;flex:0 0 auto}.date-display{font-variant-numeric:tabular-nums;min-width:90px;text-align:center}.icon-btn{width:34px;height:34px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg);color:var(--text);font-size:20px;line-height:1;cursor:pointer}.icon-btn:hover:not(:disabled){background:var(--card);border-color:var(--accent)}.text-btn{background:none;border:none;color:var(--muted);cursor:pointer;font-size:14px}.text-btn:hover:not(:disabled){color:var(--text)}.text-btn.danger{color:var(--danger)}.logout{flex:0 0 auto}.tabs-bar-inner{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.tabs-list{display:flex;gap:6px;min-width:0;overflow-x:auto;scrollbar-width:none}.tabs-list::-webkit-scrollbar{display:none}.tab{display:flex;align-items:center;gap:2px;flex:0 0 auto;padding:6px 8px 6px 12px;border-radius:999px;border:1px solid var(--border);background:var(--bg)}.tab.active{border-color:var(--accent);background:#3b82f626}.tab:hover{border-color:var(--accent);background:#3b82f61a}.tab-label{background:none;border:none;color:var(--text);font-size:14px;cursor:pointer;padding:0;white-space:nowrap;max-width:140px;overflow:hidden;text-overflow:ellipsis}.tab-label:hover{color:var(--accent)}.tab-icon{background:none;border:none;color:var(--muted);cursor:pointer;font-size:14px;line-height:1;padding:2px 4px}.tab-icon:hover{color:var(--text)}.tab-name-input{width:110px;padding:3px 6px;font-size:14px;border-radius:6px}.tabs-add{flex:0 0 auto}.rows{padding:12px;display:flex;flex-direction:column;gap:12px}.row-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:12px;display:flex;flex-direction:column;gap:10px}.row-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.row-select{display:flex;flex-direction:row;align-items:center;gap:8px;color:var(--text);font-size:13px;cursor:pointer}.row-select input{width:18px;height:18px;margin:0;padding:0;accent-color:var(--accent);flex:0 0 auto}.row-num{color:var(--muted);font-size:13px}.row-head-actions{display:flex;align-items:center;gap:12px}.resolved-areas{margin-top:-4px;font-size:12px;color:var(--muted)}label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}.row-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"marka vn" "marshrut marshrut" "resolved resolved" "oblast oblast" "vodiy vodiy";gap:10px}.field-marka{grid-area:marka}.field-vn{grid-area:vn}.field-vodiy{grid-area:vodiy}.field-marshrut{grid-area:marshrut}.field-resolved{grid-area:resolved}.field-oblast{grid-area:oblast}.marshrut-row{display:flex;gap:10px;align-items:flex-start}.marshrut-row .grow{flex:1}.marshrut-row .distance-line{flex:0 0 120px;flex-direction:column;align-items:stretch;gap:6px}.marshrut-row .distance-line .calc{width:100%}input,select,textarea{width:100%;padding:.2rem .5rem;font-size:.875rem;font-family:inherit;line-height:1.25;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:8px}select,.calc{height:calc(1.25em + .4rem + 2px)}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px}textarea.autogrow{display:block;resize:none;overflow:hidden;white-space:pre-wrap;word-break:break-word}.distance-line{display:flex;gap:8px;align-items:flex-end}.calc{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center}.calc:hover:not(:disabled){background:color-mix(in srgb,var(--warn) 18%,var(--bg));border-color:var(--warn)}.calc.needs-calc{background:var(--warn);border-color:var(--warn);color:#1b1f27;font-weight:600;animation:needs-calc-pulse 1.6s ease-in-out infinite}input.stale{border-color:var(--warn)}@keyframes needs-calc-pulse{0%,to{box-shadow:0 0 #f59e0b8c}50%{box-shadow:0 0 0 5px #f59e0b00}}@media (prefers-reduced-motion: reduce){.calc.needs-calc{animation:none}}.actions{position:sticky;bottom:0;display:flex;gap:10px;padding:12px;background:linear-gradient(to top,var(--bg) 60%,transparent)}.primary-btn,.secondary-btn{padding:12px 16px;font-size:15px;border-radius:var(--radius);cursor:pointer;border:1px solid var(--border)}.primary-btn{background:var(--accent);border-color:var(--accent);color:#fff;flex:1}.secondary-btn{background:var(--card);color:var(--text)}.primary-btn:hover:not(:disabled){filter:brightness(1.06)}.secondary-btn:hover:not(:disabled){background:color-mix(in srgb,var(--card) 82%,white)}.secondary-btn:disabled{opacity:.45;cursor:not-allowed}#add-row{flex:1}.login-body{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:16px}.login-card{width:100%;max-width:340px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:14px}.login-card h1{margin:0 0 4px;font-size:20px}.error{color:var(--danger);font-size:13px;margin:0}@media (min-width: 820px){#app-shell{max-width:var(--content-width);margin:0 auto}body{overflow-x:hidden}.app-header{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}.header-inner{max-width:var(--content-width);margin:0 auto}.row-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-areas:"marka vn vodiy oblast" "marshrut marshrut marshrut marshrut" "resolved resolved resolved resolved";gap:14px}.marshrut-row .distance-line{flex:0 0 240px;flex-direction:row;align-items:flex-end}.marshrut-row .distance-line .calc{width:auto}.actions{padding:16px 20px;gap:14px}.primary-btn,.secondary-btn{padding:12px 20px}#add-row{flex:0 0 auto}}
