#gmLootPanel { min-width:0; }
#gmLootPanel label { display:flex; flex-direction:column; gap:6px; margin:10px 0; }
#gmLootPanel input,#gmLootPanel textarea,#gmLootPanel select { width:100%; min-width:0; box-sizing:border-box; }
#gmLootPanel textarea { resize:vertical; white-space:pre-wrap; }
#gmLootPanel fieldset { margin:16px 0; min-width:0; border:1px solid var(--line,#8a7655); padding:14px; }
#gmLootPanel .loot-form-grid { display:grid; grid-template-columns:1fr 1fr 2fr; gap:14px; }
#gmLootPanel .loot-item-row { display:grid; grid-template-columns:1fr 2fr 110px auto; align-items:end; gap:12px; margin-bottom:14px; }
#gmLootPanel .loot-actions { display:flex; gap:12px; flex-wrap:wrap; }
#gmLootPanel .loot-reward { padding:14px 0; }
#gmLootPanel .loot-announcement { white-space:pre-wrap; margin:14px 0; }
#gmLootPanel .loot-history-scroll { overflow:auto; }
#gmLootPanel table { width:100%; border-collapse:collapse; }
#gmLootPanel table:not(.loot-contents-table) th,#gmLootPanel table:not(.loot-contents-table) td { text-align:left; padding:10px; border-bottom:1px solid var(--line,#8a7655); }
#gmLootPanel tbody tr,#gmLootPanel th,#gmLootPanel td { background:var(--de-panel); color:var(--de-text); }
#gmLootPanel .loot-audit { white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; max-height:500px; overflow:auto; }
#gmLootPanel .loot-help { width:28px; padding:2px; }
#gmLootPanel .loot-tooltip { display:block; padding:10px; border:1px solid var(--line,#8a7655); }
#gmLootPanel [hidden] { display:none!important; }
@media(max-width:700px){#gmLootPanel .loot-form-grid,#gmLootPanel .loot-item-row { grid-template-columns:1fr; } #gmLootPanel button{max-width:100%;white-space:normal;} }

#apiSpendingPage{width:96%;max-width:1600px;margin:20px auto;min-width:0}
.api-spending-filters{display:flex;flex-wrap:wrap;gap:16px;align-items:end;margin:18px 0}
.api-spending-filters label{display:grid;gap:6px}.api-spending-filters input{max-width:100%;box-sizing:border-box}
.api-spending-scroll{overflow:auto;max-width:100%}#apiSpendingPage table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
#apiSpendingPage th,#apiSpendingPage td{padding:10px;border:1px solid var(--de-structure);text-align:right;white-space:nowrap;background:var(--de-panel);color:var(--de-text)}
#apiSpendingPage tr>:first-child{text-align:left}#apiSpendingPage tfoot{font-weight:bold}#apiSpendingPage .api-spending-budget{border:1px solid var(--de-accent);padding:12px}

/* Reuse the sheet's .h header; these rules affect only Loot Box content. */
#gmLootPanel .loot-sections>section{margin:0 0 16px;min-width:0}
#gmLootPanel .loot-preparation{border:1px solid var(--de-structure);padding:14px;min-width:0}
#gmLootPanel .loot-form-grid{grid-template-columns:calc(9ch + 44px) 18ch auto minmax(160px,1fr);align-items:start;gap:16px}
#gmLootPanel .loot-form-grid>label,#gmLootPanel .loot-form-grid>div{min-width:0;margin:0}
#gmLootPanel .loot-tier select,#gmLootPanel [data-box-quantity]{height:40px;min-height:40px;padding:6px 10px;font:inherit}
#gmLootPanel .loot-field-label,#gmLootPanel .loot-form-grid>label,#gmLootPanel .loot-context-label label{font-size:12px;font-weight:bold;line-height:17px}
#gmLootPanel .loot-character-field,#gmLootPanel .loot-context-field{display:flex;flex-direction:column;gap:6px}
#gmLootPanel .loot-recipients{display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:16px;border:0;padding:0;max-width:380px}
#gmLootPanel .loot-recipient-group>b{font-size:12px;line-height:17px;display:block}
#gmLootPanel .loot-recipients label{display:flex;flex-direction:row;align-items:center;gap:8px;min-height:30px;margin:0;font-weight:normal;text-transform:none;overflow-wrap:anywhere}
#gmLootPanel .loot-recipients input{width:20px;height:20px;flex:none;margin:0}
#gmLootPanel .loot-context-field textarea{min-height:100px;margin:0}
#gmLootPanel .loot-context-label{display:flex;align-items:center;gap:6px;height:17px}
#gmLootPanel .loot-context-label label{margin:0}
#gmLootPanel .loot-help{border:0;background:transparent;color:var(--de-text);width:17px;height:17px;min-height:0;padding:0;font-size:14px;line-height:17px;overflow:visible}
#gmLootPanel .loot-tooltip{position:fixed;z-index:10;width:min(310px,calc(100vw - 16px));box-sizing:border-box;background:var(--de-panel);color:var(--de-text);font-size:13px;font-weight:normal;box-shadow:0 4px 12px #0006}
#gmLootPanel .loot-history-heading{margin-top:16px}
#gmLootPanel .loot-history table{table-layout:fixed;border:1px solid var(--de-structure)}
#gmLootPanel .loot-history th,#gmLootPanel .loot-history td{overflow-wrap:anywhere;border:1px solid var(--de-structure);vertical-align:top}
#gmLootPanel .loot-history th:nth-child(1){width:18%}#gmLootPanel .loot-history th:nth-child(2){width:24%}#gmLootPanel .loot-history th:nth-child(3){width:14%}#gmLootPanel .loot-history th:nth-child(4){width:22%}#gmLootPanel .loot-history th:nth-child(5){width:14%}#gmLootPanel .loot-history th:last-child{width:8%}
#gmLootPanel .loot-reward{border:1px solid var(--de-structure);padding:14px;margin:14px 0;min-width:0}
#gmLootPanel .loot-reward>label:has(input[type=checkbox]){flex-direction:row;align-items:center;width:fit-content}
#gmLootPanel input[type=checkbox]{width:20px;height:20px;flex:none}
#gmLootPanel .loot-item-row{align-items:start}
#gmLootPanel .loot-item-row>button{margin-top:33px}
#gmLootPanel .loot-actions{margin-top:14px;align-items:center}
#gmLootPanel .loot-actions button{min-height:40px;margin:0}
#gmLootPanel textarea{overflow:hidden;resize:none}
#gmLootPanel .loot-announcement{overflow-wrap:anywhere}
@media(max-width:1100px){#gmLootPanel .loot-form-grid{grid-template-columns:calc(9ch + 44px) 18ch minmax(0,1fr)}#gmLootPanel .loot-context-field{grid-column:1/-1}}
@media(max-width:700px){#gmLootPanel .loot-form-grid{grid-template-columns:minmax(0,1fr)}#gmLootPanel .loot-recipients{max-width:none}#gmLootPanel .loot-recipients label{min-height:44px}#gmLootPanel .loot-history table{min-width:650px}}

/* Reward workflow; scoped to the Loot Box panel. */
#gmLootPanel .loot-drafts{margin-top:28px}
#gmLootPanel .loot-history-heading{margin-top:32px}
#gmLootPanel .loot-field-label{font-weight:normal}
#gmLootPanel .loot-announcement{border:1px solid var(--de-structure);padding:14px;margin:0 0 20px;line-height:1.5}
#gmLootPanel .loot-editor{margin:0;padding:14px}
#gmLootPanel .loot-box-fields{display:grid;grid-template-columns:minmax(0,52ch) minmax(0,calc(18ch + 24px));gap:12px;justify-content:start}
#gmLootPanel .loot-item-row{grid-template-columns:minmax(120px,1fr) 90px minmax(180px,2fr) auto;gap:12px;margin-bottom:8px;align-items:start}
#gmLootPanel .loot-item-row>button{margin-top:28px;min-height:40px}
#gmLootPanel .loot-editor label{margin:4px 0 10px;font-size:12px;line-height:18px;font-weight:normal}
#gmLootPanel .loot-editor textarea,#gmLootPanel .loot-editor input{min-height:40px;font:inherit;font-size:14px;margin:0}
#gmLootPanel .loot-add-item{font-size:12px;min-height:30px;padding:4px 10px;margin:0}
#gmLootPanel .loot-view{display:inline-block;text-decoration:underline;color:#fff;background:#343229;padding:2px 5px;cursor:pointer;white-space:nowrap}
#gmLootPanel .loot-view:hover,#gmLootPanel .loot-view:focus-visible{color:#f1d277}
#gmLootPanel .loot-view:focus-visible{outline:2px solid var(--de-accent);outline-offset:2px}
#gmLootPanel .loot-details>.loot-view{margin-bottom:18px}
#gmLootPanel .loot-opening{margin-top:12px}
#gmLootPanel .loot-opening label{display:flex;flex-direction:row;align-items:center;margin:6px 0;gap:8px}
#gmLootPanel .loot-opening input{width:20px;max-width:20px}
#gmLootPanel .loot-history table{table-layout:auto}
#gmLootPanel .loot-history td{font-size:12px;font-weight:normal}
#gmLootPanel .loot-history th,#gmLootPanel .loot-history td{padding:6px 8px}
#gmLootPanel .loot-history th:nth-child(5),#gmLootPanel .loot-history th:last-child{width:1%;white-space:nowrap}
#gmLootPanel .loot-history td:nth-child(5),#gmLootPanel .loot-history td:last-child{white-space:nowrap;overflow-wrap:normal}
#gmLootPanel .loot-history th:nth-child(-n+4){width:auto}
#gmLootPanel .loot-editor [data-name],#gmLootPanel .loot-editor [data-item-name]{padding:10px 8px;line-height:18px}
#gmLootPanel .loot-editor input{height:40px;padding:8px;line-height:20px}
#gmLootPanel .loot-readonly{border:1px solid var(--de-structure);padding:14px}
#gmLootPanel .loot-readonly-item{display:grid;grid-template-columns:minmax(120px,1fr) 90px minmax(180px,2fr);gap:12px;margin-top:12px}
#gmLootPanel .loot-readonly b{font-size:12px;font-weight:normal}
#gmLootPanel .loot-readonly p{white-space:pre-wrap;overflow-wrap:anywhere;margin:6px 0}
@media(max-width:700px){
 #gmLootPanel .loot-recipients label{min-height:32px;gap:6px;padding:0;margin:0;font-size:14px}
 #gmLootPanel .loot-box-fields,#gmLootPanel .loot-item-row{grid-template-columns:minmax(0,1fr)}
 #gmLootPanel .loot-item-row>label:nth-child(2){max-width:110px}
 #gmLootPanel .loot-item-row>button{margin-top:0;justify-self:start}
 #gmLootPanel .loot-reward-actions{gap:8px}
 #gmLootPanel .loot-history table{min-width:480px}
 #gmLootPanel .loot-history th,#gmLootPanel .loot-history td{padding:5px}
 #gmLootPanel .loot-readonly-item{grid-template-columns:minmax(0,1fr)}
}

/* Desktop contents remain a compact semantic table; mobile items are individual cards. */
#gmLootPanel .loot-recipient-group>b{font-weight:normal}
#gmLootPanel .loot-contents-table{table-layout:fixed;margin:12px 0 8px;width:100%;border-collapse:collapse}
#gmLootPanel .loot-contents-table th,#gmLootPanel .loot-contents-table td{overflow-wrap:anywhere}
#gmLootPanel .loot-contents-table th:nth-child(2){width:90px}
#gmLootPanel .loot-contents-table:has([data-item-name]) th:last-child{width:150px}
#gmLootPanel .loot-contents-table th:nth-child(3){width:42%}
#gmLootPanel .loot-item-row,#gmLootPanel .loot-readonly-item{display:table-row;margin:0}
#gmLootPanel .loot-contents-table label{display:block;margin:0}
#gmLootPanel .loot-contents-table label>span:not(.dcc-number-stepper),#gmLootPanel .loot-contents-table td>b{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#gmLootPanel .loot-item-row button,#gmLootPanel .loot-add-item{margin:0;min-height:40px;font-size:14px;padding:8px 12px;white-space:nowrap}
#gmLootPanel .loot-contents-table td>p{height:auto}
#gmLootPanel .loot-readonly-item p{margin:0;white-space:pre-wrap}
@media(max-width:700px){
 #gmLootPanel .loot-contents-table,#gmLootPanel .loot-contents-table tbody{display:block;width:100%}
 #gmLootPanel .loot-contents-table{margin-top:1px}
 #gmLootPanel .loot-contents-table thead{display:none}
 #gmLootPanel .loot-item-row,#gmLootPanel .loot-readonly-item{display:grid;grid-template-columns:minmax(0,1fr);border:1px solid var(--de-structure);border-radius:3px;background:var(--de-panel);padding:10px;margin-bottom:12px;gap:12px}
 #gmLootPanel .loot-contents-table td{display:block;padding:0;border:0;background:transparent}
 #gmLootPanel .loot-contents-table label>span:not(.dcc-number-stepper),#gmLootPanel .loot-contents-table td>b{display:block;position:static;width:auto;height:auto;clip-path:none;margin-bottom:6px;font-size:12px;font-weight:normal;line-height:18px}
 #gmLootPanel .loot-contents-table td:nth-child(2){max-width:110px}
 #gmLootPanel .loot-item-row button{justify-self:start}
 #gmLootPanel .loot-editor .loot-box-fields{gap:12px}
 #gmLootPanel .loot-editor .loot-box-fields label{margin:0;display:grid;gap:6px}
 #gmLootPanel .loot-contents-table{margin-top:1px}
}

#gmLootPanel .loot-contents-table,#gmLootPanel .loot-contents-table tbody{background:var(--de-panel)}

/* Header, cell borders, colors and control appearance use the original sheet rules. */
#gmLootPanel .loot-generation-error{white-space:pre-wrap;border:0;border-left:4px solid var(--de-selected);padding:16px 18px;background:var(--de-panel);color:var(--de-text);font-family:inherit;line-height:1.5}
#gmLootPanel button:disabled{opacity:.55;cursor:wait}

@media(max-width:700px){#gmLootPanel .loot-contents-table td{border:0!important}#gmLootPanel .loot-contents-table td>p{padding:0;min-height:0}#gmLootPanel .loot-contents-table :is(textarea,input){border:1px solid var(--de-structure)!important;border-radius:2px!important}}

#gmLootPanel .loot-contents-table tbody td{vertical-align:top}

/* Only Loot fields: do not visually hide the numeric stepper with field labels. */
#gmLootPanel .loot-validation-error{position:fixed;z-index:1200;box-sizing:border-box;width:max-content;max-width:min(350px,calc(100vw - 16px));padding:12px 38px 12px 14px;background:var(--de-panel);color:var(--de-text);border:2px solid var(--de-accent);box-shadow:0 4px 14px #0008;font:inherit;overflow-wrap:anywhere}
#gmLootPanel .loot-validation-error button{position:absolute;right:4px;top:4px;padding:0 4px;min-height:24px;width:24px}
#gmLootPanel [aria-invalid=true]{outline:2px solid var(--de-accent);outline-offset:3px}
#gmLootPanel .loot-nonvisual-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%)}

/* Approved October 21 containers and controls, scoped outside protected sheet tables. */
#gmLootPanel .loot-inner{border:1px solid var(--de-structure);margin:16px 8px;padding:12px;min-width:0}
#gmLootPanel .loot-inner>.h{margin:-12px -12px 12px}
#gmLootPanel .loot-commentary .loot-announcement{border:0;padding:0;margin:0}
#gmLootPanel .loot-content-section .loot-editor,#gmLootPanel .loot-content-section .loot-readonly{border:0;padding:0}
#gmLootPanel .loot-quantity [data-box-quantity]{padding-left:10px!important}
#gmLootPanel .loot-item-row>td:last-child{text-align:center;vertical-align:top;padding:8px 6px}
#gmLootPanel .loot-notes-list{margin:6px 0;padding-left:1.5em;white-space:pre-wrap}
#gmLootPanel .loot-notes-list li{padding-left:.2em;overflow-wrap:anywhere}
#gmLootPanel .loot-notes-preview:empty{display:none}
#gmLootPanel .loot-back{color:var(--de-text);background:transparent;text-decoration:none;padding:0;margin-bottom:18px;white-space:normal}
#gmLootPanel .loot-back:hover{color:var(--de-text);text-decoration:none}
#gmLootPanel .loot-validation-error button{border:0;background:transparent;box-shadow:none}
#gmLootPanel .loot-validation-error button:focus-visible{outline:2px solid var(--de-accent);outline-offset:2px}
@media(max-width:700px){#gmLootPanel .loot-inner{margin:12px 0;padding:10px}#gmLootPanel .loot-inner>.h{margin:-10px -10px 12px}#gmLootPanel .loot-item-row>td:last-child{text-align:left;padding:0}}

#gmLootPanel .loot-detail-box{border:1px solid var(--de-structure);padding:14px;margin:14px 0;min-width:0}
#gmLootPanel .loot-notes{white-space:pre-wrap;overflow-wrap:anywhere}

/* A plain textarea remains the editor. Its unfocused bullet display is semantic. */
#gmLootPanel .loot-note-edit{position:relative;min-width:0}
#gmLootPanel .loot-note-display{position:absolute;left:0;right:0;top:0;box-sizing:border-box;padding:7px;pointer-events:none;font-size:14px;line-height:20px;white-space:pre-wrap;overflow-wrap:anywhere}
#gmLootPanel .loot-note-display .loot-notes-list{margin:0;padding-left:1.5em}
#gmLootPanel .loot-note-edit:has(.loot-bulleted-note):not(:focus-within) textarea{color:transparent!important}
#gmLootPanel .loot-note-edit:focus-within .loot-note-display{visibility:hidden}

#gmLootPanel .loot-reward>.h,#gmLootPanel .loot-detail-box>.h{margin:-14px -14px 0}
/* Retain the native editor line box, as in the existing sheet input clipping fix. */
#gmLootPanel .loot-editor [data-gold]{height:auto!important;line-height:20px;vertical-align:middle}
#gmLootPanel .loot-history .loot-view{padding-left:0;padding-right:10px}
#gmLootPanel .loot-history .loot-view:not(:hover):not(:focus-visible){color:var(--de-text)}

.loot-achievement-text{box-sizing:border-box;width:100%;font:inherit;line-height:1.5;white-space:pre-wrap;min-height:10rem}.loot-confirm-close{position:absolute;right:8px;top:6px;font-weight:400!important}.batch-confirmation button{font-weight:400!important}