@keyframes fade-and-scale-in{0%{opacity:0;transform:scale(.01)}to{opacity:1;transform:scale(1)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes progress-animation{0%{transform:scaleX(0)}to{transform:scaleX(1)}}:root{font-family:Gudea,Arial,Helvetica,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#fff;background-color:#000;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background-image:url(/images/foyer.webp);background-size:cover;background-position:center center}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0006;view-transition-name:body}h1{font-size:clamp(24px,4vw,48px);line-height:1.1}h1,p{text-shadow:0 0 .05em rgba(0,0,0,1),0 0 .25em rgba(0,0,0,.5)}#app{position:relative;z-index:1;max-width:1280px;margin:0 auto;padding:2rem;text-align:center}input,button{border:none;border-bottom:2px solid rgba(0,0,0,.25);padding:.4em;font-size:1em;font-weight:400;font-family:inherit;white-space:nowrap;background-color:#fff}input{display:inline-block;min-width:25ch}input:focus{outline:none;border-bottom-color:#646cff}button{padding:.6em 1.2em;border:1px solid rgba(0,0,0,.25);border-radius:4px;cursor:pointer}button:hover{border-color:currentColor}button:focus{outline:none}button:focus-visible{outline:4px auto -webkit-focus-ring-color}ul{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;list-style:none;margin:0;padding:0}li{display:flex;min-width:0;list-style:none}dialog{max-width:calc(100svw - 40px);max-height:calc(100svh - 40px);padding:20px;border:none;border-radius:4px;filter:drop-shadow(0 0 10px #0006);animation:fade-and-scale-in .2s}.password{width:fit-content;padding:3em}.password form{display:grid;grid-template-columns:repeat(3,auto);grid-template-rows:repeat(2,auto);gap:10px;align-items:center}.password input{grid-column:2 / 3}.password form button:not([type=button]){grid-column:1 / 4}.password form button[type=button]{grid-column:3 / 4;width:38px;height:38px;padding:2px}.password form button[type=button] svg{width:100%;max-width:none;height:100%}#reader{width:90vmin}.close{position:absolute;z-index:1;top:0;right:0;padding:10px 10px 20px 20px;border:none;border-radius:0 0 0 100%;box-shadow:-1px 1px 3px #0006}main>.close,.add-personnel{position:fixed;padding:10px;background:none;color:#fff;border-radius:50%;box-shadow:none;opacity:.5;filter:drop-shadow(0 0 3px #0006)}.add-personnel{z-index:1;top:0;left:0;border:none}.add-personnel:hover{color:#fff}::backdrop{background-color:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fade-in .2s}.add{display:inline-flex;align-items:center;gap:8px;margin-bottom:30px}.classes{width:800px;view-transition-name:dialog-classes}.classes::backdrop{view-transition-name:backdrop-classes}::view-transition-group(dialog-classes){z-index:2}::view-transition-group(backdrop-classes){z-index:1}.class-pupils{width:1000px;view-transition-name:dialog-class-pupils}.class-pupils::backdrop{view-transition-name:backdrop-class-pupils}::view-transition-group(dialog-class-pupils){z-index:4}::view-transition-group(backdrop-class-pupils){z-index:3}.personnel{max-width:1000px;view-transition-name:dialog-personnel}.personnel::backdrop{view-transition-name:backdrop-personnel}::view-transition-group(dialog-personnel){z-index:2}::view-transition-group(backdrop-personnel){z-index:1}::view-transition-group(*){z-index:0}img{max-width:75%;height:auto}svg:not(.icon){max-width:25%;height:auto}.icon{width:24px;height:24px}.pupil,.button-personnel{position:relative;display:flex;align-items:center;gap:5px;padding:.6em .6em .6em .3em;-webkit-user-select:none;user-select:none}.pupil .icon,.button-personnel .icon{position:absolute;top:1px;left:1px}.pupil-class{--size: 3ch;position:relative;bottom:1px;display:inline-block;min-width:var(--size);width:var(--size);height:var(--size);margin-left:2px;background-color:#666;color:#fff;border-radius:50%;text-align:center;line-height:var(--size);vertical-align:middle}.button-personnel{background-color:#fbf8b6}.pupil svg:not(.icon),.button-personnel img{--size: 3em;display:block;min-width:var(--size);width:var(--size);height:var(--size);margin:calc((2.5em - var(--size)) / 2) 0;border-radius:50%}progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:absolute;top:1px;right:2px;left:2px;display:block;width:auto;height:4px;background:#666;transform:scaleX(0);transform-origin:left}progress::-webkit-progress-bar{display:none}progress::-webkit-progress-value{display:none}progress::-moz-progress-bar{display:none}progress::-ms-fill{display:none}progress.animate{animation-name:progress-animation;animation-duration:5s;animation-timing-function:linear}
