/* ── SR-only ── */
.ezg-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* ── Reset ── */
#ezg_wrap,#ezg_wrap *,#ezg_wrap *::before,#ezg_wrap *::after{box-sizing:border-box;margin:0;padding:0}

/* ── Root ── */
#ezg_wrap{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;width:100%;max-width:620px;margin:0 auto;color:#111827;font-size:15px;line-height:1.5;display:block}

/* ── Focus ── */
#ezg_wrap :focus{outline:none}
#ezg_wrap :focus-visible{outline:2.5px solid #2563eb;outline-offset:2px;border-radius:4px}

/* ── Card ── */
#ezg_wrap .ezg-card{background:#fff;border:1px solid #d1d5db;border-radius:14px;margin-bottom:14px;overflow:hidden;box-shadow:0 1px 6px rgba(0,0,0,.07);width:100%}
#ezg_wrap .ezg-card-body{padding:20px}

/* ── Card head ── */
#ezg_wrap .ezg-card-head{background:#f9fafb;border-bottom:1px solid #e5e7eb;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap;min-width:0}
#ezg_wrap .ezg-card-head h1,#ezg_wrap .ezg-card-head h2,#ezg_wrap .ezg-card-head-title{font-size:14px;font-weight:700;color:#111827;margin:0;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 1 auto;min-width:0}

/* ── Main title head ── */
#ezg_wrap .ezg-main-head{background:#f9fafb!important;border-bottom:1px solid #e5e7eb!important;justify-content:center;padding:10px 24px;flex-wrap:wrap}
#ezg_wrap .ezg-main-head h1,#ezg_wrap .ezg-main-head h2{font-family:Georgia,"Times New Roman",serif;font-size:23px;font-weight:700;color:#111827!important;text-align:center;letter-spacing:-.4px;line-height:1.45;margin:0;width:100%;white-space:normal;overflow:visible;text-overflow:clip}

/* ── Input grid ── */
#ezg_wrap .ezg-input-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
#ezg_wrap .ezg-field-top{display:flex;align-items:center;gap:8px;margin-bottom:4px}
#ezg_wrap .ezg-field-lbl{font-size:14px;font-weight:700;color:#111827}
#ezg_wrap .ezg-opt-badge{font-size:11px;font-weight:600;color:#6b7280;background:#f3f4f6;padding:2px 7px;border-radius:10px;flex-shrink:0;white-space:nowrap}
#ezg_wrap .ezg-field-hint{font-size:12px;color:#6b7280;margin-bottom:8px;line-height:1.4}

/* ── Stepper ── */
#ezg_wrap .ezg-stepper{display:flex;align-items:stretch;height:54px;border:1.5px solid #d1d5db;border-radius:10px;overflow:hidden;background:#fff;width:100%;transition:border-color .15s}
#ezg_wrap .ezg-stepper:focus-within{border-color:#111827}
#ezg_wrap .ezg-sb{flex:0 0 44px;width:44px;min-width:44px;min-height:44px;background:#f9fafb;border:none;font-size:22px;font-weight:400;color:#374151;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;user-select:none;touch-action:manipulation;line-height:1;flex-shrink:0}
#ezg_wrap .ezg-sb:hover{background:#f3f4f6;color:#111827}
#ezg_wrap .ezg-sb:active{background:#e5e7eb}
#ezg_wrap .ezg-si{flex:1 1 auto;min-width:0;border:none;border-left:1.5px solid #e5e7eb;border-right:1.5px solid #e5e7eb;text-align:center;font-size:24px;font-weight:700;color:#111827;background:#fff;outline:none;-moz-appearance:textfield;appearance:none;width:100%;padding:0 2px;display:block;font-family:inherit}
#ezg_wrap .ezg-si::-webkit-inner-spin-button,#ezg_wrap .ezg-si::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#ezg_wrap .ezg-si::placeholder{color:#d1d5db;font-weight:400;font-size:16px}

/* ── Error ── */
#ezg_wrap .ezg-error{font-size:13px;font-weight:600;color:#dc2626;text-align:center;margin-bottom:6px;min-height:20px;line-height:1.4}

