body {
    background: #1e1e1e;
    color: #d6d6d6;
    font-family: Arial, sans-serif;
    text-align: center;
    margin: 0;
    padding: 20px;
}

h1 { color:#a32626; }

.card {
    background:#2a2a2a;
    border:1px solid #6e1e1e;
    border-radius:10px;
    padding:25px;
    width:1000px;
    margin:auto;
}

button {
    background:#7a1c1c;
    color:#eee;
    border:none;
    padding:10px 16px;
    margin:8px;
    border-radius:5px;
    cursor:pointer;
}

button:hover:not(:disabled){ background:#a82828; }
button:disabled{ background:#444; }

.loader {
    border:6px solid #333;
    border-top:6px solid #a82828;
    border-radius:50%;
    width:46px;
    height:46px;
    animation:spin 1s linear infinite;
    margin:15px auto;
}

.hidden{ display:none; }

@keyframes spin{ 100%{ transform:rotate(360deg);} }

.waiting-box {
    margin-top:40px;
    font-size:18px;
    color:#888;
}

/* compare */

.compare-row {
    display:flex;
    gap:24px;
    justify-content:center;
    margin-top:20px;
}

.zoom-box {
    width:440px;
    height:440px;
    overflow:auto;
    border:1px solid #6e1e1e;
    background:#111;
}

/* slider */

.slider-wrap { width:700px; margin:auto; }
.slider-box { position:relative; }
.slider-box img { width:100%; display:block; }
.slider-overlay { position:absolute; top:0; left:0; }

/* footer */

.footer {
    margin-top:30px;
    padding:18px;
    border-top:1px solid #333;
}

.social-title {
    margin-top:14px;
    color:#cfcfcf;
}

/* social icons */

.social-row {
    display:flex;
    justify-content:center;
    gap:18px;
    margin-top:10px;
}

.social-icon,
.social-icon:visited,
.social-icon:link {
    width:38px;
    height:38px;
    background:#2b2b2b;
    border:1px solid #5a1a1a;
    border-radius:8px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    transition:0.2s;
}

.social-icon svg {
    width:20px;
    height:20px;
    fill:#e6e6e6;
}

.social-icon:hover {
    background:#a32626;
    transform:translateY(-2px);
}

.social-icon:hover svg {
    fill:#ffffff;
}
