:root{
    --color-0: #345;
    --color-h1: #c54;
    --color-h2: #567;
    --color-links: #8ae;

    --color-result-0: 
    --bg-0: #f8f8f8;
}


a{color: var(--color-links);}
body{
    margin: 1em;
    color: var(--color-0);
    background: var(--bg-0);
    font-family: verdana,arial;
}

footer{ position: fixed; bottom: 0; left: 0; width: 100%; padding: 1em; background: #eee; text-align: center;}
h1{color: var(--color-h1)}
h2{color: var(--color-h2)}

section{
    margin: 1em 0;
    padding: 0.2em;
    border-top: 2px solid #eee;
    border-radius: 1em;
}

td{vertical-align: top;}

.app{
    margin: 1em;
    border: 2px solid;
    border-radius: 0.3em;
    padding: 1em; 
}

.float-right{float: right;}

.app .title{font-weight: bold; font-size: 130%; cursor: pointer;}

.app .details{display: none;}

.result0{background:#dfd    !important; background: linear-gradient(#dfd,#beb)!important;       color:#080}
.result1{background:#eee    !important; background: linear-gradient(#eee,#ddd)!important;       color:#666;}
.result2{background:#fff8d0 !important; background: linear-gradient(#fff0d0,#ffe0a0)!important; color:#870;}
.result3{background:#fcd    !important; background: linear-gradient(#fcd,#faa)!important;       color:#800;}