:root{--bg:#f2eee6;--ink:#182121;--panel:#fffaf0;--line:#9ca38f;--accent:#0f6b5f;--accent-2:#ba5d2b;--danger:#9a2f2f;--shadow:0 10px 26px #18212129;--font-main:"Avenir Next", "Gill Sans", "Segoe UI", sans-serif}*{box-sizing:border-box}body{color:var(--ink);font-family:var(--font-main);background:radial-gradient(circle at 20% 0%, #fff8d6 0%, transparent 38%), radial-gradient(circle at 90% 10%, #e6f0de 0%, transparent 40%), var(--bg);margin:0}#root{min-height:100vh}.page{max-width:1200px;margin:0 auto;padding:1.5rem}.login-page{place-items:center;min-height:100vh;display:grid}.panel{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:16px;padding:1rem 1.2rem}.login-panel{width:min(560px,100%)}.login-brand{align-items:center;gap:.6rem;margin-bottom:.75rem;font-size:1.25rem;font-weight:700;display:flex}.login-logo{object-fit:contain;width:4rem;height:4rem}.stack{gap:.8rem;display:grid}label{gap:.4rem;font-weight:700;display:grid}input{border:1px solid var(--line);border-radius:10px;padding:.65rem .8rem;font-size:1rem}button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#5f2da7,#7a3cc3);border:none;border-radius:10px;padding:.6rem .95rem;font-weight:700}button:hover{filter:brightness(1.05)}.header{justify-content:space-between;align-items:center;gap:1rem;display:flex}.app-brand{align-items:center;gap:.7rem;display:flex}.app-logo{object-fit:contain;width:3.4rem;height:3.4rem}.app-brand h1{margin:0;font-size:1.35rem}.actions{gap:.6rem;display:flex}.table-wrap{margin-top:1rem;overflow-x:auto}table{border-collapse:collapse;width:100%}th,td{border-bottom:1px solid var(--line);text-align:left;padding:.7rem}.preview-grid{justify-content:center;margin-top:1rem;display:flex}.card-face{background:#fff;border:1px solid #c9c9c9;border-radius:.12in;overflow:hidden;box-shadow:0 6px 16px #1c182226}.card-front{background:#fff;width:2.125in;height:3.375in;padding:.14in .11in .08in;position:relative}.ocm-header{align-items:center;gap:.08in;display:flex}.ocm-mark{justify-content:center;align-items:center;width:.42in;height:.55in;display:flex}.ocm-logo{width:100%;height:100%}.ocm-title{letter-spacing:.01in;color:#3f2b66;margin:0;font-size:.14in;font-weight:700}.ocm-name{text-align:center;color:#1f1f1f;white-space:nowrap;margin:.15in 0 0;font-size:.18in;font-weight:600;line-height:1.08}.ocm-membership{text-align:center;color:#6b617f;margin:.05in 0 0;font-size:.12in;line-height:1.15}.ocm-nickname{text-align:left;color:#27212f;margin:.25in 0 .02in .06in;font-size:.15in;line-height:1.1}.ocm-membership-chinese{text-align:left;color:#5d4a77;margin:0 0 0 .09in;font-size:.105in;line-height:1.1}.ocm-main{z-index:3;height:1.46in;position:absolute;bottom:.12in;left:.11in;right:.11in}.qr-holder{z-index:2;background:#fff;border:.01in solid #ddd;border-radius:.05in;place-items:center;width:.74in;height:.74in;margin:0;display:grid;position:absolute;bottom:4.4px;left:-.08in}.qr{width:.66in;height:.66in}.photo-circle{z-index:4;background:#f5f5f5;border:.02in solid #ece6f5;border-radius:50%;width:.98in;height:.9in;margin:0;position:absolute;bottom:71.4px;right:2px;overflow:hidden;box-shadow:0 2px 8px #20193533}.photo{object-fit:cover;width:100%;height:100%}.ocm-wave{clip-path:none;z-index:2;background:0 0;flex-direction:column;justify-content:flex-end;height:1.98in;padding:0;display:flex;position:absolute;bottom:0;left:0;right:2px;overflow:hidden}.wave-art{width:100%;height:100%;position:absolute;inset:0}.wave-band,.wave-band-1,.wave-band-2,.wave-band-3{display:none}.valid-label,.valid-until,.valid-date{z-index:5;color:#fff;letter-spacing:0;margin:0;font-size:.075in;position:absolute}.valid-label{bottom:41.08px;left:1.1in}.valid-until{font-size:.067in;font-weight:700;bottom:.28in;left:.93in}.valid-date{font-size:.065in;font-weight:700;bottom:.28in;right:15.76px}.error{color:var(--danger);font-weight:700}.print-instructions{margin-top:.8rem}@media print{body{background:#fff}.header,.print-instructions,.error{display:none}.page{max-width:none;padding:0}.preview-grid{display:block}.print-sheet{width:2.125in;height:3.375in;box-shadow:none;page-break-after:auto;break-after:auto;border:.01in solid #8e8e8e;border-radius:0;margin:0 auto}.card-front{width:2.125in;height:3.375in;padding:.14in .11in .08in}}@media (width<=700px){.header{flex-direction:column;align-items:flex-start}}