@import url('variables.css');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;background:var(--bg);color:var(--text);line-height:1.5;min-height:100dvh;-webkit-tap-highlight-color:transparent}
body.has-contact-footer.has-bottom-nav{padding-bottom:calc(var(--contact-footer-h) + var(--nav-h) + env(safe-area-inset-bottom))}
#app-root{max-width:720px;margin:0 auto}
#app-main{padding:calc(var(--header-h) + 12px) 16px calc(var(--nav-h) + 80px);min-height:50vh}
.page-title{font-size:1.3rem;font-weight:800;margin-bottom:10px}
.card{background:var(--card);border-radius:var(--radius);padding:16px;margin-bottom:12px;box-shadow:0 4px 16px rgba(0,0,0,.06)}
.muted{color:var(--text-secondary);font-size:.875em}
.empty-hint{text-align:center;padding:24px}
.hero-card{display:flex;align-items:center;gap:14px}
.hero-avatar{font-size:3rem;line-height:1}
.bento-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:12px}
.kpi-card{text-align:center;padding:14px!important;border:none;width:100%;cursor:pointer;font-family:inherit;color:inherit;-webkit-tap-highlight-color:transparent}
.kpi-card:active{transform:scale(.98);background:color-mix(in srgb,var(--primary) 8%,var(--card))}
.kpi-num{display:block;font-size:1.6rem;font-weight:800;color:var(--primary)}
.badge-alert{background:color-mix(in srgb,var(--accent) 20%,var(--card));font-weight:600}
.thumb-row{display:flex;gap:8px;overflow-x:auto;padding:4px 0}
.thumb-row img{width:64px;height:64px;border-radius:12px;object-fit:cover;cursor:pointer;flex-shrink:0}
.semester-chips,.tab-row,.filter-row,.theme-picks{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.kpi-row{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;gap:8px;margin:10px 0}
.kpi-row strong{display:block;font-size:1.2rem;color:var(--primary)}
.compare-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.form-stack{display:flex;flex-direction:column;gap:10px}
.form-stack input,.form-stack select,.form-stack textarea{padding:12px;border:1px solid rgba(0,0,0,.1);border-radius:12px;font-size:1rem;font-family:inherit}
.header-row{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:var(--card);border-bottom:1px solid rgba(0,0,0,.06)}
.header-brand{font-weight:800;font-size:1rem}
.header-actions{display:flex;gap:6px}
#app-header{position:fixed;top:0;left:0;right:0;z-index:50;background:var(--card);padding-top:env(safe-area-inset-top);border-bottom:1px solid rgba(0,0,0,.06);pointer-events:none}
#app-header *{pointer-events:auto}
#child-switcher{display:flex;gap:6px;padding:4px 16px 8px;background:var(--card);overflow-x:auto}
.child-chip{border:2px solid rgba(0,0,0,.08);background:var(--bg);border-radius:999px;padding:6px 12px;font-size:.8rem;cursor:pointer;white-space:nowrap;font-family:inherit}
.child-chip.active{border-color:var(--primary);font-weight:700}
#app-main{padding-top:calc(var(--header-h) + 36px)}
