/* 🪤 23.09 МЕРЕНО (nosht_novo): тъмната тема на приложението е html[data-theme="dark"]
   (js/app.js:33 + css/dark.css). html.bl-night е ДРУГО — тихите часове (js/night.js).
   Моите нощни правила бяха само за bl-night → в тъмна тема заглавието на картата
   остана тъмносиньо върху тъмносин филц: контраст 1.24:1. Затова всяко нощно
   правило тук важи И за двете. */
/* ═══════════════════════════════════════════════════════════════════════════════
   🏠 ДЕВЕТТЕ СТАИ · филцови карти с истински сцени · 23.09.2026
   Картата става филцов панел с шев; горе — плюшената сцена на стаята в арка
   (както арките по рафта в референциите), отдолу сериф заглавие и гел „Влез →“.
   Старата SVG сцена НЕ се маха: стои отзад, мека и размита, и продължава да се
   движи — оттам идва животът под плюша.
   ПЪТ НАЗАД: махни <link href="css/pl-stai.css"> от index.html.
   ═══════════════════════════════════════════════════════════════════════════════ */

html.pl-on .room-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  padding: 0 4px;
}
@media (min-width: 620px) { html.pl-on .room-grid { grid-template-columns: 1fr 1fr; gap: 22px; } }
@media (min-width: 1000px) { html.pl-on .room-grid { grid-template-columns: repeat(3, 1fr); } }

/* ── картата: филц с шев ── */
html.pl-on .room-card[data-pl-st] {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-align: left;
  padding: 0 0 16px;
  border: 0;
  border-radius: 28px;
  background: var(--pl-felt-bg, #fffaf3);
  box-shadow: 0 14px 30px rgba(120, 88, 70, .13), inset 0 1px 0 rgba(255, 255, 255, .8);
  overflow: hidden;
  transition: transform .45s cubic-bezier(.22, .9, .3, 1), box-shadow .45s ease;
  animation: plStBreath 7.5s ease-in-out infinite;
  animation-delay: calc(var(--st-i, 0) * .45s);
}
html.pl-on .room-card[data-pl-st]::after {           /* шевът по ръба */
  content: '';
  position: absolute; inset: 9px;
  border: 2px dashed rgba(196, 150, 120, .38);
  border-radius: 21px;
  pointer-events: none;
}
@keyframes plStBreath {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-5px) rotate(-.25deg); }
}
html.pl-on .room-card[data-pl-st]:hover,
html.pl-on .room-card[data-pl-st]:focus-visible {
  transform: translateY(-8px) scale(1.012);
  box-shadow: 0 22px 44px rgba(120, 88, 70, .2), inset 0 1px 0 rgba(255, 255, 255, .9);
  animation-play-state: paused;
}
html.pl-on .room-card[data-pl-st]:active { transform: translateY(-2px) scale(.994); }