/* ── Shortcut buttons ── */
#ezg_wrap .ezg-wr-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
#ezg_wrap .ezg-sc-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;min-height:44px;background:#f9fafb;border:1.5px solid #d1d5db;border-radius:10px;cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:left;width:100%;touch-action:manipulation;font-family:inherit;transition:background .12s,border-color .12s}
#ezg_wrap .ezg-sc-btn:hover{background:#f3f4f6;border-color:#9ca3af}
#ezg_wrap .ezg-sc-btn:active{background:#e5e7eb}
#ezg_wrap .ezg-sc-key{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex-shrink:0;border:1.5px solid #9ca3af;border-radius:5px;font-size:13px;font-weight:800;font-family:ui-monospace,"Courier New",monospace;background:#fff;color:#111827;box-shadow:0 2px 0 #c4c9d4}
#ezg_wrap .ezg-sc-info{display:flex;flex-direction:column;line-height:1.25;min-width:0;overflow:hidden}
#ezg_wrap .ezg-sc-title{font-size:12px;font-weight:700;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ezg_wrap .ezg-sc-desc{font-size:11px;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ── Action buttons ── */
#ezg_wrap .ezg-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
#ezg_wrap .ezg-act-btn{padding:13px 10px;min-height:44px;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;width:100%;display:flex;align-items:center;justify-content:center;gap:6px;text-align:center;border:1.5px solid transparent;font-family:inherit;touch-action:manipulation;transition:background .12s,border-color .12s;white-space:nowrap}
#ezg_wrap .ezg-btn-calc{background:#111827;border-color:#111827;color:#fff}
#ezg_wrap .ezg-btn-calc:hover{background:#1f2937;border-color:#1f2937}
#ezg_wrap .ezg-btn-calc:active{background:#374151;border-color:#374151}
#ezg_wrap .ezg-btn-reset{background:#fff;border-color:#d1d5db;color:#374151}
#ezg_wrap .ezg-btn-reset:hover{background:#f9fafb;border-color:#9ca3af}
#ezg_wrap .ezg-btn-reset:active{background:#f3f4f6}
#ezg_wrap .ezg-reset-icon{font-size:15px;line-height:1;flex-shrink:0}

/* ── Custom Settings ── */
#ezg_wrap .ezg-cs-wrap{border-top:1px solid #e5e7eb;padding-top:14px}
#ezg_wrap .ezg-cs-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:10px 14px;min-height:44px;background:#fff;border:1.5px solid #d1d5db;border-radius:10px;cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:left;font-family:inherit;touch-action:manipulation;transition:background .12s}
#ezg_wrap .ezg-cs-toggle:hover{background:#f9fafb}
#ezg_wrap .ezg-cs-toggle:active{background:#f3f4f6}
#ezg_wrap .ezg-cs-lbl{font-size:15px;font-weight:700;color:#111827}
#ezg_wrap .ezg-cs-chev{width:16px;height:16px;flex-shrink:0;color:#9ca3af;display:block;transition:transform .2s}
#ezg_wrap .ezg-cs-chev-open{transform:rotate(180deg)}
#ezg_wrap .ezg-cs-panel{display:none;margin-top:10px;padding:16px;background:#f9fafb;border:1.5px solid #e5e7eb;border-radius:10px}
#ezg_wrap .ezg-cs-panel.ezg-open{display:block}
#ezg_wrap .ezg-cs-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
#ezg_wrap .ezg-cs-field{display:flex;flex-direction:column;gap:5px}
#ezg_wrap .ezg-cs-field-lbl{font-size:12px;font-weight:700;color:#374151}
#ezg_wrap .ezg-cs-select{padding:10px 34px 10px 12px;font-size:14px;font-weight:600;color:#111827;background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23374151" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>') no-repeat right 10px center/16px 16px;border:2px solid #9ca3af;border-radius:8px;outline:none;cursor:pointer;width:100%;font-family:inherit;min-height:44px;-webkit-appearance:none;appearance:none}
#ezg_wrap .ezg-cs-select:hover{border-color:#6b7280;background-color:#f9fafb}
#ezg_wrap .ezg-cs-select:focus{border-color:#111827;box-shadow:0 0 0 3px rgba(17,24,39,.08)}
#ezg_wrap .ezg-pw{display:flex;align-items:center;gap:6px}
#ezg_wrap .ezg-pw-in{flex:1 1 0%;min-width:0;padding:9px 6px;font-size:13px;font-weight:600;color:#111827;background:#fff;border:1.5px solid #d1d5db;border-radius:8px;outline:none;-moz-appearance:textfield;appearance:none;text-align:center;width:100%;font-family:inherit;min-height:40px}
#ezg_wrap .ezg-pw-in::-webkit-inner-spin-button,#ezg_wrap .ezg-pw-in::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#ezg_wrap .ezg-pw-in:focus{border-color:#374151}
#ezg_wrap .ezg-pw-unit{font-size:13px;color:#6b7280;flex-shrink:0}
#ezg_wrap .ezg-chk-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#ezg_wrap .ezg-chk{display:flex;align-items:center;gap:8px;padding:9px 11px;min-height:44px;background:#fff;border:1.5px solid #d1d5db;border-radius:8px;cursor:pointer;user-select:none;font-size:13px;font-weight:600;color:#374151;-webkit-tap-highlight-color:transparent}
#ezg_wrap .ezg-chk input[type="checkbox"]{width:16px;height:16px;flex-shrink:0;cursor:pointer;accent-color:#374151}

