.mk-comments-area { --fg:        var(--mc-text, #14151a);
--muted:     var(--mc-text-muted, #5b616b);
--card:      var(--mc-card-bg, #fff);
--surface:   var(--mc-surface2, #f2f3f6);
--line:      rgba(var(--mc-border-rgb, 221, 224, 230), .9);
--accent:    var(--mc-primary, #7c3aed);
--accent-2:  var(--mc-secondary, #a855f7);
--accent-rgb: var(--mc-primary-rgb, 124, 58, 237);
--radius:    16px;
--radius-sm: 11px;
margin-top: 10px;
color: var(--fg);
font-family: inherit;
}
.mk-comments-area *,
.mk-comments-area *::before,
.mk-comments-area *::after { box-sizing: border-box; } .manga-comment-login-wall {
display: flex;
flex-direction: column;
align-items: center;
gap: 14px;
padding: 46px 30px 42px;
background: var(--card);
background-image: linear-gradient(150deg, rgba(var(--accent-rgb), .10), rgba(var(--mc-secondary-rgb, 168, 85, 247), .04));
border: 1px solid var(--line);
border-radius: var(--radius);
text-align: center;
}
.mk-login-wall__icon {
font-size: 50px;
line-height: 1;
color: var(--accent);
animation: mk-icon-float 3.2s ease-in-out infinite;
}
@keyframes mk-icon-float {
0%, 100% { transform: translateY(0); }
50%      { transform: translateY(-7px); }
}
.mk-login-wall__title {
margin: 0;
font-size: 22px;
font-weight: 850;
color: var(--fg);
}
.mk-login-wall__desc,
.mk-login-wall__xp {
margin: 0;
font-size: 14px;
line-height: 1.6;
color: var(--muted);
max-width: 46ch;
}
.mk-login-wall__xp b { color: var(--accent); font-weight: 850; }
.mk-login-wall__actions {
display: flex;
gap: 12px;
flex-wrap: wrap;
justify-content: center;
margin-top: 6px;
} .mk-comments-area .mk-btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 11px 24px;
border-radius: var(--radius-sm);
font-size: 14px;
font-weight: 800;
text-decoration: none !important;
cursor: pointer;
transition: transform .15s ease, box-shadow .2s ease, filter .15s ease, border-color .2s ease, color .2s ease;
}
.mk-comments-area .mk-btn:hover { transform: translateY(-2px); } .mk-comments-area .mk-btn--primary {
background: var(--accent);
color: var(--mc-on-primary, #fff) !important;
border: 2px solid var(--accent);
box-shadow: 0 10px 26px -14px rgba(var(--accent-rgb), .9);
}
.mk-comments-area .mk-btn--primary:hover {
filter: brightness(.92);
color: var(--mc-on-primary, #fff) !important;
} .mk-comments-area .mk-btn--secondary {
background: var(--mc-surface, #fff);
color: var(--fg) !important;
border: 2px solid rgba(var(--mc-text-rgb, 20, 21, 26), .22);
}
.mk-comments-area .mk-btn--secondary:hover {
border-color: var(--accent);
color: var(--accent) !important;
background: var(--mc-surface, #fff);
} .manga-comment-login-wall.has-bg .mk-login-wall__title,
.manga-comment-login-wall.has-bg .mk-login-wall__desc,
.manga-comment-login-wall.has-bg .mk-login-wall__xp { color: #f5f6f8; }
.manga-comment-login-wall.has-bg .mk-login-wall__xp b { color: #fff; }
.manga-comment-login-wall.has-bg .mk-btn--secondary {
background: rgba(255, 255, 255, .10);
color: #fff !important;
border-color: rgba(255, 255, 255, .55);
}
.manga-comment-login-wall.has-bg .mk-btn--secondary:hover {
background: rgba(255, 255, 255, .2);
color: #fff !important;
} .mk-reactions-bar {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px;
padding: 0 0 16px;
border-bottom: 1px solid var(--line);
margin-bottom: 20px;
}
.mk-reactions-label {
font-size: 11px;
font-weight: 800;
color: var(--muted);
text-transform: uppercase;
letter-spacing: .06em;
white-space: nowrap;
margin-right: 2px;
}
.mk-reaction-btn {
display: inline-flex;
align-items: center;
gap: 7px;
padding: 7px 14px;
background: var(--surface);
border: 1px solid var(--line);
border-radius: 999px;
color: var(--fg);
font-size: 13px;
font-family: inherit;
line-height: 1;
cursor: pointer;
transition: background .18s ease, border-color .18s ease, color .18s ease, transform .1s ease, box-shadow .2s ease;
}
.mk-reaction-btn:hover {
border-color: rgba(var(--accent-rgb), .5);
transform: translateY(-1px);
box-shadow: 0 6px 16px -10px rgba(var(--accent-rgb), .9);
}
.mk-reaction-btn:active { transform: translateY(0); }
.mk-reaction-btn.mk-reaction-active {
background: rgba(var(--accent-rgb), .14);
border-color: rgba(var(--accent-rgb), .7);
color: var(--accent);
font-weight: 800;
}
.mk-reaction-icon { font-size: 16px; line-height: 1; }
.mk-reaction-count { font-size: 12px; font-weight: 800; min-width: 12px; text-align: center; } .mk-comment-form {
background: var(--card);
border: 1px solid var(--line);
border-radius: var(--radius);
padding: 22px;
margin-top: 12px;
}
.mk-comments-area .comment-reply-title,
.mk-cform__title {
font-size: 16px;
font-weight: 850;
color: var(--fg);
margin: 0 0 16px;
letter-spacing: .01em;
}
.mk-comments-area .comment-reply-title small { display: inline-block; margin-left: 10px; }
.mk-comments-area .comment-reply-title small a {
font-size: 12.5px;
font-weight: 700;
color: var(--mc-danger, #ef4444);
text-decoration: none;
} .mk-cform__me {
display: flex;
align-items: center;
gap: 12px;
padding: 10px 12px;
margin-bottom: 14px;
background: var(--surface);
border: 1px solid var(--line);
border-radius: var(--radius-sm);
} .mk-cform__me-av { flex: 0 0 auto; display: block; }
.mk-cform__me-info { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.mk-cform__me-info > strong { font-size: 14.5px; font-weight: 800; color: var(--fg); }
.mk-cform__me-pills { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } .mk-cform__me-pills .mk-level-pill { display: inline-flex; margin-top: 0; max-width: none; } .mk-kaomoji {
background: var(--surface);
border: 1px solid var(--line);
border-radius: var(--radius-sm);
padding: 10px 10px 8px;
margin-bottom: 12px;
} .mk-kaomoji__moods {
display: flex;
gap: 6px;
overflow-x: auto;
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px solid var(--line);
scrollbar-width: thin;
scrollbar-color: rgba(var(--accent-rgb), .5) transparent;
-webkit-overflow-scrolling: touch;
}
.mk-kaomoji__mood {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
gap: 6px;
padding: 6px 12px;
background: var(--card);
border: 1px solid var(--line);
border-radius: 999px;
color: var(--muted);
font-size: 12.5px;
font-weight: 750;
font-family: inherit;
line-height: 1.4;
white-space: nowrap;
cursor: pointer;
transition: background .16s ease, color .16s ease, border-color .16s ease, transform .1s ease;
}
.mk-kaomoji__mood:hover {
color: var(--fg);
border-color: rgba(var(--accent-rgb), .45);
}
.mk-kaomoji__mood.is-active {
background: linear-gradient(135deg, var(--accent), var(--accent-2));
border-color: transparent;
color: var(--mc-on-primary, #fff);
box-shadow: 0 8px 20px -12px rgba(var(--accent-rgb), 1);
}
.mk-kaomoji__mood-ic { font-size: 15px; line-height: 1; } .mk-kaomoji__strip { position: relative; }
.mk-kaomoji__strip[hidden] { display: none; }
.mk-kaomoji__rail {
display: flex;
gap: 6px;
overflow-x: auto;
overflow-y: hidden;
padding: 2px 26px 8px 2px; scroll-snap-type: x proximity;
scrollbar-width: thin;
scrollbar-color: rgba(var(--accent-rgb), .5) transparent;
-webkit-overflow-scrolling: touch;
}
.mk-kaomoji__rail::-webkit-scrollbar { height: 6px; }
.mk-kaomoji__rail::-webkit-scrollbar-track { background: transparent; }
.mk-kaomoji__rail::-webkit-scrollbar-thumb {
background: rgba(var(--accent-rgb), .45);
border-radius: 999px;
}
.mk-kaomoji__rail:focus-visible { outline: 2px solid rgba(var(--accent-rgb), .6); outline-offset: 2px; border-radius: 8px; }
.mk-kaomoji__btn {
flex: 0 0 auto;
scroll-snap-align: start;
padding: 6px 11px;
background: var(--card);
border: 1px solid var(--line);
border-radius: 9px;
color: var(--fg);
font-size: 13.5px;
font-family: inherit;
line-height: 1.6;
white-space: nowrap;
cursor: pointer;
transition: background .14s ease, border-color .14s ease, transform .1s ease;
}
.mk-kaomoji__btn:hover {
background: rgba(var(--accent-rgb), .12);
border-color: rgba(var(--accent-rgb), .5);
transform: translateY(-1px);
}
.mk-kaomoji__btn:active { transform: scale(.96); } .mk-kaomoji__fade {
position: absolute;
top: 0;
right: 0;
bottom: 8px;
width: 34px;
pointer-events: none;
background: linear-gradient(90deg, transparent, var(--surface) 82%);
border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
} .mk-cform__tools {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 8px;
}
.mk-tool {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 6px 12px;
background: var(--surface);
border: 1px solid var(--line);
border-radius: 999px;
color: var(--fg);
font-size: 12.5px;
font-weight: 750;
font-family: inherit;
cursor: pointer;
transition: background .16s ease, border-color .16s ease;
}
.mk-tool:hover { background: rgba(var(--accent-rgb), .12); border-color: rgba(var(--accent-rgb), .5); }
.mk-cform__counter {
margin-left: auto;
font-size: 12px;
font-weight: 700;
color: var(--muted);
white-space: nowrap;
}
.mk-cform__counter.is-near { color: var(--mc-warning, #f59e0b); }
.mk-cform__counter.is-full { color: var(--mc-danger, #ef4444); } .mk-comment-form .comment-form-comment,
.mk-cform__box { margin: 0; }
.mk-comments-area textarea#comment,
.mk-cform__textarea {
width: 100%;
min-height: 128px;
padding: 14px 16px;
background: var(--mc-surface, #fff);
border: 1px solid var(--line);
border-radius: var(--radius-sm);
color: var(--fg);
font-family: inherit;
font-size: 14.5px;
line-height: 1.7;
resize: vertical;
transition: border-color .2s ease, box-shadow .2s ease;
}
.mk-comments-area textarea#comment::placeholder { color: var(--muted); opacity: .85; }
.mk-comments-area textarea#comment:focus {
outline: none;
border-color: rgba(var(--accent-rgb), .8);
box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .18);
}
.mk-cform__hint {
margin: 12px 0 0;
font-size: 12.5px;
line-height: 1.6;
color: var(--muted);
}
.mk-comments-area .form-submit { margin: 14px 0 0; } .mk-submit-btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 26px;
background: linear-gradient(135deg, var(--accent), var(--accent-2));
color: var(--mc-on-primary, #fff) !important;
border: 0;
border-radius: var(--radius-sm);
font-size: 14px;
font-weight: 850;
font-family: inherit;
cursor: pointer;
transition: transform .15s ease, box-shadow .2s ease, filter .15s ease;
box-shadow: 0 12px 26px -14px rgba(var(--accent-rgb), 1);
}
.mk-submit-btn:hover { transform: translateY(-2px); filter: brightness(1.08); }
.mk-submit-btn:active { transform: translateY(0); }
.mk-submit-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; } .mk-cform__msg { margin: 10px 0 0; font-size: 13px; font-weight: 700; }
.mk-cform__msg.is-err { color: var(--mc-danger, #ef4444); }
.mk-cform__msg.is-ok  { color: var(--mc-success, #22c55e); } .mk-comments-header { margin: 28px 0 16px; }
.mk-comments-title {
font-size: 15px;
font-weight: 850;
color: var(--fg);
margin: 0;
text-transform: uppercase;
letter-spacing: .07em;
padding-left: 12px;
border-left: 4px solid var(--accent);
}
.mk-comments-count { color: var(--accent); } .mk-comment-list {
list-style: none;
padding: 0;
margin: 0 0 24px;
}
.mk-comment-list .children {
list-style: none;
padding-left: 24px;
margin-top: 10px;
border-left: 2px solid var(--line);
}
.mk-comment-card {
border-radius: var(--radius);
margin-bottom: 12px;
transition: box-shadow .25s ease, border-color .25s ease;
}
.mk-comment-body {
display: flex;
align-items: flex-start;
gap: 14px;
background: var(--card);
border: 1px solid var(--line);
border-left: 3px solid var(--mk-tier-c, var(--accent));
border-radius: var(--radius);
padding: 16px 18px;
}
.mk-comment-card:hover > .mk-comment-body {
border-color: rgba(var(--accent-rgb), .45);
border-left-color: var(--mk-tier-c, var(--accent));
box-shadow: 0 14px 34px -24px rgba(0, 0, 0, .8);
} .mk-comment-card--reply > .mk-comment-body { background: var(--surface); }
.mk-comment-main {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: 8px;
}
.mk-comment-meta {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 5px 10px;
}
.mk-comment-author {
display: inline-flex;
align-items: center;
gap: 6px;
flex-wrap: wrap;
font-weight: 850;
font-size: 14.5px;
color: var(--fg);
}
.mk-comment-date {
font-size: 12px;
color: var(--muted);
text-decoration: none !important;
transition: color .15s;
}
.mk-comment-date:hover { color: var(--accent); }
.mk-comment-actions {
margin-left: auto;
display: flex;
align-items: center;
gap: 8px;
flex-shrink: 0;
}
.mk-reply-link a,
.mk-edit-link a {
font-size: 12px;
font-weight: 700;
color: var(--muted);
text-decoration: none !important;
padding: 4px 10px;
border: 1px solid var(--line);
border-radius: 7px;
transition: border-color .15s, color .15s, background .15s;
}
.mk-reply-link a:hover,
.mk-edit-link a:hover {
color: var(--accent);
border-color: rgba(var(--accent-rgb), .55);
background: rgba(var(--accent-rgb), .08);
}
.mk-comment-pending {
font-size: 11px;
font-style: normal;
font-weight: 700;
color: var(--mc-warning, #f59e0b);
background: rgba(var(--mc-warning-rgb, 245, 158, 11), .14);
padding: 3px 9px;
border-radius: 6px;
}
.mk-comment-content {
font-size: 14.5px;
line-height: 1.75;
color: var(--fg);
word-wrap: break-word;
overflow-wrap: anywhere;
}
.mk-comment-content p { margin: 0 0 8px; }
.mk-comment-content p:last-child { margin-bottom: 0; } .mk-spoiler {
display: inline;
padding: 1px 6px;
border-radius: 5px;
background: var(--mc-surface3, #e7e9ef);
color: transparent;
text-shadow: 0 0 9px rgba(var(--mc-text-rgb, 20, 21, 26), .85);
cursor: pointer;
user-select: none;
transition: color .18s ease, text-shadow .18s ease, background .18s ease;
}
.mk-spoiler:hover { background: rgba(var(--accent-rgb), .16); }
.mk-spoiler.is-open {
color: var(--fg);
text-shadow: none;
background: rgba(var(--accent-rgb), .10);
user-select: text;
cursor: auto;
} .mk-comment-avatar {
display: flex;
flex-direction: column;
align-items: center;
gap: 5px;
flex-shrink: 0; width: var(--mk-frame-w, 66px);
}
.mk-avafr {
--fr-w:  var(--mk-frame-w, 66px); --fr-ar: 1; --fr-av: 46%; --fr-x:  50%; --fr-y:  50%; position: relative;
display: block;
width: var(--fr-w);
aspect-ratio: var(--fr-ar);
flex: 0 0 auto;
}
.mk-avafr__img {
position: absolute;
left: var(--fr-x);
top: var(--fr-y);
transform: translate(-50%, -50%);
width: var(--fr-av);
height: auto;
aspect-ratio: 1;
border-radius: 50%;
object-fit: cover;
display: block;
z-index: 1;
border: 0;
margin: 0;
}
.mk-avafr__frame {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: contain;
z-index: 2;
pointer-events: none; border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
} .mk-avafr.is-plain {
width: var(--fr-plain, 48px);
aspect-ratio: 1;
margin: 0 auto;
}
.mk-avafr.is-plain .mk-avafr__img {
position: static;
transform: none;
width: 100%;
height: 100%;
border: 2px solid var(--mk-tier-c, var(--line));
} .mk-cform__me-av .mk-avafr { --fr-w: 54px; --fr-plain: 44px; }
.mk-cform__me-av .mk-avafr.is-plain .mk-avafr__img { border-width: 2px; } .mk-pill {
display: inline-flex;
align-items: center;
background: var(--mk-badge-color, #a855f7);
color: #fff;
padding: 2px 8px;
border-radius: 999px;
font-size: 10px;
font-weight: 850;
letter-spacing: .5px;
text-transform: uppercase;
line-height: 1.5;
white-space: nowrap;
user-select: none;
vertical-align: middle;
}
.mk-level-pill {
display: block;
text-align: center;
background: var(--mk-tier-c, var(--mk-badge-color, #a855f7));
font-size: 9.5px;
padding: 2px 6px 3px;
border-radius: 6px;
max-width: 58px;
margin-top: 2px;
overflow: hidden;
text-overflow: ellipsis;
}
.mk-rank-pill { font-size: 9.5px; padding: 2px 8px 3px; }
.mk-staff-pill {
background: var(--mc-danger, #ef4444);
font-size: 9.5px;
padding: 2px 8px 3px;
} .mk-xp-chip {
display: inline-flex;
align-items: center;
gap: 3px;
font-size: 11.5px;
font-weight: 800;
color: var(--accent);
background: rgba(var(--accent-rgb), .12);
border: 1px solid rgba(var(--accent-rgb), .25);
padding: 1px 8px;
border-radius: 999px;
white-space: nowrap;
} .mk-tier-aprendiz  { --mk-tier-c: #64748b; }
.mk-tier-fanatico  { --mk-tier-c: #10b981; }
.mk-tier-otaku     { --mk-tier-c: #3b82f6; }
.mk-tier-sensei    { --mk-tier-c: #f59e0b; }
.mk-tier-kami      { --mk-tier-c: #ef4444; }
.mk-tier-celestial { --mk-tier-c: #a855f7; } .mk-pill.mk-tier-kami { box-shadow: 0 0 9px rgba(239, 68, 68, .55); }
.mk-pill.mk-tier-celestial {
background: linear-gradient(90deg, #7b2ff7 0%, #f107a3 100%) !important;
animation: mk-badge-shimmer 3.5s ease-in-out infinite;
}
@keyframes mk-badge-shimmer {
0%, 100% { box-shadow: 0 0 6px  rgba(123, 47, 247, .35); }
50%      { box-shadow: 0 0 17px rgba(241, 7, 163, .45); }
} .mk-creacts {
display: flex;
flex-wrap: wrap;
gap: 5px;
margin-top: 2px;
}
.mk-creact {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 3px 9px;
background: var(--surface);
border: 1px solid var(--line);
border-radius: 999px;
color: var(--muted);
font-size: 12px;
font-family: inherit;
line-height: 1.5;
cursor: pointer;
transition: background .15s ease, border-color .15s ease, transform .1s ease, opacity .15s ease;
}
.mk-creact__e { font-size: 14px; line-height: 1; filter: grayscale(.35); transition: filter .15s ease; }
.mk-creact__n { font-weight: 800; }
.mk-creact__n:empty { display: none; } .mk-creact.is-empty { opacity: .55; }
.mk-creact:hover {
opacity: 1;
border-color: rgba(var(--accent-rgb), .5);
transform: translateY(-1px);
}
.mk-creact:hover .mk-creact__e { filter: none; }
.mk-creact.is-on {
opacity: 1;
background: rgba(var(--accent-rgb), .14);
border-color: rgba(var(--accent-rgb), .65);
color: var(--accent);
}
.mk-creact.is-on .mk-creact__e { filter: none; transform: scale(1.05); }
.mk-creact:disabled { cursor: default; } .mk-comments-area .comment-navigation,
.mk-comments-area .comments-pagination {
display: flex;
gap: 8px;
flex-wrap: wrap;
margin: 20px 0;
}
.mk-comments-area .comments-pagination .page-numbers {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 7px 13px;
border: 1px solid var(--line);
border-radius: 9px;
color: var(--muted);
font-size: 13px;
font-weight: 750;
text-decoration: none;
transition: color .15s, border-color .15s, background .15s;
}
.mk-comments-area .comments-pagination .page-numbers:hover,
.mk-comments-area .comments-pagination .page-numbers.current {
color: var(--accent);
border-color: rgba(var(--accent-rgb), .55);
background: rgba(var(--accent-rgb), .08);
}
.mk-comments-closed {
text-align: center;
color: var(--muted);
font-size: 14px;
padding: 26px;
border: 1px dashed var(--line);
border-radius: var(--radius);
margin: 0;
}  body.text-ui-dark .mk-comment-body { box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
body.text-ui-dark .mk-comment-card:hover > .mk-comment-body { box-shadow: 0 12px 28px -20px rgba(0, 0, 0, .45); }
body.text-ui-dark .manga-comment-login-wall { box-shadow: 0 10px 30px -26px rgba(0, 0, 0, .6); }
body.text-ui-dark .mk-comment-form { box-shadow: 0 10px 30px -26px rgba(0, 0, 0, .5); } body.text-ui-dark .mk-spoiler { background: #dfe2e8; text-shadow: 0 0 9px rgba(20, 21, 26, .8); } body.text-ui-light .mk-spoiler { background: #23232c; text-shadow: 0 0 9px rgba(245, 246, 248, .8); }
body.text-ui-light .mk-avafr.is-plain .mk-avafr__img { border-color: rgba(255, 255, 255, .14); } @media (max-width: 600px) {
.manga-comment-login-wall { padding: 36px 18px 32px; }
.mk-login-wall__actions { flex-direction: column; width: 100%; }
.mk-comments-area .mk-btn { justify-content: center; width: 100%; }
.mk-comment-form { padding: 16px 14px; }
.mk-comment-body { padding: 14px; gap: 11px; }
.mk-comment-actions { margin-left: 0; width: 100%; }
.mk-comment-list .children { padding-left: 12px; }
.mk-kaomoji { padding: 8px 8px 6px; }
.mk-kaomoji__mood { font-size: 11.5px; padding: 5px 10px; }
.mk-kaomoji__mood-tx { display: inline; }
.mk-kaomoji__btn { font-size: 12.5px; padding: 5px 9px; } .mk-comment-avatar { width: var(--mk-frame-w-sm, 54px); }
.mk-avafr { --fr-w: var(--mk-frame-w-sm, 54px); --fr-plain: 42px; }
} @media (max-width: 420px) {
.mk-kaomoji__mood-tx { display: none; }
.mk-kaomoji__mood { padding: 6px 10px; }
.mk-kaomoji__mood.is-active .mk-kaomoji__mood-tx { display: inline; }
}
@media (prefers-reduced-motion: reduce) {
.mk-login-wall__icon,
.mk-pill.mk-tier-celestial { animation: none; }
.mk-comments-area * { transition-duration: .01ms !important; }
}  .mk-kaomoji__mood.is-tier--vip {
border-color: rgba(255, 206, 0, .38);
color: #ffce00;
}
.mk-kaomoji__mood.is-tier--vip.is-active {
background: rgba(255, 206, 0, .14);
border-color: rgba(255, 206, 0, .6);
}
.mk-kaomoji__mood.is-tier--soberano {
border-color: rgba(255, 179, 64, .48);
color: #ffb340;
background: linear-gradient(135deg, rgba(255, 179, 64, .08), rgba(235, 51, 73, .06));
}
.mk-kaomoji__mood.is-tier--soberano.is-active {
background: linear-gradient(135deg, rgba(255, 179, 64, .2), rgba(235, 51, 73, .12));
border-color: rgba(255, 179, 64, .75);
}
.mk-kaomoji__lock {
font-size: 11px;
margin-right: 4px;
vertical-align: 1px;
} .mk-kaomoji__strip--vip .mk-kaomoji__rail,
.mk-kaomoji__strip--soberano .mk-kaomoji__rail {
background: linear-gradient(180deg, rgba(255, 206, 0, .05), transparent);
border-radius: 10px;
}
.mk-kaomoji__strip--vip .mk-kaomoji__btn:not(.is-locked) {
border-color: rgba(255, 206, 0, .3);
}
.mk-kaomoji__strip--vip .mk-kaomoji__btn:not(.is-locked):hover {
background: rgba(255, 206, 0, .14);
border-color: rgba(255, 206, 0, .55);
}
.mk-kaomoji__strip--soberano .mk-kaomoji__btn:not(.is-locked) {
border-color: rgba(255, 179, 64, .4);
background: linear-gradient(135deg, rgba(255, 179, 64, .07), rgba(235, 51, 73, .05));
}
.mk-kaomoji__strip--soberano .mk-kaomoji__btn:not(.is-locked):hover {
border-color: rgba(255, 179, 64, .7);
background: rgba(255, 179, 64, .16);
} .mk-kaomoji__btn.is-locked {
opacity: .45;
filter: grayscale(.6);
cursor: pointer;
}
.mk-kaomoji__btn.is-locked:hover {
opacity: .78;
filter: grayscale(.2);
transform: none;
background: rgba(var(--mc-text-rgb, 255, 255, 255), .05);
} .mk-comment-form {
position: relative;
overflow: hidden;
border-top: 2px solid transparent;
background-clip: padding-box;
}
.mk-comment-form::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0;
height: 2px;
background: linear-gradient(90deg, transparent, #eb3349 25%, #ffce00 50%, #eb3349 75%, transparent);
z-index: 1;
} .mk-comment-form::after {
content: '帝';
position: absolute;
right: -6px;
bottom: -22px;
font-size: 120px;
line-height: 1;
font-family: 'Yu Mincho', 'Hiragino Mincho ProN', 'Noto Serif JP', serif;
color: rgba(235, 51, 73, .07);
pointer-events: none;
user-select: none;
transform: rotate(-8deg);
z-index: 0;
}
.mk-comment-form > * { position: relative; z-index: 1; }
.mk-comment-form .mk-cform__textarea:focus {
border-color: rgba(235, 51, 73, .55);
box-shadow: 0 0 0 3px rgba(235, 51, 73, .12), 0 0 18px rgba(235, 51, 73, .08);
outline: none;
} .mk-imperial-seal {
position: absolute;
top: 10px;
right: 14px;
width: 84px;
height: 84px;
border: 3px double rgba(235, 51, 73, .9);
border-radius: 50%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1px;
color: #eb3349;
background: radial-gradient(circle, rgba(235, 51, 73, .1) 0%, transparent 70%);
transform: rotate(-14deg) scale(2.6);
opacity: 0;
z-index: 5;
pointer-events: none;
transition: transform .38s cubic-bezier(.22, 1.4, .36, 1), opacity .3s ease;
box-shadow: 0 0 0 1px rgba(235, 51, 73, .25), inset 0 0 12px rgba(235, 51, 73, .15);
}
.mk-imperial-seal.is-stamped { transform: rotate(-14deg) scale(1); opacity: 1; }
.mk-imperial-seal.is-fading  { opacity: 0; transition: opacity .9s ease; }
.mk-seal-kanji {
font-size: 30px;
line-height: 1;
font-weight: 700;
font-family: 'Yu Mincho', 'Hiragino Mincho ProN', 'Noto Serif JP', serif;
text-shadow: 0 0 6px rgba(235, 51, 73, .4);
}
.mk-seal-text {
font-size: 6.5px;
font-weight: 800;
letter-spacing: .14em;
text-transform: uppercase;
white-space: nowrap;
}
@keyframes mkSealShake {
0%, 100% { transform: translateY(0); }
20%      { transform: translateY(2px) rotate(.3deg); }
45%      { transform: translateY(-1px); }
70%      { transform: translateY(1px) rotate(-.2deg); }
}
.mk-seal-shake { animation: mkSealShake .45s ease; } @media (prefers-reduced-motion: reduce) {
.mk-imperial-seal { transition: opacity .2s ease; transform: rotate(-14deg) scale(1); }
.mk-seal-shake    { animation: none; }
} .mk-vip-pill {
display: inline-flex;
align-items: center;
gap: 4px;
margin-left: 7px;
padding: 2px 9px;
border-radius: 999px;
font-size: 10.5px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: .05em;
vertical-align: 1px;
white-space: nowrap;
}
.mk-vip-pill__ic { font-size: 11px; }
.mk-vip-pill--vip {
color: #ffce00;
background: rgba(255, 206, 0, .1);
border: 1px solid rgba(255, 206, 0, .4);
}
.mk-vip-pill--soberano {
color: #1a1206;
background: linear-gradient(135deg, #ffce00, #ffb340);
border: 1px solid #ffce00;
box-shadow: 0 0 10px rgba(255, 206, 0, .35);
} .mk-comment-card.mk-c-vip > .mk-comment-body {
border: 1px solid rgba(255, 206, 0, .35);
border-left: 3px solid #ffce00;
background:
linear-gradient(160deg, rgba(255, 206, 0, .05) 0%, transparent 40%),
var(--mk-bg-card, rgba(255, 255, 255, .02));
border-radius: var(--mk-radius, 12px);
box-shadow: 0 2px 14px rgba(255, 206, 0, .07);
} .mk-comment-card.mk-c-soberano > .mk-comment-body {
position: relative;
border: 1px solid transparent;
border-radius: var(--mk-radius, 12px);
background:
linear-gradient(160deg, rgba(20, 14, 6, .92), rgba(26, 16, 8, .9)) padding-box,
linear-gradient(120deg, #ffce00, #eb3349 35%, #ffb340 65%, #ffce00) border-box;
background-size: 100% 100%, 300% 300%;
animation: mkSoberanoBorder 6s linear infinite;
box-shadow: 0 3px 22px rgba(255, 179, 64, .14);
overflow: hidden;
}
@keyframes mkSoberanoBorder {
0%   { background-position: 0 0, 0% 50%; }
50%  { background-position: 0 0, 100% 50%; }
100% { background-position: 0 0, 0% 50%; }
}
@media (prefers-reduced-motion: reduce) {
.mk-comment-card.mk-c-soberano > .mk-comment-body { animation: none; }
} .mk-comment-card.mk-c-soberano > .mk-comment-body::after {
content: '帝';
position: absolute;
right: 4px;
bottom: -14px;
font-size: 72px;
line-height: 1;
font-family: 'Yu Mincho', 'Hiragino Mincho ProN', 'Noto Serif JP', serif;
color: rgba(255, 206, 0, .07);
pointer-events: none;
user-select: none;
transform: rotate(-10deg);
} .mk-comment-card.mk-c-vip .children .mk-comment-body,
.mk-comment-card.mk-c-soberano .children .mk-comment-body {
border: none;
background: none;
animation: none;
box-shadow: none;
}
.mk-comment-card.mk-c-soberano .children .mk-comment-body::after { content: none; } body.text-ui-dark .mk-comment-card.mk-c-vip > .mk-comment-body {
background: linear-gradient(160deg, rgba(255, 206, 0, .08) 0%, #ffffff 45%);
}
body.text-ui-dark .mk-comment-card.mk-c-soberano > .mk-comment-body {
background:
linear-gradient(160deg, #fffdf5, #fff8ea) padding-box,
linear-gradient(120deg, #eab308, #eb3349 35%, #f59e0b 65%, #eab308) border-box;
}   .mk-cframe-body { background: transparent !important; }
.mk-cframe-inner { padding: 0; } .mk-c-highlight > .mk-comment-body {
animation: mk-c-flash 1.8s ease-out 1;
}
@keyframes mk-c-flash {
0%   { box-shadow: 0 0 0 3px var(--mk-badge-color, var(--mc-accent, #eb3349)); }
100% { box-shadow: 0 0 0 3px transparent; }
}
@media (prefers-reduced-motion: reduce) {
.mk-c-highlight > .mk-comment-body { animation: none; outline: 2px solid var(--mc-accent, #eb3349); }
} .mk-cform__quota {
margin: 8px 0 0;
font-size: 13px;
line-height: 1.45;
opacity: .8; color: var(--mc-text-muted, #8a8a8a);
} .mk-submit-btn:disabled {
opacity: .55;
cursor: not-allowed;
filter: grayscale(.35);
} .mk-cform__banned {
display: flex;
gap: 14px;
align-items: flex-start;
margin: 0 0 22px;
padding: 16px 18px;
border-radius: 12px; background: color-mix(in srgb, var(--mc-danger, #eb3349) 10%, transparent);
border: 1px solid color-mix(in srgb, var(--mc-danger, #eb3349) 35%, transparent);
color: var(--mc-text, inherit);
}
.mk-cform__banned-icon {
font-size: 22px;
line-height: 1.2;
flex: 0 0 auto;
}
.mk-cform__banned strong {
display: block;
margin-bottom: 4px;
font-size: 15px;
}
.mk-cform__banned p {
margin: 0;
font-size: 13.5px;
line-height: 1.5;
opacity: .9;
} @supports not (color: color-mix(in srgb, red 10%, transparent)) {
.mk-cform__banned {
background: rgba(235, 51, 73, .1);
border-color: rgba(235, 51, 73, .35);
}
}