.canvas-scroll {overflow:auto;}
.room-canvas {min-width:800px; min-height:560px; background-size:100% 100%;}
.seat {width:100px;height:auto;min-height:102px;padding:3px;transform:none;}
.seat-handle {display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;padding:2px;min-height:56px;border:0;font-size:.75rem;touch-action:none;background:transparent;}
.seat .eval-dots {display:flex;gap:0;width:100%;}
.seat .eval-dot {flex:1;min-width:0;width:auto;height:32px;min-height:32px;border-radius:5px;color:#111;font-size:.7rem;}
.seat .eval-dot.active {outline:2px solid #17212b;outline-offset:-2px;font-weight:900;}
.random-selected {box-shadow:0 0 0 6px #ffcb45;z-index:3;}
.student-photo {width:44px;height:44px;object-fit:cover;border-radius:8px;vertical-align:middle;margin-right:8px;}
.unplaced {margin-top:20px;padding:18px;}
.unplaced h2 {font-size:1.1rem;}
.unplaced-list {display:flex;flex-wrap:wrap;gap:10px;}
.unplaced-student {touch-action:none;}
.row-actions {flex-wrap:wrap;}
button:disabled {opacity:.5;cursor:not-allowed;}
.room-editor {max-width:none;min-height:0;background-size:100% 100%;overflow:hidden;}
.room-editor .place {transform:none;min-height:0;min-width:0;padding:0;}
.row:has(> .student-photo) {grid-template-columns:44px 1fr auto;}
.selected-evaluation {padding:18px;grid-column:1/-1;}
.selected-evaluation h2 {margin-top:0;font-size:1.1rem;}
.large-scores {display:flex;flex-wrap:wrap;gap:8px;}
.large-scores button {min-height:48px;}
.large-scores button[aria-pressed="true"] {outline:3px solid var(--blue);}

.workspace {display:block;min-height:0;}
.topbar {height:auto;min-height:68px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px;gap:16px;}
.top-tabs {display:flex;align-items:center;gap:6px;margin-right:auto;}
.top-tabs a {display:flex;align-items:center;min-height:44px;padding:0 16px;border-radius:10px;color:var(--muted);text-decoration:none;font-weight:750;}
.top-tabs a.active {background:var(--navy);color:white;}
.top-actions {margin-left:0;}
.room-grid-controls {display:flex;align-items:center;gap:12px;margin-bottom:12px;}
#room-fit {width:100%;display:flex;justify-content:center;align-items:flex-start;min-width:0;}
#room-editor {flex:none;min-width:0;min-height:0;max-width:100%;aspect-ratio:auto;border:0;border-radius:4px;outline:1px solid var(--line);background-color:white;background-image:linear-gradient(to right,#64748b30 1px,transparent 1px),linear-gradient(to bottom,#64748b30 1px,transparent 1px),var(--room-image,none);background-size:var(--grid-step) var(--grid-step),var(--grid-step) var(--grid-step),100% 100%;background-position:0 0;overflow:visible;}
#room-editor .place {border-width:2px;display:block;border-radius:4px;}
.place button {min-width:0;min-height:0;padding:0;}
.place-move {position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;cursor:grab;touch-action:none;font-size:11px;text-align:left;padding-left:3px!important;}
.place-remove,.place-color-toggle {position:absolute;right:-2px;width:min(22px,50%);height:min(22px,50%);border-radius:4px;font-size:16px;line-height:1;z-index:2;}
.place-remove {top:-2px;background:white;color:var(--danger);border:1px solid #e9b5b5;}
.place-color-toggle {bottom:-2px;border:1px solid #0004;background:var(--place);color:#17212b;}
#place-palette {position:fixed;inset:auto;margin:0;padding:8px;width:200px;border:1px solid var(--line);border-radius:12px;background:white;box-shadow:var(--shadow);}
#place-palette:popover-open {display:grid;grid-template-columns:repeat(4,1fr);gap:6px;}
.color-swatch {background:var(--swatch);width:40px;min-height:40px;padding:0;border:1px solid #0003;border-radius:7px;}
.color-swatch[aria-pressed="true"] {outline:3px solid var(--ink);outline-offset:1px;}
.trombi-row {display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;margin:14px 0;}
.trombi-row img {width:72px;height:96px;object-fit:contain;border-radius:5px;}
.trombi-row label {display:block;margin-bottom:6px;}
.trombi-row small {color:var(--muted);}
.trombi-row .error {font-size:.85rem;margin:4px 0;}
@media(max-width:680px){.topbar{gap:8px;padding-inline:12px}.top-tabs{gap:0}.top-tabs a{padding:0 9px}.top-actions{gap:5px}.top-actions select{padding:0 6px}.topbar .brand{font-size:1rem}.content{padding:16px}.room-grid-controls button{min-height:40px}.page-head{margin-bottom:12px}}