/* =====================================================
   WIDGETS BASE CSS — structural styles for ALL variants
   Uses [class*="-name"] to match any CSS prefix
   ===================================================== */

/* ---- RESET & BASE ---- */
[class*="-floatform"],[class*="-splitform"],[class*="-termform"],
[class*="-underform"],[class*="-gradform"],[class*="-stepform"],
[class*="-socform"],[class*="-counterform"],[class*="-newsform"],
[class*="-cform-wrap"],[class*="-iform-wrap"],[class*="-respond"] {
  box-sizing: border-box;
}

/* =====================================================
   FORM-COMMENT VARIANTS
   ===================================================== */

/* v2: floating labels */
[class$="-floatform"] { padding: 24px; border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); background: var(--card,#fff); margin-top: 28px; }
[class$="-floatform-h"] { font-size: 1.1rem; font-weight: 700; margin-bottom: 20px; color: var(--text,#1f2937); }
[class*="-floatform-field"] { position: relative; margin-bottom: 28px; }
[class*="-floatform-field"] input,
[class*="-floatform-field"] textarea { width: 100%; padding: 16px 14px 8px; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-size: .95rem; font-family: inherit; background: transparent; transition: .2s; }
[class*="-floatform-field"] label { position: absolute; left: 14px; top: 12px; font-size: .9rem; color: #9ca3af; pointer-events: none; transition: .2s; }
[class*="-floatform-field"] input:focus ~ label,
[class*="-floatform-field"] input:not(:placeholder-shown) ~ label,
[class*="-floatform-field"] textarea:focus ~ label,
[class*="-floatform-field"] textarea:not(:placeholder-shown) ~ label { top: 4px; font-size: .72rem; color: var(--primary,#6366f1); }
[class*="-floatform-field"] input:focus,
[class*="-floatform-field"] textarea:focus { outline: none; border-color: var(--primary,#6366f1); }
[class$="-floatform-footer"] { display: flex; justify-content: flex-end; }
[class$="-floatform-btn"] { padding: 11px 28px; background: var(--primary,#6366f1); color: #fff; border: none; border-radius: var(--radius,8px); font-size: .95rem; font-weight: 600; cursor: pointer; transition: .2s; }

/* v3: split form */
[class$="-splitform"] { margin-top: 28px; border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); overflow: hidden; background: var(--card,#fff); }
[class$="-splitform-head"] { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--border,#e5e7eb); background: var(--background,#f9fafb); }
[class$="-splitform-h"] { font-size: 1rem; font-weight: 700; }
[class$="-splitform-count"] { font-size: .8rem; color: #6b7280; }
[class$="-splitform-form"] { padding: 16px 20px; }
[class$="-splitform-ta"] { width: 100%; padding: 12px; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-size: .95rem; font-family: inherit; resize: vertical; min-height: 100px; margin-bottom: 12px; }
[class$="-splitform-bar"] { display: flex; gap: 10px; align-items: center; }
[class$="-splitform-name"] { flex: 1; padding: 10px 14px; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-size: .9rem; font-family: inherit; }
[class$="-splitform-send"] { padding: 10px 22px; background: var(--primary,#6366f1); color: #fff; border: none; border-radius: var(--radius,8px); font-weight: 600; cursor: pointer; white-space: nowrap; }

/* v4: terminal */
[class$="-termform"] { background: #1e1e1e; border-radius: var(--radius,8px); overflow: hidden; margin-top: 28px; }
[class$="-termform-bar"] { display: flex; align-items: center; gap: 6px; padding: 10px 16px; background: #2d2d2d; }
[class$="-termform-dot"] { width: 12px; height: 12px; border-radius: 50%; background: #ff5f56; }
[class$="-termform-dot"]:nth-child(2) { background: #ffbd2e; }
[class$="-termform-dot"]:nth-child(3) { background: #27c93f; }
[class$="-termform-title"] { color: #9ca3af; font-size: .8rem; margin-left: 8px; font-family: monospace; }
[class$="-termform-body"] { padding: 20px; }
[class$="-termform-line"] { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; }
[class$="-termform-prompt"] { color: #10b981; font-family: monospace; font-size: .9rem; white-space: nowrap; padding-top: 11px; }
[class$="-termform-input"],
[class$="-termform-ta"] { flex: 1; background: transparent; border: 1px solid #3f3f3f; border-radius: 4px; padding: 10px 12px; color: #e2e8f0; font-family: monospace; font-size: .9rem; }
[class$="-termform-ta"] { min-height: 100px; resize: vertical; }
[class$="-termform-submit"] { background: #10b981; color: #fff; border: none; padding: 10px 20px; border-radius: 4px; font-family: monospace; cursor: pointer; }

/* v5: underline */
[class$="-underform"] { margin-top: 28px; padding: 24px 0; border-top: 2px solid var(--border,#e5e7eb); }
[class$="-underform-h"] { font-size: 1.2rem; font-weight: 700; margin-bottom: 24px; color: var(--text,#1f2937); }
[class$="-underform-field"] { margin-bottom: 20px; border-bottom: 2px solid var(--border,#e5e7eb); transition: border-color .2s; }
[class$="-underform-field"]:focus-within { border-color: var(--primary,#6366f1); }
[class$="-underform-input"],
[class$="-underform-ta"] { width: 100%; background: transparent; border: none; padding: 8px 0; font-size: .95rem; font-family: inherit; color: var(--text,#1f2937); }
[class$="-underform-input"]:focus,
[class$="-underform-ta"]:focus { outline: none; }
[class$="-underform-ta"] { resize: vertical; min-height: 80px; }
[class$="-underform-actions"] { margin-top: 20px; text-align: right; }
[class$="-underform-btn"] { background: none; border: 2px solid var(--primary,#6366f1); color: var(--primary,#6366f1); padding: 10px 24px; border-radius: var(--radius,8px); font-weight: 700; cursor: pointer; transition: .2s; }
[class$="-underform-btn"]:hover { background: var(--primary,#6366f1); color: #fff; }

/* v6: gradient header */
[class$="-gradform"] { margin-top: 28px; border-radius: var(--radius,8px); overflow: hidden; border: 1px solid var(--border,#e5e7eb); }
[class$="-gradform-hero"] { background: linear-gradient(135deg, var(--primary,#6366f1), var(--secondary,#4f46e5)); padding: 20px 24px; color: #fff; }
[class$="-gradform-h"] { font-size: 1.1rem; font-weight: 700; margin-bottom: 4px; }
[class$="-gradform-sub"] { opacity: .85; font-size: .875rem; }
[class$="-gradform-body"] { padding: 24px; background: var(--card,#fff); }
[class$="-gradform-row"] { margin-bottom: 16px; }
[class$="-gradform-cta"] { margin-top: 4px; }

/* v7: steps */
[class$="-stepform"] { margin-top: 28px; padding: 24px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-stepform-h"] { font-size: 1.1rem; font-weight: 700; margin-bottom: 24px; }
[class$="-stepform-step"] { display: flex; gap: 16px; margin-bottom: 24px; }
[class$="-stepform-num"] { width: 32px; height: 32px; background: var(--primary,#6366f1); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; }
[class$="-stepform-content"] { flex: 1; }
[class$="-stepform-content"] label { display: block; font-weight: 600; margin-bottom: 8px; color: var(--text,#1f2937); }
[class$="-stepform-content"] input,
[class$="-stepform-content"] textarea { width: 100%; padding: 10px 14px; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-family: inherit; }
[class$="-stepform-submit"] { padding-left: 48px; }

/* v8: social */
[class$="-socform"] { margin-top: 28px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); padding: 16px; }
[class$="-socform-inner"] { display: flex; gap: 12px; }
[class$="-socform-av"] { width: 42px; height: 42px; border-radius: 50%; background: var(--accent,#f59e0b); display: flex; align-items: center; justify-content: center; font-weight: 700; color: #fff; flex-shrink: 0; font-size: .9rem; }
[class$="-socform-right"] { flex: 1; }
[class$="-socform-ta"] { width: 100%; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); padding: 10px 14px; font-family: inherit; resize: none; min-height: 80px; margin-bottom: 10px; }
[class$="-socform-footer"] { display: flex; align-items: center; gap: 10px; }
[class$="-socform-name"] { flex: 1; padding: 8px 12px; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-family: inherit; font-size: .875rem; }
[class$="-socform-btn"] { padding: 8px 18px; background: var(--primary,#6366f1); color: #fff; border: none; border-radius: var(--radius,8px); font-weight: 600; cursor: pointer; }

/* v9: counter */
[class$="-counterform"] { margin-top: 28px; border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); overflow: hidden; }
[class$="-counterform-head"] { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; background: var(--background,#f9fafb); border-bottom: 1px solid var(--border,#e5e7eb); }
[class$="-counterform-h"] { font-size: 1rem; font-weight: 700; }
[class$="-counterform-rules"] { font-size: .8rem; color: #6b7280; }
[class$="-counterform-ta-wrap"] { position: relative; padding: 16px 20px; }
[class$="-counterform-ta"] { width: 100%; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); padding: 10px 14px; font-family: inherit; resize: vertical; min-height: 100px; }
[class$="-counterform-counter"] { position: absolute; right: 28px; bottom: 24px; font-size: .75rem; color: #9ca3af; }
[class$="-counterform-actions"] { display: flex; justify-content: space-between; align-items: center; padding: 0 20px 16px; }
[class$="-counterform-reset"] { background: none; border: 1px solid var(--border,#e5e7eb); padding: 8px 16px; border-radius: var(--radius,8px); cursor: pointer; font-size: .875rem; }

/* v10: newspaper */
[class$="-newsform"] { margin-top: 28px; }
[class$="-newsform-rule"] { height: 2px; background: var(--text,#1f2937); margin: 12px 0; }
[class$="-newsform-h"] { font-size: 1.3rem; font-weight: 900; text-align: center; letter-spacing: .05em; font-family: Georgia, serif; margin: 8px 0; }
[class$="-newsform-body"] { padding: 16px 0; }
[class$="-newsform-cols"] { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); gap: 16px; margin-bottom: 16px; }
[class$="-newsform-lbl"] { display: block; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
[class$="-newsform-input"],
[class$="-newsform-ta"] { width: 100%; border: 1px solid var(--border,#e5e7eb); padding: 8px 12px; font-family: Georgia,serif; background: var(--background,#faf8f5); }
[class$="-newsform-body-field"] { margin-bottom: 16px; }
[class$="-newsform-btn"] { background: var(--text,#1f2937); color: #fff; border: none; padding: 10px 24px; font-family: Georgia,serif; font-size: .95rem; cursor: pointer; }

/* =====================================================
   COMMENTS VARIANTS
   ===================================================== */

/* v3: 2-col grid */
[class$="-cgrid"] { margin-top: 36px; padding-top: 32px; border-top: 2px solid var(--border,#e5e7eb); }
[class$="-cgrid-h"] { font-size: 1.2rem; font-weight: 700; margin-bottom: 20px; }
[class$="-cgrid-wrap"] { display: grid; grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); gap: 16px; }
[class$="-cgrid-card"] { background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); padding: 18px; }
[class$="-cgrid-top"] { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
[class$="-cgrid-av"] { width: 36px; height: 36px; border-radius: 50%; background: var(--accent,#f59e0b); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; }
[class$="-cgrid-name"] { font-weight: 600; font-size: .9rem; display: block; }
[class$="-cgrid-date"] { font-size: .75rem; color: #9ca3af; display: block; }
[class$="-cgrid-txt"] { font-size: .9rem; line-height: 1.6; color: var(--text,#374151); }

/* v5: reddit */
[class$="-creddit"] { margin-top: 36px; padding-top: 32px; border-top: 2px solid var(--border,#e5e7eb); }
[class$="-creddit-h"] { font-size: 1.2rem; font-weight: 700; margin-bottom: 16px; }
[class$="-creddit-item"] { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-creddit-votes"] { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 32px; }
[class$="-creddit-votes"] button { background: none; border: none; cursor: pointer; font-size: .9rem; color: #9ca3af; transition: .15s; padding: 2px; }
[class$="-creddit-votes"] button:hover { color: var(--primary,#6366f1); }
[class$="-creddit-score"] { font-weight: 700; font-size: .875rem; color: var(--text,#374151); }
[class$="-creddit-body"] { flex: 1; }
[class$="-creddit-meta"] { font-size: .8rem; color: #6b7280; margin-bottom: 6px; }
[class$="-creddit-meta"] strong { color: var(--text,#374151); margin-right: 4px; }
[class$="-creddit-txt"] { font-size: .9rem; line-height: 1.65; }

/* v7: blockquotes */
[class$="-cquotes"] { margin-top: 36px; padding-top: 32px; border-top: 2px solid var(--border,#e5e7eb); }
[class$="-cquotes-h"] { font-size: 1.2rem; font-weight: 700; margin-bottom: 20px; font-family: Georgia,serif; }
[class$="-cquote-item"] { border-left: 4px solid var(--primary,#6366f1); padding: 16px 20px; margin-bottom: 16px; background: var(--background,#f9fafb); border-radius: 0 var(--radius,8px) var(--radius,8px) 0; }
[class$="-cquote-txt"] { font-size: 1rem; line-height: 1.7; font-style: italic; margin-bottom: 10px; color: var(--text,#374151); }
[class$="-cquote-foot"] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
[class$="-cquote-author"] { font-weight: 700; font-style: normal; font-size: .875rem; }
[class$="-cquote-date"] { font-size: .8rem; color: #9ca3af; }

/* v8: horizontal scroll */
[class$="-cscroll"] { margin-top: 36px; padding-top: 32px; border-top: 2px solid var(--border,#e5e7eb); }
[class$="-cscroll-head"] { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
[class$="-cscroll-h"] { font-size: 1.2rem; font-weight: 700; }
[class$="-cscroll-cnt"] { background: var(--primary,#6366f1); color: #fff; border-radius: 999px; padding: 2px 10px; font-size: .8rem; font-weight: 600; }
[class$="-cscroll-track"] { display: flex; gap: 16px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; }
[class$="-cscroll-track"]::-webkit-scrollbar { height: 4px; }
[class$="-cscroll-track"]::-webkit-scrollbar-thumb { background: var(--border,#e5e7eb); border-radius: 2px; }
[class$="-cscroll-card"] { min-width: 240px; max-width: 280px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); padding: 16px; scroll-snap-align: start; flex-shrink: 0; }
[class$="-cscroll-av"] { width: 36px; height: 36px; border-radius: 50%; background: var(--accent,#f59e0b); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; margin-bottom: 10px; }
[class$="-cscroll-name"] { font-weight: 600; font-size: .875rem; display: block; margin-bottom: 8px; }
[class$="-cscroll-txt"] { font-size: .875rem; line-height: 1.55; color: #6b7280; margin-bottom: 10px; }
[class$="-cscroll-foot"] { display: flex; justify-content: space-between; align-items: center; }
[class$="-cscroll-date"] { font-size: .75rem; color: #9ca3af; }

/* v9: numbered */
[class$="-ctop"] { margin-top: 36px; padding-top: 32px; border-top: 2px solid var(--border,#e5e7eb); }
[class$="-ctop-h"] { font-size: 1.2rem; font-weight: 700; margin-bottom: 20px; }
[class$="-ctop-list"] { list-style: none; }
[class$="-ctop-item"] { display: flex; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-ctop-num"] { font-size: 1.8rem; font-weight: 900; color: var(--primary,#6366f1); opacity: .25; min-width: 40px; line-height: 1; font-variant-numeric: tabular-nums; }
[class$="-ctop-body"] { flex: 1; }
[class$="-ctop-txt"] { font-size: .95rem; line-height: 1.65; margin-bottom: 8px; }
[class$="-ctop-meta"] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: .8rem; color: #9ca3af; }
[class$="-ctop-meta"] strong { color: var(--text,#374151); }

/* =====================================================
   STATS-BAR VARIANTS
   ===================================================== */

[class$="-statsprog"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-statsprog-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 16px; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; }
[class$="-statsprog-item"] { margin-bottom: 14px; }
[class$="-statsprog-label"] { display: flex; justify-content: space-between; font-size: .85rem; margin-bottom: 6px; }
[class$="-statsprog-label"] strong { font-weight: 700; color: var(--primary,#6366f1); }
[class$="-statsprog-track"] { height: 6px; background: var(--border,#e5e7eb); border-radius: 3px; overflow: hidden; }
[class$="-statsprog-fill"] { height: 100%; background: var(--primary,#6366f1); border-radius: 3px; min-width: 4px; transition: width .6s ease; }

[class$="-statsline"] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-size: .9rem; }
[class$="-statsline-item"] strong { font-weight: 700; color: var(--primary,#6366f1); margin-right: 4px; }
[class$="-statsline-slash"] { color: #d1d5db; font-size: 1.2rem; }

[class$="-statsach"] { display: flex; flex-direction: column; gap: 10px; padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-statsach-item"] { display: flex; align-items: center; gap: 10px; font-size: .9rem; }
[class$="-statsach-icon"] { color: #10b981; font-size: 1rem; flex-shrink: 0; }
[class$="-statsach-text"] strong { color: var(--primary,#6366f1); }

[class$="-statsbig"] { padding: 20px; }
[class$="-statsbig-rule"] { height: 2px; background: var(--text,#1f2937); margin: 8px 0; }
[class$="-statsbig-row"] { display: flex; justify-content: space-around; padding: 12px 0; }
[class$="-statsbig-cell"] { text-align: center; }
[class$="-statsbig-n"] { display: block; font-size: 2rem; font-weight: 900; color: var(--primary,#6366f1); line-height: 1; }
[class$="-statsbig-l"] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #6b7280; margin-top: 4px; }

[class$="-statsgit"] { display: flex; flex-wrap: wrap; gap: 8px; padding: 16px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-statsgit-badge"] { display: inline-flex; border-radius: 4px; overflow: hidden; font-size: .8rem; font-family: monospace; }
[class$="-statsgit-key"] { background: #555; color: #fff; padding: 4px 8px; }
[class$="-statsgit-val"] { background: #2ea44f; color: #fff; padding: 4px 8px; }

/* =====================================================
   TAGS VARIANTS
   ===================================================== */

[class$="-taglist"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-taglist-h"] { font-size: .9rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; margin-bottom: 12px; }
[class$="-taglist-ul"] { list-style: none; }
[class$="-taglist-item"] { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-taglist-a"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; transition: color .15s; }
[class$="-taglist-a"]:hover { color: var(--primary,#6366f1); }
[class$="-taglist-cnt"] { font-size: .75rem; background: var(--background,#f3f4f6); color: #6b7280; padding: 2px 8px; border-radius: 999px; }

[class$="-tagfeat"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-tagfeat-h"] { font-size: .85rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #9ca3af; margin-bottom: 10px; }
[class$="-tagfeat-main"] { display: block; padding: 12px 16px; background: var(--primary,#6366f1); color: #fff; text-decoration: none; border-radius: var(--radius,8px); font-weight: 700; font-size: 1.1rem; margin-bottom: 12px; text-align: center; }
[class$="-tagfeat-rest"] { display: flex; flex-wrap: wrap; gap: 6px; }
[class$="-tagfeat-small"] { padding: 5px 12px; background: var(--background,#f3f4f6); color: var(--text,#374151); text-decoration: none; border-radius: 999px; font-size: .8rem; transition: .15s; }
[class$="-tagfeat-small"]:hover { background: var(--primary,#6366f1); color: #fff; }

[class$="-tagcolor"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-tagcolor-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 12px; color: var(--text,#374151); }
[class$="-tagcolor-wrap"] { display: flex; flex-wrap: wrap; gap: 8px; }
[class$="-tagcolor-chip"] { padding: 5px 14px; color: #fff; text-decoration: none; border-radius: 999px; font-size: .82rem; font-weight: 600; transition: opacity .15s; }
[class$="-tagcolor-chip"]:hover { opacity: .85; }

[class$="-tagsinline"] { font-size: .875rem; padding: 12px 0; }
[class$="-tagsinline-label"] { font-weight: 600; color: #6b7280; }
[class$="-tagsinline-a"] { color: var(--primary,#6366f1); text-decoration: none; }
[class$="-tagsinline-a"]:hover { text-decoration: underline; }
[class$="-tagsinline-sep"] { color: #d1d5db; }

[class$="-tagaz"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-tagaz-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 12px; }
[class$="-tagaz-grid"] { display: grid; grid-template-columns: repeat(auto-fill,minmax(100px,1fr)); gap: 8px; }
[class$="-tagaz-item"] { padding: 8px 10px; border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); text-align: center; font-size: .82rem; color: var(--text,#374151); text-decoration: none; transition: .15s; }
[class$="-tagaz-item"]:hover { border-color: var(--primary,#6366f1); color: var(--primary,#6366f1); background: var(--background,#f5f3ff); }

/* =====================================================
   NEWSLETTER VARIANTS
   ===================================================== */

[class$="-nwslsplit"] { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 28px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); flex-wrap: wrap; }
[class$="-nwslsplit-left"] { display: flex; align-items: center; gap: 14px; flex: 1; min-width: 200px; }
[class$="-nwslsplit-icon"] { font-size: 1.8rem; }
[class$="-nwslsplit-h"] { font-size: 1rem; font-weight: 700; margin-bottom: 2px; }
[class$="-nwslsplit-p"] { font-size: .875rem; color: #6b7280; }
[class$="-nwslsplit-form"] { display: flex; gap: 8px; min-width: 260px; flex: 1; }
[class$="-nwslsplit-input"] { flex: 1; padding: 10px 14px; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-family: inherit; font-size: .9rem; }
[class$="-nwslsplit-btn"] { padding: 10px 20px; background: var(--primary,#6366f1); color: #fff; border: none; border-radius: var(--radius,8px); font-weight: 600; cursor: pointer; white-space: nowrap; }

[class$="-nwsllist"] { padding: 24px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-nwsllist-h"] { font-size: 1.1rem; font-weight: 700; margin-bottom: 14px; }
[class$="-nwsllist-ul"] { list-style: none; margin-bottom: 18px; }
[class$="-nwsllist-li"] { padding: 6px 0; font-size: .9rem; color: #374151; }
[class$="-nwsllist-form"] { display: flex; gap: 8px; }
[class$="-nwsllist-input"] { flex: 1; padding: 10px 14px; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-family: inherit; }
[class$="-nwsllist-btn"] { padding: 10px 20px; background: var(--primary,#6366f1); color: #fff; border: none; border-radius: var(--radius,8px); font-weight: 600; cursor: pointer; }

[class$="-nwslmin"] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: .9rem; padding: 12px 16px; background: var(--background,#f9fafb); border-radius: var(--radius,8px); }
[class$="-nwslmin-pre"] { font-weight: 600; white-space: nowrap; }
[class$="-nwslmin-form"] { display: flex; gap: 6px; flex: 1; min-width: 200px; }
[class$="-nwslmin-input"] { flex: 1; padding: 8px 12px; border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-family: inherit; font-size: .875rem; }
[class$="-nwslmin-btn"] { padding: 8px 14px; background: var(--primary,#6366f1); color: #fff; border: none; border-radius: var(--radius,8px); font-weight: 700; cursor: pointer; }

[class$="-nwslhero"] { padding: 40px 20px; text-align: center; background: linear-gradient(135deg, var(--primary,#6366f1), var(--secondary,#4f46e5)); border-radius: var(--radius,8px); }
[class$="-nwslhero-inner"] { max-width: 500px; margin: 0 auto; }
[class$="-nwslhero-h"] { font-size: 1.8rem; font-weight: 800; color: #fff; margin-bottom: 8px; }
[class$="-nwslhero-sub"] { color: rgba(255,255,255,.85); margin-bottom: 24px; }
[class$="-nwslhero-form"] { display: flex; gap: 8px; max-width: 400px; margin: 0 auto; flex-wrap: wrap; }
[class$="-nwslhero-input"] { flex: 1; padding: 12px 16px; border: none; border-radius: var(--radius,8px); font-family: inherit; min-width: 180px; }
[class$="-nwslhero-btn"] { padding: 12px 24px; background: #fff; color: var(--primary,#6366f1); border: none; border-radius: var(--radius,8px); font-weight: 700; cursor: pointer; }

[class$="-nwslcard"] { text-align: center; padding: 28px; background: var(--card,#fff); border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-nwslcard-icon"] { font-size: 2rem; margin-bottom: 10px; }
[class$="-nwslcard-h"] { font-size: 1.1rem; font-weight: 700; margin-bottom: 6px; }
[class$="-nwslcard-p"] { color: #6b7280; font-size: .875rem; margin-bottom: 18px; }
[class$="-nwslcard-form"] { display: flex; flex-direction: column; gap: 10px; max-width: 320px; margin: 0 auto; }
[class$="-nwslcard-input"] { padding: 10px 14px; border: 2px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); font-family: inherit; text-align: center; }
[class$="-nwslcard-btn"] { display: block; width: 100%; }

[class$="-nwslnews"] { }
[class$="-nwslnews-rule"] { height: 2px; background: var(--text,#1f2937); margin: 8px 0; }
[class$="-nwslnews-inner"] { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 0; flex-wrap: wrap; }
[class$="-nwslnews-text"] { flex: 1; }
[class$="-nwslnews-label"] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #9ca3af; }
[class$="-nwslnews-desc"] { font-size: .9rem; color: var(--text,#374151); font-family: Georgia,serif; }
[class$="-nwslnews-form"] { display: flex; gap: 6px; }
[class$="-nwslnews-input"] { padding: 8px 12px; border: 1px solid var(--text,#1f2937); font-family: Georgia,serif; }
[class$="-nwslnews-btn"] { padding: 8px 16px; background: var(--text,#1f2937); color: #fff; border: none; cursor: pointer; }

/* =====================================================
   FEATURED-POST VARIANTS
   ===================================================== */

[class$="-featnum"] { display: flex; gap: 20px; align-items: flex-start; padding: 24px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-featnum-number"] { font-size: 4rem; font-weight: 900; color: var(--primary,#6366f1); opacity: .2; line-height: 1; flex-shrink: 0; }
[class$="-featnum-body"] { flex: 1; }
[class$="-featnum-label"] { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--primary,#6366f1); margin-bottom: 6px; display: block; }
[class$="-featnum-title"] { font-size: 1.2rem; font-weight: 700; margin-bottom: 10px; line-height: 1.3; }
[class$="-featnum-a"] { color: var(--text,#1f2937); text-decoration: none; }
[class$="-featnum-text"] { color: #6b7280; font-size: .9rem; margin-bottom: 14px; line-height: 1.6; }
[class$="-featnum-btn"] { display: inline-block; }

[class$="-featquote"] { padding: 24px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-featquote-bq"] { border-left: 4px solid var(--primary,#6366f1); padding: 12px 20px; margin-bottom: 16px; background: var(--background,#f9fafb); border-radius: 0 var(--radius,8px) var(--radius,8px) 0; font-style: italic; line-height: 1.7; }
[class$="-featquote-mark"] { font-size: 2rem; color: var(--primary,#6366f1); line-height: 1; display: block; margin-bottom: 4px; }
[class$="-featquote-source"] { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
[class$="-featquote-title"] { font-weight: 700; color: var(--text,#1f2937); text-decoration: none; font-size: .95rem; }
[class$="-featquote-link"] { font-size: .875rem; color: var(--primary,#6366f1); font-weight: 600; text-decoration: none; }

[class$="-featmin"] { padding: 16px 20px; border-left: 4px solid var(--primary,#6366f1); background: var(--card,#fff); }
[class$="-featmin-tag"] { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--primary,#6366f1); display: block; margin-bottom: 6px; }
[class$="-featmin-title"] { display: block; font-weight: 700; font-size: 1rem; color: var(--text,#1f2937); text-decoration: none; margin-bottom: 4px; line-height: 1.4; }
[class$="-featmin-date"] { font-size: .8rem; color: #9ca3af; }

[class$="-featedit"] { padding: 20px 0; }
[class$="-featedit-rule"] { height: 2px; background: var(--text,#1f2937); margin: 8px 0; }
[class$="-featedit-label"] { font-size: .65rem; font-weight: 800; text-transform: uppercase; letter-spacing: .15em; color: var(--primary,#6366f1); margin: 6px 0; display: block; }
[class$="-featedit-title"] { font-size: 1.4rem; font-weight: 900; margin: 8px 0; font-family: Georgia,serif; line-height: 1.25; }
[class$="-featedit-a"] { color: var(--text,#1f2937); text-decoration: none; }
[class$="-featedit-text"] { color: #6b7280; font-size: .9rem; line-height: 1.6; margin-bottom: 8px; }

[class$="-feataccent"] { display: flex; gap: 0; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); overflow: hidden; }
[class$="-feataccent-bar"] { width: 5px; background: linear-gradient(180deg,var(--primary,#6366f1),var(--accent,#f59e0b)); flex-shrink: 0; }
[class$="-feataccent-body"] { padding: 20px; flex: 1; }
[class$="-feataccent-label"] { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--primary,#6366f1); display: block; margin-bottom: 8px; }
[class$="-feataccent-title"] { font-size: 1.1rem; font-weight: 700; margin-bottom: 10px; line-height: 1.35; }
[class$="-feataccent-a"] { color: var(--text,#1f2937); text-decoration: none; }
[class$="-feataccent-desc"] { color: #6b7280; font-size: .9rem; margin-bottom: 14px; line-height: 1.6; }

[class$="-featcover"] { display: flex; gap: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); overflow: hidden; }
[class$="-featcover-art"] { width: 100px; background: linear-gradient(135deg,var(--primary,#6366f1),var(--accent,#f59e0b)); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
[class$="-featcover-initial"] { font-size: 3rem; font-weight: 900; color: rgba(255,255,255,.5); font-family: Georgia,serif; }
[class$="-featcover-info"] { padding: 20px; flex: 1; }
[class$="-featcover-issue"] { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--primary,#6366f1); display: block; margin-bottom: 8px; }
[class$="-featcover-title"] { font-size: 1.05rem; font-weight: 700; margin-bottom: 8px; line-height: 1.35; }
[class$="-featcover-a"] { color: var(--text,#1f2937); text-decoration: none; }
[class$="-featcover-desc"] { color: #6b7280; font-size: .875rem; margin-bottom: 14px; line-height: 1.55; }
@media(max-width:480px){ [class$="-featcover-art"]{ width:60px; } [class$="-featcover-initial"]{ font-size:2rem; } }

/* =====================================================
   QUOTE-BLOCK VARIANTS
   ===================================================== */

[class$="-quotetypo"] { text-align: center; padding: 32px 20px; position: relative; }
[class$="-quotetypo-wrap"] { position: relative; display: inline-block; max-width: 600px; }
[class$="-quotetypo-open"] { font-size: 6rem; line-height: .8; color: var(--primary,#6366f1); opacity: .15; font-family: Georgia,serif; display: block; }
[class$="-quotetypo-close"] { font-size: 6rem; line-height: .4; color: var(--primary,#6366f1); opacity: .15; font-family: Georgia,serif; display: block; text-align: right; }
[class$="-quotetypo-text"] { font-size: 1.15rem; line-height: 1.7; font-style: italic; color: var(--text,#374151); font-family: Georgia,serif; margin: -20px 0; }
[class$="-quotetypo-cite"] { display: block; font-size: .85rem; font-weight: 600; color: #9ca3af; margin-top: 16px; }

[class$="-quotebubble"] { max-width: 400px; }
[class$="-quotebubble-text"] { background: var(--primary,#6366f1); color: #fff; padding: 16px 20px; border-radius: 18px 18px 18px 4px; line-height: 1.65; font-size: .95rem; }
[class$="-quotebubble-arrow"] { width: 0; height: 0; border-left: 12px solid var(--primary,#6366f1); border-top: 8px solid transparent; border-bottom: 8px solid transparent; margin-left: 20px; }
[class$="-quotebubble-author"] { margin-left: 12px; margin-top: 4px; font-size: .8rem; font-weight: 600; color: #6b7280; }

[class$="-quotepull"] { padding: 8px 20px; }
[class$="-quotepull-rule"] { height: 2px; background: var(--primary,#6366f1); }
[class$="-quotepull-text"] { font-size: 1.15rem; font-style: italic; line-height: 1.7; padding: 16px 0; text-align: center; color: var(--text,#374151); font-family: Georgia,serif; }
[class$="-quotepull-author"] { text-align: right; font-size: .85rem; color: #9ca3af; padding-bottom: 8px; }

[class$="-quotedark"] { background: #1f2937; color: #f9fafb; padding: 24px; border-radius: var(--radius,8px); }
[class$="-quotedark-text"] { font-size: 1.05rem; line-height: 1.7; font-style: italic; margin-bottom: 12px; }
[class$="-quotedark-author"] { font-size: .85rem; color: #9ca3af; font-weight: 600; }

[class$="-quotecenter"] { text-align: center; padding: 24px; }
[class$="-quotecenter-deco"] { color: var(--primary,#6366f1); font-size: 1.2rem; margin: 8px 0; display: block; }
[class$="-quotecenter-text"] { font-size: 1.05rem; line-height: 1.7; color: var(--text,#374151); font-style: italic; max-width: 500px; margin: 0 auto 12px; }
[class$="-quotecenter-by"] { font-size: .85rem; color: #9ca3af; font-weight: 600; }

/* =====================================================
   AUTHOR-CARD VARIANTS
   ===================================================== */

[class$="-authortw"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-authortw-header"] { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
[class$="-authortw-av"] { width: 48px; height: 48px; border-radius: 50%; background: var(--primary,#6366f1); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 1rem; flex-shrink: 0; }
[class$="-authortw-name"] { font-weight: 700; font-size: .95rem; display: block; }
[class$="-authortw-handle"] { font-size: .8rem; color: #9ca3af; }
[class$="-authortw-bio"] { font-size: .875rem; color: #6b7280; line-height: 1.55; margin-bottom: 14px; }
[class$="-authortw-follow"] { display: inline-block; padding: 7px 20px; background: var(--text,#1f2937); color: #fff; text-decoration: none; border-radius: 999px; font-size: .85rem; font-weight: 700; transition: .15s; }
[class$="-authortw-follow"]:hover { background: var(--primary,#6366f1); }

[class$="-authorbyline"] { }
[class$="-authorbyline-rule"] { height: 1px; background: var(--border,#e5e7eb); margin: 8px 0; }
[class$="-authorbyline-inner"] { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; padding: 10px 0; font-size: .9rem; }
[class$="-authorbyline-pre"] { color: #9ca3af; font-size: .8rem; font-style: italic; }
[class$="-authorbyline-name"] { font-weight: 700; color: var(--text,#1f2937); }
[class$="-authorbyline-sep"] { color: #d1d5db; }
[class$="-authorbyline-bio"] { color: #6b7280; }

[class$="-authorstat"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-authorstat-top"] { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
[class$="-authorstat-av"] { width: 48px; height: 48px; border-radius: 50%; background: var(--primary,#6366f1); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 1rem; flex-shrink: 0; }
[class$="-authorstat-name"] { font-weight: 700; font-size: .95rem; display: block; }
[class$="-authorstat-domain"] { font-size: .8rem; color: #9ca3af; }
[class$="-authorstat-desc"] { font-size: .875rem; color: #6b7280; margin-bottom: 14px; line-height: 1.55; }
[class$="-authorstat-nums"] { display: flex; gap: 20px; padding-top: 12px; border-top: 1px solid var(--border,#f3f4f6); }
[class$="-authorstat-num"] { text-align: center; }
[class$="-authorstat-val"] { display: block; font-size: 1.4rem; font-weight: 800; color: var(--primary,#6366f1); }
[class$="-authorstat-lbl"] { font-size: .72rem; color: #9ca3af; text-transform: uppercase; letter-spacing: .05em; }

[class$="-authorhoriz"] { display: flex; align-items: center; gap: 14px; padding: 16px 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-authorhoriz-av"] { width: 44px; height: 44px; border-radius: 50%; background: var(--primary,#6366f1); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; }
[class$="-authorhoriz-body"] { flex: 1; min-width: 0; }
[class$="-authorhoriz-name"] { font-weight: 700; font-size: .9rem; display: block; margin-bottom: 2px; }
[class$="-authorhoriz-desc"] { font-size: .8rem; color: #6b7280; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[class$="-authorhoriz-btn"] { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; background: var(--background,#f3f4f6); border-radius: 50%; color: var(--primary,#6366f1); text-decoration: none; font-weight: 700; flex-shrink: 0; transition: .15s; }
[class$="-authorhoriz-btn"]:hover { background: var(--primary,#6366f1); color: #fff; }

[class$="-authorbanner"] { background: linear-gradient(135deg,var(--primary,#6366f1),var(--secondary,#4f46e5)); border-radius: var(--radius,8px); overflow: hidden; }
[class$="-authorbanner-inner"] { display: flex; align-items: center; gap: 20px; padding: 20px 24px; flex-wrap: wrap; }
[class$="-authorbanner-av"] { width: 56px; height: 56px; border-radius: 50%; background: rgba(255,255,255,.25); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.2rem; flex-shrink: 0; }
[class$="-authorbanner-center"] { flex: 1; min-width: 150px; }
[class$="-authorbanner-title"] { font-size: 1.05rem; font-weight: 700; color: #fff; margin-bottom: 4px; }
[class$="-authorbanner-desc"] { font-size: .875rem; color: rgba(255,255,255,.8); line-height: 1.5; }
[class$="-authorbanner-right"] { flex-shrink: 0; }

/* =====================================================
   RECENT-POSTS VARIANTS
   ===================================================== */

[class$="-recentcolor"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-recentcolor-h"] { font-size: .9rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; margin-bottom: 14px; }
[class$="-recentcolor-row"] { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-recentcolor-n"] { font-size: 1.3rem; font-weight: 900; min-width: 32px; line-height: 1; }
[class$="-recentcolor-body"] { flex: 1; min-width: 0; }
[class$="-recentcolor-a"] { font-size: .875rem; font-weight: 600; color: var(--text,#374151); text-decoration: none; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[class$="-recentcolor-a"]:hover { color: var(--primary,#6366f1); }
[class$="-recentcolor-date"] { font-size: .75rem; color: #9ca3af; display: block; margin-top: 2px; }

[class$="-recentrt"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-recentrt-h"] { font-size: .9rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; margin-bottom: 14px; }
[class$="-recentrt-item"] { display: flex; justify-content: space-between; align-items: baseline; padding: 9px 0; border-bottom: 1px solid var(--border,#f3f4f6); gap: 12px; }
[class$="-recentrt-a"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
[class$="-recentrt-a"]:hover { color: var(--primary,#6366f1); }
[class$="-recentrt-meta"] { flex-shrink: 0; }
[class$="-recentrt-time"] { font-size: .75rem; color: #9ca3af; }

[class$="-recenthoriz"] { }
[class$="-recenthoriz-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 10px; }
[class$="-recenthoriz-track"] { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scroll-snap-type: x mandatory; }
[class$="-recenthoriz-card"] { min-width: 150px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); padding: 12px; text-decoration: none; scroll-snap-align: start; flex-shrink: 0; transition: .15s; }
[class$="-recenthoriz-card"]:hover { border-color: var(--primary,#6366f1); }
[class$="-recenthoriz-title"] { display: block; font-size: .8rem; font-weight: 600; color: var(--text,#374151); margin-bottom: 6px; line-height: 1.4; }
[class$="-recenthoriz-date"] { font-size: .72rem; color: #9ca3af; }

[class$="-recentnews"] { }
[class$="-recentnews-rule"] { height: 2px; background: var(--text,#1f2937); margin: 6px 0; }
[class$="-recentnews-head"] { font-size: .65rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; padding: 4px 0; color: #9ca3af; }
[class$="-recentnews-list"] { list-style: none; }
[class$="-recentnews-item"] { padding: 7px 0; border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-recentnews-a"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; font-family: Georgia,serif; }
[class$="-recentnews-a"]:hover { color: var(--primary,#6366f1); }

[class$="-recentcal"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-recentcal-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 14px; }
[class$="-recentcal-row"] { display: flex; align-items: center; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-recentcal-date"] { text-align: center; min-width: 36px; flex-shrink: 0; }
[class$="-recentcal-day"] { display: block; font-size: 1.4rem; font-weight: 800; color: var(--primary,#6366f1); line-height: 1; }
[class$="-recentcal-mon"] { font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; color: #9ca3af; }
[class$="-recentcal-a"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; line-height: 1.4; }
[class$="-recentcal-a"]:hover { color: var(--primary,#6366f1); }

[class$="-recentpin"] { }
[class$="-recentpin-main"] { display: block; padding: 14px 16px; background: linear-gradient(135deg,var(--primary,#6366f1),var(--secondary,#4f46e5)); color: #fff; border-radius: var(--radius,8px); font-weight: 700; font-size: .95rem; text-decoration: none; margin-bottom: 14px; line-height: 1.4; }
[class$="-recentpin-tag"] { display: inline-block; font-size: .68rem; background: rgba(255,255,255,.25); padding: 2px 8px; border-radius: 999px; margin-bottom: 6px; font-weight: 600; }
[class$="-recentpin-list"] { list-style: none; }
[class$="-recentpin-item"] { padding: 7px 0; border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-recentpin-a"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; }
[class$="-recentpin-a"]:hover { color: var(--primary,#6366f1); }

[class$="-recenttwo"] { }
[class$="-recenttwo-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 12px; }
[class$="-recenttwo-grid"] { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
[class$="-recenttwo-item"] { display: flex; flex-direction: column; gap: 4px; padding: 10px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); text-decoration: none; transition: .15s; }
[class$="-recenttwo-item"]:hover { border-color: var(--primary,#6366f1); }
[class$="-recenttwo-title"] { font-size: .8rem; font-weight: 600; color: var(--text,#374151); line-height: 1.4; }
[class$="-recenttwo-date"] { font-size: .72rem; color: #9ca3af; }

/* =====================================================
   RELATED-POSTS VARIANTS
   ===================================================== */

[class$="-relnews"] { margin-top: 28px; }
[class$="-relnews-rule"] { height: 2px; background: var(--text,#1f2937); margin: 6px 0; }
[class$="-relnews-h"] { font-size: .65rem; font-weight: 800; text-transform: uppercase; letter-spacing: .15em; color: #9ca3af; padding: 4px 0; }
[class$="-relnews-cols"] { display: grid; grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); gap: 16px; padding: 12px 0; }
[class$="-relnews-col"] {}
[class$="-relnews-a"] { font-size: .9rem; font-weight: 700; color: var(--text,#1f2937); text-decoration: none; display: block; margin-bottom: 6px; font-family: Georgia,serif; line-height: 1.35; }
[class$="-relnews-a"]:hover { color: var(--primary,#6366f1); }
[class$="-relnews-date"] { font-size: .75rem; color: #9ca3af; }

[class$="-relthumb"] { margin-top: 28px; }
[class$="-relthumb-h"] { font-size: 1.1rem; font-weight: 700; margin-bottom: 16px; }
[class$="-relthumb-grid"] { display: grid; grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); gap: 16px; }
[class$="-relthumb-card"] { background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); overflow: hidden; transition: .2s; }
[class$="-relthumb-card"]:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.1); }
[class$="-relthumb-img"] { height: 80px; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; font-weight: 900; color: rgba(255,255,255,.5); }
[class$="-relthumb-body"] { padding: 12px; }
[class$="-relthumb-a"] { font-size: .875rem; font-weight: 600; color: var(--text,#374151); text-decoration: none; display: block; margin-bottom: 6px; line-height: 1.4; }
[class$="-relthumb-a"]:hover { color: var(--primary,#6366f1); }
[class$="-relthumb-date"] { font-size: .75rem; color: #9ca3af; }

[class$="-relarrow"] { margin-top: 28px; padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-relarrow-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 12px; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; }
[class$="-relarrow-item"] { display: flex; align-items: center; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--border,#f3f4f6); text-decoration: none; transition: .15s; }
[class$="-relarrow-item"]:hover [class$="-relarrow-icon"] { color: var(--primary,#6366f1); transform: translateX(3px); }
[class$="-relarrow-text"] { font-size: .875rem; color: var(--text,#374151); font-weight: 500; flex: 1; }
[class$="-relarrow-icon"] { color: #9ca3af; transition: .15s; flex-shrink: 0; margin-left: 8px; }

[class$="-relscroll"] { margin-top: 28px; }
[class$="-relscroll-h"] { font-size: 1.1rem; font-weight: 700; margin-bottom: 14px; }
[class$="-relscroll-track"] { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; }
[class$="-relscroll-card"] { min-width: 220px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); padding: 16px; scroll-snap-align: start; flex-shrink: 0; }
[class$="-relscroll-title"] { display: block; font-size: .875rem; font-weight: 700; color: var(--text,#374151); text-decoration: none; margin-bottom: 8px; line-height: 1.4; }
[class$="-relscroll-title"]:hover { color: var(--primary,#6366f1); }
[class$="-relscroll-text"] { font-size: .8rem; color: #6b7280; line-height: 1.55; }

[class$="-releditor"] { margin-top: 28px; }
[class$="-releditor-h"] { font-size: 1.1rem; font-weight: 700; margin-bottom: 16px; }
[class$="-releditor-main"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); margin-bottom: 14px; }
[class$="-releditor-pick"] { display: inline-block; font-size: .72rem; font-weight: 700; background: var(--primary,#6366f1); color: #fff; padding: 3px 10px; border-radius: 999px; margin-bottom: 8px; }
[class$="-releditor-title"] { font-size: 1.05rem; font-weight: 700; margin-bottom: 8px; line-height: 1.35; }
[class$="-releditor-a"] { color: var(--text,#1f2937); text-decoration: none; }
[class$="-releditor-a"]:hover { color: var(--primary,#6366f1); }
[class$="-releditor-text"] { color: #6b7280; font-size: .9rem; line-height: 1.6; }
[class$="-releditor-rest"] { display: flex; flex-direction: column; gap: 8px; }
[class$="-releditor-item"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; padding: 8px 12px; background: var(--background,#f9fafb); border-radius: var(--radius,8px); transition: .15s; }
[class$="-releditor-item"]:hover { background: var(--primary,#6366f1); color: #fff; }

/* =====================================================
   HERO VARIANTS
   ===================================================== */

[class$="-herodark"] { padding: 56px 20px; background: #0f172a; border-radius: var(--radius,8px); position: relative; overflow: hidden; text-align: center; }
[class$="-herodark-deco"] { position: absolute; inset: 0; pointer-events: none; }
[class$="-herodark-dot"] { display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: rgba(255,255,255,.15); margin: 8px; }
[class$="-herodark-inner"] { position: relative; z-index: 1; max-width: 580px; margin: 0 auto; }
[class$="-herodark-title"] { font-size: clamp(1.6rem,4vw,2.4rem); font-weight: 800; color: #fff; margin-bottom: 12px; }
[class$="-herodark-desc"] { color: rgba(255,255,255,.7); margin-bottom: 24px; line-height: 1.65; }
[class$="-herodark-btn"] { display: inline-block; padding: 12px 28px; background: var(--primary,#6366f1); color: #fff; text-decoration: none; border-radius: var(--radius,8px); font-weight: 700; transition: .2s; }

[class$="-heronum"] { padding: 36px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-heronum-inner"] { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
[class$="-heronum-left"] { flex: 1; min-width: 200px; }
[class$="-heronum-tag"] { display: inline-block; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--primary,#6366f1); margin-bottom: 8px; }
[class$="-heronum-title"] { font-size: clamp(1.4rem,3vw,2rem); font-weight: 800; margin-bottom: 10px; }
[class$="-heronum-desc"] { color: #6b7280; line-height: 1.65; }
[class$="-heronum-right"] { display: none; }
[class$="-heronum-big"] { font-size: 6rem; line-height: 1; color: var(--primary,#6366f1); opacity: .15; }
@media(min-width:600px){ [class$="-heronum-right"]{ display:block; } }

[class$="-herosearch"] { padding: 48px 20px; background: linear-gradient(135deg,var(--primary,#6366f1),var(--secondary,#4f46e5)); border-radius: var(--radius,8px); text-align: center; }
[class$="-herosearch-inner"] { max-width: 560px; margin: 0 auto; }
[class$="-herosearch-title"] { font-size: clamp(1.5rem,4vw,2.2rem); font-weight: 800; color: #fff; margin-bottom: 10px; }
[class$="-herosearch-sub"] { color: rgba(255,255,255,.8); margin-bottom: 24px; }
[class$="-herosearch-box"] { display: flex; background: #fff; border-radius: 999px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,.15); max-width: 440px; margin: 0 auto; }
[class$="-herosearch-input"] { flex: 1; border: none; padding: 12px 20px; font-family: inherit; font-size: .95rem; background: transparent; }
[class$="-herosearch-input"]:focus { outline: none; }
[class$="-herosearch-btn"] { background: var(--accent,#f59e0b); border: none; padding: 12px 20px; cursor: pointer; border-radius: 0; font-size: 1rem; transition: .15s; }

[class$="-herobar"] { padding: 24px; border-bottom: 3px solid var(--primary,#6366f1); }
[class$="-herobar-inner"] { max-width: 700px; text-align: center; margin: 0 auto; }
[class$="-herobar-title"] { font-size: clamp(1.2rem,3vw,1.8rem); font-weight: 800; margin-bottom: 10px; }
[class$="-herobar-rule"] { width: 48px; height: 3px; background: var(--primary,#6366f1); margin: 12px auto; }
[class$="-herobar-desc"] { color: #6b7280; line-height: 1.65; }

[class$="-herocard"] { position: relative; border-radius: var(--radius,8px); overflow: hidden; min-height: 260px; display: flex; align-items: center; justify-content: center; }
[class$="-herocard-bg"] { position: absolute; inset: 0; background: linear-gradient(135deg,var(--primary,#6366f1),var(--accent,#f59e0b)); opacity: .9; }
[class$="-herocard-box"] { position: relative; z-index: 1; text-align: center; padding: 40px 24px; max-width: 520px; }
[class$="-herocard-title"] { font-size: clamp(1.4rem,4vw,2rem); font-weight: 800; color: #fff; margin-bottom: 10px; }
[class$="-herocard-desc"] { color: rgba(255,255,255,.85); margin-bottom: 20px; }
[class$="-herocard-cta"] { display: inline-block; padding: 11px 28px; background: #fff; color: var(--primary,#6366f1); text-decoration: none; border-radius: var(--radius,8px); font-weight: 700; transition: .2s; }

[class$="-herotri"] { padding: 28px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-herotri-top"] { text-align: center; margin-bottom: 24px; }
[class$="-herotri-title"] { font-size: clamp(1.3rem,3vw,1.8rem); font-weight: 800; }
[class$="-herotri-cols"] { display: grid; grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); gap: 16px; }
[class$="-herotri-col"] { text-align: center; padding: 16px; background: var(--background,#f9fafb); border-radius: var(--radius,8px); font-size: .875rem; color: #6b7280; line-height: 1.5; }
[class$="-herotri-icon"] { display: block; font-size: 1.5rem; margin-bottom: 8px; }

[class$="-heroquote"] { padding: 40px 20px; text-align: center; }
[class$="-heroquote-inner"] { max-width: 560px; margin: 0 auto; }
[class$="-heroquote-text"] { font-size: clamp(1rem,3vw,1.3rem); font-style: italic; line-height: 1.7; color: var(--text,#374151); font-family: Georgia,serif; margin-bottom: 16px; }
[class$="-heroquote-cite"] { display: block; font-size: .9rem; font-weight: 700; color: var(--primary,#6366f1); margin-bottom: 20px; font-style: normal; }
[class$="-heroquote-link"] { display: inline-block; padding: 10px 24px; background: var(--primary,#6366f1); color: #fff; text-decoration: none; border-radius: var(--radius,8px); font-weight: 700; }

/* =====================================================
   TOP-POSTS VARIANTS
   ===================================================== */

[class$="-toptable"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); overflow-x: auto; }
[class$="-toptable-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 14px; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; }
[class$="-toptable-t"] { width: 100%; border-collapse: collapse; font-size: .875rem; }
[class$="-toptable-t"] th { text-align: left; padding: 8px 10px; color: #9ca3af; font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; border-bottom: 2px solid var(--border,#e5e7eb); }
[class$="-toptable-row"] { border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-toptable-row"] td { padding: 10px; }
[class$="-toptable-pos"] { font-weight: 800; color: var(--primary,#6366f1); opacity: .5; width: 32px; }
[class$="-toptable-a"] { color: var(--text,#374151); text-decoration: none; font-weight: 500; }
[class$="-toptable-a"]:hover { color: var(--primary,#6366f1); }
[class$="-toptable-views"] { color: #9ca3af; text-align: right; white-space: nowrap; }

[class$="-topmin"] { padding: 16px 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-topmin-h"] { font-size: .85rem; font-weight: 700; margin-bottom: 10px; }
[class$="-topmin-row"] { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-topmin-dot"] { width: 6px; height: 6px; border-radius: 50%; background: var(--primary,#6366f1); flex-shrink: 0; }
[class$="-topmin-a"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; }
[class$="-topmin-a"]:hover { color: var(--primary,#6366f1); }

[class$="-topscroll"] { }
[class$="-topscroll-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 12px; }
[class$="-topscroll-track"] { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 4px; scroll-snap-type: x mandatory; }
[class$="-topscroll-item"] { min-width: 180px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); padding: 14px; scroll-snap-align: start; flex-shrink: 0; }
[class$="-topscroll-n"] { display: block; font-size: 1.6rem; font-weight: 900; color: var(--primary,#6366f1); opacity: .25; line-height: 1; margin-bottom: 6px; }
[class$="-topscroll-title"] { display: block; font-size: .875rem; font-weight: 600; color: var(--text,#374151); text-decoration: none; margin-bottom: 6px; line-height: 1.4; }
[class$="-topscroll-views"] { font-size: .75rem; color: #9ca3af; }

[class$="-topmedal"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-topmedal-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 14px; }
[class$="-topmedal-row"] { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border,#f3f4f6); }
[class$="-topmedal-icon"] { font-size: 1.4rem; flex-shrink: 0; width: 28px; text-align: center; }
[class$="-topmedal-body"] { flex: 1; min-width: 0; }
[class$="-topmedal-a"] { font-size: .875rem; font-weight: 600; color: var(--text,#374151); text-decoration: none; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
[class$="-topmedal-a"]:hover { color: var(--primary,#6366f1); }
[class$="-topmedal-stars"] { font-size: .8rem; color: #f59e0b; display: block; margin-top: 2px; }

[class$="-topline"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-topline-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 14px; }
[class$="-topline-list"] { position: relative; padding-left: 20px; }
[class$="-topline-list"]::before { content:''; position:absolute; left:8px; top:0; bottom:0; width:2px; background:var(--border,#e5e7eb); }
[class$="-topline-item"] { display: flex; align-items: center; gap: 12px; padding: 8px 0; position: relative; }
[class$="-topline-marker"] { position: absolute; left: -20px; width: 18px; height: 18px; border-radius: 50%; background: var(--primary,#6366f1); color: #fff; font-size: .65rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
[class$="-topline-a"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; }
[class$="-topline-a"]:hover { color: var(--primary,#6366f1); }

[class$="-toptiles"] { }
[class$="-toptiles-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 12px; }
[class$="-toptiles-grid"] { display: grid; grid-template-columns: repeat(auto-fill,minmax(140px,1fr)); gap: 10px; }
[class$="-toptiles-tile"] { display: flex; align-items: flex-start; gap: 8px; padding: 12px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); text-decoration: none; transition: .15s; }
[class$="-toptiles-tile"]:hover { border-color: var(--primary,#6366f1); background: var(--background,#f5f3ff); }
[class$="-toptiles-n"] { font-size: .75rem; font-weight: 800; color: var(--primary,#6366f1); opacity: .5; flex-shrink: 0; }
[class$="-toptiles-t"] { font-size: .8rem; font-weight: 600; color: var(--text,#374151); line-height: 1.4; }

[class$="-topbar"] { padding: 20px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-topbar-h"] { font-size: .9rem; font-weight: 700; margin-bottom: 14px; }
[class$="-topbar-item"] { margin-bottom: 12px; }
[class$="-topbar-a"] { display: block; font-size: .875rem; color: var(--text,#374151); text-decoration: none; margin-bottom: 5px; font-weight: 500; }
[class$="-topbar-a"]:hover { color: var(--primary,#6366f1); }
[class$="-topbar-track"] { height: 4px; background: var(--border,#e5e7eb); border-radius: 2px; overflow: hidden; }
[class$="-topbar-fill"] { height: 100%; background: var(--primary,#6366f1); border-radius: 2px; min-width: 4px; }
[class$="-topbar-views"] { font-size: .72rem; color: #9ca3af; margin-top: 4px; display: block; }

/* =====================================================
   SIDEBAR VARIANTS (new)
   ===================================================== */

[class$="-sbare"] { display: flex; flex-direction: column; gap: 20px; }
[class$="-sbare-block"] { padding-bottom: 20px; border-bottom: 1px solid var(--border,#e5e7eb); }
[class$="-sbare-h"] { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #9ca3af; margin-bottom: 12px; }
[class$="-sbare-list"] { list-style: none; display: flex; flex-direction: column; gap: 4px; }
[class$="-sbare-item"] { padding: 4px 0; }
[class$="-sbare-a"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; transition: .15s; }
[class$="-sbare-a"]:hover { color: var(--primary,#6366f1); }
[class$="-sbare-total"] { font-size: .78rem; color: #9ca3af; margin-top: 8px; }
[class$="-sbare-desc"] { font-size: .875rem; color: #6b7280; line-height: 1.55; }
[class$="-sbare-sitemap"] { font-size: .8rem; color: var(--primary,#6366f1); text-decoration: none; display: block; margin-top: 8px; }

[class$="-sgrad"] { display: flex; flex-direction: column; gap: 20px; }
[class$="-sgrad-card"] { background: var(--card,#fff); border-radius: var(--radius,8px); overflow: hidden; border: 1px solid var(--border,#e5e7eb); }
[class$="-sgrad-head"] { background: linear-gradient(135deg,var(--primary,#6366f1),var(--secondary,#4f46e5)); padding: 12px 16px; }
[class$="-sgrad-h"] { font-size: .85rem; font-weight: 700; color: #fff; }
[class$="-sgrad-list"] { list-style: none; padding: 8px 0; }
[class$="-sgrad-item"] { display: flex; align-items: center; gap: 8px; padding: 8px 16px; transition: background .15s; }
[class$="-sgrad-item"]:hover { background: var(--background,#f5f3ff); }
[class$="-sgrad-bullet"] { color: var(--primary,#6366f1); font-size: .8rem; }
[class$="-sgrad-a"] { font-size: .875rem; color: var(--text,#374151); text-decoration: none; line-height: 1.4; }
[class$="-sgrad-a"]:hover { color: var(--primary,#6366f1); }
[class$="-sgrad-info"] { padding: 16px; background: var(--card,#fff); border: 1px solid var(--border,#e5e7eb); border-radius: var(--radius,8px); }
[class$="-sgrad-domain"] { font-weight: 700; font-size: .9rem; display: block; margin-bottom: 4px; }
[class$="-sgrad-desc"] { font-size: .85rem; color: #6b7280; line-height: 1.5; }

/* =====================================================
   MOBILE
   ===================================================== */

@media (max-width: 640px) {
    [class$="-nwslsplit"] { flex-direction: column; }
    [class$="-featcover"] { flex-direction: column; }
    [class$="-featcover-art"] { width: 100%; height: 60px; }
    [class$="-featnum"] { flex-direction: column; gap: 10px; }
    [class$="-featnum-number"] { font-size: 3rem; }
    [class$="-heronum-inner"] { flex-direction: column; }
    [class$="-authorbanner-inner"] { flex-direction: column; text-align: center; }
    [class$="-stepform-step"] { flex-direction: column; gap: 8px; }
    [class$="-cgrid-wrap"] { grid-template-columns: 1fr; }
    [class$="-recenttwo-grid"] { grid-template-columns: 1fr; }
    [class$="-toptiles-grid"] { grid-template-columns: repeat(2,1fr); }
}
