.attendance-page {width: 87.5rem;margin: 0 auto;box-sizing:border-box;}
/* ============================================================ Header ============================================================ */ 
.attendance-header{text-align:center;margin-bottom:1rem}
.attendance-header h1{margin:0;font-size:3.5rem;line-height:1;font-weight:800;color:#f0ff00}
.attendance-month{margin-top:1rem;font-size:1.25rem;font-weight:700;color:#ffffff}
/* ============================================================ Weekday ============================================================ */ 
.attendance-weekdays{display:grid;grid-template-columns:repeat(7, 1fr);gap:0.25rem}
.attendance-weekday{height:2.25rem;display:flex;align-items:center;justify-content:center;background:#31577d;border-radius:0.3rem;color:#ffffff;font-size:0.9rem}
.attendance-weekday.sunday{color:#ff4054}
.attendance-weekday.saturday{color:#168cff}
/* ============================================================ Days ============================================================ */ 
.attendance-days{display:grid;grid-template-columns:repeat(7, 1fr);gap:0.25rem;margin-top:0.25rem}
.attendance-day{position:relative;min-height:5rem;background:#242424;border-radius:0.3rem;overflow:hidden}
/* ============================================================ Empty ============================================================ */ 
.attendance-day.empty{background:transparent}
/* ============================================================ Date ============================================================ */ 
.attendance-day-number{position:absolute;top:0.35rem;left:0.45rem;z-index:2;font-size:0.9rem;font-weight:700;color:#ffffff}
.attendance-day.sunday .attendance-day-number{color:#ff4054}
.attendance-day.saturday .attendance-day-number{color:#168cff}
/* ============================================================ Weekend ============================================================ */ 
.attendance-day.sunday .attendance-day-number{color:#ff4054}
.attendance-day.saturday .attendance-day-number{color:#168cff}
/* ============================================================ Future ============================================================ */ 
.attendance-day.future{background:#303030}
.attendance-day.future .attendance-day-number{color:#666666}
/* ============================================================ Missed ============================================================ */ 
.attendance-missed{width:3rem;height:3rem;position:absolute;left:50%;top:50%;transform:translate(-50%, -45%);opacity:0.15;border:0.2rem solid #999999;border-radius:50%}
/* ============================================================ Empty Future ============================================================ */ 
.attendance-empty{width:100%;height:100%}
/* ============================================================ Avatar / Stamp ============================================================ */ 
.attendance-stamp{position:absolute;left:50%;top:50%;transform:translate(-50%, -42%);width:3.2rem;height:3.2rem;display:flex;align-items:center;justify-content:center;opacity:0.55;filter:grayscale(100%)}
.attendance-stamp img{width:100%;height:100%;object-fit:cover;border-radius:50%}
/* ============================================================ Rank ============================================================ */ 
.attendance-rank{position:absolute;right:0.35rem;bottom:0.25rem;font-size:0.65rem;color:#aaaaaa}
/* ============================================================ Today ============================================================ */ 
.attendance-day.today{box-shadow:inset 0 0 0 0.1rem #f0ff00}
/* ============================================================ Summary ============================================================ */ 
.attendance-summary{display:grid;grid-template-columns:repeat(2, 1fr);gap:0.5rem;margin-top:0.75rem}
.attendance-summary-item{padding:0.75rem;background:#292929;border-radius:0.35rem;text-align:center}
.attendance-summary-item span{display:block;margin-bottom:0.25rem;font-size:0.8rem;color:#888888}
.attendance-summary-item strong{font-size:1.4rem;color:#ffffff}
.attendance-summary-item em{margin-left:0.15rem;font-size:0.75rem;font-style:normal;color:#888888}