:root {
    --bg: #1c1d1e;
    --divider: #363943;
    --element-bg: #292f3a;
    --text: #d5dfe2;
    --text-sec: #8aaeb2;
    --accent: #375765;
    --element-bg-sec: #1f232a;
}
* {
    color: var(--text);
    font-family: "Arial","sans-serif";
}
body {
    background: var(--bg);
}
a, a#download_button~span {
    display: none;
}
a[href], a#download_button[href]~span {
    display: flex;
}
button {
    background: var(--element-bg);
    border: none;
    border-radius: 6px;
    height: 36px;
    padding: 4px 16px;
    transition: filter 200ms;
}
button:hover {
    filter: brightness(120%);
}
#iframe-wrapper {
    width: 600px;
    height: 450px;
    overflow: hidden;
    border: 1px solid var(--accent);
    border-radius: 8px;
    margin-bottom: 8px;
}
iframe {
    width: 1200px;
    height: 900px;
    transform: scale(0.5);
    transform-origin: 0 0;
    border: 0;
}
div#color-selection {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
    margin-bottom: 8px;
}
[data-bgcolor="transparent"] {
    background:
            repeating-conic-gradient(#2e2e2e 0% 25%, transparent 0% 50%)
            50% / 20px 20px
}
button[data-bgcolor="transparent"] {
    background:
            repeating-conic-gradient(#2e2e2e 0% 25%, transparent 0% 50%)
            50% / 24px 24px
}
[data-bgcolor="blue"] {
    background: #2727c5;
}
[data-bgcolor="grey"] {
    background: #454545;
}
button.switch_iframe_bg {
    width: 24px;
    height: 24px;
    border: none;
    border-radius: 4px;
    padding: 0;
    flex-shrink: 0;
}
input#prm-url {
    background: var(--element-bg);
    border-radius: 6px;
    height: 28px;
    width: clamp(240px,90vw,700px);
    border: none;
    padding: 4px 12px;
}
input#prm-url::placeholder {
    color: var(--text-sec);
}
input#prm-url:focus-visible {
    outline: var(--accent) solid 1px;
}
div#standing_download {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}
a#download_button {
    gap: 4px;
    background: var(--element-bg);
    border-radius: 6px;
    font-size: 20px;
    padding: 12px 20px;
    text-decoration: none;
    align-items: center;
}
a#download_button::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224px%22%20viewBox%3D%220%20-960%20960%20960%22%20width%3D%2224px%22%20fill%3D%22%23e3e3e3%22%3E%3Cpath%20d%3D%22M480-337q-8%200-15-2.5t-13-8.5L308-492q-12-12-11.5-28t11.5-28q12-12%2028.5-12.5T365-549l75%2075v-286q0-17%2011.5-28.5T480-800q17%200%2028.5%2011.5T520-760v286l75-75q12-12%2028.5-11.5T652-548q11%2012%2011.5%2028T652-492L508-348q-6%206-13%208.5t-15%202.5ZM240-160q-33%200-56.5-23.5T160-240v-80q0-17%2011.5-28.5T200-360q17%200%2028.5%2011.5T240-320v80h480v-80q0-17%2011.5-28.5T760-360q17%200%2028.5%2011.5T800-320v80q0%2033-23.5%2056.5T720-160H240Z%22%2F%3E%3C%2Fsvg%3E");
    height: 24px;
}