/* One uniform room scale keeps the saved places and pupil cards square. */
.session-layout {align-items:start;}
#session-stage {display:block;min-width:0;overflow:auto;overscroll-behavior:contain;}
#session-canvas {margin:0 auto;min-width:0;min-height:0;max-width:none;aspect-ratio:auto;overflow:visible;border:0;border-radius:4px;background-color:white;background-size:100% 100%;outline:1px solid var(--line);touch-action:pan-x pan-y;}
/* A square must not depend on percentage-height resolution in the room container. */
.seat {display:block;position:absolute;box-sizing:border-box;height:auto;aspect-ratio:1 / 1;min-height:0;min-width:0;padding:0;border:2px solid var(--seat);border-radius:4px;box-shadow:none;transform:none;container-type:inline-size;}
.seat-handle {position:absolute;inset:0;width:100%;height:100%;min-height:0;min-width:0;margin:0;padding:0;border:0;border-radius:2px;display:block;overflow:hidden;background:#e2e8f0;touch-action:none;cursor:grab;}
.seat.has-skill .seat-handle {width:76%;right:auto;}
.session-portrait {display:block;width:100%;height:100%;object-fit:cover;object-position:center top;pointer-events:none;user-select:none;-webkit-user-drag:none;}
.student-name {position:absolute;bottom:0;left:0;width:100%;padding:3px 2px;color:white;background:rgba(15,23,42,.72);font-size:clamp(7px,12cqi,15px);line-height:1.15;font-weight:750;text-align:center;overflow-wrap:anywhere;pointer-events:none;}
.portrait-placeholder {display:grid;place-items:center;width:100%;height:100%;color:#475569;font-size:clamp(12px,30cqi,38px);background:linear-gradient(145deg,#f1f5f9,#cbd5e1);}
.free-seat {display:grid;place-items:center;height:100%;font-size:clamp(8px,15cqi,16px);background:color-mix(in srgb,var(--seat) 10%,white);}
.seat .eval-dots {position:absolute;right:0;top:0;width:24%;height:100%;display:flex;flex-direction:column;gap:0;margin:0;padding:0;background:white;}
.seat .eval-dot {flex:1;width:100%;height:20%;min-height:0;min-width:0;border:1px solid #ffffff75;border-radius:0;padding:0;margin:0;position:relative;}
.seat .eval-dot[data-value="4"] {background:#10b981;}
.seat .eval-dot[data-value="3"] {background:#2684ed;}
.seat .eval-dot[data-value="2"] {background:#facc15;}
.seat .eval-dot[data-value="1"] {background:#ef4444;}
.seat .eval-dot[data-value="0"] {background:#9ca3af;}
.seat .eval-dot.active {outline:2px solid #17212b;outline-offset:-2px;z-index:1;}
.seat .eval-dot.active::after {content:'';position:absolute;width:25%;aspect-ratio:1;left:37.5%;top:35%;background:white;border-radius:50%;box-shadow:0 0 0 1px #17212b;}
.sr-only {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.unplaced-student {position:relative;width:112px;height:112px;min-height:0;flex:none;padding:0;overflow:hidden;border:2px solid #94a3b8;border-radius:4px;container-type:inline-size;touch-action:none;cursor:grab;}
.seat.is-dragging,.unplaced-student.is-dragging {opacity:.25;}
.seat.drop-target {outline:4px solid #2563eb;outline-offset:2px;z-index:4;}
.seat.random-selected {box-shadow:0 0 0 5px #ffcb45;z-index:3;}
.drag-preview {z-index:1000!important;pointer-events:none!important;opacity:.94;box-shadow:0 12px 30px #0004!important;will-change:transform;cursor:grabbing;}
.drag-preview * {pointer-events:none!important;}
.drag-preview button:disabled {opacity:1;}
.random-focus {width:min(420px,calc(100vw - 32px),calc(100dvh - 112px));padding:0;border:0;background:transparent;overflow:visible;box-shadow:none;}
.random-focus::backdrop {background:rgba(14,28,42,.65);}
.random-focus .random-focus-card {position:relative;width:100%;height:auto;inset:auto;animation:random-focus-in .22s ease-out;}
.random-focus .seat-handle:disabled {opacity:1;cursor:default;}
.random-focus-close {width:100%;margin-top:14px;}
@keyframes random-focus-in {from {transform:scale(.7);opacity:.4;} to {transform:scale(1);opacity:1;}}
@media(prefers-reduced-motion:reduce) {.random-focus .random-focus-card {animation:none;}}