/* ==========================================
   Листик — кабинет учителя
========================================== */

.teacher-screen {
    min-height: 100dvh;
    background: var(--color-bg);
    padding: 28px 20px 40px;
}

.teacher-shell {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}

.teacher-header {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 24px;
}

.teacher-header-row1 {
    display: flex;
    align-items: center;
    gap: 16px;
}

.teacher-header-row1 h1 {
    flex: 1;
    min-width: 0;
    text-align: left;
    font-size: 1.5rem;
    line-height: 1.15;
    margin: 0;
}

.teacher-logo {
    width: 58px;
    height: 58px;
    object-fit: contain;
    flex: 0 0 58px;
}

.teacher-header-subjects {
    padding-left: 74px;
    color: var(--color-text-light);
    font-size: .86rem;
    font-weight: 600;
}

.teacher-header p.teacher-quote {
    padding-left: 74px;
    margin-top: 2px;
    color: var(--color-text-light);
}

.teacher-eyebrow {
    color: var(--color-text-light);
    font-size: .88rem;
    margin-bottom: 4px;
}

.teacher-logout,
.teacher-round-button {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 50%;
    background: rgba(255,255,255,.82);
    color: var(--color-text);
    font-size: 22px;
    box-shadow: var(--shadow);
}

.teacher-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 30px;
}

.teacher-stat {
    background: #fff;
    border-radius: 20px;
    padding: 20px;
}

.teacher-stat strong {
    display: block;
    font-size: 2rem;
    line-height: 1;
}

.teacher-stat span {
    display: block;
    margin-top: 8px;
    color: var(--color-text-light);
}

.teacher-section-title {
    font-size: 1.15rem;
    font-weight: 800;
    margin-bottom: 12px;
}

.teacher-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.teacher-work-card {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    text-align: left;
    background: #fff;
    border-radius: 20px;
    padding: 18px 20px;
    box-shadow: 0 4px 18px rgba(40,60,45,.04);
    transition: transform .18s ease, box-shadow .18s ease;
}

.teacher-work-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-hover);
}

.teacher-work-title {
    font-weight: 800;
    font-size: 1rem;
}

.teacher-work-subject,
.teacher-work-date {
    color: var(--color-text-light);
    font-size: .88rem;
    margin-top: 3px;
}

.teacher-status {
    flex: 0 0 auto;
    border-radius: 999px;
    padding: 8px 12px;
    font-size: .78rem;
    font-weight: 800;
}

.teacher-status.is-waiting {
    background: var(--color-primary-light);
    color: var(--color-primary);
}

.teacher-status.is-checked {
    background: #eef0ee;
    color: #68706a;
}

.teacher-empty {
    background: #fff;
    border-radius: 24px;
    padding: 50px 24px;
    text-align: center;
}

.teacher-empty-icon { font-size: 2.5rem; }
.teacher-empty-title { margin-top: 12px; font-weight: 800; }
.teacher-empty-text { margin-top: 6px; color: var(--color-text-light); line-height: 1.5; }

/* ==========================================
   ПОЛНОЭКРАННЫЙ ПРОСМОТР
   Культурный код: изображение всегда contain,
   фон чёрный. Если пропорции не совпадают с
   экраном — чёрные поля остаются по двум сторонам.
========================================== */

.teacher-viewer {
    position: fixed;
    inset: 0;
    overflow: hidden;
    background: #000;
    color: #fff;
    touch-action: pan-y;
}

.teacher-media-stage {
    position: absolute;
    top: calc(92px + env(safe-area-inset-top));
    left: 0;
    right: 0;
    bottom: calc(92px + env(safe-area-inset-bottom));
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000;
}

.teacher-media {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    user-select: none;
    -webkit-user-drag: none;
}

.teacher-viewer::after {
    content: none;
}

.teacher-viewer-top,
.teacher-viewer-bottom,
.teacher-page-arrow,
.teacher-comment-panel {
    z-index: 10;
}

.teacher-viewer-top {
    top: 0;
    left: 0;
    right: 0;
    padding: 18px 18px calc(18px + env(safe-area-inset-top));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    background: #000000;
}

.teacher-viewer-info {
    text-align: center;
    min-width: 0;
    padding: 8px 14px;
    background: transparent;
}

