/* ==========================================================================
   DOMINICA 1 PORTAL — «ZEN» слой (v1). Тот же канон, что тема издания v17:
   донор dzen.ru, свои только цвета и лого. Грузится ПОСЛЕ style.css и
   directory.css и перекрашивает их классы; обвязка (zhead/zrail/zdock) своя.
   ========================================================================== */

:root{
  --zbg:#F7F8F8; --zcard:#FFFFFF;
  --zink:rgba(6,6,15,.88); --zink2:rgba(6,6,15,.58); --zink3:rgba(6,6,15,.38);
  --zchip:#EEF0F1; --zline:rgba(6,6,15,.10);
  --zaccent:#E31E24; --zaccent-dark:#C4151C; --zgreen:#009543; --zgreen-soft:#F0F1F3; --zred:#E31E24; --zgold:#FCD116;
  --zsans:'Inter',-apple-system,'Segoe UI',Roboto,system-ui,sans-serif;
  --zrail:216px;
}

body.zen{background:var(--zbg);color:var(--zink);
  font:400 16px/1.45 var(--zsans);letter-spacing:.003em;margin:0}
body.zen a{color:inherit}
body.zen .skip{position:fixed;left:-200vw;top:8px;z-index:99;background:var(--zcard);
  padding:8px 14px;border-radius:12px}
body.zen .skip:focus{left:8px}
body.zen :focus-visible{outline:2px solid var(--zaccent);outline-offset:2px}

/* старую обвязку — прочь */
body.zen .masthead,body.zen .dir-footer{display:none}

/* ---------- обвязка ---------- */
.zhead{position:sticky;top:0;z-index:16;background:var(--zbg);border-bottom:1px solid var(--zline)}
.zhead__row{display:flex;align-items:center;gap:16px;height:64px;max-width:1288px;margin:0 auto;padding:0 16px}
.zmark{display:flex;align-items:center;flex:0 0 auto;min-width:calc(var(--zrail) - 16px)}
.zmark img{height:30px;width:auto;display:block}
.zseek{flex:1 1 auto;display:flex;align-items:center;max-width:640px;height:44px;
  background:var(--zcard);border:2px solid var(--zgold);border-radius:14px;
  padding:0 5px 0 16px;transition:box-shadow .15s;color:var(--zink2)}
.zseek:focus-within{box-shadow:0 0 0 3px rgba(252,209,22,.35)}
.zseek input{flex:1;border:0;background:none;outline:none;font:400 16px var(--zsans);
  color:var(--zink);padding:0 10px}
