@font-face{font-family:RUSSBody;src:url("../../../shared/assets/fonts/SegUIVar.ttf")}
*{box-sizing:border-box}
body{margin:0;background:#191b1b;color:#ece7db;font:14px RUSSBody,Segoe UI,sans-serif}
.app-header{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:14px 20px;background:#272927;border-bottom:1px solid #466675}
.eyebrow{margin:0;color:#78afc3;text-transform:uppercase;letter-spacing:.16em;font-size:11px}
.app-header h1{margin:1px 0 0;font-size:24px}
.header-controls{display:flex;align-items:end;gap:8px;flex-wrap:wrap}
.header-controls label{min-width:120px}
.file-strip{display:flex;gap:22px;padding:8px 20px;background:#30322e;color:#d5d0c3;border-bottom:1px solid #466675}
.render-config-path{margin-left:auto;color:#aaa;text-align:right;user-select:text}
.workspace{display:grid;grid-template-columns:minmax(330px,1.05fr) minmax(390px,1.2fr) minmax(280px,.85fr);gap:12px;padding:12px;align-items:start}
.panel{background:#272927;border:1px solid #466675;border-radius:7px;padding:14px}
.panel-title{display:flex;justify-content:space-between;align-items:center;gap:10px}
.panel h2,.panel h3{margin:0 0 10px}
.panel h2{font-size:18px}
.panel h3{font-size:15px}
label{display:flex;flex-direction:column;gap:4px;color:#d8d2c5;margin-bottom:9px}
input,select,textarea,button{font:inherit}
input,select,textarea{width:100%;border:1px solid #5f7c88;border-radius:4px;background:#151716;color:#f3efe5;padding:7px}
textarea{resize:vertical;min-height:80px}
button{border:1px solid #3f7186;border-radius:4px;background:#3f7186;color:#fff;padding:7px 10px;cursor:pointer}
button:hover{background:#518ba2}
button:disabled{opacity:.42;cursor:not-allowed}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.record-list{height:515px;overflow:auto;border:1px solid #466675;background:#181a19;margin:4px 0 9px}
.record-row{display:grid;grid-template-columns:1fr auto;gap:8px;width:100%;text-align:left;border:0;border-bottom:1px solid #3f423e;border-radius:0;background:transparent;padding:8px;color:#e8e3d7}
.record-row:hover,.record-row.selected{background:#304d58}
.record-row strong,.record-row small{display:block}
.record-row small{color:#b6b1a6;margin-top:2px}
.badges{display:flex;gap:3px;align-items:center}
.badge{font-size:10px;padding:2px 4px;border-radius:3px;background:#3f7186}
.badge.dirty{background:#8a4e35}
.badge.invalid{background:#8b3434}
.record-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:6px}
.record-actions+ .record-actions{grid-template-columns:repeat(3,1fr)}
.checks{margin:5px 0 10px}
.checks label,.overflow{flex-direction:row;align-items:center}
.checks input,.overflow input{width:auto}
.rule-helper{border-top:1px solid #466675;margin-top:12px;padding-top:12px}
.rule-result{border:1px solid #466675;border-radius:4px;padding:8px;margin:6px 0;background:#1c1e1d}
.rule-result p{margin:4px 0 7px;color:#c9c4b8;max-height:70px;overflow:auto}
.rule-buttons{display:flex;gap:6px}
.canvas-wrap{background:#111;padding:12px;border-radius:5px;text-align:center;overflow:auto}
.canvas-wrap canvas{width:200px;height:300px;image-rendering:auto;box-shadow:0 3px 13px #000}
.preview{position:sticky;top:12px}
.preview button{width:100%;margin-top:8px}
.messages{min-height:44px;margin:10px 0;padding:8px;border-left:3px solid #787b72;background:#202220}
.messages.error{border-color:#d15a48;color:#ffc0b5}
.messages.warning{border-color:#d2a446}
.empty{padding:16px;color:#aaa;text-align:center}
.dirty-text{color:#78afc3}
.invalid-text{color:#ff8272}
small{color:#aaa}
@media(max-width:1120px){.workspace{grid-template-columns:1fr 1fr}
.preview{position:static}
}
@media(max-width:760px){.app-header,.file-strip{align-items:stretch;flex-direction:column}
.workspace{grid-template-columns:1fr}
.grid-2,.filter-grid{grid-template-columns:1fr}
.record-list{height:350px}
}

/* Assigned Special Rules */
.assigned-rules{border:1px solid #466675;border-radius:4px;margin:4px 0 10px;padding:9px}
.assigned-rules-list{display:grid;gap:6px}
.assigned-rule{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:start;background:#1c1e1d;border:1px solid #466675;border-radius:4px;padding:8px}
.assigned-rule p{margin:3px 0 0;color:#c9c4b8}
.assigned-rule button{background:#633c32;border-color:#965c4d}
.assigned-rule button:hover{background:#7b493c}
.assigned-rules .empty{padding:8px}
.rule-result.assigned{border-color:#78afc3}

.preview-controls{border-bottom:1px solid #466675;margin-bottom:12px;padding-bottom:3px}