/* 基礎頁面設定 */
body { 
    background: #0d0d0d; 
    color: #00ff41; 
    font-family: 'Consolas', monospace; 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    height: 100vh; 
    margin: 0; 
}

/* 終端機外框 */
.terminal { 
    width: 90%; 
    max-width: 400px; 
    padding: 30px; 
    border: 1px solid #00ff41; 
    background: #000; 
    box-shadow: 0 0 20px rgba(0,255,65,0.2); 
}

/* 區塊卡片 */
.card { 
    border-top: 1px solid #222; 
    margin-top: 20px; 
    padding-top: 10px; 
}

/* 輸入框與按鈕通用設定 */
input, button { 
    width: 100%; 
    padding: 12px; 
    margin: 10px 0; 
    box-sizing: border-box; 
    font-family: inherit; 
}

/* 密碼/檔案輸入框 */
input { 
    background: #111; 
    border: 1px solid #00ff41; 
    color: #00ff41; 
    outline: none; 
}

/* 主按鈕 (上傳) */
button { 
    background: #00ff41; 
    border: none; 
    font-weight: bold; 
    cursor: pointer; 
    color: black; 
    transition: 0.3s; 
}

button:hover { 
    background: #fff; 
    box-shadow: 0 0 10px #fff; 
}

/* 次要按鈕 (下載) */
.btn-alt { 
    background: transparent; 
    border: 1px solid #00ff41; 
    color: #00ff41; 
}

/* 狀態文字區域 */
#status { 
    margin-top: 10px; 
    font-size: 0.9em; 
    color: #888; 
    min-height: 40px; /* 避免文字換行時跳動 */
}

/* 進度條容器 */
.progress-bg {
    width: 100%; 
    height: 10px; 
    background: #111; 
    border: 1px solid #444; 
    margin: 5px 0 15px 0; 
    border-radius: 2px; 
    position: relative; 
    overflow: hidden;
}

/* 進度條填充 */
.progress-fill {
    width: 0%; 
    height: 100%; 
    background: linear-gradient(90deg, #00441b, #00ff41); 
    box-shadow: 0 0 10px #00ff41; 
    transition: width 0.3s ease-out; /* 縮短時間讓實時反饋更靈敏 */
}

/* 當上傳到 100% 進入後端處理時的呼吸動畫 */
.processing {
    animation: pulse 1.5s infinite;
    background: linear-gradient(90deg, #00ff41, #fff, #00ff41) !important;
    background-size: 200% 100% !important;
}

@keyframes pulse {
    0% { opacity: 1; filter: brightness(1); }
    50% { opacity: 0.7; filter: brightness(1.5); }
    100% { opacity: 1; filter: brightness(1); }
}