/* =========================================================
   ИВОЛГА — Y2K / ретро-вебкор стиль
   Палитра: белый + фиолетовый + чёрный
   ========================================================= */

:root{
  --violet:#8b5cf6;
  --violet-light:#c4b5fd;
  --violet-deep:#6d28d9;
  --black:#0d0b12;
  --white:#ffffff;
  --white-dark:#f2edfb;
  --ink:#1d1526;
  --violet-acc2:#c084fc;
  --violet-acc3:#a78bfa;
  --violet-acc4:#7c3aed;
  --lavender-gray:#e6def9;
}

*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}

html,body{
  margin:0; padding:0;
  background:
    radial-gradient(circle at 15% 10%, rgba(139,92,246,0.14), transparent 40%),
    radial-gradient(circle at 85% 90%, rgba(109,40,217,0.10), transparent 40%),
    var(--white);
  color:var(--ink);
  font-family:'Quicksand', sans-serif;
  overflow-x:hidden;
  cursor:default;
}

h1,h2,h3{font-family:'Fredoka', sans-serif; margin:0;}

img{max-width:100%; display:block;}

/* ============ TICKER ============ */
.ticker{
  background:var(--black);
  color:var(--violet-light);
  overflow:hidden;
  white-space:nowrap;
  padding:6px 0;
  font-family:'VT323', monospace;
  font-size:0.95rem;
  border-bottom:2px solid var(--violet);
}
.ticker-track{display:inline-block; animation:scroll-left 22s linear infinite;}
.ticker-track span{padding-right:40px;}
@keyframes scroll-left{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

/* ============ TOP NAV ============ */
.topnav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
  padding:12px 16px;
  background:var(--white);
  border-bottom:3px solid var(--black);
  position:sticky;
  top:0;
  z-index:500;
}
.logo-wrap{display:flex; align-items:center; gap:6px; cursor:pointer;}
.logo-emoji{font-size:1.6rem;}
.logo-text{
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:1.6rem;
  color:var(--black);
  letter-spacing:-0.5px;
  text-shadow:2px 2px 0 var(--violet);
}
.logo-text.small{font-size:1.3rem; text-shadow:1px 1px 0 var(--violet-light); color:var(--white);}

.nav-links{
  display:flex;
  gap:6px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  flex:1;
  justify-content:center;
}
.nav-links::-webkit-scrollbar{display:none;}

.nav-pill{
  flex:0 0 auto;
  background:var(--white-dark);
  border:2px solid var(--black);
  border-radius:20px;
  padding:6px 13px;
  font-family:'Quicksand', sans-serif;
  font-weight:600;
  font-size:0.78rem;
  cursor:pointer;
  color:var(--ink);
  white-space:nowrap;
}
.nav-pill.active{background:var(--violet); box-shadow:2px 2px 0 var(--black);}

.search-wrap{display:flex; gap:4px; flex:0 0 auto;}
.search-wrap input{
  border:2px solid var(--black);
  border-radius:14px 0 0 14px;
  padding:7px 12px;
  font-family:'Quicksand', sans-serif;
  font-size:0.8rem;
  width:130px;
  background:#fff;
}
.search-wrap button{
  border:2px solid var(--black);
  border-left:none;
  border-radius:0 14px 14px 0;
  background:var(--violet);
  padding:6px 12px;
  cursor:pointer;
}

/* ============ HERO ============ */
.hero{
  position:relative;
  padding:50px 20px 60px;
  text-align:center;
  background:
    repeating-linear-gradient(135deg, transparent 0 22px, rgba(139,92,246,0.07) 22px 44px);
  overflow:hidden;
}

.hero-text-block{
  position:relative;
  z-index:2;
}
.hero-title{
  font-size:2.4rem;
  line-height:1.15;
  color:var(--black);
  text-shadow:3px 3px 0 var(--violet);
}
.hero-title span{color:var(--violet-deep); text-shadow:3px 3px 0 var(--black);}
.hero-sub{
  font-size:0.95rem;
  color:var(--ink);
  margin:14px 0 20px;
  font-weight:600;
}
.hero-btn{
  background:var(--black);
  color:var(--violet-light);
  border:2px solid var(--black);
  padding:13px 26px;
  border-radius:24px;
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:0.95rem;
  cursor:pointer;
  box-shadow:3px 3px 0 var(--violet-deep);
}
.hero-btn:active{transform:translate(2px,2px); box-shadow:1px 1px 0 var(--violet-deep);}

