/* Худеем у нас — тема «Трекер».
 * Дневник пути на белом листе в точку: графитовый текст и один коралловый маркер, без третьего цвета.
 * Мотивы: блокнот в точку, кружки трекера привычек, washi-лента, маркер-хайлайтер, сантиметровая лента,
 * кроссовок, контейнер с обедом, стакан воды, будильник сна — всё нарисовано в коде.
 * Шрифты: M PLUS Rounded 1c 400/500/700/800 (заголовки, интерфейс, текст, цифры трекера) + Playpen Sans (пометки маркером). OFL, свои woff2.
 */

/* ------------------------------------------------------------------ шрифты */
@font-face { font-family: "M PLUS Rounded 1c"; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/m-plus-rounded-1c-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: "M PLUS Rounded 1c"; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/m-plus-rounded-1c-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: "M PLUS Rounded 1c"; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/m-plus-rounded-1c-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: "M PLUS Rounded 1c"; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/m-plus-rounded-1c-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: "M PLUS Rounded 1c"; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/m-plus-rounded-1c-cyrillic-700-normal.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "M PLUS Rounded 1c"; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/m-plus-rounded-1c-latin-700-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: "M PLUS Rounded 1c"; font-style: normal; font-weight: 800; font-display: swap; src: url(fonts/m-plus-rounded-1c-cyrillic-800-normal.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "M PLUS Rounded 1c"; font-style: normal; font-weight: 800; font-display: swap; src: url(fonts/m-plus-rounded-1c-latin-800-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: "Playpen Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/playpen-sans-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: "Playpen Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/playpen-sans-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; }

/* ------------------------------------------------------------------ токены: белый лист, графит, один коралловый маркер */
:root {
	--hu-paper: #ffffff;
	--hu-desk: #f1f1f3;
	--hu-ink: #25272d;
	--hu-ink2: #3c3f47;
	--hu-mute: #5c6068;
	--hu-line: #e3e4e7;
	--hu-line2: #c9cbd0;
	--hu-dotc: #d3d5da;
	--hu-coral: #ff6464;
	--hu-coral-d: #b8283a;
	--hu-coral-dd: #8f1e2e;
	--hu-coral-t: rgba(255, 100, 100, .14);
	--hu-coral-t2: rgba(255, 100, 100, .26);
	--hu-coral-paper: #fff3f3;
	--hu-hl: rgba(255, 100, 100, .5);
	--hu-ui: "M PLUS Rounded 1c", "Nunito", "Segoe UI", system-ui, sans-serif;
	--hu-text: "M PLUS Rounded 1c", "Segoe UI", system-ui, -apple-system, sans-serif;
	--hu-hand: "Playpen Sans", "Comic Sans MS", cursive;
	--hu-dots: radial-gradient(circle at 1px 1px, var(--hu-dotc) 1.15px, transparent 1.4px) 0 0 / 22px 22px;
	--hu-shadow: 6px 6px 0 var(--hu-ink);
	--hu-ease: cubic-bezier(.22, .8, .3, 1);
}

/* ------------------------------------------------------------------ основа */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-bottom: 110px; }
body { margin: 0; font-variant-numeric: tabular-nums; background: var(--hu-desk); color: var(--hu-ink); font: 400 16px/1.6 var(--hu-text); overflow-x: hidden; }
img, svg { max-width: 100%; }
a { color: var(--hu-coral-d); text-decoration: none; }
a:hover { color: var(--hu-coral-dd); }
:focus-visible { outline: 3px solid var(--hu-ink); outline-offset: 2px; box-shadow: 0 0 0 6px var(--hu-coral-t2); border-radius: 6px; }
mark { background: none; color: inherit; }
.hu-skip { position: absolute; left: -999px; top: 8px; z-index: 200; background: var(--hu-ink); color: #fff; padding: 10px 14px; border-radius: 10px; }
.hu-skip:focus { left: 12px; color: #fff; }
.hu-app { min-height: 100vh; display: flex; flex-direction: column; }
.hu-main { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 24px 40px; flex: 1; }
.hu-h1 { font: 800 clamp(30px, 3.4vw, 44px)/1.08 var(--hu-ui); letter-spacing: -.01em; margin: 0 0 10px; color: var(--hu-ink); }
.hu-h2 { font: 800 24px/1.2 var(--hu-ui); margin: 0; color: var(--hu-ink); }
.hu-h3 { font: 800 18px/1.25 var(--hu-ui); margin: 0 0 10px; color: var(--hu-ink); }
.hu-kicker { margin: 0 0 8px; font: 500 12.5px/1.3 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-mute); }
.hu-hand { font: 500 15px/1.3 var(--hu-hand); color: var(--hu-coral-d); }
.hu-empty { list-style: none; padding: 16px 0; color: var(--hu-mute); font-size: 15px; }
.hu-more { font: 500 14px/1.3 var(--hu-ui); color: var(--hu-ink); border-bottom: 2px solid var(--hu-coral); padding-bottom: 1px; }
.hu-more:hover { color: var(--hu-coral-dd); }
.hu-link-btn { font: 500 14px/1.3 var(--hu-ui); color: var(--hu-ink); background: none; border: 0; border-bottom: 2px dashed var(--hu-line2); padding: 2px 0; cursor: pointer; }
.hu-link-btn:hover { border-bottom-color: var(--hu-coral); }
.hu-i { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.hu-i .f { fill: currentColor; stroke: none; }
.hu-i .a { stroke: var(--hu-coral); }
.hu-i .a.f { fill: var(--hu-coral); stroke: none; }

/* маркер-хайлайтер под словом */
.hu-mark, .hu-logo__name mark { background: linear-gradient(100deg, transparent .2em, var(--hu-coral) .25em, var(--hu-coral) calc(100% - .2em), transparent calc(100% - .12em)) 0 72% / 100% 46% no-repeat; padding: 0 .12em; margin: 0 -.06em; }

/* washi-лента: косая печать и зубчатые края, полупрозрачная */
.hu-washi { position: absolute; z-index: 2; width: 118px; height: 28px; pointer-events: none;
	background: repeating-linear-gradient(-55deg, rgba(255, 100, 100, .7) 0 7px, rgba(255, 100, 100, .45) 7px 14px);
	-webkit-mask: conic-gradient(from 45deg at left, #0000, #000 1deg 89deg, #0000 90deg) left / 51% 8px repeat-y, conic-gradient(from -135deg at right, #0000, #000 1deg 89deg, #0000 90deg) right / 51% 8px repeat-y;
	mask: conic-gradient(from 45deg at left, #0000, #000 1deg 89deg, #0000 90deg) left / 51% 8px repeat-y, conic-gradient(from -135deg at right, #0000, #000 1deg 89deg, #0000 90deg) right / 51% 8px repeat-y;
	mix-blend-mode: multiply; }
.hu-washi--tl { top: -12px; left: 26px; transform: rotate(-6deg); }
.hu-washi--tr { top: -12px; right: 30px; transform: rotate(5deg); width: 92px; }

/* лица: фото в белой рамке, монограммы на кружке */
.hu-face { display: inline-grid; place-items: center; flex: none; border-radius: 50%; overflow: hidden; background: #fff; border: 2px solid var(--hu-ink); }
.hu-face img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hu-face--xs { width: 26px; height: 26px; border-width: 1.5px; font: 800 12px/1 var(--hu-ui); }
.hu-face--s { width: 34px; height: 34px; font: 800 13px/1 var(--hu-ui); }
.hu-face--m { width: 52px; height: 52px; font: 800 18px/1 var(--hu-ui); }
.hu-face--l { width: 68px; height: 68px; font: 800 22px/1 var(--hu-ui); }
.hu-face--xl { width: 176px; height: 176px; border-radius: 4px; font: 800 56px/1 var(--hu-ui); border: 0; }
.hu-face--mono { color: var(--hu-ink); }
.hu-tone-0 { background: var(--hu-coral); }
.hu-tone-1 { background: #fff; background-image: linear-gradient(0deg, var(--hu-coral) 50%, transparent 50%); }
.hu-tone-2 { background: var(--hu-coral-paper); border-style: dashed; }

/* этапы: кружок трекера своей формы + подпись */
.hu-stage { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 6px; border-radius: 999px; background: #fff; border: 1.5px solid var(--hu-line2); font: 500 12.5px/1.3 var(--hu-ui); color: var(--hu-ink); white-space: nowrap; vertical-align: middle; }
.hu-stage::before { content: ""; width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--hu-coral); flex: none; box-sizing: border-box; display: grid; place-items: center; font: 800 9px/1 var(--hu-ui); color: var(--hu-ink); }
.hu-stage--report::before { background: linear-gradient(0deg, var(--hu-coral) 50%, transparent 50%); }
.hu-stage--sryv::before { border-style: dashed; border-color: var(--hu-coral-d); }
.hu-stage--plato::before { background: linear-gradient(transparent 42%, var(--hu-coral) 42% 62%, transparent 62%); }
.hu-stage--derzhu { background: var(--hu-coral-t); border-color: var(--hu-coral); }
.hu-stage--derzhu::before { background: var(--hu-coral); border-color: var(--hu-ink); }
.hu-stage--ask::before { content: "?"; border-color: var(--hu-ink); width: 13px; height: 13px; }
.hu-stage--none { color: var(--hu-mute); border-style: dashed; }
.hu-stage--none::before { border-color: var(--hu-line2); }
.hu-stage--xs { font-size: 12px; padding: 1px 8px 1px 4px; }
.hu-stage--dot { padding: 0; border: 0; background: none; }

/* кружки трекера */
.hu-dots { display: inline-grid; grid-auto-flow: column; grid-auto-columns: 14px; gap: 5px; align-items: center; }
.hu-dot { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(37, 39, 45, .26); background: #fff; vertical-align: middle; }
.hu-dot--1 { border-color: var(--hu-coral); background: linear-gradient(0deg, var(--hu-coral) 50%, #fff 50%); }
.hu-dot--2 { border-color: var(--hu-coral); background: var(--hu-coral); }

/* бейдж звания: кольцо трекера из шести сегментов */
.hu-badge { flex: none; }
.hu-badge path { fill: none; stroke-width: 3.4; stroke-linecap: round; }
.hu-badge path.on { stroke: var(--hu-coral); }
.hu-badge path.off { stroke: rgba(37, 39, 45, .2); }
.hu-badge text { font: 800 9px/1 var(--hu-ui); fill: var(--hu-ink); }
.hu-badge .dot { fill: var(--hu-ink); }
.hu-rank { display: inline-flex; align-items: center; gap: 6px; font: 500 13px/1.2 var(--hu-ui); color: var(--hu-ink2); }

/* ------------------------------------------------------------------ шапка: тонкая полоса с логотипом и крошками */
.hu-top { background: var(--hu-paper); border-bottom: 2px solid var(--hu-ink); position: relative; z-index: 5; }
.hu-top__in { max-width: 1240px; margin: 0 auto; padding: 10px 24px; display: flex; align-items: center; gap: 12px 28px; flex-wrap: wrap; }
.hu-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--hu-ink); }
.hu-logo:hover { color: var(--hu-ink); }
.hu-logo__mark { transition: transform .4s var(--hu-ease); }
.hu-logo:hover .hu-logo__mark { transform: rotate(-6deg); }
.hu-logo__txt { display: grid; }
.hu-logo__name { font: 800 21px/1.1 var(--hu-ui); }
.hu-logo__sub { font: 500 12.5px/1.3 var(--hu-ui); color: var(--hu-mute); }
.hu-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; font: 500 13px/1.4 var(--hu-ui); color: var(--hu-mute); min-width: 0; }
.hu-crumbs a { color: var(--hu-ink2); border-bottom: 1.5px solid var(--hu-line2); }
.hu-crumbs a:hover { border-color: var(--hu-coral); color: var(--hu-ink); }
.hu-crumbs .active { color: var(--hu-ink); max-width: 46ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hu-crumbs__sep { color: var(--hu-coral-d); }
.hu-page--index .hu-crumbs { display: none; }

/* ------------------------------------------------------------------ главная: дневник на разворот */
.hu-diary { margin: 30px 0 0; }
.hu-tabs { display: flex; gap: 6px; padding: 0 24px; position: relative; z-index: 1; overflow-x: auto; scrollbar-width: none; }
.hu-tabs::-webkit-scrollbar { display: none; }
.hu-tab { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px 16px; background: var(--hu-paper); border: 2px solid var(--hu-ink); border-bottom: 0; border-radius: 14px 14px 0 0; font: 500 14px/1 var(--hu-ui); color: var(--hu-ink); white-space: nowrap; transform: translateY(8px); transition: transform .25s var(--hu-ease), background .2s; }
.hu-tab:hover { color: var(--hu-ink); transform: translateY(3px); }
.hu-tab.is-on { background: var(--hu-coral); transform: translateY(0); }
.hu-tab.is-on .hu-i .a { stroke: var(--hu-ink); }
.hu-tab.is-on .hu-i .a.f { fill: var(--hu-ink); }

.hu-spread { position: relative; display: grid; grid-template-columns: minmax(0, 1.14fr) minmax(0, 1fr); background: var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 8px 18px 18px 8px; box-shadow: var(--hu-shadow); }
.hu-spread::before { content: ""; position: absolute; top: 0; bottom: 0; left: 53.27%; width: 56px; transform: translateX(-50%); background: linear-gradient(90deg, transparent, rgba(37, 39, 45, .05) 38%, rgba(37, 39, 45, .14) 50%, rgba(37, 39, 45, .05) 62%, transparent); pointer-events: none; }
.hu-spread::after { content: ""; position: absolute; top: 0; bottom: 0; left: 53.27%; border-left: 1.5px solid rgba(37, 39, 45, .22); }
.hu-leaf { position: relative; padding: 34px 40px 34px; background: var(--hu-dots); min-width: 0; }
.hu-leaf--l { padding-right: 52px; }
.hu-leaf--r { padding-left: 46px; background: linear-gradient(90deg, transparent 120px, var(--hu-coral) 120px 122px, transparent 122px), var(--hu-dots); }

.hu-title { position: relative; padding: 0 0 22px; margin-bottom: 18px; }
.hu-title__h { font-size: clamp(42px, 5vw, 68px); line-height: 1; margin: 6px 0 14px; }
.hu-title__lead { margin: 0; max-width: 44ch; font-size: 16.5px; color: var(--hu-ink2); }
.hu-title__note { position: absolute; right: -6px; top: 4px; margin: 0; transform: rotate(6deg); text-align: center; font-size: 15px; }
.hu-title__tape { display: block; width: 240px; height: auto; margin: 18px 0 0 -6px; transform: rotate(-2deg); }
.hu-title__tape text { font-size: 9px; }

.hu-trk__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin-bottom: 10px; }
.hu-trk__hint { margin: 0; font: 500 12.5px/1.6 var(--hu-ui); color: var(--hu-mute); display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.hu-trk__hint .hu-dot { width: 12px; height: 12px; margin-left: 4px; }
.hu-trk__dots { grid-auto-columns: 13px; gap: 4px; }
.hu-trk__dots .hu-dot { width: 13px; height: 13px; }
.hu-trk__months, .hu-trk__row { display: grid; grid-template-columns: minmax(0, 1fr) auto 46px; gap: 12px; align-items: center; }
.hu-trk__months { padding: 6px 0 4px; border-bottom: 2px solid var(--hu-ink); }
.hu-trk__ml { display: inline-grid; grid-auto-flow: column; grid-auto-columns: 13px; gap: 4px; text-align: center; font: 800 12px/1 var(--hu-ui); color: var(--hu-mute); }
.hu-trk__ml i { font-style: normal; }
.hu-trk__ml i:last-child { color: var(--hu-coral-d); }
.hu-trk__list { list-style: none; margin: 0; padding: 0; }
.hu-trk__cat { padding: 14px 0 4px; font: 800 12.5px/1.2 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-ink); }
.hu-trk__cat span { background: linear-gradient(transparent 58%, var(--hu-coral-t2) 58%); }
.hu-trk__row { padding: 9px 0; border-bottom: 1.5px dashed var(--hu-line2); transition: background .2s; }
.hu-trk__row:hover { background: linear-gradient(90deg, var(--hu-coral-t), transparent 80%); }
.hu-trk__name { display: flex; align-items: center; gap: 10px; color: var(--hu-ink); min-width: 0; }
.hu-trk__name:hover { color: var(--hu-ink); }
.hu-trk__name > span { display: grid; min-width: 0; }
.hu-trk__name b { font: 500 15.5px/1.25 var(--hu-ui); }
.hu-trk__name:hover b { text-decoration: underline; text-decoration-color: var(--hu-coral); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.hu-trk__name small { font: 400 12.5px/1.35 var(--hu-text); color: var(--hu-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hu-trk__n { display: grid; justify-items: end; font: 500 12px/1.1 var(--hu-ui); color: var(--hu-mute); }
.hu-trk__n b { font: 800 19px/1 var(--hu-ui); color: var(--hu-ink); }
.hu-trk__row[hidden], .hu-trk__cat[hidden] { display: none; }

.hu-entries__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; margin: 0 0 10px 98px; }
.hu-entries__hint { margin: 0; font: 500 12.5px/1.3 var(--hu-ui); color: var(--hu-mute); }
.hu-entries { list-style: none; margin: 0; padding: 0; }
.hu-entry { position: relative; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 0 34px; padding: 14px 0 15px; border-bottom: 1.5px dashed var(--hu-line2); }
.hu-entry.is-more { display: none; }
.hu-entry__date { margin: 0; display: grid; justify-items: end; align-content: start; text-align: right; font: 500 12.5px/1.15 var(--hu-ui); color: var(--hu-mute); text-transform: uppercase; letter-spacing: .04em; }
.hu-entry__date b { font: 800 28px/1 var(--hu-ui); color: var(--hu-ink); letter-spacing: 0; font-variant-numeric: tabular-nums; }
.hu-entry__date i { font-style: normal; display: block; }
.hu-entry__k { margin: 0 0 6px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font: 500 13px/1.3 var(--hu-ui); padding-right: 92px; }
.hu-entry__k a { color: var(--hu-mute); }
.hu-entry__k a:hover { color: var(--hu-ink); }
.hu-entry__t { margin: 0 0 7px; font: 500 17.5px/1.32 var(--hu-ui); }
.hu-entry__t a { color: var(--hu-ink); background: linear-gradient(transparent 62%, transparent 62%) 0 0 / 0 100% no-repeat; transition: background-size .35s var(--hu-ease); }
.hu-entry__t a:hover { color: var(--hu-ink); background-image: linear-gradient(transparent 58%, var(--hu-coral-t2) 58% 92%, transparent 92%); background-size: 100% 100%; }
.hu-entry:first-child .hu-entry__t a { background-image: linear-gradient(transparent 58%, var(--hu-coral-t2) 58% 92%, transparent 92%); background-size: 100% 100%; }
.hu-entry__m { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font: 400 13.5px/1.3 var(--hu-text); color: var(--hu-mute); }
.hu-entry__m a { color: var(--hu-ink2); border-bottom: 1.5px solid var(--hu-line2); }
.hu-entry__m a:hover { border-color: var(--hu-coral); color: var(--hu-ink); }
.hu-entry__by { color: var(--hu-ink); font-weight: 700; }
.hu-note-m { position: absolute; top: 10px; right: 0; transform: rotate(-5deg); font: 500 14.5px/1 var(--hu-hand); color: var(--hu-coral-d); padding: 3px 8px; border: 1.8px solid var(--hu-coral); border-radius: 50% 46% 52% 44% / 60% 50% 56% 46%; background: #fff; }
.hu-entries__more { margin: 16px 0 0 98px; }
.hu-entries__none { margin-left: 98px; }

/* ------------------------------------------------------------------ вау: «Мой трекер на 4 недели» */
.hu-my { position: relative; margin: 52px 0 0; padding: 36px 40px 30px; background: var(--hu-dots), var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 18px; box-shadow: var(--hu-shadow); }
.hu-my__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 4px 40px; align-items: end; margin-bottom: 20px; }
.hu-my__head .hu-kicker { grid-column: 1 / -1; }
.hu-my__h { font-size: clamp(26px, 3vw, 36px); line-height: 1.1; }
.hu-my__lead { margin: 0; color: var(--hu-ink2); font-size: 15.5px; }
.hu-my__pick { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.hu-habit { position: relative; display: grid; justify-items: start; align-content: start; gap: 4px; padding: 14px 14px 12px; min-height: 120px; text-align: left; background: #fff; border: 2px solid var(--hu-ink); border-radius: 14px; color: var(--hu-ink); cursor: pointer; transition: transform .2s var(--hu-ease), background .2s, box-shadow .2s; }
.hu-habit:hover { transform: translateY(-2px); box-shadow: 0 4px 0 var(--hu-ink); }
.hu-habit[aria-pressed="true"] { background: var(--hu-coral); box-shadow: 0 4px 0 var(--hu-ink); }
.hu-habit[aria-pressed="true"] .hu-i .a { stroke: var(--hu-ink); }
.hu-habit[aria-pressed="true"]::after { content: ""; position: absolute; top: 10px; right: 10px; width: 22px; height: 22px; border-radius: 50%; background: var(--hu-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18 8' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 15px no-repeat; }
.hu-habit:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.hu-habit__t { font: 800 15px/1.2 var(--hu-ui); }
.hu-habit__d { font: 400 12.5px/1.35 var(--hu-text); color: var(--hu-ink2); }
.hu-habit[aria-pressed="true"] .hu-habit__d { color: var(--hu-ink); }
.hu-my__empty { margin: 18px 0 0; font-size: 17px; text-align: center; }
.hu-my__board { margin-top: 24px; }
.hu-my__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; padding-bottom: 10px; border-bottom: 2px solid var(--hu-ink); }
.hu-my__count { margin: 0; font: 500 14px/1.4 var(--hu-ui); }
.hu-my__count b { font-weight: 800; }
.hu-my__grid { display: grid; gap: 0; }
.hu-hrow { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: 12px 16px; align-items: center; padding: 14px 0; border-bottom: 1.5px dashed var(--hu-line2); }
.hu-hrow__name { display: flex; align-items: center; gap: 10px; font: 800 15px/1.2 var(--hu-ui); }
.hu-hrow__name small { display: block; font: 500 12.5px/1.3 var(--hu-ui); color: var(--hu-mute); margin-top: 2px; }
.hu-weeks { display: grid; grid-template-columns: repeat(4, max-content); gap: 10px 12px; }
.hu-wk { display: grid; gap: 3px; }
.hu-wk__l { font: 500 12px/1 var(--hu-ui); color: var(--hu-mute); display: grid; grid-template-columns: repeat(7, 28px); gap: 4px; text-align: center; }
.hu-wk__l span.is-we { color: var(--hu-coral-d); }
.hu-ring { --p: 0%; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; flex: none; background: radial-gradient(closest-side, #fff 76%, transparent 78%), conic-gradient(var(--hu-coral) var(--p), rgba(37, 39, 45, .14) 0); transition: --p .4s; }
.hu-wk__d { display: grid; grid-template-columns: repeat(7, 28px); gap: 4px; }
.hu-day { width: 28px; height: 28px; border-radius: 50%; border: 2px solid rgba(37, 39, 45, .32); background: #fff; display: grid; place-items: center; font: 500 12px/1 var(--hu-ui); color: var(--hu-ink2); padding: 0; cursor: pointer; transition: transform .18s var(--hu-ease), background .18s; }
.hu-day:hover:not(:disabled) { transform: scale(1.12); border-color: var(--hu-coral); }
.hu-day[aria-pressed="true"] { background: var(--hu-coral); border-color: var(--hu-coral); color: var(--hu-ink); font-weight: 800; }
.hu-day.is-today { border-width: 3px; border-color: var(--hu-ink); }
.hu-day.is-missed { border-style: dashed; }
.hu-day:disabled { cursor: default; border-style: dotted; border-color: var(--hu-line2); color: var(--hu-mute); background: transparent; }
.hu-day.pop { animation: hu-pop .32s var(--hu-ease); }
@keyframes hu-pop { 40% { transform: scale(1.28); } 100% { transform: scale(1); } }
.hu-my__hint { position: relative; margin: 20px 0 0; padding: 20px 24px 18px; background: var(--hu-coral-paper); border: 2px solid var(--hu-ink); border-radius: 14px; animation: hu-rise .4s var(--hu-ease); }
.hu-my__hint-k { margin: 0 0 4px; font-size: 16px; }
.hu-my__tips { margin: 0 0 14px; padding-left: 1.2em; }
.hu-my__tips li { margin: 3px 0; }
.hu-my__tips li::marker { color: var(--hu-coral-d); }
.hu-my__hint-act { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; }
.hu-my__foot { margin: 18px 0 0; font: 400 13px/1.5 var(--hu-text); color: var(--hu-mute); }
@keyframes hu-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.hu-total { margin: 26px 0 0; text-align: center; font: 500 14px/1.4 var(--hu-ui); color: var(--hu-mute); }
.hu-total b { color: var(--hu-ink); font-weight: 800; }

/* ------------------------------------------------------------------ раздел: шапка, фильтр этапов, темы-строки трекера */
.hu-fhead { position: relative; margin: 30px 0 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px 26px; align-items: start; padding: 30px 34px 26px; background: var(--hu-dots), var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 18px; box-shadow: var(--hu-shadow); }
.hu-fhead__ico { width: 66px; height: 66px; border-radius: 50%; background: var(--hu-coral); border: 2px solid var(--hu-ink); display: grid; place-items: center; color: var(--hu-ink); }
.hu-fhead__ico .hu-i .a { stroke: #fff; }
.hu-fhead__ico .hu-i .a.f { fill: #fff; }
.hu-fhead__d { margin: 0 0 8px; color: var(--hu-ink2); max-width: 62ch; }
.hu-fhead__n { margin: 0; font: 500 13.5px/1.3 var(--hu-ui); color: var(--hu-mute); }
.hu-fhead__n b { color: var(--hu-ink); font-weight: 800; }
.hu-fhead__side { display: grid; justify-items: end; gap: 16px; }
.hu-fhead__act .button { white-space: nowrap; }
.hu-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; }
.hu-filter:empty { display: none; }
.hu-chip { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; background: #fff; border: 2px solid var(--hu-ink); border-radius: 999px; font: 500 14px/1 var(--hu-ui); color: var(--hu-ink); cursor: pointer; transition: background .2s, transform .2s var(--hu-ease); }
.hu-chip:hover { transform: translateY(-1px); background: var(--hu-coral-t); }
.hu-chip b { font-weight: 800; min-width: 22px; height: 22px; display: inline-grid; place-items: center; border-radius: 999px; background: var(--hu-desk); font-size: 12px; padding: 0 5px; }
.hu-chip.is-on { background: var(--hu-ink); color: #fff; }
.hu-chip.is-on b { background: var(--hu-coral); color: var(--hu-ink); }
.hu-chip .hu-stage--dot::before { margin: 0; }

.hu-list { margin: 18px 0 0; padding: 22px 32px 14px; background: linear-gradient(90deg, transparent 112px, var(--hu-coral) 112px 114px, transparent 114px), var(--hu-dots), var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 18px; box-shadow: var(--hu-shadow); }
.hu-list__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 20px; margin: 0 0 8px 96px; }
.hu-sort { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 12px; font: 500 13px/1.4 var(--hu-ui); color: var(--hu-mute); }
.hu-sort a { color: var(--hu-ink2); border-bottom: 1.5px dashed var(--hu-line2); }
.hu-sort a:hover { color: var(--hu-ink); border-bottom-color: var(--hu-coral); }
.hu-list__cols { display: grid; grid-template-columns: 64px minmax(0, 1fr) 200px; gap: 0 32px; padding: 8px 0; border-bottom: 2px solid var(--hu-ink); font: 500 12px/1 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-mute); }
.hu-list__cols span:first-child { text-align: right; }
.hu-list__cols span:last-child { text-align: right; }
.hu-list__rows { list-style: none; margin: 0; padding: 0; }
.hu-row { display: grid; grid-template-columns: 64px minmax(0, 1fr) 200px; gap: 0 32px; align-items: center; padding: 14px 0; border-bottom: 1.5px dashed var(--hu-line2); position: relative; }
.hu-row[hidden] { display: none; }
.hu-row .hu-entry__date { align-self: start; }
.hu-row__st { margin: 0 0 5px; }
.hu-row__h { margin: 0 0 6px; font: 500 17px/1.32 var(--hu-ui); }
.hu-row__t { color: var(--hu-ink); }
.hu-row__t:hover { color: var(--hu-ink); background: linear-gradient(transparent 58%, var(--hu-coral-t2) 58% 92%, transparent 92%); }
.hu-row__meta { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font: 400 13.5px/1.3 var(--hu-text); color: var(--hu-mute); }
.hu-row__by a { color: var(--hu-ink); font-weight: 700; }
.hu-row__n { display: grid; justify-items: end; gap: 6px; color: var(--hu-ink); }
.hu-row__n:hover { color: var(--hu-ink); }
.hu-row__n:hover .hu-dot--0 { border-color: var(--hu-coral); }
.hu-row__nn { font: 500 13px/1 var(--hu-ui); color: var(--hu-mute); }
.hu-row__nn b { font: 800 18px/1 var(--hu-ui); color: var(--hu-ink); }
.hu-dots--row { grid-auto-columns: 12px; gap: 4px; }
.hu-dots--row .hu-dot { width: 12px; height: 12px; }
.hu-dots__more { font: 800 12px/1 var(--hu-ui); color: var(--hu-coral-d); }
.hu-row__mod { position: absolute; left: 0; top: 14px; }
.hu-sep { list-style: none; padding: 14px 0 6px 96px; font: 800 12.5px/1 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-mute); }
.hu-pages { font: 500 12.5px/1 var(--hu-ui); color: var(--hu-mute); margin-left: 6px; }
.hu-pages a { color: var(--hu-ink); border-bottom: 1.5px solid var(--hu-coral); margin: 0 2px; }
.hu-subs { margin: 18px 0 0; }
.hu-secs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.hu-sec { padding: 16px 18px; background: #fff; border: 2px solid var(--hu-ink); border-radius: 14px; }
.hu-sec__t { margin: 0 0 4px; font: 800 16px/1.25 var(--hu-ui); }
.hu-sec__t a { color: var(--hu-ink); }
.hu-sec__d, .hu-sec__lp, .hu-sec__n { margin: 0 0 4px; font-size: 13.5px; color: var(--hu-mute); }
.hu-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; margin: 16px 0; }
.hu-bar__r { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.hu-bar__r .hu-more { font-size: 13px; }
.hu-modtools { margin: 10px 0; }

/* ------------------------------------------------------------------ тема: страница-шапка и заметки-стикеры */
.hu-thead { position: relative; margin: 30px 0 0; padding: 34px 38px 26px; background: var(--hu-dots), var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 18px; box-shadow: var(--hu-shadow); }
.hu-thead__k { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0 0 12px; font: 500 13px/1.3 var(--hu-ui); color: var(--hu-mute); }
.hu-thead__k > span { text-transform: uppercase; letter-spacing: .06em; font-size: 12.5px; }
.hu-thead__k a { color: var(--hu-ink); border-bottom: 2px solid var(--hu-coral); }
.hu-thead__st { margin: 0 0 10px; }
.hu-thead__st .hu-stage { font-size: 14px; padding: 4px 12px 4px 8px; }
.hu-thead__st .hu-stage::before { width: 14px; height: 14px; }
.hu-thead__h1 { max-width: 30ch; font-size: clamp(28px, 3.2vw, 42px); }
.hu-thead__dl { display: grid; grid-template-columns: repeat(4, minmax(0, auto)); justify-content: start; gap: 12px 40px; margin: 20px 0 0; padding-top: 16px; border-top: 2px solid var(--hu-ink); }
.hu-thead__dl div { min-width: 0; }
.hu-thead__dl dt { font: 500 12px/1.2 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-mute); margin-bottom: 6px; }
.hu-thead__dl dd { margin: 0; font: 500 14.5px/1.3 var(--hu-ui); }
.hu-thead__dl dd b { font-weight: 800; }
.hu-by { display: flex; align-items: center; gap: 8px; }
.hu-by > span:last-child { display: grid; }
.hu-by > span:not(.hu-face) { color: var(--hu-ink); }
.hu-stack { display: flex; padding-left: 8px; }
.hu-stack .hu-face { margin-left: -8px; box-shadow: 0 0 0 2px #fff; }

.hu-notes { max-width: 980px; margin: 34px auto 0; display: flex; flex-direction: column; gap: 38px; }
.hu-note { position: relative; width: min(100%, 780px); padding: 28px 30px 16px; background: var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 6px; box-shadow: 5px 5px 0 var(--hu-ink); transition: transform .35s var(--hu-ease); }
.hu-tilt-0 { transform: rotate(-.6deg); }
.hu-tilt-1 { transform: rotate(.5deg); margin-left: auto; }
.hu-tilt-2 { transform: rotate(-.35deg); margin-left: 64px; max-width: calc(100% - 70px); }
.hu-tilt-3 { transform: rotate(.7deg); margin-left: 24px; max-width: calc(100% - 30px); }
.hu-note:hover { transform: rotate(0deg); }
.hu-note--op { background: var(--hu-coral-paper); }
.hu-note--page { width: 100%; margin: 0; transform: none; padding: 36px 40px 18px 58px; background: linear-gradient(90deg, transparent 30px, var(--hu-coral) 30px 32px, transparent 32px), var(--hu-dots), var(--hu-paper); border-radius: 14px; box-shadow: var(--hu-shadow); }
.hu-note--page:hover { transform: none; }
.hu-note__tape { top: -14px; left: 50%; width: 104px; height: 26px; transform: translateX(-50%) rotate(-3deg); }
.hu-tilt-1 .hu-note__tape { transform: translateX(-50%) rotate(4deg); }
.hu-note--page .hu-note__tape { left: 56px; transform: rotate(-4deg); }
.hu-note__head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 4px 14px; align-items: center; padding-bottom: 12px; margin-bottom: 14px; border-bottom: 1.5px dashed var(--hu-line2); }
.hu-note__head .hu-face--img { transform: rotate(-3deg); border-radius: 10px; box-shadow: 2px 2px 0 var(--hu-ink); }
.hu-note__id { min-width: 0; }
.hu-note__nick { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font: 800 16.5px/1.25 var(--hu-ui); }
.hu-note__nick a { color: var(--hu-ink); }
.hu-note__nick a:hover { color: var(--hu-coral-dd); }
.hu-op { font: 500 12px/1 var(--hu-ui); padding: 4px 8px; border-radius: 999px; background: var(--hu-coral); color: var(--hu-ink); }
.hu-note__rank { margin: 3px 0 0; }
.hu-note__line { margin: 6px 0 0; display: flex; flex-wrap: wrap; gap: 5px 8px; }
.hu-path { display: inline-flex; align-items: baseline; gap: 6px; padding: 3px 9px; border-radius: 8px; background: #fff; border: 1.5px solid var(--hu-line2); font: 500 12.5px/1.25 var(--hu-ui); color: var(--hu-ink); }
.hu-path i { font-style: normal; color: var(--hu-mute); }
.hu-path--hold { border-color: var(--hu-coral); }
.hu-note__when { align-self: start; font: 500 12.5px/1.3 var(--hu-ui); color: var(--hu-mute); white-space: nowrap; }
.hu-note__when:hover { color: var(--hu-ink); }
.hu-re { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 10px; padding: 4px 11px 4px 8px; border-radius: 999px; background: var(--hu-coral-t); font: 500 13px/1.2 var(--hu-ui); color: var(--hu-coral-dd); }
.hu-re:hover { background: var(--hu-coral-t2); color: var(--hu-ink); }
.hu-note__body { font: 400 16.5px/1.7 var(--hu-text); color: var(--hu-ink); overflow-wrap: anywhere; }
.hu-note--page .hu-note__body { font-size: 17.5px; }
.hu-note__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin-top: 14px; padding-top: 10px; border-top: 1.5px dashed var(--hu-line2); }
.hu-thanks { display: inline-flex; align-items: center; gap: 6px; font: 500 13px/1 var(--hu-ui); color: var(--hu-mute); }
.hu-thanks .hu-i { stroke: var(--hu-coral-d); }
.hu-thanks.is-on .hu-i { fill: var(--hu-coral); stroke: var(--hu-coral-d); }
.hu-thanks b { font-weight: 800; color: var(--hu-ink); }
.post_meta { font: 400 12.5px/1.4 var(--hu-ui); color: var(--hu-mute); }
.post_meta:empty { display: none; }
.hu-guest { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; max-width: 980px; margin: 30px auto 0; padding: 18px 22px; background: var(--hu-paper); border: 2px dashed var(--hu-ink); border-radius: 14px; }
.hu-guest p { margin: 0; flex: 1 1 280px; }
.hu-tfoot { max-width: 980px; margin: 30px auto 0; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 20px; }
.hu-tfoot__note { margin: 0; }
.hu-nextprev { display: flex; gap: 18px; font: 500 14px/1.3 var(--hu-ui); }
.hu-nextprev a { color: var(--hu-ink2); border-bottom: 1.5px dashed var(--hu-line2); }
.hu-nextprev a:hover { color: var(--hu-ink); border-bottom-color: var(--hu-coral); }
.hu-tools { max-width: 980px; margin: 18px auto 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; }
.thread_tools { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 16px; font: 500 13px/1.3 var(--hu-ui); }
.thread_tools li { list-style: none; }
.thread_tools a { color: var(--hu-mute); }
#quick_reply_form { max-width: 980px; margin: 30px auto 0; }

/* ------------------------------------------------------------------ профиль: страница участника в трекере */
.hu-prof { position: relative; margin: 30px 0 0; padding: 36px 40px 30px; background: var(--hu-dots), var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 18px; box-shadow: var(--hu-shadow); }
.hu-prof__head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 20px 36px; align-items: start; }
.hu-prof__photo { position: relative; padding: 10px 10px 30px; background: #fff; border: 2px solid var(--hu-ink); border-radius: 4px; transform: rotate(-2.5deg); box-shadow: 4px 4px 0 var(--hu-ink); margin-top: 10px; }
.hu-prof__photo .hu-face--mono { background: var(--hu-coral); }
.hu-washi--a { top: -12px; left: -22px; width: 84px; transform: rotate(-38deg); }
.hu-washi--b { top: -12px; right: -22px; width: 84px; transform: rotate(36deg); }
.hu-prof__name { font-size: clamp(30px, 3.6vw, 46px); overflow-wrap: anywhere; }
.hu-prof__rank { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; }
.hu-prof__rank span { display: grid; }
.hu-prof__rank b { font: 800 17px/1.2 var(--hu-ui); }
.hu-prof__rank small { font: 500 12.5px/1.3 var(--hu-ui); color: var(--hu-mute); }
.hu-prof__path { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; max-width: 560px; }
.hu-prof__path div { padding: 10px 14px; border: 2px solid var(--hu-ink); border-radius: 12px; background: #fff; }
.hu-prof__path div:last-child { background: var(--hu-coral-paper); border-color: var(--hu-coral-d); }
.hu-prof__path dt { font: 500 12px/1.2 var(--hu-ui); text-transform: uppercase; letter-spacing: .06em; color: var(--hu-mute); }
.hu-prof__path dd { margin: 4px 0 0; font: 800 16px/1.3 var(--hu-ui); }
.hu-prof__nums { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hu-prof__nums li { display: grid; justify-items: center; min-width: 108px; padding: 10px 12px; border: 2px solid var(--hu-ink); border-radius: 50%; aspect-ratio: 1; align-content: center; background: #fff; }
.hu-prof__nums li.is-coral { background: var(--hu-coral); }
.hu-prof__nums b { font: 800 26px/1 var(--hu-ui); }
.hu-prof__nums span { font: 500 12.5px/1.2 var(--hu-ui); color: var(--hu-ink2); }
.hu-prof__nums li.is-coral span { color: var(--hu-ink); }
.hu-prof__year { position: relative; margin: 30px 0 0; padding: 18px 0 0; border-top: 2px solid var(--hu-ink); }
.hu-prof__yr { display: grid; gap: 6px; justify-content: start; }
.hu-prof__yr .hu-trk__ml { grid-auto-columns: 26px; gap: 10px; }
.hu-dots--big { grid-auto-columns: 26px; gap: 10px; }
.hu-dots--big .hu-dot { width: 26px; height: 26px; border-width: 2.5px; }
.hu-prof__yrnote { position: absolute; right: 0; top: 26px; margin: 0; transform: rotate(-4deg); }
.hu-prof__grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 30px 40px; margin-top: 30px; }
.hu-plist__list { list-style: none; margin: 10px 0 0; padding: 0; }
.hu-plist__i { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 0 24px; padding: 12px 0; border-bottom: 1.5px dashed var(--hu-line2); }
.hu-plist__k { margin: 0 0 5px; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; font: 500 13px/1.3 var(--hu-ui); color: var(--hu-mute); }
.hu-plist__t { font: 500 16.5px/1.3 var(--hu-ui); color: var(--hu-ink); }
.hu-plist__t:hover { color: var(--hu-ink); background: linear-gradient(transparent 58%, var(--hu-coral-t2) 58% 92%, transparent 92%); }
.hu-plist__m { margin: 4px 0 0; font-size: 13px; color: var(--hu-mute); }
.hu-plist__links, .hu-prof__links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 14px 0 0; }
.hu-prof__links a { font: 500 13px/1.3 var(--hu-ui); color: var(--hu-mute); }
.hu-ladder { padding: 18px 20px; border: 2px solid var(--hu-ink); border-radius: 14px; background: #fff; }
.hu-ladder__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.hu-ladder__list li { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: center; font: 500 14px/1.25 var(--hu-ui); color: var(--hu-mute); }
.hu-ladder__list li.is-past, .hu-ladder__list li.is-now { color: var(--hu-ink); }
.hu-ladder__list li.is-now .hu-ladder__t { font-weight: 800; background: linear-gradient(transparent 38%, var(--hu-hl) 38% 96%, transparent 96%); justify-self: start; padding: 0 3px; margin-left: -3px; }
.hu-ladder__n { font-size: 12.5px; color: var(--hu-mute); }
.hu-prof__dl { margin: 16px 0 0; display: grid; gap: 8px; }
.hu-prof__dl div { display: flex; justify-content: space-between; gap: 10px; border-bottom: 1.5px dashed var(--hu-line2); padding-bottom: 6px; }
.hu-prof__dl dt { font: 500 13px/1.3 var(--hu-ui); color: var(--hu-mute); }
.hu-prof__dl dd { margin: 0; font: 500 14px/1.3 var(--hu-ui); text-align: right; }
.hu-prof__extra { margin-top: 20px; }

/* ------------------------------------------------------------------ сообщения об ошибках и переходах */
.hu-msg { position: relative; max-width: 760px; margin: 40px auto 0; padding: 34px 36px 26px; background: var(--hu-dots), var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 18px; box-shadow: var(--hu-shadow); }
.hu-msg--go { margin: 80px auto; }
.hu-msg__k { margin: 0 0 6px; }
.hu-msg__check { margin: 0 0 8px; width: 52px; height: 52px; border-radius: 50%; background: var(--hu-coral); border: 2px solid var(--hu-ink); display: grid; place-items: center; }
.hu-msg__body { font-size: 16.5px; }
.hu-msg__body ol, .hu-msg__body ul { padding-left: 1.3em; }

/* ------------------------------------------------------------------ подвал */
.hu-foot { margin-top: 60px; background: var(--hu-paper); border-top: 2px solid var(--hu-ink); padding-bottom: 110px; }
.hu-foot__in { max-width: 1240px; margin: 0 auto; padding: 26px 24px 20px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 14px 40px; }
.hu-foot__brand { margin: 0; font-size: 15px; color: var(--hu-ink2); }
.hu-foot__links { display: flex; flex-wrap: wrap; gap: 6px 18px; align-content: start; font: 500 13.5px/1.5 var(--hu-ui); }
.hu-foot__links a { color: var(--hu-ink); border-bottom: 2px solid var(--hu-coral-t2); }
.hu-foot__links a:hover { border-bottom-color: var(--hu-coral); color: var(--hu-ink); }
.hu-foot__med { grid-column: 1 / -1; margin: 0; padding-top: 14px; border-top: 1.5px dashed var(--hu-line2); font: 400 13.5px/1.55 var(--hu-text); color: var(--hu-ink2); }
.hu-foot__med mark { font: 800 15px/1.4 var(--hu-ui); color: var(--hu-ink); background: linear-gradient(transparent 36%, var(--hu-hl) 36% 96%, transparent 96%); padding: 0 3px; }

/* ------------------------------------------------------------------ нижний док как у приложения-трекера */
.hu-dock { position: fixed; z-index: 60; left: 50%; bottom: 18px; transform: translateX(-50%); display: flex; gap: 4px; padding: 7px; background: var(--hu-ink); border-radius: 24px; box-shadow: 0 14px 30px -12px rgba(37, 39, 45, .55), 0 0 0 2px #fff; }
.hu-dock__i { position: relative; display: grid; justify-items: center; gap: 3px; min-width: 76px; padding: 8px 12px 7px; border-radius: 17px; color: #fff; font: 500 12.5px/1 var(--hu-ui); transition: background .2s, color .2s; }
.hu-dock__i:hover { color: #fff; background: rgba(255, 255, 255, .1); }
.hu-dock__i[aria-current="page"], .hu-dock__i[aria-expanded="true"] { background: var(--hu-coral); color: var(--hu-ink); }
.hu-dock__i[aria-current="page"] .hu-i .a, .hu-dock__i[aria-expanded="true"] .hu-i .a { stroke: var(--hu-ink); }
.hu-dock__i[aria-current="page"] .hu-i .a.f, .hu-dock__i[aria-expanded="true"] .hu-i .a.f { fill: var(--hu-ink); }
.hu-dock__i .hu-face--xs { width: 22px; height: 22px; border-color: #fff; }
.hu-dock__i:focus-visible { outline-color: #fff; }
.hu-scrim { position: fixed; inset: 0; z-index: 55; background: rgba(37, 39, 45, .42); }
.hu-sheet { position: fixed; z-index: 58; left: 50%; bottom: 96px; width: min(560px, calc(100% - 24px)); max-height: min(70vh, 640px); overflow: auto; overscroll-behavior: contain; transform: translateX(-50%); background: var(--hu-dots), var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 22px; box-shadow: var(--hu-shadow); padding: 0 22px 18px; animation: hu-sheet .3s var(--hu-ease); }
@keyframes hu-sheet { from { opacity: 0; transform: translate(-50%, 18px); } to { opacity: 1; transform: translate(-50%, 0); } }
.hu-sheet__head { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 18px 0 10px; margin-bottom: 6px; background: var(--hu-paper); border-bottom: 2px solid var(--hu-ink); }
.hu-sheet__head .hu-h3 { margin: 0; }
.hu-sheet__x { width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--hu-ink); background: #fff; font: 500 22px/1 var(--hu-ui); color: var(--hu-ink); cursor: pointer; display: grid; place-items: center; }
.hu-sheet__x:hover { background: var(--hu-coral); }
.hu-sheet__grp { padding: 10px 0 4px; }
.hu-sheet__grp h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font: 800 12.5px/1.2 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-ink); }
.hu-sheet__grp ul { list-style: none; margin: 0; padding: 0; }
.hu-sheet__grp a { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 6px; border-bottom: 1.5px dashed var(--hu-line2); color: var(--hu-ink); font: 500 15px/1.3 var(--hu-ui); }
.hu-sheet__grp a:hover, .hu-sheet__grp a[aria-current] { background: var(--hu-coral-t); color: var(--hu-ink); }
.hu-sheet__grp b { font: 800 13px/1 var(--hu-ui); color: var(--hu-mute); }
.hu-fresh { list-style: none; margin: 0; padding: 0; }
.hu-fresh a { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 2px 10px; padding: 10px 4px; border-bottom: 1.5px dashed var(--hu-line2); color: var(--hu-ink); }
.hu-fresh a:hover { background: var(--hu-coral-t); color: var(--hu-ink); }
.hu-fresh .hu-face { grid-row: span 2; }
.hu-fresh__t { font: 500 15px/1.3 var(--hu-ui); }
.hu-fresh__m { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font: 500 12.5px/1.3 var(--hu-ui); color: var(--hu-mute); }
.hu-sheet__more { margin: 12px 0 0; }
.hu-sheet__more a { font: 500 14px/1.3 var(--hu-ui); color: var(--hu-ink); border-bottom: 2px solid var(--hu-coral); }
.hu-find__l { display: block; margin: 6px 0 6px; font: 500 12.5px/1 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-mute); }
.hu-find__row { display: flex; gap: 8px; }
.hu-find__row input { flex: 1; min-width: 0; }
.hu-find__tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 12px 0 0; font: 500 13px/1 var(--hu-ui); color: var(--hu-mute); }
.hu-find__tags button { font: 500 13px/1 var(--hu-ui); color: var(--hu-ink); background: #fff; border: 1.5px solid var(--hu-ink); border-radius: 999px; padding: 6px 10px; cursor: pointer; }
.hu-find__tags button:hover { background: var(--hu-coral); }

/* ------------------------------------------------------------------ вход и меню участника */
.hu-login__p { font-size: 14px; color: var(--hu-mute); margin: 6px 0 12px; }
.hu-field { margin: 0 0 12px; display: grid; gap: 5px; }
.hu-field label { font: 500 12.5px/1 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-mute); }
.hu-field--row { display: flex; justify-content: space-between; align-items: center; gap: 10px; font: 500 13px/1.3 var(--hu-ui); }
.hu-field--row label { text-transform: none; letter-spacing: 0; font: 500 13.5px/1.2 var(--hu-ui); color: var(--hu-ink2); }
.hu-field--row a { color: var(--hu-ink); border-bottom: 1.5px dashed var(--hu-line2); }
.hu-field input.textbox { width: 100%; }
.hu-field .button { width: 100%; }
.hu-mine__who { display: flex; align-items: center; gap: 10px; margin: 8px 0 12px; }
.hu-mine__who span { display: grid; }
.hu-mine__who a { font: 500 13px/1.3 var(--hu-ui); color: var(--hu-ink2); }
.hu-mine__links { list-style: none; margin: 0; padding: 0; display: grid; }
.hu-mine__links a { display: block; padding: 9px 8px; border-bottom: 1.5px dashed var(--hu-line2); color: var(--hu-ink); font: 500 15px/1.3 var(--hu-ui); }
.hu-mine__links a:hover { background: var(--hu-coral-t); color: var(--hu-ink); }
.hu-pm[data-n="0"] { display: none; }
.hu-pm { background: var(--hu-coral); color: var(--hu-ink); border-radius: 999px; padding: 1px 7px; font: 800 12px/1.4 var(--hu-ui); }

/* ------------------------------------------------------------------ стандартные элементы MyBB в айдентике трекера */
.hu-main > table.tborder, .hu-main > form, .hu-main > .tborder, .hu-main > br + table { margin-top: 26px; }
.tborder { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 14px; margin: 0 0 18px; color: var(--hu-ink); overflow: hidden; }
.tborder td, .tborder th { padding: 10px 14px; border-bottom: 1.5px dashed var(--hu-line2); vertical-align: top; text-align: left; }
.tborder tr:last-child td { border-bottom: 0; }
.thead { background: var(--hu-paper); border-bottom: 2px solid var(--hu-ink) !important; color: var(--hu-ink); font: 800 18px/1.3 var(--hu-ui); }
.thead a, .thead strong { color: var(--hu-ink); }
.thead .expcolimage { float: right; }
.tcat { background: var(--hu-desk); font: 500 12.5px/1.3 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-ink2); }
.tcat a { color: var(--hu-ink); }
.trow1, .trow2 { background: transparent; }
.trow2 { background: rgba(37, 39, 45, .025); }
.trow_shaded { background: var(--hu-coral-t); }
.trow_selected td, .trow_selected { background: var(--hu-coral-t); }
.trow_sep { background: var(--hu-desk); font: 800 13px/1.3 var(--hu-ui); }
.tfoot { background: var(--hu-desk); }
.tborder a, .trow1 a, .trow2 a, .tfoot a { color: var(--hu-coral-d); }
.smalltext { font: 400 13px/1.45 var(--hu-text); color: var(--hu-mute); }
.largetext { font: 800 20px/1.3 var(--hu-ui); }
.float_left { float: left; } .float_right { float: right; } .clear { clear: both; }
.expcolimage img { width: 16px; }
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(--hu-text); color: var(--hu-ink); background: #fff; border: 2px solid var(--hu-ink); border-radius: 12px; padding: 9px 12px; max-width: 100%; }
textarea { width: 100%; min-height: 170px; line-height: 1.6; background: var(--hu-dots), #fff; }
input.textbox:focus, textarea:focus, select:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="search"]:focus { outline: none; box-shadow: 0 0 0 4px var(--hu-coral-t2); }
::placeholder { color: #767a82; }
.button, input.button, button.button, a.button, input[type="submit"], input[type="button"], button[type="submit"] {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px; font: 800 14.5px/1 var(--hu-ui); color: var(--hu-ink); background: var(--hu-coral); border: 2px solid var(--hu-ink); border-radius: 999px; padding: 11px 20px; cursor: pointer; text-decoration: none; box-shadow: 0 3px 0 var(--hu-ink); transition: transform .15s var(--hu-ease), box-shadow .15s; }
.button:hover, input.button:hover, input[type="submit"]:hover, button[type="submit"]:hover, a.button:hover { color: var(--hu-ink); transform: translateY(-1px); box-shadow: 0 4px 0 var(--hu-ink); }
.button:active, input[type="submit"]:active, button[type="submit"]:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--hu-ink); }
.button span { background: none !important; padding: 0 !important; }
.closed_button { background: var(--hu-desk); color: var(--hu-mute); box-shadow: none; }
.pagination { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font: 500 13.5px/1 var(--hu-ui); }
.pagination .pages { color: var(--hu-mute); margin-right: 6px; }
.pagination a, .pagination .pagination_current { display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding: 0 8px; border: 2px solid var(--hu-ink); border-radius: 999px; color: var(--hu-ink); background: #fff; }
.pagination a:hover { background: var(--hu-coral-t); color: var(--hu-ink); }
.pagination .pagination_current { background: var(--hu-coral); font-weight: 800; }
.pagination_breadcrumb_link { display: none; }
.postbit_buttons { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.postbit_buttons > a, .postbit_buttons a { display: inline-flex; align-items: center; padding: 3px 0; font: 500 13px/1.2 var(--hu-ui); color: var(--hu-mute); border-bottom: 1.5px dashed transparent; }
.postbit_buttons a:hover { color: var(--hu-ink); border-bottom-color: var(--hu-coral); }
.postbit_buttons a span { background: none !important; padding: 0 !important; }
.popup_menu { background: var(--hu-paper); border: 2px solid var(--hu-ink); border-radius: 12px; padding: 6px; box-shadow: 4px 4px 0 var(--hu-ink); z-index: 50; }
.popup_menu .popup_item_container { list-style: none; }
.popup_menu .popup_item { display: block; padding: 7px 10px; color: var(--hu-ink); font: 500 14px/1.3 var(--hu-ui); border-radius: 8px; }
.popup_menu .popup_item:hover { background: var(--hu-coral-t); color: var(--hu-ink); }
.blocker { background: rgba(37, 39, 45, .5) !important; }
.modal { background: var(--hu-paper) !important; color: var(--hu-ink); border: 2px solid var(--hu-ink); border-radius: 18px !important; box-shadow: var(--hu-shadow) !important; padding: 20px !important; max-width: calc(100vw - 24px); }
.modal .tborder { margin: 0; }
.modal a.close-modal { top: -10px !important; right: -10px !important; }
.error, div.error, .error_message { background: var(--hu-coral-paper); border: 2px solid var(--hu-coral-d); border-radius: 14px; padding: 14px 18px; color: var(--hu-ink); margin-bottom: 14px; }
.error ul { margin: 6px 0 0; padding-left: 1.2em; }
.red_alert, .pm_alert { background: var(--hu-coral-paper); border: 2px solid var(--hu-ink); border-radius: 14px; padding: 12px 16px; margin: 16px 0; }
.success_message { color: var(--hu-ink); font-weight: 700; }
fieldset { border: 2px solid var(--hu-line2); border-radius: 14px; padding: 12px 16px; margin: 0 0 14px; }
legend { font: 800 12.5px/1 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-ink); padding: 0 6px; }
.usercp_nav_item, .modcp_nav_item { display: block; padding: 7px 4px 7px 26px; color: var(--hu-ink); background-position: 2px center !important; }
.usercp_nav_item:hover, .modcp_nav_item:hover { color: var(--hu-coral-dd); }
#usercp_menu, .usercp_nav { font: 500 14px/1.3 var(--hu-ui); }
.sceditor-container { border-radius: 12px; overflow: hidden; max-width: 100%; border: 2px solid var(--hu-ink) !important; }
.ignored_post, .deleted_post_hidden { padding: 12px 16px; border: 2px dashed var(--hu-line2); border-radius: 12px; color: var(--hu-mute); margin-bottom: 12px; max-width: 780px; }
.scaleimages img { max-width: 100%; height: auto; }
.forum_status, .thread_status { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--hu-coral); vertical-align: middle; }
.forum_off, .thread_status.folder { border-color: var(--hu-line2); }
.subject_new { font-weight: 700; }
.subject_old { font-weight: 500; }
.author { color: var(--hu-mute); }
.select2-container { max-width: 100%; }
/* BB-коды */
blockquote.mycode_quote { margin: 10px 0 14px; padding: 12px 16px; border: 0; border-left: 4px solid var(--hu-coral); border-radius: 0 12px 12px 0; background: var(--hu-desk); color: var(--hu-ink2); font-size: 15.5px; }
blockquote.mycode_quote cite { display: block; font: 500 14px/1.2 var(--hu-hand); font-style: normal; color: var(--hu-coral-d); margin-bottom: 4px; }
blockquote.mycode_quote cite > span { color: var(--hu-mute); margin-left: 6px; font: 500 12px/1 var(--hu-ui); }
.codeblock { margin: 12px 0; background: var(--hu-desk); border: 2px solid var(--hu-ink); border-radius: 12px; }
.codeblock .title { font: 800 12px/1 var(--hu-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--hu-mute); padding: 8px 12px; border-bottom: 1.5px dashed var(--hu-line2); }
.codeblock code { display: block; padding: 12px; overflow-x: auto; font: 13.5px/1.5 ui-monospace, Menlo, monospace; color: var(--hu-ink); }
.mycode_list, ul.mycode_list, ol.mycode_list { padding-left: 1.3em; }
.post_body hr, .mycode_hr { border: 0; height: 6px; margin: 16px 0; background: radial-gradient(circle, var(--hu-coral) 2.2px, transparent 2.6px) 0 0 / 14px 6px repeat-x; }
.signature { margin-top: 12px; padding-top: 8px; border-top: 1.5px dashed var(--hu-line2); font-size: 14.5px; color: var(--hu-mute); }
.video_embed iframe, .post_body iframe { max-width: 100%; }
.post_body .mycode_s { text-decoration-color: var(--hu-coral-d); text-decoration-thickness: 2px; }
.post_body .mycode_u { text-decoration-color: var(--hu-coral); text-decoration-thickness: 2px; text-underline-offset: 3px; }
#posts .post_body img.smilie { vertical-align: middle; }

/* ------------------------------------------------------------------ планшет */
@media (max-width: 1260px) {
	.hu-hrow { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1100px) {
	.hu-my__pick { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.hu-hrow { grid-template-columns: minmax(0, 1fr); }
	.hu-weeks { grid-template-columns: repeat(2, max-content); }
	.hu-prof__head { grid-template-columns: auto minmax(0, 1fr); }
	.hu-prof__nums { grid-column: 1 / -1; grid-auto-flow: column; justify-content: start; }
	.hu-prof__nums li { border-radius: 999px; aspect-ratio: auto; grid-auto-flow: column; gap: 8px; align-items: baseline; padding: 8px 16px; min-width: 0; }
}
@media (max-width: 960px) {
	.hu-spread { grid-template-columns: minmax(0, 1fr); border-radius: 12px; }
	.hu-spread::before, .hu-spread::after { display: none; }
	.hu-leaf--l { padding-right: 40px; border-bottom: 2px solid var(--hu-ink); }
	.hu-leaf--r { padding-left: 40px; background: linear-gradient(90deg, transparent 114px, var(--hu-coral) 114px 116px, transparent 116px), var(--hu-dots); }
	.hu-entries__head, .hu-entries__more, .hu-entries__none { margin-left: 98px; }
	.hu-my__head { grid-template-columns: minmax(0, 1fr); }
	.hu-fhead { grid-template-columns: auto minmax(0, 1fr); }
	.hu-fhead__side { grid-column: 1 / -1; justify-items: start; grid-template-columns: auto auto; align-items: center; justify-content: space-between; }
	.hu-thead__dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hu-prof__grid { grid-template-columns: minmax(0, 1fr); }
	.hu-tilt-2 { margin-left: 30px; max-width: calc(100% - 36px); }
	.hu-tilt-3 { margin-left: 12px; max-width: calc(100% - 18px); }
	.hu-tilt-0, .hu-tilt-1 { max-width: calc(100% - 6px); }
}

/* ------------------------------------------------------------------ телефон: ровная лента, док во всю ширину */
@media (max-width: 760px) {
	body { font-size: 15.5px; }
	.hu-main { padding: 0 16px 30px; }
	.hu-top__in { padding: 8px 16px; gap: 6px 16px; }
	.hu-logo__mark { width: 38px; height: 38px; }
	.hu-logo__name { font-size: 18px; }
	.hu-crumbs { width: 100%; font-size: 12.5px; }
	.hu-crumbs .active { max-width: 100%; }
	.hu-diary { margin-top: 18px; }
	.hu-tabs { gap: 4px; margin: 0 -16px; padding: 0 16px; scroll-padding: 0 16px; }
	.hu-tab { padding: 9px 12px 14px; font-size: 13.5px; }
	.hu-spread, .hu-my, .hu-fhead, .hu-list, .hu-thead, .hu-prof, .hu-msg { box-shadow: 4px 4px 0 var(--hu-ink); }
	.hu-leaf { padding: 24px 18px 22px; }
	.hu-leaf--l { padding-right: 18px; }
	.hu-leaf--r { padding-left: 18px; background: linear-gradient(90deg, transparent 72px, var(--hu-coral) 72px 74px, transparent 74px), var(--hu-dots); }
	.hu-title__note { position: static; transform: rotate(-2deg); text-align: left; margin: 10px 0 0; }
	.hu-title__note br { display: none; }
	.hu-title__tape { width: 200px; }
	.hu-trk__months { grid-template-columns: minmax(0, 1fr); }
	.hu-trk__months > span:first-child, .hu-trk__months > span:last-child { display: none; }
	.hu-trk__row { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; }
	.hu-trk__name { grid-column: 1 / -1; }
	.hu-trk__name small { white-space: normal; }
	.hu-trk__dots, .hu-trk__ml { grid-auto-columns: 14px; gap: 5px; }
	.hu-trk__n { grid-auto-flow: column; align-items: baseline; gap: 4px; }
	.hu-entries__head, .hu-entries__more, .hu-entries__none { margin-left: 0; }
	.hu-entries__head { padding-left: 72px; }
	.hu-entry { grid-template-columns: 44px minmax(0, 1fr); gap: 0 22px; }
	.hu-entry__date b { font-size: 22px; }
	.hu-entry__date { font-size: 12px; }
	.hu-entry__k { padding-right: 0; }
	.hu-note-m { position: static; justify-self: start; grid-column: 2; grid-row: 2; margin-top: 8px; transform: rotate(-3deg); font-size: 13.5px; }
	.hu-my { padding: 26px 16px 20px; }
	.hu-my__pick { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
	.hu-habit { min-height: 0; padding: 12px 12px 10px; }
	.hu-weeks { grid-template-columns: max-content; gap: 8px; }
	.hu-wk { grid-template-columns: auto; }
	.hu-fhead { grid-template-columns: minmax(0, 1fr); padding: 24px 18px 20px; }
	.hu-fhead__ico { width: 52px; height: 52px; }
	.hu-fhead__side { grid-template-columns: minmax(0, 1fr); justify-items: start; }
	.hu-list { padding: 16px 16px 8px; background: linear-gradient(90deg, transparent 62px, var(--hu-coral) 62px 64px, transparent 64px), var(--hu-dots), var(--hu-paper); }
	.hu-list__head { margin-left: 0; }
	.hu-list__cols { display: none; }
	.hu-row { grid-template-columns: 34px minmax(0, 1fr); gap: 0 24px; }
	.hu-row .hu-entry__date b { font-size: 20px; }
	.hu-row__n { grid-column: 2; justify-items: start; grid-auto-flow: column; align-items: center; gap: 10px; margin-top: 8px; }
	.hu-sep { padding-left: 58px; }
	.hu-thead { padding: 26px 18px 20px; }
	.hu-thead__h1 { font-size: 25px; }
	.hu-thead__dl { gap: 12px 20px; }
	.hu-notes { gap: 22px; margin-top: 24px; }
	.hu-note, .hu-tilt-0, .hu-tilt-1, .hu-tilt-2, .hu-tilt-3 { transform: none; margin-left: 0; width: 100%; max-width: none; box-shadow: 3px 3px 0 var(--hu-ink); }
	.hu-note { padding: 22px 16px 12px; }
	.hu-note--page { padding: 26px 16px 14px 30px; background: linear-gradient(90deg, transparent 14px, var(--hu-coral) 14px 16px, transparent 16px), var(--hu-dots), var(--hu-paper); }
	.hu-note.hu-note--page .hu-note__tape { left: 34px; transform: rotate(-4deg); }
	.hu-thead__dl div:first-child { grid-column: 1 / -1; }
	.hu-note__head { align-items: start; }
	.hu-note__head .hu-face--l { width: 54px; height: 54px; font-size: 19px; }
	.hu-tilt-1 .hu-note__tape, .hu-note__tape { transform: translateX(-50%) rotate(-2deg); }
	.hu-note__head { grid-template-columns: auto minmax(0, 1fr); }
	.hu-note__when { grid-column: 1 / -1; grid-row: 2; }
	.hu-note__body, .hu-note--page .hu-note__body { font-size: 16px; }
	.hu-prof { padding: 26px 18px 22px; }
	.hu-prof__head { grid-template-columns: minmax(0, 1fr); }
	.hu-prof__photo { justify-self: start; }
	.hu-face--xl { width: 150px; height: 150px; }
	.hu-prof__path { grid-template-columns: minmax(0, 1fr); }
	.hu-prof__nums { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.hu-prof__nums li { padding: 8px; display: grid; justify-items: center; }
	.hu-prof__nums b { font-size: 21px; }
	.hu-prof__yr .hu-trk__ml, .hu-dots--big { grid-auto-columns: 20px; gap: 6px; }
	.hu-dots--big .hu-dot { width: 20px; height: 20px; }
	.hu-prof__yrnote { position: static; margin-top: 8px; }
	.hu-plist__i { grid-template-columns: 40px minmax(0, 1fr); gap: 0 16px; }
	.hu-foot__in { grid-template-columns: minmax(0, 1fr); padding: 22px 16px 16px; }
	.hu-foot { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
	.hu-dock { left: 0; right: 0; bottom: 0; transform: none; border-radius: 20px 20px 0 0; justify-content: space-around; gap: 0; padding: 6px 6px calc(6px + env(safe-area-inset-bottom)); box-shadow: 0 -8px 24px -12px rgba(37, 39, 45, .5); }
	.hu-dock__i { min-width: 0; flex: 1; padding: 8px 2px 6px; font-size: 12px; }
	.hu-sheet { left: 0; right: 0; bottom: calc(66px + env(safe-area-inset-bottom)); width: auto; transform: none; border-radius: 20px 20px 0 0; max-height: 72vh; padding: 0 16px 16px; box-shadow: none; border-bottom: 0; }
	@keyframes hu-sheet { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
	.tborder td, .tborder th { padding: 8px 10px; }
	.hu-main > table.tborder, .hu-main table.tborder { display: block; overflow-x: auto; }
}
@media (max-width: 400px) {
	.hu-trk__dots, .hu-trk__ml { grid-auto-columns: 13px; gap: 4px; }
	.hu-trk__dots .hu-dot { width: 13px; height: 13px; }
	.hu-tab span { font-size: 13px; }
}

/* ------------------------------------------------------------------ без анимаций по просьбе системы */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
	.hu-note:hover { transform: inherit; }
}

/* ------------------------------------------------------------------ ссылки в сообщениях: свой стиль форума («washi-полоска») */
:is(.post_body, .signature, [class*="-post__body"]) a.mycode_url {
	color: var(--hu-ink); font-weight: 600; text-decoration: none; padding: 0 5px; margin: 0 -1px;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 12' preserveAspectRatio='none'%3E%3Cpath d='M0 0H5V12H0L2.4 10 0 8 2.4 6 0 4 2.4 2Z' fill='%23ff6464' fill-opacity='.5'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 12' preserveAspectRatio='none'%3E%3Cpath d='M5 0H0V12H5L2.6 10 5 8 2.6 6 5 4 2.6 2Z' fill='%23ff6464' fill-opacity='.5'/%3E%3C/svg%3E"),
		repeating-linear-gradient(-55deg, rgba(255, 100, 100, .56) 0 4px, rgba(255, 100, 100, .36) 4px 8px);
	background-repeat: no-repeat;
	background-size: 5px 52%, 5px 52%, calc(100% - 10px) 52%;
	background-position: 0 92%, 100% 92%, 5px 92%;
	-webkit-box-decoration-break: clone; box-decoration-break: clone;
	transition: background-size .25s var(--hu-ease), color .2s;
}
:is(.post_body, .signature, [class*="-post__body"]) a.mycode_url:hover {
	color: var(--hu-ink);
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 12' preserveAspectRatio='none'%3E%3Cpath d='M0 0H5V12H0L2.4 10 0 8 2.4 6 0 4 2.4 2Z' fill='%23ff6464' fill-opacity='.78'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 12' preserveAspectRatio='none'%3E%3Cpath d='M5 0H0V12H5L2.6 10 5 8 2.6 6 5 4 2.6 2Z' fill='%23ff6464' fill-opacity='.78'/%3E%3C/svg%3E"),
		repeating-linear-gradient(-55deg, rgba(255, 100, 100, .82) 0 3px, rgba(255, 100, 100, .6) 3px 6px);
	background-size: 5px 66%, 5px 66%, calc(100% - 10px) 66%;
}
