:root{--bg-primary:#f2f2f7;--bg-secondary:#fff;--bg-tertiary:#f9f9f9;--text-primary:#1c1c1e;--text-secondary:#3c3c43;--text-tertiary:#8e8e93;--separator:rgba(60,60,67,.12);--accent:#34A853;--accent-light:rgba(52,168,83,.12);--blue:#007AFF;--blue-light:rgba(0,122,255,.12);--orange:#FF9500;--purple:#AF52DE;--card-shadow:0 1px 3px rgba(0,0,0,.04);--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--tab-height:83px;--header-height:110px}
@media(prefers-color-scheme:dark){:root{--bg-primary:#000;--bg-secondary:#1c1c1e;--bg-tertiary:#2c2c2e;--text-primary:#fff;--text-secondary:#ebebf5;--text-tertiary:#8e8e93;--separator:rgba(84,84,88,.65);--accent-light:rgba(52,168,83,.2);--blue-light:rgba(0,122,255,.2);--card-shadow:0 1px 3px rgba(0,0,0,.2)}}
[data-theme=dark]{--bg-primary:#000;--bg-secondary:#1c1c1e;--bg-tertiary:#2c2c2e;--text-primary:#fff;--text-secondary:#ebebf5;--text-tertiary:#8e8e93;--separator:rgba(84,84,88,.65);--accent-light:rgba(52,168,83,.2);--blue-light:rgba(0,122,255,.2);--card-shadow:0 1px 3px rgba(0,0,0,.2)}
[data-theme=light]{--bg-primary:#f2f2f7;--bg-secondary:#fff;--bg-tertiary:#f9f9f9;--text-primary:#1c1c1e;--text-secondary:#3c3c43;--text-tertiary:#8e8e93;--separator:rgba(60,60,67,.12);--accent-light:rgba(52,168,83,.12);--blue-light:rgba(0,122,255,.12);--card-shadow:0 1px 3px rgba(0,0,0,.04)}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display',system-ui,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.47;-webkit-font-smoothing:antialiased;overscroll-behavior:none;padding-top:var(--header-height);padding-bottom:var(--tab-height)}
a{text-decoration:none;color:inherit}
.nav-bar{position:fixed;top:0;left:0;right:0;z-index:100;background:var(--bg-secondary);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:.5px solid var(--separator);padding-top:var(--safe-top)}
.nav-title{font-size:28px;font-weight:700;letter-spacing:-.4px}
.nav-subtitle{font-size:11px;color:var(--text-tertiary);margin-top:1px}
.nav-btn{width:36px;height:36px;border-radius:50%;border:none;background:var(--bg-tertiary);color:var(--accent);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .1s}
.nav-btn:active{transform:scale(.92)}
.tab-bar{position:fixed;bottom:0;left:0;right:0;z-index:100;background:var(--bg-secondary);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-top:.5px solid var(--separator);display:flex;justify-content:space-around;padding:8px 0;padding-bottom:calc(8px + var(--safe-bottom))}
.tab-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 12px;color:var(--text-tertiary);transition:color .2s;min-width:64px}
.tab-item.active{color:var(--accent)}
.tab-item svg{width:24px;height:24px}
.tab-item span{font-size:10px;font-weight:500}
.content{padding:24px 16px 20px}
.filters{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap;align-items:center}
.filter-select{padding:8px 14px;border:1px solid var(--separator);border-radius:10px;font-size:13px;background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;outline:none;-webkit-appearance:none;appearance:none;font-family:inherit;flex:1;min-width:0}
.filter-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.filter-buttons{display:flex;background:var(--bg-tertiary);border-radius:9px;padding:2px}
.filter-btn{padding:7px 14px;border:none;background:none;border-radius:7px;font-size:12px;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s;font-family:inherit;display:flex;align-items:center;gap:4px;white-space:nowrap}
.filter-btn.active{background:var(--bg-secondary);color:var(--text-primary);font-weight:600;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.filter-btn.active.pre-active{color:var(--accent)}.filter-btn.active.amt-active{color:var(--blue)}
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:20px}
.stat-box{background:var(--bg-secondary);border-radius:12px;padding:16px;box-shadow:var(--card-shadow)}
.stat-box .value{font-size:28px;font-weight:700;color:var(--accent);line-height:1.2}
.stat-box .label{font-size:12px;color:var(--text-tertiary);margin-top:2px;font-weight:500}
.stat-box.blue .value{color:var(--blue)}
.next-class{background:linear-gradient(135deg,var(--accent),#2d8a33);border-radius:16px;padding:20px;margin-bottom:20px;color:#fff}
.next-class .lbl{font-size:12px;font-weight:500;opacity:.85;text-transform:uppercase;letter-spacing:.5px}
.next-class .cn{font-size:19px;font-weight:700;margin-top:6px;line-height:1.3}
.next-class .cm{font-size:14px;margin-top:6px;opacity:.9}
.next-class .cb{display:inline-flex;align-items:center;gap:4px;margin-top:10px;padding:4px 10px;background:rgba(255,255,255,.2);border-radius:6px;font-size:12px;font-weight:600}
.accordion{background:var(--bg-secondary);border-radius:12px;margin-bottom:12px;overflow:hidden;box-shadow:var(--card-shadow)}
.accordion-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;cursor:pointer;user-select:none;border:none;background:none;width:100%;text-align:left;color:var(--text-primary);font-family:inherit;transition:background .15s}
.accordion-header:active{background:var(--bg-tertiary)}
.ah-left{display:flex;align-items:center;gap:10px}
.ah-left .ml{font-size:15px;font-weight:600}
.ah-left .mc{font-size:12px;color:var(--text-tertiary);background:var(--bg-tertiary);padding:2px 8px;border-radius:10px;font-weight:500}
.accordion-chevron{transition:transform .3s cubic-bezier(.4,0,.2,1);color:var(--text-tertiary)}
.accordion.open .accordion-chevron{transform:rotate(90deg)}
.accordion-body{max-height:0;overflow:hidden;transition:max-height .35s cubic-bezier(.4,0,.2,1)}
.accordion.open .accordion-body{max-height:3000px}
.accordion-body-inner{border-top:.5px solid var(--separator)}
.si{display:flex;align-items:center;padding:14px 16px;gap:14px;border-bottom:.5px solid var(--separator)}
.si:last-child{border-bottom:none}
.si-date{min-width:48px;text-align:center}
.si-date .n{font-size:22px;font-weight:600;line-height:1.1}
.si-date .d{font-size:11px;color:var(--text-tertiary);text-transform:uppercase;font-weight:500}
.si-info{flex:1;min-width:0}
.si-info .t{font-size:15px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.si-info .s{font-size:13px;color:var(--text-tertiary);margin-top:2px}
.badge{padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600;flex-shrink:0}
.badge.pre{background:var(--accent-light);color:var(--accent)}
.badge.amt{background:var(--blue-light);color:var(--blue)}
.materia-card{background:var(--bg-secondary);border-radius:12px;padding:16px;margin-bottom:12px;box-shadow:var(--card-shadow)}
.mh{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}
.mi{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px}
.mm{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.mc2{display:flex;align-items:center;gap:4px;background:var(--bg-tertiary);padding:5px 10px;border-radius:6px;font-size:12px;color:var(--text-secondary)}
.tc{padding:5px 10px;border-radius:6px;font-size:11px;font-weight:600;display:inline-flex;align-items:center;gap:4px}
.tc.pre{background:var(--accent-light);color:var(--accent)}.tc.amt{background:var(--blue-light);color:var(--blue)}
.card-group{background:var(--bg-secondary);border-radius:12px;margin-bottom:20px;overflow:hidden;box-shadow:var(--card-shadow)}
.card-group-title{font-size:13px;font-weight:600;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.2px;padding:24px 16px 8px}
.sr{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:.5px solid var(--separator)}
.sr:last-child{border-bottom:none}
.btn{padding:8px 16px;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.btn-green{background:var(--accent);color:#fff}
.btn-blue{background:var(--blue);color:#fff}
.btn-orange{background:var(--orange);color:#fff}
.btn-full{width:100%;padding:14px;font-size:16px;border-radius:12px;margin-top:12px}
.empty-state{text-align:center;padding:48px 24px;color:var(--text-tertiary)}
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;background:var(--bg-secondary);border-radius:12px;padding:12px 16px;box-shadow:var(--card-shadow)}
.cal-nav .month{font-size:17px;font-weight:600}
.cal-nav a{width:36px;height:36px;border:none;background:var(--bg-tertiary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--accent)}
.cal-header{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:8px}
.cal-header span{text-align:center;font-size:11px;font-weight:600;color:var(--text-tertiary);text-transform:uppercase;padding:4px}
.cal-body{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;background:var(--bg-secondary);border-radius:12px;padding:8px;box-shadow:var(--card-shadow)}
.cc{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:12px;font-size:15px;color:var(--text-primary);gap:3px;border:.5px solid var(--separator)}
.cc.empty{border-color:transparent;color:transparent}
.cc.today{background:var(--accent);color:#fff;font-weight:600;border-color:transparent}
.cc.hc{font-weight:500;cursor:pointer}
.cc.hc.bp{border:2px solid var(--accent)}.cc.hc.ba{border:2px solid var(--blue)}.cc.hc.bm{border:2px solid var(--purple)}
.dots{display:flex;gap:3px;height:6px}
.dots .dot{width:6px;height:6px;border-radius:50%}
.dots .dot.pre{background:var(--accent)}.dots .dot.amt{background:var(--blue)}
@media(min-width:768px){body{max-width:700px;margin:0 auto}.nav-bar,.tab-bar{max-width:700px;left:50%;transform:translateX(-50%)}.stats-grid{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1024px){body{max-width:800px}.nav-bar,.tab-bar{max-width:800px}}

/* Modal */
.modal-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.4);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:opacity .25s}
.modal-overlay.open{opacity:1;pointer-events:auto}
.modal-sheet{background:var(--bg-secondary);border-radius:16px 16px 0 0;width:100%;max-width:700px;max-height:70vh;overflow-y:auto;transform:translateY(100%);transition:transform .35s cubic-bezier(.32,.72,0,1);padding-bottom:env(safe-area-inset-bottom,0px)}
.modal-overlay.open .modal-sheet{transform:translateY(0)}
.modal-handle{width:36px;height:5px;border-radius:3px;background:var(--text-tertiary);opacity:.4;margin:8px auto 0}
.modal-hdr{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;border-bottom:.5px solid var(--separator)}
.modal-hdr .mt{font-size:17px;font-weight:600}
.modal-close{width:30px;height:30px;border-radius:50%;background:var(--bg-tertiary);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-tertiary);font-size:16px}
.modal-close:active{transform:scale(.9)}
.modal-body{padding:8px 0}

/* Print styles for PDF export */
@media print {
  .nav-bar, .tab-bar, .filters, .filter-buttons, .btn-pdf, .modal-overlay { display: none !important; }
  body { padding: 0; background: #fff; color: #000; }
  .content { padding: 16px; }
  .accordion-body { max-height: none !important; }
  .accordion { break-inside: avoid; }
  .print-header { display: block !important; text-align: center; margin-bottom: 24px; padding-bottom: 16px; border-bottom: 2px solid #34A853; }
  .print-header img { width: 60px; height: 60px; border-radius: 50%; margin-bottom: 8px; }
  .print-header h2 { font-size: 18px; margin: 4px 0; }
  .print-header p { font-size: 12px; color: #666; }
}
.print-header { display: none; }
.btn-pdf { display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border:none;background:var(--accent);color:#fff;border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;margin-bottom:16px }
.btn-pdf:active { transform:scale(.96); }