.teacher-viewer-info strong,
.teacher-viewer-info span {
    display: block;
    text-shadow: 0 1px 6px rgba(0,0,0,.6), 0 1px 2px rgba(0,0,0,.5);
}

.teacher-viewer-info strong { font-size: .95rem; }
.teacher-viewer-info span { margin-top: 2px; font-size: .78rem; color: rgba(255,255,255,.85); }

.teacher-round-button {
    background: rgba(0,0,0,.48);
    color: #fff;
    box-shadow: 0 4px 20px rgba(0,0,0,.2);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}

.teacher-page-arrow {
    top: 50%;
    transform: translateY(-50%);
    width: 46px;
    height: 64px;
    border-radius: 23px;
    background: rgba(0,0,0,.35);
    color: #fff;
    font-size: 42px;
    font-weight: 200;
}

.teacher-page-arrow:disabled {
    opacity: 0;
    pointer-events: none;
}

.teacher-page-prev { left: 12px; }
.teacher-page-next { right: 12px; }

.teacher-viewer-bottom {
    left: 0;
    right: 0;
    bottom: 0;
    padding: 16px 18px calc(18px + env(safe-area-inset-bottom));
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;

    background: #000000;
}

.teacher-comment-toggle,
.teacher-check-button {
    min-height: 52px;
    border-radius: 16px;
    padding: 10px 14px;
    font: inherit;
    font-size: .84rem;
    font-weight: 800;
    box-shadow: 0 4px 18px rgba(0,0,0,.2);
}

.teacher-comment-toggle {
    background: rgba(255,255,255,.88);
    color: #28302b;
    backdrop-filter: blur(10px);
}

.teacher-check-button {
    background: rgba(93,175,109,.82);
    color: #fff;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.teacher-check-button.is-checked {
    background: rgba(255,255,255,.88);
    color: #28302b;
}

.teacher-comment-panel {
    left: 18px;
    right: 18px;
    bottom: calc(100px + env(safe-area-inset-bottom));
    padding: 12px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 10px 40px rgba(0,0,0,.28);
    transform: translateY(20px);
    opacity: 0;
    pointer-events: none;
    transition: .2s ease;
}

.teacher-comment-panel.is-visible {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}

.teacher-comment-panel textarea {
    width: 100%;
    min-height: 90px;
    resize: vertical;
    border: 1px solid var(--color-border);
    border-radius: 14px;
    padding: 12px;
    font: inherit;
    outline: none;
}

.teacher-comment-panel button {
    width: 100%;
    min-height: 44px;
    margin-top: 8px;
    border-radius: 13px;
    background: var(--color-primary);
    color: #fff;
    font-weight: 800;
}

@media (max-width: 600px) {
    .teacher-screen { padding: 20px 14px 30px; }
    .teacher-logo { width: 54px; height: 54px; }
    .teacher-header h1 { font-size: 1.3rem; }
    .teacher-work-card { padding: 15px; }
    .teacher-status { padding: 7px 9px; }
    .teacher-page-arrow { width: 38px; height: 56px; font-size: 34px; }
}

