/* 全站主題變數與亮色深色共用設定 */
:root {
    --app-bg: #f4f6f8;
    --app-surface: #ffffff;
    --app-border: rgba(0,0,0,.09);
    --app-code-bg: #f8fafc;
    --app-code-color: #172033;
}
html[data-bs-theme="dark"] {
    --app-bg: #11151c;
    --app-surface: #171c24;
    --app-border: rgba(255,255,255,.10);
    --app-code-bg: #0e131a;
    --app-code-color: #e8edf5;
}
body { background: var(--app-bg); min-height: 100vh; }
.app-shell { min-height: 100vh; }
.app-header { background: color-mix(in srgb, var(--app-surface) 94%, transparent); backdrop-filter: blur(10px); position: sticky; top: 0; z-index: 1020; }
.brand-icon { width: 44px; height: 44px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg,#0d6efd,#5b2cff); color: #fff; font-size: 1.2rem; box-shadow: 0 6px 20px rgba(13,110,253,.24); }
.lang-control { min-width: 190px; max-width: 250px; }
.card { border-color: var(--app-border); background: var(--app-surface); }
.card-header { background: color-mix(in srgb, var(--app-surface) 88%, var(--app-bg)); border-bottom-color: var(--app-border); }
.nav-scroll { overflow-x: auto; scrollbar-width: thin; padding-bottom: .25rem; }
.nav-scroll .nav { min-width: max-content; }
.code-area { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; background: var(--app-code-bg); color: var(--app-code-color); }
.result-area { font-size: .92rem; }
.table td code { word-break: break-all; white-space: pre-wrap; color: inherit; }
.footer-toggle { width: 100%; border: 0; border-radius: var(--bs-card-border-radius); padding: .85rem 1rem; color: inherit; }
.footer-toggle[aria-expanded="true"] .footer-chevron { transform: rotate(180deg); }
.footer-chevron { transition: transform .2s ease; }
.progress { height: 22px; }
.batch-table-wrap { max-height: 460px; overflow: auto; }
.word-break { word-break: break-all; }
.form-text { line-height: 1.35; }
/* 手機與平板縮小內距並避免固定頁首占用過多垂直空間 */
@media (max-width: 767.98px) {
    .app-header { position: static; }
    .header-actions { width: 100%; }
    .lang-control { min-width: 0; flex: 1 1 170px; }
    .header-actions .btn { min-height: 38px; }
    .card-body { padding: .9rem; }
    textarea.code-area { min-height: 150px; }
    .nav-pills .nav-link { padding: .55rem .75rem; }
    .table { font-size: .9rem; }
    footer { padding-left: .75rem !important; padding-right: .75rem !important; }
}
@media (max-width: 420px) {
    .container-xl { padding-left: .75rem; padding-right: .75rem; }
    .brand-icon { width: 40px; height: 40px; border-radius: 12px; }
    h1.h3 { font-size: 1.25rem; }
}
.algorithm-check-list { max-height: 220px; overflow: auto; background: var(--app-code-bg); }
.algorithm-check-list .form-check { margin-bottom: .35rem; }
.algorithm-check-list .algorithm-group-title { position: sticky; top: 0; background: var(--app-code-bg); padding: .25rem 0; font-size: .78rem; font-weight: 700; color: var(--bs-secondary-color); z-index: 1; }
