body {
    overflow: hidden;
}



header {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.netsite-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
}

.netsite-label {
    font-family: pixeloperator;
    font-weight: bold;
    font-size: 16px;
}

/* === Default / 2.0 (Current style) === */
body.era-2-0 .navbar {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background: #dcdcdc;
    padding: 0;
    border-bottom: 2px solid #aaa;
    font-family: sans-serif;
}

body.era-2-0 .tab-label {
    text-align: center;
    font-size: 12px;
    font-family: 'Courier New', Courier, monospace;
    margin-top: 2px;

}

body.era-2-0 #reset-button {

    text-align: center;
    background: #e0e0e0;
    border-radius: 8px;
    margin-right: -0.4em;
    margin-left: auto;
    margin-right: 10px;
    cursor: pointer;
    gap: 8px;
    font-size: 14px;
    border: 0px;
    font-family: sans-serif;

}

body.era-2-0 #reset-buttom img {
    height: 16px;
    width: 16px;
}

body.era-2-0 .nav-tab {
    position: relative;
    background: #e0e0e0;
    margin-right: -0.4em;
    border-radius: 8px;
    cursor: pointer;
    gap: 8px;
    font-size: 14px;
    transition: background 0.2s ease-in-out;
    border: 0px;
}



body.era-2-0 .nav-tab img.tab-icon {
    height: 16px;
    width: 16px;
}

body.era-2-0 .nav-tab.active {
    background: #fff;
    font-weight: bold;
    z-index: 2;
    border-color: #999;
    box-shadow: inset 2px 2px 5px white;
    box-shadow: 2px 2px 5px darkgray;
    border-radius: 8px;

}




/* === Web 1.0 Style === */

body.era-1-0 .bigbar {
    font-size: 14px;
    background: #fff;
    padding: 6px 12px;
    margin: 0;
    border-top: 1px solid #ccc;
    border-bottom: 2px solid #999;
    font-family: pixelarial;
}

body.era-1-0 #reset-button {
    margin-left: auto;
    margin-right: 10px;
    padding: 8px 12px;
    background: #e0e0e0;
    border-color: white;
    box-shadow: inset 2px 2px 0px white;
    box-shadow: 2px 2px 0px rgb(0, 0, 0);

}

body.era-1-0 #reset-button img {
    height: 32px;
    width: 32px;
}

body.era-2-5 #reset-button img {
    height: 32px;
    width: 32px;
}

#reset-button img {
    height: 16px;
    width: 16px;
}

body.era-1-0 .navbar {
    display: flex;
    background: #dcdcdc;
    border-bottom: 2px solid #555555;
    font-family: pixelarial;
    padding: 0;
    gap: 0;

}

body.era-1-0 .nav-tab {
    background: #e0e0e0;
    border-color: white;
    box-shadow: inset 2px 2px 0px white;
    box-shadow: 2px 2px 0px rgb(0, 0, 0);
    margin: 0;
    gap: 0;


}

body.era-1-0 .nav-tab img.tab-icon {
    height: 32px;
    width: 32px;
}

body.era-1-0 .nav-tab.active {
    background: #fff;
    font-weight: bold;
    border-color: #999;
}



body.era-1-0 .bigbar {
    background: #c0c0c0;
    color: #000080;
    border-top: 2px inset #fff;
    border-bottom: 2px outset #000;
    font-family: 'Courier New', monospace;
    padding: 4px 8px;
    text-shadow: 1px 1px 0 #fff;
}

body.era-1-0 .tab-label {
    font-size: 12px;
    font-family: pixelarial;
    margin-top: 2px;
}


/* === Web 2.5 Style === */
body.era-2-5 .navbar {
    justify-content: center;
    display: flex;
    align-items: flex-end;
    background: linear-gradient(to right, #e9e9e9, #fff6f6);
    border-bottom: 2px solid #1c0050;
    box-shadow: 3px 3px 0px pink;
    font-family: pixeloperator, sans-serif;

}

body.era-2-5 .nav-tab {
    background: pink;
    color: black;
    border: none;
    font-size: 15px;
    border-radius: 1px 1px 0 0;


}

body.era-2-5 .nav-tab img.tab-icon {
    height: 32px;
    width: 32px;
}

body.era-2-5 .nav-tab.active {
    background: #fff;
    color: #333;
    font-weight: bold;

}

body.era-2-5 #reset-button {
    background: white;
    color: black;
    border: none;
    margin-left: auto;
    margin-right: 10px;

}

body.era-2-5 .bigbar {
    background: white;
    color: #333;
    border-top: none;
    font-weight: 500;
    letter-spacing: 0.5px;
    padding: 10px 14px;
    border-radius: 0 0 0px 3px;
    font-family: pixeloperator;
    text-decoration: underline;
    color: blue;
}


body.era-2-5 .tab-label {
    font-size: 12px;
    font-family: 'Courier New', Courier, monospace;
    margin-top: 2px;
}

.bigbar,
.navbar,
.nav-tab,
#reset-button {
    transition: all 0.3s ease-in-out;
}






.tab-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.nav-tab {
    width: 7em;
}

.tab-icon {
    display: block;
}