:root{
  --black:#111214;--black2:#1a1c20;--red:#8b3131;--red2:#b14949;
  --white:#fff;--bg:#f4f5f7;--card:#fff;--text:#17191d;--muted:#6f7580;
  --line:#dde1e7;--ok:#087a50;--danger:#b42318;--radius:22px;
  --shadow:0 18px 50px rgba(17,18,20,.12);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:linear-gradient(180deg,#111214 0,#1c1f24 260px,var(--bg) 260px)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.topbar{position:sticky;top:0;z-index:30;background:rgba(17,18,20,.95);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(12px)}
.topbar-inner{max-width:1040px;margin:auto;padding:13px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;color:white}
.brand{display:flex;align-items:center;gap:12px}
.brandmark{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--red),var(--red2));font-weight:900;font-size:18px;box-shadow:0 10px 25px rgba(139,49,49,.35)}
.brand strong,.brand span{display:block}.brand span{font-size:12px;color:#cbd0d8;margin-top:2px}
.save-state{font-size:12px;color:#cbd0d8}
.app{width:min(1040px,100%);margin:auto;padding:22px 18px 120px}
.hero{color:white;padding:20px 2px 26px}
.eyebrow{font-size:12px;font-weight:900;letter-spacing:.16em;color:#d7a8a8;margin:0 0 10px}
.hero h1{margin:0;font-size:clamp(28px,5vw,48px);line-height:1.05;letter-spacing:-.04em;max-width:760px}
.hero p:last-child{max-width:680px;color:#cbd0d8;line-height:1.55}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:14px}
.step{border:1px solid rgba(255,255,255,.12);background:#24272d;color:#aeb4be;border-radius:16px;padding:10px 8px;display:flex;align-items:center;justify-content:center;gap:8px}
.step span{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#343840;font-weight:900;font-size:12px}
.step b{font-size:12px}.step.active{background:white;color:var(--black);border-color:white}.step.active span{background:var(--red);color:white}.step.done{color:white}.step.done span{background:var(--ok);color:white}
.panel{display:none;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.panel.active{display:block}
.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}
.panel-head small{display:block;color:var(--muted);font-weight:800;margin-bottom:3px}.panel-head h2{margin:0;font-size:24px;letter-spacing:-.03em}
.tag{background:#f6e8e8;color:var(--red);border:1px solid #ead0d0;padding:7px 10px;border-radius:999px;font-weight:900;font-size:11px;white-space:nowrap}
.grid{display:grid;gap:13px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
label{display:block;color:#5b626e;font-weight:800;font-size:12px}
input,select,textarea{width:100%;margin-top:7px;border:1px solid var(--line);border-radius:14px;background:#fbfcfd;color:var(--text);padding:13px 14px;min-height:49px;outline:none}
textarea{min-height:105px;resize:vertical}
input:focus,select:focus,textarea:focus{background:white;border-color:var(--red);box-shadow:0 0 0 4px rgba(139,49,49,.12)}
input.invalid,select.invalid,textarea.invalid{border-color:var(--danger);box-shadow:0 0 0 4px rgba(180,35,24,.1)}
h3{font-size:16px;margin:22px 0 12px}
.block{margin-top:14px}.hint{color:var(--muted);font-size:13px;margin:-6px 0 14px}
.quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.quick-item{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:15px;padding:12px;background:#fbfcfd}
.quick-item span{font-size:13px;font-weight:800}.switch{position:relative;width:44px;height:25px;flex:0 0 auto}.switch input{position:absolute;opacity:0}.switch i{display:block;width:44px;height:25px;background:#cfd4dc;border-radius:99px;transition:.2s}.switch i:after{content:"";display:block;width:19px;height:19px;background:white;border-radius:50%;margin:3px;transition:.2s;box-shadow:0 2px 6px rgba(0,0,0,.22)}.switch input:checked+i{background:var(--ok)}.switch input:checked+i:after{transform:translateX(19px)}
.inspection-list{display:grid;gap:10px}
.inspection{border:1px solid var(--line);border-radius:17px;padding:13px;background:#fbfcfd}
.inspection-top{display:flex;align-items:center;gap:12px}.inspection-text{flex:1}.inspection-text strong{display:block;font-size:14px}.inspection-text span{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.status{display:flex;gap:6px}.status button{border:1px solid var(--line);background:white;border-radius:999px;padding:8px 10px;font-size:12px;font-weight:900;color:var(--muted)}.status button.good.active{background:#ecfdf3;border-color:#a6dfc5;color:var(--ok)}.status button.bad.active{background:#fff1f0;border-color:#f3b2ac;color:var(--danger)}
.inspection-note{display:none;margin-top:10px}.inspection.bad-selected .inspection-note{display:block}
.damage-switch{border:1px solid var(--line);border-radius:17px;padding:14px;background:#fbfcfd;display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}.damage-switch strong,.damage-switch span{display:block}.damage-switch span{color:var(--muted);font-size:12px;margin-top:3px}
.segmented{display:flex;background:#eceff3;border-radius:12px;padding:3px}.segmented button{border:0;background:transparent;border-radius:9px;padding:9px 15px;font-weight:900;color:var(--muted)}.segmented button.active{background:white;color:var(--black);box-shadow:0 3px 10px rgba(0,0,0,.1)}.segmented button[data-damage="yes"].active{background:var(--red);color:white}
.photo-card{border:1px solid var(--line);border-radius:18px;padding:14px;background:#fbfcfd;margin-top:12px}.photo-card h3{margin:0 0 4px}.photo-card p{margin:0 0 12px;color:var(--muted);font-size:12px}
.photo-button{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;border:1px dashed #9ea6b1;border-radius:14px;background:white;color:var(--black);font-weight:900}
.photo-input{position:absolute;left:-9999px}.thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:10px}.thumb{position:relative}.thumb img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;border:1px solid var(--line)}.remove-photo{position:absolute;right:5px;top:5px;width:27px;height:27px;border:0;border-radius:50%;background:rgba(17,18,20,.8);color:white;font-weight:900}
.notice{border-radius:16px;padding:13px 14px;margin:14px 0}.notice strong,.notice span{display:block}.notice span{font-size:12px;margin-top:3px}.danger-notice{background:#fff1f0;border:1px solid #f4b7b1;color:var(--danger)}
.confirm{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--line);border-radius:16px;padding:14px;background:#fbfcfd}.confirm input{width:23px;height:23px;margin:0;accent-color:var(--red);flex:0 0 auto}.confirm span{font-size:13px;color:var(--text)}
.signature-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.signature-grid h3{margin:0 0 8px}
.signature-wrap{border:1px solid var(--line);border-radius:17px;background:white;overflow:hidden;margin-top:10px}.signature-wrap canvas{display:block;width:100%;height:230px;touch-action:none;background:linear-gradient(transparent 88%,#e7e9ed 88%);background-size:100% 58px}.clear{width:100%;border:0;border-top:1px solid var(--line);background:#f7f8fa;color:var(--danger);padding:10px;font-size:12px;font-weight:900}
.summary-box{margin-top:16px;border-radius:17px;background:#15171b;color:white;padding:16px;display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.summary-box div{background:#202329;border-radius:12px;padding:10px}.summary-box b{display:block;color:#aeb4be;font-size:10px;text-transform:uppercase;margin-bottom:4px}.summary-box span{font-size:13px}
.actionbar{position:sticky;bottom:0;z-index:20;display:grid;grid-template-columns:1fr 2fr;gap:10px;padding:20px 0 4px;background:linear-gradient(180deg,rgba(244,245,247,0),var(--bg) 18px)}
.btn{border:0;border-radius:15px;min-height:54px;padding:13px 16px;font-weight:900}.btn.primary{background:linear-gradient(135deg,var(--red),var(--red2));color:white;box-shadow:0 12px 24px rgba(139,49,49,.25)}.btn.ghost{background:white;border:1px solid var(--line);color:var(--black)}
.reset-link{display:block;margin:17px auto 0;border:0;background:none;color:#6e747e;text-decoration:underline;font-weight:800}
.hidden{display:none!important}.toast{position:fixed;left:50%;bottom:90px;transform:translate(-50%,20px);opacity:0;background:#111214;color:white;border-radius:14px;padding:12px 16px;font-weight:800;font-size:13px;z-index:100;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
#pdfView{position:absolute;left:-99999px;top:0;width:794px;background:white;padding:38px;color:#181a1f}
.pdf-head{background:#14161a;color:white;padding:24px;border-radius:20px;display:flex;justify-content:space-between;align-items:flex-start}.pdf-head h2{margin:0;font-size:24px}.pdf-head p{margin:5px 0 0;color:#cbd0d8}.pdf-logo{width:62px;height:62px;border-radius:18px;background:var(--red);display:grid;place-items:center;font-weight:900;font-size:22px}
.pdf-section{border:1px solid #dfe3e8;border-radius:16px;padding:15px;margin-top:14px;break-inside:avoid}.pdf-section h3{margin:0 0 10px;color:#8b3131}.pdf-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pdf-field{border:1px solid #e5e8ec;background:#f8f9fb;border-radius:10px;padding:9px;min-height:44px}.pdf-field b{display:block;font-size:9px;color:#6d7480;text-transform:uppercase;margin-bottom:3px}.pdf-checks{display:grid;grid-template-columns:1fr 1fr;gap:7px}.pdf-check{border:1px solid #e5e8ec;border-radius:10px;padding:8px;font-size:11px}.pdf-photo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.pdf-photo-grid img{width:100%;height:150px;object-fit:cover;border-radius:10px;border:1px solid #dfe3e8}.pdf-sign-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.pdf-signature{width:100%;height:120px;object-fit:contain;border:1px solid #dfe3e8;border-radius:10px;margin-top:7px}
@media(max-width:760px){
  body{background:linear-gradient(180deg,#111214 0,#1c1f24 210px,var(--bg) 210px)}
  .topbar-inner{padding:10px 12px}.save-state{display:none}.brandmark{width:42px;height:42px}
  .app{padding:14px 12px 115px}.hero{padding:13px 1px 20px}.hero h1{font-size:29px}.hero p:last-child{font-size:14px}
  .steps{overflow-x:auto;grid-template-columns:repeat(5,minmax(92px,1fr));padding-bottom:3px}.step{padding:9px 6px}
  .panel{padding:15px;border-radius:19px}.panel-head h2{font-size:21px}.grid.two,.signature-grid{grid-template-columns:1fr}.quick-grid{grid-template-columns:1fr 1fr}
  .inspection-top{align-items:flex-start;flex-wrap:wrap}.status{width:100%}.status button{flex:1;min-height:43px}
  .damage-switch{align-items:stretch;flex-direction:column}.segmented button{flex:1}.segmented{display:grid;grid-template-columns:1fr 1fr}
  .thumbs{grid-template-columns:repeat(2,1fr)}.signature-wrap canvas{height:270px}.summary-box{grid-template-columns:1fr}
  .actionbar{position:fixed;left:0;right:0;bottom:0;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(244,245,247,.96);border-top:1px solid var(--line);backdrop-filter:blur(10px)}
}
@media(max-width:390px){.quick-grid{grid-template-columns:1fr}.steps{grid-template-columns:repeat(5,minmax(82px,1fr))}.step b{font-size:11px}}
