/* Shared look for the student portal (index = sign-in, book = booking / own page).
   Same palette as the booking page that has been live since 2026-06. */
:root{
  --bg:#F6F0E6; --card:#FFFEFB; --ink:#2B2724; --soft:#4A443E; --muted:#8C8275;
  --accent:#C0603F; --deep:#7C2E2A; --line:#E2D8C6; --stripe:#F1E8D9;
  --accent-soft:#EFE0D2; --done:#6f7d52; --done-soft:#e7ecdc; --blue:#5B7A8C;
  --serif:Georgia,"Times New Roman","Songti TC","PMingLiU",serif;
  --sans:"Segoe UI","Helvetica Neue",Arial,"Microsoft JhengHei","PingFang HK",sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent)}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:.2px;margin:0;line-height:1.25}
.en{color:var(--muted);font-family:var(--sans);font-weight:400}
.wrap{max-width:760px;margin:0 auto;padding:0 16px 72px}
/* page 3 widens to two columns above 920px; keep the band in line with it */
@media (min-width:920px){ body.railopen .band .in{max-width:1180px} }

/* top band */
.band{background:var(--deep);color:#F6E9DE;border-bottom:3px solid var(--accent)}
.band .in{max-width:760px;margin:0 auto;padding:16px 16px 14px;display:flex;align-items:center;
  justify-content:space-between;gap:12px;font-size:12px;letter-spacing:2.5px;text-transform:uppercase;color:#E7B79E}
.band .in a{color:#FFF7F0;letter-spacing:.3px;text-transform:none;font-size:13px;white-space:nowrap}

.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:16px}
.kick{font-size:12px;letter-spacing:2.4px;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:6px}
.lead{font-size:16px;color:var(--soft)}
.muted-t{color:var(--muted);font-size:14px}

button.cta,a.cta{display:block;width:100%;padding:14px;border:none;border-radius:11px;background:var(--accent);
  color:#fff;font-size:16.5px;font-weight:700;cursor:pointer;font-family:inherit;text-align:center;text-decoration:none}
button.cta:disabled{opacity:.4;cursor:not-allowed}
a.cta .en,button.cta .en{color:#FBE3D6;font-weight:600}
button.ghost,a.ghost{display:inline-block;padding:9px 15px;border:1.5px solid var(--accent);background:#fff;border-radius:9px;
  cursor:pointer;font-size:14px;font-weight:700;color:var(--accent);font-family:inherit;white-space:nowrap;text-decoration:none}
label{display:block;font-size:12px;font-weight:700;color:var(--muted);margin:0 0 6px;text-transform:uppercase;letter-spacing:.8px}
input,select,textarea{width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:9px;background:#fff;
  font-size:16px;color:var(--ink);font-family:inherit}
input:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.hint{font-size:13px;color:var(--muted);margin-top:6px}
.err{color:#b91c1c;font-size:14px;margin-top:10px}
.hide{display:none!important}
.pill{display:inline-block;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px}
.pill.open{background:var(--done-soft);color:var(--done)}
.pill.soon{background:#ECE6DC;color:var(--soft)}
footer{text-align:center;color:var(--muted);font-size:12px;margin-top:28px}