/* roLERbot · sezoanele din blog se deschid ca un dosar de arhivă: dosarul zboară din cardul sezonului, coperta se deschide
   și înăuntru e foaia cu documentația. Ordinea pașilor o dă js/dossier.js (.d-open pe #seasonModal); se încarcă după site-flat.css. */

#seasonModal.modal-overlay { justify-content: center; align-items: center; perspective: 2200px; background: rgba(11, 11, 13, .82); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }

.dossier { --from: none; position: relative; width: min(1040px, 92vw); height: min(840px, calc(100svh - 120px)); margin-top: 38px; transform-style: preserve-3d;
  transform: var(--from); transition: transform .6s cubic-bezier(.65, 0, .35, 1) .5s; }
#seasonModal.d-open .dossier { transform: none; transition: transform .7s cubic-bezier(.16, 1, .3, 1) 0s; }

/* spatele dosarului, cu urechea pe care scrie anul */
.dossier-back { position: absolute; inset: 0; pointer-events: none; border-radius: 6px 18px 18px 18px; background: #c20054;
  background-image: linear-gradient(160deg, rgba(255, 255, 255, .08), transparent 40%), repeating-linear-gradient(0deg, rgba(0, 0, 0, .035) 0 2px, transparent 2px 5px);
  box-shadow: 0 0 0 3px #0b0b0d, 12px 14px 0 #0b0b0d; }
.dossier-ear { position: absolute; left: 0; bottom: 100%; height: 38px; padding: 0 26px; display: flex; align-items: center; border-radius: 14px 14px 0 0;
  background: #c20054; box-shadow: 0 0 0 3px #0b0b0d; clip-path: inset(-4px -4px 0 -4px); font: 600 12px/1 var(--f-mono); letter-spacing: .16em; color: #fff; text-transform: uppercase; }

/* foaia dinăuntru = vechiul .modal-window, acum hârtie crem */
#seasonModal .modal-window { position: absolute; inset: 16px 18px 14px 14px; width: auto; height: auto; transform: translateZ(2px); transition: none; border-radius: 4px;   /* translateZ: deasupra spatelui dosarului și la hit-test când dosarul e înclinat 3D */
  --ink: #0b0b0d; --ink-dim: rgba(11, 11, 13, .78); --mute: rgba(11, 11, 13, .55); --line: rgba(11, 11, 13, .16); --line-strong: rgba(11, 11, 13, .45);
  --bg-2: #fffdf8; --bone: #ebe6da; --pink-hi: #c20054; --cream: #0b0b0d;
  color: #0b0b0d; background: #f4f1ea; background-image: repeating-linear-gradient(0deg, transparent 0 31px, rgba(11, 11, 13, .045) 31px 32px);
  box-shadow: 0 1px 0 rgba(0, 0, 0, .1), 4px 4px 0 rgba(11, 11, 13, .35); }
#seasonModal .modal-window::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 44px; pointer-events: none;
  background: radial-gradient(circle at 22px 50%, #c20054 0 7px, transparent 8px) 0 0 / 44px 120px repeat-y; opacity: .9; }
#seasonModal .modal-header, #seasonModal .modal-tabs, #seasonModal .modal-body { padding-left: max(60px, clamp(20px, 4vw, 56px)); }
#seasonModal .modal-title { font-family: var(--f-display); color: #0b0b0d; }
#seasonModal .modal-title::before { content: 'DOSAR · ARHIVA roLERbot'; display: block; margin-bottom: 8px; font: 600 11px/1 var(--f-mono); letter-spacing: .2em; color: #c20054; }
#seasonModal .modal-close { color: #0b0b0d; box-shadow: inset 0 0 0 2px #0b0b0d; }
#seasonModal .modal-close:hover { background: #f9056c; color: #fff; box-shadow: none; }
#seasonModal .tab-btn { color: rgba(11, 11, 13, .55); }
#seasonModal .tab-btn:hover, #seasonModal .tab-btn.active { color: #0b0b0d; }
#seasonModal .modal-body .activity-card, #seasonModal .modal-body .card { box-shadow: 0 0 0 2px #0b0b0d, 4px 4px 0 #0b0b0d; }
#seasonModal .modal-body .activity-card:hover { box-shadow: 0 0 0 2px #0b0b0d, 6px 6px 0 #f9056c; }
#seasonModal .modal-body .robot-media { background: #ebe6da; }

/* ștampila din colț */
.dossier-stamp { position: absolute; right: 90px; top: 22px; z-index: 3; padding: 6px 12px; border: 3px solid #f9056c; border-radius: 6px; color: #f9056c; pointer-events: none;
  font: 700 13px/1.1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; text-align: center; rotate: -9deg; opacity: 0; scale: 1.8; transition: opacity .15s, scale .3s cubic-bezier(.34, 1.56, .5, 1); mix-blend-mode: multiply; }
#seasonModal.d-open .dossier-stamp { opacity: .8; scale: 1; transition-delay: 1.15s; }

/* conținutul foii apare abia după ce s-a deschis coperta */
#seasonModal .modal-header, #seasonModal .modal-tabs, #seasonModal .modal-body { opacity: 0; transition: opacity .2s; }
#seasonModal.d-open .modal-header, #seasonModal.d-open .modal-tabs, #seasonModal.d-open .modal-body { opacity: 1; transition: opacity .5s .85s; }

/* coperta: se deschide pe balamaua din stânga */
.dossier-cover { position: absolute; inset: 0; z-index: 5; transform-origin: 0 50%; transform-style: preserve-3d; transform: rotateY(0deg);
  transition: transform .55s cubic-bezier(.55, 0, .45, 1) 0s; pointer-events: none; }
#seasonModal.d-open .dossier-cover { transform: rotateY(-178deg); transition: transform 1.05s cubic-bezier(.3, .1, .2, 1) .55s; }
.dc-face, .dc-inside { position: absolute; inset: 0; border-radius: 6px 18px 18px 18px; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.dc-face { background: #f9056c; background-image: linear-gradient(160deg, rgba(255, 255, 255, .14), transparent 45%), repeating-linear-gradient(0deg, rgba(0, 0, 0, .04) 0 2px, transparent 2px 5px);
  box-shadow: 0 0 0 3px #0b0b0d; display: grid; place-content: center; justify-items: center; gap: 26px; padding: 40px; }
.dc-inside { transform: rotateY(180deg); background: #d6005c; background-image: linear-gradient(200deg, rgba(0, 0, 0, .18), transparent 60%); box-shadow: 0 0 0 3px #0b0b0d; }

.dc-label { min-width: min(520px, 70vw); padding: 22px 28px 20px; background: #f4f1ea; color: #0b0b0d; box-shadow: 0 0 0 3px #0b0b0d, 6px 6px 0 #0b0b0d; rotate: -1.5deg; }
.dc-label small { display: block; font: 600 11px/1 var(--f-mono); letter-spacing: .2em; text-transform: uppercase; color: #c20054; }
.dc-label b { display: block; margin: 12px 0 10px; font: 400 clamp(46px, 7vw, 92px)/.9 var(--f-display); letter-spacing: .01em; }
.dc-label span { display: block; padding-top: 10px; border-top: 2px dashed rgba(11, 11, 13, .35); font: 600 12px/1.3 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; }
.dc-photo { width: min(260px, 46vw); padding: 12px 12px 34px; background: #fff; box-shadow: 0 0 0 3px #0b0b0d, 6px 6px 0 #0b0b0d; rotate: 4deg; position: relative; }
.dc-photo img { display: block; width: 100%; aspect-ratio: 5 / 4; object-fit: contain; background: radial-gradient(circle at 50% 100%, #ffc2da, #f2eee7 70%); }
.dc-photo::before { content: ''; position: absolute; left: 50%; top: -14px; width: 96px; height: 26px; translate: -50% 0; rotate: -4deg; background: rgba(244, 241, 234, .75); box-shadow: 0 0 0 1px rgba(11, 11, 13, .15); }

/* dosarul deschis urmărește puțin cursorul (--tx / --ty vin din JS) */
#seasonModal.d-open .dossier { transform: rotateX(var(--tx, 0deg)) rotateY(var(--ty, 0deg)); }

/* foile de dedesubt: se răsfiră când se deschide coperta, ca să pară un dosar plin */
.dossier-back::before, .dossier-back::after { content: ''; position: absolute; inset: 16px 18px 14px 14px; border-radius: 4px; background: #e6e0d2;
  box-shadow: 0 0 0 1px rgba(11, 11, 13, .25), 3px 3px 0 rgba(11, 11, 13, .3); transition: rotate .5s, translate .5s; }
.dossier-back::after { background: #ece7db; }
#seasonModal.d-open .dossier-back::before { rotate: 1.6deg; translate: 8px 6px; transition: rotate .7s cubic-bezier(.34, 1.56, .5, 1) 1s, translate .7s cubic-bezier(.34, 1.56, .5, 1) 1s; }
#seasonModal.d-open .dossier-back::after { rotate: -1.1deg; translate: -4px 4px; transition: rotate .7s cubic-bezier(.34, 1.56, .5, 1) 1.08s, translate .7s cubic-bezier(.34, 1.56, .5, 1) 1.08s; }

/* agrafa de sus: se prinde pe foaie după ce se deschide coperta */
.dossier-clip { position: absolute; left: 30%; top: -26px; z-index: 6; width: 34px; height: 92px; pointer-events: none; color: #0b0b0d;
  translate: 0 -30px; opacity: 0; transition: translate .25s ease-in, opacity .15s; }
.dossier-clip svg { width: 100%; height: 100%; overflow: visible; }
#seasonModal.d-open .dossier-clip { translate: 0 0; opacity: 1; transition: translate .45s cubic-bezier(.34, 1.8, .5, 1) 1.45s, opacity .15s 1.45s; }

/* ștampila „lovește” foaia: foaia tresare și rămân câțiva stropi de tuș */
#seasonModal.d-open .modal-window { animation: dThump .32s ease-out 1.32s; }
@keyframes dThump { 0%, 100% { translate: 0 0; } 30% { translate: 1px 4px; rotate: .25deg; } 60% { translate: -1px -1px; rotate: -.1deg; } }
.dossier-stamp::after { content: ''; position: absolute; inset: -14px; pointer-events: none;
  background: radial-gradient(circle at 8% 20%, #f9056c 0 2px, transparent 2.5px), radial-gradient(circle at 95% 85%, #f9056c 0 3px, transparent 3.5px),
    radial-gradient(circle at 88% 6%, #f9056c 0 1.5px, transparent 2px), radial-gradient(circle at 15% 96%, #f9056c 0 1.5px, transparent 2px); }

/* titlul se bate la mașina de scris */
#seasonModal .modal-title > span { display: inline-block; clip-path: inset(0 100% 0 0); }
#seasonModal.d-open .modal-title > span { animation: dType .7s steps(12, end) .95s forwards; }
#seasonModal.d-open .modal-title > span + span { animation-delay: 1.3s; }
@keyframes dType { to { clip-path: inset(0 0 0 0); } }

/* semnul de carte de pe marginea dreaptă: coboară pe măsură ce citești */
.dossier-mark { position: absolute; right: -30px; top: 40px; width: 44px; height: 54px; padding: 0 0 0 16px; display: grid; place-items: center;
  border-radius: 0 10px 10px 0; background: #f4f1ea; box-shadow: 0 0 0 3px #0b0b0d, 4px 4px 0 #0b0b0d; font: 700 10px/1 var(--f-mono); color: #0b0b0d;
  translate: 0 calc(var(--read, 0) * (min(840px, 100svh - 120px) - 140px)); opacity: 0; transition: opacity .3s; }
#seasonModal.d-open .dossier-mark { opacity: 1; transition: opacity .4s 1.5s; }

/* schimbarea tab-ului: conținutul nou urcă pe foaie, bloc cu bloc */
#seasonModal .tab-content.active > * { animation: dPage .45s cubic-bezier(.16, 1, .3, 1) backwards; }
#seasonModal .tab-content.active > :nth-child(2) { animation-delay: .05s; }
#seasonModal .tab-content.active > :nth-child(3) { animation-delay: .1s; }
#seasonModal .tab-content.active > :nth-child(n+4) { animation-delay: .15s; }
@keyframes dPage { from { opacity: 0; translate: 0 14px; } }

/* pozele din activități sunt prinse în dosar ușor strâmb și se îndreaptă când treci peste ele */
#seasonModal .modal-body .activity-card { rotate: -.8deg; transition: rotate .4s cubic-bezier(.34, 1.56, .5, 1), transform .5s var(--ease), box-shadow .3s; }
#seasonModal .modal-body .activity-card:nth-child(even) { rotate: .9deg; }
#seasonModal .modal-body .activity-card:hover { rotate: 0deg; }

@media (max-width: 700px) {
  .dossier { width: 94vw; height: calc(100svh - 100px); }
  .dossier-stamp, .dossier-mark { display: none; }
  .dossier-clip { left: 46%; }
  #seasonModal .modal-header, #seasonModal .modal-tabs, #seasonModal .modal-body { padding-left: 52px; }
  #seasonModal .modal-window::before { width: 36px; background-position: -4px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .dossier, #seasonModal.d-open .dossier, .dossier-cover, #seasonModal.d-open .dossier-cover { transition: none; }
  #seasonModal.d-open .modal-window, #seasonModal .tab-content.active > * { animation: none; }
  #seasonModal .modal-title > span { clip-path: none; }
  #seasonModal.d-open .dossier-cover { opacity: 0; }
}
