:root{--bg:#f6f3f7;--panel:#fff;--lav:#e9e1ee;--purple:#4d3c68;--yellow:#f4eb17;--green:#cfe8ca;--amber:#f4dba0;--blue:#cfe0ef;--red:#efc8cb;--line:#ddd6df}
*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif;color:#29262b}header,nav,main{max-width:1180px;margin:auto}header{padding:34px 22px 18px}.badge{background:var(--yellow);padding:7px 15px;border-radius:20px;font-weight:800}h1{font-size:44px;margin:16px 0 4px}header p{margin:0}.status{margin-top:10px;font-size:13px}.status.ok{color:#27723a}.status.err{color:#a22}
nav{display:flex;gap:10px;flex-wrap:wrap;padding:0 22px 22px}button,.filebtn{border:0;border-radius:18px;padding:11px 18px;font-weight:800;background:var(--lav);cursor:pointer}nav button.active{background:var(--yellow)}main{padding:0 22px 60px}.panel{display:none;background:var(--panel);border-radius:24px;padding:28px;box-shadow:0 4px 18px #0000000a}.panel.active{display:block}.titleline{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.titleline h2{margin-right:auto}input{border:1px solid var(--line);border-radius:14px;padding:12px 14px;font-size:16px;background:white}.person,.row,.history{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px;border-bottom:1px solid #eee}.person small,.row small{display:block;color:#777;margin-top:4px}.actions{display:flex;gap:8px;flex-wrap:wrap}.green{background:var(--green)}.amber{background:var(--amber)}.blue{background:var(--blue)}.danger{background:var(--red)}.ghost{padding:8px 12px}.form,.forms{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}.formbox,.cardbox{background:#faf8fb;border:1px solid var(--line);border-radius:20px;padding:20px;margin:14px 0}.formbox{display:grid;gap:10px;min-width:280px}.cardhead{display:flex;justify-content:space-between;align-items:center;font-size:20px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:15px 0}.stats div{background:#f0ecf2;border-radius:14px;padding:14px}.stats strong{display:block;font-size:28px}.salesTotal{font-size:42px;font-weight:900;margin-top:16px}.filebtn{display:inline-block;margin-left:8px}.filebtn input{display:none}.warning{background:#fff6d9;padding:14px;border-radius:12px}.muted{color:#777}.overlay{position:fixed;inset:0;background:#f6f3f7f2;z-index:99;display:grid;place-items:center}.overlay.hidden{display:none}.login{background:white;padding:30px;border-radius:24px;width:min(420px,90vw);display:grid;gap:12px}
.member-body{background:#eee9f0}.member-root{max-width:780px;margin:auto;padding:30px 18px}.member-name,.member-card,details{background:#fff;border-radius:26px;padding:26px;margin-bottom:18px}.member-name{font-size:28px;font-weight:900}.member-kicker{color:var(--purple);font-weight:800}.member-title{font-size:26px;font-weight:900;display:flex;justify-content:space-between;gap:10px;align-items:end}.member-title strong{font-size:50px;color:var(--purple)}.member-title small{font-size:16px}.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:22px 0}.slot{aspect-ratio:1/1;border:2px solid var(--purple);border-radius:18px;display:grid;place-content:center;text-align:center}.slot b{font-size:27px;color:var(--purple)}.slot small{display:block}.slot.empty{border-color:#d8d1dd}.member-stats{display:grid;grid-template-columns:1fr 1fr 1.5fr;border-top:1px solid #ddd;padding-top:18px;text-align:center;gap:8px}.member-stats b{display:block;font-size:38px;color:var(--purple)}.member-stats b small{font-size:14px}.member-stats strong{display:block;margin-top:12px}.small .member-title{font-size:20px}details summary{font-size:20px;font-weight:900;cursor:pointer;margin-bottom:18px}
@media(max-width:700px){h1{font-size:34px}.panel{padding:18px}.person{align-items:flex-start;flex-direction:column}.stats{grid-template-columns:1fr 1fr 1fr}.slots{grid-template-columns:repeat(4,1fr)}.slot b{font-size:20px}.member-stats{grid-template-columns:1fr 1fr}.member-stats>div:last-child{grid-column:1/-1}.member-title{font-size:21px}.member-title strong{font-size:38px}}

.usage-breakdown{margin-top:12px;padding:10px 14px;background:#f6f2f8;border-radius:12px;color:#4d3c68}.slot.transfer{background:#eef5fb}.slot.absent{border-style:dashed;background:#fff8e8}.stats small{display:block;margin-top:5px;font-size:12px;color:#666}

.card-control-block{margin:12px 0 18px}.card-control-block label{display:grid;gap:8px;max-width:520px}.card-control-block select{border:1px solid var(--line);border-radius:14px;padding:12px 14px;font-size:16px;background:white}.card-attendance-box{background:#faf8fb;border:1px solid var(--line);border-radius:20px;padding:20px;margin:16px 0 22px}.card-attendance-controls{display:flex;align-items:end;justify-content:space-between;gap:14px;flex-wrap:wrap}.card-attendance-controls label{display:grid;gap:7px}.card-attendance-box h4{margin:22px 0 4px}

.student-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:10px 0 14px;max-width:900px}
.student-choice{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:#fff;cursor:pointer;text-align:left}
.student-choice.selected{outline:3px solid #e8df00;background:#fffde8}
.student-choice small{font-weight:400;opacity:.7}
.select-fallback{margin-top:8px}
.card-attendance-box[hidden]{display:none!important}

.card-section-title{margin:28px 0 12px}.expired-label{display:inline-block;padding:2px 8px;border-radius:999px;background:#f2d6d6;font-weight:700}.ticket-validity{min-width:180px}.ticket-validity span{display:block;font-size:.85rem;margin-bottom:4px}