/* ── сцената: плюшената снимка в арка, старата SVG остава отзад ── */
html.pl-on .room-card[data-pl-st] .scene-wrap {
  position: relative;
  margin: 0 0 12px;
  padding: 0;
  border-radius: 26px 26px 34px 34px;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  max-height: 236px;
  isolation: isolate;
}
html.pl-on .room-card[data-pl-st] .pl-st-img {
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
  z-index: 2;
  transform: scale(1.02);
  transition: transform .6s cubic-bezier(.22, .9, .3, 1);
  -webkit-mask-image: radial-gradient(120% 110% at 50% 45%, #000 68%, transparent 100%);
  mask-image: radial-gradient(120% 110% at 50% 45%, #000 68%, transparent 100%);
}
html.pl-on .room-card[data-pl-st]:hover .pl-st-img { transform: scale(1.07) translateY(-4px); }
html.pl-on .room-card[data-pl-st] .scene {           /* старата жива сцена: мек фон */
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  z-index: 1;
  opacity: .42;
  filter: blur(7px) saturate(.9);
  transform: scale(1.15);
  transition: opacity .5s ease;
}
html.pl-on .room-card[data-pl-st]:hover .scene { opacity: .62; }

/* ── надписите ── */
html.pl-on .room-card[data-pl-st] h3 {
  margin: 0 18px 6px;
  font-family: var(--pl-serif, Georgia, serif);
  font-size: 22px;
  font-weight: 700;
  color: var(--pl-ink, #2b3a67);
  letter-spacing: .01em;
}
html.pl-on .room-card[data-pl-st] p {
  margin: 0 18px 12px;
  font-size: 13.5px;
  line-height: 1.55;
  color: rgba(70, 60, 75, .82);
  min-height: 62px;
}
/* МЕРЕНО (stai_karti.png): старият .room-badge е absolute и лягаше ВЪРХУ текста */
html.pl-on .room-card[data-pl-st] .room-badge {
  position: static;
  margin-top: auto;
  align-self: flex-start;
  margin: 0 18px;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px;
  min-height: 40px;
  border-radius: 999px;
  font-size: 13px; font-weight: 800;
  color: #7a2f52;
  background: linear-gradient(180deg, #ffd7e6 0%, #ffbcd4 100%);
  box-shadow: 0 6px 14px rgba(224, 122, 160, .3), inset 0 1px 0 rgba(255, 255, 255, .85);
}
html.pl-on .room-card[data-pl-st] .rr-go { opacity: 1; color: #6d2646; }   /* .85 гаснеше върху гела */
html.pl-on .room-card[data-pl-st]:hover .rr-go { animation: plStGo 1.1s ease-in-out infinite; }
@keyframes plStGo { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(4px); } }

/* ── избирачът „Деветте стаи“: същата снимка в арката ── */
html.pl-on .np-b[data-pl-st]::before {
  background-image: var(--st-img) !important;
  background-size: cover !important;
  background-position: center !important;
}

/* ── нощем: филцът потъмнява, снимките се смекчават ── */
html.bl-night.pl-on .room-card[data-pl-st], html[data-theme="dark"].pl-on .room-card[data-pl-st]{
  background: #2a2436;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .06);
}
html.bl-night.pl-on .room-card[data-pl-st]::after, html[data-theme="dark"].pl-on .room-card[data-pl-st]::after{ border-color: rgba(255, 220, 190, .22); }
html.bl-night.pl-on .room-card[data-pl-st] h3, html[data-theme="dark"].pl-on .room-card[data-pl-st] h3{ color: #f2e9ff; }
html.bl-night.pl-on .room-card[data-pl-st] p, html[data-theme="dark"].pl-on .room-card[data-pl-st] p{ color: rgba(236, 232, 245, .78); }
html.bl-night.pl-on .room-card[data-pl-st] .pl-st-img, html[data-theme="dark"].pl-on .room-card[data-pl-st] .pl-st-img{ filter: brightness(.9) saturate(.95); }

@media (prefers-reduced-motion: reduce) {
  html.pl-on .room-card[data-pl-st] { animation: none; }
  html.pl-on .room-card[data-pl-st] .pl-st-img { transition: none; }
}

/* ── рафтът „Влез в своята стая“: деветте истински сцени в арките (23.09) ──
   Преди тук стояха рисуваните room-*.webp — собственикът: „тия тъпи фигури е ужасно“.
   Сега всяка арка носи сцената на своята стая, същата като на голямата карта долу. */
html.pl-on .pl-room .pl-arch { overflow: hidden; }
html.pl-on .pl-room .pl-arch img {
  transform: scale(1.06);
  transition: transform .5s cubic-bezier(.22, .9, .3, 1);
}
html.pl-on .pl-room:hover .pl-arch img,
html.pl-on .pl-room:focus-visible .pl-arch img { transform: scale(1.14) translateY(-2px); }
html.pl-on .pl-rooms .pl-room { animation: plStArch 5.2s ease-in-out infinite; }
html.pl-on .pl-rooms .pl-room:nth-child(2n) { animation-delay: .7s; }
html.pl-on .pl-rooms .pl-room:nth-child(3n) { animation-delay: 1.4s; }
@keyframes plStArch { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@media (prefers-reduced-motion: reduce) { html.pl-on .pl-rooms .pl-room { animation: none; } }

/* ── феята на стаята, кацнала в ъгъла на сцената (23.09) ── */
html.pl-on .room-card[data-pl-st] .pl-st-fey {
  position: absolute;
  left: 10px; bottom: 10px;
  width: 62px; height: 62px;
  z-index: 3;
  border-radius: 50%;
  background-color: rgba(255, 252, 247, .86);
  background-size: 92%;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 6px 14px rgba(120, 88, 70, .22), inset 0 0 0 2px rgba(255, 255, 255, .7);
  animation: plStFey 4.8s ease-in-out infinite;
  animation-delay: calc(var(--st-i, 0) * .37s);
}
@keyframes plStFey {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-6px) rotate(2deg); }
}
html.pl-on .room-card[data-pl-st]:hover .pl-st-fey { animation-duration: 2.4s; }
html.bl-night.pl-on .room-card[data-pl-st] .pl-st-fey,
html[data-theme="dark"].pl-on .room-card[data-pl-st] .pl-st-fey {
  background-color: rgba(42, 36, 54, .9);
  box-shadow: 0 6px 14px rgba(0, 0, 0, .45), inset 0 0 0 2px rgba(255, 255, 255, .12);
}
@media (prefers-reduced-motion: reduce) { html.pl-on .room-card[data-pl-st] .pl-st-fey { animation: none; } }

/* ═══════════════════════════════════════════════════════════════════════════════
   🏛️ 20.10 · СТАИТЕ НА ЕДНО МЯСТО — рафтът става панел от кремав филц със злат кант (gl20)
   Собственикът: „много ми е дървено началото“. Дървото беше тук: лавица под всеки ред
   (premium.css: .pl-room::after #f1dcc0→#dfc2a0) и двоен вътрешен кант като рамка на шкаф.
   Сега: филц, тънка златна нишка, арките — плюшени сцени в златен пръстен, надписът — сериф под арката.
   Движение: еднократна поява на арките (по 45 ms една след друга, outQuart), ЕДИН златен проблясък
   през рафта на 9 s (един елемент, само transform). Безкрайното полюшване на 18-те арки (plStArch +
   plArchBob) и дишането на 9-те големи карти (plStBreath, plStFey) — спрени: бяха 36 безкрайни анимации.
   Под рафта: „Всички отблизо ▾“ разгъва големите карти ТУК (js/premium-home.js, „ПОДРЕДБАТА“).
   ПЪТ НАЗАД: махни този блок (до „край 20.10“).
   ═══════════════════════════════════════════════════════════════════════════════ */
html.pl-gl20 #plHome .pl-shelf {
  position: relative; margin: 24px 12px 0; padding: 16px 14px 18px;
  border-radius: 30px; border: 1px solid rgba(214, 186, 158, .55);
  background: #fffaf3 url(../img/art/felt.webp) 0 0 / 160px 160px; background-blend-mode: multiply;
  box-shadow: 0 16px 32px -8px rgba(110, 76, 52, .2);
}
html.pl-gl20 #plHome .pl-shelf::before {             /* златната нишка — като кант на кутия за бижута */
  content: ''; position: absolute; inset: 7px; border-radius: 24px; border: 1px solid rgba(217, 185, 143, .6); pointer-events: none;
}
html.pl-gl20 #plHome .pl-panel-h { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 2px 4px 14px 8px; }
html.pl-gl20 #plHome .pl-ph { margin: 0; font-family: var(--pl-serif); font-weight: 700; font-size: 21px; line-height: 1.15; color: var(--pl-navy); }
html.pl-gl20 #plHome .pl-vse {
  z-index: 1; margin: 16px auto 0; flex: none; display: flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px;
  border-radius: 999px; border: 1px solid rgba(217, 185, 143, .8); background: #fffdf8; cursor: pointer;
  font: 800 13px/1 Nunito, Nunito-fallback, sans-serif; color: #7a5328;
  box-shadow: 0 2px 6px rgba(110, 76, 52, .1);
}
html.pl-gl20 #plHome .pl-vse::after { content: ''; position: absolute; inset: -4px 0; }      /* пръстът: ≥ 44 px */
html.pl-gl20 #plHome .pl-vse { position: relative; }
html.pl-gl20 #plHome .pl-vse i { font-style: normal; font-size: 12px; }
html.pl-gl20 #plHome .pl-vse:active { transform: scale(.97); }
html.pl-gl20 #plHome .pl-rooms {
  position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 10px;
  margin: 0 -10px -12px; padding: 6px 10px 12px; overflow: hidden; border-radius: 0 0 22px 22px;
}
html.pl-gl20 #plHome .pl-rooms .pl-room {
  min-height: 0; padding: 0; gap: 8px; justify-content: flex-start;
  animation: none !important;
  transition: opacity .6s cubic-bezier(.25, 1, .5, 1), transform .6s cubic-bezier(.25, 1, .5, 1);
  transition-delay: calc(var(--i, 0) * 45ms);
}
html.pl-gl20 #plHome .pl-rooms .pl-room::after { content: none !important; display: none !important; }   /* лавицата */
html.pl-gl20 #plHome .pl-rooms .pl-arch {
  width: 100%; height: auto; aspect-ratio: 1 / 1.04; border-radius: 999px 999px 20px 20px;
  animation: none !important;
  box-shadow: 0 0 0 3px #fffaf3, 0 0 0 4.5px rgba(217, 185, 143, .9), 0 6px 12px rgba(110, 76, 52, .16);
  transition: transform .3s cubic-bezier(.25, 1, .5, 1);
}
html.pl-gl20 #plHome .pl-rooms .pl-arch img { transform: scale(1.04); transition: transform .5s cubic-bezier(.25, 1, .5, 1); }
html.pl-gl20 #plHome .pl-rooms .pl-room:active { transform: none; }            /* натискът е на арката — плочката има закъснение за появата */
html.pl-gl20 #plHome .pl-rooms .pl-room:active .pl-arch { transform: scale(.95); }
html.pl-gl20 #plHome .pl-rooms .pl-room > span:not(.pl-arch) {
  margin: 0; padding: 0; min-width: 0; background: none; box-shadow: none; border-radius: 0;
  font-family: var(--pl-serif); font-weight: 700; font-size: 13.5px; line-height: 1.2; color: var(--pl-navy); white-space: nowrap;
}
/* проблясъкът: един лъч злато минава през рафта за 2 s, после 7 s покой */
html.pl-gl20 #plHome .pl-rooms::after {
  content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 42%; z-index: 2; pointer-events: none;
  background: linear-gradient(105deg, rgba(255, 246, 222, 0) 0, rgba(255, 246, 222, .5) 50%, rgba(255, 246, 222, 0) 100%);
  transform: translate3d(-130%, 0, 0) skewX(-12deg);
  animation: plGlSjaj 9s cubic-bezier(.45, 0, .25, 1) 2.2s infinite;
}
@keyframes plGlSjaj { 0% { transform: translate3d(-130%, 0, 0) skewX(-12deg); } 22%, 100% { transform: translate3d(340%, 0, 0) skewX(-12deg); } }
/* поява: арките изплуват веднъж, когато рафтът влезе в кадър (класът .pl-vh — js/premium-home.js) */
/* 27.10 · ЗАКОНЪТ ЗА СКРИТИЯ ТАБ (комит 25f85ec): арките са навигацията на началото. html.pl-gl20-io се слага ВЕДНАГА
   (premium-home.js), а .pl-vh — чак от наблюдателя, който в скрит таб/headless не тръгва → арките стояха на 0.
   Сега чакат на .4 (преходът до 1 си е същият). ПЪТ НАЗАД: върни „opacity: 0“. */
