/* Судовой приборный щит — тема «Рубка».
   Рубка малого судна ночью: тёмный щит из анодированного металла, латунные ободки приборов, шкалы светятся красной
   ночной подсветкой, стрелки янтарные. Тумблер «ночь / день» переключает на дневную рубку: белые лица приборов,
   чёрные риски, красные стрелки. Главная — приборный щит: путевой компас идёт за курсором, у каждого раздела свой
   живой прибор (эхолот рисует дно, радар крутит развёртку, судовые часы идут по Москве). Навигация — левая рейка
   с тумблерами разделов. Тема — дерево ответов, ветви идут пунктирными линиями курса с путевыми точками.
   Шрифты: Sansation (заголовки, шильдики, подписи шкал), Noto Sans Display (текст), Fira Mono (показания), все OFL. */

@font-face { font-family: "Sansation"; src: url("fonts/sansation-cyrillic-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Sansation"; src: url("fonts/sansation-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Sansation"; src: url("fonts/sansation-cyrillic-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Sansation"; src: url("fonts/sansation-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Noto Sans Display"; src: url("fonts/noto-sans-display-cyrillic-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Noto Sans Display"; src: url("fonts/noto-sans-display-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Noto Sans Display"; src: url("fonts/noto-sans-display-cyrillic-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Noto Sans Display"; src: url("fonts/noto-sans-display-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: "Noto Sans Display"; src: url("fonts/noto-sans-display-cyrillic-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Noto Sans Display"; src: url("fonts/noto-sans-display-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: "Fira Mono"; src: url("fonts/fira-mono-cyrillic-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Fira Mono"; src: url("fonts/fira-mono-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: "Fira Mono"; src: url("fonts/fira-mono-cyrillic-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Fira Mono"; src: url("fonts/fira-mono-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+2212, U+FEFF, U+FFFD; }

/* ------------------------------------------------------------------ ночная рубка (по умолчанию) */
:root {
	--wi-bg: #060b10;
	--wi-bg2: #09121a;
	--wi-panel: #0d161e;
	--wi-panel2: #122029;
	--wi-card: #0e1821;
	--wi-card2: #13212c;
	--wi-line: rgba(160, 190, 210, .11);
	--wi-line2: rgba(160, 190, 210, .21);
	--wi-ink: #ede6d5;
	--wi-ink2: #c6bfae;
	--wi-mute: #8f958f;
	--wi-dim: #677071;
	--wi-red: #ff4d3d;
	--wi-red-d: #c42b1f;
	--wi-red-l: rgba(255, 77, 61, .14);
	--wi-glow: rgba(255, 77, 61, .42);
	--wi-amber: #ffb547;
	--wi-amber-d: #d28c1f;
	--wi-amber-l: rgba(255, 181, 71, .13);
	--wi-green: #3ddc97;
	--wi-brass: #c9a36a;
	--wi-brass-d: #8b6a3c;
	--wi-face: #070c10;
	--wi-mark: #ff6a4f;
	--wi-mark2: rgba(255, 106, 79, .5);
	--wi-needle: #ffb547;
	--wi-needle-glow: drop-shadow(0 0 2.2px rgba(255, 181, 71, .75));
	--wi-scr: #061520;
	--wi-scr-line: rgba(255, 106, 79, .16);
	--wi-land: #241b13;
	--wi-lcd-bg: #170a06;
	--wi-lcd: #ff6b3d;
	--wi-course: rgba(255, 181, 71, .62);
	--wi-link: #f3c58c;
	--wi-head: "Sansation", "Trebuchet MS", "Segoe UI", sans-serif;
	--wi-text: "Noto Sans Display", "Segoe UI", system-ui, -apple-system, sans-serif;
	--wi-mono: "Fira Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
	--wi-r: 14px;
	--wi-r2: 9px;
	--wi-rail: 252px;
	--wi-shadow: 0 1px 0 rgba(255, 255, 255, .04) inset, 0 14px 30px -18px rgba(0, 0, 0, .9);
	--wi-metal: linear-gradient(180deg, #13202a 0, #0d171f 100%);
	color-scheme: dark;
}

/* ------------------------------------------------------------------ дневная рубка */
:root[data-mode="day"] {
	--wi-bg: #d6dbd7;
	--wi-bg2: #cbd1cd;
	--wi-panel: #e8eae5;
	--wi-panel2: #dfe2dc;
	--wi-card: #f5f5f0;
	--wi-card2: #ecede7;
	--wi-line: rgba(18, 28, 34, .12);
	--wi-line2: rgba(18, 28, 34, .22);
	--wi-ink: #10171c;
	--wi-ink2: #2d383e;
	--wi-mute: #59646a;
	--wi-dim: #7c868a;
	--wi-red: #c22a1c;
	--wi-red-d: #951d12;
	--wi-red-l: rgba(194, 42, 28, .1);
	--wi-glow: rgba(194, 42, 28, 0);
	--wi-amber: #a85f00;
	--wi-amber-d: #7d4600;
	--wi-amber-l: rgba(168, 95, 0, .1);
	--wi-green: #13865a;
	--wi-brass: #9c7742;
	--wi-brass-d: #6f532c;
	--wi-face: #fbfaf4;
	--wi-mark: #121619;
	--wi-mark2: rgba(18, 22, 25, .55);
	--wi-needle: #d0261a;
	--wi-needle-glow: drop-shadow(0 .6px .6px rgba(0, 0, 0, .35));
	--wi-scr: #dcebf2;
	--wi-scr-line: rgba(30, 80, 110, .16);
	--wi-land: #eadfbf;
	--wi-lcd-bg: #b6c4a0;
	--wi-lcd: #18230f;
	--wi-course: rgba(194, 42, 28, .62);
	--wi-link: #7f3410;
	--wi-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset, 0 12px 26px -18px rgba(20, 30, 36, .55);
	--wi-metal: linear-gradient(180deg, #eef0eb 0, #e1e4de 100%);
	color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; background: var(--wi-bg); }
body {
	margin: 0;
	font: 400 16.5px/1.6 var(--wi-text);
	color: var(--wi-ink);
	background-color: var(--wi-bg);
	background-image:
		radial-gradient(1100px 520px at 70% -10%, rgba(255, 77, 61, .07), transparent 70%),
		linear-gradient(rgba(160, 190, 210, .035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(160, 190, 210, .035) 1px, transparent 1px);
	background-size: auto, 48px 48px, 48px 48px;
	overflow-x: hidden;
	transition: background-color .4s, color .4s;
}
:root[data-mode="day"] body {
	background-image:
		radial-gradient(1100px 520px at 70% -10%, rgba(255, 255, 255, .55), transparent 70%),
		linear-gradient(rgba(18, 28, 34, .045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(18, 28, 34, .045) 1px, transparent 1px);
}
img { max-width: 100%; height: auto; }
a { color: var(--wi-amber); text-decoration: none; transition: color .2s; }
a:hover { color: var(--wi-red); }
:focus-visible { outline: 2px solid var(--wi-amber); outline-offset: 2px; border-radius: 4px; }
button { font: inherit; color: inherit; }
p { margin: 0 0 .8em; }
.wi-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.wi-skip { position: absolute; left: -999px; top: 8px; z-index: 200; background: var(--wi-red); color: #fff; padding: 8px 14px; border-radius: 8px; }
.wi-skip:focus { left: 12px; }

.wi-h1 { font: 700 clamp(26px, 2.6vw, 36px)/1.15 var(--wi-head); margin: 0 0 .35em; color: var(--wi-ink); letter-spacing: .005em; }
.wi-h2 { font: 700 clamp(19px, 1.6vw, 22px)/1.2 var(--wi-head); margin: 0; color: var(--wi-ink); letter-spacing: .01em; }
.wi-h3 { font: 700 11.5px/1.3 var(--wi-head); text-transform: uppercase; letter-spacing: .16em; color: var(--wi-brass); margin: 0 0 12px; }
.wi-kicker { font: 700 11.5px/1.35 var(--wi-head); text-transform: uppercase; letter-spacing: .16em; color: var(--wi-brass); margin: 0 0 10px; }
.wi-more { font: 500 13.5px/1.3 var(--wi-text); color: var(--wi-amber); background: none; border: 0; padding: 0 0 1px; cursor: pointer; border-bottom: 1px dashed currentColor; }
.wi-more:hover { color: var(--wi-red); }
.wi-empty { color: var(--wi-mute); list-style: none; padding: 12px 0; }
.wi-ico { flex-shrink: 0; display: block; }
.wi-card {
	background: var(--wi-metal);
	border: 1px solid var(--wi-line);
	border-radius: var(--wi-r);
	box-shadow: var(--wi-shadow);
	padding: 20px 22px;
	min-width: 0;
	position: relative;
}
.wi-card__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }

/* штамп времени, код прибора, светодиод */
.wi-stamp { font: 500 12.5px/1.2 var(--wi-mono); color: var(--wi-ink2); display: inline-flex; gap: 6px; white-space: nowrap; }
.wi-stamp span { color: var(--wi-mute); }
.wi-code { font: 500 11px/1 var(--wi-mono); letter-spacing: .06em; color: var(--wi-red); border: 1px solid currentColor; border-radius: 4px; padding: 3px 5px 2px; }
.wi-led { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--wi-red); box-shadow: 0 0 6px var(--wi-glow), 0 0 0 2px rgba(0, 0, 0, .35); flex-shrink: 0; }
:root[data-mode="day"] .wi-led { box-shadow: 0 0 0 2px rgba(0, 0, 0, .1); }

/* ------------------------------------------------------------------ каркас: рейка слева + сцена */
.wi-app { display: grid; grid-template-columns: var(--wi-rail) minmax(0, 1fr); min-height: 100vh; }
.wi-stage { min-width: 0; display: flex; flex-direction: column; }
.wi-main { width: 100%; max-width: 1340px; margin: 0 auto; padding: 0 30px 40px; flex: 1; }
.wi-crumbs-row { max-width: 1340px; width: 100%; margin: 0 auto; padding: 18px 30px 10px; }
.wi-crumbs { font: 500 13px/1.4 var(--wi-mono); color: var(--wi-mute); display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
.wi-crumbs a { color: var(--wi-ink2); }
.wi-crumbs a:hover { color: var(--wi-red); }
.wi-crumbs .active { color: var(--wi-amber); }
.wi-crumbs__sep { color: var(--wi-dim); }
.wi-page--index .wi-crumbs-row { display: none; }
.wi-page--index .wi-main { padding-top: 22px; }

/* ------------------------------------------------------------------ рейка-тумблеры */
.wi-rail {
	position: sticky; top: 0; height: 100vh; z-index: 40;
	background:
		linear-gradient(90deg, rgba(255, 255, 255, .03), transparent 30%, transparent 70%, rgba(0, 0, 0, .25)),
		repeating-linear-gradient(0deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 3px),
		#0a1218;
	border-right: 1px solid rgba(0, 0, 0, .6);
	box-shadow: inset -1px 0 0 rgba(255, 255, 255, .05), 10px 0 30px -20px rgba(0, 0, 0, .9);
}
:root[data-mode="day"] .wi-rail {
	background:
		linear-gradient(90deg, rgba(255, 255, 255, .5), transparent 30%, transparent 70%, rgba(0, 0, 0, .05)),
		repeating-linear-gradient(0deg, rgba(0, 0, 0, .02) 0 1px, transparent 1px 3px),
		#e4e7e2;
	border-right-color: rgba(0, 0, 0, .14);
	box-shadow: inset -1px 0 0 rgba(255, 255, 255, .8);
}
.wi-rail__in { height: 100%; overflow-y: auto; overflow-x: hidden; padding: 18px 16px 22px; display: flex; flex-direction: column; gap: 14px; scrollbar-width: thin; scrollbar-color: var(--wi-line2) transparent; }
/* винты рейки */
.wi-rail::before, .wi-rail::after { content: ""; position: absolute; right: 8px; width: 7px; height: 7px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #8a8f90, #2b3236 70%); box-shadow: 0 1px 0 rgba(255, 255, 255, .08); }
.wi-rail::before { top: 9px; }
.wi-rail::after { bottom: 9px; }

.wi-logo { display: flex; align-items: center; gap: 11px; color: var(--wi-ink); }
.wi-logo:hover { color: var(--wi-ink); }
.wi-logo__mark { flex-shrink: 0; filter: drop-shadow(0 3px 5px rgba(0, 0, 0, .5)); }
.wi-logo__face { fill: #070c10; }
:root[data-mode="day"] .wi-logo__face { fill: #fbfaf4; }
.wi-logo__tk { stroke: var(--wi-mark); stroke-width: 1.3; stroke-linecap: round; }
.wi-logo__rose { fill: var(--wi-red); }
.wi-logo__rose2 { fill: var(--wi-mark2); }
.wi-logo__txt { display: flex; flex-direction: column; line-height: 1.05; }
.wi-logo__k { font: 700 10.5px/1.1 var(--wi-head); text-transform: uppercase; letter-spacing: .32em; color: var(--wi-brass); }
.wi-logo__name { font: 700 18.5px/1.08 var(--wi-head); letter-spacing: .01em; }

/* тумблер «ночь / день» */
.wi-mode { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 9px 12px; border-radius: 10px; border: 1px solid var(--wi-line2); background: rgba(0, 0, 0, .3); cursor: pointer; }
:root[data-mode="day"] .wi-mode { background: rgba(255, 255, 255, .6); }
.wi-mode__l { font: 700 11px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .16em; color: var(--wi-mute); transition: color .3s, text-shadow .3s; }
.wi-mode__l:first-child { color: var(--wi-red); text-shadow: 0 0 8px var(--wi-glow); }
:root[data-mode="day"] .wi-mode__l:first-child { color: var(--wi-mute); }
:root[data-mode="day"] .wi-mode__l:last-child { color: var(--wi-ink); }
.wi-mode__lever { position: relative; width: 50px; height: 22px; border-radius: 11px; background: linear-gradient(180deg, #05080b, #1a252d); box-shadow: inset 0 2px 4px rgba(0, 0, 0, .7), 0 1px 0 rgba(255, 255, 255, .06); }
.wi-mode__lever i { position: absolute; top: 2px; left: 2px; width: 26px; height: 18px; border-radius: 9px; background: linear-gradient(180deg, #e9d0a0, #a07d47); box-shadow: 0 2px 3px rgba(0, 0, 0, .55); transition: transform .35s cubic-bezier(.5, 1.6, .5, 1); }
.wi-mode__lever i::after { content: ""; position: absolute; inset: 5px 11px; border-radius: 2px; background: rgba(0, 0, 0, .25); }
:root[data-mode="day"] .wi-mode__lever { background: linear-gradient(180deg, #b9c0bb, #e5e8e3); box-shadow: inset 0 2px 4px rgba(0, 0, 0, .25); }
:root[data-mode="day"] .wi-mode__lever i { transform: translateX(20px); }

/* тумблеры разделов */
.wi-railnav { display: flex; flex-direction: column; gap: 12px; }
.wi-railgrp__h { font: 700 10.5px/1.2 var(--wi-head); text-transform: uppercase; letter-spacing: .2em; margin: 0 0 6px; padding: 0 0 5px 2px; border-bottom: 1px solid var(--wi-line); }
.wi-railgrp__h a { color: var(--wi-brass); }
.wi-railgrp__h a:hover { color: var(--wi-amber); }
.wi-railgrp__l { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; }
.wi-sw { display: grid; grid-template-columns: 15px minmax(0, 1fr) 7px; align-items: center; gap: 10px; padding: 4px 6px 4px 4px; border-radius: 7px; color: var(--wi-ink2); font: 500 14px/1.25 var(--wi-text); }
.wi-sw:hover { color: var(--wi-ink); background: rgba(255, 255, 255, .035); }
:root[data-mode="day"] .wi-sw:hover { background: rgba(0, 0, 0, .04); }
.wi-sw__t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wi-sw__tog { position: relative; width: 15px; height: 22px; border-radius: 4px; background: linear-gradient(180deg, #1d272e, #070b0e); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .8), 0 1px 0 rgba(255, 255, 255, .07); }
.wi-sw__tog i { position: absolute; left: 3px; right: 3px; height: 10px; bottom: 2px; border-radius: 3px; background: linear-gradient(180deg, #d9dde0, #7c8589); box-shadow: 0 2px 2px rgba(0, 0, 0, .6); transition: bottom .25s cubic-bezier(.4, 1.6, .5, 1), background .25s; }
:root[data-mode="day"] .wi-sw__tog { background: linear-gradient(180deg, #a9b1ad, #d9ddd8); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .3); }
.wi-sw:hover .wi-sw__tog i { bottom: 4px; }
.wi-sw.is-on .wi-sw__tog i, .wi-sw[aria-current] .wi-sw__tog i { bottom: 10px; background: linear-gradient(180deg, #ffd9a0, #c7882c); }
.wi-sw__led { width: 7px; height: 7px; border-radius: 50%; background: #3a1512; box-shadow: inset 0 1px 1px rgba(0, 0, 0, .6); transition: background .25s, box-shadow .25s; }
:root[data-mode="day"] .wi-sw__led { background: #b8b2a8; }
.wi-sw:hover .wi-sw__led { background: #7a2a20; }
.wi-sw.is-on, .wi-sw[aria-current] { color: var(--wi-ink); }
.wi-sw.is-on .wi-sw__led, .wi-sw[aria-current] .wi-sw__led { background: var(--wi-red); box-shadow: 0 0 8px var(--wi-glow), 0 0 2px var(--wi-red); }
.wi-sw--home { font: 700 14px/1.25 var(--wi-head); letter-spacing: .02em; color: var(--wi-ink); padding-top: 6px; padding-bottom: 6px; border: 1px solid var(--wi-line); }

.wi-find { position: relative; margin-top: 4px; }
.wi-find__l { position: absolute; left: -999px; }
.wi-find input[type="search"] { width: 100%; padding: 9px 38px 9px 12px; font-size: 14.5px; }
.wi-find__b { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); background: none; border: 0; padding: 7px; color: var(--wi-mute); cursor: pointer; display: grid; }
.wi-find__b:hover { color: var(--wi-amber); }

.wi-me { position: relative; margin-top: auto; }
.wi-me__b { display: flex; align-items: center; gap: 9px; width: 100%; padding: 7px 10px; border-radius: 10px; border: 1px solid var(--wi-line2); background: transparent; cursor: pointer; font: 600 14px/1.2 var(--wi-text); color: var(--wi-ink); }
.wi-me__b:hover, .wi-me__b[aria-expanded="true"] { border-color: var(--wi-amber); color: var(--wi-amber); }
.wi-me__panel { position: absolute; left: 0; right: 0; bottom: calc(100% + 8px); background: var(--wi-card2); border: 1px solid var(--wi-line2); border-radius: 12px; padding: 14px; box-shadow: 0 22px 40px -16px rgba(0, 0, 0, .8); z-index: 60; }
.wi-login__p { font-size: 13.5px; color: var(--wi-mute); margin-bottom: 10px; }
.wi-field { margin: 0 0 10px; display: flex; flex-direction: column; gap: 4px; font-size: 13.5px; }
.wi-field label { color: var(--wi-mute); font: 700 11px/1.2 var(--wi-head); text-transform: uppercase; letter-spacing: .12em; }
.wi-field input.textbox { width: 100%; }
.wi-field--row { flex-direction: row; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 6px; }
.wi-field--row label { text-transform: none; letter-spacing: 0; font: 400 13.5px/1.2 var(--wi-text); color: var(--wi-ink2); }
.wi-field .button { width: 100%; }
.wi-mine__who { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.wi-mine__who > span { display: flex; flex-direction: column; font-size: 13.5px; }
.wi-mine__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.wi-mine__links a { display: block; padding: 6px 8px; border-radius: 6px; color: var(--wi-ink2); font-size: 14px; }
.wi-mine__links a:hover { background: var(--wi-amber-l); color: var(--wi-amber); }
.wi-pm[data-n="0"] { display: none; }
.wi-pm { background: var(--wi-red); color: #fff; border-radius: 9px; padding: 0 6px; font-size: 12px; }

/* мобильная полоса (видна на узких экранах) */
.wi-mobbar { display: none; }
.wi-veil { position: fixed; inset: 0; background: rgba(0, 0, 0, .6); z-index: 35; }

/* ------------------------------------------------------------------ иллюминаторы участников, звания, репутация */
.wi-port { position: relative; display: inline-grid; place-items: center; flex-shrink: 0; border-radius: 50%; width: 44px; height: 44px; padding: 3px; background: conic-gradient(from 200deg, #f1d79f, #a57c40, #e8c88a, #7a5a2c, #d9b578, #f1d79f); box-shadow: 0 2px 5px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(0, 0, 0, .35); }
.wi-port img, .wi-port b { width: 100%; height: 100%; border-radius: 50%; display: grid; place-items: center; object-fit: cover; box-shadow: inset 0 0 0 1.5px rgba(0, 0, 0, .55); }
.wi-port b { font: 700 15px/1 var(--wi-head); color: #f1ead9; letter-spacing: .02em; }
.wi-port::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: linear-gradient(140deg, rgba(255, 255, 255, .22), transparent 42%); pointer-events: none; }
.wi-port--xs { width: 22px; height: 22px; padding: 2px; }
.wi-port--xs b { font-size: 8.5px; }
.wi-port--s { width: 30px; height: 30px; padding: 2px; }
.wi-port--s b { font-size: 11px; }
.wi-port--l { width: 58px; height: 58px; padding: 4px; }
.wi-port--l b { font-size: 19px; }
.wi-port--xl { width: 132px; height: 132px; padding: 7px; }
.wi-port--xl b { font-size: 40px; }
.wi-sea-0 b { background: radial-gradient(circle at 40% 30%, #2f6b86, #123447); }
.wi-sea-1 b { background: radial-gradient(circle at 40% 30%, #3f7d6c, #163a32); }
.wi-sea-2 b { background: radial-gradient(circle at 40% 30%, #6a5a86, #2b2240); }
.wi-sea-3 b { background: radial-gradient(circle at 40% 30%, #8a5a3a, #3e2414); }
.wi-sea-4 b { background: radial-gradient(circle at 40% 30%, #586a74, #1d282e); }

.wi-badge { display: block; flex-shrink: 0; }
.wi-badge__arc { fill: none; stroke: var(--wi-line2); stroke-width: 1.4; }
.wi-badge__tk { stroke: var(--wi-dim); stroke-width: 1.6; stroke-linecap: round; }
.wi-badge__tk.is-on { stroke: var(--wi-mark); }
.wi-badge__n { stroke: var(--wi-needle); stroke-width: 1.8; stroke-linecap: round; }
.wi-badge__hub { fill: var(--wi-brass); }
.wi-rank { display: inline-flex; align-items: center; gap: 6px; font: 700 11px/1.1 var(--wi-head); text-transform: uppercase; letter-spacing: .12em; color: var(--wi-brass); }
.wi-rep { display: inline-flex; align-items: center; gap: 3px; font: 500 12.5px/1 var(--wi-mono); color: var(--wi-amber); }
.wi-rose { display: block; }
.wi-rose path { fill: var(--wi-brass); }
.wi-rose .wi-rose__n { fill: var(--wi-red); }
.wi-rep--zero { color: var(--wi-mute); }
.wi-rep--down { color: var(--wi-red); }

/* ------------------------------------------------------------------ циферблаты */
.wi-dial { display: block; width: 100%; height: auto; overflow: visible; }
.wi-d__bez { fill: url(#wi-g-brass); }
.wi-d__bez2 { fill: #05080b; }
:root[data-mode="day"] .wi-d__bez2 { fill: #2b3135; }
.wi-d__face, .wi-d__face2 { fill: var(--wi-face); }
.wi-d__face2 { fill: none; stroke: var(--wi-mark2); stroke-width: .5; }
.wi-d__glare { fill: rgba(255, 255, 255, .055); pointer-events: none; }
:root[data-mode="day"] .wi-d__glare { fill: rgba(255, 255, 255, .5); }
.wi-d__tk { fill: none; stroke: var(--wi-mark); stroke-width: 1.5; stroke-linecap: round; }
.wi-d__tk2 { fill: none; stroke: var(--wi-mark2); stroke-width: .8; stroke-linecap: round; }
.wi-d__n { fill: var(--wi-mark); font: 700 8.5px/1 var(--wi-head); text-anchor: middle; }
.wi-d__n--s { font-size: 7px; }
.wi-d__w { fill: var(--wi-mark2); font: 400 6px/1 var(--wi-head); text-anchor: middle; }
.wi-d__cap { fill: var(--wi-mark); font: 700 6.4px/1 var(--wi-head); text-anchor: middle; letter-spacing: .14em; }
.wi-d__unit { fill: var(--wi-mark2); font: 400 5.6px/1 var(--wi-head); text-anchor: middle; letter-spacing: .08em; }
.wi-d__unit--port { fill: var(--wi-red); }
.wi-d__unit--stbd { fill: var(--wi-green); }
.wi-d__zone { fill: none; stroke-width: 3; stroke-linecap: butt; }
.wi-d__zone--red, .wi-d__zone--port { stroke: var(--wi-red); }
.wi-d__zone--green, .wi-d__zone--stbd { stroke: var(--wi-green); }
.wi-d__zone--ice { stroke: rgba(130, 170, 200, .45); }
.wi-d__zone--prep { stroke: var(--wi-amber); }
.wi-d__zone--nav { stroke: var(--wi-green); }
:root:not([data-mode="day"]) .wi-dial .wi-d__tk, :root:not([data-mode="day"]) .wi-dial .wi-d__n, :root:not([data-mode="day"]) .wi-dial .wi-d__cap { filter: drop-shadow(0 0 1.6px rgba(255, 77, 61, .55)); }
.wi-d__needle, .wi-clock__h, .wi-clock__m, .wi-clock__s, .wi-incl__ball { transform-origin: 60px 60px; transform: rotate(calc(var(--a) * 1deg)); }
.wi-d__needle path { fill: var(--wi-needle); filter: var(--wi-needle-glow); }
.wi-d__needle { animation: wi-wob var(--t, 6s) ease-in-out infinite alternate; }
.wi-d__needle--set { animation: none; }
.wi-d__needle--set path { fill: var(--wi-brass); filter: none; opacity: .9; }
@keyframes wi-wob {
	0% { transform: rotate(calc((var(--a) - var(--w)) * 1deg)); }
	35% { transform: rotate(calc((var(--a) + var(--w) * .4) * 1deg)); }
	70% { transform: rotate(calc((var(--a) - var(--w) * .2) * 1deg)); }
	100% { transform: rotate(calc((var(--a) + var(--w)) * 1deg)); }
}
.wi-d__hub { fill: url(#wi-g-brass); }
.wi-d__hub2 { fill: #1b1206; }
.wi-d__screw { fill: #3c4448; stroke: rgba(0, 0, 0, .5); stroke-width: .5; }

/* компас */
.wi-dial--compass .wi-cardrose { transform-origin: 60px 60px; transform: rotate(calc(var(--hdg, 0) * -1deg)); }
.wi-d__card { fill: var(--wi-mark); font: 700 9.5px/1 var(--wi-head); text-anchor: middle; }
.wi-d__card--n { fill: var(--wi-red); font-size: 11px; }
:root[data-mode="day"] .wi-d__card--n { fill: var(--wi-red); }
.wi-d__rose { fill: var(--wi-mark2); }
.wi-d__rose2 { fill: var(--wi-red); }
.wi-d__lubber { stroke: var(--wi-amber); stroke-width: 2; stroke-linecap: round; }
.wi-d__lubber2 { fill: var(--wi-amber); }

/* экраны: плоттер, эхолот, радар */
.wi-d__scr { fill: var(--wi-scr); }
.wi-d__scr--sea { fill: url(#wi-g-sea); }
:root[data-mode="day"] .wi-d__scr--sea { fill: #dcecf4; }
.wi-d__grid { fill: none; stroke: var(--wi-scr-line); stroke-width: .5; }
.wi-d__land { fill: var(--wi-land); stroke: var(--wi-mark2); stroke-width: .5; }
.wi-d__depth { fill: none; stroke: rgba(120, 170, 210, .35); stroke-width: .6; stroke-dasharray: 2 1.5; }
.wi-d__route { fill: none; stroke: var(--wi-amber); stroke-width: 1.1; stroke-dasharray: 3 2; }
.wi-d__wpt { fill: var(--wi-face); stroke: var(--wi-amber); stroke-width: 1; }
.wi-d__boat path { fill: var(--wi-red); }
.wi-d__bar { fill: rgba(0, 0, 0, .55); }
:root[data-mode="day"] .wi-d__bar { fill: rgba(20, 40, 55, .82); }
.wi-d__lcd { fill: var(--wi-lcd); font: 500 6.5px/1 var(--wi-mono); }
.wi-d__bar + .wi-d__lcd, .wi-d__bar ~ .wi-d__lcd { fill: #ff8f6a; }
:root[data-mode="day"] .wi-d__bar ~ .wi-d__lcd { fill: #f4f1e6; }
.wi-d__lcd--big { font-size: 15px; }
.wi-sonar .wi-d__lcd { fill: #ffb08a; }
:root[data-mode="day"] .wi-sonar .wi-d__lcd { fill: #0f2a3a; }
.wi-sonar__bed { fill: #6b2b12; opacity: .85; }
:root[data-mode="day"] .wi-sonar__bed { fill: #b9772f; }
.wi-sonar__line { fill: none; stroke: #ff7a3c; stroke-width: 1.4; }
:root[data-mode="day"] .wi-sonar__line { stroke: #7a2a0e; }
.wi-sonar__fish path { fill: none; stroke: #ffd36b; stroke-width: 1.1; stroke-linecap: round; }
:root[data-mode="day"] .wi-sonar__fish path { stroke: #1f6fa0; }
.wi-d__ring { fill: none; stroke: rgba(70, 227, 154, .22); stroke-width: .6; }
.wi-dial--radar .wi-d__scr { fill: #03140e; }
.wi-dial--radar .wi-d__grid { stroke: rgba(70, 227, 154, .16); }
.wi-d__coast { fill: none; stroke: rgba(70, 227, 154, .5); stroke-width: 1.6; stroke-linecap: round; stroke-dasharray: 1.5 1.8; }
.wi-radar__sweep { transform-origin: 60px 60px; animation: wi-spin 6s linear infinite; }
.wi-radar__beam { fill: url(#wi-g-beam); }
.wi-radar__edge { stroke: #46e39a; stroke-width: .8; }
.wi-radar__blip { fill: #8dffcb; opacity: 0; animation: wi-blip 6s linear infinite; animation-delay: var(--d); }
@keyframes wi-spin { to { transform: rotate(360deg); } }
@keyframes wi-blip { 0% { opacity: 1; } 55% { opacity: .15; } 100% { opacity: 0; } }
:root[data-mode="day"] .wi-dial--radar .wi-d__scr { fill: #0b2a1f; }

/* УКВ */
.wi-d__lcdbg { fill: var(--wi-lcd-bg); stroke: rgba(0, 0, 0, .5); stroke-width: .8; }
.wi-d__seg { fill: var(--wi-lcd); font: 500 30px/1 var(--wi-mono); letter-spacing: -.02em; }
.wi-d__seg--s { font-size: 18px; fill: var(--wi-mark); }
:root:not([data-mode="day"]) .wi-d__seg { filter: drop-shadow(0 0 3px rgba(255, 107, 61, .6)); }
.wi-vhf__bars rect { fill: var(--wi-lcd); animation: wi-bar 2.4s steps(1) infinite; }
.wi-vhf__bars rect:nth-child(2) { animation-delay: .3s; }
.wi-vhf__bars rect:nth-child(3) { animation-delay: .6s; }
.wi-vhf__bars rect:nth-child(4) { animation-delay: .9s; }
@keyframes wi-bar { 0%, 60% { opacity: 1; } 61%, 100% { opacity: .18; } }
.wi-d__knob { fill: url(#wi-g-steel); stroke: rgba(255, 255, 255, .12); stroke-width: .8; }
.wi-d__knobm { stroke: var(--wi-mark); stroke-width: 1.4; stroke-linecap: round; }
.wi-d__key { fill: #1b2328; stroke: rgba(255, 255, 255, .1); }
.wi-d__key--red { fill: #5a130d; stroke: var(--wi-red); stroke-width: .7; }
.wi-d__keyt { fill: #ffd2c4; font: 700 6px/1 var(--wi-head); text-anchor: middle; }

/* ветер, кренометр, часы */
.wi-d__hull { fill: none; stroke: var(--wi-mark2); stroke-width: 1.1; }
.wi-d__needle--wind path { fill: var(--wi-amber); }
.wi-d__tube { fill: none; stroke: var(--wi-line2); stroke-width: 8; stroke-linecap: round; }
:root:not([data-mode="day"]) .wi-d__tube { stroke: rgba(255, 106, 79, .12); }
.wi-incl__ball { transform-origin: 60px 28px; animation: wi-wob var(--t) ease-in-out infinite alternate; }
.wi-incl__ball circle { fill: var(--wi-needle); filter: var(--wi-needle-glow); }
.wi-d__sector { opacity: .85; }
.wi-d__sector--red { fill: var(--wi-red); }
.wi-d__sector--green { fill: var(--wi-green); }
.wi-clock .wi-d__face { fill: var(--wi-face); }
.wi-clock__h path, .wi-clock__m path { fill: var(--wi-mark); }
.wi-clock__s path { fill: var(--wi-needle); }
:root:not([data-mode="day"]) .wi-clock__h path, :root:not([data-mode="day"]) .wi-clock__m path { fill: #ffd8c8; }

/* табличка «О форуме» */
.wi-d__plate { fill: url(#wi-g-brass); }
.wi-d__plate2 { fill: none; stroke: rgba(60, 40, 15, .55); stroke-width: .8; }
.wi-d__engr { fill: #3c2a12; font: 700 11px/1 var(--wi-head); text-anchor: middle; letter-spacing: .18em; }
.wi-d__engr--s { font-size: 8.5px; }
.wi-d__engrl { stroke: rgba(60, 40, 15, .55); stroke-width: .8; }

/* ------------------------------------------------------------------ главная: шапка-бинакль и вахтенный журнал */
.wi-dash { display: grid; grid-template-columns: minmax(0, 2.1fr) minmax(300px, 1fr); gap: 20px; align-items: stretch; }
.wi-dash--low { grid-template-columns: minmax(0, 1.25fr) minmax(320px, 1fr); margin-top: 26px; align-items: start; }
.wi-hero {
	position: relative; display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 28px; align-items: center;
	padding: 26px 30px 30px 26px; border-radius: 18px; overflow: hidden;
	background:
		radial-gradient(420px 320px at 18% 50%, rgba(255, 77, 61, .14), transparent 70%),
		linear-gradient(rgba(255, 106, 79, .05) 1px, transparent 1px) 0 0 / 22px 22px,
		linear-gradient(90deg, rgba(255, 106, 79, .05) 1px, transparent 1px) 0 0 / 22px 22px,
		var(--wi-metal);
	border: 1px solid var(--wi-line);
	box-shadow: var(--wi-shadow);
}
:root[data-mode="day"] .wi-hero {
	background:
		radial-gradient(420px 320px at 18% 50%, rgba(255, 255, 255, .8), transparent 70%),
		linear-gradient(rgba(18, 28, 34, .05) 1px, transparent 1px) 0 0 / 22px 22px,
		linear-gradient(90deg, rgba(18, 28, 34, .05) 1px, transparent 1px) 0 0 / 22px 22px,
		var(--wi-metal);
}
.wi-hero::before, .wi-hero::after { content: ""; position: absolute; width: 8px; height: 8px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #8a8f90, #2b3236 70%); top: 12px; }
.wi-hero::before { left: 12px; }
.wi-hero::after { right: 12px; }
.wi-hero__compass { position: relative; }
.wi-hero__compass .wi-dial { filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .55)); }
.wi-hero__hdg { position: absolute; left: 50%; bottom: -6px; transform: translateX(-50%); margin: 0; display: flex; align-items: baseline; gap: 6px; padding: 5px 12px 4px; border-radius: 7px; background: var(--wi-lcd-bg); border: 1px solid rgba(0, 0, 0, .5); box-shadow: inset 0 1px 3px rgba(0, 0, 0, .6); color: var(--wi-lcd); font: 500 13px/1 var(--wi-mono); }
.wi-hero__hdg span { font-size: 10px; text-transform: uppercase; letter-spacing: .14em; opacity: .75; }
.wi-hero__hdg b { font-size: 21px; font-weight: 500; min-width: 3ch; text-shadow: 0 0 6px var(--wi-glow); }
.wi-hero__hdg i { font-style: normal; }
.wi-hero__h { font: 700 clamp(32px, 3vw, 44px)/1.04 var(--wi-head); margin: 0 0 14px; letter-spacing: -.005em; color: var(--wi-ink); text-shadow: 0 0 26px rgba(255, 77, 61, .22); }
:root[data-mode="day"] .wi-hero__h { text-shadow: none; }
.wi-hero__lead { font-size: 17.5px; line-height: 1.55; color: var(--wi-ink2); max-width: 54ch; margin-bottom: 18px; }
.wi-hero__go { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.wi-hero__hint { font-size: 13.5px; color: var(--wi-mute); margin: 0; max-width: 56ch; }
.wi-key { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px 9px; border-radius: 9px; font: 700 12.5px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .12em; color: var(--wi-ink); background: linear-gradient(180deg, #24313a, #121b21); border: 1px solid rgba(0, 0, 0, .6); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 3px 0 #05080a, 0 6px 12px -6px rgba(0, 0, 0, .8); transition: transform .12s, box-shadow .12s, color .2s; }
.wi-key::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--wi-amber); box-shadow: 0 0 6px rgba(255, 181, 71, .7); }
.wi-key:hover { color: var(--wi-amber); }
.wi-key:active { transform: translateY(2px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 #05080a; }
.wi-key--red { background: linear-gradient(180deg, #7a1d14, #4b0f09); color: #ffe3da; }
.wi-key--red::before { background: #ff8a72; box-shadow: 0 0 7px rgba(255, 77, 61, .9); }
:root[data-mode="day"] .wi-key { background: linear-gradient(180deg, #fbfbf8, #dfe2dc); color: var(--wi-ink); border-color: rgba(0, 0, 0, .18); box-shadow: inset 0 1px 0 #fff, 0 3px 0 #a9afab, 0 6px 12px -6px rgba(0, 0, 0, .3); }
:root[data-mode="day"] .wi-key--red { background: linear-gradient(180deg, #d63a2b, #a8241a); color: #fff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 3px 0 #6d140c; }

.wi-log { display: flex; flex-direction: column; }
.wi-logrows { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.wi-logrow { display: grid; grid-template-columns: 78px 38px minmax(0, 1fr); gap: 4px 10px; align-items: start; padding: 9px 0; border-top: 1px dashed var(--wi-line2); }
.wi-logrow:first-child { border-top: 0; padding-top: 2px; }
.wi-logrow__t .wi-stamp { flex-direction: column; gap: 2px; font-size: 12px; }
.wi-logrow__c { font: 500 10.5px/1 var(--wi-mono); color: var(--wi-red); border: 1px solid rgba(255, 77, 61, .5); border-radius: 4px; padding: 4px 0 3px; text-align: center; margin-top: 1px; }
.wi-logrow__c:hover { background: var(--wi-red); color: #fff; }
.wi-logrow__m { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.wi-logrow__s { color: var(--wi-ink); font-weight: 500; font-size: 15px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wi-logrow__s:hover { color: var(--wi-amber); }
.wi-logrow__by { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--wi-mute); flex-wrap: wrap; }
.wi-logrow__by i { font-style: normal; font-family: var(--wi-mono); font-size: 11.5px; color: var(--wi-dim); }
.wi-logrow__by .wi-port ~ i::before { content: "· "; }

/* ------------------------------------------------------------------ главная: приборный щит */
.wi-board { margin-top: 30px; }
.wi-board__head { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; margin-bottom: 14px; }
.wi-board__head p { margin: 0; color: var(--wi-mute); font-size: 14.5px; }
.wi-board__panels { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 18px; }
.wi-panel {
	grid-column: span 12; position: relative; padding: 40px 18px 18px; border-radius: 16px;
	background:
		radial-gradient(circle at 12px 12px, #7d8486 0 2.4px, #20272b 2.8px 3.6px, transparent 4px),
		radial-gradient(circle at calc(100% - 12px) 12px, #7d8486 0 2.4px, #20272b 2.8px 3.6px, transparent 4px),
		radial-gradient(circle at 12px calc(100% - 12px), #7d8486 0 2.4px, #20272b 2.8px 3.6px, transparent 4px),
		radial-gradient(circle at calc(100% - 12px) calc(100% - 12px), #7d8486 0 2.4px, #20272b 2.8px 3.6px, transparent 4px),
		repeating-linear-gradient(90deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 4px),
		linear-gradient(180deg, #111c24, #0b1319);
	border: 1px solid rgba(0, 0, 0, .7);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), inset 0 0 0 1px rgba(255, 255, 255, .02), 0 18px 34px -22px rgba(0, 0, 0, .95);
}
:root[data-mode="day"] .wi-panel {
	background:
		radial-gradient(circle at 12px 12px, #9aa0a2 0 2.4px, #5d6467 2.8px 3.6px, transparent 4px),
		radial-gradient(circle at calc(100% - 12px) 12px, #9aa0a2 0 2.4px, #5d6467 2.8px 3.6px, transparent 4px),
		radial-gradient(circle at 12px calc(100% - 12px), #9aa0a2 0 2.4px, #5d6467 2.8px 3.6px, transparent 4px),
		radial-gradient(circle at calc(100% - 12px) calc(100% - 12px), #9aa0a2 0 2.4px, #5d6467 2.8px 3.6px, transparent 4px),
		repeating-linear-gradient(90deg, rgba(0, 0, 0, .015) 0 1px, transparent 1px 4px),
		linear-gradient(180deg, #eceee9, #dfe2dc);
	border-color: rgba(0, 0, 0, .14);
	box-shadow: inset 0 1px 0 #fff, 0 16px 30px -22px rgba(20, 30, 36, .5);
}
.wi-panel--svyaz-i-pogoda, .wi-panel--motor-i-elektrika { grid-column: span 6; }
.wi-panel--rubka-i-sezon { grid-column: span 7; }
.wi-panel--kayut-kompaniya-cat { grid-column: span 5; }
.wi-panel__plate { position: absolute; top: -11px; left: 26px; margin: 0; display: flex; align-items: baseline; gap: 10px; padding: 6px 14px 5px; border-radius: 4px; background: linear-gradient(180deg, #e9cf98, #b48b4e 55%, #d7b678); box-shadow: 0 2px 0 #5d4422, 0 6px 12px -6px rgba(0, 0, 0, .8), inset 0 1px 0 rgba(255, 255, 255, .5); max-width: calc(100% - 52px); }
.wi-panel__plate a { font: 700 12.5px/1.1 var(--wi-head); text-transform: uppercase; letter-spacing: .2em; color: #2d1e0b; white-space: nowrap; }
.wi-panel__plate span { font: 400 11.5px/1.1 var(--wi-text); color: rgba(45, 30, 11, .75); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wi-panel__l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); gap: 22px 18px; }
.wi-panel--navigaciya .wi-panel__l { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 22px 14px; }
.wi-panel--svyaz-i-pogoda .wi-panel__l, .wi-panel--motor-i-elektrika .wi-panel__l, .wi-panel--rubka-i-sezon .wi-panel__l { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 14px; }
.wi-panel--kayut-kompaniya-cat .wi-panel__l { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wi-inst { display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0; }
.wi-inst__dial { display: block; width: 136px; max-width: 100%; margin-bottom: 10px; transition: transform .25s; }
.wi-inst__dial:hover, .wi-inst:hover .wi-inst__dial { transform: translateY(-3px); }
.wi-inst:hover .wi-dial { filter: drop-shadow(0 0 14px rgba(255, 77, 61, .2)); }
:root[data-mode="day"] .wi-inst:hover .wi-dial { filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .18)); }
.wi-inst__name { margin: 0 0 4px; font: 700 15.5px/1.22 var(--wi-head); letter-spacing: .01em; }
.wi-inst__name a { color: var(--wi-ink); }
.wi-inst__name a:hover { color: var(--wi-amber); }
.wi-inst__d { margin: 0 0 8px; font-size: 13px; line-height: 1.42; color: var(--wi-mute); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wi-inst__read { margin: auto 0 0; width: 100%; display: grid; grid-template-columns: 7px minmax(0, 1fr); gap: 3px 8px; align-items: start; text-align: left; padding: 8px 10px 7px; border-radius: 7px; background: rgba(0, 0, 0, .35); border: 1px solid rgba(255, 255, 255, .04); }
:root[data-mode="day"] .wi-inst__read { background: rgba(255, 255, 255, .7); border-color: rgba(0, 0, 0, .08); }
.wi-inst__read .wi-led { margin-top: 6px; }
.wi-inst__last { font-size: 13px; line-height: 1.35; color: var(--wi-ink2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wi-inst__last:hover { color: var(--wi-amber); }
.wi-inst__when { grid-column: 2; }
.wi-inst__when .wi-stamp { font-size: 11px; color: var(--wi-mute); }
.wi-inst__none { font-size: 12.5px; color: var(--wi-dim); }
.wi-inst__none ~ .wi-led, .wi-inst__read:has(.wi-inst__none) .wi-led { background: #3a1512; box-shadow: none; }

/* ------------------------------------------------------------------ главная: предсезонная проверка и Бофорт */
.wi-check__head { display: grid; grid-template-columns: minmax(0, 1fr) 128px; gap: 18px; align-items: center; margin-bottom: 14px; }
.wi-check__sub { margin: 6px 0 0; font-size: 14px; color: var(--wi-mute); }
.wi-check__gauge { text-align: center; }
.wi-check__gauge p { margin: 2px 0 0; font: 500 13px/1 var(--wi-mono); color: var(--wi-mute); }
.wi-check__gauge b { color: var(--wi-amber); font-size: 17px; }
.wi-dial--ready .wi-d__needle { animation: none; transition: transform .7s cubic-bezier(.4, 1.5, .5, 1); }
.wi-chks { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; }
.wi-chk { display: grid; grid-template-columns: 18px minmax(0, 1fr); grid-template-areas: "tog tag" "tog txt"; gap: 1px 12px; align-items: start; padding: 8px 6px; border-radius: 8px; cursor: pointer; font-size: 14px; line-height: 1.42; color: var(--wi-ink2); transition: background .2s; }
.wi-chk:hover { background: rgba(255, 255, 255, .03); }
:root[data-mode="day"] .wi-chk:hover { background: rgba(0, 0, 0, .035); }
.wi-chk input { position: absolute; opacity: 0; pointer-events: none; }
.wi-chk__tog { grid-area: tog; position: relative; width: 16px; height: 24px; border-radius: 4px; background: linear-gradient(180deg, #1d272e, #070b0e); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .8); margin-top: 1px; }
:root[data-mode="day"] .wi-chk__tog { background: linear-gradient(180deg, #a9b1ad, #d9ddd8); }
.wi-chk__tog i { position: absolute; left: 3px; right: 3px; height: 11px; bottom: 2px; border-radius: 3px; background: linear-gradient(180deg, #d9dde0, #7c8589); box-shadow: 0 2px 2px rgba(0, 0, 0, .6); transition: bottom .25s cubic-bezier(.4, 1.6, .5, 1), background .25s; }
.wi-chk input:checked + .wi-chk__tog i { bottom: 11px; background: linear-gradient(180deg, #8ff0c3, #1f9a63); }
.wi-chk input:focus-visible + .wi-chk__tog { outline: 2px solid var(--wi-amber); outline-offset: 2px; }
.wi-chk__tag { grid-area: tag; font: 700 10px/1.2 var(--wi-head); text-transform: uppercase; letter-spacing: .12em; color: var(--wi-brass); padding-top: 2px; }
.wi-chk__t { grid-area: txt; }
.wi-chk input:checked ~ .wi-chk__t { color: var(--wi-mute); text-decoration: line-through; text-decoration-color: rgba(61, 220, 151, .6); }
.wi-check__foot { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 14px 0 0; }

.wi-bft__sea { display: block; width: 100%; height: 120px; border-radius: 10px; margin-bottom: 14px; }
.wi-bft__sky { fill: #071826; }
:root[data-mode="day"] .wi-bft__sky { fill: #cfe3ee; }
.wi-bft__wave { fill: #0f3a52; }
.wi-bft__wave--b { fill: #0a2a3d; }
:root[data-mode="day"] .wi-bft__wave { fill: #3f7fa0; }
:root[data-mode="day"] .wi-bft__wave--b { fill: #6a9fba; }
.wi-bft__caps path { fill: none; stroke: #e9f4f8; stroke-width: 2; stroke-linecap: round; opacity: .85; }
.wi-bft__pole { stroke: var(--wi-brass); stroke-width: 2.4; }
.wi-bft__sock { fill: var(--wi-red); transform-origin: 353px 32px; transition: transform .6s cubic-bezier(.4, 1.4, .5, 1); }
.wi-bft__ctl { display: grid; grid-template-columns: auto minmax(0, 1fr) 34px; gap: 12px; align-items: center; margin-bottom: 12px; }
.wi-bft__ctl label { font: 700 11px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .14em; color: var(--wi-brass); }
.wi-bft__ctl output { font: 500 22px/1 var(--wi-mono); color: var(--wi-amber); text-align: right; }
.wi-bft input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 26px; background: transparent; cursor: pointer; }
.wi-bft input[type="range"]::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--wi-green), var(--wi-amber) 55%, var(--wi-red)); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .6); }
.wi-bft input[type="range"]::-moz-range-track { height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--wi-green), var(--wi-amber) 55%, var(--wi-red)); }
.wi-bft input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; margin-top: -8px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #f1d79f, #8a6a3c); border: 2px solid #1b1206; box-shadow: 0 2px 5px rgba(0, 0, 0, .6); }
.wi-bft input[type="range"]::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #f1d79f, #8a6a3c); border: 2px solid #1b1206; }
.wi-bft__dl { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 8px; margin: 0 0 10px; }
.wi-bft__dl div { padding: 8px 10px; border-radius: 7px; background: var(--wi-lcd-bg); border: 1px solid rgba(0, 0, 0, .45); box-shadow: inset 0 1px 3px rgba(0, 0, 0, .55); min-width: 0; }
.wi-bft__dl dt { font: 700 9.5px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .12em; color: var(--wi-lcd); opacity: .7; margin-bottom: 5px; }
.wi-bft__dl dd { margin: 0; font: 500 15px/1.15 var(--wi-mono); color: var(--wi-lcd); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wi-bft__dl div:first-child dd { font-family: var(--wi-head); font-weight: 700; font-size: 14.5px; }
.wi-bft__sign { font-size: 14.5px; color: var(--wi-ink2); min-height: 2.9em; margin-bottom: 8px; }
.wi-bft__note { font-size: 12.5px; color: var(--wi-mute); margin: 0; }

/* ------------------------------------------------------------------ раздел */
.wi-fhead { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 28px; align-items: center; padding: 24px 28px; margin-bottom: 20px; border-radius: 18px; background: var(--wi-metal); border: 1px solid var(--wi-line); box-shadow: var(--wi-shadow); }
.wi-fhead__dial .wi-dial { filter: drop-shadow(0 14px 18px rgba(0, 0, 0, .55)); }
.wi-fhead__minis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.wi-fhead__d { color: var(--wi-ink2); font-size: 16px; max-width: 70ch; margin-bottom: 14px; }
.wi-fhead__act { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.wi-minidial { display: block; }
.wi-tlist { padding: 18px 20px 10px; }
.wi-tlist__head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 10px; margin-bottom: 10px; }
.wi-sort { margin: 0; display: flex; gap: 6px 14px; flex-wrap: wrap; font-size: 13.5px; color: var(--wi-mute); }
.wi-sort a { color: var(--wi-ink2); border-bottom: 1px dashed var(--wi-line2); }
.wi-sort a:hover { color: var(--wi-amber); border-color: currentColor; }
.wi-tlist__cols { display: grid; grid-template-columns: 82px minmax(0, 1fr) 86px; gap: 14px; padding: 8px 6px; font: 700 10.5px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .14em; color: var(--wi-dim); border-bottom: 1px solid var(--wi-line2); }
.wi-tlist__list { list-style: none; margin: 0; padding: 0; }
.wi-trow { display: grid; grid-template-columns: 82px minmax(0, 1fr) 86px; gap: 14px; align-items: center; padding: 12px 6px; border-bottom: 1px dashed var(--wi-line2); position: relative; }
.wi-trow:last-child { border-bottom: 0; }
.wi-trow:hover { background: rgba(255, 255, 255, .02); }
.wi-trow__date .wi-stamp { font-size: 12px; }
.wi-trow__h { margin: 0 0 5px; font: 500 16.5px/1.35 var(--wi-text); }
.wi-trow__t { color: var(--wi-ink); }
.wi-trow__t:hover { color: var(--wi-amber); }
.wi-trow__meta { margin: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: var(--wi-mute); }
.wi-trow__by a { color: var(--wi-ink2); }
.wi-trow__n { display: flex; flex-direction: column; align-items: center; padding: 6px 4px; border-radius: 8px; background: var(--wi-lcd-bg); border: 1px solid rgba(0, 0, 0, .45); box-shadow: inset 0 1px 3px rgba(0, 0, 0, .5); color: var(--wi-lcd); }
.wi-trow__n b { font: 500 18px/1 var(--wi-mono); }
.wi-trow__n span { font-size: 10.5px; opacity: .8; }
.wi-trow[data-state="wait"] .wi-trow__n { color: var(--wi-mute); }
.wi-trow.forumdisplay_sticky .wi-trow__t::before, .wi-trow.sticky .wi-trow__t::before { content: "закреплено"; font: 700 10px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .14em; color: var(--wi-red); border: 1px solid currentColor; border-radius: 3px; padding: 3px 5px 2px; margin-right: 8px; vertical-align: 2px; }
.wi-trow__mod { position: absolute; right: -24px; top: 16px; }
.wi-pages { font-size: 12px; color: var(--wi-mute); margin-left: 8px; }
.wi-pages a { color: var(--wi-amber); margin: 0 2px; }
.wi-sep { list-style: none; font: 700 10.5px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .16em; color: var(--wi-brass); padding: 14px 6px 6px; }
.wi-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 14px 0; }
.wi-bar__r { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.wi-subs, .wi-group { margin-bottom: 18px; }
.wi-subl { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.wi-subf { padding: 14px 16px; border-radius: 12px; background: var(--wi-metal); border: 1px solid var(--wi-line); }
.wi-subf__t { margin: 0 0 4px; font: 700 15.5px/1.25 var(--wi-head); }
.wi-subf__t a { color: var(--wi-ink); }
.wi-subf__d { margin: 0 0 8px; font-size: 13.5px; color: var(--wi-mute); }
.wi-subf__lp { margin: 0; font-size: 13px; }
.wi-subf__lt > span { color: var(--wi-dim); }
.wi-new { display: none; }

/* ------------------------------------------------------------------ тема: маршрутный лист, схема курса, дерево */
.wi-thead { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 26px; align-items: center; padding: 22px 26px; border-radius: 18px; background: var(--wi-metal); border: 1px solid var(--wi-line); box-shadow: var(--wi-shadow); margin-bottom: 14px; }
.wi-thead__dial .wi-dial { filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .55)); }
.wi-thead__k { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font: 700 12px/1.2 var(--wi-head); text-transform: uppercase; letter-spacing: .14em; }
.wi-thead__k a { color: var(--wi-brass); }
.wi-thead__k a:hover { color: var(--wi-amber); }
.wi-thead__h1 { margin-bottom: 10px; }
.wi-thead__by { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 14.5px; color: var(--wi-ink2); }
.wi-thead__dl { display: grid; grid-template-columns: repeat(4, minmax(0, auto)); justify-content: start; gap: 8px 12px; margin: 0; }
.wi-thead__dl div { padding: 7px 12px 6px; border-radius: 8px; background: rgba(0, 0, 0, .3); border: 1px solid var(--wi-line); min-width: 0; }
:root[data-mode="day"] .wi-thead__dl div { background: rgba(255, 255, 255, .65); }
.wi-thead__dl dt { font: 700 9.5px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .14em; color: var(--wi-dim); margin-bottom: 4px; }
.wi-thead__dl dd { margin: 0; font: 500 13.5px/1.25 var(--wi-mono); color: var(--wi-ink); }
.wi-stack { display: flex; }
.wi-stack .wi-port { margin-right: -7px; }

.wi-route { margin: 0 0 22px; padding: 12px 16px 10px; border-radius: 14px; border: 1px solid var(--wi-line); background:
	linear-gradient(var(--wi-scr-line) 1px, transparent 1px) 0 0 / 17px 17px,
	linear-gradient(90deg, var(--wi-scr-line) 1px, transparent 1px) 0 0 / 17px 17px,
	var(--wi-scr); }
.wi-route figcaption { font: 500 11.5px/1.3 var(--wi-mono); color: var(--wi-mute); margin-bottom: 4px; }
.wi-route__scroll { overflow-x: auto; scrollbar-width: thin; }
.wi-route__svg { display: block; max-width: none; height: auto; }
.wi-route__ln { fill: none; stroke: var(--wi-course); stroke-width: 1.6; stroke-dasharray: 4 3; }
.wi-route__pt circle { fill: var(--wi-face); stroke: var(--wi-amber); stroke-width: 1.6; transition: r .2s, fill .2s; }
.wi-route__pt--start circle { fill: var(--wi-red); stroke: var(--wi-red); }
.wi-route__pt text { fill: var(--wi-ink2); font: 500 10.5px/1 var(--wi-mono); text-anchor: middle; }
.wi-route__pt:hover circle, .wi-route__pt:focus circle { fill: var(--wi-amber); }
.wi-route:empty, .wi-route__scroll:empty { display: none; }
.wi-route:has(.wi-route__scroll:empty) { display: none; }

.wi-posts { display: flex; flex-direction: column; }
.wi-post { margin: 0; position: relative; }
.wi-anchor { position: absolute; top: -16px; }
.wi-post__row { --lane: 28px; display: grid; grid-template-columns: calc(var(--d, 0) * var(--lane)) minmax(0, 1fr); padding-bottom: 14px; position: relative; }
.wi-post__lanes { position: relative; }
.wi-lane { position: absolute; top: 0; bottom: 0; left: calc((var(--k) - 1) * var(--lane) + 11px); width: 0; border-left: 2px dashed var(--wi-course); }
.wi-lane--leg { border-left: 0; }
.wi-lane--go { border-left: 2px dashed var(--wi-course); }
.wi-lane--leg::before { content: ""; position: absolute; left: -2px; top: 0; height: 34px; width: calc(var(--lane) - 13px); border-left: 2px dashed var(--wi-course); border-bottom: 2px dashed var(--wi-course); border-bottom-left-radius: 10px; }
.wi-lane--leg::after { content: ""; position: absolute; left: calc(var(--lane) - 19px); top: 29px; width: 9px; height: 9px; transform: rotate(45deg); background: var(--wi-amber); box-shadow: 0 0 0 2px var(--wi-bg), 0 0 8px rgba(255, 181, 71, .5); }
:root[data-mode="day"] .wi-lane--leg::after { background: var(--wi-red); box-shadow: 0 0 0 2px var(--wi-bg); }
.wi-post__card { min-width: 0; border-radius: 13px; background: var(--wi-card); border: 1px solid var(--wi-line); box-shadow: var(--wi-shadow); overflow: hidden; transition: box-shadow .3s, border-color .3s; }
.wi-post:target .wi-post__card, .wi-post.is-hl .wi-post__card { border-color: var(--wi-amber); box-shadow: 0 0 0 3px var(--wi-amber-l), var(--wi-shadow); }
.wi-post__bar { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 11px 16px; background: linear-gradient(180deg, rgba(255, 255, 255, .035), transparent); border-bottom: 1px solid var(--wi-line); }
:root[data-mode="day"] .wi-post__bar { background: linear-gradient(180deg, #fff, #f0f1ec); }
.wi-post__id { min-width: 0; }
.wi-post__nick { margin: 0 0 2px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font: 700 15.5px/1.2 var(--wi-head); }
.wi-post__nick > a { color: var(--wi-ink); }
.wi-post__nick > a:hover { color: var(--wi-amber); }
.wi-post__op { font: 700 9.5px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .14em; color: var(--wi-red); border: 1px solid currentColor; border-radius: 3px; padding: 3px 5px 2px; }
.wi-post__rank { margin: 0; }
.wi-post__line { margin: 3px 0 0; display: flex; flex-wrap: wrap; gap: 2px 12px; font-size: 12.5px; color: var(--wi-mute); line-height: 1.35; }
.wi-post__boat::before { content: ""; display: inline-block; width: 10px; height: 6px; margin-right: 5px; vertical-align: 1px; border-radius: 0 0 6px 6px; border: 1.4px solid var(--wi-brass); border-top: 0; }
.wi-post__nav { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.wi-post__num { font: 500 11px/1 var(--wi-mono); color: var(--wi-amber); border: 1px solid rgba(255, 181, 71, .45); border-radius: 4px; padding: 4px 6px 3px; }
.wi-post__num--start { color: var(--wi-red); border-color: rgba(255, 77, 61, .5); text-transform: uppercase; letter-spacing: .08em; }
.wi-post__when { font: 500 12px/1 var(--wi-mono); color: var(--wi-mute); white-space: nowrap; }
.wi-post__when:hover { color: var(--wi-amber); }
.wi-post__re { display: inline-block; margin: 10px 16px 0; font: 500 12px/1.2 var(--wi-mono); color: var(--wi-mute); }
.wi-post__re:hover { color: var(--wi-amber); }
.wi-post__body { padding: 14px 18px 4px; font-size: 16.5px; line-height: 1.64; color: var(--wi-ink); overflow-wrap: anywhere; }
.wi-post--start .wi-post__card { border-color: rgba(255, 77, 61, .35); }
.wi-post--start .wi-post__body { font-size: 17.5px; padding-top: 16px; }
.wi-post--start .wi-post__bar { box-shadow: inset 4px 0 0 var(--wi-red); }
.wi-post--op .wi-post__bar { box-shadow: inset 3px 0 0 var(--wi-amber); }
.post_meta { padding: 0 18px; font-size: 12px; color: var(--wi-dim); }
.post_meta:empty { display: none; }
.wi-post__foot { display: flex; justify-content: space-between; gap: 10px 18px; flex-wrap: wrap; padding: 8px 18px 12px; }
.wi-post__foot:not(:has(a)) { display: none; }
.wi-tfoot { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; align-items: center; margin: 10px 0 18px; }
.wi-tfoot__note { margin: 0; font-size: 13.5px; color: var(--wi-mute); max-width: 70ch; }
.wi-nextprev { display: flex; gap: 18px; font-size: 14px; }
.wi-nextprev a { color: var(--wi-ink2); border-bottom: 1px dashed var(--wi-line2); }
.wi-tools .thread_tools { list-style: none; padding: 0; margin: 0 0 10px; display: flex; gap: 14px; flex-wrap: wrap; font-size: 13.5px; }
.wi-tools .thread_tools li { background: none !important; padding: 0 !important; }
.wi-guest { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 16px 20px; margin: 4px 0 18px; border-radius: 12px; border: 1px dashed var(--wi-line2); }
.wi-guest p { margin: 0; color: var(--wi-ink2); }

/* ------------------------------------------------------------------ профиль: судовой билет */
.wi-ticket__head { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 26px; align-items: center; padding: 26px 28px; border-radius: 18px; background:
	linear-gradient(90deg, var(--wi-brass) 0 4px, transparent 4px),
	var(--wi-metal); border: 1px solid var(--wi-line); box-shadow: var(--wi-shadow); margin-bottom: 18px; }
.wi-ticket__name { margin: 0 0 8px; }
.wi-ticket__rank { margin: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font: 700 13px/1.2 var(--wi-head); text-transform: uppercase; letter-spacing: .14em; color: var(--wi-brass); }
.wi-ticket__nums { list-style: none; margin: 0; padding: 0; display: flex; gap: 10px; }
.wi-ticket__nums li { min-width: 98px; padding: 10px 14px 8px; border-radius: 9px; background: var(--wi-lcd-bg); border: 1px solid rgba(0, 0, 0, .45); box-shadow: inset 0 1px 3px rgba(0, 0, 0, .55); color: var(--wi-lcd); text-align: center; }
.wi-ticket__nums b { display: block; font: 500 28px/1 var(--wi-mono); }
.wi-ticket__nums span { font-size: 12px; opacity: .8; }
.wi-ticket__grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 18px; margin-bottom: 18px; }
.wi-fields__dl { margin: 0; display: grid; gap: 0; }
.wi-fields__dl div { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-bottom: 1px dashed var(--wi-line2); }
.wi-fields__dl dt { font: 700 11px/1.5 var(--wi-head); text-transform: uppercase; letter-spacing: .12em; color: var(--wi-mute); }
.wi-fields__dl dd { margin: 0; color: var(--wi-ink); }
.wi-fields__links { display: flex; gap: 14px; flex-wrap: wrap; margin: 14px 0 0; }
.wi-scale__l { list-style: none; margin: 0; padding: 0 0 0 26px; position: relative; display: flex; flex-direction: column-reverse; }
.wi-scale__l::before { content: ""; position: absolute; left: 8px; top: 6px; bottom: 6px; width: 2px; background: linear-gradient(0deg, var(--wi-green), var(--wi-amber), var(--wi-red)); border-radius: 1px; }
.wi-scale__l li { position: relative; display: flex; justify-content: space-between; gap: 10px; padding: 7px 10px; border-radius: 7px; font-size: 14px; color: var(--wi-mute); }
.wi-scale__l li::before { content: ""; position: absolute; left: -22px; top: 50%; width: 10px; height: 2px; background: var(--wi-mark2); }
.wi-scale__l li b { font: 700 13px/1.3 var(--wi-head); letter-spacing: .04em; color: var(--wi-ink2); }
.wi-scale__l li span { font: 500 12px/1.3 var(--wi-mono); }
.wi-scale__l li.is-past b { color: var(--wi-ink); }
.wi-scale__l li.is-now { background: var(--wi-red-l); color: var(--wi-ink); }
.wi-scale__l li.is-now b { color: var(--wi-red); }
.wi-scale__l li.is-now::after { content: ""; position: absolute; left: -30px; top: 50%; margin-top: -6px; border: 6px solid transparent; border-left: 12px solid var(--wi-needle); filter: var(--wi-needle-glow); }
.wi-scale__note { margin: 12px 0 0; font-size: 12.5px; color: var(--wi-mute); }
.wi-ptop__l { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.wi-ptop__l li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 14px; align-items: center; }
.wi-ptop__l li > span { display: flex; flex-direction: column; gap: 2px; }
.wi-ptop__l li > span a { color: var(--wi-ink); font: 700 14.5px/1.25 var(--wi-head); }
.wi-ptop__l i { font-style: normal; font: 500 12px/1 var(--wi-mono); color: var(--wi-mute); }
.wi-ticket__extra:empty { display: none; }

/* ------------------------------------------------------------------ ошибки и переходы */
.wi-msg { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 28px; align-items: center; max-width: 900px; margin: 10px auto 30px; padding: 28px 30px; }
.wi-msg__body { color: var(--wi-ink2); }
.wi-msg__body ol, .wi-msg__body ul { padding-left: 1.2em; }
.wi-msg--go { margin-top: 12vh; }
.wi-page--redirect { display: grid; place-items: start center; padding: 0 16px; }

/* ------------------------------------------------------------------ подвал */
.wi-foot { position: relative; margin-top: 30px; border-top: 1px solid var(--wi-line); background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .25)); }
:root[data-mode="day"] .wi-foot { background: linear-gradient(180deg, transparent, rgba(255, 255, 255, .45)); }
.wi-foot__in { max-width: 1340px; margin: 0 auto; padding: 26px 30px 56px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 14px 40px; }
.wi-foot__brand { margin: 0; color: var(--wi-ink2); font-size: 14.5px; }
.wi-foot__brand b { font-family: var(--wi-head); color: var(--wi-ink); }
.wi-foot__links { display: flex; flex-wrap: wrap; gap: 8px 18px; align-content: start; font-size: 14px; }
.wi-foot__links a { color: var(--wi-ink2); }
.wi-foot__links a:hover { color: var(--wi-amber); }
.wi-foot__note { grid-column: 1 / -1; margin: 0; font-size: 12.5px; color: var(--wi-dim); }
.wi-foot__sea { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 34px; display: block; }
.wi-foot__sea path { fill: rgba(255, 77, 61, .07); }
:root[data-mode="day"] .wi-foot__sea path { fill: rgba(30, 80, 110, .12); }

/* ------------------------------------------------------------------ стандартные элементы MyBB под рубку */
.tborder { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--wi-card); border: 1px solid var(--wi-line); border-radius: 12px; overflow: hidden; margin: 0 0 18px; color: var(--wi-ink); box-shadow: var(--wi-shadow); }
.tborder td, .tborder th { padding: 10px 14px; border-bottom: 1px solid var(--wi-line); vertical-align: top; text-align: left; }
.thead { background: var(--wi-card2); border-bottom: 1px solid var(--wi-line2) !important; color: var(--wi-ink); font: 700 16.5px/1.3 var(--wi-head); }
.thead a, .thead strong { color: var(--wi-ink); }
.thead .expcolimage { float: right; }
.tcat { background: rgba(0, 0, 0, .25); font: 700 11px/1.3 var(--wi-head); letter-spacing: .14em; text-transform: uppercase; color: var(--wi-brass); }
:root[data-mode="day"] .tcat { background: rgba(0, 0, 0, .04); }
.tcat a { color: var(--wi-brass); }
.trow1, .trow2 { background: transparent; }
.trow2 { background: rgba(255, 255, 255, .015); }
.trow_shaded { background: var(--wi-red-l); }
.trow_selected td, .trow_selected { background: var(--wi-amber-l); }
.tfoot { background: var(--wi-card2); }
.tborder a, .trow1 a, .trow2 a, .tfoot a { color: var(--wi-amber); }
.smalltext { font-size: 13px; line-height: 1.45; color: var(--wi-mute); }
.largetext { font: 700 19px/1.3 var(--wi-head); }
.float_left { float: left; } .float_right { float: right; } .clear { clear: both; }
input.textbox, textarea, select, input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="number"], input[type="url"] {
	font: 400 16px/1.4 var(--wi-text); color: var(--wi-ink); background: rgba(0, 0, 0, .35); border: 1px solid var(--wi-line2); border-radius: 8px; padding: 9px 12px; max-width: 100%; transition: border-color .2s, box-shadow .2s; }
:root[data-mode="day"] input.textbox, :root[data-mode="day"] textarea, :root[data-mode="day"] select, :root[data-mode="day"] input[type="text"], :root[data-mode="day"] input[type="password"], :root[data-mode="day"] input[type="search"] { background: #fff; }
textarea { width: 100%; min-height: 170px; line-height: 1.55; }
input.textbox:focus, textarea:focus, select:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="search"]:focus { outline: none; border-color: var(--wi-amber); box-shadow: 0 0 0 3px var(--wi-amber-l); }
.button, input.button, button.button, a.button, input[type="submit"], input[type="button"], button[type="submit"]:not(.wi-find__b) {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px; font: 700 13px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .1em; color: #ffe3da; background: linear-gradient(180deg, #7a1d14, #4b0f09); border: 1px solid rgba(0, 0, 0, .6); border-radius: 9px; padding: 12px 18px 11px; cursor: pointer; text-decoration: none; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 3px 0 #200503; transition: transform .12s, box-shadow .12s, filter .2s; }
.button:hover, input.button:hover, input[type="submit"]:hover, button[type="submit"]:not(.wi-find__b):hover, a.button:hover { color: #fff; filter: brightness(1.15); }
.button:active, input[type="submit"]:active { transform: translateY(2px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 1px 0 #200503; }
:root[data-mode="day"] .button, :root[data-mode="day"] input[type="submit"], :root[data-mode="day"] a.button { background: linear-gradient(180deg, #d63a2b, #a8241a); color: #fff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 3px 0 #6d140c; }
.closed_button { background: var(--wi-card2) !important; color: var(--wi-mute) !important; box-shadow: none !important; }
.pagination { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; font: 500 13px/1 var(--wi-mono); }
.pagination .pages { color: var(--wi-mute); margin-right: 6px; font-family: var(--wi-text); }
.pagination a, .pagination .pagination_current { display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding: 0 9px; border: 1px solid var(--wi-line2); border-radius: 8px; color: var(--wi-ink2); background: transparent; }
.pagination a:hover { border-color: var(--wi-amber); color: var(--wi-amber); }
.pagination .pagination_current { background: var(--wi-lcd-bg); color: var(--wi-lcd); border-color: rgba(0, 0, 0, .5); }
.postbit_buttons { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.postbit_buttons > a, .postbit_buttons a { display: inline-flex; align-items: center; padding: 3px 0; font: 500 12.5px/1.2 var(--wi-text); color: var(--wi-mute); }
.postbit_buttons a:hover { color: var(--wi-amber); }
.postbit_buttons a span { background: none !important; padding: 0 !important; }
.popup_menu { background: var(--wi-card2); border: 1px solid var(--wi-line2); border-radius: 10px; padding: 6px; box-shadow: 0 18px 30px -14px rgba(0, 0, 0, .8); z-index: 50; }
.popup_menu .popup_item { display: block; padding: 7px 10px; color: var(--wi-ink2); font-size: 15px; border-radius: 6px; }
.popup_menu .popup_item:hover { background: var(--wi-amber-l); color: var(--wi-amber); }
.blocker { background: rgba(0, 0, 0, .7) !important; }
.modal { background: var(--wi-card2) !important; color: var(--wi-ink); border: 1px solid var(--wi-line2); border-radius: 14px !important; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .9) !important; padding: 18px !important; }
.modal .tborder { margin: 0; box-shadow: none; }
.error, div.error { background: var(--wi-red-l); border: 1px solid rgba(255, 77, 61, .45); border-radius: 10px; padding: 12px 16px; color: var(--wi-ink); margin-bottom: 14px; }
.red_alert, .pm_alert { background: var(--wi-amber-l); border: 1px solid rgba(255, 181, 71, .35); border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; }
fieldset { border: 1px solid var(--wi-line2); border-radius: 10px; padding: 12px 14px; margin: 0 0 14px; }
legend { font: 700 11px/1 var(--wi-head); letter-spacing: .14em; text-transform: uppercase; color: var(--wi-brass); padding: 0 6px; }
.usercp_nav_item, .modcp_nav_item { display: block; padding: 6px 4px; color: var(--wi-ink2); }
.sceditor-container { border-radius: 8px; overflow: hidden; max-width: 100%; }
.ignored_post, .deleted_post_hidden { padding: 12px 16px; border: 1px dashed var(--wi-line2); border-radius: 10px; color: var(--wi-mute); margin-bottom: 12px; }
.scaleimages img { max-width: 100%; height: auto; border-radius: 8px; }
/* BB-коды */
blockquote.mycode_quote { margin: 10px 0 12px; padding: 10px 14px 10px 16px; border-left: 3px solid var(--wi-brass); background: rgba(201, 163, 106, .08); border-radius: 0 9px 9px 0; color: var(--wi-ink2); font-size: 15.5px; }
blockquote.mycode_quote cite { display: block; font: 700 11.5px/1.2 var(--wi-head); font-style: normal; text-transform: uppercase; letter-spacing: .1em; color: var(--wi-brass); margin-bottom: 5px; }
blockquote.mycode_quote cite > span { color: var(--wi-dim); margin-left: 6px; font: 400 11px/1 var(--wi-mono); text-transform: none; letter-spacing: 0; }
.codeblock { margin: 12px 0; background: var(--wi-lcd-bg); border: 1px solid rgba(0, 0, 0, .5); border-radius: 9px; overflow: hidden; }
.codeblock .title { font: 700 10.5px/1 var(--wi-head); letter-spacing: .14em; text-transform: uppercase; color: var(--wi-lcd); opacity: .75; padding: 8px 12px; border-bottom: 1px solid rgba(0, 0, 0, .35); }
.codeblock code { display: block; padding: 12px; overflow-x: auto; font: 13.5px/1.5 var(--wi-mono); color: var(--wi-lcd); }
.mycode_list, ul.mycode_list, ol.mycode_list { padding-left: 1.4em; }
.post_body li::marker { color: var(--wi-red); }
.post_body hr, .mycode_hr { border: 0; height: 2px; margin: 16px 0; background: repeating-linear-gradient(90deg, var(--wi-line2) 0 8px, transparent 8px 13px); }
.signature { margin: 4px 18px 10px; padding-top: 8px; border-top: 1px dashed var(--wi-line2); font-size: 14px; color: var(--wi-mute); }
.video_embed iframe, .post_body iframe { max-width: 100%; border-radius: 9px; }
.post_body .mycode_s { text-decoration-color: var(--wi-red); text-decoration-thickness: 1.5px; }
.post_body .mycode_u { text-decoration-color: var(--wi-brass); text-underline-offset: 3px; }
.post_body img.mycode_img { border-radius: 9px; }
.post_body .mycode_b, .post_body strong { color: var(--wi-ink); }

/* ------------------------------------------------------------------ планшет: рейка становится выезжающей */
@media (max-width: 1180px) {
	.wi-dash { grid-template-columns: minmax(0, 1fr); }
	.wi-dash--low { grid-template-columns: minmax(0, 1fr); }
	.wi-panel--svyaz-i-pogoda, .wi-panel--motor-i-elektrika, .wi-panel--rubka-i-sezon, .wi-panel--kayut-kompaniya-cat { grid-column: span 12; }
	.wi-log .wi-logrows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 22px; }
	.wi-panel--navigaciya .wi-panel__l { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.wi-log .wi-logrow:nth-child(2) { border-top: 0; padding-top: 2px; }
}
@media (max-width: 980px) {
	.wi-app { grid-template-columns: minmax(0, 1fr); }
	.wi-rail { position: fixed; left: 0; top: 0; bottom: 0; width: min(300px, 86vw); height: 100%; transform: translateX(-105%); transition: transform .3s ease; }
	.wi-rail.is-open { transform: none; }
	.wi-mobbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; position: sticky; top: 0; z-index: 30; padding: 9px 16px; background: rgba(6, 11, 16, .92); backdrop-filter: blur(8px); border-bottom: 1px solid var(--wi-line); }
	:root[data-mode="day"] .wi-mobbar { background: rgba(228, 231, 226, .94); }
	.wi-logo--mob .wi-logo__name { font-size: 16px; }
	.wi-logo--mob .wi-logo__k { font-size: 9px; }
	.wi-mobbar__b { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 9px; border: 1px solid var(--wi-line2); background: transparent; font: 700 12px/1 var(--wi-head); text-transform: uppercase; letter-spacing: .14em; color: var(--wi-ink); cursor: pointer; }
	.wi-mobbar__i { display: grid; gap: 3px; }
	.wi-mobbar__i i { display: block; width: 14px; height: 2px; border-radius: 1px; background: var(--wi-red); }
	.wi-me__panel { bottom: auto; top: calc(100% + 8px); }
	.wi-main, .wi-crumbs-row { padding-left: 20px; padding-right: 20px; }
	.wi-foot__in { padding-left: 20px; padding-right: 20px; }
}

/* ------------------------------------------------------------------ телефон */
@media (max-width: 760px) {
	body { font-size: 16px; }
	.wi-main, .wi-crumbs-row { padding-left: 16px; padding-right: 16px; }
	.wi-page--index .wi-main { padding-top: 14px; }
	.wi-hero { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 22px 18px 20px; }
	.wi-hero__compass { width: min(240px, 72vw); margin: 0 auto 6px; }
	.wi-hero__lead { font-size: 16px; }
	.wi-log .wi-logrows { display: flex; }
	.wi-log .wi-logrow:nth-child(2) { border-top: 1px dashed var(--wi-line2); padding-top: 9px; }
	.wi-panel { padding: 36px 12px 14px; }
	.wi-panel__plate { left: 14px; max-width: calc(100% - 28px); }
	.wi-panel__plate span { display: none; }
	.wi-panel .wi-panel__l { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 10px; }
	.wi-inst__dial { width: 112px; }
	.wi-inst__name { font-size: 14px; }
	.wi-inst__d { display: none; }
	.wi-inst__read { padding: 7px 8px 6px; }
	.wi-inst__last { font-size: 12.5px; }
	.wi-check__head { grid-template-columns: minmax(0, 1fr) 96px; }
	.wi-chks { grid-template-columns: minmax(0, 1fr); }
	.wi-bft__dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wi-fhead { grid-template-columns: 96px minmax(0, 1fr); gap: 16px; padding: 18px 16px; }
	.wi-fhead__minis { grid-template-columns: repeat(2, 1fr); }
	.wi-fhead__d { font-size: 14.5px; }
	.wi-tlist { padding: 14px 12px 6px; }
	.wi-tlist__cols { display: none; }
	.wi-trow { grid-template-columns: minmax(0, 1fr) 62px; gap: 8px 12px; }
	.wi-trow__date { grid-column: 1 / -1; order: -1; margin-bottom: -4px; }
	.wi-trow__h { font-size: 15.5px; }
	.wi-thead { grid-template-columns: 72px minmax(0, 1fr); gap: 14px; padding: 16px; align-items: start; }
	.wi-thead__dl { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-column: 1 / -1; }
	.wi-thead__txt { display: contents; }
	.wi-thead__k, .wi-thead__h1, .wi-thead__by { grid-column: 2; }
	.wi-thead__dial { grid-row: 1 / span 3; }
	.wi-thead__k { margin-bottom: 4px; }
	.wi-thead__h1 { font-size: 22px; }
	.wi-thead__by { grid-column: 1 / -1; }
	.wi-post__row { --lane: 14px; }
	.wi-lane { left: calc((var(--k) - 1) * var(--lane) + 5px); }
	.wi-lane--leg::before { width: calc(var(--lane) - 5px); height: 28px; border-bottom-left-radius: 6px; }
	.wi-lane--leg::after { left: calc(var(--lane) - 9px); top: 24px; width: 7px; height: 7px; }
	.wi-post__bar { grid-template-columns: auto minmax(0, 1fr); padding: 10px 12px; gap: 10px; }
	.wi-post__nav { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center; }
	.wi-post__body { padding: 12px 13px 2px; font-size: 15.5px; }
	.wi-post--start .wi-post__body { font-size: 16px; }
	.wi-post__line { display: none; }
	.wi-post__foot { padding: 6px 13px 10px; }
	.wi-post__re { margin: 8px 13px 0; }
	.signature { margin: 4px 13px 10px; }
	.wi-ticket__head { grid-template-columns: auto minmax(0, 1fr); gap: 16px; padding: 18px; }
	.wi-ticket__head .wi-port--xl { width: 88px; height: 88px; padding: 5px; }
	.wi-ticket__head .wi-port--xl b { font-size: 28px; }
	.wi-ticket__nums { grid-column: 1 / -1; }
	.wi-ticket__nums li { flex: 1; min-width: 0; }
	.wi-ticket__grid { grid-template-columns: minmax(0, 1fr); }
	.wi-fields__dl div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
	.wi-foot__in { grid-template-columns: minmax(0, 1fr); padding: 22px 16px 50px; }
	.wi-msg { grid-template-columns: minmax(0, 1fr); padding: 22px 18px; }
	.wi-msg__dial { width: 110px; }
	.tborder td, .tborder th { padding: 8px 10px; }
	.tborder { display: block; overflow-x: auto; }
}
@media (max-width: 400px) {
	.wi-logo--mob .wi-logo__k { display: none; }
	.wi-panel__l { gap: 16px 8px; }
	.wi-inst__dial { width: 100px; }
	.wi-hero__h { font-size: 31px; }
	.wi-logrow { grid-template-columns: 64px 34px minmax(0, 1fr); gap: 4px 8px; }
	.wi-thead__dl dd { font-size: 12.5px; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ------------------------------------------------------------------ ссылки в сообщениях: свой стиль форума («эхограмма дна»)
   Под словом полоска 6px, как нижняя кромка экрана эхолота: неровная линия грунта 1,1px оранжевым «эхом» и тёмная
   заливка под ней (SVG data-URI, сегмент 40px, repeat-x, рельеф стыкуется без шва, box-decoration-break: clone).
   Без подчёркивания и значка внешней ссылки, текст тёплый янтарно-кремовый 500. При наведении «эхо» становится
   янтарным, заливка гуще, текст светлеет. Днём линия грунта тёмно-кирпичная, заливка песочная. */
:is(.post_body, .signature, [class*="-post__body"], [class*="-post__sign"]) a.mycode_url {
	color: var(--wi-link);
	font-weight: 500;
	text-decoration: none;
	padding-bottom: 6px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='6' viewBox='0 0 40 6'%3E%3Cpath d='M0 3.4L4 2.6 7 3.8 11 2.2 15 3 19 1.8 23 3.2 27 2.4 31 3.9 35 2.8 40 3.4V6H0z' fill='%23a3341a' fill-opacity='.45'/%3E%3Cpath d='M0 3.4L4 2.6 7 3.8 11 2.2 15 3 19 1.8 23 3.2 27 2.4 31 3.9 35 2.8 40 3.4' fill='none' stroke='%23ff7a3c' stroke-opacity='.85' stroke-width='1.1' stroke-linejoin='round'/%3E%3C/svg%3E") repeat-x 0 100% / 40px 6px;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	transition: color .2s;
}
:is(.post_body, .signature, [class*="-post__body"], [class*="-post__sign"]) a.mycode_url:hover,
:is(.post_body, .signature, [class*="-post__body"], [class*="-post__sign"]) a.mycode_url:focus-visible {
	color: var(--wi-ink);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='6' viewBox='0 0 40 6'%3E%3Cpath d='M0 3.4L4 2.6 7 3.8 11 2.2 15 3 19 1.8 23 3.2 27 2.4 31 3.9 35 2.8 40 3.4V6H0z' fill='%23d28c1f' fill-opacity='.55'/%3E%3Cpath d='M0 3.4L4 2.6 7 3.8 11 2.2 15 3 19 1.8 23 3.2 27 2.4 31 3.9 35 2.8 40 3.4' fill='none' stroke='%23ffb547' stroke-opacity='1' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E");
}
:root[data-mode="day"] :is(.post_body, .signature, [class*="-post__body"], [class*="-post__sign"]) a.mycode_url { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='6' viewBox='0 0 40 6'%3E%3Cpath d='M0 3.4L4 2.6 7 3.8 11 2.2 15 3 19 1.8 23 3.2 27 2.4 31 3.9 35 2.8 40 3.4V6H0z' fill='%23b9772f' fill-opacity='.4'/%3E%3Cpath d='M0 3.4L4 2.6 7 3.8 11 2.2 15 3 19 1.8 23 3.2 27 2.4 31 3.9 35 2.8 40 3.4' fill='none' stroke='%237a2a0e' stroke-opacity='.8' stroke-width='1.1' stroke-linejoin='round'/%3E%3C/svg%3E"); }
:root[data-mode="day"] :is(.post_body, .signature, [class*="-post__body"], [class*="-post__sign"]) a.mycode_url:hover, :root[data-mode="day"] :is(.post_body, .signature, [class*="-post__body"], [class*="-post__sign"]) a.mycode_url:focus-visible { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='6' viewBox='0 0 40 6'%3E%3Cpath d='M0 3.4L4 2.6 7 3.8 11 2.2 15 3 19 1.8 23 3.2 27 2.4 31 3.9 35 2.8 40 3.4V6H0z' fill='%23d28c1f' fill-opacity='.5'/%3E%3Cpath d='M0 3.4L4 2.6 7 3.8 11 2.2 15 3 19 1.8 23 3.2 27 2.4 31 3.9 35 2.8 40 3.4' fill='none' stroke='%23c22a1c' stroke-opacity='1' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E"); }
:is(.post_body, .signature, [class*="-post__body"], [class*="-post__sign"]) a.mycode_url::after { content: none; }