:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:manipulation;--clip-edge: 10px;--clip-corner: 15px;--frame-border-radius: 16px;--frame-shadow: 0 10px 40px rgba(0, 0, 0, .3)}*{box-sizing:border-box;margin:0;padding:0}html{height:100%;height:100dvh}body{margin:0;height:100%;height:100dvh;min-height:100vh;min-height:100dvh;overflow:hidden;background-color:#000;position:relative}#background-image{position:fixed;top:calc(-1*env(safe-area-inset-top,0px));left:calc(-1*env(safe-area-inset-left,0px));width:calc(100% + env(safe-area-inset-left,0px) + env(safe-area-inset-right,0px));height:calc(100% + env(safe-area-inset-top,0px) + env(safe-area-inset-bottom,0px));object-fit:cover;object-position:center;z-index:-1;-webkit-transform:translateZ(0);transform:translateZ(0);will-change:transform}#app{width:100vw;height:100vh;height:100dvh;display:flex;align-items:start;justify-content:center;padding-top:calc(1rem + env(safe-area-inset-top,0px));padding-right:calc(1rem + env(safe-area-inset-right,0px));padding-bottom:calc(1rem + env(safe-area-inset-bottom,0px));padding-left:calc(1rem + env(safe-area-inset-left,0px));cursor:pointer;-webkit-tap-highlight-color:transparent}.container{width:100%;max-width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;padding-top:20%}#course-display{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:100%;max-width:90vw}.image-frame{position:relative;display:inline-block;max-width:300px;box-shadow:var(--frame-shadow);border-radius:var(--frame-border-radius);overflow:hidden;transition:transform .2s ease;background:transparent}.image-frame.showing-questionmark{box-shadow:none;max-width:200px}#course-image{display:block;width:calc(100% + (var(--clip-edge) * 2));height:auto;margin:calc(-1 * var(--clip-edge));transition:opacity .2s ease;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;height:160px}.image-frame.showing-questionmark #course-image{width:100%;margin:0}#course-name{font-size:1.5rem;font-weight:600;text-align:center;color:#fffffff2;text-shadow:2px 2px 4px rgba(0,0,0,.3);padding:0 1rem}#instruction{font-size:1rem;color:#fffc;text-align:center;transition:opacity .3s ease;text-shadow:1px 1px 2px rgba(0,0,0,.3);padding:0 1rem}html,body{position:fixed;width:100%;height:100%;overflow:hidden}@media(max-width:768px){.image-frame{max-width:85vw}.image-frame.showing-questionmark{max-width:150px}#course-name{font-size:1.25rem}#instruction{font-size:.9rem}}img{-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none;pointer-events:none}