:root{
  --green:#06c755;
  --green-dark:#05a548;
  --bg:#f5f6f8;
  --card:#ffffff;
  --text:#1f2329;
  --muted:#8a9099;
  --border:#e3e6ea;
  --err:#e0245e;
  --radius:14px;
}
*{box-sizing:border-box;}
html,body{margin:0;}
body{
  font-family:-apple-system,"PingFang TC","Microsoft JhengHei",sans-serif;
  background:var(--bg);color:var(--text);line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:520px;margin:0 auto;padding:16px 14px 60px;}
.hidden{display:none !important;}
.center{text-align:center;}
.muted{color:var(--muted);font-size:.85rem;margin:.2rem 0;}
.title{font-size:1.3rem;font-weight:800;margin:.2rem 0 .6rem;}

/* hero */
.hero{padding:8px 6px 0;}
.hero .meta{list-style:none;padding:0;margin:.4rem 0;color:#444;font-size:.92rem;}
.hero .meta li{margin:.15rem 0;}
.remain{display:inline-block;background:#eafaf0;color:var(--green-dark);
  font-weight:700;font-size:.85rem;padding:4px 12px;border-radius:999px;margin-top:4px;}

/* card */
.card{background:var(--card);border-radius:var(--radius);padding:18px 16px;
  box-shadow:0 1px 3px rgba(0,0,0,.06);margin-top:14px;}

/* fields */
.field{margin-bottom:16px;}
.field>label{display:block;font-weight:700;font-size:.92rem;margin-bottom:6px;}
.req{color:var(--err);}
input[type=text],input[type=tel]{
  width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:10px;
  font-size:1rem;background:#fff;}
input[type=text]:focus,input[type=tel]:focus{outline:none;border-color:var(--green);}
.other-input{margin-top:8px;}
.err{display:block;color:var(--err);font-size:.8rem;margin-top:4px;min-height:1em;}

/* checks & radios */
.checks{display:flex;flex-wrap:wrap;gap:8px;}
.check{display:flex;align-items:center;gap:6px;border:1px solid var(--border);
  border-radius:10px;padding:8px 12px;font-size:.92rem;cursor:pointer;background:#fff;}
.check input{width:18px;height:18px;accent-color:var(--green);margin:0;}
.radios{display:flex;gap:10px;}
.radio{display:flex;align-items:center;gap:6px;border:1px solid var(--border);
  border-radius:10px;padding:9px 22px;cursor:pointer;}
.radio input{width:18px;height:18px;accent-color:var(--green);margin:0;}
.agree{align-items:flex-start;border:none;padding:0;}
.agree a{color:var(--green-dark);font-weight:700;text-decoration:underline;}

/* buttons */
.btn-primary{width:100%;padding:14px;border:none;border-radius:12px;background:var(--green);
  color:#fff;font-size:1.05rem;font-weight:800;cursor:pointer;}
.btn-primary:disabled{opacity:.6;}
.btn-secondary{width:100%;padding:12px;border:1px solid var(--green);border-radius:12px;
  background:#fff;color:var(--green-dark);font-weight:700;cursor:pointer;margin-top:14px;}
.form-msg{margin-top:10px;text-align:center;}

/* status */
.status-box{text-align:center;padding:8px 0 4px;}
.big{font-size:2rem;font-weight:800;margin:.1rem 0 .6rem;}
.badge{display:inline-block;padding:6px 18px;border-radius:999px;font-weight:800;font-size:1.05rem;}
.badge-pending{background:#fff4e5;color:#b76e00;}
.badge-approved{background:#eafaf0;color:var(--green-dark);}
.badge-rejected{background:#fdeaf0;color:var(--err);}
.badge-checked_in{background:#e8f0fe;color:#1a56db;}
.badge-deposit_returned{background:#eef0f2;color:#555;}
.hint{text-align:center;color:#555;font-size:.9rem;margin:16px 0 0;}

/* spinner */
.spinner{width:34px;height:34px;border:4px solid #e3e6ea;border-top-color:var(--green);
  border-radius:50%;margin:20px auto 8px;animation:spin 1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* modal */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;
  justify-content:center;padding:20px;z-index:50;}
.modal-box{background:#fff;border-radius:16px;padding:20px 18px;max-width:460px;width:100%;
  max-height:80vh;overflow:auto;}
.modal-box h2{margin:.2rem 0 .8rem;font-size:1.15rem;}
.modal-box ol{padding-left:1.2rem;margin:0 0 16px;}
.modal-box li{margin:.5rem 0;font-size:.92rem;line-height:1.65;}
