/* Паки фото: выбор перед загрузкой, альбом и просмотр. */
#fgu-diary-design dialog.upload-review,#fgu-diary-design dialog.photo-pack{width:min(560px,calc(100vw - 20px));max-height:calc(100dvh - 24px);padding:18px;border-radius:26px;border:1px solid var(--fd-border);background:var(--fd-surface);color:var(--fd-text);overflow:auto;box-sizing:border-box}
#fgu-diary-design dialog.upload-review::backdrop,#fgu-diary-design dialog.photo-pack::backdrop{background:#000a;backdrop-filter:blur(6px)}
#fgu-diary-design .upload-modes{display:grid;gap:8px;margin:12px 0;padding:0;border:0}
#fgu-diary-design .upload-mode{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid var(--fd-border);border-radius:16px;cursor:pointer}
#fgu-diary-design .upload-mode:has(input:checked){border-color:var(--fd-text);background:color-mix(in srgb,var(--fd-text) 8%,transparent)}
#fgu-diary-design .upload-mode span{display:grid;gap:2px}.upload-mode small{color:var(--fd-muted)}
#fgu-diary-design .upload-review-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0}
#fgu-diary-design .upload-review-tools span{flex:1;min-width:120px}
#fgu-diary-design .upload-grid,#fgu-diary-design .photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;margin:8px 0 14px}
#fgu-diary-design .upload-tile{position:relative;display:grid;gap:4px;padding:0;border-radius:14px;overflow:hidden;cursor:pointer;transition:opacity .2s,transform .2s}
#fgu-diary-design .upload-tile.off{opacity:.35;transform:scale(.96)}
#fgu-diary-design .upload-tile input{position:absolute;top:8px;left:8px;z-index:2;width:22px;height:22px;accent-color:#53d18d}
#fgu-diary-design .upload-thumb{display:grid;place-items:center;aspect-ratio:1;border-radius:14px;background:color-mix(in srgb,var(--fd-text) 8%,transparent);font-size:28px;overflow:hidden}
#fgu-diary-design .upload-thumb img{width:100%;height:100%;object-fit:cover}
#fgu-diary-design .upload-tile small{display:block;padding:0 4px 4px;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--fd-muted)}
#fgu-diary-design .upload-review-actions,#fgu-diary-design .photo-tools{display:flex;flex-wrap:wrap;gap:8px}
#fgu-diary-design .upload-review-actions .fd-primary{flex:1 1 220px}
#fgu-diary-design .photo-pack header{display:grid;gap:2px;margin-bottom:10px}#fgu-diary-design .photo-pack h2{margin:0}
#fgu-diary-design .photo-status{min-height:1.2em;margin:8px 0 0}
#fgu-diary-design .photo-tile{position:relative;aspect-ratio:1;padding:0;border:1px solid var(--fd-border);border-radius:14px;overflow:hidden;background:color-mix(in srgb,var(--fd-text) 8%,transparent);cursor:pointer}
#fgu-diary-design .photo-tile img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .3s}
#fgu-diary-design .photo-tile img[src]{opacity:1}
#fgu-diary-design .photo-tile.failed::after{content:'🖼';position:absolute;inset:0;display:grid;place-items:center;font-size:26px}
#fgu-diary-design .photo-tile.on{outline:3px solid #53d18d;outline-offset:-3px}
#fgu-diary-design .photo-check{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:14px;color:#fff;background:#0009;border:2px solid #fff}
#fgu-diary-design .photo-tile.on .photo-check{background:#53d18d}
#fgu-diary-design .photo-viewer{position:fixed;inset:0;z-index:20;display:grid;grid-template-rows:1fr auto auto;gap:8px;padding:12px;background:#000d;backdrop-filter:blur(10px)}
#fgu-diary-design .photo-viewer img{width:100%;height:100%;min-height:0;object-fit:contain;border-radius:12px}
#fgu-diary-design .photo-viewer p{margin:0;text-align:center;color:#ddd}
#fgu-diary-design .photo-viewer-bar{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}
#fgu-diary-design .photo-nav{position:absolute;top:50%;width:46px;height:60px;margin-top:-30px;font-size:30px;padding:0;background:#0007}
#fgu-diary-design .photo-nav:nth-of-type(1){left:8px}#fgu-diary-design .photo-nav:nth-of-type(2){right:8px}
#fgu-diary-design .file-delete{margin-top:8px}
#fgu-diary-design .lesson-file-attachment{position:relative;display:block}
#fgu-diary-design .lesson-file-attachment .lesson-file-delete{position:absolute;top:-10px;right:-8px;left:auto;z-index:3;width:24px;min-width:24px;height:24px;min-height:24px;margin:0;padding:0;border-radius:50%;font-size:16px;line-height:1;display:grid;place-items:center;background:var(--glass-opaque,var(--fd-surface));border:1px solid var(--fd-border);color:var(--fd-muted);animation:file-cross-pop .7s cubic-bezier(.3,1.6,.5,1) both .35s;transition:transform .2s cubic-bezier(.3,1.6,.5,1),color .2s,border-color .2s}
#fgu-diary-design .lesson-file-attachment .lesson-file-delete::after{content:'';position:absolute;inset:-1px;border-radius:50%;border:1.5px solid currentColor;opacity:0;pointer-events:none;animation:file-cross-ring 1.1s ease-out .7s 2 both}
#fgu-diary-design .lesson-file-attachment .lesson-file-delete:is(:hover,:focus-visible){transform:scale(1.28);color:#ff6b6b;border-color:#ff6b6b}
#fgu-diary-design .lesson-file-attachment .lesson-file-delete:active:not(:disabled){transform:scale(1.5)}
#fgu-diary-design .lesson-file-attachment .lesson-file-delete.is-expanding{animation:file-cross-expand .32s cubic-bezier(.3,1.6,.5,1) both;color:#ff6b6b;border-color:#ff6b6b}
#fgu-diary-design .lesson-file-attachment .lesson-file-delete.is-expanding::after{animation:file-cross-ring .5s ease-out both}
@keyframes file-cross-expand{0%{transform:scale(1)}100%{transform:scale(1.6)}}
@keyframes file-cross-pop{0%{transform:scale(.2);opacity:0}60%{transform:scale(1.35);opacity:1}100%{transform:scale(1)}}
@keyframes file-cross-ring{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.6);opacity:0}}
@media(prefers-reduced-motion:reduce){#fgu-diary-design .lesson-file-attachment .lesson-file-delete,#fgu-diary-design .lesson-file-attachment .lesson-file-delete::after{animation:none}}
/* кнопки всегда под рукой, даже если фото много */
#fgu-diary-design .upload-review-actions{position:sticky;bottom:-18px;z-index:3;margin:0 -18px -18px;padding:12px 18px 18px;background:linear-gradient(to top,var(--fd-surface) 70%,transparent)}
#fgu-diary-design .upload-review-actions .fd-primary:disabled{opacity:.45}
#fgu-diary-design .pack-merge-bar{margin:0 0 10px}
