.cls{container:cls / inline-size;position:relative;isolation:isolate;display:grid;grid-template-rows:auto minmax(0,1fr);background:var(--bg-elev);overflow:hidden}.cls-screen{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0}.cls-top{display:flex;align-items:center;gap:10px;padding:8px 14px;border-bottom:1px solid var(--line);background:var(--bg-elev);min-width:0}.cls-brand{display:inline-flex;align-items:center;gap:7px;font-weight:750;color:var(--accent-ink);white-space:nowrap}.cls-class{margin-inline-start:auto;font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cls-body{display:grid;grid-template:"main" minmax(0,1fr) "nav" auto / minmax(0,1fr);min-height:0}.cls-nav{grid-area:nav;display:flex;border-top:1px solid var(--line);background:var(--bg-elev)}.cls-tab{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 4px 6px;border:0;background:transparent;color:var(--ink-2);font-size:.72rem;cursor:pointer}.cls-tab-t{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cls-tab[aria-current=true]{color:var(--accent-ink);font-weight:700}.cls-tab[aria-current=true] .pa-ico{color:var(--accent)}.cls-tab:hover{background:var(--bg-sunk)}.cls-tab:focus-visible,.cls-photo:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}.cls-badge{position:absolute;top:3px;inset-inline-start:calc(50% + 6px);min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:var(--bad);color:var(--bg);font-size:.66rem;line-height:17px;text-align:center}.cls-main{grid-area:main;min-height:0;overflow:auto;padding:12px 14px 18px;background:var(--bg)}.cls-h{display:flex;align-items:center;gap:8px;font-size:1.05rem;margin:0 0 10px}.cls-h3{font-size:.82rem;font-weight:700;color:var(--ink-3);margin:16px 0 8px}.cls-sub{font-size:.74rem;font-weight:700;color:var(--ink-3)}.cls-lessons,.cls-mats{list-style:none;margin:0;padding:0;display:grid;gap:8px}.cls-lesson{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg-elev)}.cls-lesson.is-now{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.cls-time{display:grid;font-size:.8rem;color:var(--ink-2);font-variant-numeric:tabular-nums}.cls-time b{font-size:.95rem;color:var(--ink)}.cls-lesson-t{display:grid;gap:2px;justify-items:start;min-width:0}.cls-soon{background:var(--accent-soft);color:var(--accent-ink)}.cls-card-list{display:grid;gap:8px}.cls-as{border:1px solid var(--line);border-radius:12px;background:var(--bg-elev);align-items:center}.cls-as-ico{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--accent-soft);color:var(--accent-ink)}.cls-as-t{flex:1;min-width:0;display:grid;gap:2px}.cls-due{display:inline-flex;align-items:center;gap:5px;font-size:.8rem;color:var(--ink-3)}.cls-due.is-due{color:var(--ink-2);font-weight:600}.cls-due .pa-ico,.cls .pa-badge .pa-ico{width:14px;height:14px}.cls-new{background:var(--accent-soft);color:var(--accent-ink)}.pa-badge.cls-done{display:inline-flex;align-items:center;gap:3px;background:var(--ok-bg);color:var(--ok)}.cls-detail-top{display:flex;align-items:center;gap:6px;margin:-4px 0 4px}.cls-posted{margin:-4px 0 10px;font-size:.82rem}.cls-due-box{display:flex;align-items:flex-start;gap:8px;margin:0 0 12px;padding:10px 12px;border-radius:10px;background:var(--bg-sunk);font-size:.9rem}.cls-due-box.is-due{background:var(--warn-bg)}.cls-text{margin:0 0 14px;line-height:1.6;white-space:pre-line;max-width:40rem}.cls-work{padding:12px;border:1px solid var(--line-2);border-radius:12px;background:var(--bg-elev);max-width:40rem}.cls-work-h{display:flex;align-items:center;justify-content:space-between;gap:8px}.cls-files{display:grid;gap:8px;margin-top:10px}.cls-file{display:flex;align-items:center;gap:10px;padding:6px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}.cls-file-th{flex:none;width:48px;border-radius:6px;overflow:hidden}.cls-file-th .cls-thumb{display:block}.cls-file-n{flex:1;min-width:0;font-size:.86rem;overflow-wrap:anywhere}.cls-work-f{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.cls-picker{position:absolute;inset-inline:0;bottom:0;z-index:30;width:min(100%,560px);max-height:86%;margin-inline:auto;overflow:auto;padding:4px 14px 16px;border:1px solid var(--line-2);border-radius:16px 16px 0 0;background:var(--bg-elev);box-shadow:var(--shadow-lg)}.cls-picker[hidden]{display:none}.cls-picker-h{display:flex;align-items:center;justify-content:space-between;padding:6px 0}.cls-picker-note{margin:0 0 10px;font-size:.82rem}.cls-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px}.cls-photo{display:grid;gap:3px;padding:6px;border:1px solid var(--line);border-radius:10px;background:var(--bg);text-align:start;cursor:pointer;min-width:0}.cls-photo:hover{border-color:var(--accent)}.cls-thumb{width:100%;height:auto;aspect-ratio:64 / 60;border-radius:6px;display:block}.cls-photo-n{font-size:.78rem;font-weight:650;overflow-wrap:anywhere}.cls-photo-d{font-size:.72rem}.cls-th-bg{fill:#b98f62}.cls-th-paper{fill:#fbfaf4}.cls-th-ink{fill:none;stroke:#46506a;stroke-width:2.4;stroke-linecap:round}.cls-thumb--dark{filter:blur(1.4px) brightness(.42) contrast(.85)}.cls-thumb--picnic .cls-th-bg,.cls-th-sky{fill:#bfe2f4}.cls-th-sun{fill:#f2c541}.cls-th-hill{fill:#84c06f}.cls-th-hill2{fill:#5f9f52}.cls-thumb--game .cls-th-bg{fill:#2d3348}.cls-th-g1{fill:#6c8cf5}.cls-th-g2{fill:#ef6f6c}.cls-th-g3{fill:#f3c24a}.cls-tip{display:flex;align-items:flex-start;gap:8px;margin:0 0 12px;padding:10px 12px;border-radius:10px;background:var(--accent-soft);font-size:.86rem;max-width:44rem}.cls-mat{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg-elev)}.cls-mat-ico{display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:var(--accent-soft);color:var(--accent-ink)}.cls-mat-ico--pdf{background:var(--bad-bg);color:var(--bad)}.cls-mat-t{display:grid;gap:2px;min-width:0;font-size:.86rem}.cls-mat-t b{font-size:.92rem}.cls-mat-act{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px}.cls-saved{display:inline-flex;align-items:center;gap:4px;color:var(--ok);font-weight:650;font-size:.84rem}.cls-progress{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-variant-numeric:tabular-nums}.cls-bar{display:block;width:84px;height:7px;border-radius:99px;background:var(--line);overflow:hidden}.cls-bar i{display:block;height:100%;background:var(--accent);transition:width .25s}.cls-msgs{display:flex;flex-direction:column;gap:8px;max-width:44rem}.cls-msg{align-self:flex-start;max-width:92%;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg-elev)}.cls-msg.is-stranger{border-color:var(--warn);background:var(--warn-bg)}.cls-msg.is-me{align-self:flex-end;background:var(--accent-soft);border-color:transparent}.cls-msg-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:.78rem}.cls-msg-time{margin-inline-start:auto}.cls-msg p{margin:4px 0 0;line-height:1.5;overflow-wrap:anywhere}.cls-unknown{display:inline-flex;align-items:center;gap:3px;background:var(--bg-elev);color:var(--warn)}.cls-msg-act{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.cls-blocked{display:flex;align-items:center;gap:6px;margin:0;font-size:.82rem}.cls-compose{position:sticky;bottom:-18px;display:flex;gap:6px;max-width:44rem;margin-top:12px;padding:10px 0 18px;background:var(--bg)}@container cls (min-width: 720px){.cls-body{grid-template:"nav main" minmax(0,1fr) / 196px minmax(0,1fr)}.cls-nav{flex-direction:column;gap:2px;padding:10px 8px;border-top:0;border-inline-end:1px solid var(--line)}.cls-tab{flex:none;flex-direction:row;gap:10px;padding:9px 12px;border-radius:9px;font-size:.9rem}.cls-tab[aria-current=true]{background:var(--accent-soft)}.cls-badge{position:static;margin-inline-start:auto}.cls-main{padding:18px 24px 22px}.cls-compose{bottom:-22px;padding-bottom:22px}}@container cls (max-width: 460px){.cls-lesson{grid-template-columns:54px minmax(0,1fr)}.cls-lesson>.cls-join{grid-column:2;justify-self:start}.cls-mat{grid-template-columns:40px minmax(0,1fr)}.cls-mat-act{grid-column:2;justify-content:flex-start}.cls-class{display:none}.cls-top .pa-avatar{margin-inline-start:auto}}