#emst-checkpoint{
  --navy:#0f2a44; --teal:#0e9f8e; --teal-dk:#0b7f72; --ink:#1d2b38; --muted:#5d6b78;
  --line:#dde4ea; --bg:#f3f7f9; --card:#ffffff;
  --r1:#e5484d; --r2:#f2853b; --r3:#f5b82e; --r4:#7cc35a; --r5:#22a66b;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink); background:var(--bg); padding:16px; box-sizing:border-box; width:100%;
  -webkit-font-smoothing:antialiased; line-height:1.4;
}
#emst-checkpoint *,#emst-checkpoint *::before,#emst-checkpoint *::after{box-sizing:border-box}
#emst-checkpoint .ec-shell{max-width:620px;margin:0 auto}
#emst-checkpoint .ec-brand{display:flex;align-items:center;gap:10px;margin:4px 0 14px}
#emst-checkpoint .ec-logo{width:40px;height:40px;border-radius:12px;background:var(--navy);display:grid;place-items:center;flex:none}
#emst-checkpoint .ec-brand b{font-size:18px;color:var(--navy);letter-spacing:.2px}
#emst-checkpoint .ec-brand small{display:block;font-size:13px;color:var(--muted)}
#emst-checkpoint .ec-progress{height:10px;background:var(--line);border-radius:99px;overflow:hidden;margin-bottom:8px}
#emst-checkpoint .ec-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),#3cc6b4);border-radius:99px;transition:width .35s ease}
#emst-checkpoint .ec-steplabel{font-size:14px;color:var(--muted);font-weight:600;margin-bottom:12px;min-height:20px}
#emst-checkpoint .ec-card{background:var(--card);border-radius:22px;padding:26px 20px;box-shadow:0 6px 24px rgba(15,42,68,.08)}
#emst-checkpoint .ec-screen{display:none;animation:ecIn .3s ease}
#emst-checkpoint .ec-screen.on{display:block}
@keyframes ecIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#emst-checkpoint .ec-icon{width:72px;height:72px;border-radius:20px;display:grid;place-items:center;margin:0 auto 14px;background:#e6f6f3}
#emst-checkpoint h1,#emst-checkpoint h2{margin:0 0 8px;text-align:center;color:var(--navy);line-height:1.2}
#emst-checkpoint h1{font-size:30px}
#emst-checkpoint h2{font-size:26px}
#emst-checkpoint p.ec-sub{margin:0 0 22px;text-align:center;font-size:18px;color:var(--muted)}
#emst-checkpoint label.ec-lbl{display:block;font-weight:700;font-size:17px;margin:16px 0 8px}
#emst-checkpoint input.ec-in,#emst-checkpoint textarea.ec-in{
  width:100%;font:inherit;font-size:19px;padding:16px;border:2px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);
}
#emst-checkpoint input.ec-in:focus,#emst-checkpoint textarea.ec-in:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px rgba(14,159,142,.15)}
#emst-checkpoint textarea.ec-in{min-height:170px;resize:vertical}
#emst-checkpoint .ec-err{color:var(--r1);font-weight:600;font-size:15px;margin-top:10px;min-height:20px;text-align:center}
/* Rating faces */
#emst-checkpoint .ec-faces{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:6px 0 4px}
#emst-checkpoint .ec-face{
  appearance:none;border:3px solid transparent;background:#f6f8fa;border-radius:18px;padding:10px 2px 8px;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:6px;transition:transform .15s,border-color .15s,background .15s;font:inherit;color:var(--ink)
}
#emst-checkpoint .ec-face svg{width:100%;max-width:64px;height:auto;filter:grayscale(.35);opacity:.8;transition:filter .15s,opacity .15s}
#emst-checkpoint .ec-face span{font-size:13px;font-weight:700;color:var(--muted)}
#emst-checkpoint .ec-face:hover svg{filter:none;opacity:1}
#emst-checkpoint .ec-face.sel{transform:scale(1.07);background:#fff;border-color:var(--c)}
#emst-checkpoint .ec-face.sel svg{filter:none;opacity:1}
#emst-checkpoint .ec-face.sel span{color:var(--ink)}
#emst-checkpoint .ec-face:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
#emst-checkpoint .ec-readout{text-align:center;margin-top:16px;min-height:62px}
#emst-checkpoint .ec-readout b{display:block;font-size:40px;line-height:1;color:var(--navy)}
#emst-checkpoint .ec-readout em{font-style:normal;font-size:17px;font-weight:600;color:var(--muted)}
/* Category chips */
#emst-checkpoint .ec-chips{display:flex;flex-wrap:wrap;gap:8px}
#emst-checkpoint .ec-chip{appearance:none;font:inherit;font-size:16px;font-weight:600;padding:12px 16px;border-radius:99px;border:2px solid var(--line);background:#fff;color:var(--ink);cursor:pointer}
#emst-checkpoint .ec-chip.sel{background:var(--navy);border-color:var(--navy);color:#fff}
/* Buttons */
#emst-checkpoint .ec-nav{display:flex;gap:10px;margin-top:24px}
#emst-checkpoint .ec-btn{
  appearance:none;border:0;font:inherit;font-size:20px;font-weight:700;padding:18px 20px;border-radius:16px;cursor:pointer;
  flex:1;min-height:62px;transition:background .15s,opacity .15s
}
#emst-checkpoint .ec-go{background:var(--teal);color:#fff}
#emst-checkpoint .ec-go:hover{background:var(--teal-dk)}
#emst-checkpoint .ec-go:disabled{opacity:.4;cursor:not-allowed}
#emst-checkpoint .ec-back{background:#eef2f5;color:var(--ink);flex:0 0 auto;padding:18px 22px}
/* Summary */
#emst-checkpoint .ec-gauge{display:block;margin:4px auto 6px;width:210px;max-width:70%}
#emst-checkpoint .ec-bars{margin-top:14px;display:grid;gap:14px}
#emst-checkpoint .ec-bar-top{display:flex;justify-content:space-between;font-size:16px;font-weight:700;margin-bottom:6px}
#emst-checkpoint .ec-bar-top button{appearance:none;border:0;background:none;color:var(--teal-dk);font:inherit;font-size:14px;cursor:pointer;text-decoration:underline;padding:0}
#emst-checkpoint .ec-bar{height:16px;background:#edf1f4;border-radius:99px;overflow:hidden}
#emst-checkpoint .ec-bar i{display:block;height:100%;border-radius:99px;width:0;transition:width .6s ease}
#emst-checkpoint .ec-req{margin-top:16px;padding:14px 16px;background:#f6f8fa;border-radius:14px;font-size:16px;color:var(--muted)}
#emst-checkpoint .ec-req b{color:var(--ink)}
#emst-checkpoint .ec-done-check{width:110px;height:110px;margin:0 auto 16px;display:block}
#emst-checkpoint .ec-foot{text-align:center;font-size:13px;color:var(--muted);margin-top:14px}
@media (max-width:420px){
  #emst-checkpoint{padding:12px}
  #emst-checkpoint .ec-card{padding:22px 14px}
  #emst-checkpoint h1{font-size:26px}
  #emst-checkpoint h2{font-size:23px}
  #emst-checkpoint .ec-faces{gap:5px}
  #emst-checkpoint .ec-face{border-radius:14px;padding:8px 0 6px}
  #emst-checkpoint .ec-face span{font-size:11px}
}
/* Standalone page additions */
html,body{margin:0;background:#f3f7f9}
#emst-checkpoint{min-height:100vh;padding-top:20px;padding-bottom:32px}
#emst-checkpoint .ec-week-badge{display:inline-block;margin:0 auto 10px;padding:6px 14px;border-radius:99px;background:#e6f6f3;color:var(--teal-dk);font-weight:700;font-size:15px}
#emst-checkpoint .ec-center{text-align:center}
#emst-checkpoint .ec-note{margin-top:14px;padding:12px 14px;border-radius:12px;background:#fff7e6;color:#7a5200;font-size:15px;font-weight:600;text-align:center}
#emst-checkpoint .ec-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
#emst-checkpoint .ec-again{margin-top:22px}