/* ================================================================
   Sarkari Negative Marking Calculator — Styles
   ================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

.snm-wrap {
  --snm-purple:   #7C3AED;
  --snm-purple-d: #6D28D9;
  --snm-purple-l: #F5F3FF;
  --snm-purple-m: #EDE9FE;
  --snm-green:    #16A34A;
  --snm-green-l:  #DCFCE7;
  --snm-green-m:  #BBF7D0;
  --snm-red:      #DC2626;
  --snm-red-l:    #FEE2E2;
  --snm-red-m:    #FECACA;
  --snm-amber:    #D97706;
  --snm-amber-l:  #FEF3C7;
  --snm-gray-50:  #F9FAFB;
  --snm-gray-100: #F3F4F6;
  --snm-gray-200: #E5E7EB;
  --snm-gray-300: #D1D5DB;
  --snm-gray-400: #9CA3AF;
  --snm-gray-500: #6B7280;
  --snm-gray-600: #4B5563;
  --snm-gray-700: #374151;
  --snm-gray-800: #1F2937;
  --snm-radius:   14px;
  --snm-radius-sm:9px;
  --snm-shadow:   0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.04);

  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px;
  color: var(--snm-gray-800);
  max-width: 680px;
  margin: 0 auto;
  padding: 0 0 2rem;
  box-sizing: border-box;
}
.snm-wrap *,.snm-wrap *::before,.snm-wrap *::after{box-sizing:border-box}

/* Header */
.snm-header{display:flex;align-items:center;gap:12px;padding:1.25rem 0 1rem;border-bottom:1.5px solid var(--snm-gray-100);margin-bottom:1.25rem}
.snm-title{font-size:20px!important;font-weight:700!important;color:var(--snm-gray-800)!important;margin:0 0 2px!important;padding:0!important;line-height:1.2!important;border:none!important}
.snm-sub{font-size:13px!important;color:var(--snm-gray-500)!important;margin:0!important;padding:0!important;line-height:1.4!important}

/* Section label */
.snm-section-label{font-size:11px;font-weight:600;color:var(--snm-gray-400);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}

/* Exam Grid */
.snm-exam-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(106px,1fr));gap:6px;margin-bottom:1.25rem}
.snm-exam-btn{display:flex;flex-direction:column;align-items:center;padding:8px 6px;border-radius:var(--snm-radius-sm);border:1.5px solid var(--snm-gray-200);background:white;cursor:pointer;font-family:inherit;gap:3px;transition:all .15s;text-align:center}
.snm-exam-btn:hover{border-color:var(--snm-purple);background:var(--snm-purple-l)}
.snm-exam-btn.active{border-color:var(--snm-purple);background:var(--snm-purple-l);box-shadow:0 0 0 3px rgba(124,58,237,.12)}
.snm-exam-name{font-size:12px;font-weight:700;color:var(--snm-gray-800)}
.snm-exam-btn.active .snm-exam-name{color:var(--snm-purple-d)}
.snm-exam-scheme{font-size:10px;color:var(--snm-purple);font-weight:600}
.snm-exam-btn:not(.active) .snm-exam-scheme{color:var(--snm-gray-400)}

/* Main Card */
.snm-card{background:white;border-radius:var(--snm-radius);border:1px solid var(--snm-gray-200);padding:1.25rem;box-shadow:var(--snm-shadow)}

/* Scheme Row */
.snm-scheme-row{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:end;gap:8px;margin-bottom:1.25rem;padding:14px;background:var(--snm-gray-50);border-radius:var(--snm-radius-sm);border:1px solid var(--snm-gray-100)}
.snm-scheme-box{display:flex;flex-direction:column;gap:5px}
.snm-scheme-label{font-size:11px;font-weight:600;color:var(--snm-gray-500);display:flex;align-items:center;gap:4px;text-transform:uppercase;letter-spacing:.04em}
.snm-scheme-input{padding:8px 10px;border-radius:7px;border:1.5px solid var(--snm-gray-200);font-family:inherit;font-size:16px;font-weight:700;color:var(--snm-gray-800);background:white;outline:none;width:100%;text-align:center;transition:border-color .15s}
.snm-scheme-input:focus{border-color:var(--snm-purple);box-shadow:0 0 0 3px rgba(124,58,237,.1)}
.correct .snm-scheme-input:focus{border-color:var(--snm-green)}
.wrong   .snm-scheme-input:focus{border-color:var(--snm-red)}
.snm-scheme-divider{font-size:18px;font-weight:800;color:var(--snm-gray-300);padding-bottom:8px;text-align:center}

