.sns-character-counter.sns-counter-lab,
.sns-character-counter.sns-counter-lab * {
    box-sizing: border-box;
}

.sns-character-counter.sns-counter-lab {
    --sns-paper: #f8ead2;
    --sns-paper-soft: #fff8ec;
    --sns-paper-deep: #eed6ad;
    --sns-line: #6b5745;
    --sns-line-soft: #b69a72;
    --sns-ink: #2f241c;
    --sns-muted: #6e5a46;
    --sns-cta: #f5dc99;
    --sns-cta-strong: #e7c66d;
    --sns-green: #dce8bc;
    --sns-green-ink: #27361f;
    --sns-blue: #d9e5f2;
    --sns-pink: #f0d9e5;
    --sns-warn: #f3d28d;
    --sns-danger: #efb2a3;
    --sns-shadow: 5px 5px 0 rgba(107, 87, 69, 0.18);
    width: min(1080px, calc(100% - 28px));
    margin: 28px auto;
    border: 2px solid var(--sns-line);
    border-radius: 0;
    background:
        linear-gradient(90deg, rgba(107, 87, 69, 0.055) 1px, transparent 1px),
        linear-gradient(0deg, rgba(107, 87, 69, 0.045) 1px, transparent 1px),
        var(--sns-paper);
    background-size: 22px 22px, 22px 22px, auto;
    color: var(--sns-ink);
    overflow: hidden;
    font-family: inherit;
}

.sns-character-counter.sns-counter-lab h2,
.sns-character-counter.sns-counter-lab h3,
.sns-character-counter.sns-counter-lab p,
.sns-character-counter.sns-counter-lab ul {
    margin: 0;
}

.sns-counter-lab__title {
    display: grid;
    gap: 6px;
    padding: 18px 20px 16px;
    background:
        linear-gradient(135deg, rgba(255, 252, 241, 0.96), rgba(245, 220, 153, 0.68)),
        var(--sns-paper-soft);
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.sns-counter-lab__kicker,
.sns-counter-lab__eyebrow,
.sns-counter-lab__hint {
    color: var(--sns-muted);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: -0.01em;
    line-height: 1.15;
}

.sns-counter-lab__kicker {
    width: max-content;
    padding: 5px 8px;
    border: 1px solid var(--sns-line-soft);
    background: rgba(255, 248, 236, 0.8);
}

.sns-counter-lab__title h2 {
    color: var(--sns-ink) !important;
    font-size: clamp(24px, 3.1vw, 34px) !important;
    font-weight: 950 !important;
    letter-spacing: -0.045em;
    line-height: 1.05 !important;
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.sns-counter-lab__title p {
    max-width: 760px;
    color: var(--sns-muted);
    font-size: 15px;
    font-weight: 760;
    line-height: 1.45;
    word-break: keep-all;
}

.sns-counter-lab__body {
    display: block;
    padding: 12px;
    border-top: 2px solid var(--sns-line);
    background: rgba(255, 248, 236, 0.46);
}

.sns-counter-lab__stack {
    display: grid;
    gap: 12px;
}

.sns-counter-lab__main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(330px, 0.88fr);
    gap: 12px;
    align-items: stretch;
}

.sns-counter-lab__support-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 0.72fr);
    gap: 12px;
    margin-top: 12px;
}

.sns-counter-lab__panel {
    min-width: 0;
    border: 2px solid var(--sns-line);
    border-radius: 0;
    background: var(--sns-paper-soft);
    box-shadow: var(--sns-shadow);
}

.sns-counter-lab__panel--editor,
.sns-counter-lab__panel--platforms {
    padding: 12px;
}

.sns-counter-lab__panel--tips,
.sns-counter-lab__panel--stats {
    padding: 10px;
}

.sns-counter-lab__panel-head {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 10px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px dashed var(--sns-line-soft);
}

.sns-counter-lab__panel-head--compact {
    margin-bottom: 8px;
}

.sns-counter-lab__panel-head h3 {
    color: var(--sns-ink) !important;
    font-size: 18px !important;
    font-weight: 950 !important;
    letter-spacing: -0.035em;
    line-height: 1.12 !important;
}