/* ── Result card ── */
#ezg_wrap .ezg-res-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:12px;min-width:0}
#ezg_wrap .ezg-res-left{flex:1 1 auto;min-width:0}
#ezg_wrap .ezg-rpct{font-size:52px;font-weight:800;color:#111827;line-height:1;letter-spacing:-2px;white-space:nowrap}
#ezg_wrap .ezg-rfrac{font-size:14px;color:#6b7280;margin-top:5px;white-space:nowrap}
#ezg_wrap .ezg-res-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex-shrink:0}
#ezg_wrap .ezg-grade-badge{font-size:28px;font-weight:800;padding:8px 20px;border-radius:10px;background:#f3f4f6;color:#111827;display:inline-block;min-width:64px;text-align:center;white-space:nowrap}
#ezg_wrap .ezg-pass-pill{font-size:13px;font-weight:700;padding:5px 14px;border-radius:20px;display:inline-block;white-space:nowrap}
#ezg_wrap .ezg-ppas{background:#dcfce7;color:#14532d}
#ezg_wrap .ezg-pfai{background:#fee2e2;color:#7f1d1d}

/* ── Print button ── */
#ezg_wrap .ezg-print-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;min-height:36px;background:#fff;border:1px solid #d1d5db;border-radius:7px;font-size:12px;font-weight:600;color:#374151;cursor:pointer;-webkit-tap-highlight-color:transparent;font-family:inherit;touch-action:manipulation;white-space:nowrap;flex-shrink:0}
#ezg_wrap .ezg-print-btn:hover{background:#f3f4f6}

/* ── Grading Chart table ──
   APPROACH:
   • card overflow:hidden  — border-radius clips children (no content escapes)
   • ezg-chart-body: padding:0  — table fills full card width, no gap at edges
   • ezg-tscroll: overflow-x:auto  — scrolls only when table > card width
   • table-layout:auto  — browser sizes each column to its content
   • white-space:nowrap on th + td  — nothing ever line-breaks inside a cell
   • Score uses \u00a0/\u00a0 (non-breaking slash) in JS  — never splits
   ── */
#ezg_wrap .ezg-chart-body{padding:0}
#ezg_wrap .ezg-tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;width:100%}
#ezg_wrap table.ezg-ct{width:100%;border-collapse:collapse;table-layout:auto}
#ezg_wrap table.ezg-ct caption{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#ezg_wrap table.ezg-ct th{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#6b7280;padding:10px 14px;text-align:center;background:#f9fafb;border-bottom:1px solid #e5e7eb;white-space:nowrap}
#ezg_wrap table.ezg-ct td{padding:8px 14px;text-align:center;border-bottom:1px solid #f3f4f6;font-size:13px;color:#374151;vertical-align:middle;white-space:nowrap}
#ezg_wrap table.ezg-ct tr:last-child td{border-bottom:none}
#ezg_wrap table.ezg-ct tr:hover td{background:#f9fafb}
#ezg_wrap table.ezg-ct tr.ezg-row-cur td{background:#f3f4f6;font-weight:700;color:#111827}
#ezg_wrap table.ezg-ct tr.ezg-row-fail td{color:#b91c1c}
#ezg_wrap .ezg-chip{display:inline-block;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:600;background:#f3f4f6;color:#374151;white-space:nowrap}
#ezg_wrap table.ezg-ct tr.ezg-row-fail .ezg-chip{background:#fee2e2;color:#991b1b}

