/**
* c.css
*
* @save-up: [../js/td.js, ../td.html]
*
* last update: 2010-11-22 10:50:50
*/
html, body {
margin: 0;
padding: 0;
font-size: 12px;
line-height: 20px;
font-family: Verdana, "Times New Roman", serif;
background: #1A74BA;
}
h1 {
padding: 0;
margin: 0;
line-height: 48px;
font-size: 18px;
font-weight: bold;
font-family: Verdana, "Times New Roman", serif;
letter-spacing: 0.12em;
}


#wrapper {
margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 100vh; /* 至少占满整个屏幕高度 */
    padding: 20px;
    box-sizing: border-box; /* 包含padding在高度内 */
}

#left-panel {
margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
    box-sizing: border-box; /* 包含padding在高度内 */
}

#td-wrapper {
padding: 8px 24px 60px 24px;
background: #1A74BA;
}
#td-board {
display: none;
font-size: 16px;
}
#td-board canvas#td-canvas {
position: relative;
background: #fff;
background-image: url("../images/bg.png") !important;
border: solid 1px #cdf;
}
#td-loading {
font-size: 18px;
line-height: 48px;
padding: 60px 0 120px 0;
font-style: italic;
}
#about {
color: #fff;
padding: 8px 24px;
}
#about a {
color: #D4AF37;
}


/* 移動端修復 - 防止重疊 */
@media (max-width: 768px) {
    #left-panel {
        position: relative !important;
        left: 0 !important;
        top: 0 !important;
        width: 100% !important;
        margin: 0 auto 15px auto;
    }
    
    #td-wrapper {
        margin-top: 0;
        width: 100%;
    }
}