*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;min-height:100vh;overflow-x:hidden;scroll-behavior:smooth;background-color:var(--color-bg)}body{font-family:var(--font-serif);color:var(--color-text);display:flex;flex-direction:column}:root{--font-serif: "Patua One", serif;--font-sans: "League Spartan", sans-serif;--font-title: "Chau Philomene One", sans-serif;--fs-h1: 36px;--fs-h2: 28px;--fs-h3: 22px;--fs-body: 16px;--nav-h: 72px;--footer-h: clamp(220px, 24vh, 280px);--color-primary: #1F5F3A;--color-primary-light: #a1d4a9;--color-accent: #4E9F3D;--color-bg: #FFFFFF;--color-bg-subtle: #F5F9F4;--color-bg-teacher: #233C67;--color-border: rgba(0, 0, 0, .18);--color-text: #1A1A1A;--color-error: #c62828;--color-error-light: #ef5350;--color-accent-teacher: #e6f000;--color-text-muted: #555555;--color-danger-dark: #b53025;--color-modal-bg: #CCDBEE;--space-1: 4px;--space-2: 8px;--space-3: 16px;--space-4: 24px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--btn-radius: var(--radius-md);--btn-radius-pill: 9999px;--btn-font-family: var(--font-sans);--input-radius: var(--radius-md);--elev-1: 0 2px 4px rgba(0, 0, 0, .08);--elev-2: 0 4px 10px rgba(0, 0, 0, .12);--elev-3: 0 6px 20px rgba(0, 0, 0, .18);--shadow-level-1: var(--elev-1);--shadow-level-2: var(--elev-2);--shadow-level-3: var(--elev-3);--elev-4: 2px solid rgba(0, 0, 0, .18);--elev-5: 2px solid rgba(255, 255, 255, .95);--elev-6: 6px solid #1E5128;--elev-7: 6px solid #FFFFFF;--elev-8: 4px solid rgba(255, 255, 255, .95);--elev-9: 3px solid rgba(255, 255, 255, .95);--border-contrast-soft: var(--elev-4);--border-contrast-light: var(--elev-5);--border-hero-strong: var(--elev-6);--border-hero-light: var(--elev-7);--border-card-strong: var(--elev-8);--border-card-soft: var(--elev-9);--ring-accent: 0 0 0 3px rgba(78, 159, 61, .3);--ring-accent-regular: 0 0 0 3px rgba(255, 255, 255, .35);--ring-accent-strong: 0 0 0 3px rgba(46, 125, 50, .18);--ring-accent-medium: 0 0 0 3px rgba(78, 159, 61, .5);--ring-accent-light: 0 2px 4px rgba(255, 255, 255, .6);--overlay-bg: rgba(0, 0, 0, .45);--modal-bg: var(--color-modal-bg);--modal-border-color: var(--color-border);--modal-shadow: var(--elev-3);--modal-title-font: var(--font-serif);--modal-max-w: 520px;--modal-min-w: min(92vw, 520px);--modal-pad-x: var(--space-4);--modal-pad-y: calc(var(--space-4) + var(--space-2));--modal-gap: var(--space-3);--modal-card-bg: var(--color-bg);--modal-card-bg-teacher: var(--color-bg-teacher);--modal-card-border: var(--color-border)}.cdk-overlay-backdrop.cdk-overlay-dark-backdrop{background-color:var(--overlay-bg);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}@media (max-width: 40em){.cdk-global-overlay-wrapper{padding:.75rem}}@media (prefers-reduced-motion: reduce){.cdk-overlay-backdrop.cdk-overlay-dark-backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}}h1,h2,h3{font-family:var(--font-sans);color:var(--color-primary)}h1{font-size:var(--fs-h1);font-weight:700;line-height:var(--lh-tight)}h2{font-size:var(--fs-h2);font-weight:600;line-height:var(--lh-tight)}h3{font-size:var(--fs-h3);font-weight:500;line-height:var(--lh-normal)}p{font-size:var(--fs-body);line-height:var(--lh-normal)}.btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--btn-font-family);font-size:1rem;padding:.8em 1.5em;border-radius:var(--btn-radius);border:.125em solid transparent;cursor:pointer;box-shadow:var(--shadow-level-1);transition:background-color .25s ease,color .25s ease,transform .1s ease,box-shadow .2s ease}.btn--pill{border-radius:var(--btn-radius-pill)}.btn:disabled,.btn[disabled]{opacity:.7;cursor:not-allowed;transform:none}.btn:focus-visible{outline:none;box-shadow:var(--ring-accent)}.btn--primary{background-color:var(--color-accent);color:var(--color-bg);border-color:var(--color-accent)}.btn--primary:not(:disabled):hover{background-color:var(--color-primary);border-color:var(--color-bg);transform:translateY(-1px)}.btn--secondary,.btn--outline{background-color:transparent;color:var(--color-primary);border-color:var(--color-primary)}.btn--secondary:not(:disabled):hover,.btn--outline:not(:disabled):hover{background-color:var(--color-accent);color:var(--color-bg)}.btn--danger{background-color:var(--color-error);color:var(--color-bg);border-color:var(--color-bg)}.btn--danger:not(:disabled):hover{background-color:var(--color-danger-dark)}.input{width:100%;font:inherit;background-color:var(--input-bg, var(--color-bg));color:var(--input-text, var(--color-text));border:1.5px solid var(--input-border-color, var(--color-border));border-radius:var(--input-radius, var(--radius-md));padding:.9em 1em;box-shadow:0 2px #0000001a;transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease,color .2s ease}.input::placeholder{color:var(--overlay-bg);opacity:.85}.input:focus{border-color:var(--color-accent);box-shadow:var(--ring-accent);outline:none}.input:disabled,.input[disabled]{opacity:.6;cursor:not-allowed;background-color:var(--color-bg-subtle)}.input.ng-invalid.ng-touched{border-color:var(--color-error)}.input.ng-valid.ng-touched{border-color:var(--color-primary)}.input--pill{border-radius:var(--btn-radius-pill)}.input--center{text-align:center}:focus-visible{outline:3px solid var(--color-accent);outline-offset:3px}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}body{scrollbar-width:thin;scrollbar-color:var(--color-accent) var(--color-bg-subtle)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-bg-subtle)}::-webkit-scrollbar-thumb{background:var(--color-accent);border-radius:5px;border:2px solid var(--color-bg-subtle)}::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}img{display:block;max-width:100%;height:auto}.legal-article{display:block;color:var(--color-text);line-height:1.8;font-size:var(--fs-body);max-width:70ch;margin-inline:auto}.legal-article .lead{font-size:calc(var(--fs-body) * 1.05);line-height:1.9;color:color-mix(in oklab,var(--color-text) 90%,var(--color-primary) 10%);margin-bottom:var(--space-4)}.legal-article h2{font-size:var(--fs-h2);color:var(--color-primary);font-weight:600;margin-top:calc(var(--space-4) * 1.5);margin-bottom:var(--space-2);line-height:var(--lh-tight);scroll-margin-top:calc(var(--nav-h, 4rem) + var(--space-2))}.legal-article p{margin-bottom:var(--space-3)}.legal-article ul,.legal-article ol{margin:var(--space-2) 0 var(--space-3) var(--space-4);padding:0}.legal-article li+li{margin-top:var(--space-1)}.legal-article li{list-style:disc}.legal-article .grid-list{display:grid;gap:var(--space-2);margin-bottom:var(--space-3)}.legal-article .grid-list>li{list-style:none;padding:var(--space-3);border-radius:var(--radius-md);background:color-mix(in oklab,var(--color-primary) 6%,transparent);border:.075em solid color-mix(in oklab,var(--color-primary) 24%,transparent)}.legal-article a{color:var(--color-accent);text-decoration:underline;text-underline-offset:.2em;transition:color .2s ease,background-color .15s ease,box-shadow .15s ease}.legal-article a:hover,.legal-article a:focus-visible{color:var(--color-primary);text-decoration-thickness:.15em;box-shadow:var(--ring-accent-light)}.legal-note{background:color-mix(in oklab,var(--color-accent) 8%,transparent);border-left:.25em solid var(--color-accent);padding:var(--space-3);margin-top:var(--space-4);border-radius:var(--radius-md);font-size:calc(var(--fs-body) * .95);color:color-mix(in oklab,var(--color-text) 90%,var(--color-accent) 10%)}.legal-note strong{color:var(--color-primary);font-weight:600}.legal-table-wrap{margin-top:var(--space-4)}.legal-table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:var(--radius-md);box-shadow:var( --elev-1, 0 0 .1em rgba(0, 0, 0, .08), 0 .15em .4em rgba(0, 0, 0, .06) )}.legal-table thead th{text-align:left;font-weight:700;color:var(--color-primary);background:color-mix(in oklab,var(--color-primary) 10%,transparent);padding:.8em .9em;border-bottom:.1em solid color-mix(in oklab,var(--color-primary) 25%,transparent);font-size:calc(var(--fs-body) * .95)}.legal-table tbody td{padding:.75em .9em;vertical-align:top;border-bottom:.075em solid color-mix(in oklab,var(--color-primary) 18%,transparent);font-size:calc(var(--fs-body) * .95)}.legal-table tbody tr:last-child td{border-bottom:0}.sr-only{position:absolute!important;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media (max-width: 64em){.legal-article{font-size:.95rem;padding-inline:var(--space-2)}.legal-article h2{font-size:clamp(1.125rem,3.2vw,1.5rem)}}:root.dark .legal-article .grid-list>li{background:color-mix(in oklab,var(--color-primary) 12%,transparent);border-color:color-mix(in oklab,var(--color-primary) 40%,transparent)}:root.dark .legal-note{background:color-mix(in oklab,var(--color-primary) 12%,transparent);border-color:var(--color-primary)}:root.dark .legal-article a{color:var(--color-accent-light, #9ad0ff)}:root.dark .legal-article a:hover{color:var(--color-primary)}.visually-hidden{position:absolute!important;inline-size:1px!important;block-size:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important;padding:0!important;margin:-1px!important}.input::placeholder{opacity:.8}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}@media (forced-colors: active){.btn-success,.btn-secondary,.btn-danger,.pager-arrow,.avatar-arrow,input.input,select.input{border:1px solid ButtonText}.btn-success[disabled]{opacity:1}}app-teacher-main-content{display:block;padding-block-start:1rem;border-block-start:.0625em solid rgba(255,255,255,.1)}[role=form][aria-labelledby=generalFormTitle]{display:grid;gap:1.25rem}.form-group{display:grid;gap:.5rem;position:relative}.form-group label{color:var(--color-bg);text-shadow:0 0 .25em rgba(255,255,255,.15);margin-block-end:.5rem;display:block}.field-hint{display:block;font-size:.9em;opacity:.85;color:var(--color-bg)}.field-counter{position:absolute;inset-inline-end:.75rem;inset-block-end:0rem;font-size:.85em;opacity:.8;pointer-events:none}.form-group:has(#roomNameCount) input.input{padding-inline-end:3.25rem}.field-error{margin-block-start:.25rem;color:var(--color-error);font-size:.95em}input.input.ng-invalid.ng-touched:not([disabled]){outline:.125em solid var(--color-error);outline-offset:.0625em}.field-row{display:grid;grid-template-columns:1fr auto;gap:.75rem;align-items:center}.toggle-inline{margin-top:1em;text-align:center;display:inline-flex;flex-direction:column;align-items:center;gap:.4rem;cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--color-bg);-webkit-tap-highlight-color:transparent}.toggle-inline>input[type=checkbox]{appearance:none;-webkit-appearance:none;inline-size:1.35em;block-size:1.35em;border-radius:.35em;border:.125em solid rgba(255,255,255,.45);background:transparent;position:relative;outline:none;cursor:pointer;transition:background-color .18s ease,border-color .18s ease,transform 80ms ease}.toggle-inline>input[type=checkbox]:active{transform:scale(.96)}.toggle-inline>input[type=checkbox]:checked{background-color:var(--color-accent);border-color:var(--color-accent)}.toggle-inline>input[type=checkbox]:after{content:"";position:absolute;inline-size:.3em;block-size:.9em;border-right:.18em solid transparent;border-bottom:.18em solid transparent;inset-block-start:.02em;inset-inline-start:.42em;transform:rotate(45deg) scale(0);transform-origin:50% 80%;transition:transform .18s ease}.toggle-inline>input[type=checkbox]:checked:after{border-color:var(--color-bg);transform:rotate(45deg) scale(1)}.toggle-inline>span{display:block;margin:0;font-size:.92rem;letter-spacing:.015em;text-shadow:0 0 .25em rgba(255,255,255,.1);text-align:center;line-height:1.1}@media (prefers-reduced-motion: reduce){.toggle-inline>input[type=checkbox],.toggle-inline>input[type=checkbox]:after{transition:none!important}}@media (forced-colors: active){.toggle-inline>input[type=checkbox]{border-color:ButtonText;background:Canvas}.toggle-inline>input[type=checkbox]:checked{background:Highlight;border-color:Highlight}.toggle-inline>input[type=checkbox]:after{border-color:Canvas}}input.input,select.input{margin-block-start:.5rem;background-color:var(--color-bg-teacher);color:var(--color-bg);border:none;padding:.9rem 1rem;border-radius:.75rem;font-size:1rem;inline-size:100%}.input[disabled]{opacity:.6;cursor:not-allowed;filter:grayscale(.1)}input.input:focus-visible,.btn-success:focus-visible,.btn-secondary:focus-visible,.btn-danger:focus-visible,.toggle-inline>input:focus-visible,.pager-arrow:focus-visible,.avatar-arrow:focus-visible,.pager-dots .dot:focus-visible{outline:.125em solid var(--color-primary-light);outline-offset:.1em}.form-actions{display:inline-grid;grid-auto-flow:column;gap:.75rem;align-items:center}.btn-success{background:var(--color-accent);color:var(--color-bg);font-family:var(--font-serif);border:.125em solid var(--color-bg);padding:.7rem 1.6rem;border-radius:.75rem;cursor:pointer;margin-block-start:1rem;transition:background .16s ease,transform .12s ease}.btn-success:hover{background:var(--color-primary);transform:translateY(-.05em)}.btn-success[disabled]{opacity:.6;cursor:not-allowed;transform:none!important;filter:grayscale(.1)}.btn-secondary{background-color:var(--color-bg-teacher);color:var(--color-bg);border:.125em solid var(--color-bg);font-family:var(--font-serif);padding:.7rem 1.2rem;margin-block-start:1em;border-radius:.75rem;cursor:pointer;transition:background .16s ease,transform .12s ease,border-color .16s ease}.btn-secondary:hover{background:#ffffff0f;transform:translateY(-.05em)}.btn-danger{cursor:pointer;background:var(--color-error);color:var(--color-bg);font-family:var(--font-serif);padding:.7rem 1.5rem;border-radius:.75rem;border:.125em solid var(--color-bg);display:inline-flex;align-items:center;gap:.5rem;transition:background .16s ease,transform .12s ease}.btn-danger:hover{background-color:#b53025;transform:translateY(-.05em)}.btn-danger .icon{inline-size:1.15em;block-size:1.15em;margin-inline-end:.55rem;flex-shrink:0;translate:0 .03em}.btn-danger .icon-trash{stroke:currentColor}.btn-danger:hover .icon-trash{stroke-width:2}[main-aside]{border-inline-start:.09375em solid rgba(255,255,255,.15);padding-inline-start:2rem}.info-block{color:var(--color-bg)}.info-block h4{margin-block-end:.3rem;color:var(--color-bg);text-shadow:0 0 .25em rgba(255,255,255,.15)}.info-block p{margin-block-end:1rem;color:#ffffffd9}.danger-zone{display:flex;justify-content:flex-end;margin-block-start:2rem}.students-list{display:flex;flex-direction:column;height:100%;min-height:22rem;gap:var(--space-3);position:relative}.students-items{flex:1 1 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--space-2);align-content:start}.students-items2{flex:0 0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--space-2);align-content:start}@media (max-width: 40em){.students-items{grid-template-columns:minmax(0,1fr)}}.student-item{display:flex;align-items:center;gap:var(--space-2);font-size:.98rem;line-height:1.1;min-height:3.25rem;padding:.65rem .85rem;border-radius:var(--radius-md);background:#0000002e;border:1px solid rgba(255,255,255,.18);box-shadow:var(--elev-1);cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .18s ease,border-color .18s ease}.student-item:hover{transform:translateY(-1px);background:#00000042;border-color:#ffffff52;box-shadow:var(--elev-2)}.student-item:focus-within{outline:none;box-shadow:var(--ring-accent-medium)}.student-avatar-wrap{position:relative;display:inline-block;flex:0 0 auto}.student-avatar{inline-size:2.625em;block-size:2.625em;border-radius:50%;object-fit:cover;background:#ffffff0f;box-shadow:0 0 0 .125em #ffffff2e,var(--elev-1);transition:filter .18s ease,opacity .18s ease}.student-avatar.offline{filter:grayscale(.7) brightness(.9);opacity:.75}.status-dot{position:absolute;inset-block-start:.1rem;inset-inline-end:.1rem;inline-size:.65rem;block-size:.65rem;background:var(--color-accent);border-radius:50%;box-shadow:0 0 0 .125rem #00000059}.student-name{color:var(--color-bg);font-weight:600;font-size:1rem;text-shadow:0 0 .25em rgba(0,0,0,.28);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.students-controls{flex-shrink:0;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:.75rem;margin-top:auto;padding-top:1rem;border-top:.0625em solid rgba(255,255,255,.1)}.students-controls2{flex-shrink:0;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:.75rem;margin-top:0;padding-top:1rem;border-top:.0625em solid rgba(255,255,255,.1)}.pager-arrow{background:transparent;border:.125em solid rgba(255,255,255,.35);color:var(--color-bg);inline-size:2.25em;block-size:2.25em;border-radius:9999px;display:inline-grid;place-items:center;font-size:1.2rem;line-height:1;opacity:.6;transition:background .16s ease,transform .12s ease}.pager-arrow:hover{background:#ffffff14;transform:translateY(-.05em)}.pager-dots{display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.pager-dots .dot{inline-size:.6em;block-size:.6em;background:#ffffff59;border-radius:9999px;display:inline-block;outline:none}.pager-dots .dot.active{background:var(--color-accent);transform:scale(1.1)}.students-counter{justify-self:end;color:#ffffffd9;font-weight:600}.add-form{display:flex;flex-direction:column;gap:1rem}.add-form h3{font-family:var(--font-serif);font-size:1.35rem;text-align:center;color:var(--color-bg);text-shadow:0 0 .25em rgba(255,255,255,.15);margin-block-end:.5rem}.avatar-selector{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;justify-items:center}.avatar-arrow{background:transparent;border:.125em solid rgba(255,255,255,.35);color:var(--color-bg);inline-size:2.25em;block-size:2.25em;border-radius:9999px;display:inline-grid;place-items:center;cursor:pointer;transition:background .16s ease,transform .12s ease}.avatar-arrow:hover{background:#ffffff14;transform:translateY(-.05em)}.avatar-selected{inline-size:4.25em;block-size:4.25em;border-radius:50%;box-shadow:0 0 0 .25em #fff3,0 0 0 .5em #0003}@media (max-width: 56.25em){[main-aside]{padding-inline-start:0;border-inline-start:none;margin-block-start:2rem}.students-controls{grid-template-columns:auto 1fr auto auto;grid-auto-flow:column}}.fullscreen{width:100%;height:100%}.no-scroll{overflow:hidden!important}