.ytcc-app {
        --ytcc-bg: #f7f8fb;
        --ytcc-panel: #ffffff;
        --ytcc-panel-2: #f1f5f9;
        --ytcc-text: #111827;
        --ytcc-muted: #64748b;
        --ytcc-line: #dbe3ef;
        --ytcc-red: #e11d48;
        --ytcc-teal: #0f766e;
        --ytcc-blue: #2563eb;
        min-height: calc(100vh - 56px);
        background: var(--ytcc-bg);
        color: var(--ytcc-text);
        padding: 72px 14px 28px;
    }

    body.dark .ytcc-app,
    .dark .ytcc-app {
        --ytcc-bg: #111827;
        --ytcc-panel: #1f2937;
        --ytcc-panel-2: #182230;
        --ytcc-text: #f8fafc;
        --ytcc-muted: #94a3b8;
        --ytcc-line: #334155;
        --ytcc-red: #fb7185;
        --ytcc-teal: #2dd4bf;
        --ytcc-blue: #60a5fa;
    }

    .ytcc-card,
    .ytcc-section,
    .ytcc-output-card {
        background: var(--ytcc-panel);
        border: 1px solid var(--ytcc-line);
        border-radius: 8px;
        box-shadow: 0 10px 28px rgba(15, 23, 42, .06);
    }

    body.dark .ytcc-card,
    body.dark .ytcc-section,
    body.dark .ytcc-output-card,
    .dark .ytcc-card,
    .dark .ytcc-section,
    .dark .ytcc-output-card {
        box-shadow: none;
    }

    .ytcc-card {
        padding: 16px;
    }

    .ytcc-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-height: 28px;
        padding: 0 10px;
        border-radius: 8px;
        background: rgba(225, 29, 72, .1);
        color: var(--ytcc-red);
        font-size: 11px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0;
    }

    .ytcc-title {
        margin: 12px 0 8px;
        color: var(--ytcc-text);
        font-size: 24px;
        line-height: 1.15;
        font-weight: 800;
        letter-spacing: 0;
    }

    .ytcc-desc {
        margin: 0;
        color: var(--ytcc-muted);
        font-size: 14px;
        line-height: 1.55;
    }

    .ytcc-form {
        display: grid;
        gap: 13px;
        margin-top: 18px;
    }

    .ytcc-field {
        display: grid;
        gap: 6px;
        min-width: 0;
    }

    .ytcc-label {
        color: var(--ytcc-text);
        font-size: 12px;
        font-weight: 800;
        line-height: 1.3;
    }

    .ytcc-input,
    .ytcc-select,
    .ytcc-textarea {
        width: 100%;
        min-height: 46px;
        border: 1px solid var(--ytcc-line);
        border-radius: 8px;
        background: var(--ytcc-panel-2);
        color: var(--ytcc-text);
        padding: 0 12px;
        outline: none;
        font-size: 14px;
    }

    .ytcc-textarea {
        min-height: 98px;
        padding: 12px;
        resize: vertical;
        line-height: 1.5;
    }

    .ytcc-input:focus,
    .ytcc-select:focus,
    .ytcc-textarea:focus {
        border-color: var(--ytcc-blue);
        box-shadow: 0 0 0 3px rgba(37, 99, 235, .14);
        background: var(--ytcc-panel);
    }

    .ytcc-two {
        display: grid;
        grid-template-columns: 1fr 92px;
        gap: 10px;
    }

    .ytcc-output-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }

    .ytcc-check {
        position: relative;
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: 72px;
        border: 1px solid var(--ytcc-line);
        border-radius: 8px;
        background: var(--ytcc-panel-2);
        padding: 10px;
        cursor: pointer;
    }

    .ytcc-check input {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .ytcc-check-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        flex: 0 0 34px;
        border-radius: 8px;
        background: rgba(15, 118, 110, .12);
        color: var(--ytcc-teal);
        font-size: 20px;
    }

    .ytcc-check strong {
        display: block;
        color: var(--ytcc-text);
        font-size: 12px;
        line-height: 1.25;
    }

    .ytcc-check span:last-child span {
        display: block;
        margin-top: 3px;
        color: var(--ytcc-muted);
        font-size: 10px;
        line-height: 1.25;
    }

    .ytcc-check:has(input:checked) {
        border-color: rgba(15, 118, 110, .5);
        background: rgba(15, 118, 110, .09);
    }

    .ytcc-btn,
    .ytcc-btn-secondary,
    .ytcc-icon-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        border: 0;
        border-radius: 8px;
        min-height: 46px;
        padding: 0 14px;
        font-size: 13px;
        font-weight: 800;
        line-height: 1;
        cursor: pointer;
    }

    .ytcc-btn {
        width: 100%;
        background: var(--ytcc-red);
        color: #fff;
        margin-top: 2px;
    }

    .ytcc-btn-secondary,
    .ytcc-icon-btn {
        border: 1px solid var(--ytcc-line);
        background: var(--ytcc-panel-2);
        color: var(--ytcc-text);
    }

    .ytcc-btn:disabled {
        opacity: .65;
    }

    .ytcc-progress {
        display: none;
        margin-top: 14px;
        padding: 15px;
        background: var(--ytcc-panel);
        border: 1px solid var(--ytcc-line);
        border-radius: 8px;
    }

    .ytcc-progress.is-active {
        display: block;
    }

    .ytcc-progress-head {
        display: flex;
        justify-content: space-between;
        gap: 10px;
        margin-bottom: 10px;
        color: var(--ytcc-muted);
        font-size: 12px;
        font-weight: 800;
    }

    .ytcc-track {
        height: 10px;
        border-radius: 999px;
        overflow-x: hidden;
        border: 1px solid var(--ytcc-line);
        background: var(--ytcc-panel-2);
    }

    .ytcc-fill {
        width: 0%;
        height: 100%;
        background: var(--ytcc-teal);
        transition: width .35s ease;
    }

    .ytcc-results {
        display: none;
        margin-top: 14px;
        gap: 12px;
    }

    .ytcc-results.is-active {
        display: grid;
    }

    .ytcc-section {
        padding: 15px;
    }

    .ytcc-section-head,
    .ytcc-output-head {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 10px;
        margin-bottom: 12px;
    }

    .ytcc-output-head {
        align-items: center;
        border-bottom: 1px solid var(--ytcc-line);
        background: var(--ytcc-panel-2);
        margin: 0;
        padding: 12px;
    }

    .ytcc-kicker {
        color: var(--ytcc-teal);
        font-size: 11px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0;
    }

    .ytcc-section-title,
    .ytcc-output-title {
        color: var(--ytcc-text);
        font-size: 15px;
        font-weight: 800;
        line-height: 1.3;
        margin-top: 4px;
    }

    .ytcc-text,
    .ytcc-note {
        color: var(--ytcc-muted);
        font-size: 13px;
        line-height: 1.6;
        white-space: pre-wrap;
    }

    .ytcc-output-body {
        padding: 13px;
    }

    .ytcc-primary {
        border-left: 3px solid var(--ytcc-red);
        border-radius: 8px;
        background: rgba(225, 29, 72, .08);
        color: var(--ytcc-text);
        padding: 10px;
        font-weight: 800;
        line-height: 1.45;
        margin-bottom: 10px;
    }

    .ytcc-body-box {
        border: 1px solid var(--ytcc-line);
        border-radius: 8px;
        background: var(--ytcc-panel-2);
        color: var(--ytcc-text);
        padding: 12px;
        line-height: 1.65;
        white-space: pre-wrap;
    }

    .ytcc-note {
        margin-top: 10px;
    }

    .ytcc-pill-list,
    .ytcc-output-list {
        display: flex;
        flex-wrap: wrap;
        gap: 7px;
        margin-top: 10px;
    }

    .ytcc-pill {
        display: inline-flex;
        align-items: center;
        min-height: 30px;
        border-radius: 8px;
        border: 1px solid var(--ytcc-line);
        background: var(--ytcc-panel-2);
        color: var(--ytcc-text);
        padding: 0 9px;
        font-size: 11px;
        font-weight: 800;
    }

    .ytcc-competitors {
        display: grid;
        gap: 9px;
    }

    .ytcc-competitor {
        display: grid;
        grid-template-columns: 96px minmax(0, 1fr);
        gap: 10px;
        border: 1px solid var(--ytcc-line);
        border-radius: 8px;
        background: var(--ytcc-panel-2);
        padding: 9px;
    }

    .ytcc-thumb {
        width: 96px;
        aspect-ratio: 16/9;
        border-radius: 6px;
        object-fit: cover;
        background: var(--ytcc-line);
    }

    .ytcc-comp-title {
        color: var(--ytcc-text);
        font-size: 12px;
        line-height: 1.35;
        font-weight: 800;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .ytcc-comp-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-top: 7px;
        color: var(--ytcc-muted);
        font-size: 10px;
    }

    .ytcc-history {
        margin-top: 14px;
    }

    .ytcc-history-list {
        display: grid;
        gap: 8px;
    }

    .ytcc-history-item {
        min-height: 40px;
        border: 1px solid var(--ytcc-line);
        border-radius: 8px;
        background: var(--ytcc-panel-2);
        color: var(--ytcc-text);
        padding: 0 12px;
        text-align: left;
        font-size: 12px;
        font-weight: 800;
    }

    .ytcc-hidden {
        display: none !important;
    }

    .ytcc-spin {
        animation: ytcc-spin 1s linear infinite;
    }

    @keyframes ytcc-spin {
        to {
            transform: rotate(360deg);
        }
    }

    /* Content Blueprint mobile theme alignment. Keep inline while this tool is in development. */
    .ytcc-app {
        --ytcc-primary: #3b82f6;
        --ytcc-primary-dark: #2563eb;
        --ytcc-secondary: #7c3aed;
        --ytcc-success: #10b981;
        --ytcc-warning: #f59e0b;
        --ytcc-border-color: rgba(15, 23, 42, .1);
        --ytcc-bg-glass: rgba(255, 255, 255, .74);
        --ytcc-bg-glass-hover: rgba(255, 255, 255, .92);
        --ytcc-shadow-soft: 0 12px 34px rgba(15, 23, 42, .08);
        --ytcc-shadow-sm: 0 2px 4px rgba(15, 23, 42, .03);
        --ytcc-text-main: #0f172a;
        --ytcc-text-muted: #64748b;
        --ytcc-panel: var(--ytcc-bg-glass);
        --ytcc-panel-2: rgba(248, 250, 252, .78);
        --ytcc-line: var(--ytcc-border-color);
        --ytcc-text: var(--ytcc-text-main);
        --ytcc-muted: var(--ytcc-text-muted);
        --ytcc-red: var(--ytcc-primary);
        --ytcc-teal: var(--ytcc-secondary);
        --ytcc-blue: var(--ytcc-primary);
        position: relative;
        min-height: calc(100vh - 56px);
        overflow-x: hidden;
        padding: 72px 14px 32px;
        background:
            radial-gradient(circle at 50% 18%, rgba(59, 130, 246, .18), transparent 36%),
            radial-gradient(circle at 80% 42%, rgba(124, 58, 237, .14), transparent 34%),
            linear-gradient(180deg, #f8fbff 0%, #eef4ff 52%, #e9effb 100%);
        color: var(--ytcc-text-main);
        font-family: Inter, system-ui, -apple-system, sans-serif;
    }

    body.dark .ytcc-app,
    body.dark-mode .ytcc-app,
    .dark .ytcc-app {
        --ytcc-border-color: rgba(255, 255, 255, .14);
        --ytcc-bg-glass: rgba(255, 255, 255, .08);
        --ytcc-bg-glass-hover: rgba(255, 255, 255, .12);
        --ytcc-shadow-soft: 0 16px 40px rgba(0, 0, 0, .28);
        --ytcc-shadow-sm: 0 2px 5px rgba(0, 0, 0, .18);
        --ytcc-text-main: #f8fafc;
        --ytcc-text-muted: #d6d3ff;
        --ytcc-panel-2: rgba(15, 23, 42, .38);
        background:
            radial-gradient(circle at 50% 12%, rgba(124, 58, 237, .3), transparent 36%),
            linear-gradient(180deg, #6236ff 0%, #2d1f5a 42%, #1a1138 76%, #0b0914 100%);
        color: var(--ytcc-text-main);
    }

    .ytcc-app::before {
        content: '';
        position: absolute;
        left: 50%;
        top: 34px;
        width: 580px;
        height: 360px;
        pointer-events: none;
        transform: translateX(-50%);
        background: radial-gradient(ellipse at center, rgba(139, 92, 246, .22), rgba(59, 130, 246, .12) 45%, transparent 72%);
    }

    .ytcc-card {
        position: relative;
        z-index: 1;
        max-width: 560px;
        margin: 0 auto;
        padding: 24px 0 0;
        border: 0;
        background: transparent;
        box-shadow: none;
        text-align: center;
    }

    .ytcc-eyebrow {
        min-height: 0;
        margin-bottom: 16px;
        padding: 8px 14px;
        border: 1px solid rgba(59, 130, 246, .22);
        border-radius: 999px;
        background: rgba(59, 130, 246, .12);
        color: var(--ytcc-primary);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .05em;
    }

    body.dark .ytcc-eyebrow,
    body.dark-mode .ytcc-eyebrow,
    .dark .ytcc-eyebrow {
        background: rgba(255, 255, 255, .08);
        border-color: rgba(255, 255, 255, .18);
        color: #bfdbfe;
    }

    .ytcc-title {
        display: grid;
        gap: 0;
        margin: 0 0 12px;
        color: var(--ytcc-text-main);
        font-size: 34px;
        font-weight: 900;
        line-height: 1.08;
        letter-spacing: 0;
        text-align: center;
    }

    .ytcc-title-gradient {
        background: linear-gradient(135deg, var(--ytcc-primary), var(--ytcc-secondary));
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
    }

    body.dark .ytcc-title-gradient,
    body.dark-mode .ytcc-title-gradient,
    .dark .ytcc-title-gradient {
        background: linear-gradient(135deg, #dbeafe, #c4b5fd);
        -webkit-background-clip: text;
        background-clip: text;
    }

    .ytcc-desc {
        max-width: 500px;
        margin: 0 auto;
        color: var(--ytcc-text-muted);
        font-size: 14px;
        line-height: 1.6;
        text-align: center;
    }

    .ytcc-guide {
        display: grid;
        gap: 0;
        max-width: 500px;
        margin: 18px auto 0;
        text-align: left;
    }

    .ytcc-guide-item {
        display: flex;
        gap: 10px;
        min-width: 0;
        padding: 10px 0;
        border-top: 1px solid var(--ytcc-border-color);
    }

    .ytcc-guide-item:first-child {
        border-top: 0;
        padding-top: 0;
    }

    .ytcc-guide-step {
        display: inline-flex;
        width: 28px;
        height: 28px;
        flex: 0 0 28px;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: linear-gradient(135deg, var(--ytcc-secondary), var(--ytcc-primary));
        color: #fff;
        font-size: 11px;
        font-weight: 900;
        line-height: 1;
        box-shadow: 0 8px 18px rgba(59, 130, 246, .2);
    }

    .ytcc-guide-title {
        display: block;
        color: var(--ytcc-text-main);
        font-size: 12px;
        font-weight: 850;
        line-height: 1.25;
    }

    .ytcc-guide-text {
        display: block;
        margin-top: 3px;
        color: var(--ytcc-text-muted);
        font-size: 11px;
        line-height: 1.45;
    }

    .ytcc-form {
        margin-top: 24px;
        padding: 12px;
        gap: 12px;
        border: 1px solid var(--ytcc-border-color);
        border-radius: 22px;
        background: var(--ytcc-bg-glass);
        box-shadow: var(--ytcc-shadow-soft);
        text-align: left;
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
    }

    .ytcc-label {
        color: var(--ytcc-text-main);
        font-weight: 800;
    }

    .ytcc-input,
    .ytcc-select,
    .ytcc-textarea {
        border: 1px solid var(--ytcc-border-color);
        border-radius: 16px;
        background: rgba(248, 250, 252, .72);
        color: var(--ytcc-text-main);
        font-weight: 500;
    }

    .ytcc-input,
    .ytcc-select {
        height: 52px;
        min-height: 52px;
        padding: 0 14px;
        font-size: 14px;
    }

    .ytcc-textarea {
        min-height: 104px;
        padding: 14px;
        font-size: 13px;
    }

    body.dark .ytcc-input,
    body.dark .ytcc-select,
    body.dark .ytcc-textarea,
    body.dark-mode .ytcc-input,
    body.dark-mode .ytcc-select,
    body.dark-mode .ytcc-textarea,
    .dark .ytcc-input,
    .dark .ytcc-select,
    .dark .ytcc-textarea {
        background: rgba(15, 23, 42, .36);
        color: #f8fafc;
    }

    .ytcc-input:focus,
    .ytcc-select:focus,
    .ytcc-textarea:focus {
        border-color: var(--ytcc-primary);
        background: var(--ytcc-bg-glass-hover);
        box-shadow: 0 0 0 4px rgba(59, 130, 246, .12);
    }

    .ytcc-two {
        grid-template-columns: minmax(0, 1fr) 150px;
        gap: 10px;
    }

    .ytcc-output-field {
        margin-top: 2px;
    }

    .ytcc-output-grid {
        gap: 10px;
    }

    .ytcc-check {
        justify-content: center;
        min-height: 68px;
        border-color: var(--ytcc-border-color);
        border-radius: 16px;
        background: rgba(248, 250, 252, .64);
        transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
    }

    body.dark .ytcc-check,
    body.dark-mode .ytcc-check,
    .dark .ytcc-check {
        background: rgba(15, 23, 42, .32);
    }

    .ytcc-check-icon {
        border-radius: 12px;
        background: rgba(59, 130, 246, .12);
        color: var(--ytcc-primary);
    }

    .ytcc-check strong {
        font-size: 13px;
    }

    .ytcc-check-sub {
        display: none !important;
    }

    .ytcc-check:has(input:checked) {
        border-color: rgba(59, 130, 246, .5);
        background: rgba(59, 130, 246, .1);
    }

    .ytcc-check:has(input:checked) .ytcc-check-icon {
        background: linear-gradient(135deg, var(--ytcc-secondary), var(--ytcc-primary));
        color: #fff;
    }

    .ytcc-btn,
    .ytcc-btn-secondary,
    .ytcc-icon-btn {
        border-radius: 16px;
        font-weight: 800;
        transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, color .2s ease, opacity .2s ease;
    }

    .ytcc-btn {
        height: 52px;
        min-height: 52px;
        background: linear-gradient(135deg, var(--ytcc-secondary), var(--ytcc-primary));
        color: #fff;
        box-shadow: 0 12px 26px rgba(59, 130, 246, .24);
    }

    .ytcc-btn:active,
    .ytcc-btn-secondary:active,
    .ytcc-icon-btn:active {
        transform: translateY(1px);
    }

    .ytcc-btn-secondary,
    .ytcc-icon-btn {
        border: 1px solid var(--ytcc-border-color);
        background: var(--ytcc-bg-glass);
        color: var(--ytcc-text-main);
        box-shadow: var(--ytcc-shadow-sm);
    }

    .ytcc-progress {
        display: none;
        position: relative;
        max-width: 560px;
        margin: 16px auto 0;
        padding: 20px;
        overflow: hidden;
        border: 1px solid rgba(59, 130, 246, .38);
        border-radius: 22px;
        background: var(--ytcc-bg-glass);
        box-shadow: var(--ytcc-shadow-soft);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
    }

    .ytcc-progress::before {
        content: '';
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: radial-gradient(circle at 50% -20%, rgba(59, 130, 246, .16), transparent 62%);
    }

    .ytcc-progress.is-active {
        display: block;
        animation: ytcc-fade-in .45s ease;
    }

    .ytcc-progress-head,
    .ytcc-track {
        position: relative;
    }

    .ytcc-progress-head {
        color: var(--ytcc-text-main);
    }

    #ytcc-progress-text {
        color: var(--ytcc-primary);
    }

    .ytcc-track {
        height: 12px;
        border: 0;
        border-radius: 999px;
        background: rgba(148, 163, 184, .22);
        box-shadow: inset 0 2px 4px rgba(0, 0, 0, .05);
    }

    .ytcc-fill {
        position: relative;
        border-radius: 999px;
        background: linear-gradient(90deg, var(--ytcc-primary), var(--ytcc-secondary));
        overflow: hidden;
    }

    .ytcc-fill::after {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
        transform: translateX(-100%);
        animation: ytcc-shimmer 1.5s infinite;
    }

    .ytcc-results {
        max-width: 560px;
        margin: 16px auto 0;
        gap: 12px;
        animation: ytcc-fade-in .45s ease;
    }

    .ytcc-section,
    .ytcc-output-card {
        border: 1px solid var(--ytcc-border-color);
        border-radius: 22px;
        background: var(--ytcc-bg-glass);
        box-shadow: var(--ytcc-shadow-soft);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
    }

    .ytcc-section {
        padding: 18px;
    }

    .ytcc-section-head {
        margin-bottom: 14px;
    }

    .ytcc-kicker {
        color: var(--ytcc-primary);
        letter-spacing: .08em;
    }

    .ytcc-section-title,
    .ytcc-output-title {
        color: var(--ytcc-text-main);
    }

    .ytcc-text,
    .ytcc-note {
        color: var(--ytcc-text-muted);
    }

    .ytcc-output-card {
        overflow: hidden;
    }

    .ytcc-output-head {
        border-bottom-color: var(--ytcc-border-color);
        background: rgba(59, 130, 246, .06);
    }

    body.dark .ytcc-output-head,
    body.dark-mode .ytcc-output-head,
    .dark .ytcc-output-head {
        background: rgba(255, 255, 255, .06);
    }

    .ytcc-primary {
        border-left-color: var(--ytcc-primary);
        border-radius: 12px;
        background: rgba(59, 130, 246, .1);
    }

    .ytcc-body-box,
    .ytcc-competitor {
        border-color: var(--ytcc-border-color);
        border-radius: 16px;
        background: rgba(248, 250, 252, .68);
    }

    body.dark .ytcc-body-box,
    body.dark .ytcc-competitor,
    body.dark-mode .ytcc-body-box,
    body.dark-mode .ytcc-competitor,
    .dark .ytcc-body-box,
    .dark .ytcc-competitor {
        background: rgba(15, 23, 42, .36);
    }

    .ytcc-pill {
        border-color: var(--ytcc-border-color);
        border-radius: 999px;
        background: var(--ytcc-bg-glass);
        color: var(--ytcc-text-main);
        box-shadow: var(--ytcc-shadow-sm);
    }

    .ytcc-history {
        max-width: 560px;
        margin: 24px auto 0;
        border: 0;
        background: transparent;
        box-shadow: none;
        text-align: center;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .ytcc-history .ytcc-section-head {
        display: block;
        margin-bottom: 14px;
    }

    .ytcc-history .ytcc-kicker {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        color: var(--ytcc-text-muted);
        letter-spacing: .12em;
    }

    .ytcc-history .ytcc-kicker::before,
    .ytcc-history .ytcc-kicker::after {
        content: '';
        width: 28px;
        height: 1px;
        background: var(--ytcc-border-color);
    }

    .ytcc-history .ytcc-section-title {
        display: none;
    }

    .ytcc-history-list {
        gap: 9px;
    }

    .ytcc-history-item {
        min-height: 42px;
        border-color: var(--ytcc-border-color);
        border-radius: 999px;
        background: var(--ytcc-bg-glass);
        color: var(--ytcc-text-main);
        box-shadow: var(--ytcc-shadow-sm);
    }

    @keyframes ytcc-fade-in {
        from {
            opacity: 0;
            transform: translateY(16px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    @keyframes ytcc-shimmer {
        100% {
            transform: translateX(100%);
        }
    }

    @media (max-width: 374px) {
        .ytcc-two,
        .ytcc-output-grid {
            grid-template-columns: 1fr;
        }

        .ytcc-title {
            font-size: 30px;
        }
    }

    /* Cleaner first-screen hero: no form card, simple output checks. */
    .ytcc-card {
        padding-top: 18px;
    }

    .ytcc-form {
        margin-top: 24px;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .ytcc-input,
    .ytcc-select {
        border-color: rgba(15, 23, 42, .12);
        background: rgba(255, 255, 255, .7);
        box-shadow: 0 8px 24px rgba(15, 23, 42, .05);
    }

    body.dark .ytcc-input,
    body.dark .ytcc-select,
    body.dark-mode .ytcc-input,
    body.dark-mode .ytcc-select,
    .dark .ytcc-input,
    .dark .ytcc-select {
        border-color: rgba(255, 255, 255, .14);
        background: rgba(15, 23, 42, .38);
        box-shadow: none;
    }

    .ytcc-output-field {
        margin-top: 16px;
        text-align: center;
    }

    .ytcc-output-field > .ytcc-label {
        display: block;
        margin-bottom: 10px;
        color: var(--ytcc-text-muted);
        font-size: 11px;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

    .ytcc-output-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }

    .ytcc-check {
        width: auto;
        min-height: 38px;
        gap: 7px;
        justify-content: flex-start;
        padding: 0 12px;
        border-radius: 999px;
        background: rgba(255, 255, 255, .56);
        box-shadow: none;
    }

    body.dark .ytcc-check,
    body.dark-mode .ytcc-check,
    .dark .ytcc-check {
        background: rgba(15, 23, 42, .34);
    }

    .ytcc-check input {
        position: static;
        width: 15px;
        height: 15px;
        margin: 0;
        opacity: 1;
        pointer-events: auto;
        accent-color: var(--ytcc-primary);
        flex: 0 0 auto;
    }

    .ytcc-check-icon {
        display: none;
    }

    .ytcc-check strong {
        color: var(--ytcc-text-main);
        font-size: 12px;
        font-weight: 750;
        line-height: 1;
        white-space: nowrap;
    }

    .ytcc-check:has(input:checked) {
        border-color: rgba(59, 130, 246, .38);
        background: rgba(255, 255, 255, .76);
    }

    body.dark .ytcc-check:has(input:checked),
    body.dark-mode .ytcc-check:has(input:checked),
    .dark .ytcc-check:has(input:checked) {
        background: rgba(59, 130, 246, .16);
    }

    .ytcc-btn {
        margin-top: 8px;
    }

    .ytcc-history {
        margin-top: 22px;
    }

    @media (max-width: 374px) {
        .ytcc-output-grid {
            justify-content: flex-start;
        }
    }

    .ytcc-native-select {
        display: none;
    }

    .ytcc-select-field {
        position: relative;
        z-index: 20;
    }

    .ytcc-language-ui {
        position: relative;
    }

    .ytcc-language-trigger {
        display: flex;
        width: 100%;
        height: 52px;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 0 14px;
        border: 1px solid rgba(15, 23, 42, .12);
        border-radius: 16px;
        background: rgba(255, 255, 255, .7);
        color: var(--ytcc-text-main);
        font-size: 14px;
        font-weight: 500;
        line-height: 1;
        text-align: left;
        box-shadow: 0 8px 24px rgba(15, 23, 42, .05);
        transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
    }

    .ytcc-language-ui.is-open .ytcc-language-trigger {
        border-color: var(--ytcc-primary);
        border-bottom-color: transparent;
        border-radius: 16px 16px 0 0;
        background: #fff;
        box-shadow: 0 12px 28px rgba(15, 23, 42, .12);
    }

    body.dark .ytcc-language-trigger,
    body.dark-mode .ytcc-language-trigger,
    .dark .ytcc-language-trigger {
        border-color: rgba(255, 255, 255, .14);
        background: rgba(15, 23, 42, .38);
        color: #f8fafc;
        box-shadow: none;
    }

    body.dark .ytcc-language-ui.is-open .ytcc-language-trigger,
    body.dark-mode .ytcc-language-ui.is-open .ytcc-language-trigger,
    .dark .ytcc-language-ui.is-open .ytcc-language-trigger {
        background: #1e293b;
    }

    .ytcc-select-caret {
        width: 8px;
        height: 8px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(45deg);
        transition: transform .18s ease;
        opacity: .82;
        flex: 0 0 auto;
    }

    .ytcc-language-ui.is-open .ytcc-select-caret {
        transform: rotate(225deg);
    }

    .ytcc-language-dropdown {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        z-index: 60;
        display: none;
        overflow: hidden;
        border: 1px solid var(--ytcc-primary);
        border-top: 0;
        border-radius: 0 0 16px 16px;
        background: #fff;
        box-shadow: 0 18px 32px rgba(15, 23, 42, .16);
    }

    .ytcc-language-ui.is-open .ytcc-language-dropdown {
        display: block;
    }

    body.dark .ytcc-language-dropdown,
    body.dark-mode .ytcc-language-dropdown,
    .dark .ytcc-language-dropdown {
        border-color: rgba(96, 165, 250, .7);
        background: #1e293b;
        box-shadow: 0 18px 32px rgba(0, 0, 0, .34);
    }

    .ytcc-language-search-wrap {
        padding: 10px;
        border-bottom: 1px solid var(--ytcc-border-color);
    }

    .ytcc-language-search {
        width: 100%;
        height: 40px;
        border: 1px solid var(--ytcc-primary);
        border-radius: 11px;
        background: #fff;
        color: #0f172a;
        padding: 0 12px;
        outline: none;
        font-size: 13px;
    }

    body.dark .ytcc-language-search,
    body.dark-mode .ytcc-language-search,
    .dark .ytcc-language-search {
        background: #0f172a;
        color: #f8fafc;
    }

    .ytcc-language-options {
        max-height: 250px;
        overflow-y: auto;
        padding: 4px 0;
        overscroll-behavior: contain;
    }

    .ytcc-language-option {
        display: flex;
        width: 100%;
        min-height: 46px;
        align-items: center;
        border: 0;
        background: transparent;
        color: #475569;
        padding: 0 16px;
        font-size: 14px;
        font-weight: 500;
        text-align: left;
    }

    .ytcc-language-option:hover,
    .ytcc-language-option.is-active {
        background: var(--ytcc-primary);
        color: #fff;
    }

    body.dark .ytcc-language-option,
    body.dark-mode .ytcc-language-option,
    .dark .ytcc-language-option {
        color: #cbd5e1;
    }

    .ytcc-language-empty {
        padding: 14px 16px;
        color: var(--ytcc-text-muted);
        font-size: 13px;
    }

    .ytcc-check {
        min-height: 40px;
        padding: 0 13px 0 11px;
        border-color: rgba(15, 23, 42, .1);
        background: rgba(255, 255, 255, .62);
    }

    body.dark .ytcc-check,
    body.dark-mode .ytcc-check,
    .dark .ytcc-check {
        border-color: rgba(255, 255, 255, .12);
        background: rgba(15, 23, 42, .34);
    }

    .ytcc-check input {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .ytcc-check-icon {
        display: inline-flex;
        width: 17px;
        height: 17px;
        flex: 0 0 17px;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(100, 116, 139, .38);
        border-radius: 6px;
        background: rgba(255, 255, 255, .72);
        color: #fff;
    }

    .ytcc-check-icon ion-icon {
        display: none !important;
    }

    .ytcc-check-icon::after {
        content: '';
        width: 8px;
        height: 4px;
        border-left: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        opacity: 0;
        transform: rotate(-45deg) translate(1px, -1px);
    }

    .ytcc-check:has(input:checked) {
        border-color: rgba(59, 130, 246, .38);
        background: rgba(255, 255, 255, .8);
    }

    body.dark .ytcc-check:has(input:checked),
    body.dark-mode .ytcc-check:has(input:checked),
    .dark .ytcc-check:has(input:checked) {
        background: rgba(59, 130, 246, .16);
    }

    .ytcc-check:has(input:checked) .ytcc-check-icon {
        border-color: transparent;
        background: linear-gradient(135deg, var(--ytcc-secondary), var(--ytcc-primary));
        box-shadow: 0 6px 14px rgba(59, 130, 246, .22);
    }

    .ytcc-check:has(input:checked) .ytcc-check-icon::after {
        opacity: 1;
    }

    .ytcc-card,
    .ytcc-form,
    .ytcc-results,
    .ytcc-progress {
        width: 100%;
        max-width: 560px;
    }

    .ytcc-app.has-results .ytcc-card,
    .ytcc-app.has-results .ytcc-progress {
        display: none !important;
    }

    .ytcc-app.has-results {
        background:
            radial-gradient(circle at 88% 4%, rgba(79, 172, 254, .16), transparent 26%),
            linear-gradient(180deg, #f8fbff 0%, #eef4ff 42%, #e9effb 100%);
    }

    body.dark .ytcc-app.has-results,
    body.dark-mode .ytcc-app.has-results,
    .dark .ytcc-app.has-results {
        background:
            radial-gradient(circle at 50% 8%, rgba(167, 139, 250, .16), transparent 34%),
            linear-gradient(180deg, #0b0914 0%, #111827 100%);
    }

    .ytcc-result-nav {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        margin: 0 0 20px;
    }

    .ytcc-btn-back {
        display: inline-flex;
        min-height: 42px;
        align-items: center;
        justify-content: center;
        gap: 7px;
        padding: 0 16px;
        border: 1px solid var(--ytcc-border-color);
        border-radius: 14px;
        background: var(--ytcc-bg-glass);
        color: var(--ytcc-text-main);
        font-size: 13px;
        font-weight: 800;
        line-height: 1;
        box-shadow: var(--ytcc-shadow-sm);
        cursor: pointer;
    }

    .ytcc-app.is-processing .ytcc-form,
    .ytcc-app.is-processing .ytcc-history {
        display: none !important;
    }

    .ytcc-app.is-processing .ytcc-progress {
        margin-top: 24px;
    }

    .ytcc-output-body {
        padding: 16px;
    }

    .ytcc-body-box {
        border-radius: 14px;
        background: rgba(248, 250, 252, .62);
        color: var(--ytcc-text-main);
        font-size: 13px;
        font-weight: 400;
        line-height: 1.75;
        white-space: pre-wrap;
        overflow-wrap: anywhere;
    }

    body.dark .ytcc-body-box,
    body.dark-mode .ytcc-body-box,
    .dark .ytcc-body-box {
        background: rgba(15, 23, 42, .36);
    }

    .ytcc-primary {
        font-weight: 700;
        line-height: 1.5;
    }

    .ytcc-long-text {
        font-weight: 400;
        line-height: 1.78;
    }

    /* Mobile app redesign: follows Content Blueprint's app-first surface, not the desktop layout. */
    :root {
        --ytcc-safe-bottom: env(safe-area-inset-bottom, 20px);
    }

    .ytcc-mobile-bg {
        position: relative;
        width: 100%;
        min-height: 100vh;
        overflow-x: hidden;
        padding: 18px 12px calc(38px + var(--ytcc-safe-bottom));
        background:
            radial-gradient(circle at 88% 4%, rgba(79, 172, 254, .16), transparent 26%),
            radial-gradient(circle at 50% 22%, rgba(124, 58, 237, .12), transparent 34%),
            linear-gradient(180deg, #f8fbff 0%, #eef4ff 44%, #e9effb 100%);
        color: #475569;
    }

    body.dark .ytcc-mobile-bg,
    body.dark-mode .ytcc-mobile-bg,
    .dark .ytcc-mobile-bg {
        background:
            linear-gradient(180deg, #6236ff 0%, #2d1f5a 30%, #1a1138 70%, #0b0914 100%);
        color: #fff;
    }

    .ytcc-mobile-bg::before {
        content: "";
        position: fixed;
        top: -120px;
        left: 50%;
        width: 100vw;
        height: 50vh;
        pointer-events: none;
        transform: translateX(-50%);
        background: radial-gradient(circle, rgba(59, 130, 246, .11), transparent 62%);
        filter: blur(60px);
        z-index: 0;
    }

    body.dark .ytcc-mobile-bg::before,
    body.dark-mode .ytcc-mobile-bg::before,
    .dark .ytcc-mobile-bg::before {
        background: radial-gradient(circle, rgba(167, 139, 250, .15), transparent 60%);
    }

    .ytcc-ambient-glow {
        position: absolute;
        top: 190px;
        left: 50%;
        width: 120vw;
        height: 350px;
        pointer-events: none;
        transform: translateX(-50%);
        background: radial-gradient(ellipse at center, rgba(59, 130, 246, .2) 0%, rgba(167, 139, 250, .12) 42%, transparent 76%);
        filter: blur(55px);
        opacity: .52;
        z-index: 1;
        animation: ytcc-ambient-pulse 4s ease-in-out infinite alternate;
    }

    body.dark .ytcc-ambient-glow,
    body.dark-mode .ytcc-ambient-glow,
    .dark .ytcc-ambient-glow {
        background: radial-gradient(ellipse at center, rgba(167, 139, 250, .8) 0%, rgba(79, 172, 254, .4) 40%, transparent 75%);
        opacity: 1;
    }

    @keyframes ytcc-ambient-pulse {
        from {
            opacity: .62;
            transform: translateX(-50%) scale(.95) translateY(0);
        }
        to {
            opacity: 1;
            transform: translateX(-50%) scale(1.05) translateY(-10px);
        }
    }

    .ytcc-mobile-bg .ytcc-app {
        position: relative;
        z-index: 10;
        width: 100%;
        min-height: auto;
        padding: 0;
        overflow: visible;
        background: transparent !important;
        color: inherit;
    }

    .ytcc-mobile-bg .ytcc-app::before {
        content: none;
    }

    .ytcc-hero {
        position: relative;
        z-index: 10;
        width: 100%;
        max-width: none;
        margin: 0 auto;
        padding: 24px 0 32px;
        border: 0;
        background: transparent;
        box-shadow: none;
        text-align: center;
    }

    .ytcc-mobile-bg .ytcc-eyebrow {
        display: inline-flex;
        min-height: 0;
        margin-bottom: 16px;
        padding: 6px 14px;
        border: 1px solid rgba(99, 102, 241, .24);
        border-radius: 999px;
        background: rgba(99, 102, 241, .1);
        color: #4f46e5;
        box-shadow: 0 8px 18px rgba(79, 70, 229, .1);
        font-size: .7rem;
        font-weight: 800;
        letter-spacing: .8px;
        text-transform: uppercase;
    }

    body.dark .ytcc-mobile-bg .ytcc-eyebrow,
    body.dark-mode .ytcc-mobile-bg .ytcc-eyebrow,
    .dark .ytcc-mobile-bg .ytcc-eyebrow {
        border-color: rgba(167, 139, 250, .4);
        background: rgba(167, 139, 250, .15);
        color: #d8b4fe;
        box-shadow: 0 4px 12px rgba(167, 139, 250, .15);
    }

    .ytcc-mobile-bg .ytcc-title {
        display: block;
        margin: 0 0 12px;
        color: #3f4f68;
        font-size: 2rem;
        font-weight: 900;
        line-height: 1.08;
        letter-spacing: 0;
        text-align: center;
    }

    .ytcc-mobile-bg .ytcc-title > span:first-child {
        display: block;
    }

    .ytcc-mobile-bg .ytcc-title-gradient {
        display: inline-block;
        background: linear-gradient(135deg, #475569, #5b5ff0);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
        font-size: 1.5rem;
        animation: ytcc-title-shimmer 4s linear infinite;
        background-size: 200% auto;
    }

    body.dark .ytcc-mobile-bg .ytcc-title,
    body.dark-mode .ytcc-mobile-bg .ytcc-title,
    .dark .ytcc-mobile-bg .ytcc-title {
        color: #fff;
        text-shadow: 0 4px 12px rgba(0, 0, 0, .4);
    }

    body.dark .ytcc-mobile-bg .ytcc-title-gradient,
    body.dark-mode .ytcc-mobile-bg .ytcc-title-gradient,
    .dark .ytcc-mobile-bg .ytcc-title-gradient {
        background: linear-gradient(135deg, #fff, #e2d9ff);
        -webkit-background-clip: text;
        background-clip: text;
    }

    @keyframes ytcc-title-shimmer {
        0%, 100% { background-position: 0 50%; }
        50% { background-position: 100% 50%; }
    }

    .ytcc-mobile-bg .ytcc-desc {
        max-width: 500px;
        margin: 0 auto 12px;
        color: rgba(100, 116, 139, .78);
        font-size: .85rem;
        line-height: 1.6;
        text-align: center;
    }

    body.dark .ytcc-mobile-bg .ytcc-desc,
    body.dark-mode .ytcc-mobile-bg .ytcc-desc,
    .dark .ytcc-mobile-bg .ytcc-desc {
        color: rgba(255, 255, 255, .85);
    }

    .ytcc-mobile-bg .ytcc-guide {
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        width: 100%;
        margin: 18px 0 0;
        overflow-x: auto;
        padding: 0 1px 4px;
        text-align: left;
        scroll-snap-type: x proximity;
    }

    .ytcc-mobile-bg .ytcc-guide-item {
        flex: 0 0 74%;
        min-height: 74px;
        padding: 12px;
        border: 1px solid rgba(148, 163, 184, .2);
        border-radius: 20px;
        background: rgba(255, 255, 255, .68);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72), 0 8px 20px rgba(30, 41, 59, .07);
        scroll-snap-align: center;
    }

    body.dark .ytcc-mobile-bg .ytcc-guide-item,
    body.dark-mode .ytcc-mobile-bg .ytcc-guide-item,
    .dark .ytcc-mobile-bg .ytcc-guide-item {
        border-color: rgba(255, 255, 255, .1);
        background: rgba(22, 17, 43, .5);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 8px 20px rgba(0, 0, 0, .18);
    }

    .ytcc-mobile-bg .ytcc-guide-step {
        width: 26px;
        height: 26px;
        flex: 0 0 26px;
        background: linear-gradient(135deg, #7c3aed, #3b82f6);
        box-shadow: 0 8px 18px rgba(124, 58, 237, .22);
    }

    .ytcc-mobile-bg .ytcc-guide-title {
        color: #3f4f68;
        font-size: .78rem;
    }

    .ytcc-mobile-bg .ytcc-guide-text {
        color: rgba(100, 116, 139, .82);
        font-size: .72rem;
    }

    body.dark .ytcc-mobile-bg .ytcc-guide-title,
    body.dark-mode .ytcc-mobile-bg .ytcc-guide-title,
    .dark .ytcc-mobile-bg .ytcc-guide-title {
        color: #fff;
    }

    body.dark .ytcc-mobile-bg .ytcc-guide-text,
    body.dark-mode .ytcc-mobile-bg .ytcc-guide-text,
    .dark .ytcc-mobile-bg .ytcc-guide-text {
        color: rgba(255, 255, 255, .74);
    }

    .ytcc-mobile-bg .ytcc-form {
        width: 100%;
        max-width: none;
        margin: 22px 0 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        text-align: left;
    }

    .ytcc-mobile-bg .ytcc-field {
        gap: 7px;
    }

    .ytcc-mobile-bg .ytcc-label {
        color: #3f4f68;
        font-size: .72rem;
        font-weight: 800;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

    body.dark .ytcc-mobile-bg .ytcc-label,
    body.dark-mode .ytcc-mobile-bg .ytcc-label,
    .dark .ytcc-mobile-bg .ytcc-label {
        color: rgba(255, 255, 255, .8);
    }

    .ytcc-mobile-bg .ytcc-input,
    .ytcc-mobile-bg .ytcc-language-trigger {
        min-height: 52px;
        border: 1.5px solid rgba(148, 163, 184, .24);
        border-radius: 999px;
        background: rgba(255, 255, 255, .82);
        color: #475569;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .74), 0 8px 24px rgba(30, 41, 59, .08);
        font-size: .9rem;
        font-weight: 500;
    }

    body.dark .ytcc-mobile-bg .ytcc-input,
    body.dark .ytcc-mobile-bg .ytcc-language-trigger,
    body.dark-mode .ytcc-mobile-bg .ytcc-input,
    body.dark-mode .ytcc-mobile-bg .ytcc-language-trigger,
    .dark .ytcc-mobile-bg .ytcc-input,
    .dark .ytcc-mobile-bg .ytcc-language-trigger {
        border-color: rgba(255, 255, 255, .2);
        background: rgba(255, 255, 255, .1);
        color: #fff;
        box-shadow: 0 8px 32px rgba(0, 0, 0, .2), inset 0 1px 2px rgba(255, 255, 255, .15);
    }

    .ytcc-mobile-bg .ytcc-input:focus,
    .ytcc-mobile-bg .ytcc-language-ui.is-open .ytcc-language-trigger {
        border-color: rgba(99, 102, 241, .5);
        background: rgba(255, 255, 255, .96);
        box-shadow: 0 0 0 1px rgba(99, 102, 241, .16), 0 14px 34px rgba(30, 41, 59, .12), inset 0 1px 0 rgba(255, 255, 255, .78);
        transform: translateY(-1px);
    }

    body.dark .ytcc-mobile-bg .ytcc-input:focus,
    body.dark .ytcc-mobile-bg .ytcc-language-ui.is-open .ytcc-language-trigger,
    body.dark-mode .ytcc-mobile-bg .ytcc-input:focus,
    body.dark-mode .ytcc-mobile-bg .ytcc-language-ui.is-open .ytcc-language-trigger,
    .dark .ytcc-mobile-bg .ytcc-input:focus,
    .dark .ytcc-mobile-bg .ytcc-language-ui.is-open .ytcc-language-trigger {
        border-color: rgba(167, 139, 250, .8);
        background: rgba(255, 255, 255, .15);
        box-shadow: 0 0 0 1px rgba(167, 139, 250, .48), 0 16px 48px rgba(167, 139, 250, .18), inset 0 1px 2px rgba(255, 255, 255, .25);
    }

    .ytcc-mobile-bg .ytcc-two {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .ytcc-mobile-bg .ytcc-language-ui.is-open {
        z-index: 1000;
    }

    .ytcc-mobile-bg .ytcc-language-dropdown {
        top: calc(100% + 8px);
        border: 1px solid rgba(148, 163, 184, .24);
        border-radius: 20px;
        background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .98));
        box-shadow: 0 18px 38px rgba(30, 41, 59, .16), inset 0 1px 0 rgba(255, 255, 255, .76);
    }

    body.dark .ytcc-mobile-bg .ytcc-language-dropdown,
    body.dark-mode .ytcc-mobile-bg .ytcc-language-dropdown,
    .dark .ytcc-mobile-bg .ytcc-language-dropdown {
        border-color: rgba(255, 255, 255, .15);
        background: rgba(20, 15, 35, .98);
        box-shadow: 0 24px 48px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .1);
    }

    .ytcc-mobile-bg .ytcc-output-field {
        margin-top: 14px;
        text-align: center;
    }

    .ytcc-mobile-bg .ytcc-output-field > .ytcc-label {
        display: block;
        margin-bottom: 10px;
        color: rgba(100, 116, 139, .78);
        letter-spacing: 1.3px;
    }

    body.dark .ytcc-mobile-bg .ytcc-output-field > .ytcc-label,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-field > .ytcc-label,
    .dark .ytcc-mobile-bg .ytcc-output-field > .ytcc-label {
        color: rgba(255, 255, 255, .66);
    }

    .ytcc-mobile-bg .ytcc-output-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }

    .ytcc-mobile-bg .ytcc-check {
        width: auto;
        min-height: 40px;
        gap: 8px;
        padding: 0 13px 0 11px;
        border: 1px solid rgba(148, 163, 184, .22);
        border-radius: 999px;
        background: rgba(255, 255, 255, .72);
        box-shadow: none;
    }

    body.dark .ytcc-mobile-bg .ytcc-check,
    body.dark-mode .ytcc-mobile-bg .ytcc-check,
    .dark .ytcc-mobile-bg .ytcc-check {
        border-color: rgba(255, 255, 255, .12);
        background: rgba(255, 255, 255, .08);
    }

    .ytcc-mobile-bg .ytcc-check-icon {
        display: inline-flex;
        width: 17px;
        height: 17px;
        flex: 0 0 17px;
        border-radius: 6px;
        border: 1px solid rgba(100, 116, 139, .36);
        background: rgba(255, 255, 255, .72);
    }

    .ytcc-mobile-bg .ytcc-check strong {
        color: #3f4f68;
        font-size: .74rem;
        font-weight: 750;
        white-space: nowrap;
    }

    body.dark .ytcc-mobile-bg .ytcc-check strong,
    body.dark-mode .ytcc-mobile-bg .ytcc-check strong,
    .dark .ytcc-mobile-bg .ytcc-check strong {
        color: #fff;
    }

    .ytcc-mobile-bg .ytcc-check:has(input:checked) {
        border-color: rgba(99, 102, 241, .36);
        background: rgba(255, 255, 255, .86);
    }

    body.dark .ytcc-mobile-bg .ytcc-check:has(input:checked),
    body.dark-mode .ytcc-mobile-bg .ytcc-check:has(input:checked),
    .dark .ytcc-mobile-bg .ytcc-check:has(input:checked) {
        background: rgba(167, 139, 250, .15);
    }

    .ytcc-mobile-bg .ytcc-check:has(input:checked) .ytcc-check-icon {
        border-color: transparent;
        background: linear-gradient(135deg, #7c3aed, #3b82f6);
    }

    .ytcc-mobile-bg .ytcc-btn {
        min-height: 52px;
        margin-top: 10px;
        border: 1px solid rgba(255, 255, 255, .36);
        border-radius: 999px;
        background: linear-gradient(135deg, #7c3aed, #3b82f6);
        box-shadow: 0 10px 24px rgba(37, 99, 235, .24);
        color: #fff;
        font-size: .95rem;
    }

    .ytcc-mobile-bg .ytcc-history {
        width: 100%;
        max-width: none;
        margin: 24px auto 0;
        padding: 0;
    }

    .ytcc-mobile-bg .ytcc-history-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }

    .ytcc-mobile-bg .ytcc-history-item {
        min-height: 32px;
        max-width: 100%;
        padding: 0 12px;
        border-radius: 999px;
        font-size: .7rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .ytcc-mobile-bg .ytcc-progress {
        width: 100%;
        max-width: none;
        margin: 24px 0 0;
        padding: 22px 18px;
        border: 1px solid rgba(148, 163, 184, .22);
        border-radius: 28px;
        background: rgba(255, 255, 255, .78);
        box-shadow: 0 18px 42px rgba(30, 41, 59, .12), inset 0 1px 0 rgba(255, 255, 255, .74);
        backdrop-filter: blur(28px);
        -webkit-backdrop-filter: blur(28px);
    }

    body.dark .ytcc-mobile-bg .ytcc-progress,
    body.dark-mode .ytcc-mobile-bg .ytcc-progress,
    .dark .ytcc-mobile-bg .ytcc-progress {
        border-color: rgba(255, 255, 255, .1);
        background: rgba(22, 17, 43, .65);
        box-shadow: 0 16px 40px rgba(0, 0, 0, .4), inset 0 1px 1px rgba(255, 255, 255, .05);
    }

    .ytcc-mobile-bg .ytcc-progress-orb {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 64px;
        height: 64px;
        margin: 0 auto 16px;
        border-radius: 20px;
        background: linear-gradient(135deg, rgba(124, 58, 237, .14), rgba(59, 130, 246, .12));
        border: 1px solid rgba(124, 58, 237, .24);
        box-shadow: 0 10px 26px rgba(79, 70, 229, .16), inset 0 1px 0 rgba(255, 255, 255, .35);
        animation: ytcc-progress-pulse-glow 2s ease-in-out infinite;
        z-index: 1;
    }

    .ytcc-mobile-bg .ytcc-progress-chip {
        position: relative;
        z-index: 2;
        color: #7c3aed;
        font-size: 40px;
        filter: drop-shadow(0 0 14px rgba(124, 58, 237, .38));
        animation: ytcc-progress-chip-pulse 2s ease-in-out infinite;
    }

    body.dark .ytcc-mobile-bg .ytcc-progress-orb,
    body.dark-mode .ytcc-mobile-bg .ytcc-progress-orb,
    .dark .ytcc-mobile-bg .ytcc-progress-orb {
        background: linear-gradient(135deg, rgba(167, 139, 250, .18), rgba(79, 172, 254, .14));
        border-color: rgba(167, 139, 250, .28);
        box-shadow: 0 12px 30px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
    }

    body.dark .ytcc-mobile-bg .ytcc-progress-chip,
    body.dark-mode .ytcc-mobile-bg .ytcc-progress-chip,
    .dark .ytcc-mobile-bg .ytcc-progress-chip {
        color: #a78bfa;
        filter: drop-shadow(0 0 16px rgba(167, 139, 250, .58));
    }

    .ytcc-mobile-bg .ytcc-progress-head {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        color: rgba(100, 116, 139, .88);
        font-size: .72rem;
        line-height: 1.35;
        text-align: left;
    }

    body.dark .ytcc-mobile-bg .ytcc-progress-head,
    body.dark-mode .ytcc-mobile-bg .ytcc-progress-head,
    .dark .ytcc-mobile-bg .ytcc-progress-head {
        color: #cbd5e1;
    }

    .ytcc-mobile-bg #ytcc-progress-text {
        flex: 1;
        color: inherit;
        overflow-wrap: anywhere;
    }

    .ytcc-mobile-bg #ytcc-progress-pct {
        flex: 0 0 auto;
        min-width: 34px;
        text-align: right;
    }

    .ytcc-mobile-bg .ytcc-track {
        height: 8px;
        margin-top: 18px;
        background: rgba(203, 213, 225, .86);
    }

    body.dark .ytcc-mobile-bg .ytcc-track,
    body.dark-mode .ytcc-mobile-bg .ytcc-track,
    .dark .ytcc-mobile-bg .ytcc-track {
        background: rgba(0, 0, 0, .5);
    }

    @keyframes ytcc-progress-pulse-glow {
        0%, 100% {
            box-shadow: 0 10px 26px rgba(79, 70, 229, .16), 0 0 0 0 rgba(124, 58, 237, .34), inset 0 1px 0 rgba(255, 255, 255, .35);
            transform: scale(1);
        }
        50% {
            box-shadow: 0 10px 26px rgba(79, 70, 229, .16), 0 0 0 18px rgba(124, 58, 237, 0), inset 0 1px 0 rgba(255, 255, 255, .35);
            transform: scale(1.05);
        }
    }

    @keyframes ytcc-progress-chip-pulse {
        0%, 100% {
            transform: scale(1);
            opacity: .9;
        }
        50% {
            transform: scale(1.08);
            opacity: 1;
        }
    }

    .ytcc-mobile-bg .ytcc-results {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 4px 0 calc(36px + var(--ytcc-safe-bottom));
    }

    .ytcc-mobile-bg .ytcc-section,
    .ytcc-mobile-bg .ytcc-output-card {
        border: 1px solid rgba(148, 163, 184, .22);
        border-radius: 24px;
        background: rgba(255, 255, 255, .78);
        box-shadow: 0 18px 42px rgba(30, 41, 59, .12), inset 0 1px 0 rgba(255, 255, 255, .74);
        backdrop-filter: blur(24px);
        -webkit-backdrop-filter: blur(24px);
    }

    body.dark .ytcc-mobile-bg .ytcc-section,
    body.dark .ytcc-mobile-bg .ytcc-output-card,
    body.dark-mode .ytcc-mobile-bg .ytcc-section,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-card,
    .dark .ytcc-mobile-bg .ytcc-section,
    .dark .ytcc-mobile-bg .ytcc-output-card {
        border-color: rgba(255, 255, 255, .1);
        background: rgba(22, 17, 43, .65);
        box-shadow: 0 16px 40px rgba(0, 0, 0, .4), inset 0 1px 1px rgba(255, 255, 255, .05);
    }

    .ytcc-mobile-bg .ytcc-output-head {
        background: rgba(99, 102, 241, .08);
    }

    .ytcc-mobile-bg .ytcc-section-title,
    .ytcc-mobile-bg .ytcc-output-title,
    .ytcc-mobile-bg .ytcc-primary,
    .ytcc-mobile-bg .ytcc-body-box,
    .ytcc-mobile-bg .ytcc-comp-title {
        color: #3f4f68;
    }

    body.dark .ytcc-mobile-bg .ytcc-section-title,
    body.dark .ytcc-mobile-bg .ytcc-output-title,
    body.dark .ytcc-mobile-bg .ytcc-primary,
    body.dark .ytcc-mobile-bg .ytcc-body-box,
    body.dark .ytcc-mobile-bg .ytcc-comp-title,
    body.dark-mode .ytcc-mobile-bg .ytcc-section-title,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-title,
    body.dark-mode .ytcc-mobile-bg .ytcc-primary,
    body.dark-mode .ytcc-mobile-bg .ytcc-body-box,
    body.dark-mode .ytcc-mobile-bg .ytcc-comp-title,
    .dark .ytcc-mobile-bg .ytcc-section-title,
    .dark .ytcc-mobile-bg .ytcc-output-title,
    .dark .ytcc-mobile-bg .ytcc-primary,
    .dark .ytcc-mobile-bg .ytcc-body-box,
    .dark .ytcc-mobile-bg .ytcc-comp-title {
        color: #fff;
    }

    .ytcc-mobile-bg .ytcc-app.is-processing .ytcc-hero,
    .ytcc-mobile-bg .ytcc-app.has-results .ytcc-hero,
    .ytcc-mobile-bg .ytcc-app.has-results .ytcc-progress {
        display: none !important;
    }

    .ytcc-mobile-bg .ytcc-result-nav {
        margin: 0 0 16px;
    }

    .ytcc-mobile-bg.ytcc-keyboard-active {
        min-height: 100dvh;
        padding-top: 10px;
        padding-bottom: calc(46vh + var(--ytcc-safe-bottom));
        scroll-padding-top: 12px;
        scroll-padding-bottom: 46vh;
    }

    .ytcc-mobile-bg.ytcc-keyboard-active .ytcc-hero {
        padding-top: 8px;
        padding-bottom: 18px;
    }

    .ytcc-mobile-bg.ytcc-keyboard-active .ytcc-eyebrow,
    .ytcc-mobile-bg.ytcc-keyboard-active .ytcc-desc,
    .ytcc-mobile-bg.ytcc-keyboard-active .ytcc-guide,
    .ytcc-mobile-bg.ytcc-keyboard-active .ytcc-history {
        display: none !important;
    }

    .ytcc-mobile-bg.ytcc-keyboard-active .ytcc-title {
        margin-bottom: 12px;
        font-size: 1.55rem;
    }

    .ytcc-mobile-bg.ytcc-keyboard-active .ytcc-title-gradient {
        font-size: 1.25rem;
    }

    /* Android parity pass: keep the first screen shaped like Content Blueprint mobile. */
    .ytcc-mobile-bg {
        padding: 16px 12px calc(40px + var(--ytcc-safe-bottom));
    }

    .ytcc-mobile-bg .ytcc-hero {
        padding: 48px 0 32px;
    }

    .ytcc-mobile-bg .ytcc-eyebrow {
        margin-bottom: 18px;
        background: rgba(99, 102, 241, .1);
        border-color: rgba(99, 102, 241, .24);
        color: #4f46e5;
        box-shadow: 0 8px 18px rgba(79, 70, 229, .1);
    }

    .ytcc-mobile-bg .ytcc-title {
        margin-bottom: 18px;
        color: #3f4f68;
        font-size: 2rem;
        line-height: 1.1;
    }

    .ytcc-mobile-bg .ytcc-title-gradient {
        background: linear-gradient(to right, #00f2fe 0%, #4facfe 32%, #8b5cf6 72%, #d8b4fe 100%);
        -webkit-background-clip: text;
        background-clip: text;
        font-size: 1.55rem;
    }

    .ytcc-mobile-bg .ytcc-desc {
        max-width: 460px;
        margin-bottom: 18px;
        font-size: .86rem;
        line-height: 1.6;
    }

    .ytcc-mobile-bg .ytcc-guide {
        display: none !important;
    }

    .ytcc-mobile-bg .ytcc-form {
        display: flex;
        flex-direction: column;
        gap: 14px;
        margin: 0 auto;
        padding: 0;
    }

    .ytcc-mobile-bg .ytcc-label {
        position: absolute !important;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
    }

    .ytcc-mobile-bg #keyword,
    .ytcc-mobile-bg .ytcc-language-trigger {
        min-height: 56px;
        border: 1.5px solid rgba(148, 163, 184, .24);
        border-radius: 999px;
        background: rgba(255, 255, 255, .82);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .74), 0 8px 24px rgba(30, 41, 59, .08);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
    }

    .ytcc-mobile-bg #keyword {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 0 20px;
    }

    .ytcc-mobile-bg .ytcc-field-icon,
    .ytcc-mobile-bg .ytcc-trigger-icon {
        flex: 0 0 auto;
        color: #635bff;
        font-size: 20px;
    }

    .ytcc-mobile-bg #keyword .ytcc-input {
        flex: 1;
        min-width: 0;
        min-height: 0;
        height: auto;
        padding: 0;
        border: 0 !important;
        border-radius: 0;
        background: transparent !important;
        box-shadow: none !important;
        color: #475569;
        font-size: .95rem;
        transform: none !important;
    }

    .ytcc-mobile-bg #keyword .ytcc-input:focus {
        transform: none !important;
    }

    .ytcc-mobile-bg #keyword:focus-within,
    .ytcc-mobile-bg .ytcc-language-ui.is-open .ytcc-language-trigger {
        border-color: rgba(99, 102, 241, .46);
        background: rgba(255, 255, 255, .96);
        box-shadow: 0 0 0 1px rgba(99, 102, 241, .16), 0 14px 34px rgba(30, 41, 59, .12), inset 0 1px 0 rgba(255, 255, 255, .78);
        transform: translateY(-1px);
    }

    .ytcc-mobile-bg .ytcc-two {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .ytcc-mobile-bg .ytcc-select-field {
        display: block;
    }

    .ytcc-mobile-bg .ytcc-language-trigger {
        width: 100%;
        justify-content: flex-start;
        gap: 12px;
        padding: 0 20px;
        color: #475569;
        font-size: .95rem;
        text-align: left;
    }

    .ytcc-mobile-bg .ytcc-language-trigger [data-ytcc-select-label],
    .ytcc-mobile-bg .ytcc-language-trigger [data-ytcc-simple-label] {
        flex: 1;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .ytcc-mobile-bg .ytcc-select-caret {
        margin-left: auto;
    }

    .ytcc-mobile-bg .ytcc-language-dropdown {
        overflow: hidden;
    }

    .ytcc-mobile-bg .ytcc-output-field {
        margin-top: 0;
    }

    .ytcc-mobile-bg .ytcc-output-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        justify-content: stretch;
    }

    .ytcc-mobile-bg .ytcc-check {
        justify-content: flex-start;
        min-height: 42px;
        padding: 0 11px;
        gap: 7px;
        border-radius: 999px;
    }

    .ytcc-mobile-bg .ytcc-check-icon {
        width: 18px;
        height: 18px;
        flex-basis: 18px;
        border-radius: 7px;
        font-size: 12px;
    }

    .ytcc-mobile-bg .ytcc-check strong {
        font-size: .72rem;
        line-height: 1.15;
    }

    .ytcc-mobile-bg .ytcc-btn {
        min-height: 52px;
        margin-top: 2px;
        border-radius: 999px;
        font-size: .95rem;
    }

    .ytcc-mobile-bg .ytcc-history {
        margin-top: 26px;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .ytcc-mobile-bg .ytcc-history-heading {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        width: 100%;
        margin-bottom: 16px;
        color: #526278;
        font-size: .85rem;
        font-weight: 800;
        letter-spacing: 1.5px;
        text-transform: uppercase;
    }

    .ytcc-mobile-bg .ytcc-history-heading::before,
    .ytcc-mobile-bg .ytcc-history-heading::after {
        content: "";
        flex: 1;
        border-bottom: 1px solid rgba(148, 163, 184, .24);
    }

    .ytcc-mobile-bg .ytcc-history-heading ion-icon {
        color: #635bff;
        font-size: 1.05rem;
    }

    .ytcc-mobile-bg .ytcc-history-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }

    .ytcc-mobile-bg .ytcc-history-item {
        min-height: 32px;
        max-width: min(100%, 230px);
        padding: 0 12px;
        border-radius: 999px;
        background: rgba(255, 255, 255, .72);
        font-size: .7rem;
        text-align: center;
    }

    .ytcc-mobile-bg #ytcc-load-more {
        min-height: 34px;
        margin: 14px auto 0;
        border: 0;
        background: transparent;
        box-shadow: none;
        color: #5b5ff0;
        font-size: .75rem;
        text-transform: uppercase;
        letter-spacing: .5px;
    }

    body.dark .ytcc-mobile-bg #keyword,
    body.dark .ytcc-mobile-bg .ytcc-language-trigger,
    body.dark-mode .ytcc-mobile-bg #keyword,
    body.dark-mode .ytcc-mobile-bg .ytcc-language-trigger,
    .dark .ytcc-mobile-bg #keyword,
    .dark .ytcc-mobile-bg .ytcc-language-trigger {
        border-color: rgba(255, 255, 255, .2);
        background: rgba(255, 255, 255, .1);
        color: #fff;
        box-shadow: 0 8px 32px rgba(0, 0, 0, .2), inset 0 1px 2px rgba(255, 255, 255, .15);
    }

    body.dark .ytcc-mobile-bg #keyword .ytcc-input,
    body.dark-mode .ytcc-mobile-bg #keyword .ytcc-input,
    .dark .ytcc-mobile-bg #keyword .ytcc-input {
        color: #fff;
    }

    body.dark .ytcc-mobile-bg .ytcc-field-icon,
    body.dark .ytcc-mobile-bg .ytcc-trigger-icon,
    body.dark-mode .ytcc-mobile-bg .ytcc-field-icon,
    body.dark-mode .ytcc-mobile-bg .ytcc-trigger-icon,
    .dark .ytcc-mobile-bg .ytcc-field-icon,
    .dark .ytcc-mobile-bg .ytcc-trigger-icon {
        color: #d8b4fe;
    }

    body.dark .ytcc-mobile-bg .ytcc-history-heading,
    body.dark-mode .ytcc-mobile-bg .ytcc-history-heading,
    .dark .ytcc-mobile-bg .ytcc-history-heading {
        color: #f8fafc;
    }

    body.dark .ytcc-mobile-bg .ytcc-history-heading::before,
    body.dark .ytcc-mobile-bg .ytcc-history-heading::after,
    body.dark-mode .ytcc-mobile-bg .ytcc-history-heading::before,
    body.dark-mode .ytcc-mobile-bg .ytcc-history-heading::after,
    .dark .ytcc-mobile-bg .ytcc-history-heading::before,
    .dark .ytcc-mobile-bg .ytcc-history-heading::after {
        border-bottom-color: rgba(255, 255, 255, .15);
    }

    body.dark .ytcc-mobile-bg .ytcc-history-item,
    body.dark-mode .ytcc-mobile-bg .ytcc-history-item,
    .dark .ytcc-mobile-bg .ytcc-history-item {
        background: rgba(255, 255, 255, .08);
    }

    .ytcc-mobile-bg.ytcc-keyboard-active .ytcc-hero {
        padding-top: 8px;
    }

    .ytcc-mobile-bg .ytcc-output-field {
        position: relative;
        margin-top: 2px;
        padding: 12px;
        border: 1px solid rgba(148, 163, 184, .16);
        border-radius: 26px;
        background: rgba(255, 255, 255, .38);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .56);
    }

    .ytcc-mobile-bg .ytcc-output-field > .ytcc-label {
        position: static !important;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: auto;
        height: auto;
        margin: 0 0 11px;
        overflow: visible;
        clip: auto;
        color: #526278;
        font-size: .72rem;
        font-weight: 850;
        letter-spacing: 1.35px;
        line-height: 1.2;
        text-transform: uppercase;
        white-space: normal;
    }

    .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::before,
    .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::after {
        content: "";
        height: 1px;
        flex: 1;
        background: rgba(148, 163, 184, .24);
    }

    .ytcc-mobile-bg .ytcc-output-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .ytcc-mobile-bg .ytcc-check {
        position: relative;
        display: flex;
        align-items: center;
        min-width: 0;
        min-height: 48px;
        gap: 8px;
        padding: 8px 32px 8px 10px;
        border: 1px solid rgba(148, 163, 184, .22);
        border-radius: 18px;
        background: rgba(255, 255, 255, .66);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), 0 8px 18px rgba(30, 41, 59, .06);
        text-align: left;
        transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
    }

    .ytcc-mobile-bg .ytcc-check:active {
        transform: scale(.985);
    }

    .ytcc-mobile-bg .ytcc-check-wide {
        grid-column: 1 / -1;
    }

    .ytcc-mobile-bg .ytcc-check-icon {
        width: 28px;
        height: 28px;
        flex: 0 0 28px;
        border: 0;
        border-radius: 12px;
        background: rgba(99, 102, 241, .1);
        color: #635bff;
        font-size: 16px;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6);
    }

    .ytcc-mobile-bg .ytcc-check-content {
        display: block;
        min-width: 0;
    }

    .ytcc-mobile-bg .ytcc-check strong {
        display: block;
        color: #3f4f68;
        font-size: .74rem;
        font-weight: 850;
        line-height: 1.18;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .ytcc-mobile-bg .ytcc-check-mark {
        position: absolute;
        top: 50%;
        right: 9px;
        display: inline-flex;
        width: 18px;
        height: 18px;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(148, 163, 184, .32);
        border-radius: 999px;
        color: transparent;
        transform: translateY(-50%);
        transition: border-color .18s ease, background .18s ease, color .18s ease;
    }

    .ytcc-mobile-bg .ytcc-check-mark ion-icon {
        font-size: 13px;
    }

    .ytcc-mobile-bg .ytcc-check:has(input:checked) {
        border-color: rgba(99, 102, 241, .38);
        background: rgba(255, 255, 255, .92);
        box-shadow: 0 10px 24px rgba(79, 70, 229, .12), inset 0 1px 0 rgba(255, 255, 255, .86);
    }

    .ytcc-mobile-bg .ytcc-check:has(input:checked) .ytcc-check-icon {
        background: linear-gradient(135deg, #7c3aed, #3b82f6);
        color: #fff;
        box-shadow: 0 8px 16px rgba(99, 102, 241, .22);
    }

    .ytcc-mobile-bg .ytcc-check:has(input:checked) .ytcc-check-mark {
        border-color: transparent;
        background: #635bff;
        color: #fff;
    }

    body.dark .ytcc-mobile-bg .ytcc-output-field,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-field,
    .dark .ytcc-mobile-bg .ytcc-output-field {
        border-color: rgba(255, 255, 255, .1);
        background: rgba(255, 255, 255, .06);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    }

    body.dark .ytcc-mobile-bg .ytcc-output-field > .ytcc-label,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-field > .ytcc-label,
    .dark .ytcc-mobile-bg .ytcc-output-field > .ytcc-label {
        color: rgba(255, 255, 255, .72);
    }

    body.dark .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::before,
    body.dark .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::after,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::before,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::after,
    .dark .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::before,
    .dark .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::after {
        background: rgba(255, 255, 255, .15);
    }

    body.dark .ytcc-mobile-bg .ytcc-check,
    body.dark-mode .ytcc-mobile-bg .ytcc-check,
    .dark .ytcc-mobile-bg .ytcc-check {
        border-color: rgba(255, 255, 255, .12);
        background: rgba(255, 255, 255, .08);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
    }

    body.dark .ytcc-mobile-bg .ytcc-check strong,
    body.dark-mode .ytcc-mobile-bg .ytcc-check strong,
    .dark .ytcc-mobile-bg .ytcc-check strong {
        color: #fff;
    }

    body.dark .ytcc-mobile-bg .ytcc-check-icon,
    body.dark-mode .ytcc-mobile-bg .ytcc-check-icon,
    .dark .ytcc-mobile-bg .ytcc-check-icon {
        background: rgba(167, 139, 250, .14);
        color: #d8b4fe;
    }

    body.dark .ytcc-mobile-bg .ytcc-check-mark,
    body.dark-mode .ytcc-mobile-bg .ytcc-check-mark,
    .dark .ytcc-mobile-bg .ytcc-check-mark {
        border-color: rgba(255, 255, 255, .22);
    }

    body.dark .ytcc-mobile-bg .ytcc-check:has(input:checked),
    body.dark-mode .ytcc-mobile-bg .ytcc-check:has(input:checked),
    .dark .ytcc-mobile-bg .ytcc-check:has(input:checked) {
        border-color: rgba(167, 139, 250, .4);
        background: rgba(167, 139, 250, .14);
        box-shadow: 0 10px 24px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .08);
    }

    /* Compact Android output picker: tool-dock style, not desktop checkboxes. */
    .ytcc-mobile-bg .ytcc-output-field {
        margin-top: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .ytcc-mobile-bg .ytcc-output-field > .ytcc-label {
        position: absolute !important;
        width: 1px;
        height: 1px;
        margin: 0;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
    }

    .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::before,
    .ytcc-mobile-bg .ytcc-output-field > .ytcc-label::after {
        content: none;
    }

    .ytcc-mobile-bg .ytcc-output-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 7px;
        padding: 8px;
        border: 1px solid rgba(148, 163, 184, .16);
        border-radius: 24px;
        background: linear-gradient(180deg, rgba(255, 255, 255, .38), rgba(255, 255, 255, .18));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .56);
    }

    .ytcc-mobile-bg .ytcc-check,
    .ytcc-mobile-bg .ytcc-check-wide {
        grid-column: auto;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        min-width: 0;
        min-height: 50px;
        gap: 5px;
        padding: 7px 5px 6px;
        border: 1px solid rgba(148, 163, 184, .14);
        border-radius: 16px;
        background: rgba(255, 255, 255, .52);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .68);
        text-align: center;
    }

    .ytcc-mobile-bg .ytcc-check-icon {
        width: 23px;
        height: 23px;
        flex: 0 0 23px;
        border-radius: 10px;
        background: rgba(99, 102, 241, .1);
        color: #635bff;
        font-size: 14px;
        box-shadow: none;
    }

    .ytcc-mobile-bg .ytcc-check-content {
        width: 100%;
        flex: 1;
        min-height: 0;
    }

    .ytcc-mobile-bg .ytcc-check strong {
        display: -webkit-box;
        color: #3f4f68;
        font-size: .62rem;
        font-weight: 850;
        line-height: 1.08;
        text-align: center;
        white-space: normal;
        overflow: hidden;
        overflow-wrap: anywhere;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .ytcc-mobile-bg .ytcc-check-mark {
        display: none !important;
    }

    .ytcc-mobile-bg .ytcc-check:not(:has(input:checked)) {
        opacity: .58;
    }

    .ytcc-mobile-bg .ytcc-check:has(input:checked) {
        opacity: 1;
        border-color: rgba(99, 102, 241, .28);
        background: linear-gradient(180deg, rgba(99, 102, 241, .16), rgba(79, 172, 254, .08));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72), 0 8px 18px rgba(79, 70, 229, .1);
    }

    .ytcc-mobile-bg .ytcc-check:has(input:checked) .ytcc-check-icon {
        background: linear-gradient(135deg, #7c3aed, #3b82f6);
        color: #fff;
        box-shadow: 0 7px 14px rgba(99, 102, 241, .22);
    }

    body.dark .ytcc-mobile-bg .ytcc-output-grid,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-grid,
    .dark .ytcc-mobile-bg .ytcc-output-grid {
        border-color: rgba(255, 255, 255, .1);
        background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .035));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    }

    body.dark .ytcc-mobile-bg .ytcc-check,
    body.dark-mode .ytcc-mobile-bg .ytcc-check,
    .dark .ytcc-mobile-bg .ytcc-check {
        border-color: rgba(255, 255, 255, .1);
        background: rgba(255, 255, 255, .06);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
    }

    body.dark .ytcc-mobile-bg .ytcc-check strong,
    body.dark-mode .ytcc-mobile-bg .ytcc-check strong,
    .dark .ytcc-mobile-bg .ytcc-check strong {
        color: #fff;
    }

    body.dark .ytcc-mobile-bg .ytcc-check:has(input:checked),
    body.dark-mode .ytcc-mobile-bg .ytcc-check:has(input:checked),
    .dark .ytcc-mobile-bg .ytcc-check:has(input:checked) {
        border-color: rgba(167, 139, 250, .34);
        background: linear-gradient(180deg, rgba(167, 139, 250, .17), rgba(79, 172, 254, .08));
        box-shadow: 0 8px 18px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .08);
    }

    @media (max-width: 370px) {
        .ytcc-mobile-bg .ytcc-output-grid {
            gap: 5px;
            padding: 6px;
            border-radius: 20px;
        }

        .ytcc-mobile-bg .ytcc-check,
        .ytcc-mobile-bg .ytcc-check-wide {
            min-height: 46px;
            padding: 6px 4px 5px;
            border-radius: 14px;
        }

        .ytcc-mobile-bg .ytcc-check-icon {
            width: 21px;
            height: 21px;
            flex-basis: 21px;
            font-size: 13px;
        }

        .ytcc-mobile-bg .ytcc-check strong {
            font-size: .58rem;
        }
    }

    /* Android output settings: compact rows with clear selected/disabled states. */
    .ytcc-mobile-bg .ytcc-output-field {
        margin-top: 2px;
        padding: 12px;
        border: 1px solid rgba(99, 102, 241, .16);
        border-radius: 24px;
        background: linear-gradient(180deg, rgba(255, 255, 255, .74), rgba(239, 246, 255, .5));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82), 0 12px 28px rgba(59, 130, 246, .1);
    }

    .ytcc-mobile-bg .ytcc-output-field > .ytcc-label {
        display: none !important;
    }

    .ytcc-mobile-bg .ytcc-output-settings-head {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 10px;
        color: #334155;
        text-align: left;
    }

    .ytcc-mobile-bg .ytcc-output-settings-icon {
        width: 34px;
        height: 34px;
        flex: 0 0 34px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background: linear-gradient(135deg, rgba(124, 58, 237, .18), rgba(59, 130, 246, .14));
        color: #635bff;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
    }

    .ytcc-mobile-bg .ytcc-output-settings-icon ion-icon {
        font-size: 19px;
    }

    .ytcc-mobile-bg .ytcc-output-settings-copy {
        min-width: 0;
        flex: 1;
    }

    .ytcc-mobile-bg .ytcc-output-settings-copy strong {
        display: block;
        color: #334155;
        font-size: .8rem;
        font-weight: 900;
        line-height: 1.18;
    }

    .ytcc-mobile-bg .ytcc-output-settings-copy span {
        display: block;
        margin-top: 2px;
        color: rgba(100, 116, 139, .86);
        font-size: .67rem;
        font-weight: 600;
        line-height: 1.25;
    }

    .ytcc-mobile-bg .ytcc-output-count {
        min-width: 42px;
        height: 26px;
        padding: 0 9px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: rgba(99, 102, 241, .1);
        color: #4f46e5;
        font-size: .68rem;
        font-weight: 900;
        letter-spacing: .02em;
    }

    .ytcc-mobile-bg .ytcc-output-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
        padding: 6px;
        overflow: hidden;
        border: 1px solid rgba(99, 102, 241, .14);
        border-radius: 20px;
        background: rgba(255, 255, 255, .48);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72);
    }

    .ytcc-mobile-bg .ytcc-check,
    .ytcc-mobile-bg .ytcc-check-wide {
        min-height: 44px;
        padding: 7px 9px 7px 8px;
        border: 0;
        border-radius: 16px;
        background: rgba(255, 255, 255, .54);
        box-shadow: none;
        opacity: 1;
        display: grid;
        grid-template-columns: 30px minmax(0, 1fr);
        align-items: center;
        gap: 7px;
    }

    .ytcc-mobile-bg .ytcc-check:active {
        transform: scale(.99);
        background: rgba(99, 102, 241, .12);
    }

    .ytcc-mobile-bg .ytcc-check:not(:has(input:checked)) {
        opacity: .82;
    }

    .ytcc-mobile-bg .ytcc-check:has(input:checked) {
        background: linear-gradient(135deg, rgba(99, 102, 241, .2), rgba(79, 172, 254, .12));
        box-shadow: inset 0 0 0 1px rgba(99, 102, 241, .24), 0 8px 18px rgba(79, 70, 229, .1);
    }

    .ytcc-mobile-bg .ytcc-check:has(input:checked) .ytcc-check-icon {
        background: linear-gradient(135deg, #7c3aed, #3b82f6);
        color: #fff;
        box-shadow: 0 8px 16px rgba(99, 102, 241, .2);
    }

    .ytcc-mobile-bg .ytcc-check-icon {
        width: 30px;
        height: 30px;
        border-radius: 13px;
        background: rgba(99, 102, 241, .1);
        color: #635bff;
        font-size: 17px;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .65);
    }

    .ytcc-mobile-bg .ytcc-check-icon ion-icon {
        display: block !important;
    }

    .ytcc-mobile-bg .ytcc-check-icon::after {
        content: none !important;
        display: none !important;
    }

    .ytcc-mobile-bg .ytcc-check-content {
        min-width: 0;
    }

    .ytcc-mobile-bg .ytcc-check strong {
        color: #334155;
        font-size: .73rem;
        font-weight: 900;
        line-height: 1.12;
    }

    .ytcc-mobile-bg .ytcc-check-sub {
        display: block;
        margin-top: 2px;
        color: rgba(100, 116, 139, .82);
        font-size: .62rem;
        font-weight: 700;
        line-height: 1.12;
    }

    .ytcc-mobile-bg .ytcc-output-switch {
        display: none !important;
    }

    .ytcc-mobile-bg .ytcc-output-badge {
        display: none;
        align-items: center;
        gap: 3px;
        width: max-content;
        max-width: 100%;
        margin-top: 5px;
        padding: 3px 7px;
        border-radius: 999px;
        background: rgba(99, 102, 241, .1);
        color: #4f46e5;
        font-size: .55rem;
        font-weight: 900;
        line-height: 1;
    }

    .ytcc-mobile-bg .ytcc-output-badge ion-icon {
        font-size: 10px;
    }

    .ytcc-mobile-bg .ytcc-check.is-disabled,
    .ytcc-mobile-bg .ytcc-check:has(input:disabled) {
        cursor: not-allowed;
        opacity: .64;
        background: rgba(226, 232, 240, .42);
        box-shadow: inset 0 0 0 1px rgba(148, 163, 184, .16);
    }

    .ytcc-mobile-bg .ytcc-check.is-disabled .ytcc-check-icon,
    .ytcc-mobile-bg .ytcc-check:has(input:disabled) .ytcc-check-icon {
        background: rgba(148, 163, 184, .16);
        color: #94a3b8;
        box-shadow: none;
    }

    .ytcc-mobile-bg .ytcc-check.is-disabled .ytcc-output-badge,
    .ytcc-mobile-bg .ytcc-check:has(input:disabled) .ytcc-output-badge {
        display: inline-flex;
    }

    body.dark .ytcc-mobile-bg .ytcc-output-grid,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-grid,
    .dark .ytcc-mobile-bg .ytcc-output-grid {
        border-color: rgba(167, 139, 250, .18);
        background: rgba(255, 255, 255, .06);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    }

    body.dark .ytcc-mobile-bg .ytcc-output-field,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-field,
    .dark .ytcc-mobile-bg .ytcc-output-field {
        border-color: rgba(167, 139, 250, .18);
        background: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(167, 139, 250, .05));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 28px rgba(0, 0, 0, .18);
    }

    body.dark .ytcc-mobile-bg .ytcc-output-settings-copy strong,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-settings-copy strong,
    .dark .ytcc-mobile-bg .ytcc-output-settings-copy strong,
    body.dark .ytcc-mobile-bg .ytcc-check strong,
    body.dark-mode .ytcc-mobile-bg .ytcc-check strong,
    .dark .ytcc-mobile-bg .ytcc-check strong {
        color: #fff;
    }

    body.dark .ytcc-mobile-bg .ytcc-output-settings-copy span,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-settings-copy span,
    .dark .ytcc-mobile-bg .ytcc-output-settings-copy span,
    body.dark .ytcc-mobile-bg .ytcc-check-sub,
    body.dark-mode .ytcc-mobile-bg .ytcc-check-sub,
    .dark .ytcc-mobile-bg .ytcc-check-sub {
        color: rgba(255, 255, 255, .68);
    }

    body.dark .ytcc-mobile-bg .ytcc-check,
    body.dark-mode .ytcc-mobile-bg .ytcc-check,
    .dark .ytcc-mobile-bg .ytcc-check {
        background: rgba(255, 255, 255, .06);
    }

    body.dark .ytcc-mobile-bg .ytcc-check:has(input:checked),
    body.dark-mode .ytcc-mobile-bg .ytcc-check:has(input:checked),
    .dark .ytcc-mobile-bg .ytcc-check:has(input:checked) {
        background: linear-gradient(180deg, rgba(167, 139, 250, .28), rgba(79, 172, 254, .12));
        box-shadow: none;
    }

    body.dark .ytcc-mobile-bg .ytcc-check.is-disabled,
    body.dark .ytcc-mobile-bg .ytcc-check:has(input:disabled),
    body.dark-mode .ytcc-mobile-bg .ytcc-check.is-disabled,
    body.dark-mode .ytcc-mobile-bg .ytcc-check:has(input:disabled),
    .dark .ytcc-mobile-bg .ytcc-check.is-disabled,
    .dark .ytcc-mobile-bg .ytcc-check:has(input:disabled) {
        background: rgba(15, 23, 42, .24);
        opacity: .58;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
    }

    @media (max-width: 374px) {
        .ytcc-mobile-bg .ytcc-output-grid {
            grid-template-columns: 1fr;
        }
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check {
        grid-template-columns: 30px minmax(0, 1fr) !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check-icon {
        width: 30px !important;
        height: 30px !important;
        flex: 0 0 30px !important;
        border: 0 !important;
        border-radius: 13px !important;
        background: rgba(99, 102, 241, .1) !important;
        color: #635bff !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check-icon ion-icon {
        display: block !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check-icon::after {
        content: none !important;
        display: none !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check:has(input:checked) .ytcc-check-icon {
        background: linear-gradient(135deg, #7c3aed, #3b82f6) !important;
        color: #fff !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-output-switch {
        display: none !important;
    }
    .ytcc-mobile-bg .ytcc-output-field {
        padding: 14px !important;
    }

    .ytcc-mobile-bg .ytcc-output-grid {
        gap: 7px !important;
        padding: 8px !important;
        border-radius: 22px !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check {
        min-height: 46px !important;
        padding: 8px 9px !important;
        border: 1px solid rgba(148, 163, 184, .18) !important;
        border-radius: 17px !important;
        background: linear-gradient(135deg, rgba(226, 232, 240, .76), rgba(239, 246, 255, .58)) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72) !important;
        opacity: 1 !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check:not(:has(input:checked)) strong {
        color: #64748b !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check:not(:has(input:checked)) .ytcc-check-sub {
        color: rgba(100, 116, 139, .72) !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check:not(:has(input:checked)) .ytcc-check-icon {
        background: rgba(148, 163, 184, .16) !important;
        color: #818cf8 !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check:has(input:checked) {
        border-color: rgba(99, 102, 241, .32) !important;
        background: linear-gradient(135deg, rgba(99, 102, 241, .2), rgba(79, 172, 254, .12)) !important;
        box-shadow: inset 0 0 0 1px rgba(99, 102, 241, .16), 0 8px 18px rgba(79, 70, 229, .1) !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check:has(input:checked) strong {
        color: #334155 !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check.is-disabled,
    .ytcc-mobile-bg .ytcc-output-field .ytcc-check:has(input:disabled) {
        border-color: rgba(148, 163, 184, .18) !important;
        background: linear-gradient(135deg, rgba(226, 232, 240, .64), rgba(241, 245, 249, .44)) !important;
        box-shadow: inset 0 0 0 1px rgba(148, 163, 184, .1) !important;
        opacity: .72 !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check.is-disabled strong,
    .ytcc-mobile-bg .ytcc-output-field .ytcc-check:has(input:disabled) strong,
    .ytcc-mobile-bg .ytcc-output-field .ytcc-check.is-disabled .ytcc-check-sub,
    .ytcc-mobile-bg .ytcc-output-field .ytcc-check:has(input:disabled) .ytcc-check-sub {
        color: #94a3b8 !important;
    }

    body.dark .ytcc-mobile-bg .ytcc-output-field .ytcc-check,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-field .ytcc-check,
    .dark .ytcc-mobile-bg .ytcc-output-field .ytcc-check {
        border-color: rgba(255, 255, 255, .1) !important;
        background: rgba(30, 41, 59, .5) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06) !important;
    }

    body.dark .ytcc-mobile-bg .ytcc-output-field .ytcc-check:not(:has(input:checked)) strong,
    body.dark-mode .ytcc-mobile-bg .ytcc-output-field .ytcc-check:not(:has(input:checked)) strong,
    .dark .ytcc-mobile-bg .ytcc-output-field .ytcc-check:not(:has(input:checked)) strong {
        color: rgba(226, 232, 240, .68) !important;
    }

    body.dark .ytcc-mobile-bg .ytcc-output-field .ytcc-check:has(input:checked),
    body.dark-mode .ytcc-mobile-bg .ytcc-output-field .ytcc-check:has(input:checked),
    .dark .ytcc-mobile-bg .ytcc-output-field .ytcc-check:has(input:checked) {
        border-color: rgba(167, 139, 250, .32) !important;
        background: linear-gradient(135deg, rgba(99, 102, 241, .28), rgba(79, 172, 254, .12)) !important;
    }

    .ytcc-mobile-bg .ytcc-output-field {
        width: 100% !important;
        padding: 12px !important;
        border-radius: 22px !important;
    }

    .ytcc-mobile-bg .ytcc-output-settings-head {
        margin-bottom: 7px !important;
        gap: 8px !important;
    }

    .ytcc-mobile-bg .ytcc-output-settings-icon {
        width: 28px !important;
        height: 28px !important;
        flex-basis: 28px !important;
        border-radius: 11px !important;
    }

    .ytcc-mobile-bg .ytcc-output-settings-icon ion-icon {
        font-size: 16px !important;
    }

    .ytcc-mobile-bg .ytcc-output-settings-copy strong {
        font-size: .72rem !important;
    }

    .ytcc-mobile-bg .ytcc-output-settings-copy span {
        margin-top: 1px !important;
        font-size: .6rem !important;
    }

    .ytcc-mobile-bg .ytcc-output-count {
        min-width: 36px !important;
        height: 22px !important;
        padding: 0 7px !important;
        font-size: .58rem !important;
    }

    .ytcc-mobile-bg .ytcc-output-grid {
        gap: 5px !important;
        padding: 6px !important;
        border-radius: 17px !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check {
        grid-template-columns: 24px minmax(0, 1fr) !important;
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;
        padding: 5px 7px !important;
        border-radius: 13px !important;
        gap: 6px !important;
        overflow: hidden !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check-icon {
        width: 24px !important;
        height: 24px !important;
        flex-basis: 24px !important;
        border-radius: 9px !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check-icon ion-icon {
        font-size: 13px !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check-content {
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check-content strong {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check strong {
        font-size: .62rem !important;
    }

    .ytcc-mobile-bg .ytcc-output-field .ytcc-check-sub {
        display: none !important;
    }

    .ytcc-mobile-bg .ytcc-output-badge {
        margin: 0 !important;
        padding: 2px 4px !important;
        font-size: .45rem !important;
        flex: 0 0 auto !important;
    }