/* =========== © 2026 Centroarts - https://m1r.ru =========== */

@font-face {
	font-display: swap; 
	font-family: 'Onest';
	font-style: normal;
	font-weight: normal;
	src: url('../fonts/onest-400.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'Onest';
	font-style: normal;
	font-weight: bold;
	src: url('../fonts/onest-700.woff2') format('woff2');
}

:root, [data-theme="light"] {
  color-scheme: light;
  
	--fmono: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	--f: Onest, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", sans-serif; 
	--f-serif: "Lora", Georgia, Cambria, "Times New Roman", Times, serif;
  --fs: 16px;
	--lh: 1.5;
	--fw: normal;

  --fs-1: 14px;
  --fs-2: 13px;
  --fs-3: 12px;
  --fs-4: 11px;

  --headbar-h: 68px;

  --fs-heading: 28px;
  --lh-heading: 1.25;
  --mb-heading: 12px;

  --fs-heading-second: 24px;
  --lh-heading-second: 1.25;

  --fs-heading-sect: 20px;
  --lh-heading-sect: 28px;
  --mb-heading-sect: 16px;

  --fs-heading-tile: 20px;
  --lh-heading-tile: 28px;
  --mb-heading-tile: 16px;

  --fs-title-post: 20px;
  --lh-title-post: 28px;

  --fs-title-post-grid: 18px;
  --lh-title-post-grid: 24px;

  --fs-herotext: inherit;

  --wrp-p: 20px;
  --wrp-p-inv: -20px;

  --sidebar-lw: 228px;
  --sidebar-rw: 228px;
  --sidebar-gap: 0px;

  --sect-vpad: 28px;
  --g-sect: 28px;

  --rd-big: 28px;
  --rd-box: 18px;
  --rd-card: 6px;

  --scroll-top-space: 72px;

  --p: 13;
  --s: 263;
  --t: 228;
  --b: 228;

  --c-body: var(--b), 8%, 98%;
  --c-body-tone: hsl(var(--b), 8%, 94%);
  --c-body-tone-t: hsla(var(--b), 8%, 94%, 0);
  --c-body-light: var(--c-body);
  --c-body-widget: var(--c-body);

  --bh-bg: hsla(var(--c-primary),0.1);

  --c-dark: var(--t), 7%, 15%;
  --c-white: var(--t), 0%, 100%;
  --c-text: var(--t), 7%, 15%;

  --c-text-white: var(--t), 0%, 100%;
  --c-text-mute: hsla(var(--c-text),.7);
  --c-white: var(--b), 0%, 100%;

  --c-border: hsla(var(--c-text),.12);
  --c-border-h: hsla(var(--c-text),.2);
  --c-border-fade: linear-gradient(180deg, hsla(var(--c-text),.12) 0%, hsla(var(--c-text),0) 100%);

  --c-primary: var(--p), 82%, 54%;
  --c-second: var(--s), 78%, 56%;
  --c-yellow: 43, 100%, 61%;
  --c-red: 10, 81%, 49%;
  --c-green: 111, 73%, 35%;

  --c-alert: hsla(43, 100%, 61%, 0.2);

  --c-vk: 212, 100%, 50%;
  --c-tg: 201, 85%, 55%;
  --c-ya: 9, 97%, 55%;
  --c-ok: 25, 93%, 55%;
  --c-ml: 217, 99%, 49%;
  --c-wa: 127, 62%, 57%;
  --c-mx: 265, 67%, 58%;

  --c-bsocial: hsl(var(--s), 41%, 86%);
  --c-bsocial-img: hsl(var(--s), 44%, 76%);
  --c-bsocial-text: hsl(var(--c-text));

  --com-bg-st: hsl(var(--p), 8%, 93%);
	--com-name-c-st: hsl(var(--p), 12%, 42%);

	--com-bg-my: hsl(var(--s), 12%, 93%);
	--com-name-c-my: hsl(var(--s), 16%, 42%);

  --c-link: var(--p), 82%, 54%;
  --c-link-hover: var(--p), 84%, 51%;
  --c-link-press: var(--p), 87%, 47%;

  --c-logo: var(--c-primary);
  
  --qs-field-bg: hsl(var(--c-body));
  --qs-field-border-c: var(--c-border);
  --qs-field-border-c-hover: hsla(var(--c-text),.3);

  --mrate-bg: hsl(55, 97%, 58%);
  --mrate-text: hsl(var(--c-text));

  --dropdown-w: 260px;
  --dropdown-rd: 28px;
  --dropdown-bg: 0, 0%, 100%;
  --dropdown-sw: 0 16px 40px -4px hsla(0, 0%, 0%, 0.1), 0 0 0 1px var(--c-border);

  --modal-pc-w: 640px;
  --modal-w: 344px;
  --modal-rd: 28px;
	--modal-bg: 0, 0%, 100%;
  --modal-sw: 0 16px 40px -4px hsla(0, 0%, 0%, 0.1), 0 0 0 1px var(--c-border);
	--modal-overlay: hsla(0, 0%, 0%, 0.25);

  --btn-fill-text: hsl(0, 0%, 100%);
  --btn-fill-bg: hsl(var(--p), 82%, 54%);
  --btn-fill-bg-h: hsl(var(--p), 84%, 51%);
  --btn-fill-bg-a: hsl(var(--p), 87%, 47%);

  --btn-light-text: hsl(var(--c-dark));
  --btn-light-bg: hsl(var(--b), 4%, 98%);
  --btn-light-bg-h: hsl(var(--b), 4%, 99%);
  --btn-light-bg-a: hsl(var(--b), 4%, 98%);

  --btn-dark-text: hsl(var(--c-white));
  --btn-dark-bg: hsl(var(--t), 7%, 15%);
  --btn-dark-bg-h: hsl(var(--t), 7%, 19%);
  --btn-dark-bg-a: hsl(var(--t), 7%, 8%);

  --btn-mono-text: hsl(var(--c-white));
  --btn-mono-bg: hsl(var(--t), 7%, 15%);
  --btn-mono-bg-h: hsl(var(--t), 7%, 19%);
  --btn-mono-bg-a: hsl(var(--t), 7%, 8%);

  --btn-tone-text: hsl(var(--p), 82%, 54%);
  --btn-tone-bg: hsla(var(--p), 82%, 54%, 0.1);
  --btn-tone-bg-h: hsla(var(--p), 82%, 54%, 0.2);
  --btn-tone-bg-a: hsla(var(--p), 82%, 54%, 0.25);

  --hbtn-text: hsl(var(--c-white));
  --hbtn-bg: hsla(var(--t), 7%, 15%, 0.6);
  --hbtn-sw: inset 0 0 0 1px hsla(var(--t), 7%, 15%, 0.2);
  
	--btn-carousel-bg: hsl(var(--c-body-light));
  --btn-carousel-sw: 0 0 0 1px var(--c-border), 0 2px 12px -4px hsla(0, 0%, 0%,0.15);
  --btn-carousel-c: hsl(var(--c-text));

  --tags-bg: hsla(var(--c-text),0.075);
  --tags-text: hsl(var(--c-text));

  --btn-carousel-sw: inset 0 0 0 1px var(--c-border), 0 2px 16px -4px hsla(0, 0%, 0%,0.15);
  --btn-carousel-c: hsla(var(--c-text));

  --gradient: linear-gradient(90deg, hsl(var(--c-primary)) 0%, hsl(var(--c-second)) 100%);

  --c-img-overlay: hsl(0, 0%, 0%);

  --c-tooltip-bg: hsl(var(--t), 7%, 15%);
  --c-tooltip-text: hsl(0, 0%, 100%);
}
[data-theme="dark"] {
	color-scheme: dark;

  --c-body: var(--b), 4%, 12%;
  --c-body-tone: hsl(var(--b), 4%, 16%);
  --c-body-tone-t: hsla(var(--b), 4%, 16%, 0);
  --c-body-light: var(--b), 4%, 22%;
  --c-body-widget: var(--b), 4%, 16%;

  --bh-bg: hsl(var(--b), 4%, 16%);

  --c-text: var(--t), 4%, 88%;
  --c-dark: var(--t), 4%, 5%;

  --c-primary: var(--p), 88%, 58%;
  --c-second: var(--s), 78%, 64%;

  --c-link: var(--p), 88%, 58%;
  --c-link-hover: var(--p), 88%, 60%;
  --c-link-press: var(--p), 88%, 54%;

  --c-alert: hsla(43, 100%, 61%, 0.1);

  --c-bsocial: hsl(var(--s), 31%, 36%);
  --c-bsocial-img: hsl(var(--s), 34%, 30%);

  --com-bg-st: hsl(var(--b), 4%, 16%);
	--com-name-c-st: hsl(var(--b), 4%, 72%);

	--com-bg-my: hsl(var(--s), 10%, 18%);
	--com-name-c-my: hsl(var(--s), 12%, 72%);

  --modal-bg: var(--b), 4%, 16%;
  --dropdown-bg: var(--b), 4%, 16%;

  --btn-mono-text: hsl(var(--c-dark));
  --btn-mono-bg: hsl(var(--t), 4%, 88%);
  --btn-mono-bg-h: hsl(var(--t), 4%, 92%);
  --btn-mono-bg-a: hsl(var(--t), 4%, 86%);

  /* --btn-light-bg: hsl(var(--b), 4%, 26%);
  --btn-light-bg-h: hsl(var(--b), 4%, 28%);
  --btn-light-bg-a: hsl(var(--b), 4%, 24%); */

  --c-tooltip-bg: hsl(var(--t), 4%, 92%);
  --c-tooltip-text: hsl(var(--t), 4%, 12%);
}
@media (min-width: 768px) {
  :root {
      --wrp-w: 744px;
      --wrp-p: 32px;
      --wrp-p-inv: -32px;

      --fs-heading: 36px;
      --mb-heading: 20px;

      --fs-heading-second: 28px;

      --fs-heading-sect: 24px;
      --lh-heading-sect: 32px;
      --mb-heading-sect: 16px;

      --fs-heading-tile: 24px;
      --lh-heading-tile: 32px;
      --mb-heading-tile: 16px;

      --fs-title-post: 28px;
      --lh-title-post: 36px;

      --fs-title-post-grid: 20px;
      --lh-title-post-grid: 28px;

      --fs-herotext: 18px;
  }
}
@media (min-width: 992px) {
  :root {
    --headbar-h: 72px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  :root { scroll-behavior: smooth; }
}

.smart-captcha {
    --color-typo-primary: #242529 !important;
    --smart-captcha-background-color: #f9fafa !important;
    --popup-image-container-background-color: #ffffff !important;
}

html[data-theme="dark"] .smart-captcha {
    --color-typo-primary: #dfe0e2 !important;
    --smart-captcha-background-color: #1d1e20 !important;
    --popup-image-container-background-color: #1a1b1e !important;
}

.anchor { scroll-margin-top: var(--scroll-top-space); }

html.load * { transition: none !important; }
*, *::before, *::after { box-sizing: border-box; }
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { display: block; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; }
[tabindex="-1"]:focus { outline: 0 !important; }
hr { margin: 1em 0; color: inherit; border: 0; border-top: 1px solid var(--c-border); }
h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 8px; font-weight: bold; line-height: 1.25em; }
p { margin-top: 0; margin-bottom: 1em; }
abbr[title] {
	-webkit-text-decoration: underline dotted; text-decoration: underline dotted;
	cursor: help; -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none;
}

address { margin: 0; font-style: normal; line-height: inherit; }
ol, ul, dl { list-style: none; padding: 0; margin: 0; }
ol ol, ul ul, ol ul, ul ol { margin-bottom: 0; }
dd { margin-bottom: 8px; margin-left: 0; }
blockquote { margin: 0 0 16px 0; }
b, strong, dt { font-weight: bold; }
small, .small { font-size: var(--fs-3); }

sub, sup { position: relative; font-size: var(--fs-4); line-height: 0; vertical-align: baseline; }
sub { bottom: -.25em; }
sup { top: -.5em; }

a:not([href]):not([class]), a:not([href]):not([class]):hover { color: inherit; text-decoration: none; }

pre, code, kbd, samp { font-family: var(--ft-mono); font-size: var(--fs); }
pre { margin: 0; overflow: auto; }
a > code { color: inherit; }

figure { margin: 0; }
img { vertical-align: middle; border-style: none; }
svg { vertical-align: middle; }

table { border-collapse: collapse; }
th { text-align: inherit; }
caption { padding-top: 12px; padding-bottom: 12px; color: #99999e; text-align: left; caption-side: bottom; }

legend { display: block; width: 100%; padding: 0; margin-bottom: .5rem; font-size: 1.5rem; line-height: inherit; color: inherit; white-space: normal;}
progress { vertical-align: baseline; }

[type="search"] { outline-offset: -2px; appearance: textfield; }
::-webkit-search-decoration { appearance: none; }
::-webkit-file-upload-button { font: inherit; appearance: button; }
::-webkit-color-swatch-wrapper { padding: 0; }
::file-selector-button { font: inherit; appearance: button; }

::-webkit-datetime-edit-fields-wrapper,
::-webkit-datetime-edit-text,
::-webkit-datetime-edit-minute,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-year-field { padding: 0; }
::-webkit-inner-spin-button { height: auto; }

output { display: inline-block; }
summary { display: list-item; cursor: pointer; }
template { display: none; }
[hidden] { display: none !important; }

.small, small { font-size: 12px; }
.muted { color: hsla(var(--c-text), .65); }
.c-red { color: hsl(var(--c-red)); }
.c-second { color: hsl(var(--c-second)); }
.c-primary { color: hsl(var(--c-primary)); }

.truncate { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-clamp {
  --text-clamp-h: 20px;
  --text-clamp-rows: 2;
  --text-clamp-maxh: calc(var(--text-clamp-h) * var(--text-clamp-rows));
  display: block; display: -webkit-box; overflow: hidden; word-break: break-word; line-height: var(--text-clamp-h);
  max-height: var(--text-clamp-maxh); -webkit-line-clamp: var(--text-clamp-rows); -webkit-box-orient: vertical;
}
.text-clamp * { display: inline; }
.text-clamp *:last-child { margin-bottom: 0; }

.uppercase { text-transform: uppercase; }
.text-wrap { white-space: normal !important; }
.text-nowrap { white-space: nowrap !important; }
.balance { text-wrap: balance; }
.fw-b { font-weight: bold; }
.fw-n { font-weight: normal; }
.lh-norm { line-height: normal; }
.f-right { float: right; }
.f-left { float: left; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.gradient-text {
  background-image: var(--gradient); background-clip: text;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.fc { display: flex; align-items: center; }

/* --- Icons --- */
.ic { fill: currentColor; }

.im, .ui-dialog-titlebar-close .ui-icon, .ic {
	--i-size: 24px;
	--i-color: currentColor;
  --i-bg: none;
  flex-shrink: 0;
}
.im::before, .ui-dialog-titlebar-close .ui-icon::before, .ic {
  display: block; flex-shrink: 0;
  width: var(--i-size); height: var(--i-size);
}
.im::before, .ui-dialog-titlebar-close .ui-icon::before {
	content: "";
  background-color: var(--i-color);
  background-image: var(--i-bg);
	mask-size: auto 100%; -webkit-mask-size: auto 100%;
	mask-position: center; -webkit-mask-position: center;
	mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat;
	mask-image: var(--i-img); -webkit-mask-image: var(--i-img);
}

.im-search { --i-img: url(../icons/search.svg); }
.im-arrow-right { --i-img: url(../icons/arrow-right.svg); }
.im-arrow-left { --i-img: url(../icons/arrow-left.svg); }
.im-lock { --i-img: url(../icons/lock.svg); }
.im-left { --i-img: url(../icons/left.svg); }
.im-right { --i-img: url(../icons/right.svg); }
.im-up { --i-img: url(../icons/up.svg); }
.im-down { --i-img: url(../icons/down.svg); }
.im-coms { --i-img: url(../icons/coms.svg); }
.im-views { --i-img: url(../icons/views.svg); }
.im-vdots { --i-img: url(../icons/vdots.svg); }
.im-duration { --i-img: url(../icons/duration2.svg); }
.im-star { --i-img: url(../icons/star.svg); }
.im-star-round { --i-img: url(../icons/star-round.svg); }
.im-spark { --i-img: url(../icons/spark.svg); }
.im-spark-outline { --i-img: url(../icons/spark-outline.svg); }
.im-favorites { --i-img: url(../icons/favorites.svg); }
.im-fav-add { --i-img: url(../icons/fav-outline.svg); }
.im-fav-del { --i-img: url(../icons/fav-fill.svg); }
.im-link { --i-img: url(../icons/link.svg); }
.im-qr { --i-img: url(../icons/qr.svg); }
.im-play { --i-img: url(../icons/play.svg); }
.im-pause { --i-img: url(../icons/pause.svg); }
.im-audio { --i-img: url(../icons/audio.svg); }
.im-print { --i-img: url(../icons/print.svg); }
.im-readshort { --i-img: url(../icons/readshort.svg); }
.im-faq { --i-img: url(../icons/faq.svg); }
.im-read { --i-img: url(../icons/read.svg); }
.im-send { --i-img: url(../icons/send.svg); }
.im-share-arrow { --i-img: url(../icons/share-arrow.svg); }
.im-close { --i-img: url(../icons/close.svg); }
.im-logo { --i-img: url(../icons/logo.svg); }
.im-reply { --i-img: url(../icons/reply.svg); }
.im-thumb-up { --i-img: url(../icons/thumb-up.svg); }
.im-thumb-down { --i-img: url(../icons/thumb-down.svg); }
.im-usercrown { --i-img: url(../icons/usercrown.svg); }
.im-hearth { --i-img: url(../icons/hearth.svg); }
.im-circle-check { --i-img: url(../icons/circle-check.svg); }
.im-circle-add { --i-img: url(../icons/addcircle.svg); }
.im-child-age { --i-img: url(../icons/children.svg); }
.im-playpause { --i-img: url(../icons/playpause.svg); }
.im-scrollup { --i-img: url(../icons/scrollup.svg); }
.im-typetune { --i-img: url(../icons/typetune.svg); }
.im-photo { --i-img: url(../icons/photo.svg); }
.im-del { --i-img: url(../icons/del.svg); }
.im-cancel { --i-img: url(../icons/cancel.svg); }
.im-inbox { --i-img: url(../icons/inbox.svg); }

/* Cats */
.im-cat-all { --i-img: url(../icons/cat-all.svg); }
.im-cat-skazki { --i-img: url(../icons/cat-skazki.svg); }
.im-cat-rasskazi { --i-img: url(../icons/cat-rasskazi.svg); }
.im-cat-askazki { --i-img: url(../icons/cat-askazki.svg); }
.im-cat-arasskazi { --i-img: url(../icons/cat-arasskazi.svg); }
.im-cat-stihi { --i-img: url(../icons/cat-stihi.svg); }
.im-cat-basni { --i-img: url(../icons/cat-basni.svg); }
.im-cat-astihi { --i-img: url(../icons/cat-astihi.svg); }
.im-cat-abasni { --i-img: url(../icons/cat-abasni.svg); }
.im-cat-avtori { --i-img: url(../icons/cat-avtori.svg); }
.im-cat-podborki { --i-img: url(../icons/cat-podborki.svg); }
.im-cat-lenta { --i-img: url(../icons/cat-lenta.svg); }

/* Soc */
.im-soc-vk { --i-img: url(../icons/soc-vk.svg); }
.im-soc-tg { --i-img: url(../icons/soc-tg.svg); }
.im-soc-ok { --i-img: url(../icons/soc-ok.svg); }
.im-soc-ya { --i-img: url(../icons/soc-ya.svg); }
.im-soc-wa { --i-img: url(../icons/soc-wa.svg); }
.im-soc-ml { --i-img: url(../icons/soc-ml.svg); }
.im-soc-mx { --i-img: url(../icons/soc-mx.svg); }

.i-combo { display: inline-flex; vertical-align: top; }
.i-combo-a, .i-combo-o { transition: transform .15s ease, opacity .15s ease; }
.i-combo-a { opacity: 0; transform: scale(.8); margin-left: calc(var(--i-size)/-1); }

.adaptive-pic {
    position: relative;
    display: inline-block;
    width: 100%; height: 100%;
    vertical-align: top;
}
.adaptive-pic img { width: 100%; height: 100%; object-fit: cover; }

/* --- Mask --- */
.mask {
	content: "";
  background: var(--mask-bg);
	mask-size: var(--mask-size); -webkit-mask-size: var(--mask-size);
	mask-position: var(--mask-pos); -webkit-mask-position: var(--mask-pos);
	mask-repeat: var(--mask-rep); -webkit-mask-repeat: var(--mask-pos);
	mask-image: var(--mask-img); -webkit-mask-image: var(--mask-img);
}

/* --- Sepwave --- */
.sepwave.mask {
  --mask-img: url(../img/sep-wave.svg);
  --mask-bg: var(--c-border);
  --mask-size: auto 100%;
  --mask-pos: 0 0;
  --mask-rep: repeat-x;

  height: 9px; overflow: hidden;
}
.sepwave { margin: var(--g-sect) 0; }
.sepwave hr { height: inherit; border: 0 none; opacity: 0; margin: 0; }

/* --- Social BTN --- */
.social-links { display: flex; gap: 8px; }
.soc-btn {
  --soc-btn-rd: 12px;

  position: relative; z-index: 1; cursor: pointer;
  flex: 1; padding: 8px; height: 48px; border-radius: var(--soc-btn-rd);
  display: flex; align-items: center; justify-content: center; text-align: center;
  color: hsl(var(--soc-icon-color)) !important;
}
.soc-btn .im { --i-size: 32px; }
.soc-btn::after {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  background-color: hsl(var(--soc-icon-color)); opacity: .1;
  transition: opacity .2s ease;
}
.soc-btn:hover::after { opacity: .15; }

.soc-ya { --soc-icon-color: var(--c-ya); }
.soc-vk { --soc-icon-color: var(--c-vk); }
.soc-ok { --soc-icon-color: var(--c-ok); }
.soc-ml { --soc-icon-color: var(--c-ml); }
.soc-wa { --soc-icon-color: var(--c-wa); }
.soc-tg { --soc-icon-color: var(--c-tg); }
.soc-mx { --soc-icon-color: var(--c-mx); }

/* --- Social Blocks --- */
.bsocial {
  --bsocial-rd: var(--rd-box);
  --bsocial-pad: 36px;
  --bsocial-btn-h: 84px;
  --bsocial-bg: var(--c-bsocial);

  border-radius: var(--bsocial-rd);
  background-color: var(--bsocial-bg);
  position: relative; z-index: 1; overflow: hidden;
  display: flex; color: var(--c-bsocial-text);
}
.bsocial-img { position: relative; z-index: -1; pointer-events: none; user-select: none; }
.bsocial-cont { padding: var(--bsocial-pad); }
.bsocial-title {
  font-size: var(--fs-heading-sect);
  line-height: var(--lh-heading-sect);
  margin-bottom: 4px;
  font-weight: bold;
}
.bsocial-list { display: flex; gap: 8px; margin-top: 24px; }
.bsocial-list .soc-btn {
  --soc-btn-rd: 32px;

  position: relative;
  width: var(--bsocial-btn-h);
  height: var(--bsocial-btn-h);
  flex: 0 0 var(--bsocial-btn-h);
  color: hsl(var(--c-white)) !important;
}
.bsocial-list .soc-btn::after {
  opacity: 1 !important;
  box-shadow: 0 16px 24px -12px hsla(var(--soc-icon-color),0.7), inset 0 0 0 1px hsla(0,0%,100%,0.05);
  transition: transform .2s ease;
}
.bsocial-list .soc-btn:hover::after { transform: scale(1.02); }
.bsocial-list .soc-btn > .im { --i-size: 44px; }
.bsocial-list .soc-btn > span { opacity: 0; position: absolute; visibility: hidden; }

@media (min-width: 700px) {
  .bsocial-img { margin-left: auto; }
  .bsocial-cont { padding-right: 0; }
  .bsocial-img .adaptive-pic img { object-fit: cover; }
}
@media (max-width: 699.9px) {
  .bsocial {
    --bsocial-pad: 24px;
    --bsocial-bg-img: var(--c-bsocial-img);

    flex-direction: column; text-align: center;
  }
  .bsocial-img { order: -1; margin: 0; height: 120px; background-color: var(--bsocial-bg-img); }
  .bsocial-img .adaptive-pic { width: auto; }
  .bsocial-list { justify-content: center; }
}
/* @media (max-width: 575px) {
  .wrp.sect-social { padding-left: 0; padding-right: 0; }
  .bsocial { --bsocial-rd: var(--rd-big); }
} */

/* --- Meta for Posts --- */
.m-meta { font-size: var(--fs-1); }
.m-meta, .m-right { display: flex; align-items: center; gap: 4px; }
.m-right { margin-left: auto; gap: 12px; }
.m-author a { display: flex; align-items: center; gap: 8px; }
.m-author a:hover { color: hsl(var(--c-link-hover)); }
.m-author a .avatar { --avatar-size: 24px; }

.m-btn {
  display: flex; align-items: center; justify-content: center;
  min-width: 40px; height: 40px; gap: 4px; padding: 8px !important; margin: -8px;
  position: relative; z-index: 1;
}
.m-btn:hover .im { color: hsl(var(--c-link-hover)); }
.m-btn > a::after { content: ""; position: absolute; inset: 0; }
.m-btn.addfav-btn > a > span, .m-meta .addfav-btn > a > span { opacity: 0; position: absolute; left: 0; top: 0; width: 1px; height: 1px; pointer-events: none; overflow: hidden; }

.im-fav-del {
  --i-bg: linear-gradient(0deg, hsl(var(--c-primary)) 0%, hsl(var(--c-yellow)) 100%);
}

.m-rate {
  display: flex; gap: 4px; align-items: center; justify-content: center; text-align: center;
  flex-shrink: 0; height: 24px; min-width: 28px; line-height: 20px; font-weight: bold;
  font-size: var(--fs-1); padding: 2px 6px; padding-right: 8px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--c-border);
  color: var(--mrate-text);
}
.m-rate:hover { background-color: hsla(var(--c-text),0.05); }
.m-rate .im { --i-size: 16px; }

.m-coms { position: relative; z-index: 2; }
a.m-coms:hover { color: hsl(var(--c-link-hover)); }

.postid {
  font-style: normal; font-size: 10px; line-height: 1; padding: 2px 4px;
  background-color: hsl(var(--c-body)); color: var(--c-text-mute);
}
.poster .postid { position: absolute; left: 0; top: 0; z-index: 3; display: none; }
.item:hover .poster .postid { display: block; }

.tools-addon { display: flex; justify-content: end; margin-left: auto; gap: 0; }
.addon-btn {
  display: flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; padding: 12px !important;
  position: relative; z-index: 1;
}
.addon-btn:hover .im { color: hsl(var(--c-link-hover)); }
.addon-btn > a::after { content: ""; position: absolute; inset: 0; }
.addon-btn.addfav-btn > a > span { opacity: 0; position: absolute; left: 0; top: 0; width: 1px; height: 1px; pointer-events: none; overflow: hidden; }

/* --- Meta Cards & Shortline --- */
.author-links { min-width: 0; color: var(--c-text-mute); }
.author-links a {
  position: relative; z-index: 3;
  transition: color .15s ease;
}
.author-links a:hover { color: hsl(var(--c-link-hover)); }
.author-link { display: inline; }
.author-link:not(:last-child)::after { content: ","; }

/* --- STRUCTURE --- */
.wrp {
  width: 100%;
	padding-left: var(--wrp-p); padding-right: var(--wrp-p);
	margin-left: auto; margin-right: auto;
}
.wrp .wrp { padding-right: 0; padding-left: 0; }
@media (min-width: 808px) {
  .wrp { max-width: calc(var(--wrp-w) + var(--wrp-p) * 2); }
}

/* --- Close --- */
.close-btn {
	position: absolute; z-index: 2; top: 0; right: 0;
  padding: 20px; width: 64px; height: 64px; line-height: 24px;
	display: flex; justify-content: center; align-items: center; color: inherit !important;
	background: none; border: none; outline: none; cursor: pointer;
  opacity: .5; transition: opacity .2s ease;
}
.close-btn:hover { opacity: .8; }

/* --- Body --- */
html:not(.with-fancybox) body, html:not(.with-fancybox) { scrollbar-gutter: stable; }
html, body { margin: 0; padding: 0; }
body {
	font: var(--fw) var(--fs)/var(--lh) var(--f);
	background-color: hsl(var(--c-body));
	color: hsl(var(--c-text)); text-rendering: optimizeLegibility; font-optical-sizing: auto;
	min-width: 320px; display: flex; flex-direction: column; min-height: 100vh;
  overflow-x: hidden;
}

/* Links */
a { color: inherit; outline: none !important; text-decoration: none; }
.link, .text a { color: hsl(var(--c-primary)) !important; }
.link:hover, .text a:hover { color: hsl(var(--c-primary)) !important; text-decoration: underline; }

/* Headings */
.m1r-cathead {
  --cathead-mt: var(--g-sect);
  margin-top: var(--cathead-mt);
}
@media (min-width: 576px) {
  .m1r-cathead:not(.cathead-bg) + .sect { margin-top: 24px; }
}
@media (max-width: 575.9px) {
  .m1r-cathead:not(.cathead-bg) + .sect { margin-top: 16px; }
}
.heading {
  font-size: var(--fs-heading); line-height: var(--lh-heading);
  margin-bottom: var(--mb-heading);
  overflow-wrap: break-word; font-weight: bold;
}
.heading:last-child { --mb-heading: 0; }
.heading-page { display: block; font-size: var(--fs-4); padding-left: 2px; height: 14px; line-height: 14px; } 
.hero-text { font-size: var(--fs-herotext); text-wrap: balance; }
.hero-heading { --mb-heading: 20px; }

.heading-add-on { font-weight: bold; margin-bottom: 8px; }
@media (min-width: 768px) {
  .heading-add-on { font-size: 18px; margin-bottom: 12px; }
}

/* Back */
.link-back { display: flex; align-items: center; gap: 4px; margin-bottom: 12px; font-size: var(--fs-2); text-transform: uppercase; }
.link-back .btn {
  --btn-pad: 8px;
  --btn-pad-inv: -8px;
  gap: 4px; margin: var(--btn-pad-inv);
  color: hsl(var(--link-c-text)); font-weight: normal;
}
.link-back a { font-size: inherit; }
.link-back a .im { transition: transform .2s ease; }
.link-back a:hover .im { transform: translateX(-2px); }

.stat-bnum { --g-gap: 16px; }

.big-num {
  display: block;
  font-size: 40px; font-weight: bold; line-height: 1;
  color: hsl(var(--c-link));
}
.stat-bnum-item:hover .big-num { color: hsl(var(--c-link-hover)); }

/* Sections */
.vpad { padding-top: var(--sect-vpad); padding-bottom: var(--sect-vpad); }
.sect, .sect-line { margin-top: var(--g-sect); margin-bottom: var(--g-sect); }

.sect-heading { margin-bottom: var(--mb-heading-sect); }
.sect-heading-title {
  position: relative;
  font-size: var(--fs-heading-sect); line-height: var(--lh-heading-sect);
  overflow-wrap: break-word; max-width: 100%; margin: 0;
  font-weight: bold;
}
.sect-heading-link::after { content: ""; position: absolute; inset: 0; }

@media (min-width: 576px) {
  .sect-heading { display: flex; }
  .sect-heading-link {
    display: inline-block; vertical-align: middle;
    margin-top: -.15em; width: 24px; height: 24px;
  }
  .sect-heading-link .im::before { transform: translateX(-8px); opacity: 0; transition: transform .2s ease, opacity .2s ease; }
  .sect-heading-link:hover .im::before { transform: translateX(0); opacity: 1; }
}
@media (max-width: 575.9px) {
  .sect-heading-title { padding-right: 40px; }
  .sect-heading-link {
    float: right; display: flex; align-items: center; justify-content: center;
    margin-right: -40px; width: 36px; height: var(--lh-heading-sect);
    border-radius: 20px; background-color: hsla(var(--c-text),0.05); color: hsla(var(--c-text),0.6);
  }
}

.sect-text a { text-decoration: underline; text-decoration-color: hsl(var(--c-link)); }
.sect-text a:hover { opacity: 1; color: hsl(var(--c-link-hover)); text-decoration: none; }

.sect-line { pointer-events: none; }
.sect-line hr { margin: 0; display: block; }

.sect-bg { position: relative; z-index: 1; }
.sect-bg .gradient-bg { position: absolute; z-index: -1; inset: 0; }
.gradient-bg {
  border-radius: inherit; pointer-events: none; user-select: none; overflow: hidden;
}

.block + .block { margin-top: var(--g-sect); }

.tile {
  --tile-bg: var(--c-body-tone);
  --tile-pad: 24px;
  --tile-rd: var(--rd-box);

  --tile-title-fs: var(--fs-heading-tile);
  --tile-title-lh: var(--lh-heading-tile);
  --tile-title-mb: var(--mb-heading-tile);

  --tile-sw: none;

  background: var(--tile-bg) !important; padding: var(--tile-pad) !important; border-radius: var(--tile-rd) !important;
  position: relative; z-index: 1;
}
.tile::after { content: ""; position: absolute; z-index: 1; inset: 0;
  box-shadow: var(--tile-sw); border-radius: inherit; pointer-events: none; user-select: none;
}
.tile.primary {
  --tile-bg: hsla(var(--c-primary),0.05);
  --tile-sw: inset 0 0 16px 0 hsla(var(--c-primary),0.12);
}
.tile .cont { flex: 1 1 auto; }
.tile-title {
  font-size: var(--tile-title-fs);
  line-height: var(--tile-title-lh);
  margin-bottom: 0; font-weight: bold; display: block;
}
.tile-title:not(:last-child) {
  margin-bottom: var(--tile-title-mb);
}

.gradient-bg::after, .gradient-bg::before {
	content: ""; position: absolute; top: 0; left: 0; width: 100%; min-width: 560px; max-width: 660px;
  aspect-ratio: 1/1; border-radius: 50%;
}
.gradient-bg::after { left: 50%; transform: translate(-75%, 0%); background-image: radial-gradient(closest-side, hsla(var(--c-primary),.1) 0%, hsla(var(--c-primary), 0) 100%); }
.gradient-bg::before { left: 50%; transform: translate(-65%, 0%); background-image: radial-gradient(closest-side, hsla(var(--c-second),.1) 0%, hsla(var(--c-second), 0) 100%); }


/* Grid List */
:root {
	--g-gap: 8px;
	--card-hscroll-mw: 152px;
	--hscroll-take: var(--wrp-p);
  --hscroll-take-inv: var(--wrp-p-inv);
}
@media (min-width: 576px) {
  :root {
	  --card-hscroll-mw: 180px;
  }
}

.glist {
	display: grid; gap: var(--g-gap);
}
.g4, .g3 { --card-wmin: var(--card-hscroll-mw); }
.g2 { grid-template-columns: repeat(2, 1fr); }
.g3 { grid-template-columns: repeat(3, 1fr); }
.g4 { grid-template-columns: repeat(4, 1fr); }
.g8 { grid-template-columns: repeat(8, 1fr); }

@media (min-width: 992px) {
	.g2 { --card-wmin: calc((100% - var(--g-gap) * 1) / 2); }
	.g3 { --card-wmin: calc((100% - var(--g-gap) * 2) / 3); }
	.g4 { --card-wmin: calc((100% - var(--g-gap) * 3) / 4); }
	.g8 { --card-wmin: calc((100% - var(--g-gap) * 7) / 8); }
}

/* H Scroll */
.hscroll {
	overflow: hidden; overflow-x: auto; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; scrollbar-width: none;
	padding-left: var(--hscroll-take); padding-right: var(--hscroll-take);
	margin-left: var(--hscroll-take-inv); margin-right: var(--hscroll-take-inv);

	/* padding-top: 16px; padding-bottom: 16px; margin-top: -16px; margin-bottom: -16px; */
	scroll-snap-type: x proximity;
}
/* @media (min-width: 768px) {
  .hscroll { scroll-snap-type: x mandatory; }
} */
.hcarousel.glist { grid-auto-flow: column; grid-auto-columns: var(--card-hscroll-mw); }
.hscroll::-webkit-scrollbar { display: none; }
.hscroll [data-card] { 
	scroll-margin-left: var(--hscroll-take);
	scroll-margin-right: var(--hscroll-take);
	scroll-snap-align: start;
	scroll-snap-stop: always;
  flex-shrink: 0;
}

/* COVER */
.poster {
  --poster-rd: var(--rd-card);
  --poster-mw: 200px;
  position: relative; border-radius: var(--poster-rd);
  max-width: var(--poster-mw);
  flex-shrink: 0;
}
.poster img { aspect-ratio: inherit; height: auto; pointer-events: none; user-select: none; }
.poster img.poster-img { width: 100%; object-fit: cover; object-position: center center; border-radius: inherit; position: relative; z-index: 1; }
.poster img.poster-blur {
  position: absolute;
  left: 3%; top: 7%; width: 94%;
  filter: blur(12px); opacity: .5;
  border-radius: inherit;
}
.poster-circle { --poster-rd: 50%; }

.cover, .avatar { position: relative; z-index: 1; }
.cover img, .avatar img {
  display: block !important; width: 100% !important; height: 100% !important;
  object-fit: cover; object-position: center center;
  position: relative; z-index: -1;
  border-radius: inherit !important;
}
.avatar {
  --avatar-size: 44px;
  aspect-ratio: 1/1; border-radius: 50%;
  max-width: var(--avatar-size); max-height: var(--avatar-size);
  min-width: var(--avatar-size); min-height: var(--avatar-size);
  background-color: hsl(var(--c-body-tone));
}
.avatar::after {
    content: ""; position: absolute; z-index: 1; inset: 0; border-radius: inherit; border: 0.5px solid; opacity: .1;
}

.cov-overlay::after, .cov-outline::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  border-radius: inherit; pointer-events: none;
}
.cov-outline::before {
  border: 0.5px solid hsla(var(--c-text),.1); 
}
.cov-overlay::after {
  background-color: var(--c-img-overlay); opacity: 0.04;
  transition: opacity .1s ease; 
}
.c-trigger:hover .cov-overlay::after { opacity: 0; }

.as34 { aspect-ratio: 3/4; }
.as11 { aspect-ratio: 1/1; }

/* - Alert - */
.alert {
  --alert-pad: 16px;
  --alert-gap: var(--g-sect);
  --alert-color: var(--c-alert);

  border-radius: var(--rd-box);
  padding: var(--alert-pad); background-color: var(--alert-color);
  margin: var(--alert-gap) 0;
}
.alert-title { opacity: .7; font-size: var(--fs-2); font-weight: bold; margin-bottom: 6px; }

/* - Item Links - */
.item { position: relative; display: block; }
.item-link { text-decoration: none; color: inherit; cursor: pointer; }
.item-link::after { content: ""; position: absolute; inset: 0; z-index: 2; }