:root{--red:#fe0000;--dark-red:#d90000;--text:#242424;--muted:#666;--border:#d8d8d8;--bg:#f4f4f4}
*{box-sizing:border-box}body{font-family:Arial,sans-serif;background:var(--bg);color:var(--text);margin:0;padding:24px 16px;font-size:16px;line-height:1.45}.page{max-width:680px;margin:0 auto}.page.wide{max-width:1180px}.header-card,.card{background:#fff;border-radius:12px;box-shadow:0 2px 14px #00000012;padding:26px}.header-card{text-align:center}.logo{width:165px;height:auto;max-height:90px;object-fit:contain;margin-bottom:12px}h1{font-size:26px;line-height:1.2;margin:0 0 10px}h2{font-size:20px;margin:0 0 12px}h3{font-size:18px}.subhead,.muted,.hint{color:var(--muted)}.subhead{margin:0}.hint{font-size:14px;margin:8px 0 18px}.required{color:var(--red)}nav{display:flex;justify-content:center;gap:8px;padding:14px 0}nav a{padding:8px 16px;text-decoration:none;border-radius:7px;color:#555}nav a[aria-current]{color:#b90000;background:#fff;font-weight:700}nav a:hover{background:#fff}a{color:#b80000;text-underline-offset:3px}label{display:block;font-size:15px;font-weight:bold;margin-bottom:6px}input,select{width:100%;font:inherit;border:1px solid var(--border);border-radius:8px;background:#fff;color:var(--text);min-height:47px;padding:11px;min-width:0}input[type=file]{padding:9px;font-size:14px}input:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #fe000050;outline-offset:3px}.form-group{margin-top:16px;margin-bottom:16px}.section-heading{display:flex;align-items:center;gap:10px;margin-bottom:18px}.section-heading h2{margin:0}.step{background:#fff0f0;color:#b90000;width:28px;height:28px;border-radius:50%;font-weight:bold;text-align:center;line-height:28px;font-size:14px}hr{border:0;border-top:1px solid #ececec;margin:26px 0}fieldset{margin:20px 0 24px;border:1px solid #e4e4e4;border-radius:9px;padding:8px 16px 18px;min-width:0}legend{font-weight:bold;font-size:15px;padding:0 6px}.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:14px}.toggle{display:flex;align-items:center;gap:10px;font-weight:normal;margin:18px 0;cursor:pointer}.toggle input{width:18px;height:18px;min-height:0;accent-color:var(--red)}.primary{display:inline-block;text-align:center;background:var(--red);color:white;padding:12px 20px;border:none;border-radius:8px;font:700 16px Arial,sans-serif;cursor:pointer;text-decoration:none;min-height:46px}.primary:hover{background:var(--dark-red)}.primary:disabled{background:#888;cursor:wait}.full{width:100%}.small-note{color:var(--muted);font-size:13px;text-align:center;margin:12px 0 0}.notice{border-radius:8px;padding:14px;margin-bottom:20px}.error{background:#fff3f3;border:1px solid #fe0000;color:#7a0000}.success{background:#eef8ef;border:1px solid #8abf92;color:#245e2c}.confirmation{text-align:center;padding:34px 26px}.success-mark{width:54px;height:54px;background:#edf8ee;color:#287535;border-radius:50%;font-size:30px;line-height:54px;margin:0 auto 18px}.business{font-weight:bold;margin-top:20px}.attendee-list{list-style:none;margin:22px 0;padding:0}.attendee-list li{padding:6px}.row{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.row h2{margin:0}.filters{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.filters .search{flex:1;min-width:210px}.filters>div:not(.search){width:155px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:14px;text-align:left}th{background:#f8f8f8;color:#555;font-size:12px;text-transform:uppercase;letter-spacing:.04em}td,th{padding:15px 12px;border-bottom:1px solid #ececec;vertical-align:top}td a{overflow-wrap:anywhere}.timestamp{display:block;color:var(--muted);font-size:12px;margin-top:5px}.pagination{display:flex;justify-content:center;gap:24px;padding-top:22px;font-size:14px}.empty{text-align:center;padding:36px 20px;color:var(--muted)}.customer-list{list-style:none;margin:0;padding:0}.customer-list li{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:13px 0;border-bottom:1px solid #eee;font-size:14px}.badge{font-size:11px;white-space:nowrap;color:#666;background:#f2f2f2;border-radius:20px;padding:4px 8px}footer{text-align:center;font-size:12px;color:#777;padding:24px 0}footer span{display:block;margin-top:6px}[hidden]{display:none!important}
@media(max-width:600px){body{padding:12px 10px}.header-card,.card{padding:20px}h1{font-size:23px}.contact-grid{grid-template-columns:1fr}.row{align-items:start;flex-wrap:wrap}.filters>div:not(.search){width:calc(50% - 6px)}.filters .search{min-width:100%}.filters button{width:100%}.customer-list li{align-items:start;flex-direction:column;gap:6px}nav a{padding:8px 12px}fieldset{padding-left:12px;padding-right:12px}.logo{width:145px}}

/* Touch screens and narrow viewports */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
.page,main,.card,.header-card,.contact-grid>div,.filters>div{min-width:0}
.card,.header-card{overflow-wrap:anywhere}
input,select{max-width:100%;font-size:16px}
input[type=file]{font-size:16px}
select{text-overflow:ellipsis}
nav{flex-wrap:wrap;gap:4px}
nav a,.pagination a,.confirmation-actions>a{display:inline-flex;align-items:center;justify-content:center;min-height:44px}
.toggle{min-height:44px}
.toggle input{flex:0 0 22px;width:22px;height:22px}
.primary{min-height:48px;touch-action:manipulation}
.step{flex-shrink:0}
.record-actions a{display:inline-flex;align-items:center;justify-content:center;min-width:64px;min-height:44px;padding:8px 12px;border:1px solid #e5bcbc;border-radius:8px;text-decoration:none}
.record-contact a{display:inline-flex;align-items:center;min-height:44px;overflow-wrap:anywhere;max-width:100%}
.customer-list li>span:first-child{min-width:0;overflow-wrap:anywhere}
.pagination{align-items:center;flex-wrap:wrap;gap:12px}
.confirmation-actions{margin-bottom:0}
.filters>div.event-filter{width:210px;max-width:100%}
.event-links{display:flex;gap:16px;flex-wrap:wrap}
.event-links a{display:inline-flex;align-items:center;min-height:44px}
.event-list li{flex-wrap:wrap}
.event-list strong{min-width:0;overflow-wrap:anywhere}
.login-card{margin-top:18px}
.login-card #code{font-size:30px;text-align:center;letter-spacing:.4em;margin:8px 0 24px;min-height:64px}
.logout-form{margin-top:12px}
.logout-form button{font:inherit;font-size:14px;color:#b80000;border:1px solid #d8d8d8;background:#fff;border-radius:8px;min-height:44px;padding:8px 20px;cursor:pointer}
@media(max-width:900px){
  .filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}
  .filters .search{grid-column:1/-1;min-width:0}
  .filters>div:not(.search){width:auto;min-width:0}
  .filters>div.event-filter{grid-column:1/-1;width:auto}
  .filters button{grid-column:1/-1;width:100%}
  .table-wrap{overflow:visible}
  .table-wrap table{display:block}
  .table-wrap thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .record-group{display:flex;flex-direction:column;border:1px solid #ddd;border-radius:10px;margin-top:16px;padding:16px;min-width:0}
  .record-group tr{display:contents}
  .record-group td{display:block;padding:6px 0;border:0;min-width:0;overflow-wrap:anywhere}
  .record-group .record-business{padding:0 0 14px;margin-bottom:8px;border-bottom:1px solid #eee;font-size:16px}
  .record-group td[data-label]{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:12px}
  .record-group td[data-label]::before{content:attr(data-label);font-size:12px;font-weight:bold;color:#666}
  .record-group .record-person{border-top:1px solid #eee;margin-top:10px;padding-top:14px}
  .record-group .record-actions{order:1;border-top:1px solid #eee;margin-top:12px;padding-top:12px}
  .record-actions a{width:100%;min-height:48px}
}
@media(max-width:600px){
  nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}
  nav a{padding:8px 4px;font-size:14px;min-width:0}
  body{padding:12px max(10px,env(safe-area-inset-right)) 12px max(10px,env(safe-area-inset-left))}
  .header-card,.card{padding:18px}
  .row>.primary{width:100%}
  .confirmation-actions{flex-direction:column-reverse;align-items:stretch}
  .confirmation-actions>*{width:100%}
  .record-group{padding:12px}
  .record-group td[data-label]{grid-template-columns:60px minmax(0,1fr);gap:8px}
}
@media(max-width:380px){
  nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filters{grid-template-columns:minmax(0,1fr)}
  .header-card,.card{padding:16px}
}