.teacher-head-actions{display:flex;gap:8px;align-items:center}.teacher-avatar{border-radius:50%}.teacher-quote{max-width:620px;font-size:.9rem;line-height:1.4;color:var(--color-text-light)}.teacher-quote strong{color:var(--color-text)}.teacher-quote span{font-size:.78rem}.teacher-search-wrap{margin-bottom:14px}.teacher-search-wrap input{width:100%;box-sizing:border-box;padding:14px 16px;border:1px solid var(--color-border);border-radius:16px;background:#fff;font:inherit}.teacher-student-photo{width:50px;height:50px;border-radius:50%;background:#eef4ef;display:flex;align-items:center;justify-content:center;overflow:hidden;flex:0 0 50px}.teacher-student-photo img{width:100%;height:100%;object-fit:cover}.teacher-work-card{display:grid;grid-template-columns:50px 1fr auto;align-items:center}.teacher-work-meta{color:var(--color-text-light);font-size:.86rem;margin-top:3px}.teacher-draw-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:5;touch-action:none}.teacher-saved-drawing{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:4;pointer-events:none}.teacher-draw-toolbar{position:absolute;z-index:12;left:18px;right:18px;bottom:88px;display:flex;flex-wrap:wrap;gap:7px;align-items:center;justify-content:center;padding:10px 14px;border-radius:22px;background:rgba(0,0,0,.28);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.teacher-draw-toolbar button{width:34px;height:34px;flex:0 0 34px;border:0;border-radius:50%;background:rgba(255,255,255,.9);font-size:18px;display:flex;align-items:center;justify-content:center;padding:0}.teacher-color-dot{padding:0;border:2px solid rgba(255,255,255,.9)!important;box-shadow:0 2px 8px rgba(0,0,0,.28)}.teacher-color-dot.is-active{outline:3px solid rgba(255,255,255,.92);outline-offset:2px}.teacher-eraser-dot{background:#fff!important;color:#333}.teacher-eraser-dot svg{width:17px;height:17px;display:block}.teacher-draw-toolbar label{flex:0 0 auto}.teacher-draw-toolbar button.teacher-undo-stroke{width:34px;height:34px;flex:0 0 34px;border-radius:10px;padding:0;background:rgba(255,255,255,.92);color:#111}.teacher-viewer.comment-mode .teacher-draw-toolbar{display:none}.teacher-viewer.comment-mode .teacher-draw-canvas{pointer-events:none}.teacher-comments-index{position:absolute;z-index:9;top:78px;left:50%;transform:translateX(-50%);padding:8px 12px;border-radius:14px;background:rgba(0,0,0,.45);color:#fff;font-size:13px;line-height:1.3;text-align:center;white-space:nowrap;max-width:calc(100vw - 40px);overflow:hidden;text-overflow:ellipsis}.teacher-draw-toolbar label{background:rgba(0,0,0,.55);padding:7px 10px;border-radius:16px;font-size:12px;display:flex;align-items:center;gap:6px;white-space:nowrap}.teacher-draw-toolbar label input[type="range"]{width:70px}.teacher-saved-comment{position:absolute;z-index:8;left:18px;right:18px;bottom:220px;padding:10px 14px;background:transparent;color:#fff;font-size:14.5px;line-height:1.35;text-shadow:0 1px 6px rgba(0,0,0,.65),0 1px 2px rgba(0,0,0,.5);pointer-events:none;}.profile-modal,.edit-source-menu{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center}.profile-backdrop,.edit-source-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45)}.profile-dialog,.edit-source-menu section{position:relative;z-index:2;width:min(92vw,520px);max-height:90vh;overflow:auto;background:#fff;border-radius:24px;padding:20px;box-sizing:border-box}.profile-dialog header{display:grid;grid-template-columns:40px 1fr 40px;align-items:center}.profile-dialog header h2{text-align:center;margin:0}.profile-dialog header button{border:0;background:none;font-size:30px}.profile-avatar-wrap{text-align:center;margin:14px 0}.profile-avatar-wrap img{width:96px;height:96px;border-radius:50%;object-fit:cover}.profile-photo-actions{display:flex;justify-content:center;gap:8px;margin-top:10px}.profile-photo-actions label{padding:8px 12px;background:#f2f4f2;border-radius:12px;cursor:pointer}.profile-photo-actions input{display:none}.profile-dialog>label{display:block;margin:12px 0}.profile-dialog>label input{display:block;width:100%;box-sizing:border-box;margin-top:6px;padding:12px;border:1px solid var(--color-border);border-radius:12px;font:inherit}.profile-subjects{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 14px}.profile-save{width:100%;padding:13px;border:0;border-radius:14px;background:var(--color-primary);color:#fff;font-weight:800}.edit-source-menu section{display:grid;gap:10px}.edit-source-menu h3{text-align:center}.edit-source-menu button{padding:14px;border:0;border-radius:14px;background:#f1f3f1;font:inherit;font-weight:700}

.teacher-viewer-info{text-align:center;min-width:180px}.teacher-viewer-top{justify-content:center}.teacher-viewer-top .teacher-round-button:first-child{position:absolute;left:18px}.teacher-head-actions{display:flex;gap:8px;align-items:center}.teacher-quote em{font-style:italic}.teacher-quote span{display:block;margin-top:2px}

.teacher-media,.teacher-saved-drawing{pointer-events:none!important}

/* Обновления профиля и fullscreen-проверки. */
.teacher-avatar{object-fit:contain!important;background:#f2f4f2;overflow:hidden}
.teacher-head-actions{display:flex;gap:8px;align-items:center}
.teacher-saved-comment{bottom:104px;z-index:14;max-height:28vh;overflow:auto}
.teacher-comments-index{top:78px;z-index:14}
.teacher-draw-toolbar{z-index:12}
.profile-photo-actions label{display:inline-flex;align-items:center;justify-content:center}
.profile-subjects{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
.profile-subjects label{display:inline-flex!important;align-items:center;gap:5px;margin:0!important;white-space:nowrap}
.profile-subjects input{margin:0}
.profile-save:disabled{opacity:.65;cursor:wait}

/* Финальные правила аватаров и профиля */
.teacher-avatar,
.profile-avatar-frame,
.profile-avatar-frame img,
.teacher-student-photo,
.teacher-student-photo img,
.home-avatar {
    width: 58px;
    height: 58px;
    aspect-ratio: 1 / 1;
    border-radius: 50% !important;
    overflow: hidden;
    flex: 0 0 auto;
}
.teacher-avatar,
.profile-avatar-frame img,
.teacher-student-photo img,
.home-avatar { object-fit: cover !important; display:block; }
.teacher-avatar[src$="icon-512.png"],
.home-avatar[src$="icon-512.png"] { object-fit: cover !important; }
.teacher-student-photo { width:50px; height:50px; flex-basis:50px; background:#eef4ef; }
.profile-avatar-frame { position:relative; width:128px; height:128px; margin:0 auto; background:#f2f4f2; }
.profile-avatar-frame img { width:128px; height:128px; }
.profile-photo-button { position:absolute; right:-4px; bottom:-4px; width:42px; height:42px; padding:0; border:0; background:transparent; border-radius:50%; cursor:pointer; filter:drop-shadow(0 3px 8px rgba(0,0,0,.18)); }
.profile-photo-button img { width:42px; height:42px; object-fit:contain; border-radius:50%; }
.profile-remove-photo { margin-top:10px; border:0; background:none; color:#777; font:inherit; font-size:.82rem; cursor:pointer; text-decoration:underline; }
.profile-icon-button { width:42px; height:42px; padding:0; border:0; background:transparent !important; box-shadow:none !important; }
.profile-icon-button img { width:38px; height:38px; object-fit:contain; display:block; }
.teacher-round-button.profile-icon-button { position:static !important; }
.teacher-header .teacher-avatar { width:58px; height:58px; }
.teacher-saved-comment { bottom:104px; z-index:14; max-width:calc(100vw - 36px); max-height:28vh; overflow:auto; }
.teacher-comment-drag-handle { float:right; margin-left:8px; padding:0 3px; cursor:grab; user-select:none; opacity:.7; }
.teacher-comment-drag-handle:active { cursor:grabbing; }
.teacher-comment-text { white-space:pre-wrap; }
.teacher-viewer.comment-mode .teacher-draw-toolbar { display:none !important; }
.teacher-viewer.comment-mode .teacher-comment-panel { z-index:20; }
.student-comment-overlay { display:flex; align-items:flex-start; gap:10px; }
.student-comment-avatar { width:32px; height:32px; flex:0 0 32px; border-radius:50%; object-fit:cover; background:#fff; }
.student-comment-overlay span { flex:1; }

/* Listik 2.7: жесткая защита нижней панели и жесты */
.teacher-media-stage { z-index: 3; touch-action: pan-x pan-y; }
.teacher-draw-canvas { z-index: 5; pointer-events: none; touch-action: none; }
.teacher-draw-toolbar { z-index: 30; }
.teacher-viewer-bottom { z-index: 100; pointer-events: auto; }
.teacher-viewer-bottom button { position: relative; z-index: 101; pointer-events: auto; cursor: pointer; }
.teacher-comment-panel { z-index: 120; }
.teacher-saved-comment {
  z-index: 40 !important;
  left: 18px !important;
  right: 18px !important;
  top: auto !important;
  bottom: calc(220px + env(safe-area-inset-bottom)) !important;
  max-height: min(22vh, 180px) !important;
  overflow: auto !important;
  touch-action: pan-y;
}
.teacher-comment-drag-handle { display:none !important; }
.teacher-saved-drawing { z-index: 4; pointer-events:none; }
@media (min-width: 601px) {
    .teacher-saved-comment {
        left: 12vw !important;
        right: 18px !important;
    }
}