@font-face{font-family:"B Nazanin";src:url("/assets/fonts/b-nazanin.woff2") format("woff2"),local("B Nazanin"),local("BNazanin");font-display:swap}
@font-face{font-family:"B Titr";src:url("/assets/fonts/b-titr.woff2") format("woff2"),local("B Titr"),local("BTitr");font-display:swap}
:root{--ink:#15302d;--muted:#70807d;--line:#dfe9e6;--surface:#fff;--wash:#f3f8f6;--green:#0f766e;--green-2:#18a277;--green-soft:#daf2ea;--navy:#173a53;--amber:#e99a2b;--red:#c94d58;--purple:#7564bb;--shadow:0 14px 40px rgba(22,65,57,.10);--radius:22px}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--wash);scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:linear-gradient(180deg,#f7fbf9,#edf5f2);font-family:"B Nazanin",Tahoma,Arial,sans-serif;font-size:18px;min-height:100vh}
button,input{font:inherit}
button,a{tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p{margin-top:0}
h1,h2,h3,.display-font{font-family:"B Titr","B Nazanin",Tahoma,sans-serif;font-weight:700}
.muted{color:var(--muted)}
.offline-banner{position:fixed;z-index:100;top:0;inset-inline:0;padding:7px;text-align:center;background:#7c2d12;color:#fff;font-size:14px}
.login-page{min-height:100vh;display:grid;grid-template-columns:1.08fr .92fr;background:#f7fbfa}
.login-visual{position:relative;overflow:hidden;min-height:100vh;background:radial-gradient(circle at 35% 35%,#5bd1a0 0 8%,transparent 32%),linear-gradient(145deg,#073e3b,#0f766e 58%,#19a477);display:grid;place-items:center}
.login-visual:before,.login-visual:after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(255,255,255,.17);border-radius:50%}
.login-visual:after{width:370px;height:370px}
.city-glow{position:absolute;inset:auto 0 0;height:34%;opacity:.24;background:linear-gradient(90deg,transparent 3%,#fff 3% 7%,transparent 7% 11%,#fff 11% 15%,transparent 15% 20%,#fff 20% 25%,transparent 25% 31%,#fff 31% 37%,transparent 37% 41%,#fff 41% 48%,transparent 48% 55%,#fff 55% 61%,transparent 61% 68%,#fff 68% 72%,transparent 72% 79%,#fff 79% 85%,transparent 85%)}
.hero-bike{font-size:150px;filter:drop-shadow(0 30px 20px rgba(0,0,0,.2));transform:scaleX(-1);z-index:2}
.leaf{position:absolute;color:#b8f6c8;font-size:34px;opacity:.5}.leaf-one{top:18%;right:22%}.leaf-two{bottom:22%;left:19%}
.login-card{align-self:center;justify-self:center;width:min(460px,86%);padding:42px}
.brand{display:flex;align-items:center;gap:10px}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border-radius:14px;background:linear-gradient(145deg,var(--green),var(--green-2));color:#fff;font-family:"B Titr",Tahoma;font-size:24px;box-shadow:0 8px 20px rgba(15,118,110,.22)}
.brand strong,.brand small{display:block}.brand strong{font-family:"B Titr",Tahoma;font-size:20px}.brand small{color:var(--muted);font-size:12px;margin-top:-2px}.brand-large{margin-bottom:42px}.brand-large .brand-mark{width:54px;height:54px;font-size:30px}
.login-card h1{font-size:44px;line-height:1.45;margin-bottom:12px}.login-card h1 em{font-style:normal;color:var(--green)}
.login-card label{display:block;margin:30px 0 8px;font-weight:700}.phone-field{direction:ltr;display:flex;align-items:center;border:1px solid var(--line);background:#fff;border-radius:16px;overflow:hidden;transition:.2s}.phone-field:focus-within{border-color:var(--green);box-shadow:0 0 0 4px rgba(15,118,110,.1)}.phone-field span{padding:13px;border-right:1px solid var(--line);color:var(--muted)}.phone-field input{direction:ltr;border:0;outline:0;width:100%;padding:14px;background:transparent;letter-spacing:2px}.login-card small{color:var(--muted)}
.field-error{min-height:24px;color:var(--red);font-size:14px;margin:5px 0}.primary-button,.secondary-button,.ghost-button{border:0;border-radius:15px;min-height:48px;padding:10px 18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:700}.primary-button{background:linear-gradient(135deg,var(--green),#14946e);color:#fff;box-shadow:0 9px 22px rgba(15,118,110,.22)}.secondary-button{background:var(--green-soft);color:var(--green)}.ghost-button{background:#fff;border:1px solid var(--line);color:var(--ink)}.full-button{width:100%;justify-content:space-between}.text-button{border:0;background:transparent;color:var(--green);width:100%;padding:14px;cursor:pointer}.demo-note{font-size:14px;border-radius:15px;padding:12px 14px;background:#fff8e7;color:#74551d;border:1px solid #f1dfb7}.demo-note strong{margin-left:6px}
.app-shell{width:min(1100px,100%);margin:auto;min-height:100vh;background:var(--wash);box-shadow:0 0 50px rgba(13,54,48,.07)}
.topbar{height:76px;position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,4vw,36px);background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(216,231,226,.8)}
.top-actions{display:flex;gap:8px}.icon-button{position:relative;border:1px solid var(--line);background:#fff;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;cursor:pointer}.notification-button span{position:absolute;top:-5px;left:-4px;min-width:19px;height:19px;padding:0 4px;background:var(--red);color:#fff;border-radius:10px;font-size:11px;display:grid;place-items:center}
.content{padding:26px clamp(16px,4vw,38px) 110px;outline:0}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}.page-head h1{font-size:29px;margin-bottom:4px}.eyebrow{display:block;color:var(--green);font-size:14px;font-weight:700;margin-bottom:5px}.back-link{display:inline-flex;align-items:center;gap:7px;color:var(--green);font-weight:700;margin-bottom:14px}
.hero-card{position:relative;overflow:hidden;padding:28px;border-radius:28px;color:#fff;background:linear-gradient(140deg,#123f4c,#0f766e 70%,#38a777);box-shadow:var(--shadow)}.hero-card:after{content:"";position:absolute;width:210px;height:210px;border:35px solid rgba(255,255,255,.07);border-radius:50%;left:-70px;top:-95px}.hero-card h2{font-size:27px;margin-bottom:8px}.hero-card p{color:#d6efea;margin-bottom:18px}.hero-row{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px}.progress-ring{--progress:58;display:grid;place-items:center;width:108px;min-width:108px;height:108px;border-radius:50%;background:conic-gradient(#8df0bb calc(var(--progress)*1%),rgba(255,255,255,.2) 0);position:relative}.progress-ring:before{content:"";position:absolute;inset:9px;border-radius:50%;background:#145c58}.progress-ring strong,.progress-ring small{position:relative;display:block;text-align:center}.progress-ring strong{font-size:25px}.progress-ring small{font-size:11px;color:#d7eeea}
.alert-card{display:flex;gap:13px;align-items:flex-start;margin:16px 0;padding:16px;border-radius:18px;background:#fff7e7;border:1px solid #f0dba8}.alert-icon{width:38px;height:38px;border-radius:12px;background:#f5ca69;display:grid;place-items:center;flex:none}.alert-card strong,.alert-card span{display:block}.alert-card span{font-size:14px;color:#745b26;margin-top:2px}
.section{margin-top:24px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.section-title h2{font-size:21px;margin:0}.section-title a{color:var(--green);font-size:14px;font-weight:700}
.grid{display:grid;gap:14px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:var(--surface);border:1px solid #e4ece9;border-radius:var(--radius);padding:18px;box-shadow:0 6px 20px rgba(38,74,68,.04)}.card-link{display:block;transition:.2s}.card-link:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.card h3{font-size:18px;margin-bottom:7px}.card p{color:var(--muted);font-size:15px;margin-bottom:0}.card-row{display:flex;align-items:center;gap:13px}.card-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:var(--green-soft);font-size:22px;flex:none}.metric-card strong{display:block;font-size:26px;color:var(--ink)}.metric-card small{color:var(--muted)}.metric-card.green{border-top:3px solid var(--green-2)}.metric-card.blue{border-top:3px solid #3c8cc5}.metric-card.amber{border-top:3px solid var(--amber)}.metric-card.purple{border-top:3px solid var(--purple)}
.status-pill{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;background:var(--green-soft);color:var(--green);font-size:13px;font-weight:700}.status-pill.warning{background:#fff1cf;color:#8a5d09}.status-pill.neutral{background:#eef2f1;color:#62716e}.status-pill.danger{background:#ffe4e6;color:#a93743}
.timeline{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px}.timeline-item{position:relative;padding:0 34px 20px 0}.timeline-item:last-child{padding-bottom:0}.timeline-item:before{content:"";position:absolute;right:8px;top:15px;bottom:-3px;width:2px;background:var(--line)}.timeline-item:last-child:before{display:none}.timeline-dot{position:absolute;right:0;top:3px;width:18px;height:18px;border-radius:50%;background:#d9e3e0;border:4px solid #fff;box-shadow:0 0 0 1px #d9e3e0}.timeline-item.done .timeline-dot{background:var(--green-2);box-shadow:0 0 0 1px var(--green-2)}.timeline-item.active .timeline-dot{background:var(--amber);box-shadow:0 0 0 4px #fff0ca}.timeline-item h3{font-size:16px;margin:0}.timeline-item time{font-size:12px;color:var(--muted)}.timeline-item p{font-size:14px;color:var(--muted);margin:4px 0 0}
.menu-list{display:grid;gap:10px}.menu-item{display:flex;align-items:center;gap:13px;padding:15px;background:#fff;border:1px solid var(--line);border-radius:18px}.menu-item .menu-content{flex:1}.menu-item strong,.menu-item small{display:block}.menu-item small{color:var(--muted);margin-top:3px}.menu-item .arrow{color:var(--muted)}
.document-status{margin-right:auto}.motor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.motor-card{overflow:hidden;padding:0}.motor-art{height:150px;display:grid;place-items:center;font-size:77px;background:linear-gradient(145deg,#d7f2eb,#edf8f4)}.motor-art.blue{background:linear-gradient(145deg,#d8ecf5,#eaf6f8)}.motor-art.gray{background:linear-gradient(145deg,#e1e5e5,#f3f5f5)}.motor-body{padding:17px}.motor-body h3{font-size:20px;margin-bottom:0}.motor-body .brand-name{color:var(--muted);font-size:13px}.spec-row{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0}.spec{font-size:12px;background:var(--wash);border-radius:9px;padding:5px 8px}.price{font-size:22px;font-weight:700;color:var(--green)}.price small{font-size:12px}.compare-control{display:flex;align-items:center;gap:7px;font-size:13px;margin-top:10px}.compare-bar{position:sticky;bottom:85px;z-index:10;background:#173a53;color:#fff;padding:12px 16px;border-radius:18px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow);margin-top:15px}.compare-table{width:100%;border-collapse:collapse;background:#fff;border-radius:18px;overflow:hidden}.compare-table th,.compare-table td{padding:12px;border-bottom:1px solid var(--line);text-align:right}.compare-table th{background:var(--wash)}
.detail-list{display:grid;gap:0;background:#fff;border:1px solid var(--line);border-radius:18px;padding:4px 17px}.detail-row{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px dashed var(--line)}.detail-row:last-child{border:0}.detail-row span{color:var(--muted)}.detail-row strong{text-align:left}.action-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.empty-state{text-align:center;padding:50px 20px}.empty-state .big-icon{font-size:55px}.empty-state h2{margin:10px 0 4px}
.notification-item{display:flex;gap:13px;padding:16px;background:#fff;border:1px solid var(--line);border-radius:18px;margin-bottom:10px}.notification-item.unread{border-right:4px solid var(--green)}.notification-item p{font-size:14px;color:var(--muted);margin:3px 0}.notification-item time{font-size:12px;color:var(--muted)}
.profile-head{text-align:center;padding:25px}.avatar{width:84px;height:84px;margin:0 auto 12px;border-radius:28px;background:linear-gradient(145deg,var(--green),var(--green-2));display:grid;place-items:center;color:#fff;font-size:32px;font-family:"B Titr",Tahoma}.demo-badge{display:inline-block;background:#fff1c9;color:#805b0b;border-radius:18px;padding:4px 10px;font-size:12px}
.bottom-nav{position:fixed;z-index:30;bottom:0;left:50%;transform:translateX(-50%);width:min(1100px,100%);height:78px;padding:8px max(12px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);backdrop-filter:blur(16px)}.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#84918f;border-radius:13px;font-size:19px}.bottom-nav a small{font-size:12px}.bottom-nav a.active{color:var(--green);background:#eaf6f2}
.toast{position:fixed;z-index:200;bottom:95px;left:50%;transform:translateX(-50%);background:#173a53;color:#fff;border-radius:14px;padding:11px 18px;box-shadow:var(--shadow);font-size:14px}
.skeleton{min-height:90px;background:linear-gradient(90deg,#e8efed 25%,#f5f8f7 50%,#e8efed 75%);background-size:200% 100%;animation:loading 1.2s infinite;border-radius:18px}@keyframes loading{to{background-position:-200% 0}}
@media(max-width:820px){.login-page{grid-template-columns:minmax(0,1fr);overflow-x:hidden}.login-visual{display:none}.login-card{width:100%;max-width:460px;padding:30px 22px}.login-card h1{font-size:36px}.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}.motor-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){body{font-size:17px}.topbar{height:68px}.content{padding-top:18px}.grid-2,.grid-3{grid-template-columns:1fr}.hero-card{padding:21px}.hero-row{align-items:flex-start}.hero-card h2{font-size:22px}.progress-ring{width:90px;min-width:90px;height:90px}.motor-grid{grid-template-columns:1fr}.page-head h1{font-size:25px}.grid-4{gap:9px}.metric-card{padding:13px}.metric-card strong{font-size:21px}.metric-card small{font-size:12px}.detail-row{font-size:15px}.brand small{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}