/* Sections */
.snm-sections-wrap{margin-bottom:1rem;border:1px solid var(--snm-gray-200);border-radius:var(--snm-radius-sm);overflow:hidden}
.snm-sections-label{padding:8px 14px;background:var(--snm-gray-50);font-size:11px;font-weight:600;color:var(--snm-gray-500);text-transform:uppercase;letter-spacing:.04em;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--snm-gray-100)}
.snm-sections-hint{font-size:10px;color:var(--snm-gray-400);font-weight:400;text-transform:none;letter-spacing:0}
.snm-section-tabs{display:flex;gap:0;padding:8px 10px;border-bottom:1px solid var(--snm-gray-100);flex-wrap:wrap;gap:4px}
.snm-sec-tab{padding:4px 12px;border-radius:20px;border:1px solid var(--snm-gray-200);background:white;font-family:inherit;font-size:11px;font-weight:600;color:var(--snm-gray-600);cursor:pointer;transition:all .12s}
.snm-sec-tab.active{background:var(--snm-purple);color:white;border-color:var(--snm-purple)}
.snm-section-panels{padding:12px 14px}
.snm-sec-panel{display:none}
.snm-sec-panel.active{display:block}
.snm-sec-name{font-size:12px;font-weight:700;color:var(--snm-gray-700);margin-bottom:10px}
.snm-sec-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}

/* Overall Wrap */
.snm-overall-wrap{margin-bottom:1.25rem}
.snm-overall-label{font-size:11px;font-weight:600;color:var(--snm-gray-500);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px;display:flex;align-items:center;gap:5px}
.snm-input-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:12px}
.snm-input-col{display:flex;flex-direction:column;align-items:center;gap:6px}
.snm-counter-label{font-size:11px;font-weight:600;display:flex;align-items:center;gap:4px}
.correct-col .snm-counter-label{color:var(--snm-green)}
.wrong-col   .snm-counter-label{color:var(--snm-red)}
.skipped-col .snm-counter-label{color:var(--snm-gray-400)}
.snm-counter-wrap{display:flex;align-items:center;gap:0;border:1.5px solid var(--snm-gray-200);border-radius:8px;overflow:hidden;width:100%}
.snm-counter-btn{width:36px;height:40px;border:none;background:var(--snm-gray-100);font-size:18px;font-weight:700;color:var(--snm-gray-600);cursor:pointer;transition:all .12s;flex-shrink:0;display:flex;align-items:center;justify-content:center;user-select:none}
.snm-counter-btn:hover{background:var(--snm-gray-200);color:var(--snm-gray-800)}
.snm-counter-btn:active{transform:scale(.94)}
.correct-col .snm-counter-btn.plus:hover{background:var(--snm-green-m);color:var(--snm-green)}
.wrong-col   .snm-counter-btn.plus:hover{background:var(--snm-red-m);color:var(--snm-red)}
.snm-counter-input{flex:1;min-width:0;border:none;text-align:center;font-family:inherit;font-size:18px;font-weight:800;color:var(--snm-gray-800);background:white;outline:none;padding:6px 0;-moz-appearance:textfield}
.snm-counter-input::-webkit-outer-spin-button,.snm-counter-input::-webkit-inner-spin-button{-webkit-appearance:none}
.correct-col .snm-counter-input{color:var(--snm-green)}
.wrong-col   .snm-counter-input{color:var(--snm-red)}
.snm-counter-marks{font-size:13px;font-weight:700}
.correct-marks{color:var(--snm-green)}
.wrong-marks{color:var(--snm-red)}
.skipped-marks{color:var(--snm-gray-400)}

/* Attempted bar */
.snm-attempted-row{display:flex;align-items:center;gap:8px}
.snm-attempted-label{font-size:12px;color:var(--snm-gray-500);white-space:nowrap;min-width:150px}
.snm-attempted-label strong{color:var(--snm-gray-800)}
.snm-attempt-bar-wrap{flex:1;height:6px;background:var(--snm-gray-100);border-radius:99px;overflow:hidden}
.snm-attempt-bar{height:100%;background:var(--snm-purple);border-radius:99px;transition:width .3s ease}
.snm-attempt-pct{font-size:12px;font-weight:700;color:var(--snm-purple);min-width:36px;text-align:right}

