:root{
  --bg:#F7EFF2;
  --surface:#FFFFFF;
  --ink:#241019;
  --muted:#7A5A66;
  --primary:#8E1B45;
  --primary-dark:#5C1230;
  --primary-light:#F7E5EC;
  --accent:#B7893A;
  --accent-light:#F6EBD8;
  --line:#EAD9E0;
  --success:#2F7D5C;
  --danger:#B23A2E;
  --radius:14px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'Vazirmatn','Tahoma','Segoe UI',sans-serif;
  color:var(--ink);
  background:var(--bg);
  min-height:100vh;
  padding:28px 14px 60px;
}
.wrap{max-width:620px;margin:0 auto;}

.card{
  background:var(--surface);
  border-radius:var(--radius);
  box-shadow:0 1px 3px rgba(16,33,31,.06), 0 8px 24px rgba(16,33,31,.05);
  overflow:hidden;
  margin-bottom:18px;
}
.header{
  position:relative;
  background:linear-gradient(135deg,var(--primary-dark),var(--primary));
  color:#fff;
  padding:26px 22px 20px;
}
.barcode-strip{
  position:absolute;inset:0;opacity:.16;
  background-image:repeating-linear-gradient(90deg,
    #fff 0 2px, transparent 2px 5px,
    #fff 5px 6px, transparent 6px 12px,
    #fff 12px 15px, transparent 15px 20px,
    #fff 20px 21px, transparent 21px 27px);
  mix-blend-mode:overlay;
}
.header-content{position:relative;z-index:1;}
.eyebrow{font-size:12px;letter-spacing:.5px;opacity:.85;margin:0 0 6px;font-weight:500;}
.header h1{margin:0;font-size:21px;font-weight:700;}
.header p{margin:8px 0 0;font-size:13px;opacity:.85;line-height:1.7;}
.stat-row{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap;}
.stat-pill{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:5px 13px;font-size:12px;}
.stat-pill b{font-weight:700;}

.section{padding:20px 22px;}
.section + .section{border-top:1px solid var(--line);}
.section-label{font-size:13px;font-weight:700;color:var(--primary-dark);margin:0 0 12px;display:flex;align-items:center;gap:6px;}

.dropzone{border:1.5px dashed #D9B9C6;border-radius:10px;padding:18px;text-align:center;background:var(--primary-light);cursor:pointer;transition:.15s;}
.dropzone:hover{border-color:var(--primary);}
.dropzone input{display:none;}
.dropzone-icon{font-size:22px;margin-bottom:6px;}
.dropzone-text{font-size:13.5px;color:var(--primary-dark);font-weight:600;}
.dropzone-sub{font-size:11.5px;color:var(--muted);margin-top:3px;}

.upload-msg{margin-top:10px;font-size:12.5px;border-radius:8px;padding:9px 12px;display:none;}
.upload-msg.show{display:block;}
.upload-msg.ok{background:#E7F3EC;color:var(--success);}
.upload-msg.err{background:#FBEAE8;color:var(--danger);}

.seg{display:flex;background:var(--primary-light);border-radius:10px;padding:4px;gap:4px;margin-bottom:12px;}
.seg button{flex:1;border:none;background:transparent;padding:9px 6px;border-radius:7px;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;transition:.12s;}
.seg button.active{background:var(--surface);color:var(--primary-dark);box-shadow:0 1px 2px rgba(0,0,0,.08);}

.search-row{display:flex;gap:8px;}
.search-row input, .form-row input{flex:1;border:1.5px solid var(--line);border-radius:9px;padding:11px 13px;font-family:inherit;font-size:14px;background:var(--surface);color:var(--ink);outline:none;transition:.12s;}
.search-row input:focus, .form-row input:focus{border-color:var(--primary);}
.search-row button, .form-row button, .btn-primary{border:none;background:var(--primary);color:#fff;border-radius:9px;padding:0 18px;font-family:inherit;font-weight:700;font-size:13.5px;cursor:pointer;}
.search-row button:hover, .form-row button:hover, .btn-primary:hover{background:var(--primary-dark);}

.results{margin-top:16px;display:flex;flex-direction:column;gap:12px;}
.empty-hint{font-size:12.5px;color:var(--muted);text-align:center;padding:20px 10px;}

.stub{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface);}
.stub-top{padding:13px 15px 11px;}
.stub-name{font-size:14.5px;font-weight:700;color:var(--ink);}
.stub-meta{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:6px;font-size:12px;color:var(--muted);}
.stub-meta span b{color:var(--ink);font-weight:600;}
.status-badge{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px;background:var(--primary-light);color:var(--primary-dark);}

.perforation{position:relative;height:0;border-top:1.5px dashed #DCC3CD;margin:0 14px;}
.perforation::before,.perforation::after{content:"";position:absolute;top:-7px;width:14px;height:14px;background:var(--bg);border-radius:50%;}
.perforation::before{right:-21px;}
.perforation::after{left:-21px;}

.stub-bottom{padding:12px 15px 14px;background:var(--accent-light);display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;}
.track-label{font-size:10.5px;color:#7A5A22;font-weight:700;letter-spacing:.3px;}
.track-code{font-family:'Courier New',monospace;font-size:15px;letter-spacing:1.5px;font-weight:700;color:var(--accent);direction:ltr;unicode-bidi:isolate;}
.phone-masked{font-family:'Courier New',monospace;font-size:13px;letter-spacing:1px;color:var(--muted);direction:ltr;unicode-bidi:isolate;}
.track-actions{display:flex;gap:8px;flex-wrap:wrap;}
.copy-btn{border:1px solid #D9B37D;background:#fff;color:var(--accent);font-size:11px;font-weight:700;border-radius:7px;padding:6px 11px;cursor:pointer;font-family:inherit;white-space:nowrap;}
.copy-btn:hover{background:var(--accent);color:#fff;}
.tipax-btn{border:none;background:var(--primary);color:#fff;font-size:11px;font-weight:700;border-radius:7px;padding:6px 11px;cursor:pointer;font-family:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:4px;white-space:nowrap;}
.tipax-btn:hover{background:var(--primary-dark);}
.track-hint{font-size:10.5px;color:var(--muted);margin-top:6px;}

.footer-row{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;font-size:11.5px;color:var(--muted);flex-wrap:wrap;gap:8px;}
.reset-link{color:var(--danger);background:none;border:none;font-family:inherit;font-size:11.5px;cursor:pointer;text-decoration:underline;}
.link-muted{color:var(--muted);font-size:11.5px;text-decoration:none;}

.login-box{padding:32px 22px;text-align:center;}
.login-box .form-row{display:flex;gap:8px;margin-top:16px;}
.login-icon{font-size:28px;margin-bottom:8px;}
.login-msg{margin-top:12px;font-size:12.5px;color:var(--danger);display:none;}
.login-msg.show{display:block;}

/* ---- Responsive ---- */
@media (max-width:480px){
  body{padding:16px 8px 40px;}
  .header{padding:20px 16px 16px;}
  .header h1{font-size:18px;}
  .header p{font-size:12.5px;}
  .section{padding:16px 16px;}
  .search-row{flex-direction:column;}
  .search-row button{padding:11px 18px;}
  .login-box .form-row{flex-direction:column;}
  .login-box .form-row button{padding:11px 18px;}
  .seg button{font-size:11.5px;padding:8px 4px;}
  .stub-bottom{flex-direction:column;align-items:stretch;}
  .track-actions .copy-btn, .track-actions .tipax-btn{flex:1;justify-content:center;}
  .footer-row{flex-direction:column;align-items:flex-start;}
}
@media (max-width:360px){
  .header h1{font-size:16.5px;}
  .track-code{font-size:13.5px;letter-spacing:1px;}
}