.qr.small{max-width:220px}
.seats{display:flex!important;flex-wrap:wrap;gap:8px}
.seat{border:2px solid #22c55e;border-radius:12px;padding:8px;text-align:center;position:relative;background:#f6ffed;color:#16a34a;white-space:nowrap;font-size:12px;flex:0 0 calc(20% - 8px)}
.nav-icons svg{display:block}
.form-row{display:flex;align-items:center;gap:10px}
.section-title{display:inline-block;background:linear-gradient(90deg,#22c55e,#10b981);color:#fff;padding:6px 10px;border-radius:10px;margin-bottom:6px;font-weight:600}
.section-title.blue{background:linear-gradient(90deg,#3b82f6,#60a5fa)}
.section-title.orange{background:linear-gradient(90deg,#f59e0b,#f97316)}
.divider{height:1px;background:#e2e8f0;margin:12px 0;border-radius:2px}
.notice-bar{display:flex;align-items:center;gap:8px;background:linear-gradient(90deg,#fde68a,#fcd34d);border-radius:10px;padding:6px 10px;color:#7c2d12}
.notice-bar .icon{width:18px;height:18px;background:#ef4444;border-radius:50%}
.notice-bar .label{font-weight:600;white-space:nowrap}
.notice-track{overflow:hidden;display:flex;align-items:center}
.notice-marquee{display:inline-block;white-space:nowrap;animation:marquee 30s linear infinite}
@keyframes marquee{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}
.hint{display:inline-block;background:linear-gradient(90deg,#3b82f6,#60a5fa);color:#fff;padding:6px 10px;border-radius:10px;margin-top:8px}
.grid .column{display:flex;flex-direction:column}
.bottom-spacer{margin-top:auto}
.qr.narrow{max-width:80%}
.tabbar a.home{color:#1d4ed8}
.tabbar a.event{color:#ef4444}
.tabbar a.group{color:#10b981}
.tabbar a.wish{color:#f59e0b}
.tabbar a.admin{color:#8b5cf6}
.card li div{margin:4px 0}
.message-card{background:#fff;border-radius:12px;box-shadow:0 6px 16px rgba(0,0,0,.08);padding:10px;margin:10px 0}
.nickname{color:#1d4ed8;font-weight:600}
.avatar{width:24px;height:24px;border-radius:50%;background:#3b82f6;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px;margin-right:6px}
.msg-content{line-height:1.8}
.msg-content.collapsed{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.reveal{opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.reveal.visible{opacity:1;transform:none}
.pill.today{background:#fef3c7;color:#b45309;box-shadow:0 2px 8px rgba(180,83,9,.2)}
.pill.soon{background:#dcfce7;color:#166534;box-shadow:0 2px 8px rgba(22,101,52,.18)}
.pill.future{background:#e0e7ff;color:#1d4ed8;box-shadow:0 2px 8px rgba(29,78,216,.18)}
.pill.passed{background:#fee2e2;color:#b91c1c;box-shadow:0 2px 8px rgba(185,28,28,.18)}
.pill-icon{margin-right:6px;display:inline-block}
@keyframes pillPulse{0%{transform:scale(1);opacity:.9}50%{transform:scale(1.06);opacity:1}100%{transform:scale(1);opacity:.9}}
.pill.soon .pill-icon,.pill.today .pill-icon{animation:pillPulse 2s ease-in-out infinite}
/* Photo Grid */
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px;padding:4px}
.photo-grid li{background:#fff;padding:4px;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.1);margin:0;display:flex;align-items:center;justify-content:center}
.photo-grid img{width:100%;height:130px;object-fit:cover;border-radius:2px;display:block;cursor:zoom-in}
/* Album Grid */
.album-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;padding:4px}
.album-card{background:#fff;border-radius:12px;box-shadow:0 6px 16px rgba(0,0,0,.08);padding:8px;display:flex;flex-direction:column;align-items:center}
.album-cover{width:100%;height:120px;object-fit:cover;border-radius:10px;background:linear-gradient(90deg,#e2e8f0,#f1f5f9)}
.album-name{margin-top:8px;font-weight:600;text-align:center;font-size:14px;color:#1e293b}
.album-count{margin-top:4px;color:#64748b;font-size:12px}
.album-more{margin-top:6px;background:#eff6ff;color:#1d4ed8;border:none;padding:6px 10px;border-radius:8px;cursor:pointer;font-size:12px}
/* 3x2 Grid for Classmates Page */
.photo-grid-3x2{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:0;margin:0}
.photo-grid-3x2 li{background:none;padding:0;margin:0;box-shadow:none;border-radius:8px;overflow:hidden;aspect-ratio:1/1}
.photo-grid-3x2 img{width:100%;height:100%;object-fit:cover;border-radius:0;display:block;cursor:zoom-in}