.sns-counter-lab__top-controls {
    display: grid;
    grid-template-columns: minmax(176px, 1fr) 96px 96px;
    gap: 8px;
    align-items: end;
    margin-bottom: 10px;
}

.sns-counter-lab__field {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.sns-counter-lab__field label,
.sns-counter-lab__textarea-label,
.sns-counter-lab__media-card label,
.sns-counter-lab__media-title {
    color: var(--sns-ink);
    font-size: 13px;
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.sns-counter-lab__textarea-label {
    display: block;
    margin-bottom: 5px;
}

.sns-character-counter.sns-counter-lab select,
.sns-character-counter.sns-counter-lab input[type="number"],
.sns-character-counter.sns-counter-lab textarea,
.sns-character-counter.sns-counter-lab button {
    border-radius: 0 !important;
    font-family: inherit !important;
}

.sns-character-counter.sns-counter-lab select,
.sns-character-counter.sns-counter-lab input[type="number"] {
    width: 100%;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 11px !important;
    border: 2px solid var(--sns-line) !important;
    background: #fff6e7 !important;
    color: var(--sns-ink) !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 38px !important;
    box-shadow: inset 2px 2px 0 rgba(107, 87, 69, 0.08) !important;
}

.sns-character-counter.sns-counter-lab input[type="number"] {
    text-align: center;
    font-weight: 950 !important;
    font-variant-numeric: tabular-nums;
    font-variation-settings: "wght" 950;
}

.sns-character-counter.sns-counter-lab input[type="number"]:disabled {
    background: #eadcc7 !important;
    color: #8a765f !important;
    opacity: 1 !important;
}

.sns-character-counter.sns-counter-lab textarea {
    display: block;
    width: 100%;
    min-height: 220px;
    max-height: 320px;
    padding: 14px !important;
    border: 2px solid var(--sns-line) !important;
    background: #fffaf0 !important;
    color: var(--sns-ink) !important;
    font-size: 16px !important;
    font-weight: 950 !important;
    line-height: 1.58 !important;
    resize: vertical;
    box-shadow: inset 3px 3px 0 rgba(107, 87, 69, 0.08) !important;
}

.sns-character-counter.sns-counter-lab textarea::placeholder {
    color: #9a8367;
    font-weight: 650;
}

.sns-character-counter.sns-counter-lab button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 12px !important;
    border: 2px solid var(--sns-line) !important;
    background: var(--sns-cta) !important;
    color: var(--sns-ink) !important;
    font-size: 14px !important;
    font-weight: 950 !important;
    line-height: 38px !important;
    letter-spacing: -0.025em;
    text-decoration: none !important;
    box-shadow: 3px 3px 0 rgba(107, 87, 69, 0.18) !important;
    cursor: pointer;
    transition: transform 0.12s ease, background-color 0.12s ease, box-shadow 0.12s ease;
}

.sns-character-counter.sns-counter-lab button:hover,
.sns-character-counter.sns-counter-lab button:focus-visible {
    background: var(--sns-cta-strong) !important;
    transform: translate(-1px, -1px);
    outline: 2px solid rgba(107, 87, 69, 0.35);
    outline-offset: 1px;
}

.sns-counter-lab__action--copy {
    background: #dce8bc !important;
}

.sns-counter-lab__action--reset {
    background: #faecd4 !important;
}

.sns-counter-lab__quick-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(188px, 220px);
    gap: 8px;
    align-items: stretch;
    margin-top: 8px;
}

.sns-counter-lab__quick-group,
.sns-counter-lab__action-group {
    display: grid;
    gap: 8px;
    min-width: 0;
    align-items: stretch;
}

.sns-counter-lab__quick-group {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sns-counter-lab__action-group {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sns-character-counter.sns-counter-lab .sns-counter-lab__quick {
    height: 42px !important;
    min-height: 42px !important;
    background: #faecd4 !important;
    font-size: 13px !important;
    line-height: 38px !important;
    box-shadow: none !important;
}

.sns-counter-lab__media-panel {
    margin-top: 10px;
    padding: 9px;
    border: 1px dashed var(--sns-line-soft);
    background: rgba(248, 234, 210, 0.74);
}

.sns-counter-lab__media-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 7px;
}

.sns-counter-lab__media-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 72px;
    gap: 7px;
    align-items: end;
    min-width: 0;
}

