*{box-sizing:border-box}body{margin:0;background:#f4f6f3;color:#203a32;font:16px/1.6 system-ui,-apple-system,sans-serif}header{background:#fff;border-bottom:1px solid #dde5df;padding:18px 5%;display:flex;justify-content:space-between;align-items:center;gap:20px}a{color:#176b50;text-decoration:none}header>a{font-weight:800;font-size:20px}nav{display:flex;align-items:center;gap:20px;flex-wrap:wrap}nav form{margin:0}main{max-width:1150px;margin:40px auto;padding:0 24px}h1{font-size:clamp(28px,4vw,44px);line-height:1.25;margin:14px 0 22px}h2{margin-top:0}.intro{padding:24px 0 30px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;color:#597d69}.card{background:white;border:1px solid #dde5df;border-radius:18px;padding:30px;margin-bottom:24px}.card form{max-width:650px}label{display:block;font-weight:600;margin:18px 0}input{display:block;width:100%;border:1px solid #b9c9c0;border-radius:8px;padding:12px;font:inherit;margin-top:7px;background:#fff}.check{display:flex;align-items:flex-start;gap:10px;font-weight:400}.check input{width:auto;margin-top:8px}button,.button{display:inline-block;border:0;border-radius:9px;background:#176b50;color:white;padding:12px 20px;font:600 16px system-ui;cursor:pointer}.secondary{background:#e6eee9;color:#234d3e}.muted,small{color:#64756e}small{display:block}.notice{background:#e4eee8;border-left:4px solid #176b50;padding:16px;margin-bottom:20px;border-radius:6px}.error{background:#fff0dc;border-color:#ad691e}.success{background:#dff3e7}.narrow{max-width:650px;margin:30px auto}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.stats strong{display:block;font-size:32px}.table-wrap{overflow:auto;background:white;border-radius:12px}table{border-collapse:collapse;width:100%;font-size:14px}th,td{text-align:left;padding:16px;border-bottom:1px solid #e5ebe6;white-space:nowrap}td button{font-size:14px;padding:9px 12px;margin-top:8px}footer{text-align:center;color:#71867a;font-size:13px;padding:32px}#reader{margin:20px 0}#next{margin-top:12px}[hidden]{display:none!important}@media(max-width:650px){header{align-items:flex-start;flex-direction:column}nav{gap:14px;font-size:14px}main{padding:0 16px;margin-top:20px}.card{padding:22px}.stats{gap:8px}.stats .card{padding:16px 10px;font-size:13px}}

select{display:block;width:100%;border:1px solid #b9c9c0;border-radius:8px;padding:12px;font:inherit;margin-top:7px;background:white}
.registration-intro{display:flex;align-items:center;gap:clamp(16px,3vw,28px)}.registration-intro-copy{min-width:0}.registration-emblem{display:block;width:clamp(72px,12vw,96px);height:auto;flex-shrink:0;object-fit:contain}

.registration-choice{width:22px;height:22px;margin:0;cursor:pointer}button:disabled{opacity:.55;cursor:default}#bulk-progress{margin-top:16px}#bulk-results{padding-left:22px}.email-error{white-space:normal;min-width:220px;max-width:340px}
dialog{width:min(520px,calc(100% - 32px));border:1px solid #dde5df;border-radius:18px;padding:28px;color:#203a32;box-shadow:0 18px 55px #10261d4d}dialog::backdrop{background:#10261da6}dialog .notice{margin:0 0 20px}.file-button{cursor:pointer}.file-button input{display:none}

.registration-title{font-size:clamp(32px,4.5vw,48px);font-weight:800;line-height:1.3;margin:0 0 16px;overflow-wrap:anywhere}.registration-slogan{font-size:clamp(22px,3vw,30px);font-weight:700;line-height:1.4;margin:0 0 20px}

.pagination{justify-content:center;gap:12px;margin:24px 0}.pagination span{text-align:center}

#student-fields fieldset{border:1px solid #dde5df;border-radius:12px;padding:8px 20px 16px;margin:20px 0}#student-fields legend{font-weight:700;padding:0 8px;color:#176b50}

/* Keep the complete registration record visible at every screen width. */
.registration-table{overflow:visible}
.registration-table table{table-layout:fixed}
.registration-table th,.registration-table td{white-space:normal;overflow-wrap:anywhere;vertical-align:top;padding:12px 10px}
.registration-table th:nth-child(1){width:5%}
.registration-table th:nth-child(2){width:22%}
.registration-table th:nth-child(3){width:20%}
.registration-table th:nth-child(4){width:5%}
.registration-table th:nth-child(5),.registration-table th:nth-child(6){width:8%}
.registration-table th:nth-child(7){width:18%}
.registration-table th:nth-child(8){width:14%}
.registration-table .email-error{min-width:0;max-width:none}
.registration-table form{margin:0}
.registration-table td button{max-width:100%;white-space:normal}
@media(max-width:900px){
  .registration-table{background:transparent;border-radius:0}
  .registration-table table,.registration-table tbody{display:block}
  .registration-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .registration-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;background:white;border:1px solid #dde5df;border-radius:12px;padding:18px;margin-bottom:16px}
  .registration-table td{display:block;min-width:0;padding:0;border:0}
  .registration-table td::before{content:attr(data-label);display:block;font-size:12px;font-weight:700;color:#597d69;margin-bottom:4px}
  .registration-table td[data-label="選取"],.registration-table td[data-label="參加者"],.registration-table td[data-label="聯絡資料"],.registration-table td[data-label="電郵"],.registration-table td[data-label="操作"],.registration-table td[colspan]{grid-column:1/-1}
  .registration-table td[data-label="選取"]{display:flex;align-items:center;gap:10px}
  .registration-table td[data-label="選取"]::before{margin:0}
  .registration-table td[data-label="操作"]{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
  .registration-table td[data-label="操作"]::before{flex-basis:100%}
  .registration-table td button{margin:0}
}