html.pl-gl20-io #plHome .pl-shelf:not(.pl-vh) .pl-rooms .pl-room { opacity: .4; transform: translate3d(0, 12px, 0); }
/* отметките на firstday.js върху арките: „сега е времето“ (злато) и „спи до раждането“ */
html.pl-gl20 #plHome .pl-rooms .pl-room.pl-sega .pl-arch { box-shadow: 0 0 0 3px #fffaf3, 0 0 0 5.5px #e2b765, 0 0 18px rgba(226, 183, 101, .5), 0 6px 12px rgba(110, 76, 52, .16); }
html.pl-gl20 #plHome .pl-rooms .pl-room.pl-sega::before, html.pl-gl20 #plHome .pl-rooms .pl-room.pl-spi-st::before {
  position: absolute; top: -6px; right: -2px; z-index: 3; padding: 3px 8px; border-radius: 999px;
  font: 800 11.5px/1.1 Nunito, Nunito-fallback, sans-serif; box-shadow: 0 3px 8px rgba(110, 76, 52, .2);
}
html.pl-gl20 #plHome .pl-rooms .pl-room.pl-sega::before { content: 'сега'; background: linear-gradient(180deg, #f8e2b3, #e9c37f); color: #4e3210; }
html.pl-gl20 #plHome .pl-rooms .pl-room.pl-spi-st::before { content: 'спи'; background: #eef0fb; color: #3b4170; }
html.pl-gl20 #plHome .pl-rooms .pl-room.pl-spi-st .pl-arch img { opacity: .62; }
/* нощем */
html[data-theme="dark"].pl-gl20 #plHome .pl-shelf { background: rgba(31, 43, 92, .96); border-color: rgba(255, 255, 255, .14); box-shadow: 0 16px 32px -8px rgba(0, 0, 0, .45); }
html[data-theme="dark"].pl-gl20 #plHome .pl-shelf::before { border-color: rgba(227, 195, 156, .32); }
html[data-theme="dark"].pl-gl20 #plHome .pl-ph { color: #fff; }
html[data-theme="dark"].pl-gl20 #plHome .pl-vse { background: rgba(255, 255, 255, .06); border-color: rgba(227, 195, 156, .55); color: #f3dcb8; box-shadow: none; }
html[data-theme="dark"].pl-gl20 #plHome .pl-rooms .pl-arch { box-shadow: 0 0 0 3px #1f2b5c, 0 0 0 4.5px rgba(227, 195, 156, .55), 0 6px 12px rgba(0, 0, 0, .35); }
html[data-theme="dark"].pl-gl20 #plHome .pl-rooms .pl-arch img { filter: none; opacity: .92; }
html[data-theme="dark"].pl-gl20 #plHome .pl-rooms .pl-room > span:not(.pl-arch) { background: none; box-shadow: none; color: #fff; }
html[data-theme="dark"].pl-gl20 #plHome .pl-rooms::after { background: linear-gradient(105deg, rgba(227, 195, 156, 0) 0, rgba(227, 195, 156, .22) 50%, rgba(227, 195, 156, 0) 100%); }

