:root{
    --artax-green:#76b31e;
    --artax-green-dark:#5f9117;
    --ink:#111111;
    --ink-soft:#5a5a5a;
    --paper:#ffffff;
    --paper-soft:#f4f4f4;
    --paper-soft2:#f2f2f2;
    --line:#e2e2e2;
    --err:#c8402f;
    --err-bg:#fdedea;
    --warn:#b9790a;
    --warn-bg:#fdf3e0;
    --ok:#1f8a3b;
    --ok-bg:#e9f7ec;
    --radius:10px;
  }
  *{box-sizing:border-box;}
  body{
    margin:0;
    font-family:'din-2014', Arial, sans-serif;
    color:var(--ink);
    background:var(--paper);
    line-height:1.5;
  }
  h1,h2,h3{
    font-family:'din-2014', Arial, sans-serif;
    margin:0;
  }
  main{max-width:920px;margin:0 auto;padding:56px 24px 96px;}

  .hero{margin-bottom:40px;}
  .hero h1{font-size:32px;font-weight:700;color:var(--ink);max-width:640px;}
  .hero p{font-size:16px;color:var(--ink-soft);max-width:560px;margin-top:12px;}

  .panel{
    background:var(--paper-soft2);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:28px;
    margin-bottom:24px;
  }

  .dropzone{
    border:2px dashed #c7c7c7;
    border-radius:var(--radius);
    background:var(--paper);
    padding:40px 20px;
    text-align:center;
    cursor:pointer;
    transition:border-color .15s ease, background .15s ease;
  }
  .dropzone:hover, .dropzone.drag{
    border-color:var(--artax-green);
    background:#f5faee;
  }
  .dropzone input{display:none;}
  .dropzone .dz-title{font-weight:700;font-size:15px;margin-bottom:4px;}
  .dropzone .dz-sub{font-size:13px;color:var(--ink-soft);}
  .dropzone .dz-icon{font-size:28px;margin-bottom:10px;}

  .filename{
    margin-top:14px;
    font-size:14px;
    font-weight:700;
    display:none;
    align-items:center;
    gap:8px;
  }
  .filename.show{display:flex;}

  button.primary{
    margin-top:18px;
    background:var(--artax-green);
    color:#fff;
    border:2px solid var(--artax-green);
    border-radius:12px 12px 0px 12px;
    padding:17px 24px;
    font-family:inherit;
    font-weight:400;
    font-size:20px;
    cursor:pointer;
    text-align:center;
    min-width:220px;
    transition:background-color .2s, color .3s;
  }
  button.primary:hover{background:#fff;color:#111;}
  button.primary:disabled{background:#c7c7c7;border-color:#c7c7c7;color:#fff;cursor:not-allowed;}

  .status-line{
    display:none;
    align-items:center;
    gap:10px;
    margin-top:16px;
    font-size:14px;
    color:var(--ink-soft);
  }
  .status-line.show{display:flex;}
  .spinner{
    width:16px;height:16px;
    border:2px solid var(--line);
    border-top-color:var(--artax-green);
    border-radius:50%;
    animation:spin .7s linear infinite;
  }
  @keyframes spin{to{transform:rotate(360deg);}}

  section.results{display:none;}
  section.results.show{display:block;}

  .detected-row{
    display:flex;
    gap:24px;
    flex-wrap:wrap;
    margin-bottom:20px;
    font-size:14px;
    color:var(--ink-soft);
  }
  .detected-row b{color:var(--ink);}

  .summary-bar{
    display:flex;
    gap:12px;
    margin-bottom:24px;
  }
  .summary-chip{
    flex:1;
    border-radius:var(--radius);
    padding:16px 18px;
    display:flex;
    flex-direction:column;
    gap:4px;
  }
  .summary-chip .n{font-size:26px;font-weight:700;}
  .summary-chip .l{font-size:12px;font-weight:700;color:var(--ink-soft);}
  .summary-chip.err{background:var(--err-bg);}
  .summary-chip.err .n{color:var(--err);}
  .summary-chip.warn{background:var(--warn-bg);}
  .summary-chip.warn .n{color:var(--warn);}
  .summary-chip.ok{background:var(--ok-bg);}
  .summary-chip.ok .n{color:var(--ok);}

  .check{
    display:flex;
    gap:16px;
    padding:18px 20px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    margin-bottom:12px;
    background:var(--paper);
  }
  .check .badge{
    flex-shrink:0;
    width:28px;height:28px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    font-size:14px;
    color:#fff;
    margin-top:2px;
  }
  .check.err .badge{background:var(--err);}
  .check.warn .badge{background:var(--warn);}
  .check.ok .badge{background:var(--ok);}
  .check .body h3{font-size:15px;font-weight:700;margin-bottom:4px;}
  .check .body p{font-size:14px;color:var(--ink-soft);margin:0;}

  .disclaimer{
    margin-top:28px;
    padding:16px 20px;
    background:var(--paper-soft2);
    border-radius:var(--radius);
    font-size:13px;
    color:var(--ink-soft);
  }

  .cta-row{
    margin-top:28px;
    display:flex;
    align-items:center;
    gap:16px;
    flex-wrap:wrap;
  }
  button.secondary{
    background:#fff;
    color:#111;
    border:2px solid var(--artax-green);
    border-radius:12px 12px 0px 12px;
    padding:17px 24px;
    font-family:inherit;
    font-weight:400;
    font-size:20px;
    cursor:pointer;
    text-align:center;
    min-width:220px;
    transition:background-color .2s, color .3s;
  }
  button.secondary:hover{background:var(--artax-green);color:#fff;}

  .logo-bar{
    margin-bottom:8px;
  }
  .logo-img{
    height:48px;
    width:auto;
  }

  .hero h1.specialHeading2{
    font-family:'shelbyCZ', 'din-2014', sans-serif;
    font-weight:400;
    font-size:44px;
    line-height:1.2;
  }
