:root{--font-family-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";--font-family-base: var(--font-family-system);--font-size-base: 1rem;--font-size-primary: calc(1.6 * var(--font-size-base));--font-size-secondary: calc(1.2 * var(--font-size-base));--spacer: calc(var(--font-size-base) * .5);--color-background: #1a5d63;--color-background-dark: #154a4f;--color-background-darker: hsla(185, 59%, 0%, 60%);--color-foreground: #fef0d5;--color-primary: #00beb2;--color-primary-dark: #00a49a;--color-primary-darker: #008b82;--color-secondary: #d81e5b;--color-secondary-dark: #c21b52;--color-secondary-darker: #ab1848;--border-width: calc(.3 * var(--spacer));--border-radius: var(--spacer)}@font-face{font-family:Inter;font-weight:400;src:url(/fonts/Inter-Regular.woff2),local("Inter");font-display:swap}@font-face{font-family:Inter;font-weight:700;src:url(/fonts/Inter-Bold.woff2),local("Inter");font-display:swap}*{box-sizing:border-box;-webkit-user-select:none;user-select:none}html{height:100%;background:var(--color-background);color:var(--color-foreground);font-family:var(--font-family-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:var(--font-size-base);letter-spacing:-.03em;line-height:1;overscroll-behavior-y:contain}body{margin:0;height:100%;background:var(--color-background)}#app{background:var(--color-background);display:flex;width:100%;min-height:100%;flex-direction:column;text-align:center}#app::backdrop{background:var(--color-background)}#app.fonts-loaded{--font-family-base: "Inter", var(--font-family-system);font-family:var(--font-family-base)}.close-button,.pull-left{position:absolute;left:0;font-size:var(--font-size-secondary);padding:0 calc(var(--spacer) * 2);color:var(--color-primary)}.close-button{color:var(--color-secondary)}.pull-right{position:absolute;right:0;color:var(--color-primary);font-size:var(--font-size-secondary);padding:0 calc(var(--spacer) * 2)}.pull-right svg{margin-left:calc(var(--spacer) * 2)}header{padding-top:calc(env(safe-area-inset-top) + (var(--spacer) * 2));padding-bottom:calc(var(--spacer) * 2);padding-left:calc(env(safe-area-inset-left) + (var(--spacer) * 2));padding-right:calc(env(safe-area-inset-right) + (var(--spacer) * 2));background:var(--color-background-darker);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);position:sticky;top:0;z-index:5}main{display:flex;width:100%;flex:1;flex-direction:column;justify-content:center;align-content:center;overflow:hidden}nav{display:flex;flex-direction:row-reverse;width:100%;padding-left:calc(env(safe-area-inset-left) + (var(--spacer)));padding-right:calc(env(safe-area-inset-right) + (var(--spacer)));padding-bottom:calc(env(safe-area-inset-bottom) + var(--spacer))}nav p{padding:(var(--spacer) / 2)}#app:fullscreen{height:100%}#app:fullscreen header{position:relative;flex:0}#app:fullscreen main{position:relative;flex:1}#app:fullscreen .content{display:flex;height:100%;overflow-y:scroll;flex-direction:column}#app:fullscreen nav{flex:0}@media (orientation: landscape){nav{flex-direction:row-reverse}}@media (orientation: portrait){nav{flex-direction:column}nav p button{padding-top:calc(var(--spacer) * 3);padding-bottom:calc(var(--spacer) * 3)}}@media (min-width: 1024px){:root{--font-size-base: 3vh}}h1{margin:0}h3{margin:0;font-size:var(--font-size-secondary)}#timer{color:var(--color-primary);font-weight:400}p{margin:calc(var(--spacer) / 2);align-content:center}main p{margin:var(--spacer);flex-grow:0}nav p{flex:1}button{--button-color: var(--color-primary);--button-color-hover: var(--color-primary-dark);--button-color-focus: var(--color-primary-darker);display:block;width:100%;padding:calc(var(--spacer)) calc(var(--spacer) * 2);font-family:var(--font-family-base);font-weight:700;font-size:var(--font-size-base);line-height:1;border:none;border-radius:var(--border-radius);outline:none;touch-action:manipulation;-webkit-appearance:button;-moz-appearance:button;appearance:button;-webkit-tap-highlight-color:transparent;color:var(--color-foreground);background:var(--button-color);cursor:pointer;box-shadow:2px 2px 5px #0000004d}nav button{padding:calc(var(--spacer) * 2)}button.inline{width:auto;display:inline-block;margin:0 var(--spacer);padding:calc(var(--spacer))}button:hover{background-color:var(--button-color-hover)}button:active,button:focus{background-color:var(--button-color-focus);border:none;outline:0}button.alt{color:var(--color-background-dark)}button::-moz-focus-inner{border-style:none;padding:0}button .icon{margin-right:.2em}svg[data-icon]{cursor:pointer}#start,#correct{--button-color: var(--color-primary);--button-color-hover: var(--color-primary-dark);--button-color-focus: var(--color-primary-darker)}#skip,#reset,#random,button.destructive{--button-color: var(--color-secondary);--button-color-hover: var(--color-secondary-dark);--button-color-focus: var(--color-secondary-darker)}.delete-button{color:var(--color-secondary)}main.home{margin:0 auto}main.home h4{font-size:var(--font-family-base);font-weight:400;margin:calc(var(--spacer) * 2)}main.home .content{padding:calc(2 * var(--spacer)) var(--spacer)}main.home .content>*{max-width:40rem;margin-left:auto;margin-right:auto}#app:not(:fullscreen) #compress{display:none}#app:not(:-ms-fullscreen) #compress{display:none}#app:not(:-webkit-full-screen) #compress{display:none}.topic-list{display:flex;flex-direction:row;flex-wrap:wrap;padding:0;align-items:stretch;justify-content:center;gap:var(--spacer)}.topic-list p{flex:1 1 40%;padding:0;margin:0}.topic-list p button{height:100%}@media (min-width: 768px){.topic-list p{flex-basis:30%}}main.editor{max-width:calc(30 * var(--font-size-base));margin:0 auto;justify-content:flex-start}main.editor p{position:relative}input{-webkit-user-select:text;user-select:text;display:block;width:100%;font:inherit;font-size:var(--font-size-secondary);text-align:center;background:var(--color-background-dark);color:var(--color-foreground);border:var(--border-width) solid transparent;padding:var(--spacer);border-radius:var(--border-radius)}input:focus{outline:0;border:var(--border-width) solid var(--color-primary)}span.item-delete{display:block;position:absolute;right:calc(var(--spacer) + var(--border-width));top:calc(var(--spacer) + var(--border-width));font-size:var(--font-size-secondary);color:var(--color-background)}input:focus+span.item-delete{visibility:visible;color:var(--color-primary)}button+span.item-delete{color:var(--color-background-dark)}.info{margin:calc(var(--spacer) * 2) 0}.info .label{color:var(--color-foreground);padding-bottom:var(--spacer)}.info .value{font-weight:700;font-size:var(--font-size-primary)}.info .option{display:inline-block;padding:0 var(--spacer);color:var(--color-primary)}.info .option.selected{color:var(--color-foreground)}main.results .content{padding:calc(2 * var(--spacer)) var(--spacer)}main.results ol{list-style:none outside;columns:10rem 3;column-gap:var(--font-size-base);margin:0;padding:0}main.results li{margin:0 0 var(--font-size-base);font-size:var(--font-size-secondary);color:var(--color-primary);font-weight:700;break-inside:avoid}main.results li.correct{color:var(--color-foreground)}hr{box-sizing:content-box;height:0;margin:var(--spacer);border:solid var(--color-background-dark);border-width:var(--border-width) 0 0 0}