/* ── големите карти (вече само в „Всички отблизо“): без безкрайно дишане, без размазана жива сцена ── */
html.pl-on .room-card[data-pl-st] { animation: none; }
html.pl-on .room-card[data-pl-st] .pl-st-fey { animation: none; }
/* живата SVG сцена стоеше ПОД плюшената снимка с blur(7px) — вижда се само по ръбовете, а се
   пресмяташе при всеки кадър (9 × размазване). Прибрана е; DOM-ът ѝ остава (helper.js я клонира). */
html.pl-on .room-card[data-pl-st] .scene { display: none; }

@media (prefers-reduced-motion: reduce) {
  html.pl-gl20 #plHome .pl-rooms::after { animation: none; display: none; }
  html.pl-gl20-io #plHome .pl-shelf:not(.pl-vh) .pl-rooms .pl-room { opacity: 1; transform: none; }
  html.pl-gl20 #plHome .pl-rooms .pl-room, html.pl-gl20 #plHome .pl-rooms .pl-arch { transition: none; }
}
/* 🌙 тихите часове (html.bl-night, js/night.js, 22–6 ч.) потъмняваха големите карти И В СВЕТЛА тема —
   мерено 20.10 (gl20_c1): тъмни плочки сред светли карти. В светла тема остават светли; в тъмна — нощните. */
html:not([data-theme="dark"]).pl-gl20 .room-card[data-pl-st] { background: var(--pl-felt-bg, #fffaf3); box-shadow: 0 14px 30px rgba(120, 88, 70, .13), inset 0 1px 0 rgba(255, 255, 255, .8); }
html:not([data-theme="dark"]).pl-gl20 .room-card[data-pl-st]::after { border-color: rgba(196, 150, 120, .38); }
html:not([data-theme="dark"]).pl-gl20 .room-card[data-pl-st] h3 { color: var(--pl-ink, #2b3a67); }
html:not([data-theme="dark"]).pl-gl20 .room-card[data-pl-st] p { color: rgba(70, 60, 75, .82); }
html:not([data-theme="dark"]).pl-gl20 .room-card[data-pl-st] .pl-st-img { filter: none; }
html:not([data-theme="dark"]).pl-gl20 .room-card[data-pl-st] .pl-st-fey { background-color: rgba(255, 252, 247, .86); box-shadow: 0 6px 14px rgba(120, 88, 70, .22), inset 0 0 0 2px rgba(255, 255, 255, .7); }
/* край 20.10 */
