/* ==========================================================================
   Тема „sketch“: като Excalidraw – ръчно рисувани, леко неравни линии,
   щриховани сенки, асиметрични заоблени ъгли, стрелки и подчертавания.
   ========================================================================== */
html[data-theme="sketch"] {
  --radius: 255px 15px 225px 15px / 15px 225px 15px 255px;
  --radius-sm: 155px 10px 145px 10px / 10px 145px 10px 155px;
  --radius-lg: 255px 25px 225px 25px / 25px 225px 25px 255px;
  --border-w: 2px;
  --shadow: 4px 4px 0 0 color-mix(in srgb, var(--c-border) 40%, transparent);
  --shadow-lg: 7px 7px 0 0 color-mix(in srgb, var(--c-border) 45%, transparent);
  --sketch-filter: url(#sketch-wobble);
}
html[data-theme="sketch"] .art-sketch { display: block; color: var(--c-text); }
html[data-theme="sketch"] body { background-image: radial-gradient(color-mix(in srgb, var(--c-border) 18%, transparent) 1px, transparent 1px); background-size: 22px 22px; }
html[data-theme="sketch"] h1, html[data-theme="sketch"] h2, html[data-theme="sketch"] h3 { letter-spacing: 0; }
html[data-theme="sketch"] .hero-title { position: relative; display: inline-block; }
html[data-theme="sketch"] .page-header h1 { position: relative; width: fit-content; }
html[data-theme="sketch"] .hero-title::after, html[data-theme="sketch"] .page-header h1::after { content: ""; position: absolute; left: 0; right: 0; bottom: -.15em; height: .45em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 7c40-6 80-4 120-2s50 3 76-3' fill='none' stroke='%23e03131' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 100% 100%; opacity: .9; z-index: -1; }
html[data-theme="sketch"] .brand-mark { background: transparent; color: var(--c-text); border: var(--border-w) solid var(--c-border); border-radius: var(--radius-sm); }
html[data-theme="sketch"] .nav-list a { border-radius: var(--radius-sm); }
html[data-theme="sketch"] .nav-list a[aria-current="page"] { background: transparent; color: var(--c-text); border: var(--border-w) solid var(--c-border); box-shadow: 2px 2px 0 0 var(--c-accent); }
/* Рамките са в ::before (с филтъра), за да не се изкривява текстът. */
html[data-theme="sketch"] :where(.card, .song, .drawing-card, .callout, .repo-card, .link-card, .download-card, .post-nav-link, .facts, .series-box, .search-box, .search-results li, .lang-menu, .details, .toc, .share, .map-figure, .chart-box, .diagram pre.mermaid, .song-strip a, .prose pre, .table-wrap, .snake-item figure, .btn, .tag, .chip, .like-btn, .segmented, .theme-buttons, .step-num, .social-list a) { position: relative; isolation: isolate; border-color: transparent !important; box-shadow: none !important; background: transparent; }
html[data-theme="sketch"] :where(.card, .song, .drawing-card, .callout, .repo-card, .link-card, .download-card, .post-nav-link, .facts, .series-box, .search-box, .search-results li, .lang-menu, .details, .toc, .share, .map-figure, .chart-box, .diagram pre.mermaid, .song-strip a, .prose pre, .table-wrap, .snake-item figure, .btn, .tag, .chip, .like-btn, .segmented, .theme-buttons, .step-num, .social-list a)::before { content: ""; position: absolute; inset: 0; z-index: -1; border: var(--border-w) solid var(--c-border); border-radius: inherit; background: var(--sk-bg, var(--c-surface)); box-shadow: var(--sk-shadow, var(--shadow)); filter: var(--sketch-filter); pointer-events: none; }
html[data-theme="sketch"] .lang-menu { position: absolute; }
html[data-theme="sketch"] .toc { position: sticky; }
@media (max-width: 64rem) { html[data-theme="sketch"] .toc { position: static; } }
html[data-theme="sketch"] .card { overflow: visible; }
html[data-theme="sketch"] .field input, html[data-theme="sketch"] .field textarea { border: var(--border-w) solid var(--c-border); border-radius: var(--radius-sm); box-shadow: 2px 2px 0 0 color-mix(in srgb, var(--c-border) 35%, transparent); }
html[data-theme="sketch"] .comment-main, html[data-theme="sketch"] .comment-form { position: relative; isolation: isolate; border-color: transparent !important; box-shadow: none !important; background: transparent; }
html[data-theme="sketch"] .comment-main::before, html[data-theme="sketch"] .comment-form::before { content: ""; position: absolute; inset: 0; z-index: -1; border: var(--border-w) solid var(--c-border); border-radius: inherit; background: var(--c-surface); box-shadow: var(--shadow); filter: var(--sketch-filter); pointer-events: none; }
html[data-theme="sketch"] .comment-form::before { background: var(--c-surface2); border-style: dashed; box-shadow: none; }
html[data-theme="sketch"] .card .card-image { border-radius: var(--radius-sm); margin: .5rem .5rem 0; aspect-ratio: 16 / 9; }
html[data-theme="sketch"] .card-image img { border-radius: inherit; }
html[data-theme="sketch"] .prose pre { --sk-bg: var(--c-codeBg); }
html[data-theme="sketch"] .callout::before { --sk-bg: var(--c-surface); background-image: repeating-linear-gradient(135deg, transparent 0 8px, color-mix(in srgb, var(--cc) 12%, transparent) 8px 9px); border-color: var(--cc); }
html[data-theme="sketch"] .callout { border-left: 0; padding-left: 1.25rem; }
html[data-theme="sketch"] .toc::before, html[data-theme="sketch"] .share::before, html[data-theme="sketch"] .map-figure::before { --sk-bg: transparent; --sk-shadow: none; border-style: dashed; }
html[data-theme="sketch"] .map-figure { padding: .5rem; }
html[data-theme="sketch"] .map { border: 0; }
html[data-theme="sketch"] .tag::before { --sk-bg: var(--c-surface2); --sk-shadow: 2px 2px 0 0 color-mix(in srgb, var(--c-border) 30%, transparent); }
html[data-theme="sketch"] .btn::before { --sk-shadow: 3px 3px 0 0 var(--c-border); }
html[data-theme="sketch"] .btn:hover::before { --sk-shadow: 4px 4px 0 0 var(--c-border); }
html[data-theme="sketch"] .btn:active::before { --sk-shadow: 1px 1px 0 0 var(--c-border); }
html[data-theme="sketch"] .btn-primary::before, html[data-theme="sketch"] .chip[aria-pressed="true"]::before, html[data-theme="sketch"] .step-num::before, html[data-theme="sketch"] .like-btn[aria-pressed="true"]::before { --sk-bg: var(--c-accent); }
html[data-theme="sketch"] .like-btn[aria-pressed="true"] { color: var(--c-accentText); }
html[data-theme="sketch"] .segmented::before, html[data-theme="sketch"] .theme-buttons::before { --sk-bg: var(--c-surface2); --sk-shadow: none; }
html[data-theme="sketch"] .social-list a::before { --sk-shadow: 2px 2px 0 0 var(--c-border); border-radius: 50%; }
html[data-theme="sketch"] .social-list a:hover::before { --sk-shadow: 3px 3px 0 0 var(--c-accent); }
html[data-theme="sketch"] .snake-item img { border: 0; box-shadow: none; }
html[data-theme="sketch"] .snake-item figure { padding: .4rem; }
html[data-theme="sketch"] .player { border-top: var(--border-w) solid var(--c-border); box-shadow: 0 -4px 0 0 color-mix(in srgb, var(--c-border) 30%, transparent); }
html[data-theme="sketch"] .site-header { filter: none; border-bottom: 0; position: sticky; }
html[data-theme="sketch"] .site-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 3px; background: var(--c-border); filter: url(#sketch-wobble-strong); }
html[data-theme="sketch"] .card:hover, html[data-theme="sketch"] .drawing-card:hover { transform: translate(-2px, -2px) rotate(-.4deg); }
html[data-theme="sketch"] .card:nth-child(even):hover { transform: translate(-2px, -2px) rotate(.4deg); }
html[data-theme="sketch"] .card:hover::before, html[data-theme="sketch"] .drawing-card:hover::before { --sk-shadow: var(--shadow-lg); }
html[data-theme="sketch"] :where(.btn, .chip, .tag, .like-btn, .segmented, .theme-buttons, .step-num) { border-radius: var(--radius-sm); color: var(--c-text); }
html[data-theme="sketch"] .btn { transition: transform .15s; }
html[data-theme="sketch"] .btn:hover { transform: translate(-1px, -1px); }
html[data-theme="sketch"] .btn:active { transform: translate(2px, 2px); }
html[data-theme="sketch"] .site-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--c-bg); }
html[data-theme="sketch"] .snake-item:nth-child(odd) figure { transform: rotate(-1deg); }
html[data-theme="sketch"] .icon-btn { border-color: transparent; }
html[data-theme="sketch"] .icon-btn:hover { border-color: var(--c-border); background: var(--c-surface); }
html[data-theme="sketch"] .btn-primary, html[data-theme="sketch"] .chip[aria-pressed="true"], html[data-theme="sketch"] .theme-buttons button[aria-pressed="true"], html[data-theme="sketch"] .step-num, html[data-theme="sketch"] .player-play { background: var(--c-accent); color: var(--c-accentText); border-color: var(--c-border); }
html[data-theme="sketch"] .btn-primary:hover { background: var(--c-accent); }
html[data-theme="sketch"] .segmented button[aria-selected="true"] { box-shadow: none; background: var(--c-surface2); border: var(--border-w) solid var(--c-border); border-radius: var(--radius-sm); }
html[data-theme="sketch"] .callout-title { color: var(--cc); }
html[data-theme="sketch"] .prose blockquote { border-left: var(--border-w) solid var(--c-border); background: transparent; border-radius: 0; position: relative; }
html[data-theme="sketch"] .prose blockquote::before { content: "“"; position: absolute; left: .6rem; top: -.4rem; font-size: 3rem; color: var(--c-accent); opacity: .5; }
html[data-theme="sketch"] .prose img, html[data-theme="sketch"] .post-cover img, html[data-theme="sketch"] .gallery a { border: var(--border-w) solid var(--c-border); box-shadow: var(--shadow); }
html[data-theme="sketch"] .prose code:not(pre code) { border-radius: 4px; border-color: var(--c-border); }
html[data-theme="sketch"] .prose a:not(.btn):not(.tag) { text-decoration: none; background: linear-gradient(transparent 60%, color-mix(in srgb, var(--c-accent2) 30%, transparent) 60%); }
html[data-theme="sketch"] .prose h2::before { content: "# "; color: var(--c-accent); font-weight: 400; }
html[data-theme="sketch"] .section-title::after { content: ""; flex: 1; margin-left: .75rem; height: 2px; background: repeating-linear-gradient(90deg, var(--c-border) 0 6px, transparent 6px 11px); opacity: .6; }
html[data-theme="sketch"] .site-footer { background: transparent; border-top: var(--border-w) dashed var(--c-border); }
html[data-theme="sketch"] .snake-row::before, html[data-theme="sketch"] .snake-row::after { border-color: var(--c-text); border-style: dashed; }
html[data-theme="sketch"] .snake-item:nth-child(even) img { transform: rotate(1.2deg); }
html[data-theme="sketch"] .toc ol { border-left: var(--border-w) dashed var(--c-border); }
html[data-theme="sketch"] .map { border-radius: var(--radius-sm); }
html[data-theme="sketch"] .lightbox { background: rgb(30 30 30 / .96); }
html[data-theme="sketch"] .heading-anchor { color: var(--c-accent); }
html[data-theme="sketch"] .eyebrow { color: var(--c-accent); }
html[data-theme="sketch"] .more-link { text-decoration: underline; text-decoration-style: wavy; text-decoration-color: var(--c-accent2); }
html[data-theme="sketch"] .lede { font-style: italic; }