/* mudlist-form.css — 貢獻頁上兩張「新增站台」表單的樣式:玩家的提議（.msp-add,MUDLIST_PLAN §95）與站務的新增（.mla,§73）
   ⚠ 為什麼不直接載 mudlist.css:貢獻頁是 board 殼,而 mudlist.css 有整頁層級的樣式,混進去會互相打架（§86-2 同一個理由）。
   ⭐ 這裡只收表單用得到的那幾條,**全部限定在 `.msp-add` 底下** —— 不會碰到頁面其他地方。
   ⚠ 數值抄自 mudlist.css 的 `.mse*`（站台頁的編輯區塊）:兩個表單看起來要是同一個東西。 */
.msp-add {
    margin: 28px 0 10px;
    padding: 16px 18px;
    border: 1px solid #4a4132;
    border-left: 4px solid #f3df00;
    border-radius: 8px;
    background: rgba(50, 50, 50, .8);
}

.msp-add h2 {
    margin: 0 0 4px;
    font-size: 1.05em;
    color: #f3df00;
}

.msp-add h3 {
    margin: 0 0 8px;
    font-size: 0.95em;
    color: #ddd8cc;
}

.msp-add .mse-sec {
    margin: 20px 0 0;
    padding-top: 16px;
    border-top: 1px solid #a36900;
}

/* 框裡的第一個區塊不畫分隔線 —— 標題移到框外之後,框頂那條線與空白是多出來的。
   ⚠ 訊息區（.mse-msg）平常排在最前面、但會被搬到按鈕旁邊,兩種情況都要算到 */
.msp-add > .mse-sec:first-child,
.msp-add > .mse-msg:first-child + .mse-sec {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.msp-add .mse-field {
    margin: 10px 0 16px;
}

.msp-add .mse-label {
    display: block;
    margin-bottom: 4px;
    font-size: 0.9em;
    color: #ddd8cc;
}

.msp-add .mse-hint {
    margin: 0 0 8px;
    font-size: 0.8em;
    color: #9a938a;
    line-height: 1.7;
}

.msp-add .mse-input {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 460px;
    margin: 0 0 8px;
    padding: 7px 9px;
    border: 1px solid #4a4132;
    border-radius: 5px;
    background: rgba(0, 0, 0, .35);
    color: #e8e2d5;
    font-size: 0.9em;
    font-family: inherit;
}

.msp-add .mse-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 8px 0 0;
}

.msp-add .mse-btn {
    padding: 6px 14px;
    border: 1px solid #6b5f45;
    border-radius: 5px;
    background: #3a3428;
    color: #f0e9d8;
    font-size: 0.88em;
    font-family: inherit;
    cursor: pointer;
}

.msp-add .mse-btn:hover {
    border-color: #f3df00;
    color: #fff;
}

.msp-add .mse-btn:disabled {
    opacity: .5;
    cursor: default;
}

.msp-add .mse-btn-danger {
    border-color: #7a4a3a;
    color: #f0c8b8;
}

.msp-add .mse-msg {
    margin: 10px 0 0;
    font-size: 0.88em;
    line-height: 1.8;
}

.msp-add .mse-ok {
    color: #9fd88a;
}

.msp-add .mse-err {
    color: #f09a8a;
}

.msp-add .mse-wait {
    color: #9a938a;
}

.msp-add .mse-check {
    display: block;
    margin: 0 0 10px;
    font-size: 0.85em;
    color: #b9b1a2;
}

.msp-add .msp-list {
    list-style: none;
    margin: 6px 0 0;
    padding: 0;
}

.msp-add .msp-item {
    margin: 0 0 10px;
    padding: 8px 10px;
    border-left: 3px dashed #f3df00;
    background: rgba(243, 223, 0, .04);
    line-height: 1.8;
    overflow-wrap: anywhere;
}

.msp-add .msp-lines {
    margin: 6px 0 0;
    padding: 8px 10px;
    max-height: 18em;
    overflow: auto;
    font-size: 0.85em;
    line-height: 1.6;
    background: rgba(0, 0, 0, .25);
    border-radius: 4px;
    white-space: pre;
}

/* 我的共筆狀態（§96）—— 同 mudlist.css,限定在 .msp-add 底下 */
.msp-add .msp-me-who {
    margin: 0 0 6px;
    font-size: 0.9em;
    color: #ddd8cc;
}

.msp-add .msp-congrats {
    padding: 8px 10px;
    border-radius: 5px;
    background: rgba(159, 216, 138, .1);
}