/* Плашки — абсолютно позиционированы внутри .hero, не зависят от потока */
.hero-stickers{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.float-badge{
  position:absolute;
  height:32px;
  line-height:32px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  border:2px solid var(--black);
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:0.72rem;
  color:#fff;
  white-space:nowrap;
  overflow:hidden;
  animation:float-badge 3.5s ease-in-out infinite;
  pointer-events:none;
}
/* Одиночные эмодзи — идеальные фиксированные кружки (не "плывут" в овал) */
.float-badge.badge-circle{
  width:32px;
  padding:0;
  border-radius:50%;
}
/* Плашки распределены по УГЛАМ и краям hero, не поверх текста */
.fb1{top:50px;    left:17%;   background:var(--violet-acc2); transform:rotate(-8deg);}
.fb2{top:16px;    right:7%;  background:var(--violet-acc3); animation-delay:0.5s;}
.fb3{bottom:14px; right:12%; background:var(--violet-acc4); transform:rotate(6deg); animation-delay:1s;}
.fb4{bottom:20px; left:15%;   background:#f472b6; animation-delay:0.7s;}
.fb5{top:50%;     left:7%;   background:#34d399; transform:rotate(-5deg) translateY(-50%); animation-delay:1.3s;}
.fb6{top:50%;     right:10%;  background:#fbbf24; color:var(--black); animation-delay:0.3s; transform:translateY(-50%);}
.fb7{top:40px;    left:75%;  background:#7c3aed; transform:rotate(-3deg); animation-delay:1.7s;}
@keyframes float-badge{
  0%,100%{transform:translateY(0) rotate(var(--r,0deg));}
  50%{transform:translateY(-8px) rotate(var(--r,0deg));}
}

/* ============================================================
   ПОП-АПЫ (поведение на мобиле — окошки float в углу,
   можно закрыть, не загораживают контент)
   ============================================================ */
.win-popup{
  position:fixed;
  bottom:auto;
  right:12px;
  width:calc(100vw - 24px);
  max-width:320px;
  z-index:999;
  box-shadow:4px 6px 16px rgba(0,0,0,0.25);
  animation:popupSlideIn 0.3s ease-out;
}
#msgPopup{ top:120px; }
#musicPopup{ top:280px; }

@keyframes popupSlideIn{
  from{
    right:-320px;
    opacity:0;
  }
  to{
    right:12px;
    opacity:1;
  }
}

.win-popup.hidden{ display:none; }

/* На ПК — обычное отображение в ряд */
@media(min-width:720px){
  .win-popup{
    position:static;
    width:100%;
    max-width:none;
    animation:none;
  }
}

.win-card{
  background:var(--lavender-gray);
  border:2px solid var(--black);
  box-shadow:3px 3px 0 rgba(0,0,0,0.25);
}
.win-titlebar{
  background:linear-gradient(90deg, var(--violet-deep), var(--violet));
  color:var(--black);
  font-family:'VT323', monospace;
  font-size:1rem;
  padding:5px 8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:2px solid var(--black);
}
.win-btns{display:flex; gap:4px;}
.win-btns i{
  width:14px; height:14px;
  background:var(--white);
  border:1px solid var(--black);
  display:inline-block;
  cursor:pointer;
}
.win-body{padding:12px 14px; font-size:0.85rem; line-height:1.5;}
.win-body .sign{text-align:right; font-style:italic; color:var(--violet-deep); font-weight:700;}
.msg-body{text-align:center;}
.msg-quote{font-style:italic; color:var(--ink); margin:8px 0;}
.ok-btn{
  background:var(--lavender-gray);
  border:2px outset var(--white);
  padding:5px 20px;
  cursor:pointer;
  font-family:'VT323', monospace;
  font-size:0.95rem;
}
.track{color:var(--violet-deep); font-weight:700;}
.fake-progress{
  height:8px; background:#fff; border:1px solid var(--black); margin-top:8px;
}
.fake-progress-fill{
  height:100%; width:38%; background:var(--violet);
  animation:progress-anim 4s ease-in-out infinite alternate;
}
@keyframes progress-anim{ from{width:20%;} to{width:75%;} }

/* ============ BANNER STRIP ============ */
.banner-strip{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:24px;
  background:var(--black);
  color:var(--violet-light);
  padding:14px 16px;
  font-family:'VT323', monospace;
  font-size:1.05rem;
  text-align:center;
}

/* ============ CHIPS ROW (mobile category access near products) ============ */
.chips-row{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:16px;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.chips-row::-webkit-scrollbar{display:none;}
.chip{
  flex:0 0 auto;
  background:#fff;
  border:2px solid var(--black);
  border-radius:16px;
  padding:7px 14px;
  font-family:'Quicksand', sans-serif;
  font-weight:600;
  font-size:0.8rem;
  cursor:pointer;
  white-space:nowrap;
}
.chip.active{background:var(--violet); box-shadow:2px 2px 0 var(--black);}

/* ============ SHOP GRID ============ */
main{padding:0 16px 60px;}
.section-title{
  font-size:1.4rem;
  color:var(--black);
  margin-bottom:16px;
  text-shadow:2px 2px 0 var(--violet);
}

.grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
@media(min-width:640px){
  .grid{grid-template-columns:1fr 1fr 1fr;}
}

.empty-msg{
  text-align:center;
  color:var(--violet-deep);
  font-family:'Fredoka', sans-serif;
  padding:60px 20px;
  font-size:1.1rem;
}

.card{
  background:#fff;
  border:2px solid var(--black);
  border-radius:14px;
  position:relative;
  padding:10px 10px 46px;
  cursor:pointer;
  box-shadow:3px 3px 0 rgba(0,0,0,0.2);
  transition:transform 0.15s;
}
.card:active{transform:scale(0.97);}

.card-hit-badge{
  position:absolute; top:-9px; left:-9px;
  background:var(--violet-acc2);
  color:#fff;
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:0.68rem;
  padding:5px 9px;
  border-radius:50%;
  border:2px solid var(--black);
  transform:rotate(-8deg);
  z-index:3;
}

.card-img-wrap{
  width:100%;
  aspect-ratio:1/1;
  background:var(--white-dark);
  overflow:hidden;
  position:relative;
  border:2px solid var(--black);
  border-radius:10px;
}
.card-img-wrap img{width:100%; height:100%; object-fit:cover;}
.card-img-placeholder{
  display:flex; align-items:center; justify-content:center;
  height:100%; font-size:2.2rem;
  background:repeating-linear-gradient(135deg, var(--white-dark) 0 10px, var(--lavender-gray) 10px 20px);
}

.card-name{
  font-family:'Quicksand', sans-serif;
  font-weight:700;
  font-size:0.85rem;
  margin:8px 0 2px;
  line-height:1.25;
  min-height:2.2em;
  color:var(--black);
}

.card-stock{
  font-size:0.68rem;
  color:#7a6f8f;
}
.card-stock.low{color:var(--violet-acc2); font-weight:bold;}
.card-stock.out{color:#999; text-decoration:line-through;}

.price-tag{
  position:absolute;
  bottom:8px; right:8px;
  background:var(--violet);
  color:var(--black);
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:0.95rem;
  padding:4px 12px;
  border-radius:14px;
  border:2px solid var(--black);
  box-shadow:2px 2px 0 rgba(0,0,0,0.25);
}

/* ============ FOOTER ============ */
.site-footer{background:var(--black); color:var(--white); margin-top:20px;}
.footer-top{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:20px;
  padding:28px 20px;
}
.footer-col p{font-size:0.85rem; color:var(--white-dark); margin:4px 0 0;}
.footer-heading{font-family:'Fredoka', sans-serif; color:var(--violet); margin-bottom:4px; font-weight:700;}

.footer-vk-btn{
  display:inline-block;
  margin-top:10px;
  padding:10px 18px;
  background:var(--violet);
  color:#fff;
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:0.9rem;
  border-radius:20px;
  border:2px solid var(--black);
  text-decoration:none;
  box-shadow:2px 2px 0 rgba(0,0,0,0.3);
}
.footer-vk-btn:active{transform:translate(1px,1px); box-shadow:1px 1px 0 rgba(0,0,0,0.3);}

.taskbar{
  display:flex;
  align-items:center;
  gap:12px;
  background:var(--lavender-gray);
  border-top:2px solid var(--black);
  padding:8px 12px;
  font-family:'VT323', monospace;
  color:var(--black);
}
.start-btn{
  background:linear-gradient(180deg, var(--violet-light), var(--violet-deep));
  border:2px outset var(--violet-light);
  border-radius:4px;
  padding:6px 14px;
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:0.85rem;
  cursor:pointer;
}
.taskbar-item{
  flex:1;
  background:#fff;
  border:1px solid #999;
  padding:5px 10px;
  font-size:0.85rem;
}
.taskbar-clock{
  background:#fff;
  border:1px solid #999;
  padding:5px 10px;
  font-size:0.85rem;
}

/* ============ MODALS ============ */
.modal-backdrop{
  position:fixed; inset:0;
  background:rgba(0,0,0,0.6);
  display:none;
  align-items:flex-start;
  justify-content:center;
  z-index:1000;
  padding:20px 12px;
  overflow-y:auto;
}
.modal-backdrop.open{display:flex;}

.modal-card{
  background:var(--lavender-gray);
  width:100%;
  max-width:480px;
  margin-top:20px;
  border:2px solid var(--black);
  box-shadow:5px 5px 0 rgba(0,0,0,0.4);
}
.modal-card.small{max-width:340px;}
.modal-titlebar i[data-close]{background:var(--violet-acc2); cursor:pointer;}
.modal-inner{padding:16px 18px 22px;}

.modal-lead{font-family:'Fredoka', sans-serif; font-weight:700; color:var(--violet-deep); text-align:center; margin:0 0 14px;}

/* ============ VIEW MODAL CONTENT ============ */
.view-img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border:2px solid var(--black);
  border-radius:10px;
  margin-bottom:14px;
}
.view-img-placeholder{
  width:100%; aspect-ratio:1/1;
  display:flex; align-items:center; justify-content:center;
  background:repeating-linear-gradient(135deg, var(--white-dark) 0 10px, var(--lavender-gray) 10px 20px);
  border:2px solid var(--black);
  border-radius:10px;
  font-size:3rem;
  margin-bottom:14px;
}
.view-name{font-family:'Fredoka', sans-serif; font-size:1.4rem; margin:0 0 6px; color:var(--black);}
.view-desc{font-size:0.9rem; line-height:1.5; color:var(--ink); margin-bottom:14px;}
.view-price{
  display:inline-block;
  background:var(--violet);
  color:var(--black);
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:1.2rem;
  padding:6px 16px;
  border-radius:16px;
  border:2px solid var(--black);
  margin-bottom:10px;
}
.view-stock{font-size:0.85rem; color:#7a6f8f; margin-bottom:6px;}

/* ============ FORMS ============ */
form{padding:2px 0;}
form label{
  display:block;
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:0.8rem;
  margin:12px 0 4px;
  color:var(--violet-deep);
}
form input[type=text], form input[type=number], form input[type=password], form select, form textarea{
  width:100%;
  padding:10px;
  border:2px solid var(--black);
  border-radius:8px;
  background:#fff;
  font-family:'Quicksand', sans-serif;
  font-size:0.9rem;
}
form textarea{resize:vertical; min-height:60px;}
form input[type=file]{width:100%; font-size:0.8rem; margin-top:2px;}
.preview-img{width:100%; max-height:180px; object-fit:cover; margin-top:8px; border:2px solid var(--black); border-radius:8px;}
.checkbox-row{display:flex; align-items:center; gap:8px; font-family:'Quicksand',sans-serif; color:var(--ink); margin-top:14px; font-weight:600;}
.checkbox-row input{width:auto;}

.btn-main{
  width:100%;
  margin-top:18px;
  padding:13px;
  background:var(--violet);
  color:var(--black);
  border:2px solid var(--black);
  border-radius:20px;
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:1rem;
  cursor:pointer;
  box-shadow:3px 3px 0 rgba(0,0,0,0.3);
}
.btn-main:active{transform:translate(2px,2px); box-shadow:1px 1px 0 rgba(0,0,0,0.3);}

.btn-secondary{
  width:100%;
  margin-top:10px;
  padding:11px;
  background:#fff;
  border:2px solid var(--black);
  border-radius:20px;
  color:var(--ink);
  font-family:'Quicksand', sans-serif;
  font-weight:600;
  cursor:pointer;
}

.btn-danger{
  width:100%;
  margin-top:10px;
  padding:11px;
  background:var(--black);
  color:#fff;
  border:2px solid var(--violet-acc2);
  border-radius:20px;
  font-family:'Quicksand', sans-serif;
  font-weight:600;
  cursor:pointer;
}

.hint{font-size:0.72rem; color:#7a6f8f; margin-top:10px; text-align:center;}
.hint code{background:#00000010; padding:2px 5px; border-radius:4px;}

/* ============ ADMIN TABS ============ */
.admin-tabs{display:flex; gap:8px; margin-bottom:10px;}
.admin-tab-btn{
  flex:1;
  padding:9px;
  background:#fff;
  border:2px solid var(--black);
  border-radius:14px;
  font-family:'Quicksand', sans-serif;
  font-weight:600;
  cursor:pointer;
  font-size:0.8rem;
}
.admin-tab-btn.active{background:var(--violet);}
.admin-tab-content{display:none;}
.admin-tab-content.active{display:block;}

/* ============ ADMIN LIST ============ */
.admin-item{
  display:flex;
  align-items:center;
  gap:10px;
  background:#fff;
  border:2px solid var(--black);
  border-radius:10px;
  padding:8px;
  margin-bottom:8px;
}
.admin-item img, .admin-item .ph{
  width:44px; height:44px; object-fit:cover; flex:0 0 44px;
  border:1px solid var(--black);
  border-radius:8px;
  background:var(--white-dark);
  display:flex; align-items:center; justify-content:center;
}
.admin-item-info{flex:1; min-width:0;}
.admin-item-info .n{font-size:0.82rem; font-weight:bold; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--black);}
.admin-item-info .p{font-size:0.78rem; color:#7a6f8f;}
.admin-item-actions{display:flex; gap:6px;}
.admin-item-actions button{
  border:2px solid var(--black); background:var(--violet); color:var(--black); padding:6px 9px; font-size:0.75rem; cursor:pointer; border-radius:8px;
}
.admin-item-actions button.del{background:var(--violet-acc2); color:#fff;}

hr{border:none; border-top:2px dashed var(--violet); margin:16px 0;}

/* ============ SPARKLE CURSOR TRAIL ============ */
.sparkle{
  position:fixed; z-index:9998; pointer-events:none;
  font-size:14px; color:var(--violet);
  transform:translate(-50%,-50%);
  animation:sparkle-fade 0.7s ease-out forwards;
}
@keyframes sparkle-fade{
  0%{ opacity:1; transform:translate(-50%,-50%) scale(1); }
  100%{ opacity:0; transform:translate(-50%,-50%) scale(0.3) translateY(-20px) translateX(var(--drift,0)); }
}

/* ============================================================
   МОБАЙЛ ≤ 480px
   ============================================================ */
@media(max-width:480px){
  .nav-links{ display:none; }
  .topnav{ padding:10px 12px; gap:6px; flex-wrap:nowrap; }
  .search-wrap input{ width:95px; font-size:0.75rem; }

  .hero{ padding:30px 14px 24px; }
  .hero-title{ font-size:1.65rem; text-shadow:2px 2px 0 var(--violet); }
  .hero-sub{ font-size:0.83rem; margin:10px 0 14px; }
  .hero-btn{ padding:10px 20px; font-size:0.88rem; }

  /* На мобиле оставляем ВСЕ 7 плашек — они компактные и не наезжают на текст,
     т.к. расставлены по углам/краям блока .hero (не над текстом) */
  .fb1{ top:8px;    left:2%; }
  .fb2{ top:8px;    right:2%; }
  .fb3{ bottom:8px; right:4%; }
  .fb4{ bottom:6px; left:4%; }
  .fb5{ display:none; } /* на самых узких экранах убираем боковые, чтобы не вылезали за край */
  .fb6{ display:none; }
  .fb7{ display:none; }

  .windows-row{ padding:0 12px 14px; gap:10px; }
  .win-body{ padding:9px 11px; font-size:0.8rem; }

  .chips-row{ padding:10px 12px; gap:6px; }
  .chip{ padding:6px 11px; font-size:0.74rem; }

  .grid{ grid-template-columns:1fr 1fr; gap:10px; }
  .card{ padding:8px 8px 40px; }
  .card-name{ font-size:0.78rem; }
  .price-tag{ font-size:0.82rem; padding:3px 9px; }

  main{ padding:0 12px 50px; }
  .section-title{ font-size:1.2rem; }

  .footer-top{ padding:18px 14px; }
  .footer-vk-btn{ font-size:0.82rem; padding:9px 14px; display:block; text-align:center; }

  .taskbar{ padding:6px 10px; gap:6px; }
  .taskbar-item{ font-size:0.76rem; padding:4px 7px; }
  .taskbar-clock{ font-size:0.76rem; padding:4px 7px; }
  .start-btn{ font-size:0.78rem; padding:5px 10px; }

  /* Убираем "синий" оттенок текста на мобиле — делаем чёрным (кроме мест с тёмным фоном) */
  .hero-btn{ color:var(--violet-light); }
}

/* ============================================================
   481px – 640px (небольшие телефоны горизонтально)
   ============================================================ */
@media(min-width:481px) and (max-width:640px){
  .hero{ padding:36px 16px 110px; }
  .hero-title{ font-size:2rem; }
  .nav-links{ gap:4px; }
  .nav-pill{ padding:5px 9px; font-size:0.72rem; }
  .search-wrap input{ width:108px; }
  .fb5,.fb7{ display:none; }
}

/* ============================================================
   Планшет 641px – 900px
   ============================================================ */
@media(min-width:641px) and (max-width:900px){
  .hero-title{ font-size:2.2rem; }
  .grid{ grid-template-columns:1fr 1fr 1fr; }
  .windows-row{ grid-template-columns:1fr 1fr 1fr; }
}

/* ============================================================
   DRAG-AND-DROP ПЕРЕУПОРЯДОЧИВАНИЕ ТОВАРОВ В АДМИНКЕ
   ============================================================ */
.drag-hint{
  margin-bottom:10px;
}

.admin-item{
  position:relative;
}
.drag-handle{
  flex:0 0 26px;
  font-size:1.3rem;
  color:var(--violet-deep);
  cursor:grab;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:4px;
}
.drag-handle:active{ cursor:grabbing; }

.admin-item.dragging{
  box-shadow:4px 6px 14px rgba(0,0,0,0.35);
  opacity:0.95;
  border-color:var(--violet);
  background:var(--white-dark);
}

.admin-item-placeholder{
  border:2px dashed var(--violet);
  border-radius:10px;
  background:var(--lavender-gray);
  margin-bottom:8px;
}

/* ============================================================
   ПУБЛИКАЦИЯ ИЗМЕНЕНИЙ — блок с инструкцией
   ============================================================ */
.publish-box{
  background:var(--lavender-gray);
  border:2px solid var(--black);
  border-radius:10px;
  padding:12px 14px;
  margin:14px 0;
}
.publish-lead{
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  color:var(--violet-deep);
  margin:0 0 6px;
  font-size:0.9rem;
}
.publish-steps{
  margin:0;
  padding-left:18px;
  font-size:0.8rem;
  line-height:1.5;
  color:var(--ink);
}
.publish-steps code{
  background:#00000012;
  padding:1px 5px;
  border-radius:4px;
}