#main {
        background-color: rgba(255, 255, 255, var(--bg-alpha));
}

#calculation {
    width: min(1200px, 88%);
    margin: 0 auto;
    box-sizing: border-box;
}

.form-row.inline-row {
    display: flex;
    gap: 12px;
    align-items: center;
}

.form-row { margin-bottom: 1.25rem; }

.form-row.inline-row .form-field {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
}

.form-field label { margin-bottom: 6px; font-weight: 600; }
.form-field input[type="text"], .form-field input[type="email"], .form-field input[type="number"] {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.06);
    padding: 10px 12px;
    border-radius: 8px;
    transition: box-shadow 120ms ease, transform 80ms ease;
}
.form-field select {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.06);
    padding: 10px 12px;
    border-radius: 8px;
    transition: box-shadow 120ms ease, transform 80ms ease;
}

.form-field select, #year-select, #country {
    position: relative;
    z-index: 1160; 
}
.form-field input[type="text"]:hover, .form-field input[type="email"]:hover, .form-field input[type="number"]:hover,
.form-field input[type="text"]:focus, .form-field input[type="email"]:focus, .form-field input[type="number"]:focus {
    box-shadow: 0 6px 18px rgba(16,32,42,0.06);
    outline: none;
}
.form-field select:hover, .form-field select:focus { box-shadow: 0 6px 18px rgba(16,32,42,0.06); outline: none; }

.switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
}
.switch input { display: none; }
.switch .track {
    width: 44px; height: 24px; border-radius: 14px; background: rgba(0,0,0,0.08); position: relative; transition: background 160ms ease;
}
.switch .thumb { width: 18px; height: 18px; background: #fff; border-radius: 50%; position: absolute; top: 3px; left: 3px; box-shadow: 0 6px 16px rgba(16,32,42,0.08); transition: left 160ms ease, background 160ms ease; }
.switch input:checked + .track { background: rgba(165,204,212,1); }
.switch input:checked + .track .thumb { left: 23px; }
.switch .labeltext { font-size: 0.95rem; }

.criteria-category {
    margin-bottom: 18px;
}
.criteria-list {
    display: grid;
    gap: 12px;
}

.criterion-row {
    padding: 8px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.criterion-row .crit-name { font-weight: 700; margin-bottom: 6px; text-align: center; }
.criterion-row .crit-input-wrap { display:flex; align-items:center; gap:8px; flex: 1 1 auto; justify-content: center; }
.criterion-row input.crit-input { background: #fff; border: 1px solid rgba(0,0,0,0.06); padding: 8px 10px; border-radius: 6px; }
.criterion-row .crit-total { color: #666; }
.criterion-row .crit-percent { margin-left: 8px; font-weight:600; color:#0f2430; }
.criterion-row .crit-rank { margin: 6px 0 0 0; color:#6b777b; font-weight:600; text-align: center; }

#category-summaries { display:flex; gap: 18px; justify-content: center; margin-top: 18px; }
.category-summary { background: transparent; padding: 8px 12px; border-radius:8px; min-width:260px; }
.category-summary strong { display:block; margin-bottom:6px; }

.specific-categories {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.category-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.cat-toggle { background: transparent; border: 1px solid rgba(0,0,0,0.06); border-radius:6px; padding:4px 8px; cursor:pointer; font-weight:700; }
.criteria-category.collapsed .criterion-row:not(.category-total-row) { display: none; }

.section-base h2 { margin-top: 0; margin-bottom: 10px; font-size: 1.05rem; }

#overall-summary { text-align: left; margin-top: 12px; padding: 8px 10px; border-radius: 8px; display:flex; align-items:center; gap:10px; }
#overall-summary .overall-value { font-weight: 700; margin-left: 8px; }
#overall-summary .overall-rank { font-weight:700; color:#6b777b; }

.criterion-row.category-total-row { background: rgba(0,0,0,0.02); padding: 10px; border-radius: 6px; }
.criterion-row.category-total-row .crit-name { text-transform: uppercase; }
.criterion-row.category-total-row .crit-percent { font-weight:700; }
.cat-total-wrap { display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; }
.criterion-row.category-total-row .cat-total-wrap { align-items:center; justify-content:center; }
.criterion-row.category-total-row .crit-input-wrap { flex: 1 1 auto; }
.criterion-row.category-total-row .crit-percent { display:block; text-align:center; width:100%; }

@media (max-width: 900px){
    .form-row.inline-row {
        flex-direction: column;
        align-items: stretch;
    }
    .specific-categories { grid-template-columns: 1fr; }
    #calculation { width: min(900px, 96%); }
    #criteria-section .overall-row { width: 100%; }
}

#calculation-result { text-align: center; margin-top: 18px; padding: 10px; }

#overall-summary { display: none; }
.actions-row { display: none; justify-content: center; }

#criteria-section .overall-row {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    background: rgba(0,0,0,0.02);
    padding: 10px;
    border-radius: 6px;
    width: calc((100% - 24px) / 2);
    margin-left: auto;
    margin-right: auto;
}
#criteria-section .overall-row strong { display:block; text-transform:uppercase; font-weight:700; }
#criteria-section .overall-row .overall-rank { color:#6b777b; font-weight:700; }
#criteria-section .overall-row .overall-value { font-weight:700; font-size:1.05rem; }

.calculate-index{
    margin-top: 0.75rem;
    font-size: clamp(0.9rem, 1.6vw, 1.0rem);
    color: white;
    background-color: #A5CCD4;
    padding: 0.6rem 1.2rem;
    border: 2px solid transparent;
    border-radius: 10px;
    transition: background-color 180ms ease, transform 120ms ease, border-color 180ms ease;
}
.calculate-index:hover{ cursor: pointer; background-color: #BDD9DF; border-color: rgba(0,0,0,0.08); transform: translateY(-2px); }

#criteria-section{
    padding-top: 0;
}