:root {

    --sgsa-bg: #f3f1f8;

    --sgsa-card: #ffffff;

    --sgsa-soft: #e6e9f2;

    --sgsa-border: #19b4b2;



    --sgsa-text: #1f2937;

    --sgsa-muted: #6b7280;



    --sgsa-accent: #19b4b2;

    --sgsa-accent-soft: rgba(25,180,178,.08);



    --sgsa-radius: 18px;

}



.sgsa-wrapper {

    max-width: 1100px;

    margin: 60px auto;

    display: grid;

    gap: 28px;

    color: var(--sgsa-text);

}



/* ---------- INPUT ---------- */



.sgsa-textarea {

    width: 100%;

    min-height: 400px;

    background: #fff;

    border: 1px solid var(--sgsa-border);

    border-radius: var(--sgsa-radius);

    padding: 18px;

    font-size: 16px;

    transition: border .2s ease, box-shadow .2s ease;

}



.sgsa-textarea:focus {

    outline: none;

    border-color: var(--sgsa-accent);

    box-shadow: 0 0 0 3px var(--sgsa-accent-soft);

}



.sgsa-btn {

    margin-top: 18px;

    padding: 14px 38px;

    border-radius: 12px;

    border: none;

    cursor: pointer;

    font-weight: 600;

    background: var(--sgsa-accent);

    color: #fff;

    transition: transform .15s ease, box-shadow .15s ease;

}



.sgsa-btn:hover {

    transform: translateY(-1px);

    box-shadow: 0 10px 22px rgba(25,180,178,.35);

}



/* ---------- RESULT GRID ---------- */



.sgsa-result {

    display: grid;

    gap: 32px;

}



/* ---------- STATS ---------- */



.sgsa-result ul {

    display: grid;

    grid-template-columns: repeat(auto-fit,minmax(180px,1fr));

    gap: 18px;

    padding: 0;

    list-style: none;

}



.sgsa-result ul li {

    background: var(--sgsa-card);

    padding: 20px;

    border-radius: var(--sgsa-radius);

    border: 1px solid var(--sgsa-border);

    font-size: 15px;

}



.sgsa-result ul li::after {

    content: attr(data-value);

}



.sgsa-result ul li strong {

    display: block;

    font-size: 26px;

    margin-top: 6px;

    color: var(--sgsa-accent);

}



/* ---------- TABLES ---------- */



.sgsa-result table {

    width: 100%;

    border-collapse: collapse;

    background: var(--sgsa-card);

    border-radius: var(--sgsa-radius);

    overflow: hidden;

    border: 1px solid var(--sgsa-border);

}



.sgsa-result th {

    text-align: left;

    background: #f7f9fc;

    color: var(--sgsa-muted);

    padding: 14px 16px;

    font-size: 13px;

}



.sgsa-result td {

    padding: 12px 16px;

    border-top: 1px solid var(--sgsa-border);

}



.sgsa-result tr:hover td {

    background: var(--sgsa-accent-soft);

}



/* ---------- HIGHLIGHTED TEXT ---------- */



.sgsa-highlighted {

    background: #fff;

    border-radius: var(--sgsa-radius);

    padding: 22px;

    border: 1px solid var(--sgsa-border);

    line-height: 1.75;

    max-height: 600px;

    overflow-y: auto;

}



/* ---------- SPAM LEVELS ---------- */



.sgsa-spam-notice {

    background: #fff7cc;

    color: #92400e;

    padding: 3px 7px;

    border-radius: 6px;

    font-weight: 500;

}



.sgsa-spam-warning {

    background: #ffe4b5;

    color: #9a3412;

    padding: 3px 7px;

    border-radius: 6px;

    font-weight: 500;

}



.sgsa-spam-danger {

    background: #ffd6d6;

    color: #991b1b;

    padding: 3px 7px;

    border-radius: 6px;

    font-weight: 600;

}



/* ---------- HEADINGS ---------- */



.sgsa-result h3 {

    font-size: 20px;

    margin-bottom: 12px;

    color: var(--sgsa-text);

}



/* ---------- MOBILE ---------- */



@media (max-width: 640px) {

    .sgsa-wrapper {

        margin: 32px 16px;

    }



    .sgsa-btn {

        width: 100%;

    }

}