/* Mobile-first corrections loaded last so every earlier theme stays responsive. */
html,body{max-width:100%;overflow-x:hidden}
img,canvas,video{max-width:100%}

@media(max-width:640px){
  .wrap{width:calc(100% - 28px);max-width:100%}
  header{position:relative}
  .nav{min-height:64px;gap:8px}
  .site-brand{min-width:0;gap:7px}
  .site-mark{flex:0 0 42px;width:42px;height:36px}
  .site-word{min-width:0;font-size:.62rem;line-height:1.02;column-gap:3px}
  .site-word small{font-size:.34rem;letter-spacing:.11em}
  .nav-right{flex:0 0 auto}
  .trust,.secure-dot,.mini-price{display:none}

  .hero{padding:28px 0 0}
  .hero-grid{display:flex;flex-direction:column;gap:28px}
  .hero-copy{width:100%;min-width:0}
  .hero .eyebrow{font-size:.61rem;letter-spacing:.1em;gap:7px}
  .hero .eyebrow span{width:20px}
  .hero h1{font-size:clamp(2.45rem,12.2vw,3.2rem);line-height:.94;letter-spacing:-.055em;margin:16px 0 18px;overflow-wrap:anywhere}
  .hero p{font-size:1rem;line-height:1.55;margin:0}
  .hero-actions{width:100%;margin-top:22px}
  .hero-actions .primary,.hero-actions a{width:100%}
  .start-order{min-width:0}
  .badges{display:grid;grid-template-columns:1fr;gap:9px;margin-top:22px}
  .badges span{width:auto}
  .hero-photo{width:100%;min-height:255px}
  .hero-photo img{width:100%;height:255px;border-radius:64px 14px 14px 14px;object-position:62% center}
  .hero-price{left:8px;right:8px;bottom:8px;padding:4px;border-radius:12px}
  .hero-price span{min-width:0;padding:8px 7px;font-size:.62rem}
  .hero-price b{font-size:.92rem}
  .steps{margin-top:28px;grid-template-columns:repeat(3,minmax(0,1fr))}
  .steps span{min-width:0;padding:14px 5px;font-size:.66rem;line-height:1.25;text-align:center}
  .steps b{display:block;margin:0 0 3px}

  .workspace,.rules,.plans,.safe-route{padding:42px 0}
  .tool{width:100%;padding:20px 16px;border-radius:16px}
  .tool-head{display:block;padding-bottom:18px}
  .tool h2,.rules h2,.plans h2,.safe-route-head h2{font-size:clamp(1.8rem,9vw,2.35rem);overflow-wrap:anywhere}
  .tool-head p{font-size:.94rem}
  .source-actions,.downloads{display:grid;grid-template-columns:1fr;gap:10px;margin:20px 0}
  .source-actions>*,.downloads>*{width:100%;min-width:0}
  button,.secondary{min-height:54px;padding:13px 14px;font-size:.94rem;white-space:normal}
  .upload-meta{display:block;margin-top:-6px}
  .upload-meta span{display:block;margin-top:3px}
  .privacy-note{align-items:flex-start;padding:13px}
  .camera-panel{padding:12px}
  .camera-live-layout{display:block}
  .camera-frame{width:100%;max-height:62vh}
  .camera-guidance{margin-top:14px;padding:14px;text-align:left}
  .editor,.result{display:block;margin-top:24px}
  .controls{margin-top:22px}
  .result{padding:18px}
  .result canvas{display:block;width:min(180px,100%);margin:20px auto 0}
  .proof-watermark{max-width:88%;padding:7px 10px;font-size:.82rem;letter-spacing:.1em}

  .rules-head,.plans-head,.safe-route-head{display:block}
  .rule-grid,.delivery-grid,.safe-route-grid{grid-template-columns:1fr;gap:14px}
  .rule-grid article,.delivery-grid article,.safe-route-grid article{padding:20px 18px}
  .popular{position:static;display:inline-block;margin-bottom:10px}
  .order-note{padding:16px}
  .legal{padding:16px;font-size:.9rem}
  footer .wrap{overflow-wrap:anywhere}
}

@media(max-width:360px){
  .wrap{width:calc(100% - 20px)}
  .site-word{font-size:.56rem}
  .hero h1{font-size:2.25rem}
  .tool{padding:17px 12px}
}