/* NSM Mobile 0.7.2 – vizuális finomítás + bemutatható demóállapot */
:root{
  --nsm-night:#031737;
  --nsm-navy:#06265c;
  --nsm-blue:#1268df;
  --nsm-sky:#27adff;
  --nsm-ice:#eaf4ff;
  --nsm-bg:#f4f7fb;
  --nsm-line:#dbe5f1;
  --nsm-text:#071a38;
  --nsm-muted:#697a91;
  --nsm-green:#26d39b;
  --nsm-amber:#ffb53d;
  --nsm-red:#f05b52;
}
html,body{background:linear-gradient(135deg,#dbe6f2 0%,#eef3f8 46%,#dfe8f2 100%)}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
.mobile-shell{
  width:min(100%,414px);
  background:
    radial-gradient(circle at 88% 2%,rgba(39,173,255,.10),transparent 24%),
    linear-gradient(180deg,#f8faff 0%,#f3f7fc 100%);
  border-radius:0 0 30px 30px;
  box-shadow:0 28px 80px rgba(3,23,55,.22);
}
.app-header{
  height:72px;
  padding:12px 17px;
  background:linear-gradient(117deg,#031737 0%,#082a62 62%,#123e83 100%);
  box-shadow:0 10px 28px rgba(3,23,55,.20);
}
.brand{gap:11px}.brand>svg{width:43px;height:43px;filter:drop-shadow(0 8px 14px rgba(0,0,0,.18))}
.brand strong{font-size:16px;font-weight:850;letter-spacing:-.02em}.brand small{font-size:7.5px;letter-spacing:.16em;color:#afd4ff}
.header-side{gap:11px}.online-dot{width:8px;height:8px;background:var(--nsm-green);box-shadow:0 0 0 5px rgba(38,211,155,.12),0 0 12px rgba(38,211,155,.30)}
.avatar{width:38px;height:38px;border-radius:50%;font-size:12px;background:linear-gradient(145deg,#255fc4,#173779);box-shadow:inset 0 0 0 1px rgba(255,255,255,.23),0 7px 18px rgba(0,0,0,.15)}
main{padding:20px 15px 100px}.today-page{padding-top:14px}
.hero-intro{margin:0 0 16px;align-items:center}.hero-intro span{font-size:10px;color:#6f84a3}.hero-intro h1{font-size:25px;line-height:1.05;letter-spacing:-.045em;color:var(--nsm-text);font-weight:900;margin-top:6px}
.today-count{min-width:78px;padding:10px 12px;border-radius:19px;background:linear-gradient(145deg,#fff,#edf4fd);border:1px solid rgba(205,220,238,.9);box-shadow:0 10px 22px rgba(3,23,55,.07)}
.today-count span{font-size:25px;color:var(--nsm-blue);font-weight:900}.today-count small{font-size:8px;color:#62748d;font-weight:850;text-transform:uppercase;letter-spacing:.04em}
.primary-job{
  padding:18px 18px 17px;
  border-radius:25px;
  background:
    radial-gradient(circle at 98% 2%,rgba(62,181,255,.22),transparent 30%),
    linear-gradient(145deg,#042052 0%,#083b82 62%,#1262bd 100%);
  box-shadow:0 24px 50px rgba(4,31,76,.27),inset 0 1px 0 rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.07);
}
.primary-job:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(125deg,rgba(255,255,255,.055),transparent 37%);pointer-events:none}
.primary-job:after{right:-38px;top:-48px;width:140px;height:140px;background:rgba(73,185,255,.11);box-shadow:0 0 0 28px rgba(73,185,255,.045),0 0 0 55px rgba(73,185,255,.018)}
.map-motif{opacity:.48;transform:rotate(-5deg)}
.primary-head{align-items:center}.pill-label{padding:7px 11px;font-size:7.5px!important;background:rgba(23,111,229,.42);border:1px solid rgba(100,197,255,.15);color:#70d4ff;border-radius:999px}
.status{padding:7px 10px;font-size:7.5px;border-radius:999px;background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.18);backdrop-filter:blur(9px);text-transform:uppercase;letter-spacing:.055em}
.status i{background:#288aff;box-shadow:0 0 0 4px rgba(40,138,255,.15),0 0 12px rgba(40,138,255,.4)}
.time-chip{display:inline-flex;margin-top:10px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12)}.time-chip svg{width:19px;height:19px;color:#69d7ff}.time-chip strong{font-size:19px;letter-spacing:-.025em}
.customer-row{margin-top:16px;gap:12px}.customer-avatar{width:49px;height:49px;border-radius:16px;background:linear-gradient(145deg,rgba(255,255,255,.20),rgba(255,255,255,.09));box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);font-size:14px}.customer-row h2{font-size:25px;font-weight:900;letter-spacing:-.045em}.customer-row span{font-size:8px;color:#bfdaff}
.problem{margin:14px 0 14px;font-size:15px;font-weight:580;color:#f7fbff;line-height:1.45}
.job-facts{padding:0;border-radius:17px;overflow:hidden;gap:0;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.10);backdrop-filter:blur(10px)}
.job-facts div{padding:11px 12px;grid-template-columns:18px 1fr 14px;font-size:10px;color:#eaf4ff}.job-facts div+div{border-top:1px solid rgba(255,255,255,.10)}.job-facts svg{width:15px;height:15px;color:#bfe2ff}
.primary-actions{grid-template-columns:56px 56px 1fr;gap:9px;margin-top:13px}.icon-action,.main-action{height:51px;border-radius:15px}.icon-action{background:rgba(255,255,255,.095);border-color:rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}.icon-action svg{width:20px;height:20px}.icon-action small{font-size:7px;margin-top:-8px;font-weight:850}.main-action{background:linear-gradient(100deg,#1268df 0%,#28b5ff 100%);color:#fff;font-size:10px;letter-spacing:.02em;box-shadow:0 12px 26px rgba(13,115,232,.34),inset 0 1px 0 rgba(255,255,255,.24)}
.main-action:active,.icon-action:active{transform:translateY(1px) scale(.985)}
.empty-job{padding:31px 18px 28px}.empty-job .done-ring{width:56px;height:56px;border-radius:19px;background:linear-gradient(145deg,rgba(255,255,255,.17),rgba(255,255,255,.08));box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.empty-job h2{font-size:22px}.empty-job p{font-size:11px}
.day-section{margin-top:24px}.section-head{margin-bottom:11px}.section-head .overline{font-size:8px;color:var(--nsm-blue);letter-spacing:.17em}.section-head h2{font-size:18px;font-weight:900;color:var(--nsm-text)}.route-count{padding:5px 9px;border-radius:999px;background:var(--nsm-ice);color:var(--nsm-blue);font-size:9px;font-weight:900}
.route-list{border:0;background:transparent;box-shadow:none;overflow:visible}.route-item{margin-bottom:10px;padding:14px 13px;border:1px solid var(--nsm-line)!important;border-radius:18px;background:linear-gradient(180deg,#fff,#fbfdff);box-shadow:0 10px 26px rgba(3,23,55,.07);grid-template-columns:14px 55px 1fr 31px 14px;transition:transform .16s ease,box-shadow .16s ease}.route-item:active{transform:scale(.992);box-shadow:0 7px 18px rgba(3,23,55,.08)}
.route-line span{width:10px;height:10px;background:#1b79f0;box-shadow:0 0 0 5px #e9f3ff}.route-line i{background:#cbd9e9;top:16px;bottom:-31px}.route-time{font-size:9px;color:#1268df;line-height:1.45}.route-copy{padding-left:4px}.route-copy strong{font-size:13px;font-weight:900}.route-copy span{font-size:10px;color:#40516a;margin-top:3px}.route-copy small{font-size:8.5px;color:#7a889b;margin-top:4px}.route-calendar{width:30px;height:30px;border-radius:10px;background:#eef6ff;color:#1268df}.route-calendar svg{width:14px;height:14px}
.module-strip{margin-top:17px;padding:4px;border:1px solid var(--nsm-line);border-radius:18px;background:rgba(255,255,255,.94);box-shadow:0 12px 30px rgba(3,23,55,.075);overflow:hidden}.module-strip button{min-height:59px;border:0;background:transparent;color:#1c4f9e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border-radius:14px;font-weight:850}.module-strip button+button{border-left:1px solid #e4ebf3}.module-strip button:active{background:#eff6ff}.module-strip svg{width:21px;height:21px;color:#1675ec}.module-strip span{font-size:8px}
.bottom-nav{width:min(100%,414px);height:75px;padding:8px 12px max(8px,env(safe-area-inset-bottom));background:rgba(4,22,52,.98);border-top:1px solid rgba(255,255,255,.06);box-shadow:0 -14px 34px rgba(3,23,55,.17);backdrop-filter:blur(20px)}.bottom-nav button{color:#8396b1;border-radius:16px;font-size:7.5px}.bottom-nav button svg{width:20px;height:20px}.bottom-nav button.active{color:#fff;background:linear-gradient(180deg,rgba(25,118,238,.32),rgba(25,118,238,.14));box-shadow:inset 0 0 0 1px rgba(94,184,255,.12)}
.page-title h1{font-size:25px;font-weight:900}.search-box input{height:48px;border-radius:16px;box-shadow:0 8px 22px rgba(3,23,55,.05)}.filter-chip{padding:9px 14px}.list-card{border-radius:19px;padding:14px;box-shadow:0 9px 24px rgba(3,23,55,.06)}
@media(max-width:360px){main{padding-left:11px;padding-right:11px}.primary-job{padding:16px;border-radius:22px}.customer-row h2{font-size:22px}.primary-actions{grid-template-columns:50px 50px 1fr}.route-item{grid-template-columns:13px 49px 1fr 14px}.route-calendar{display:none}}
@media(min-width:650px){body{padding:14px}.mobile-shell{min-height:calc(100vh - 28px);border-radius:30px}.app-header{border-radius:30px 30px 0 0}.bottom-nav{bottom:14px;border-radius:0 0 30px 30px}}
.bottom-nav{grid-template-columns:repeat(4,1fr)}