.disable {
            text-decoration: line-through;
        }
        a { text-decoration: none; }
        .default {
            width: 690px;
            margin: 0 auto;
            margin-top: 60px;

            transform: rotate(-2deg);
            -ms-transform: rotate(-2deg);
            -o-transform: rotate(-2deg);
            -moz-transform: rotate(-2deg);
            -webkit-transform: rotate(-2deg);
        }
        .page {
            width: 825px;
            height: 676px;
            margin: 0 auto;
            position: relative;
            background-image: url('/media/bg-dark.jpg');
            background-position: center center;
            background-repeat: no-repeat;
        }
        .plain-text {
            word-wrap: break-word; white-space: pre-wrap;
            display: block;
            font-family: monospace;
            font-size: 14px;
        }
        body {
            background-color: #000000;
            color: #555555;
        }
        #riddle {
            position: absolute;
            top: 28px;
            left: 46px;

            transform: rotate(-3deg);
            -ms-transform: rotate(-3deg);
            -o-transform: rotate(-3deg);
            -moz-transform: rotate(-3deg);
            -webkit-transform: rotate(-3deg);
        }
        #clues {
            position: absolute;
            top: 230px;
            left: 65px;

            width: 470px;
            height: 290px;

            transform: rotate(-2deg);
            -ms-transform: rotate(-2deg);
            -o-transform: rotate(-2deg);
            -moz-transform: rotate(-2deg);
            -webkit-transform: rotate(-2deg);
        }
        #hints {
            z-index: 2;
            position: absolute;
            top: 225px;
            left: 550px;

            transform: rotate(5deg);
            -ms-transform: rotate(5deg);
            -o-transform: rotate(5deg);
            -moz-transform: rotate(5deg);
            -webkit-transform: rotate(5deg);
        }
        #previous_riddles {
            position: absolute;
            top: 533px;
            left: 62px;
            font-size: 11px;

            -ms-transform: rotate(-3deg);
            -o-transform: rotate(-3deg);
            -moz-transform: rotate(-3deg);
            -webkit-transform: rotate(-3deg);
        }
        #next_riddle {
            position: absolute;
            top: 498px;
            left: 490px;
            transform: rotate(-3deg);
            -ms-transform: rotate(-3deg);
            -o-transform: rotate(-3deg);
            -moz-transform: rotate(-3deg);
            -webkit-transform: rotate(-3deg);
        }
        #feedback {
            z-index: 2;
            position: absolute;
            top: 50px;
            right: 45px;
            transform: rotate(5deg);
            -ms-transform: rotate(5deg);
            -o-transform: rotate(5deg);
            -moz-transform: rotate(5deg);
            -webkit-transform: rotate(5deg);
        }
        #links {
            z-index: 2;
            position: absolute;
            top: 65px;
            right: 50px;
            text-align: right;
            transform: rotate(5deg);
            -ms-transform: rotate(5deg);
            -o-transform: rotate(5deg);
            -moz-transform: rotate(5deg);
            -webkit-transform: rotate(5deg);
        }
        #donate {
            position: absolute;
            bottom: 65px;
            left: 295px;
            transform: rotate(-2deg);
            -ms-transform: rotate(-2deg);
            -o-transform: rotate(-2deg);
            -moz-transform: rotate(-2deg);
            -webkit-transform: rotate(-2deg);
        }
        #back_to_riddle {
            position: absolute;
            top: 60px;
            left: 60px;
            transform: rotate(-5deg);
            -ms-transform: rotate(-5deg);
            -o-transform: rotate(-5deg);
            -moz-transform: rotate(-5deg);
            -webkit-transform: rotate(-5deg);
        }
        #about_hints {
            font-size: 12px;
            position: absolute;
            top: 295px;
            left: 535px;
            transform: rotate(5deg);
            -ms-transform: rotate(5deg);
            -o-transform: rotate(5deg);
            -moz-transform: rotate(5deg);
            -webkit-transform: rotate(5deg);
        }
        .chest_area { position: absolute; height: 200px; width: 430px; left: 20px; top: 85px; }
        .answer { position: absolute; top: 150px; left: 50px; width: 150px; text-transform: uppercase; }
        .unlock { position: absolute; top: 150px; left: 213px; }
        .chest_locked { position: absolute; top: 0px; left: 40px; pointer-events:none;  }
        .chest_unlocked { position: absolute; display: none; top: 0px; left: 33px;  }
        .chest_hints { position: absolute; left: 200px; }
        .next {
            display: none;
            position: absolute;
            top: 130px;
            left: 220px;
        }
        .back {
            position: absolute;
            top: 150px;
            left: 0;
        }
        .back.the_end {
            top: 170px;
        }
        .frame {
            position: absolute;
        }
        .treasure {
            position: absolute;
            top: 38px;
            left: 190px;
        }
        #payment_qr {
            width: 180px;
            height: 180px;
            position: absolute;
            top: 70px;
            left: 300px;
        }
    
.archive-notice {max-width: 825px; margin: 12px auto; color: #c9c9c9; font: 13px/1.5 monospace; padding: 0 12px;}
.archive-notice a {color: #e3cc85;}
.archive-message {color: #f0d0a0; min-height: 1.5em;}
.plain-text a {color: #0000ee;}
.archive-notice + .page {margin-top: 12px;}
@media (max-width: 850px) {body {margin: 0;} }
@media (prefers-reduced-motion: no-preference) {.chest_area.wrong {animation: shake .3s;} @keyframes shake {25%,75% {transform: translateX(-8px);} 50% {transform: translateX(8px);}}}

.archive-message {position:absolute;top:177px;left:0;width:420px;font-size:12px;}

.archive-stage {width:min(825px,calc(100vw - 16px));height:calc(676px * var(--archive-scale,1));margin:0 auto;}
.page {margin:0;transform:scale(var(--archive-scale,1));transform-origin:top left;}
.archive-notice {box-sizing:border-box;}