/* «Отлив и прилив»: оформление в духе морской карты — бумага, синие тона глубин, пурпур огней. */
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(/static/shrifty/eb-garamond-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(/static/shrifty/eb-garamond-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"EB Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(/static/shrifty/eb-garamond-cyrillic-400-italic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"EB Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(/static/shrifty/eb-garamond-latin-400-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(/static/shrifty/eb-garamond-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(/static/shrifty/eb-garamond-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(/static/shrifty/eb-garamond-cyrillic-600-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(/static/shrifty/eb-garamond-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Didact Gothic";font-style:normal;font-weight:400;font-display:swap;src:url(/static/shrifty/didact-gothic-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Didact Gothic";font-style:normal;font-weight:400;font-display:swap;src:url(/static/shrifty/didact-gothic-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --bumaga:#f3efe3; --bumaga2:#ebe5d3; --sush:#e7dcbf; --melk:#d6e7e8; --glub:#a9cdd4;
  --chernila:#13324a; --chernila2:#3d5a6e; --seryy:#6d7c84; --liniya:#b9c4c3;
  --ogon:#9d1f5a; --ogon2:#c0447c; --ssylka:#1d5f86;
  --serif:"EB Garamond",Georgia,"Times New Roman",serif; --sans:"Didact Gothic","Trebuchet MS",Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bumaga);color:var(--chernila);font:19px/1.55 var(--serif);
  background-image:linear-gradient(var(--bumaga2) 1px,transparent 1px),linear-gradient(90deg,var(--bumaga2) 1px,transparent 1px);
  background-size:120px 120px;background-position:-1px -1px}
a{color:var(--ssylka);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--ogon)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-weight:500;line-height:1.2;color:var(--chernila)}
h1{font-size:2.1rem;margin:.2em 0 .5em;font-style:italic;font-weight:400}
h2{font-size:1.35rem;margin:1.6em 0 .6em}
.propusk{position:absolute;left:-999px}.propusk:focus{left:8px;top:8px;background:#fff;padding:6px 10px;z-index:9}
.skryt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* шапка — как заголовочный картуш карты: двойная рамка */
.shapka{max-width:1180px;margin:18px auto 0;padding:0 18px}
.shapka-v{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:4px 24px;padding:14px 18px 12px;
  border:1px solid var(--chernila);outline:3px double var(--chernila);outline-offset:3px;background:var(--bumaga)}
.imya{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--chernila)}
.imya span{font-size:2rem;letter-spacing:.01em;line-height:1}
.imya i{font-size:.8em;color:var(--chernila2)}
.znak{width:44px;height:44px;flex:none}
.z-fonar{fill:var(--ogon)}.z-bashnya{fill:var(--bumaga);stroke:var(--chernila);stroke-width:1.3}
.z-polosa{stroke:var(--ogon);stroke-width:2.2}.z-volna{fill:none;stroke:var(--ssylka);stroke-width:1.6}
.z-luch{stroke:var(--ogon2);stroke-width:1;stroke-dasharray:2 2}
.devis{margin:0;font:13px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--chernila2)}
.menu{display:flex;flex-wrap:wrap;gap:2px 20px;margin:14px 4px 0;font:15px/1.6 var(--sans);letter-spacing:.03em}
.menu a{text-decoration:none;color:var(--chernila);border-bottom:2px solid transparent}
.menu a:hover,.menu a[aria-current]{border-bottom-color:var(--ogon)}

main{max-width:1180px;margin:0 auto;padding:18px 18px 40px}
.kroshki{font:14px/1.4 var(--sans);color:var(--seryy);margin:10px 0 0}
.kroshki a{color:var(--chernila2)}
.vvod{max-width:46em}
.vvod .meta,.meta{font:15px/1.5 var(--sans);color:var(--chernila2)}
.fakty{font-style:italic;color:var(--chernila2)}

/* главная */
.lid{font-size:1.45rem;line-height:1.45;max-width:36em;margin:8px 0 18px}
.skhema{margin:0 0 10px;padding:14px 16px 10px;background:var(--bumaga);border:1px solid var(--liniya)}
.skhema svg{width:100%;height:auto;display:block}
.skhema figcaption{font-size:.95rem;color:var(--chernila2);max-width:52em}
.s-voda{fill:var(--melk)}.s-liniya{fill:none;stroke:var(--ssylka);stroke-width:2.2}
.s-sredniy{stroke:var(--glub);stroke-dasharray:5 4}.s-os{stroke:var(--chernila2);stroke-width:1}
.s-chas,.s-podp,.s-lev{font:12px var(--sans);fill:var(--chernila2);text-anchor:middle}.s-podp{text-anchor:end}.s-lev{text-anchor:end}
.s-tochka{fill:var(--ogon)}.s-metka{font:13px var(--sans);fill:var(--ogon);text-anchor:middle;letter-spacing:.05em}
.dalee{font:15px var(--sans)}
.kolonki{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px 40px;margin-top:10px}
.spisok-b,.spisok-t,.ssylki{list-style:none;padding:0;margin:0}
.spisok-b li,.spisok-t li{padding:5px 0;border-bottom:1px dotted var(--liniya)}
.spisok-b b{display:block;font:13px/1.5 var(--sans);font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:var(--chernila2)}
.spisok-b span{display:block;line-height:1.45}
.spisok-t span{font:14px/1.35 var(--sans);color:var(--seryy)}
.spisok-t span{display:inline;float:right}
.ssylki li{padding:3px 0}

/* карточки записей */
.setka{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px 22px}
.setka.melko{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.kartochka a{display:block;text-decoration:none;color:var(--chernila)}
.mini{position:relative;display:block;background:var(--glub);aspect-ratio:16/9;overflow:hidden;border:1px solid var(--chernila)}
.mini img{width:100%;height:100%;object-fit:cover}
.dl{position:absolute;right:0;bottom:0;background:var(--chernila);color:var(--bumaga);font:13px/1 var(--sans);padding:4px 6px 3px}
.nazv{display:block;margin-top:7px;font-size:1.08rem;line-height:1.3}
.gde{display:block;font:14px/1.35 var(--sans);color:var(--seryy);margin-top:2px}
.kartochka a:hover .nazv{color:var(--ogon)}
.kartochka a:hover .mini{outline:2px solid var(--ogon);outline-offset:2px}

/* запись */
.ekran{margin:0 0 6px;background:#0b1f2e}
.ekran video{display:block;width:100%;height:auto;max-height:74vh;aspect-ratio:16/9;background:#0b1f2e}
.ekran figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:10px;min-height:34px;padding:4px 8px;background:var(--chernila);color:var(--bumaga);font:14px var(--sans)}
.kachestvo{display:flex;gap:4px}
.kachestvo button{font:13px var(--sans);background:transparent;color:var(--bumaga);border:1px solid var(--chernila2);padding:3px 8px;cursor:pointer}
.kachestvo button[aria-pressed="true"]{background:var(--bumaga);color:var(--chernila);border-color:var(--bumaga)}
.soobshch{opacity:.85}
.zapis{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:12px 40px;margin-top:18px}
.tekst{max-width:40em}.tekst p:first-child{margin-top:0}
.smotri{padding-left:1.1em}.smotri li{margin:.25em 0}
.kartush{align-self:start;border:1px solid var(--chernila);outline:3px double var(--chernila);outline-offset:3px;background:var(--bumaga);padding:12px 16px;margin:4px}
.kartush h2{margin:0 0 8px;font:14px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--chernila2);text-align:center}
.kartush dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:5px 12px;font-size:.95rem;line-height:1.35}
.kartush dt{font:13px/1.6 var(--sans);color:var(--seryy)}
.kartush dd{margin:0;overflow-wrap:anywhere}
.listat{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:30px 0 0;border-top:1px solid var(--liniya);padding-top:14px}
.listat a{text-decoration:none}.listat span{display:block;font:13px var(--sans);color:var(--seryy)}
.vpered{text-align:right}

/* таблицы — как таблица приливов */
.lotsiya{border-collapse:collapse;width:100%;max-width:60em;font-size:1rem;background:var(--bumaga)}
.lotsiya th{font:13px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--chernila2);text-align:left;border-bottom:2px solid var(--chernila);padding:6px 8px}
.lotsiya td{border-bottom:1px solid var(--liniya);padding:6px 8px;vertical-align:top}
.lotsiya tbody tr:nth-child(even){background:rgba(214,231,232,.35)}
.lotsiya .chislo,.lotsiya td[data-v]{font-family:var(--sans);font-size:15px;white-space:nowrap}
.sort th{cursor:pointer;user-select:none}.sort th[aria-sort]::after{content:" ↓";color:var(--ogon)}.sort th[aria-sort="ascending"]::after{content:" ↑"}
.oblast h2{font-style:italic;font-weight:400}

.temy{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px 30px}
.temy a{text-decoration:none;display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid var(--chernila);padding-bottom:4px}
.temy b{font-weight:500;font-size:1.15rem}.temy span{font:14px var(--sans);color:var(--seryy);white-space:nowrap}
.temy p{margin:6px 0 0;font-size:1rem;color:var(--chernila2)}
.azbuka{padding-left:1.4em;max-width:44em}.azbuka li{margin:0 0 14px}.azbuka li::marker{font-family:var(--sans);color:var(--ogon)}
.azbuka p{margin:2px 0 0;color:var(--chernila2)}
.statya{max-width:40em}
.statya .data,.zametki time{font:14px var(--sans);color:var(--seryy)}
.zametki{list-style:none;padding:0}.zametki li{padding:8px 0;border-bottom:1px dotted var(--liniya)}.zametki time{display:block}
.podpis{font-style:italic;text-align:right}
.litsenzii{padding-left:1.1em}.litsenzii li{margin:0 0 8px}.litsenzii span{display:block;font:14px/1.45 var(--sans);color:var(--chernila2)}
.eshche h2,.eshche-st h2{font-size:1.15rem}

/* форма */
.forma{display:grid;gap:4px;max-width:34em;margin-top:18px}
.forma label{font:14px var(--sans);color:var(--chernila2);margin-top:10px}.forma small{color:var(--seryy)}
.forma input,.forma select,.forma textarea{font:17px/1.4 var(--serif);padding:7px 9px;border:1px solid var(--chernila2);background:#fbf9f3;color:var(--chernila);width:100%}
.forma button{justify-self:start;margin-top:14px;font:16px var(--sans);letter-spacing:.04em;background:var(--chernila);color:var(--bumaga);border:0;padding:9px 22px;cursor:pointer}
.forma button:hover{background:var(--ogon)}
.lovushka{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}

.podval{max-width:1180px;margin:0 auto;padding:16px 18px 30px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;
  font:14px var(--sans);color:var(--chernila2);border-top:3px double var(--chernila)}
.podval nav{display:flex;flex-wrap:wrap;gap:4px 18px}.podval a{color:var(--chernila2)}
.sboy main{max-width:40em}.kod{font:64px/1 var(--sans);color:var(--ogon);margin:20px 0 0}

@media (max-width:860px){
  .zapis{grid-template-columns:1fr}
  .kartush{margin:4px 4px 10px}
}
@media (max-width:560px){
  body{font-size:18px}
  .imya span{font-size:1.55rem}.znak{width:36px;height:36px}
  h1{font-size:1.7rem}.lid{font-size:1.2rem}
  .shapka{padding:0 10px}.shapka-v{padding:10px 12px}
  main{padding:14px 12px 30px}
  .menu{gap:2px 14px;font-size:14px}
  .setka{grid-template-columns:1fr 1fr;gap:14px 12px}.nazv{font-size:1rem}
  .listat{grid-template-columns:1fr}.vpered{text-align:left}
  .lotsiya{font-size:.95rem}.lotsiya th,.lotsiya td{padding:5px 4px}
}
@media (prefers-reduced-motion:no-preference){.kartochka .mini img{transition:transform .4s}.kartochka a:hover .mini img{transform:scale(1.03)}}