/* Score Display */
.snm-score-display{background:var(--snm-purple-l);border:2px solid var(--snm-purple-m);border-radius:var(--snm-radius);padding:1.25rem;margin-bottom:1rem;text-align:center}
.snm-score-label{font-size:11px;font-weight:600;color:var(--snm-purple-d);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.snm-score-number{font-size:52px;font-weight:800;color:var(--snm-purple-d);line-height:1;margin-bottom:4px;transition:all .2s}
.snm-score-number.negative{color:var(--snm-red)}
.snm-score-number.positive{color:var(--snm-green)}
.snm-score-outof{font-size:13px;color:var(--snm-purple);margin-bottom:1rem}
.snm-score-breakdown{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.snm-score-item{display:flex;flex-direction:column;align-items:center;gap:2px}
.snm-score-item-val{font-size:18px;font-weight:800}
.snm-score-item-lbl{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--snm-gray-500)}
.correct-item .snm-score-item-val{color:var(--snm-green)}
.wrong-item   .snm-score-item-val{color:var(--snm-red)}
.net-item     .snm-score-item-val{color:var(--snm-purple-d)}
.snm-score-sep{font-size:20px;font-weight:700;color:var(--snm-gray-300)}

/* Stats Grid */
.snm-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:1rem}
.snm-stat-card{background:var(--snm-gray-50);border-radius:var(--snm-radius-sm);padding:10px 8px;text-align:center;border:1px solid var(--snm-gray-100)}
.snm-stat-val{font-size:18px;font-weight:800;color:var(--snm-gray-800);line-height:1.1}
.snm-stat-lbl{font-size:10px;color:var(--snm-gray-500);margin-top:3px;line-height:1.2}

/* What if */
.snm-whatif{background:var(--snm-amber-l);border:1px solid #FDE68A;border-radius:var(--snm-radius-sm);padding:12px 14px;margin-bottom:1rem}
.snm-whatif-title{font-size:12px;font-weight:700;color:var(--snm-amber);margin-bottom:10px;display:flex;align-items:center;gap:6px;text-transform:uppercase;letter-spacing:.04em}
.snm-whatif-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--snm-gray-700);margin-bottom:6px}
.snm-whatif-row:last-child{margin-bottom:0}
.snm-wi-input{width:64px;padding:4px 8px;border-radius:6px;border:1.5px solid #FDE68A;font-family:inherit;font-size:13px;font-weight:700;color:var(--snm-gray-800);background:white;outline:none;text-align:center}
.snm-wi-input:focus{border-color:var(--snm-amber)}
.snm-wi-result{font-size:13px;font-weight:700;color:var(--snm-amber);white-space:nowrap}

/* Reset */
.snm-reset-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--snm-radius-sm);border:1px solid var(--snm-gray-200);background:white;font-family:inherit;font-size:13px;font-weight:600;color:var(--snm-gray-500);cursor:pointer;transition:all .15s;margin-top:4px}
.snm-reset-btn:hover{border-color:var(--snm-gray-400);color:var(--snm-gray-800)}

/* Info Strip */
.snm-info-strip{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:1rem;padding:10px 0;border-top:1px solid var(--snm-gray-100)}
.snm-info-item{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--snm-gray-400)}

/* Section input group */
.snm-sec-input-group{display:flex;flex-direction:column;gap:4px}
.snm-sec-input-group label{font-size:10px;font-weight:600;color:var(--snm-gray-500);text-transform:uppercase;letter-spacing:.04em}
.snm-sec-input-group input{padding:7px 10px;border-radius:6px;border:1.5px solid var(--snm-gray-200);font-family:inherit;font-size:14px;font-weight:700;text-align:center;outline:none;color:var(--snm-gray-800)}
.snm-sec-input-group input:focus{border-color:var(--snm-purple)}

/* Responsive */
@media(max-width:540px){
  .snm-scheme-row{grid-template-columns:1fr 1fr 1fr;grid-template-rows:auto auto}
  .snm-scheme-divider{display:none}
  .snm-input-row{grid-template-columns:1fr 1fr 1fr;gap:6px}
  .snm-stats-grid{grid-template-columns:repeat(2,1fr)}
  .snm-score-number{font-size:40px}
  .snm-exam-grid{grid-template-columns:repeat(3,1fr)}
  .snm-whatif-row{flex-direction:column;align-items:flex-start;gap:4px}
}
@media(max-width:360px){
  .snm-input-row{gap:4px}
  .snm-counter-btn{width:28px}
  .snm-counter-input{font-size:15px}
}