/* «Воспоминания» 2.0 — the player of memories-engine.js and the theme chooser (memories-demo.html) */
html.mem-open{overflow:hidden}
.mem{position:fixed;inset:0;z-index:200;background:#0b0d0b;color:#f6eedf;font:15px/1.4 Arial,sans-serif;user-select:none;-webkit-user-select:none}
.mem-stage{position:absolute;inset:0;overflow:hidden}
.mem-layer{position:absolute;inset:0;overflow:hidden;will-change:opacity,transform}
.mem-bg{position:absolute;inset:-6%;width:112%;height:112%;object-fit:cover;filter:blur(28px) brightness(.55) saturate(1.1);transform:scale(1.05)}
.mem-fg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;will-change:transform;transform-origin:center}
.mem-cap{position:absolute;inset:auto 0 0 0;padding:60px 28px 64px;background:linear-gradient(#0000,#000a);font:600 17px/1.3 Georgia,serif;text-shadow:0 1px 6px #000a;pointer-events:none}
.mem-card{display:grid;place-items:center}
.mem-card .mem-bg{filter:blur(22px) brightness(.45)}
.mem-card-text{position:relative;text-align:center;padding:0 24px;max-width:900px}
.mem-card-text h2{margin:0;font:400 clamp(30px,6vw,72px)/1.1 Georgia,serif;letter-spacing:.02em;text-shadow:0 2px 24px #000c}
.mem-card-text p{margin:14px 0 0;font:clamp(15px,2vw,22px)/1.3 Arial,sans-serif;opacity:.85;letter-spacing:.12em;text-transform:uppercase}
.mem-collage{display:grid;grid-template-columns:repeat(var(--n),1fr);gap:14px;padding:5vh 4vw 9vh;background:#0b0d0b}
.mem-tile{position:relative;overflow:hidden;border-radius:10px;box-shadow:0 10px 30px #0008}
.mem-tile img{width:100%;height:100%;object-fit:cover}
.mem-head{position:absolute;top:0;inset-inline:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:linear-gradient(#000a,#0000);z-index:2}
.mem-title{font:600 16px/1.3 Georgia,serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mem-bar{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:8px;padding:6px;border-radius:999px;background:#0008;backdrop-filter:blur(8px);z-index:2}
.mem-btn{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:#fff;font-size:18px;cursor:pointer}
.mem-btn:hover,.mem-btn:focus-visible{background:#ffffff22;outline:none}
.mem-progress{position:absolute;bottom:0;inset-inline:0;height:3px;background:#ffffff22;z-index:2}
.mem-progress span{display:block;height:100%;width:0;background:#e4c48e;transition:width .6s ease}
@media(max-width:600px){.mem-cap{padding:50px 16px 74px;font-size:15px}.mem-collage{gap:8px;padding:8vh 3vw 12vh}}
@media(prefers-reduced-motion:reduce){.mem-progress span{transition:none}}

/* the chooser (memories-chooser.js): a calm light window, the same on the desktop and on /m/ (Andrew 17.10: «прозрачные были лучше» — no yellow) */
.memc{box-sizing:border-box;width:min(640px,calc(100vw - 20px));max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:18px;background:#f5f3ed;color:#232923;box-shadow:0 24px 60px #0008;font:15px/1.4 Arial,sans-serif}
.memc[open]{display:flex;flex-direction:column}
.memc::backdrop{background:#000a}
.memc-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px 6px}
.memc-head h2{margin:0;font:400 24px/1.2 Georgia,serif}
.memc-close{width:42px;height:42px;border:1px solid #cfc6b2;border-radius:50%;background:transparent;color:inherit;font-size:16px;cursor:pointer}
.memc-day{display:flex;align-items:center;gap:14px;margin:8px 18px 0;min-height:64px;padding:10px 16px;border:1px solid #b9ad92;border-radius:14px;background:#fffdf8;color:inherit;font:inherit;text-align:start;cursor:pointer;box-shadow:0 2px 8px #23292314}
.memc-day:hover,.memc-theme:hover,.memc-chip:hover{background:#efeadd}
.memc-day .memc-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#232923;color:#f5f3ed;font-size:14px;padding-inline-start:3px;box-sizing:border-box}
.memc-day b,.memc-theme b{display:block;font-size:16px}.memc-day b{font:400 19px/1.2 Georgia,serif}
.memc-day small,.memc-theme small{display:block;font-size:12px;color:#6b725f}
.memc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;padding:10px 18px 0}
.memc-theme{display:flex;align-items:center;gap:10px;min-height:58px;padding:8px 12px;border:1px solid #d8d0bd;border-radius:12px;background:#fffdf8;color:inherit;font:inherit;text-align:start;cursor:pointer}
.memc-theme[aria-expanded="true"]{border-color:#232923;background:#efeadd}
.memc-ic{flex-shrink:0;width:26px;text-align:center;font-size:20px}
.memc-pick{margin:10px 18px 0;padding:12px;border:1px solid #d8d0bd;border-radius:12px;background:#fffdf8;overflow:auto;max-height:36vh}
.memc-pick[hidden]{display:none}
.memc-chips{display:flex;flex-wrap:wrap;gap:8px}
.memc-chip{min-height:40px;padding:6px 14px;border:1px solid #cfc6b2;border-radius:999px;background:transparent;color:inherit;font:inherit;font-size:14px;cursor:pointer}
.memc-chip small{margin-inline-start:6px;color:#6b725f;font-size:12px}
.memc-find{display:block;box-sizing:border-box;width:100%;height:44px;margin:0 0 10px;padding:8px 12px;border:1px solid #b9ad92;border-radius:10px;background:#fff;color:inherit;font-size:16px}
.memc-status{min-height:20px;margin:10px 18px 16px;color:#5d6658;font-size:14px}
.memc-status:empty{margin-bottom:8px}
@media(max-width:600px){.memc-grid{grid-template-columns:1fr 1fr}.memc-theme small{display:none}}
/* 2.3.187 (аудит B п.15: iPhone lying 812×330 — «Удиви меня» below the window's edge without a sign): on a low screen the window scrolls as a whole, the cards are lower */
@media(max-height:520px){.memc{overflow-y:auto;overscroll-behavior:contain}.memc-head{padding-top:8px}.memc-day{min-height:48px;padding-block:6px}.memc-theme{min-height:46px}.memc-status:empty{display:none}}
.memc-chip small.memc-hint{margin-inline-start:6px;padding:1px 6px;border-radius:8px;background:#ece6d6;color:#5d6658;font-size:11.5px}   /* 2.3.187: the years of a namesake */
/* 2.3.191: the music credit line on «О сайте» */
.music-credits{margin:10px 0 0;font-size:13px;opacity:.85}.music-credits a{color:inherit;text-decoration:underline;text-underline-offset:3px}
/* 2.3.224 (Andrew, audit list п.10 OPEN: «✕ фильма крупнее»): the close of a film — larger, on a dark round */
.mem-btn.mem-close{width:56px;height:56px;font-size:28px;background:#0000008c;border:1px solid #ffffff59}
.mem-btn.mem-close:hover,.mem-btn.mem-close:focus-visible{background:#000000c0}
/* 2.3.233 (audit 24.10 F10): the iPhone lying - the title and the cross stay out of the notch */
.mem-head{padding-left:calc(18px + env(safe-area-inset-left,0px));padding-right:calc(18px + env(safe-area-inset-right,0px))}