/* ── Responsive 520px ── */
@media(max-width:520px){
  #ezg_wrap .ezg-main-head{padding:8px 16px}
  #ezg_wrap .ezg-main-head h1,#ezg_wrap .ezg-main-head h2{font-size:19px}
  #ezg_wrap .ezg-rpct{font-size:42px;letter-spacing:-1.5px}
  #ezg_wrap .ezg-rfrac{font-size:13px}
  #ezg_wrap .ezg-grade-badge{font-size:24px;padding:7px 16px;min-width:56px}
  #ezg_wrap .ezg-pass-pill{font-size:12px;padding:4px 11px}
  #ezg_wrap table.ezg-ct th{font-size:10px;padding:9px 10px;letter-spacing:0}
  #ezg_wrap table.ezg-ct td{font-size:12px;padding:7px 10px}
  #ezg_wrap .ezg-chip{font-size:11px;padding:2px 8px}
}
/* ── Responsive 420px ── */
@media(max-width:420px){
  #ezg_wrap .ezg-input-grid,#ezg_wrap .ezg-wr-grid,#ezg_wrap .ezg-action-grid,#ezg_wrap .ezg-cs-row,#ezg_wrap .ezg-chk-row{grid-template-columns:1fr}
  #ezg_wrap .ezg-card-body{padding:14px}
  #ezg_wrap .ezg-card-head{padding:10px 14px}
  #ezg_wrap .ezg-main-head{padding:7px 14px}
  #ezg_wrap .ezg-main-head h1,#ezg_wrap .ezg-main-head h2{font-size:16px}
  #ezg_wrap .ezg-rpct{font-size:36px;letter-spacing:-1px}
  #ezg_wrap .ezg-rfrac{font-size:12px;margin-top:3px}
  #ezg_wrap .ezg-grade-badge{font-size:22px;padding:6px 14px;min-width:52px}
  #ezg_wrap .ezg-pass-pill{font-size:11px;padding:3px 9px}
  #ezg_wrap table.ezg-ct th{font-size:10px;padding:8px 8px;letter-spacing:0}
  #ezg_wrap table.ezg-ct td{font-size:11px;padding:7px 8px}
  #ezg_wrap .ezg-chip{font-size:10px;padding:2px 6px}
  #ezg_wrap .ezg-si{font-size:20px}
}
/* ── Responsive 340px ── */
@media(max-width:340px){
  #ezg_wrap .ezg-main-head h1,#ezg_wrap .ezg-main-head h2{font-size:14px;letter-spacing:0}
  #ezg_wrap .ezg-rpct{font-size:28px;letter-spacing:-.5px}
  #ezg_wrap .ezg-rfrac{font-size:11px}
  #ezg_wrap .ezg-grade-badge{font-size:18px;padding:5px 10px;min-width:44px}
  #ezg_wrap .ezg-pass-pill{font-size:10px;padding:3px 7px}
  #ezg_wrap .ezg-res-inner{gap:6px}
  #ezg_wrap table.ezg-ct th{font-size:8.5px;padding:6px 4px;letter-spacing:0}
  #ezg_wrap table.ezg-ct td{font-size:10px;padding:5px 4px}
  #ezg_wrap .ezg-chip{font-size:9px;padding:2px 4px}
  #ezg_wrap .ezg-sb{flex:0 0 36px;width:36px;min-width:36px;font-size:18px}
  #ezg_wrap .ezg-si{font-size:17px}
}
/* ── Responsive 300px — extreme safety net (Galaxy Fold closed, etc) ── */
@media(max-width:300px){
  #ezg_wrap table.ezg-ct th{font-size:7.5px;padding:5px 2px}
  #ezg_wrap table.ezg-ct td{font-size:9px;padding:4px 2px}
  #ezg_wrap .ezg-chip{font-size:8px;padding:1px 3px}
}
/* ── Reduced motion ── */
@media(prefers-reduced-motion:reduce){
  #ezg_wrap .ezg-cs-chev,#ezg_wrap .ezg-stepper,#ezg_wrap .ezg-sc-btn,#ezg_wrap .ezg-act-btn,#ezg_wrap .ezg-cs-toggle{transition:none!important}
}
/* ── Print ── */
@media print{
  #ezg_wrap .ezg-card{display:none!important}
  #ezg_wrap #ezg_chart_card{display:block!important}
  #ezg_wrap .ezg-print-btn{display:none!important}
  #ezg_wrap table.ezg-ct td,#ezg_wrap table.ezg-ct th{border:1px solid #d1d5db!important;white-space:normal!important}
}
