.of-material-toolbar { display:flex; justify-content:flex-end; align-items:center; flex-wrap:wrap; gap:8px; margin:8px 0; }
.of-material-toolbar .button, .of-material-toolbar button { font-size:12px; }
.of-material-upload { display:flex; align-items:center; justify-content:center; gap:7px; border:1px dashed #7da99a; border-radius:5px; padding:8px 12px; color:#32745c; background:#f4faf7; cursor:pointer; }
.of-material-upload:hover, .of-material-upload:focus-visible { background:#e8f5ee; border-color:#32745c; outline:2px solid #b8dfcf; }
.of-material-upload:disabled { opacity:.6; cursor:wait; }
.of-material-body { padding:16px 20px; overflow:auto; max-height:78dvh; }
.of-material-modal { width:min(1180px,96vw); max-width:96vw; }
.of-material-review-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; align-items:start; }
.of-material-original { position:sticky; top:0; min-width:0; }
.of-material-original img { display:block; width:100%; max-height:65dvh; object-fit:contain; margin:8px 0; border:1px solid #e1e8e5; }
.of-material-item { padding:12px 0; border-bottom:1px solid #e3e9e6; overflow-wrap:anywhere; }
.of-material-item p { margin:7px 0; }
.of-material-evidence-text { white-space:pre-wrap; color:#596878; font-size:12px; }
.of-material-done { color:#278263; }
.of-material-history { display:flex; justify-content:space-between; gap:16px; width:100%; text-align:left; padding:12px; border:0; border-bottom:1px solid #e3e9e6; background:white; cursor:pointer; }
.of-material-edit { padding:12px; margin:10px 0; border:1px solid #c8ddd3; border-radius:5px; background:#f6faf8; }
.of-material-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.of-material-edit input, .of-material-edit select { width:100%; min-width:0; }
.of-material-edit button { margin:5px 5px 5px 0; }
.of-material-comparison { margin:10px 0; padding:10px; background:white; border:1px solid #dce6e1; }
.of-material-check { display:flex; align-items:flex-start; gap:8px; font-size:13px; margin:10px 0; }
.of-material-check input { width:auto; flex:none; }
.of-fee-evidence-button { display:inline-flex; align-items:center; justify-content:center; flex:none; width:20px; height:24px; padding:0; color:#5e8577; background:transparent; border:0; border-radius:4px; cursor:pointer; vertical-align:middle; }
.of-fee-evidence-button:hover, .of-fee-evidence-button:focus-visible { background:#e2f2ea; color:#24654e; }
.of-inline-fee-cell .of-fee-with-evidence { display:flex; align-items:center; gap:2px; }
.of-fee-with-evidence .of-inline-fee-control { min-width:0; flex:1; }
.of-fee-evidence-hover { position:fixed; z-index:10000; width:280px; max-width:calc(100vw - 16px); padding:12px; border:1px solid #d6e2db; border-radius:6px; box-shadow:0 4px 20px #0002; background:white; font-size:12px; overflow-wrap:anywhere; }
.of-fee-evidence-image { display:block; max-width:100%; max-height:55dvh; object-fit:contain; margin-top:10px; }
@media(max-width:700px) { .of-material-review-grid { grid-template-columns:minmax(0,1fr); } .of-material-original { position:static; } .of-material-original img { max-height:35dvh; } .of-material-body { padding:10px; } .of-material-fields { grid-template-columns:minmax(0,1fr); } .of-material-toolbar { justify-content:stretch; } .of-material-upload { flex:1; } }