.sns-counter-lab__media-card label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 42px;
    padding: 0 8px;
    border: 2px solid var(--sns-line);
    background: #fff6e7;
    white-space: nowrap;
}

.sns-counter-lab__media-card input[type="checkbox"] {
    width: 16px;
    height: 16px;
    font-weight: 950;
    font-variation-settings: "wght" 950;
    accent-color: #6b5745;
}

.sns-counter-lab__summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}

.sns-counter-lab__metric,
.sns-counter-lab__stat {
    min-width: 0;
    border: 2px solid var(--sns-line);
    background: #faecd4;
    padding: 9px;
}

.sns-counter-lab__metric--main {
    background: var(--sns-green);
}

.sns-counter-lab__metric-label,
.sns-counter-lab__stat span {
    display: block;
    color: var(--sns-muted);
    font-size: 12px;
    font-weight: 850;
    line-height: 1.12;
}

.sns-counter-lab__metric-value,
.sns-counter-lab__stat strong {
    display: block;
    margin-top: 4px;
    color: var(--sns-ink);
    font-size: 24px;
    font-weight: 950;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.sns-counter-lab__platforms {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.sns-counter-lab__platform {
    display: grid;
    gap: 7px;
    padding: 10px;
    border: 2px solid var(--sns-line);
    background: #fff8ec;
    min-width: 0;
    transition: opacity 0.16s ease, transform 0.16s ease;
}

.sns-counter-lab__platform[data-sns="twitter"] { border-left-width: 6px; border-left-color: #31455d; }
.sns-counter-lab__platform[data-sns="threads"] { border-left-width: 6px; border-left-color: #4b4038; }
.sns-counter-lab__platform[data-sns="instagram"] { border-left-width: 6px; border-left-color: #af5c7a; }

.sns-counter-lab__platform-head,
.sns-counter-lab__platform-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
}

.sns-counter-lab__platform-name,
.sns-counter-lab__platform-row strong {
    color: var(--sns-ink);
    font-size: 15px;
    font-weight: 950;
    line-height: 1.1;
    letter-spacing: -0.025em;
}

.sns-counter-lab__platform-row span {
    color: var(--sns-muted);
    font-size: 12px;
    font-weight: 820;
    line-height: 1.15;
    text-align: right;
}

.sns-counter-lab__platform-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 26px;
    padding: 0 8px;
    border: 1px solid var(--sns-line);
    background: var(--sns-green);
    color: var(--sns-green-ink);
    font-size: 12px;
    font-weight: 950;
    line-height: 24px;
}

.sns-counter-lab__platform-status.warning { background: var(--sns-warn); color: #4c3214; }
.sns-counter-lab__platform-status.danger { background: var(--sns-danger); color: #4f1e15; }

.sns-counter-lab__progress {
    height: 10px;
    border: 1px solid var(--sns-line);
    background: #eadcc7;
    overflow: hidden;
}

.sns-counter-lab__progress-fill {
    display: block;
    width: 0;
    height: 100%;
    background: #4c6f50;
    transition: width 0.18s ease;
}

.sns-counter-lab__progress-fill.warning { background: #b9771c; }
.sns-counter-lab__progress-fill.danger { background: #a64230; }
.sns-counter-lab__progress-fill--twitter { background: #31455d; }
.sns-counter-lab__progress-fill--threads { background: #5d5148; }
.sns-counter-lab__progress-fill--instagram { background: #af5c7a; }

.sns-counter-lab__tips {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 8px;
}

.sns-counter-lab__tip {
    display: none;
    min-height: var(--sns-tip-sync-height, auto);
    padding: 9px;
    border: 1px solid var(--sns-line-soft);
    background: #fff8ec;
}

.sns-counter-lab__tip.is-active {
    display: grid;
    grid-template-rows: auto 1fr;
    height: 100%;
}

.sns-counter-lab__tip strong {
    display: block;
    color: var(--sns-ink);
    font-size: 14px;
    font-weight: 950;
    line-height: 1.18;
    margin-bottom: 5px;
}

.sns-counter-lab__tip ul {
    display: grid;
    gap: 4px;
    padding-left: 18px;
    color: var(--sns-muted);
    font-size: 13px;
    font-weight: 740;
    line-height: 1.38;
}

.sns-counter-lab__stats-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.sns-counter-lab__stat {
    padding: 8px;
    background: #fff8ec;
}

.sns-counter-lab__stat strong {
    font-size: 20px;
}

.sns-counter-lab__notice {
    margin-top: 12px !important;
    padding: 10px 12px;
    border: 2px solid var(--sns-line);
    background: #faecd4;
    color: var(--sns-muted);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.42;
    word-break: keep-all;
}

.sns-counter-lab__toast {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
    min-width: 210px;
    max-width: min(360px, calc(100vw - 32px));
    padding: 12px 16px;
    border: 2px solid var(--sns-line, #6b5745);
    border-radius: 0;
    background: #fff8ec;
    color: #2f241c;
    font-size: 14px;
    font-weight: 900;
    text-align: center;
    box-shadow: 5px 5px 0 rgba(107, 87, 69, 0.2);
    transform: translateX(calc(100% + 28px));
    transition: transform 0.18s ease;
}

.sns-counter-lab__toast.is-visible {
    transform: translateX(0);
}

.sns-counter-lab__toast--success { background: #dce8bc; }
.sns-counter-lab__toast--warning { background: #f3d28d; }
.sns-counter-lab__toast--info { background: #d9e5f2; }
.sns-counter-lab__toast--error { background: #efb2a3; }

body[data-scheme="dark"] .sns-character-counter.sns-counter-lab,
body[data-scheme="inverse"] .sns-character-counter.sns-counter-lab,
html[data-scheme="dark"] .sns-character-counter.sns-counter-lab,
html.theme-dark .sns-character-counter.sns-counter-lab {
    --sns-paper: #251f19;
    --sns-paper-soft: #302820;
    --sns-paper-deep: #3b3025;
    --sns-line: #d8bd8e;
    --sns-line-soft: #a88959;
    --sns-ink: #fff0d3;
    --sns-muted: #e2c99e;
    --sns-cta: #735a2c;
    --sns-cta-strong: #866835;
    --sns-green: #405235;
    --sns-green-ink: #f6f0d9;
    --sns-blue: #34485d;
    --sns-pink: #633447;
    --sns-warn: #70511f;
    --sns-danger: #74352d;
    --sns-shadow: 5px 5px 0 rgba(0, 0, 0, 0.34);
    background:
        linear-gradient(90deg, rgba(216, 189, 142, 0.08) 1px, transparent 1px),
        linear-gradient(0deg, rgba(216, 189, 142, 0.07) 1px, transparent 1px),
        var(--sns-paper);
}

body[data-scheme="dark"] .sns-counter-lab__title,
body[data-scheme="inverse"] .sns-counter-lab__title,
html[data-scheme="dark"] .sns-counter-lab__title,
html.theme-dark .sns-counter-lab__title {
    background: linear-gradient(135deg, #3b3025, #5b4827);
}

body[data-scheme="dark"] .sns-counter-lab__body,
body[data-scheme="inverse"] .sns-counter-lab__body,
html[data-scheme="dark"] .sns-counter-lab__body,
html.theme-dark .sns-counter-lab__body {
    background: rgba(24, 20, 17, 0.66);
}

body[data-scheme="dark"] .sns-counter-lab__panel,
body[data-scheme="inverse"] .sns-counter-lab__panel,
html[data-scheme="dark"] .sns-counter-lab__panel,
html.theme-dark .sns-counter-lab__panel,
body[data-scheme="dark"] .sns-counter-lab__platform,
body[data-scheme="inverse"] .sns-counter-lab__platform,
html[data-scheme="dark"] .sns-counter-lab__platform,
html.theme-dark .sns-counter-lab__platform,
body[data-scheme="dark"] .sns-counter-lab__tip,
body[data-scheme="inverse"] .sns-counter-lab__tip,
html[data-scheme="dark"] .sns-counter-lab__tip,
html.theme-dark .sns-counter-lab__tip,
body[data-scheme="dark"] .sns-counter-lab__stat,
body[data-scheme="inverse"] .sns-counter-lab__stat,
html[data-scheme="dark"] .sns-counter-lab__stat,
html.theme-dark .sns-counter-lab__stat {
    background: var(--sns-paper-soft);
}

body[data-scheme="dark"] .sns-counter-lab__metric,
body[data-scheme="inverse"] .sns-counter-lab__metric,
html[data-scheme="dark"] .sns-counter-lab__metric,
html.theme-dark .sns-counter-lab__metric,
body[data-scheme="dark"] .sns-counter-lab__notice,
body[data-scheme="inverse"] .sns-counter-lab__notice,
html[data-scheme="dark"] .sns-counter-lab__notice,
html.theme-dark .sns-counter-lab__notice,
body[data-scheme="dark"] .sns-counter-lab__media-panel,
body[data-scheme="inverse"] .sns-counter-lab__media-panel,
html[data-scheme="dark"] .sns-counter-lab__media-panel,
html.theme-dark .sns-counter-lab__media-panel {
    background: var(--sns-paper-deep);
}

body[data-scheme="dark"] .sns-character-counter.sns-counter-lab select,
body[data-scheme="dark"] .sns-character-counter.sns-counter-lab input[type="number"],
body[data-scheme="dark"] .sns-character-counter.sns-counter-lab textarea,
body[data-scheme="dark"] .sns-counter-lab__media-card label,
body[data-scheme="inverse"] .sns-character-counter.sns-counter-lab select,
body[data-scheme="inverse"] .sns-character-counter.sns-counter-lab input[type="number"],
body[data-scheme="inverse"] .sns-character-counter.sns-counter-lab textarea,
body[data-scheme="inverse"] .sns-counter-lab__media-card label,
html[data-scheme="dark"] .sns-character-counter.sns-counter-lab select,
html[data-scheme="dark"] .sns-character-counter.sns-counter-lab input[type="number"],
html[data-scheme="dark"] .sns-character-counter.sns-counter-lab textarea,
html[data-scheme="dark"] .sns-counter-lab__media-card label,
html.theme-dark .sns-character-counter.sns-counter-lab select,
html.theme-dark .sns-character-counter.sns-counter-lab input[type="number"],
html.theme-dark .sns-character-counter.sns-counter-lab textarea,
html.theme-dark .sns-counter-lab__media-card label {
    background: #241e19 !important;
    color: var(--sns-ink) !important;
}

body[data-scheme="dark"] .sns-counter-lab__kicker,
body[data-scheme="inverse"] .sns-counter-lab__kicker,
html[data-scheme="dark"] .sns-counter-lab__kicker,
html.theme-dark .sns-counter-lab__kicker {
    background: #302820;
    color: var(--sns-ink);
    border-color: var(--sns-line);
}

body[data-scheme="dark"] .sns-character-counter.sns-counter-lab .sns-counter-lab__quick,
body[data-scheme="inverse"] .sns-character-counter.sns-counter-lab .sns-counter-lab__quick,
html[data-scheme="dark"] .sns-character-counter.sns-counter-lab .sns-counter-lab__quick,
html.theme-dark .sns-character-counter.sns-counter-lab .sns-counter-lab__quick,
body[data-scheme="dark"] .sns-counter-lab__action--reset,
body[data-scheme="inverse"] .sns-counter-lab__action--reset,
html[data-scheme="dark"] .sns-counter-lab__action--reset,
html.theme-dark .sns-counter-lab__action--reset {
    background: #3b3025 !important;
    color: var(--sns-ink) !important;
}

body[data-scheme="dark"] .sns-counter-lab__action--copy,
body[data-scheme="inverse"] .sns-counter-lab__action--copy,
html[data-scheme="dark"] .sns-counter-lab__action--copy,
html.theme-dark .sns-counter-lab__action--copy {
    background: var(--sns-green) !important;
    color: var(--sns-green-ink) !important;
}

body[data-scheme="dark"] .sns-character-counter.sns-counter-lab input[type="number"]:disabled,
body[data-scheme="inverse"] .sns-character-counter.sns-counter-lab input[type="number"]:disabled,
html[data-scheme="dark"] .sns-character-counter.sns-counter-lab input[type="number"]:disabled,
html.theme-dark .sns-character-counter.sns-counter-lab input[type="number"]:disabled {
    background: #352b22 !important;
    color: #d4bd96 !important;
}

body[data-scheme="dark"] .sns-counter-lab__platform-status.safe,
body[data-scheme="inverse"] .sns-counter-lab__platform-status.safe,
html[data-scheme="dark"] .sns-counter-lab__platform-status.safe,
html.theme-dark .sns-counter-lab__platform-status.safe {
    background: var(--sns-green);
    color: var(--sns-green-ink);
}

body[data-scheme="dark"] .sns-counter-lab__progress,
body[data-scheme="inverse"] .sns-counter-lab__progress,
html[data-scheme="dark"] .sns-counter-lab__progress,
html.theme-dark .sns-counter-lab__progress {
    background: #1b1714;
}

@media (prefers-color-scheme: dark) {
    body:not([data-scheme="light"]) .sns-character-counter.sns-counter-lab {
        --sns-paper: #251f19;
        --sns-paper-soft: #302820;
        --sns-paper-deep: #3b3025;
        --sns-line: #d8bd8e;
        --sns-line-soft: #a88959;
        --sns-ink: #fff0d3;
        --sns-muted: #e2c99e;
        --sns-cta: #735a2c;
        --sns-cta-strong: #866835;
        --sns-green: #405235;
        --sns-green-ink: #f6f0d9;
        --sns-blue: #34485d;
        --sns-pink: #633447;
        --sns-warn: #70511f;
        --sns-danger: #74352d;
    }
}

@media (max-width: 880px) {
    .sns-character-counter.sns-counter-lab {
        width: min(100% - 22px, 720px);
        margin: 22px auto;
    }
    .sns-counter-lab__main-grid,
    .sns-counter-lab__support-grid,
    .sns-counter-lab__platforms,
    .sns-counter-lab__tips {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .sns-character-counter.sns-counter-lab {
        width: calc(100% - 14px);
        margin: 16px auto;
    }
    .sns-counter-lab__title {
        padding: 14px 12px 13px;
    }
    .sns-counter-lab__title h2 {
        font-size: 25px !important;
    }
    .sns-counter-lab__body {
        padding: 8px;
    }
    .sns-counter-lab__panel--editor,
    .sns-counter-lab__panel--platforms,
    .sns-counter-lab__panel--tips,
    .sns-counter-lab__panel--stats {
        padding: 9px;
    }
    .sns-counter-lab__top-controls {
        grid-template-columns: 1fr 1fr;
        gap: 7px;
    }
    .sns-counter-lab__field--select {
        grid-column: 1 / -1;
    }
    .sns-counter-lab__quick-row {
        grid-template-columns: 1fr;
        gap: 7px;
    }
    .sns-counter-lab__quick-group {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sns-counter-lab__action-group {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sns-counter-lab__media-grid,
    .sns-counter-lab__summary-grid,
    .sns-counter-lab__stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sns-counter-lab__media-card {
        grid-template-columns: 1fr;
    }
    .sns-counter-lab__media-card label {
        min-height: 38px;
    }
    .sns-character-counter.sns-counter-lab textarea {
        min-height: 190px;
        font-size: 15px !important;
    }
    .sns-counter-lab__platform-head,
    .sns-counter-lab__platform-row {
        align-items: flex-start;
    }
    .sns-counter-lab__platform-row {
        flex-direction: column;
        gap: 4px;
    }
    .sns-counter-lab__platform-row span {
        text-align: left;
    }
    .sns-counter-lab__toast {
        top: 12px;
        right: 8px;
        left: 8px;
        min-width: 0;
    }
}

@media (max-width: 370px) {
    .sns-counter-lab__quick-row,
    .sns-counter-lab__quick-group,
    .sns-counter-lab__summary-grid,
    .sns-counter-lab__stats-grid {
        grid-template-columns: 1fr;
    }
    .sns-counter-lab__action-group {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sns-character-counter.sns-counter-lab button {
        font-size: 13px !important;
    }
}