/* A compact workbench using the teacher workspace's existing palette and type.
   Corners, spacing and type come from the scales in tokens.css. */
.rubric-dialog { color: var(--fg); background: var(--card); border: 1px solid var(--border); border-radius: var(--r-card); padding: 0; width: min(640px, calc(100vw - var(--sp-24))); max-height: calc(100dvh - var(--sp-32)); box-shadow: var(--shadow-modal); }
.rubric-dialog::backdrop { background: var(--scrim); }
.rubric-dialog[open] { display: flex; flex-direction: column; overflow: hidden; }
.rubric-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-16); padding: var(--sp-16) var(--sp-24); border-bottom: 1px solid var(--border); }
.rubric-dialog-head h2 { margin: 0; font: 600 var(--fs-18)/1.35 var(--font-sans); overflow-wrap: anywhere; }
.rubric-dialog-body { padding: var(--sp-24); overflow-y: auto; min-height: 0; }
.rubric-intro, .rubric-hint, .rubric-status { font: 400 var(--fs-13)/1.55 var(--font-sans); color: var(--fg-muted); margin: 0 0 var(--sp-16); }
.rubric-select { width: 100%; }
.rubric-select select { width: 100%; text-overflow: ellipsis; }
.rubric-preview { padding: var(--sp-16) 0 var(--sp-8); min-height: 120px; }
.rubric-preview h3, .rubric-editor h3 { font: 600 var(--fs-16)/1.4 var(--font-sans); margin: 0 0 var(--sp-8); overflow-wrap: anywhere; }
.rubric-preview ol { margin: 0 0 var(--sp-16); padding-left: var(--sp-24); font: 400 var(--fs-14)/1.6 var(--font-sans); }
.rubric-preview li { padding-left: var(--sp-4); margin: var(--sp-8) 0; overflow-wrap: anywhere; }
.rubric-actions { display: flex; flex-wrap: wrap; gap: var(--sp-8); justify-content: flex-end; padding-top: var(--sp-16); border-top: 1px solid var(--border); }
.rubric-actions[hidden], .rubric-editor[hidden] { display: none; }
.rubric-actions > :first-child { margin-right: auto; }
.rubric-editor label { display: grid; gap: var(--sp-8); margin: var(--sp-16) 0; font: 600 var(--fs-14)/1.4 var(--font-sans); }
.rubric-editor textarea { width: 100%; resize: vertical; min-height: 120px; }
.rubric-status:empty { display: none; }
.rubric-scope-row, .rubric-assignment-choice { display: flex; gap: var(--sp-8); align-items: center; flex-wrap: wrap; }
.rubric-scope-row { padding: var(--sp-8) 0; }
.rubric-scope-button { display: inline-flex; align-items: center; gap: var(--sp-8); max-width: min(42ch, 100%); white-space: nowrap; }
.rubric-scope-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.rubric-scope-button svg { flex: none; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; color: var(--c-accent-ink); }
.rubric-scope-row > span, .rubric-choice-label { font: 400 var(--fs-13)/1.45 var(--font-sans); color: var(--fg-muted); }
.rubric-assignment-choice { margin: var(--sp-16) 0 var(--sp-8); }
/* A quiet button in a table cell. The negative margin puts its icon where the
   cell's other content starts; the matching padding is the hover inset. */
.rubric-assigned-button { display: inline-flex; align-items: center; gap: var(--sp-8); max-width: 100%; min-height: 36px; margin: 0 0 0 calc(-1 * var(--sp-4)); padding: 0 var(--sp-4); border: 0; border-radius: var(--r-btn); background: transparent; color: var(--fg-muted); font: 500 var(--fs-13)/1.5 var(--font-body); text-align: left; cursor: pointer; }
.rubric-assigned-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rubric-assigned-button svg { flex: none; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.rubric-assigned-button.has-rubric { color: var(--fg); }
.rubric-assigned-button.has-rubric svg { color: var(--c-accent-ink); }
.rubric-assigned-button:hover { color: var(--fg); background: var(--surface-hover); }
.rubric-assigned-button:focus-visible { outline: 2px solid var(--ring); outline-offset: -2px; }
@media (pointer: coarse), (max-width: 640px) { .rubric-assigned-button { min-height: 44px; } }
@media(max-width: 540px) { .rubric-dialog-head, .rubric-dialog-body { padding: var(--sp-16); } .rubric-actions .btn-mini { flex: 1 1 auto; } }