body {
    font-size: 11px;
    color: #d6c9b0; /* vàng cổ nhạt */
    background:
        /* crack layer 1: nứt lớn tối */
        linear-gradient(110deg, rgba(0,0,0,0.45) 0%, transparent 22%),
        linear-gradient(290deg, rgba(0,0,0,0.40) 0%, transparent 28%),

        /* crack layer 2: nứt nhỏ */
        linear-gradient(125deg, rgba(0,0,0,0.22) 0%, transparent 35%),
        linear-gradient(305deg, rgba(0,0,0,0.20) 0%, transparent 40%),

        /* stone veins – vân đá */
        radial-gradient(circle at 15% 30%, rgba(60,45,28,0.25), transparent 60%),
        radial-gradient(circle at 85% 70%, rgba(45,32,18,0.22), transparent 75%),

        /* dark ancient stone base */
        linear-gradient(135deg, #14110c, #0c0a07, #1a150d);

    padding: 5px 0px 5px 0px;
}

body, td {
    font: 11px Tahoma;
    color: #c8bfa9;
}

a {
    cursor: pointer;
    font-family: "Tahoma";
    color: #a89158; /* vàng đồng tối */
    font-size: 11px;
    font-weight: bold;
    text-shadow: 1px 1px #000;
    text-decoration: none;
}

a:hover {
    font-family: "Tahoma";
    color: #d7c48b;
    font-size: 11px;
    font-weight: bold;
    text-shadow: 1px 1px #000;
    text-decoration: underline;
}

#menuto {
    text-align: center;
    height: 25px;
    padding-top: 10px;
}

#menuto ul {
    margin: 0;
    padding: 0;
    display: inline;
    list-style: none;
}

#menuto li {
    margin: 1px;
    display: inline;
}

#menuto a {
    font-size: 12px;
    font-family: Tahoma;
    text-decoration: none;
    padding: 10px;
    color: #cfc29b;
}

#menuto a:hover, #menuto a:active {
    background: rgba(40, 30, 15, 0.35); /* da cổ *tối hơn nữa* */
    text-decoration: none;
    border: 1px solid #7a663d;
    padding: 10px;
    margin: -1px;
}

.asd {
    font-family: "Tahoma";
    color: #c8bfa9;
    font-size: 11px;
    font-weight: bold;
    display: box;
    text-decoration: none;
    border: 1px solid #7a663d;
    padding: 1px 3px 2px 3px;
    vertical-align: top;
    background: rgba(30, 24, 14, 0.75); /* nâu đen cổ */
}

.menu a {
    font-family: "Tahoma";
    color: #c8bfa9;
    font-size: 11px;
    font-weight: bold;
    display: block;
    width: 100%;
    text-decoration: none;
    border: 1px solid #7a663d;
    padding: 1px 3px 2px 3px;
    background: rgba(30, 24, 14, 0.75);
}

.menu a:hover {
    font-family: "Tahoma";
    color: #e6d8bb;
    font-size: 11px;
    font-weight: bold;
    display: block;
    width: 100%;
    text-decoration: none;
    border: 1px solid #a48852;
    padding: 1px 3px 2px 3px;
    background: rgba(45, 35, 18, 0.85);
}

.menu2 a {
    font-family: "Tahoma";
    color: #c8bfa9;
    font-size: 11px;
    font-weight: bold;
    display: block;
    width: 100%;
    -moz-border-radius: 11px;
    -webkit-border-radius: 11px;
    text-decoration: none;
    border: 1px solid #7a663d;
    padding: 1px 3px 2px 3px;
    background: rgba(30, 24, 14, 0.75);
}

.menu2 a:hover {
    font-family: "Tahoma";
    color: #e6d8bb;
    font-size: 11px;
    font-weight: bold;
    display: block;
    width: 100%;
    -moz-border-radius: 11px;
    -webkit-border-radius: 11px;
    text-decoration: none;
    border: 1px solid #a48852;
    padding: 1px 3px 2px 3px;
    background: rgba(45, 35, 18, 0.85);
}

.bar1, .bar2, .bar3, .bar4, .bar5, .bar6, .bar7, .bar8 {
    border: 1px solid #7a663d;
    background: rgba(20, 15, 8, 0.85); /* đen nâu dungeon */
    font-family: "Tahoma";
    color: #c8bfa9;
    font-size: 11px;
    font-weight: bold;
}

.bar6 {
    color: #c43737; /* đỏ cổ tối hơn */
}

.bar7 {
    color: #c99640; /* cam đồng tối */
}

.title {
    border: 1px solid #7a663d;
    background: linear-gradient(to right, #302518, #1d160e); /* obsidian dark */
    font-family: "Tahoma";
    height: 25px;
    text-align: center;
    color: #d8c89e;
    font-size: 11px;
    text-shadow: 1px 1px #000;
    padding: 0px 0px 1px 5px;
    font-weight: bold;
}

.title1, .title2, .title3, .title4 {
    border: 1px solid #7a663d;
    background: linear-gradient(to right, #302518, #1d160e);
    font-family: "Tahoma";
    height: 18px;
    text-align: left;
    color: #d8c89e;
    font-size: 11px;
    text-shadow: 1px 1px #000;
}

.input,
input {
    border: 1px solid #7a663d;
    background-color: rgba(22, 18, 10, 0.85);
    font-family: "Tahoma";
    color: #d6c9ab;
    font-size: 11px;
    border-radius: 7px;
    text-shadow: 1px 1px #000;
    padding: 2px 4px 2px 4px;
}

.input:focus,
input:focus {
    outline: none;
    border-color: #a48852;
}

input[type="button"],
input[type="submit"],
input[type="reset"] {
    border: 1px solid #7a663d;
    background-color: #302518;
    font-family: "Tahoma";
    color: #d6c9ab;
    font-size: 11px;
    border-radius: 7px;
    text-shadow: 1px 1px #000;
    padding: 2px 4px 2px 4px;
    cursor: pointer;
    margin: 3px 6px;
}

input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover {
    background-color: #4a3824;
}

div {
    display: inline;
    text-align: center;
}