.zseek input::placeholder{color:var(--zink3)}
.zseek button{height:34px;padding:0 16px;border:0;border-radius:10px;background:var(--zgold);
  color:#14161A;font:600 14px var(--zsans);cursor:pointer}
.zseek button:hover{background:#F0C400}
.zside{margin-left:auto;flex:0 0 auto}
.zacct{display:inline-flex;align-items:center;height:38px;padding:0 16px;border-radius:12px;
  background:var(--zaccent);color:#fff!important;font:600 14px var(--zsans);text-decoration:none}
.zacct:hover{background:var(--zaccent-dark)}

.zframe{display:grid;grid-template-columns:var(--zrail) minmax(0,1fr);gap:0 8px;
  max-width:1288px;margin:0 auto;padding:0 16px}
.zmain{min-width:0;padding-bottom:56px;max-width:none}
.zrail{position:sticky;top:80px;align-self:start;padding:8px 8px 24px 0;
  height:calc(100vh - 88px);overflow-y:auto;scrollbar-width:none}
.zrail::-webkit-scrollbar{display:none}
.zrail__item{display:flex;align-items:center;gap:14px;height:44px;padding:0 14px;margin:2px 0;
  border-radius:14px;font:400 16px var(--zsans);color:var(--zink);text-decoration:none}
.zrail__item svg{flex:0 0 auto;opacity:.85}
.zrail__item:hover{background:rgba(6,6,15,.05)}
.zrail__item.is-on{background:var(--zchip);font-weight:600}
.zrail__gap{height:14px;border-bottom:1px solid var(--zline);margin-bottom:14px}
.zrail__small{display:block;padding:6px 14px;font:400 14px/1.3 var(--zsans);
  color:var(--zink2);text-decoration:none}
.zrail__small:hover{color:var(--zink)}

.zdock{display:none;position:fixed;left:0;right:0;bottom:0;z-index:18;background:var(--zcard);
  border-top:1px solid var(--zline);padding-bottom:env(safe-area-inset-bottom)}
.zdock__row{display:grid;grid-template-columns:repeat(5,1fr);height:52px}
.zdock a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  font:500 10.5px var(--zsans);color:var(--zink2);text-decoration:none}
.zdock a.is-on{color:var(--zaccent)}
.zdock svg{width:22px;height:22px}

.zstern{background:var(--zcard);border-radius:20px;padding:18px 22px;margin-top:32px;
  font:400 13.5px/1.55 var(--zsans);color:var(--zink2)}
.zstern a{color:var(--zaccent);text-decoration:none}
.zstern a:hover{text-decoration:underline}
.zstern p{margin:0 0 8px}

/* ---------- перекраска существующих компонентов портала ---------- */
body.zen .dir-main{padding-top:14px}
body.zen h1,.zen .dir-h1{font:700 24px/1.2 var(--zsans);letter-spacing:0;color:var(--zink)}
body.zen .dir-h2{font:700 20px/1.25 var(--zsans);color:var(--zink)}
body.zen .dir-h3{font:600 16px/1.3 var(--zsans)}
body.zen .dir-lede{font:400 15px/1.5 var(--zsans);color:var(--zink2)}

body.zen .dir-hero{background:var(--zcard);border-radius:20px;padding:22px 24px;border:0;margin-bottom:16px}
body.zen .dir-search{margin-top:14px}
body.zen .dir-search input,
body.zen .field input,
body.zen .dir-form input,
body.zen .dir-form textarea,
body.zen .dir-form select{background:var(--zbg);border:2px solid transparent;border-radius:12px;
  font:400 15px var(--zsans);color:var(--zink);padding:11px 14px;transition:border-color .15s}
body.zen .dir-search input:focus,
body.zen .dir-form input:focus,
body.zen .dir-form textarea:focus{border-color:var(--zgold);outline:none;background:var(--zcard)}
body.zen .dir-search button{background:var(--zaccent);color:#fff;border:0;border-radius:12px;
  font:600 14px var(--zsans);padding:0 20px;cursor:pointer}
body.zen .dir-search button:hover{background:var(--zaccent-dark)}

body.zen .btn-green{display:inline-flex;align-items:center;justify-content:center;height:44px;
  padding:0 20px;border:0;border-radius:12px;background:var(--zaccent);color:#fff!important;
  font:600 14.5px var(--zsans);text-decoration:none;cursor:pointer}
body.zen .btn-green:hover{background:var(--zaccent-dark)}
body.zen .btn-line{display:inline-flex;align-items:center;justify-content:center;height:44px;
  padding:0 18px;border:0;border-radius:12px;background:var(--zgreen-soft);color:var(--zink)!important;
  font:600 14px var(--zsans);text-decoration:none;cursor:pointer}
body.zen .btn-line:hover{background:#E5E7E9}

body.zen .cat-grid{gap:10px}
body.zen .cat-grid a{background:var(--zcard);border:0;border-radius:16px;padding:14px 16px;
  font:600 15px var(--zsans);color:var(--zink);text-decoration:none;display:flex;
  justify-content:space-between;align-items:baseline;gap:8px}
body.zen .cat-grid a:hover{outline:2px solid var(--zaccent)}
body.zen .cat-grid a span{font:400 13px var(--zsans);color:var(--zink3)}
body.zen .town-line a{color:var(--zink);text-decoration:none;font-weight:500}
body.zen .town-line a:hover{color:var(--zaccent)}
body.zen .town-line small{color:var(--zink3);margin-left:3px}

body.zen .org-list{border:0}
body.zen .org-row{background:var(--zcard);border:0;border-radius:16px;padding:13px 16px;margin-bottom:8px}
body.zen .org-name{font:600 16px var(--zsans);color:var(--zink);text-decoration:none}
body.zen .org-name:hover{color:var(--zaccent)}
body.zen .org-meta{font:400 13px/1.4 var(--zsans);color:var(--zink2)}
body.zen .badge-owner{background:#E4F3EA;color:var(--zgreen);border:0;border-radius:8px;
  font:600 11.5px var(--zsans);padding:4px 8px}
body.zen .badge-news{background:var(--zchip);color:var(--zink);border:0;border-radius:8px;
  font:600 11.5px var(--zsans);padding:3px 8px}
body.zen .org-tag{background:var(--zchip);border:0;border-radius:8px;color:var(--zink2);
  font:500 12px var(--zsans);padding:4px 9px}
body.zen .dir-claim-cta{background:var(--zgreen-soft);border:0;border-radius:20px;padding:20px 22px}
body.zen .dir-crumbs{font:400 13px var(--zsans);color:var(--zink3)}
body.zen .dir-crumbs a{color:var(--zink2);text-decoration:none}
body.zen .org-card,body.zen .org-contact-box,body.zen .org-claim-box{background:var(--zcard);
  border:0;border-radius:20px}
body.zen .org-provenance{font:400 12.5px/1.5 var(--zsans);color:var(--zink3)}
body.zen .dir-pager a{background:var(--zcard);border:0;border-radius:12px;font:600 13.5px var(--zsans)}
body.zen .dir-pager a:hover{background:var(--zchip)}
body.zen .dir-pager .on{background:var(--zaccent);color:#fff}

/* доска */
body.zen .board-head{align-items:center}
body.zen .board-sorts{display:flex;gap:6px;align-items:center;border:0;margin:12px 0}
body.zen .board-sorts a{display:inline-flex;align-items:center;height:32px;padding:0 14px;
  border-radius:8px;background:transparent;border:0;font:600 13px var(--zsans);
  color:var(--zink);text-decoration:none}
body.zen .board-sorts a:hover{background:rgba(6,6,15,.06)}
body.zen .board-sorts a.on{background:var(--zchip)}
body.zen .thread-list{list-style:none;padding:0;margin:0}
body.zen .thread-row{background:var(--zcard);border:0;border-radius:16px;padding:12px 16px;
  margin-bottom:8px;display:flex;gap:14px;align-items:flex-start}
body.zen .thread-row.pinned{outline:2px solid var(--zgreen-soft)}
body.zen .thread-title{font:600 16px/1.35 var(--zsans);margin:0 0 4px}
body.zen .thread-title a{text-decoration:none;color:var(--zink)}
body.zen .thread-title a:hover{color:var(--zaccent)}
body.zen .thread-domain{font:400 12px var(--zsans);color:var(--zink3);margin-left:6px}
body.zen .thread-meta{font:400 13px var(--zsans);color:var(--zink2);margin:0}
body.zen .thread-meta a{color:var(--zink2)}

body.zen .vote{display:flex;flex-direction:column;align-items:center;gap:2px;flex:0 0 auto}
body.zen .vote button{width:30px;height:26px;border:0;border-radius:8px;background:var(--zbg);
  color:var(--zink2);font-size:12px;cursor:pointer;line-height:1}
body.zen .vote button:hover{background:var(--zchip);color:var(--zink)}
body.zen .vote .v-up.on{background:#E4F3EA;color:var(--zgreen)}
body.zen .vote .v-down.on{background:#F6E5E3;color:var(--zred)}
body.zen .v-score{font:600 13px var(--zsans);color:var(--zink)}

body.zen .cmt{border-left:2px solid var(--zline);padding-left:14px;margin-top:14px}
body.zen .cmt-author{font:600 13.5px var(--zsans)}
body.zen .cmt-age{font:400 12.5px var(--zsans);color:var(--zink3)}
body.zen .cmt-body{font:400 15px/1.55 var(--zsans);margin:6px 0}
body.zen .cmt-removed{color:var(--zink3);font-style:italic}
body.zen .cmt-reply summary{color:var(--zaccent);font:600 13px var(--zsans);cursor:pointer}
body.zen .inline-del button{background:none;border:0;color:var(--zink3);
  font:400 12px var(--zsans);cursor:pointer}
body.zen .inline-del button:hover{color:var(--zred)}

/* кабинет и формы входа */
body.zen .auth-box,body.zen .auth-box-wide{background:var(--zcard);border:0;border-radius:20px;
  padding:26px 28px;max-width:440px;margin:24px auto}
body.zen .auth-box-wide{max-width:560px}
body.zen .dir-form label{font:600 13.5px var(--zsans);color:var(--zink);display:block}
body.zen .dir-form input,body.zen .dir-form textarea{width:100%;box-sizing:border-box;margin-top:6px}
body.zen .form-error{background:#F6E5E3;color:#8F1B14;border:0;border-radius:12px;padding:10px 14px;
  font:500 14px var(--zsans)}
body.zen .form-notice{background:var(--zgreen-soft);color:var(--zaccent);border:0;border-radius:12px;
  padding:10px 14px;font:500 14px var(--zsans)}
body.zen .auth-links{font:400 14px var(--zsans);color:var(--zink2)}
body.zen .auth-links a{color:var(--zaccent)}
body.zen .acct-head{background:var(--zcard);border:0;border-radius:20px;padding:20px 24px}
body.zen .acct-avatar{background:var(--zaccent);color:#fff;border-radius:999px;
  font:600 20px var(--zsans)}

/* ---------- медиа ---------- */
@media (max-width:1199px){
  :root{--zrail:64px}
  .zrail__item span{display:none}
  .zrail__item{justify-content:center;width:48px;height:44px;margin:2px auto;padding:0}
  .zrail__small{display:none}
  .zmark{min-width:48px}
  .zmark img{height:26px}
}
@media (max-width:767px){
  .zframe{display:block;padding:0 10px}
  .zrail{display:none}
  .zdock{display:block}
  body.zen{padding-bottom:64px}
  .zhead__row{height:56px;gap:10px;padding:0 12px}
  .zmark img{height:24px}
  .zseek{height:40px;padding-left:12px}
  .zseek button{display:none}
  .zacct{height:36px;padding:0 12px;font-size:13px}
  body.zen .thread-row{padding:10px 12px;gap:10px}
  body.zen .auth-box{padding:20px 18px;margin:14px auto}
}
@media (prefers-reduced-motion:reduce){
  body.zen *{animation:none!important;transition:none!important}
}