/* ---- 站務的「新增站台」表單（§73，貢獻頁，admin 前端注水）----------------
   ⚠⚠ 2026-10-03 從 mudlist.css 搬過來:表單 8/31 就從牆搬到貢獻頁了,而貢獻頁**只載這一支**,
      `.mla-*` 留在 mudlist.css 裡＝管理員一直看到的是沒套樣式的表單（共筆實測清單 §7 回報）。
   ⭐ 外框、欄位、按鈕、訊息色跟玩家的「提議新增站台」（.msp-add）同一組數值 ——
      同一頁上兩張新增站台的表單,看起來要是同一個東西。
   ⚠⚠ 三種模式**刻意不等重**:需要人背書的那兩種（.is-vouch / .mla-btn-heavy）
   邊框更亮、按鈕更重 —— 它們的後果不可逆(永遠不會有機器驗證),介面不該讓
   它們看起來跟「連進去量一下」一樣輕。 */
.mla {
    margin: 28px 0 10px;
    padding: 16px 18px;
    border: 1px solid #4a4132;
    border-left: 4px solid #f3df00;
    border-radius: 8px;
    background: rgba(50, 50, 50, .8);
}

.mla-h {
    margin: 0 0 4px;
    color: #f3df00;
    font-size: 1.05em;
}

.mla-lead {
    margin: 0 0 12px;
    color: #9a938a;
    font-size: 0.85em;
    line-height: 1.7;
}

.mla-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

.mla-tab {
    padding: 6px 12px;
    border: 1px solid #4a4335;
    border-radius: 5px;
    background: transparent;
    color: #c3b89f;
    font-family: inherit;
    font-size: 0.88em;
    cursor: pointer;
}

.mla-tab:hover {
    border-color: #6b5f45;
    color: #f0e9d8;
}

.mla-tab.is-on {
    background: #3a3428;
    border-color: #6b5f45;
    color: #f0e9d8;
}

/* 需要人背書的模式:一條側邊記號,讓「這一種不一樣」在按之前就看得到。 */
.mla-tab.is-vouch {
    border-left-width: 3px;
    border-left-color: #b8892f;
}

.mla-why {
    margin: 0 0 10px;
    padding: 8px 10px;
    border-left: 3px solid #6b5f45;
    background: #2a261e;
    color: #c3b89f;
    font-size: 0.86em;
}

.mla-field {
    margin: 10px 0 16px;
}

.mla-label {
    display: block;
    margin-bottom: 4px;
    color: #ddd8cc;
    font-size: 0.9em;
}

.mla-hint {
    margin: 0 0 8px;
    color: #9a938a;
    font-size: 0.8em;
    line-height: 1.7;
}

.mla-input {
    display: block;
    width: 100%;
    max-width: 460px;
    box-sizing: border-box;
    margin: 0 0 8px;
    padding: 7px 9px;
    border: 1px solid #4a4132;
    border-radius: 5px;
    background: rgba(0, 0, 0, .35);
    color: #e8e2d5;
    font-family: inherit;
    font-size: 0.9em;
}

.mla-input:focus {
    outline: none;
    border-color: #f3df00;
}

.mla-checkline {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #b9b1a2;
    font-size: 0.85em;
}

.mla-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0 0;
}

.mla-btn {
    padding: 6px 14px;
    border: 1px solid #6b5f45;
    border-radius: 5px;
    background: #3a3428;
    color: #f0e9d8;
    font-family: inherit;
    font-size: 0.88em;
    cursor: pointer;
}

.mla-btn:hover {
    border-color: #f3df00;
    color: #fff;
}

.mla-btn:disabled {
    opacity: .5;
    cursor: default;
}

.mla-btn-ghost {
    background: transparent;
    color: #c3b89f;
}

/* ⚠ 沒有機器驗證的那一種送出鈕 —— 它比「連進去量一下」重。 */
.mla-btn-heavy {
    border-color: #b8892f;
    background: #3d3220;
}

.mla-vouch {
    margin: 8px 0 0;
    color: #d8b06a;
    font-size: 0.82em;
    line-height: 1.7;
}

.mla-deny {
    margin: 10px 0 0;
    padding: 10px 12px;
    border-left: 3px solid #b8892f;
    background: #2a261e;
    color: #e6dcc4;
    font-size: 0.88em;
    line-height: 1.8;
}

.mla-msg {
    margin: 10px 0 0;
    font-size: 0.88em;
    line-height: 1.8;
}

.mla-ok {
    color: #9fd88a;
}

.mla-warn {
    color: #e8a33d;
}

.mla-err {
    color: #f09a8a;
}

.mla-wait {
    color: #9a938a;
}

.mla-go {
    color: #f3df00;
}

.mla-probe {
    margin: 12px 0 0;
    padding: 10px 12px;
    border: 1px dashed #4a4335;
    border-radius: 6px;
}

.mla-lines {
    margin: 4px 0 8px;
    padding-left: 1.4em;
    color: #c3b89f;
    font-size: 0.85em;
    line-height: 1.9;
}

/* 歡迎畫面原文。⚠ 一定要能橫向捲動 —— 它是 80 欄的終端輸出。 */
.mla-screen {
    max-height: 260px;
    overflow: auto;
    margin: 0;
    padding: 8px;
    background: #14120e;
    color: #b9ae95;
    font-size: 0.8em;
    line-height: 1.5;
    white-space: pre;
}