/*
 * TG007 Build 0094 — Snippets
 * Route-specific presentation only. Shared shell/navigation/hero/footer remain
 * authoritative in tg007.css and the Build 0091 modern includes.
 */

.tg-snippets-section,
.tg-snippet-detail-section,
.tg-snippet-editor-section {
    background: #f8f8f6;
}

.tg-snippets-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 2rem;
    align-items: start;
}

.tg-snippets-main,
.tg-snippets-sidebar,
.tg-snippet-editor-main,
.tg-snippet-editor-aside {
    min-width: 0;
}

.tg-snippets-heading {
    align-items: end;
    margin-bottom: 1.2rem;
}

.tg-snippets-heading > p {
    margin-bottom: .1rem;
    color: #687784;
    font-size: .84rem;
}

.tg-snippet-list {
    border-top: 1px solid rgba(34, 59, 80, .16);
}

.tg-snippet-row {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: start;
    padding: 1.15rem 0;
    border-bottom: 1px solid rgba(34, 59, 80, .16);
}

.tg-snippet-row:hover {
    background: linear-gradient(90deg, rgba(58, 101, 138, .035), transparent 75%);
}

.tg-snippet-avatar {
    display: block;
    width: 52px;
    height: 52px;
}

.tg-snippet-avatar img,
.tg-snippet-author-block img,
.tg-snippet-comment-avatar img,
.tg-snippet-comment-form > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 1px solid rgba(34, 59, 80, .18);
    background: #fff;
}

.tg-snippet-avatar img,
.tg-snippet-author-block img,
.tg-snippet-comment-avatar img,
.tg-snippet-comment-form > img {
    border-radius: 50%;
}

.tg-snippet-row-main {
    min-width: 0;
}

.tg-snippet-row-topline {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    align-items: center;
    margin-bottom: .28rem;
    color: #73808a;
    font-size: .76rem;
}

.tg-snippet-category {
    color: #2e648d !important;
    font-family: "Space Grotesk", sans-serif;
    font-weight: 700;
    text-decoration: none;
}

.tg-snippet-row h2 {
    margin: 0;
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.15rem;
    line-height: 1.25;
}

.tg-snippet-row h2 a {
    color: #19334a !important;
    text-decoration: none;
}

.tg-snippet-row h2 a:hover,
.tg-snippet-row h2 a:focus-visible {
    color: #275f8c !important;
}

.tg-snippet-row p {
    max-width: 58rem;
    margin: .45rem 0 .55rem;
    color: #586976;
    font-size: .9rem;
}

.tg-snippet-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.tg-snippet-tags a {
    display: inline-flex;
    align-items: center;
    min-height: 1.65rem;
    padding: .22rem .48rem;
    border: 1px solid rgba(48, 85, 115, .16);
    border-radius: .28rem;
    background: #edf1f4;
    color: #45647d !important;
    font-size: .7rem;
    font-weight: 700;
    text-decoration: none;
}

.tg-snippet-tags a:hover,
.tg-snippet-tags a:focus-visible {
    border-color: #6e8da5;
    background: #e3e9ed;
    color: #193b57 !important;
}

.tg-snippet-row-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .85rem;
    margin-top: .6rem;
    color: #74818b;
    font-size: .75rem;
}

.tg-snippet-row-meta a {
    color: #435e74 !important;
    font-weight: 700;
    text-decoration: none;
}

.tg-snippet-open {
    align-self: center;
    padding: .45rem .2rem .45rem .75rem;
    color: #3d6685 !important;
    font-family: "Space Grotesk", sans-serif;
    font-size: .78rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.tg-snippet-open:hover,
.tg-snippet-open:focus-visible {
    color: #173e5d !important;
}

.tg-snippet-category-panel,
.tg-snippet-side-note,
.tg-snippet-editor-aside > section,
.tg-snippet-access-state,
.tg-snippet-search-intro,
.tg-snippet-search-categories {
    border: 1px solid rgba(36, 64, 86, .16);
    border-left: 3px solid #6e8aa0;
    background: #fff;
}

.tg-snippet-category-panel {
    padding: 1rem;
}

.tg-snippet-category-heading h2,
.tg-snippet-side-note h2,
.tg-snippet-editor-aside h2,
.tg-snippet-search-intro h2,
.tg-snippet-search-categories h2,
.tg-snippet-access-state h2 {
    margin: .2rem 0 .75rem;
    color: #20384c;
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.08rem;
}

.tg-snippet-category-link {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    padding: .6rem .15rem;
    border-top: 1px solid rgba(37, 61, 82, .1);
    color: #415566 !important;
    font-size: .8rem;
    text-decoration: none;
}

.tg-snippet-category-link:first-of-type {
    margin-top: .25rem;
}

.tg-snippet-category-link strong {
    color: #6a7883;
    font-size: .72rem;
}

.tg-snippet-category-link:hover,
.tg-snippet-category-link:focus-visible,
.tg-snippet-category-link.is-active {
    color: #173f5f !important;
}

.tg-snippet-category-link.is-active {
    font-weight: 800;
}

.tg-snippet-category-link.is-active strong {
    color: #2d638c;
}

.tg-snippet-side-note {
    margin-top: 1rem;
    padding: 1.1rem;
}

.tg-snippet-side-note p,
.tg-snippet-editor-aside p,
.tg-snippet-search-intro p,
.tg-snippet-access-state p {
    color: #5e6e7a;
    font-size: .85rem;
}

.tg-snippet-side-note .tg-btn {
    margin-top: .25rem;
}

.tg-snippet-empty {
    border: 0;
    background: #fff;
}

/* Search */
.tg-snippet-search-wrap {
    max-width: 1040px;
    margin: 0 auto;
}

.tg-snippet-search-form {
    margin-bottom: 2rem;
    padding: 1.25rem;
    border: 1px solid rgba(35, 64, 88, .16);
    background: #fff;
}

.tg-snippet-search-form > label {
    display: block;
    margin-bottom: .55rem;
    color: #263f53;
    font-family: "Space Grotesk", sans-serif;
    font-weight: 700;
}

.tg-snippet-search-form > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .65rem;
}

.tg-snippet-search-form input,
.tg-snippet-form input,
.tg-snippet-form select,
.tg-snippet-form textarea,
.tg-snippet-comment-form textarea {
    width: 100%;
    border: 1px solid #cbd5dc;
    border-radius: .34rem;
    background: #fff;
    color: #1d2e3c;
    font: inherit;
}

.tg-snippet-search-form input,
.tg-snippet-form input,
.tg-snippet-form select {
    min-height: 2.85rem;
    padding: .62rem .72rem;
}

.tg-snippet-form textarea,
.tg-snippet-comment-form textarea {
    padding: .7rem .75rem;
    resize: vertical;
}

.tg-snippet-search-form input:focus,
.tg-snippet-form input:focus,
.tg-snippet-form select:focus,
.tg-snippet-form textarea:focus,
.tg-snippet-comment-form textarea:focus {
    border-color: #5e84a2;
    outline: 3px solid rgba(53, 104, 147, .13);
}

.tg-snippet-search-intro,
.tg-snippet-search-categories {
    margin-top: 1.25rem;
    padding: 1.2rem;
}

.tg-snippet-category-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
}

.tg-snippet-category-grid a {
    display: flex;
    justify-content: space-between;
    gap: .7rem;
    padding: .7rem .75rem;
    border: 1px solid rgba(42, 75, 101, .13);
    background: #f7f8f8;
    color: #29465c !important;
    font-size: .8rem;
    font-weight: 700;
    text-decoration: none;
}

.tg-snippet-category-grid a:hover,
.tg-snippet-category-grid a:focus-visible {
    border-color: #7893a7;
    background: #eef2f4;
}

.tg-snippet-category-grid strong {
    color: #6a7d8c;
}

/* Submit / edit */
.tg-snippet-editor-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 2rem;
    align-items: start;
}

.tg-snippet-form {
    padding-top: .25rem;
}

.tg-snippet-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.tg-snippet-field {
    margin-bottom: 1rem;
}

.tg-snippet-field label,
.tg-snippet-code-label label,
.tg-snippet-comment-form label {
    display: block;
    margin-bottom: .38rem;
    color: #2a4052;
    font-size: .82rem;
    font-weight: 800;
}

.tg-snippet-field small,
.tg-snippet-code-input + small {
    display: block;
    margin-top: .35rem;
    color: #74818b;
    font-size: .73rem;
}

.tg-snippet-code-label {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: end;
}

.tg-snippet-code-label span {
    color: #74818b;
    font-size: .72rem;
}

.tg-snippet-code-input {
    min-height: 28rem;
    font-family: "Courier New", Courier, monospace !important;
    font-size: .85rem !important;
    line-height: 1.45 !important;
    tab-size: 4;
}

.tg-snippet-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    padding-top: .35rem;
}

.tg-snippet-editor-aside > section {
    padding: 1.15rem;
}

.tg-snippet-editor-aside ul {
    margin: .65rem 0 0;
    padding-left: 1.15rem;
    color: #5b6b78;
    font-size: .82rem;
}

.tg-snippet-editor-aside li + li {
    margin-top: .5rem;
}

.tg-snippet-access-state {
    max-width: 760px;
    margin: 1rem auto;
    padding: 1.5rem;
}

.tg-snippet-access-warning {
    border-left-color: #a47d43;
    background: #fffaf0;
}

.tg-snippet-alert {
    margin-bottom: 1rem;
    padding: .75rem .85rem;
    border: 1px solid rgba(45, 78, 103, .16);
    border-left: 3px solid #6786a0;
    background: #f4f7f9;
    color: #345269;
    font-size: .82rem;
}

.tg-snippet-alert-error {
    border-left-color: #9b5c53;
    background: #fff5f3;
    color: #743f39;
}

.tg-snippet-alert-success {
    border-left-color: #607e62;
    background: #f5f9f5;
    color: #425d45;
}

/* Detail */
.tg-snippet-detail,
.tg-snippet-discussion {
    max-width: 1080px;
    margin: 0 auto;
}

.tg-snippet-detail-header {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    align-items: center;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(34, 59, 80, .15);
}

.tg-snippet-author-block {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: .8rem;
    align-items: center;
}

.tg-snippet-author-block > a {
    width: 56px;
    height: 56px;
}

.tg-snippet-author-block strong,
.tg-snippet-author-block small {
    display: block;
}

.tg-snippet-author-block strong a {
    color: #203d55 !important;
    text-decoration: none;
}

.tg-snippet-author-block small {
    margin-top: .15rem;
    color: #73808a;
    font-size: .74rem;
}

.tg-snippet-detail-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .5rem;
}

.tg-btn-danger {
    border-color: #8e5b56 !important;
    background: #8e5b56 !important;
    color: #fff !important;
}

.tg-btn-danger:hover,
.tg-btn-danger:focus-visible {
    border-color: #744943 !important;
    background: #744943 !important;
}

.tg-snippet-detail-tags {
    margin: 1.1rem 0;
}

.tg-snippet-about-block {
    padding: 1.1rem 0 1.3rem;
    border-bottom: 1px solid rgba(34, 59, 80, .15);
}

.tg-snippet-about-block > div {
    max-width: 64rem;
    margin-top: .35rem;
    color: #3f505e;
    line-height: 1.7;
}

.tg-snippet-code-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 1rem;
    margin-top: 1.3rem;
}

.tg-snippet-code-toolbar strong {
    display: block;
    color: #42586a;
    font-size: .78rem;
}

.tg-snippet-code-frame {
    margin-top: .65rem;
    overflow: auto;
    border: 1px solid #bfcbd4;
    border-left: 4px solid #527b9b;
    background: #f5f7f8;
    box-shadow: inset 0 1px 0 #fff;
}

.tg-snippet-code-frame pre.prettyprint {
    min-width: 100%;
    margin: 0;
    padding: 1rem 1rem 1rem .4rem;
    border: 0;
    background: transparent;
    color: #172633;
    font-family: "Courier New", Courier, monospace;
    font-size: .82rem;
    line-height: 1.5;
    white-space: pre;
    tab-size: 4;
}

.tg-snippet-code-frame ol.linenums {
    margin: 0;
    padding-left: 3rem;
    color: #81909c;
}

.tg-snippet-code-frame li.L0,
.tg-snippet-code-frame li.L1,
.tg-snippet-code-frame li.L2,
.tg-snippet-code-frame li.L3,
.tg-snippet-code-frame li.L4,
.tg-snippet-code-frame li.L5,
.tg-snippet-code-frame li.L6,
.tg-snippet-code-frame li.L7,
.tg-snippet-code-frame li.L8,
.tg-snippet-code-frame li.L9 {
    list-style-type: decimal;
    padding-left: .45rem;
}

.tg-snippet-code-frame .str { color: #365f43; }
.tg-snippet-code-frame .kwd { color: #214f77; font-weight: 700; }
.tg-snippet-code-frame .com { color: #747d84; font-style: italic; }
.tg-snippet-code-frame .typ { color: #4d687d; }
.tg-snippet-code-frame .lit { color: #6f5829; }
.tg-snippet-code-frame .pun { color: #44525d; }
.tg-snippet-code-frame .pln { color: #172633; }
.tg-snippet-code-frame .tag { color: #285d85; }
.tg-snippet-code-frame .atn { color: #506c82; }
.tg-snippet-code-frame .atv { color: #426448; }
.tg-snippet-code-frame .dec { color: #5b7182; }

.tg-snippet-adjacent {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    padding: 1rem 0;
}

.tg-snippet-adjacent a {
    color: #345e7e !important;
    font-family: "Space Grotesk", sans-serif;
    font-size: .82rem;
    font-weight: 700;
    text-decoration: none;
}

.tg-snippet-adjacent a:last-child {
    justify-self: end;
}

.tg-snippet-discussion {
    margin-top: 1.8rem;
    padding-top: 1.5rem;
    border-top: 2px solid rgba(34, 59, 80, .16);
}

.tg-snippet-follow-link {
    border: 0;
    background: transparent;
    color: #35617f;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: .2rem;
}

.tg-snippet-comment-form {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: .8rem;
    margin: 1rem 0 1.25rem;
    padding: 1rem;
    border: 1px solid rgba(36, 64, 86, .15);
    background: #fff;
}

.tg-snippet-comment-form > img {
    width: 46px;
    height: 46px;
}

.tg-snippet-comment-form textarea {
    min-height: 6rem;
}

.tg-snippet-comment-form-footer {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    margin-top: .55rem;
}

.tg-snippet-comment-form-footer > span {
    color: #71808a;
    font-size: .72rem;
}

.tg-snippet-comments {
    border-top: 1px solid rgba(34, 59, 80, .14);
}

.tg-snippet-comment {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: .75rem;
    padding: 1rem .2rem;
    border-bottom: 1px solid rgba(34, 59, 80, .14);
}

.tg-snippet-comment-avatar {
    display: block;
    width: 40px;
    height: 40px;
}

.tg-snippet-comment header {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .65rem;
    align-items: center;
    margin-bottom: .35rem;
}

.tg-snippet-comment header strong a {
    color: #27465e !important;
    text-decoration: none;
}

.tg-snippet-comment header span {
    color: #7a8790;
    font-size: .72rem;
}

.tg-snippet-comment header button {
    margin-left: auto;
    border: 0;
    background: transparent;
    color: #87514b;
    font-size: .7rem;
    font-weight: 700;
    text-decoration: underline;
}

.tg-snippet-comment-body {
    overflow-wrap: anywhere;
    color: #435461;
    font-size: .86rem;
    line-height: 1.6;
}

.tg-snippet-comment-body p:last-child {
    margin-bottom: 0;
}

.tg-snippet-comment-state {
    margin: .8rem 0;
    padding: .8rem 1rem;
    border-left: 3px solid #718ca2;
    background: #fff;
    color: #5c6c78;
    font-size: .82rem;
}

.tg-snippet-older-comments {
    margin-top: .8rem;
}

.tg-snippet-older-comments > summary {
    cursor: pointer;
    padding: .65rem 0;
    color: #365f7d;
    font-size: .78rem;
    font-weight: 800;
}

@media (max-width: 980px) {
    .tg-snippets-layout,
    .tg-snippet-editor-layout {
        grid-template-columns: 1fr;
    }

    .tg-snippets-sidebar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }

    .tg-snippet-side-note {
        margin-top: 0;
    }

    .tg-snippet-editor-aside {
        max-width: none;
    }
}

@media (max-width: 760px) {
    .tg-snippets-heading,
    .tg-snippet-detail-header,
    .tg-snippet-code-toolbar,
    .tg-snippet-comment-form-footer {
        display: block;
    }

    .tg-snippets-heading > p,
    .tg-snippet-detail-actions,
    .tg-snippet-code-toolbar .tg-btn,
    .tg-snippet-comment-form-footer .tg-btn {
        margin-top: .7rem;
    }

    .tg-snippet-detail-actions {
        justify-content: flex-start;
    }

    .tg-snippet-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tg-snippet-form-grid {
        grid-template-columns: 1fr;
        gap: 0;
    }
}

@media (max-width: 620px) {
    .tg-snippet-row {
        grid-template-columns: 44px minmax(0, 1fr);
        gap: .75rem;
    }

    .tg-snippet-avatar {
        width: 42px;
        height: 42px;
    }

    .tg-snippet-open {
        display: none;
    }

    .tg-snippets-sidebar {
        grid-template-columns: 1fr;
    }

    .tg-snippet-search-form > div,
    .tg-snippet-category-grid {
        grid-template-columns: 1fr;
    }

    .tg-snippet-search-form button {
        width: 100%;
    }

    .tg-snippet-comment-form {
        grid-template-columns: 1fr;
    }

    .tg-snippet-comment-form > img {
        display: none;
    }

    .tg-snippet-adjacent {
        grid-template-columns: 1fr;
    }

    .tg-snippet-adjacent a:last-child {
        justify-self: start;
    }
}

@media (max-width: 460px) {
    .tg-snippet-author-block {
        grid-template-columns: 46px minmax(0, 1fr);
    }

    .tg-snippet-author-block > a {
        width: 44px;
        height: 44px;
    }

    .tg-snippet-comment {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .tg-snippet-comment-avatar {
        width: 32px;
        height: 32px;
    }

    .tg-snippet-code-label {
        display: block;
    }

    .tg-snippet-code-label span {
        display: block;
        margin-bottom: .35rem;
    }
}

/* Build 0151 — Snippets archive landing/category modernization. */
.tg-snippet-hero-search {
    width: min(720px, 100%);
    margin-top: 1rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    overflow: hidden;
    border: 1px solid #cfd8dd;
    border-radius: .72rem;
    background: rgba(255, 255, 255, .86);
    box-shadow: 0 8px 20px rgba(33, 48, 60, .035);
}

.tg-snippet-hero-search input,
.tg-snippet-hero-search button {
    min-height: 42px;
    border: 0;
    font: inherit;
}

.tg-snippet-hero-search input {
    min-width: 0;
    padding: .62rem .78rem;
    outline: 0;
    color: #1d2a32;
    background: transparent;
}

.tg-snippet-hero-search:focus-within {
    border-color: #5d93b2;
    box-shadow: 0 0 0 3px rgba(47, 125, 174, .13);
}

.tg-snippet-hero-search button {
    padding: .62rem .95rem;
    color: #fff;
    background: #245f88;
    font-size: .78rem;
    font-weight: 800;
}

.tg-snippet-hero-search button:hover,
.tg-snippet-hero-search button:focus-visible {
    background: #1d5278;
}

.tg-snippet-hero-actions {
    margin-top: .75rem;
}

.tg-snippet-category-section {
    border-top: 1px solid #e0e6ea;
    border-bottom: 1px solid #e0e6ea;
    background:
        radial-gradient(circle at 0 0, rgba(61, 126, 173, .05), transparent 29rem),
        #f5f7f8;
}

.tg-snippet-category-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
}

.tg-snippet-category-card {
    position: relative;
    min-width: 0;
    min-height: 170px;
    display: flex;
    flex-direction: column;
    padding: 1.1rem;
    overflow: hidden;
    border: 1px solid #dbe2e7;
    border-radius: 1rem;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 8px 24px rgba(26, 36, 44, .035);
    color: inherit !important;
    text-decoration: none;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.tg-snippet-category-card::after {
    position: absolute;
    right: -31px;
    bottom: -42px;
    width: 122px;
    height: 122px;
    border: 18px solid rgba(61, 126, 173, .035);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.tg-snippet-category-card:hover,
.tg-snippet-category-card:focus-visible,
.tg-snippet-category-card.is-active {
    border-color: #b9cad5;
    box-shadow: 0 14px 32px rgba(28, 39, 48, .075);
    transform: translateY(-2px);
}

.tg-snippet-category-card.is-active {
    box-shadow: inset 0 3px 0 #4b87ad, 0 14px 32px rgba(28, 39, 48, .075);
}

.tg-snippet-category-card-top,
.tg-snippet-category-card h3,
.tg-snippet-category-card p,
.tg-snippet-category-card-footer {
    position: relative;
    z-index: 1;
}

.tg-snippet-category-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
}

.tg-snippet-category-count {
    color: #6c7a85;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.tg-snippet-category-card h3 {
    margin: .85rem 0 .28rem;
    color: #25323a;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.2;
}

.tg-snippet-category-card p {
    margin: 0;
    color: #6b7882;
    font-size: .76rem;
    line-height: 1.45;
}

.tg-snippet-category-card-footer {
    display: flex;
    justify-content: space-between;
    gap: .8rem;
    margin-top: auto;
    padding-top: .8rem;
    color: #53748c;
    font-size: .7rem;
    font-weight: 800;
}

.tg-snippet-code-tile {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border: 1px solid #b9ccd8;
    border-radius: .78rem;
    background: linear-gradient(145deg, #eef4f7, #e3edf2);
    box-shadow: inset 0 -8px 20px rgba(49, 112, 153, .045);
    color: #2d739c;
    font-family: "Courier New", Courier, monospace;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: -.08em;
}

.tg-snippet-code-tile-small {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
    border-radius: .68rem;
    font-size: .62rem;
}

.tg-snippet-archive-section {
    background: #fff;
}

.tg-snippet-archive-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: end;
    margin-bottom: 1rem;
}

.tg-snippet-archive-heading .tg-section-heading {
    margin-bottom: 0;
}

.tg-snippet-sort {
    display: grid;
    grid-template-columns: auto minmax(150px, 190px) auto;
    gap: .5rem;
    align-items: center;
}

.tg-snippet-sort label {
    color: #667580;
    font-size: .7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.tg-snippet-sort select {
    min-height: 38px;
    padding: .45rem 2rem .45rem .65rem;
    border: 1px solid #cfd8de;
    border-radius: .65rem;
    background: #fff;
    color: #283a47;
    font: inherit;
    font-size: .78rem;
}

.tg-snippet-sort select:focus {
    border-color: #5d93b2;
    outline: 3px solid rgba(47, 125, 174, .13);
}

.tg-snippet-archive-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .9rem;
}

.tg-snippet-archive-card {
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: 1rem 1.05rem;
    border: 1px solid #dbe2e7;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 8px 24px rgba(26, 36, 44, .035);
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.tg-snippet-archive-card:hover {
    border-color: #c2d0d9;
    box-shadow: 0 14px 32px rgba(28, 39, 48, .07);
    transform: translateY(-2px);
}

.tg-snippet-archive-card-top {
    display: flex;
    align-items: center;
    gap: .7rem;
}

.tg-snippet-archive-context {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .12rem;
}

.tg-snippet-archive-context a,
.tg-snippet-archive-context > span {
    overflow: hidden;
    color: #2e648d !important;
    font-size: .68rem;
    font-weight: 800;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tg-snippet-archive-context small {
    color: #7b8891;
    font-size: .68rem;
}

.tg-snippet-archive-card h3 {
    margin: .78rem 0 .36rem;
    color: #253039;
    font-size: 1.03rem;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.22;
}

.tg-snippet-archive-card h3 a {
    color: inherit !important;
    text-decoration: none;
}

.tg-snippet-archive-card h3 a:hover,
.tg-snippet-archive-card h3 a:focus-visible {
    color: #275f8c !important;
}

.tg-snippet-archive-card > p {
    margin: 0;
    color: #65737e;
    font-size: .78rem;
    line-height: 1.5;
}

.tg-snippet-archive-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .32rem;
    margin-top: .72rem;
}

.tg-snippet-archive-tags a {
    display: inline-flex;
    align-items: center;
    min-height: 1.5rem;
    padding: .16rem .42rem;
    border: 1px solid #d9e2e8;
    border-radius: 999px;
    background: #f2f6f8;
    color: #4b687d !important;
    font-size: .62rem;
    font-weight: 800;
    text-decoration: none;
}

.tg-snippet-archive-tags a:hover,
.tg-snippet-archive-tags a:focus-visible {
    border-color: #b8cad6;
    background: #eaf1f5;
    color: #234d6c !important;
}

.tg-snippet-archive-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
    margin-top: auto;
    padding-top: .82rem;
    border-top: 1px solid #edf0f2;
}

.tg-snippet-archive-author {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: .45rem;
    color: #74818a;
    font-size: .67rem;
}

.tg-snippet-archive-author > a,
.tg-snippet-archive-author > img {
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
}

.tg-snippet-archive-author img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border: 1px solid #d4dde3;
    border-radius: 50%;
    background: #f2f4f5;
}

.tg-snippet-archive-author strong {
    color: #415766;
    font-weight: 800;
}

.tg-snippet-archive-stats {
    display: flex;
    align-items: center;
    gap: .62rem;
    color: #7a8790;
    font-size: .64rem;
    white-space: nowrap;
}

.tg-snippet-archive-stats strong {
    color: #465d6d;
}

.tg-snippet-archive-stats > a {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid #d4dfe5;
    border-radius: 50%;
    background: #f6f9fa;
    color: #356584 !important;
    font-size: .82rem;
    font-weight: 900;
    text-decoration: none;
}

.tg-snippet-archive-stats > a:hover,
.tg-snippet-archive-stats > a:focus-visible {
    border-color: #b8cad6;
    background: #eaf1f5;
}

.tg-snippet-archive-empty {
    grid-column: 1 / -1;
}

@media (max-width: 920px) {
    .tg-snippet-category-card-grid,
    .tg-snippet-archive-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tg-snippet-archive-heading {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .tg-snippet-sort {
        justify-content: start;
    }
}

@media (max-width: 620px) {
    .tg-snippet-hero-search,
    .tg-snippet-category-card-grid,
    .tg-snippet-archive-grid {
        grid-template-columns: 1fr;
    }

    .tg-snippet-hero-search button {
        width: 100%;
    }

    .tg-snippet-category-card {
        min-height: 154px;
    }

    .tg-snippet-sort {
        grid-template-columns: 1fr;
    }

    .tg-snippet-sort select,
    .tg-snippet-sort .tg-btn {
        width: 100%;
    }

    .tg-snippet-archive-card-footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .tg-snippet-archive-stats {
        width: 100%;
        justify-content: space-between;
    }
}

/* Build 0151 Completion Fix 1 — Snippets / Files-family presentation parity.
 * Match the established File Database rhythm: featured resource, compact category
 * navigation, highlighted cards and a restrained archive browsing surface. */
.tg-snippet-feature-section,
.tg-snippet-highlight-section,
.tg-snippet-category-section,
.tg-snippet-archive-section {
    padding-block: clamp(2rem, 3.4vw, 2.75rem);
}

.tg-snippet-feature-card {
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(310px, .7fr);
    min-height: 260px;
    border: 1px solid var(--tg007-line);
    border-radius: .78rem;
    background: #fff;
    box-shadow: 0 8px 22px rgba(26, 36, 44, .045);
}

.tg-snippet-feature-code {
    position: relative;
    min-width: 0;
    min-height: 260px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    padding: 1rem 1.15rem;
    border-right: 1px solid #dbe3e8;
    color: #dbe9f2 !important;
    background:
        linear-gradient(145deg, rgba(31, 45, 57, .98), rgba(19, 29, 37, .99)),
        radial-gradient(circle at 30% 20%, rgba(61, 126, 173, .22), transparent 52%);
    text-decoration: none;
}

.tg-snippet-feature-code::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 18%, rgba(255, 255, 255, .035), transparent 72%);
    content: "";
    pointer-events: none;
}

.tg-snippet-feature-code-label,
.tg-snippet-feature-code pre {
    position: relative;
    z-index: 1;
}

.tg-snippet-feature-code-label {
    margin-bottom: .55rem;
    color: #83bddf;
    font-size: .6rem;
    font-weight: 900;
    letter-spacing: .09em;
}

.tg-snippet-feature-code pre {
    max-height: 210px;
    margin: 0;
    overflow: hidden;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    color: #d7e4ec;
    font-family: "Courier New", Courier, monospace;
    font-size: .69rem;
    line-height: 1.42;
    tab-size: 4;
}

.tg-snippet-feature-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 1rem 1.15rem;
}

.tg-snippet-feature-copy h3 {
    margin: .38rem 0 .38rem;
    color: #202a31;
    font-size: clamp(1.28rem, 1.8vw, 1.62rem);
    font-family: "Space Grotesk", Inter, sans-serif;
    font-weight: 800;
    letter-spacing: -.035em;
    line-height: 1.08;
}

.tg-snippet-feature-copy h3 a {
    color: inherit !important;
    text-decoration: none;
}

.tg-snippet-feature-copy h3 a:hover,
.tg-snippet-feature-copy h3 a:focus-visible {
    color: var(--tg007-blue-dark) !important;
}

.tg-snippet-feature-copy > p {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    color: var(--tg007-muted);
    font-size: .75rem;
    line-height: 1.42;
}

.tg-snippet-feature-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .35rem;
    margin-top: .7rem;
}

.tg-snippet-feature-metrics span {
    padding: .42rem .48rem;
    border: 1px solid #e0e7ec;
    border-radius: .52rem;
    color: #687580;
    background: #f7f9fa;
    font-size: .58rem;
    line-height: 1.25;
}

.tg-snippet-feature-metrics strong {
    display: block;
    margin-bottom: .08rem;
    color: #26333c;
    font-size: .82rem;
}

.tg-snippet-feature-byline {
    margin-top: .55rem;
    color: #78848d;
    font-size: .64rem;
    font-weight: 650;
}

.tg-snippet-category-card-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .55rem;
}

.tg-snippet-category-card {
    min-height: 126px;
    padding: .72rem .78rem;
    border-radius: .68rem;
    box-shadow: 0 4px 12px rgba(26, 36, 44, .025);
}

.tg-snippet-category-card::after {
    display: none;
}

.tg-snippet-category-card:hover,
.tg-snippet-category-card:focus-visible,
.tg-snippet-category-card.is-active {
    box-shadow: 0 7px 16px rgba(28, 39, 48, .055);
    transform: translateY(-1px);
}

.tg-snippet-code-tile-small {
    width: 28px;
    height: 28px;
    flex-basis: 28px;
    border-radius: .48rem;
    font-size: .48rem;
}

.tg-snippet-category-count {
    font-size: .56rem;
}

.tg-snippet-category-card h3 {
    margin: .58rem 0 0;
    font-size: .82rem;
    line-height: 1.16;
}

.tg-snippet-category-card-footer {
    align-items: center;
    margin-top: auto;
    padding-top: .55rem;
    font-size: .59rem;
}

.tg-snippet-category-arrow {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d4e0e7;
    border-radius: 50%;
    color: #356f92;
    background: #f3f8fa;
    font-size: .7rem;
    transition: color .15s ease, background .15s ease, border-color .15s ease, transform .15s ease;
}

.tg-snippet-category-card:hover .tg-snippet-category-arrow,
.tg-snippet-category-card:focus-visible .tg-snippet-category-arrow,
.tg-snippet-category-card.is-active .tg-snippet-category-arrow {
    border-color: #397ba3;
    color: #fff;
    background: #397ba3;
    transform: translateX(1px);
}

.tg-snippet-highlight-section .tg-snippet-archive-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .65rem;
}

.tg-snippet-highlight-section .tg-snippet-archive-card {
    padding: .72rem .75rem;
    border-radius: .72rem;
    box-shadow: 0 5px 14px rgba(26, 36, 44, .03);
}

.tg-snippet-highlight-section .tg-snippet-code-tile {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    border-radius: .48rem;
    font-size: .48rem;
}

.tg-snippet-highlight-section .tg-snippet-archive-card h3 {
    margin: .46rem 0 .25rem;
    font-size: .8rem;
    line-height: 1.16;
}

.tg-snippet-highlight-section .tg-snippet-archive-card > p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: .65rem;
    line-height: 1.38;
}

.tg-snippet-highlight-section .tg-snippet-archive-tags {
    margin-top: .48rem;
}

.tg-snippet-highlight-section .tg-snippet-archive-tags a:nth-child(n+3) {
    display: none;
}

.tg-snippet-highlight-section .tg-snippet-archive-card-footer {
    padding-top: .5rem;
}

.tg-snippet-highlight-section .tg-snippet-archive-author > a,
.tg-snippet-highlight-section .tg-snippet-archive-author > img {
    width: 22px;
    height: 22px;
    flex-basis: 22px;
}

.tg-snippet-highlight-section .tg-snippet-archive-author,
.tg-snippet-highlight-section .tg-snippet-archive-stats {
    font-size: .57rem;
}

.tg-snippet-highlight-section .tg-snippet-archive-stats > a {
    width: 24px;
    height: 24px;
}

.tg-snippet-archive-section {
    border-top: 1px solid #e0e6ea;
    background: #f5f7f8;
}

.tg-snippet-archive-card {
    border-radius: .74rem;
    box-shadow: 0 5px 16px rgba(28, 39, 48, .028);
}

@media (max-width: 1180px) {
    .tg-snippet-category-card-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .tg-snippet-feature-card {
        grid-template-columns: 1fr;
    }

    .tg-snippet-feature-code {
        min-height: 220px;
        border-right: 0;
        border-bottom: 1px solid #dbe3e8;
    }

    .tg-snippet-category-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .tg-snippet-highlight-section .tg-snippet-archive-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .tg-snippet-category-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tg-snippet-feature-metrics {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .tg-snippet-feature-section,
    .tg-snippet-category-section,
    .tg-snippet-highlight-section,
    .tg-snippet-archive-section {
        padding-block: 1.5rem;
    }

    .tg-snippet-category-card-grid,
    .tg-snippet-highlight-section .tg-snippet-archive-grid {
        grid-template-columns: 1fr;
    }

    .tg-snippet-category-card {
        min-height: 0;
    }
}

/* Build 0152 — Snippet detail UX, interaction hardening and native mIRC code viewer. */
.tg-modern-hero--snippet-detail .tg-snippet-crumbs {
    display: flex;
    align-items: center;
    gap: .42rem;
    margin-bottom: .5rem;
    color: #6b7d89;
    font-size: .68rem;
    font-weight: 750;
}

.tg-modern-hero--snippet-detail .tg-snippet-crumbs a,
.tg-modern-hero--snippet-detail .tg-snippet-crumbs a:hover,
.tg-modern-hero--snippet-detail .tg-snippet-crumbs a:focus-visible {
    color: #2e6f98 !important;
    text-decoration: none !important;
}

.tg-snippet-detail-tagline {
    max-width: 760px;
}

.tg-snippet-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .42rem 1rem;
    margin-top: .55rem;
    color: #637481;
    font-size: .72rem;
}

.tg-snippet-detail-meta strong {
    color: #354d5f;
    font-weight: 780;
}

.tg-snippet-detail-hero-actions {
    margin-top: .78rem;
}

.tg-snippet-hero-code {
    display: grid;
    justify-items: start;
    align-content: center;
    min-height: 100%;
}

.tg-snippet-hero-code-icon {
    display: grid;
    width: 3.25rem;
    height: 3.25rem;
    place-items: center;
    margin-bottom: .75rem;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: .72rem;
    color: #d8efff;
    background: rgba(9, 37, 61, .2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    font-size: 1.25rem;
}

.tg-snippet-detail-section,
.tg-snippet-community-section {
    padding-block: clamp(1.85rem, 3vw, 2.35rem);
}

.tg-snippet-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 320px);
    gap: 1rem;
    align-items: start;
}

.tg-snippet-detail-main,
.tg-snippet-detail-sidebar {
    min-width: 0;
}

.tg-snippet-overview-card,
.tg-snippet-code-card,
.tg-snippet-info-card,
.tg-snippet-response-card,
.tg-snippet-manage-card,
.tg-snippet-comment-form,
.tg-snippet-comment {
    border: 1px solid #d8e1e7;
    border-radius: .72rem;
    box-shadow: 0 4px 14px rgba(26, 36, 44, .028);
}

.tg-snippet-overview-card,
.tg-snippet-code-card,
.tg-snippet-info-card,
.tg-snippet-response-card {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #fff 0%, #fbfcfd 100%);
}

.tg-snippet-overview-card::before,
.tg-snippet-code-card::before,
.tg-snippet-info-card::before,
.tg-snippet-response-card::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg, #3d7ea6 0 46px, #dbe7ee 46px 100%);
    content: "";
    opacity: .76;
}

.tg-snippet-overview-card {
    padding: .95rem 1rem 1rem;
}

.tg-snippet-overview-card .tg-section-heading {
    margin-bottom: .55rem;
}

.tg-snippet-overview-card .tg-section-heading h2,
.tg-snippet-code-toolbar h2 {
    margin: .12rem 0 0;
    color: #1c2d39;
    font-size: clamp(1.35rem, 2vw, 1.7rem);
    letter-spacing: -.025em;
}

.tg-snippet-description-content {
    color: #56656f;
    font-size: .8rem;
    line-height: 1.58;
}

.tg-snippet-detail-tags {
    margin-top: .78rem;
    padding-top: .68rem;
    border-top: 1px solid #e2e8ec;
}

.tg-snippet-detail-tags a,
.tg-snippet-detail-tags a:hover,
.tg-snippet-detail-tags a:focus-visible {
    text-decoration: none !important;
}

.tg-snippet-code-card {
    margin-top: .72rem;
    padding-top: .1rem;
}

.tg-snippet-code-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .85rem;
    margin: 0;
    padding: .85rem .9rem .8rem;
}

.tg-snippet-code-toolbar h2 {
    font-size: 1rem;
}

.tg-snippet-code-toolbar small {
    display: block;
    margin-top: .12rem;
    color: #71818c;
    font-size: .64rem;
}

.tg-snippet-code-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .42rem;
}

.tg-snippet-code-actions .tg-btn {
    min-height: 2.15rem;
    padding: .46rem .68rem;
    font-size: .66rem;
}

.tg-snippet-code-frame {
    border-top: 1px solid #d8e1e7;
    background: #111c25;
}

.tg-snippet-code-frame.is-collapsible:not(.is-expanded) .tg-snippet-code-scroll {
    max-height: 46rem;
}

.tg-snippet-code-frame.is-expanded .tg-snippet-code-scroll {
    max-height: none;
}

.tg-snippet-code-scroll {
    display: grid;
    grid-template-columns: max-content minmax(max-content, 1fr);
    overflow: auto;
    max-width: 100%;
    scrollbar-color: #526776 #16242f;
}

.tg-snippet-line-numbers {
    position: sticky;
    left: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    min-width: 3.15rem;
    padding: .85rem .55rem .85rem .35rem;
    border-right: 1px solid rgba(255, 255, 255, .08);
    color: #637787;
    background: #0d171f;
    font: 500 .75rem/1.55 "JetBrains Mono", "Cascadia Code", Consolas, "Courier New", monospace;
    text-align: right;
    user-select: none;
}

.tg-snippet-line-numbers span {
    height: 1.55em;
}

.tg-snippet-code-scroll pre {
    min-width: 100%;
    margin: 0;
    padding: .85rem 1rem;
    border: 0;
    background: transparent;
    color: #d9e3ea;
    overflow: visible;
}

.tg-snippet-code-scroll code {
    display: block;
    min-width: max-content;
    color: inherit;
    background: transparent;
    font: 500 .75rem/1.55 "JetBrains Mono", "Cascadia Code", Consolas, "Courier New", monospace;
    white-space: pre;
    tab-size: 4;
}

.tg-code-token--comment { color: #708392; font-style: italic; }
.tg-code-token--string { color: #b9d7a5; }
.tg-code-token--identifier { color: #91c8ec; }
.tg-code-token--variable { color: #e3bb7b; }
.tg-code-token--channel { color: #c1a7e3; }
.tg-code-token--number { color: #e5a989; }
.tg-code-token--keyword { color: #71b7e6; font-weight: 750; }
.tg-code-token--operator { color: #a9bcc9; }
.tg-code-token--punctuation { color: #8ea5b5; }

.tg-snippet-copy-status {
    min-height: 1.65rem;
    padding: .35rem .9rem .55rem;
    color: #5d7180;
    background: #f8fafb;
    font-size: .63rem;
}

.tg-snippet-adjacent {
    gap: .55rem;
    padding: .72rem 0 0;
}

.tg-snippet-adjacent a {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .44rem .58rem;
    border: 1px solid #d4dfe6;
    border-radius: .48rem;
    color: #315f7c !important;
    background: #fff;
    font-size: .66rem;
    text-decoration: none !important;
}

.tg-snippet-info-card,
.tg-snippet-response-card,
.tg-snippet-manage-card {
    padding: .82rem .88rem .86rem;
}

.tg-snippet-response-card,
.tg-snippet-manage-card {
    margin-top: .62rem;
}

.tg-snippet-author-summary {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: .58rem;
    align-items: center;
    margin-top: .58rem;
    padding-bottom: .65rem;
    border-bottom: 1px solid #e2e8ec;
}

.tg-snippet-author-summary img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
}

.tg-snippet-author-summary small,
.tg-snippet-author-summary strong {
    display: block;
}

.tg-snippet-author-summary small {
    color: #7a8993;
    font-size: .58rem;
    text-transform: uppercase;
    letter-spacing: .07em;
}

.tg-snippet-author-summary strong {
    margin-top: .08rem;
    font-size: .78rem;
}

.tg-snippet-author-summary a,
.tg-snippet-author-summary a:hover,
.tg-snippet-author-summary a:focus-visible {
    color: #2c607f !important;
    text-decoration: none !important;
}

.tg-snippet-info-card dl {
    margin: .55rem 0 0;
}

.tg-snippet-info-card dl > div {
    display: grid;
    grid-template-columns: minmax(70px, .72fr) minmax(0, 1.28fr);
    gap: .5rem;
    padding: .43rem 0;
    border-bottom: 1px solid #e7ecef;
}

.tg-snippet-info-card dl > div:last-child {
    border-bottom: 0;
}

.tg-snippet-info-card dt {
    color: #7b8a94;
    font-size: .57rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .045em;
}

.tg-snippet-info-card dd {
    min-width: 0;
    margin: 0;
    color: #435662;
    font-size: .67rem;
    font-weight: 680;
    text-align: right;
}

.tg-snippet-info-card dd a,
.tg-snippet-info-card dd a:hover,
.tg-snippet-info-card dd a:focus-visible {
    color: #2d6f99 !important;
    text-decoration: none !important;
}

.tg-snippet-response-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
    margin-top: .6rem;
}

.tg-snippet-response-stats > div {
    padding: .62rem .65rem;
    border: 1px solid #dde5ea;
    border-radius: .55rem;
    background: #f7f9fa;
}

.tg-snippet-response-stats strong,
.tg-snippet-response-stats span {
    display: block;
}

.tg-snippet-response-stats strong {
    color: #1d3343;
    font-size: 1.05rem;
}

.tg-snippet-response-stats span {
    margin-top: .08rem;
    color: #74838d;
    font-size: .58rem;
}

.tg-snippet-response-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .42rem;
    margin-top: .58rem;
}

.tg-snippet-response-actions .tg-btn {
    width: 100%;
    min-height: 2.1rem;
    font-size: .65rem;
}

.tg-snippet-response-actions [aria-pressed="true"] {
    border-color: #9fc1d5;
    color: #245f86;
    background: #eaf4fa;
}

.tg-snippet-validation-note {
    display: block;
    margin-top: .5rem;
    color: #875e29;
    font-size: .6rem;
    line-height: 1.4;
}

.tg-snippet-manage-card {
    display: grid;
    gap: .42rem;
    border-color: #e1d9d7;
    background: #fbf9f8;
}

.tg-snippet-manage-card .tg-kicker {
    margin-bottom: .12rem;
}

.tg-snippet-manage-card .tg-btn {
    width: 100%;
    justify-content: center;
}

.tg-snippet-community-section {
    border-top: 1px solid #dce5ea;
    background: #f3f6f8;
}

.tg-snippet-community-section .tg-section-heading {
    margin-bottom: .72rem;
}

.tg-snippet-community-section .tg-section-heading h2 {
    margin-top: .12rem;
    font-size: clamp(1.5rem, 2vw, 1.9rem);
}

.tg-snippet-follow-link {
    padding: .35rem .5rem;
    border: 1px solid #ccdbe4;
    border-radius: .45rem;
    color: #35617f;
    background: #fff;
    font-size: .65rem;
    font-weight: 800;
    text-decoration: none;
}

.tg-snippet-comment-form {
    margin: .8rem 0 .85rem;
    padding: .85rem;
    background: #fff;
}

.tg-snippet-comment-form > img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
}

.tg-snippet-comment-form textarea {
    min-height: 5.4rem;
    border-color: #cad7df;
    border-radius: .45rem;
    font-size: .76rem;
}

.tg-snippet-comment-form-footer {
    margin-top: .42rem;
}

.tg-snippet-comment-form-footer span {
    color: #7a8992;
    font-size: .61rem;
}

.tg-snippet-comments {
    display: grid;
    gap: .52rem;
}

.tg-snippet-comment {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: .7rem;
    padding: .72rem .78rem;
    background: #fff;
}

.tg-snippet-comment-avatar img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
}

.tg-snippet-comment-content {
    min-width: 0;
}

.tg-snippet-comment header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    margin-bottom: .28rem;
}

.tg-snippet-comment header > div {
    min-width: 0;
}

.tg-snippet-comment header strong,
.tg-snippet-comment header span {
    display: inline;
}

.tg-snippet-comment header strong {
    color: #263b49;
    font-size: .71rem;
}

.tg-snippet-comment header span {
    margin-left: .35rem;
    color: #8a969e;
    font-size: .58rem;
}

.tg-snippet-comment header a,
.tg-snippet-comment header a:hover,
.tg-snippet-comment header a:focus-visible {
    color: #2d6486 !important;
    text-decoration: none !important;
}

.tg-snippet-comment header button {
    padding: 0;
    border: 0;
    color: #9c4d49;
    background: transparent;
    font-size: .59rem;
    font-weight: 800;
}

.tg-snippet-comment-body {
    color: #56656f;
    font-size: .72rem;
    line-height: 1.52;
}

.tg-snippet-older-comments {
    margin-top: .6rem;
    border: 1px solid #d8e1e7;
    border-radius: .62rem;
    background: #fff;
}

.tg-snippet-older-comments summary {
    padding: .65rem .75rem;
    color: #34617f;
    font-size: .66rem;
    font-weight: 800;
    cursor: pointer;
}

.tg-snippet-older-comments > .tg-snippet-comments {
    padding: 0 .55rem .55rem;
}

.tg-snippet-comment-state {
    padding: .75rem .82rem;
    border: 1px dashed #cbd8df;
    border-radius: .6rem;
    color: #6b7b85;
    background: rgba(255, 255, 255, .68);
    font-size: .72rem;
}

.tg-snippet-comment-state a,
.tg-snippet-comment-state a:hover,
.tg-snippet-comment-state a:focus-visible {
    color: #2d6f99 !important;
    text-decoration: none !important;
}

@media (max-width: 900px) {
    .tg-snippet-detail-grid {
        grid-template-columns: 1fr;
    }

    .tg-snippet-detail-sidebar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .65rem;
    }

    .tg-snippet-response-card,
    .tg-snippet-manage-card {
        margin-top: 0;
    }
}

@media (max-width: 640px) {
    .tg-snippet-detail-meta,
    .tg-snippet-code-toolbar,
    .tg-snippet-comment-form-footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .tg-snippet-detail-sidebar {
        grid-template-columns: 1fr;
    }

    .tg-snippet-code-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .tg-snippet-code-frame.is-collapsible:not(.is-expanded) .tg-snippet-code-scroll {
        max-height: 36rem;
    }

    .tg-snippet-line-numbers {
        min-width: 2.7rem;
        font-size: .7rem;
    }

    .tg-snippet-code-scroll code {
        font-size: .7rem;
    }

    .tg-snippet-comment-form,
    .tg-snippet-comment {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .tg-snippet-comment-form > img,
    .tg-snippet-comment-avatar img {
        width: 34px;
        height: 34px;
    }
}

/* Build 0153 — Snippet Submit modernization, validation and abuse hardening. */
.tg-snippet-submit-section {
    background: #f8f8f6;
}

.tg-modern-hero--snippet-submit .tg-modern-hero-identity-note {
    max-width: 19rem;
}

.tg-snippet-submit-form {
    margin: 0;
}

.tg-snippet-submit-form.is-submitting {
    pointer-events: none;
}

/* Build 0153 Completion Fix 1 — keep paired controls aligned when one field has helper text. */
.tg-snippet-submit-form .tg-file-field {
    align-content: start;
}

.tg-snippet-submit-form .tg-file-field > input[type="text"],
.tg-snippet-submit-form .tg-file-field > select {
    height: 36px;
    min-height: 36px;
}

.tg-snippet-submit-code-block {
    background: #fbfcfc;
}

.tg-file-submit-block .tg-snippet-submit-code-field {
    margin: 0;
}

.tg-file-submit-block .tg-snippet-submit-code-field .tg-snippet-code-input {
    min-height: 29rem;
    padding: .7rem .75rem;
    border-left: 3px solid #527b9b;
    background: #f7f9fa;
    color: #172633;
    font-family: "Courier New", Courier, monospace;
    font-size: .82rem;
    line-height: 1.5;
    tab-size: 4;
    white-space: pre;
}

.tg-file-submit-block .tg-snippet-submit-code-field .tg-snippet-code-input:focus {
    border-left-color: #2f78aa;
    background: #fff;
}

.tg-snippet-submit-sidebar .tg-text-link,
.tg-snippet-submit-sidebar a {
    text-decoration: none;
}

.tg-snippet-submit-sidebar a:hover,
.tg-snippet-submit-sidebar a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.tg-snippet-publish-panel {
    border-left: 3px solid #5e8199 !important;
}

.tg-snippet-publish-panel .tg-file-submit-side-head {
    display: block;
}

.tg-snippet-rules-panel[open] summary {
    margin-bottom: .1rem;
}

.tg-snippet-submit-actions .tg-btn[disabled] {
    cursor: not-allowed;
    opacity: .62;
}

@media (max-width: 760px) {
    .tg-file-submit-block .tg-snippet-submit-code-field .tg-snippet-code-input {
        min-height: 23rem;
        font-size: .78rem;
    }
}

@media (max-width: 520px) {
    .tg-snippet-submit-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .tg-snippet-submit-actions .tg-file-submit-button {
        width: 100%;
    }
}

/* Build 0154 — My Snippets management modernization. */
.tg-my-snippets-section {
    background: #f8f8f6;
}

.tg-my-snippets-layout {
    align-items: start;
}

.tg-my-snippets-list {
    display: grid;
    gap: .72rem;
}

.tg-my-snippet-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: stretch;
    padding: 1rem 1.05rem;
    border: 1px solid rgba(34, 59, 80, .14);
    border-left: 3px solid #6e8aa0;
    background: #fff;
    box-shadow: 0 7px 18px rgba(28, 46, 61, .035);
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.tg-my-snippet-card:hover {
    border-color: rgba(42, 86, 120, .24);
    box-shadow: 0 10px 24px rgba(28, 46, 61, .055);
    transform: translateY(-1px);
}

.tg-my-snippet-card-main {
    min-width: 0;
}

.tg-my-snippet-card-kickers {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .7rem;
    align-items: center;
    margin-bottom: .32rem;
    color: #74818b;
    font-size: .72rem;
}

.tg-my-snippet-category {
    color: #2e648d !important;
    font-family: "Space Grotesk", sans-serif;
    font-weight: 800;
    text-decoration: none;
}

.tg-my-snippet-category:hover,
.tg-my-snippet-category:focus-visible {
    color: #173e5d !important;
}

.tg-my-snippet-id {
    color: #7b8790;
    font-weight: 700;
}

.tg-my-snippet-card h3 {
    margin: 0;
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.08rem;
    line-height: 1.25;
}

.tg-my-snippet-card h3 a {
    color: #1e3b52 !important;
    text-decoration: none;
}

.tg-my-snippet-card h3 a:hover,
.tg-my-snippet-card h3 a:focus-visible {
    color: #275f8c !important;
}

.tg-my-snippet-summary {
    max-width: 58rem;
    margin: .42rem 0 .55rem;
    color: #5a6974;
    font-size: .84rem;
    line-height: 1.5;
}

.tg-my-snippet-tags {
    margin-top: .15rem;
}

.tg-my-snippet-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .38rem 1rem;
    margin-top: .65rem;
    color: #687782;
    font-size: .72rem;
}

.tg-my-snippet-meta span {
    display: inline-flex;
    gap: .28rem;
    align-items: baseline;
}

.tg-my-snippet-meta strong {
    color: #354f63;
    font-weight: 800;
}

.tg-my-snippet-card-actions {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .45rem;
    min-width: 90px;
    padding-left: 1rem;
    border-left: 1px solid rgba(34, 59, 80, .11);
}

.tg-my-snippet-action {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 32px;
    padding: .38rem .72rem;
    border: 1px solid rgba(47, 84, 112, .22);
    border-radius: .3rem;
    background: #f7f9fa;
    color: #315a78 !important;
    font: inherit;
    font-family: "Space Grotesk", sans-serif;
    font-size: .74rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}

.tg-my-snippet-action:hover,
.tg-my-snippet-action:focus-visible {
    border-color: #6e8da5;
    background: #edf2f5;
    color: #183e5c !important;
}

.tg-my-snippet-action-danger {
    border-color: rgba(153, 68, 68, .28);
    background: #fffafa;
    color: #8a3f3f !important;
}

.tg-my-snippet-action-danger:hover,
.tg-my-snippet-action-danger:focus-visible {
    border-color: #ad6a6a;
    background: #f8eded;
    color: #742f2f !important;
}

.tg-my-snippet-action:disabled {
    cursor: wait;
    opacity: .58;
}

.tg-my-snippets-empty-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: .9rem;
}

.tg-my-snippets-manage-note p {
    margin-bottom: .9rem;
}

.tg-my-snippets-delete-dialog {
    width: min(520px, calc(100% - 2rem));
    padding: 0;
    border: 1px solid rgba(31, 57, 77, .22);
    border-radius: .3rem;
    background: #fff;
    color: #273f52;
    box-shadow: 0 26px 70px rgba(11, 22, 31, .32);
}

.tg-my-snippets-delete-dialog::backdrop {
    background: rgba(8, 17, 24, .68);
}

.tg-my-snippets-delete-dialog form {
    margin: 0;
}

.tg-my-snippets-delete-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    padding: 1rem 1.1rem .85rem;
    border-bottom: 1px solid rgba(34, 59, 80, .12);
}

.tg-my-snippets-delete-head h2 {
    margin: .18rem 0 0;
    color: #20384c;
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.2rem;
}

.tg-my-snippets-delete-head > button {
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #667783;
    font-size: 1.35rem;
    cursor: pointer;
}

.tg-my-snippets-delete-body {
    padding: 1rem 1.1rem;
    color: #5b6b76;
    font-size: .86rem;
    line-height: 1.55;
}

.tg-my-snippets-delete-body p {
    margin: 0 0 .7rem;
}

.tg-my-snippets-delete-body p:last-child {
    margin-bottom: 0;
}

.tg-my-snippets-delete-body strong {
    color: #263f52;
}

.tg-my-snippets-delete-actions {
    display: flex;
    justify-content: flex-end;
    gap: .55rem;
    padding: .85rem 1.1rem 1rem;
    border-top: 1px solid rgba(34, 59, 80, .12);
    background: #f8fafb;
}

@media (max-width: 760px) {
    .tg-my-snippet-card {
        grid-template-columns: 1fr;
    }

    .tg-my-snippet-card-actions {
        flex-direction: row;
        justify-content: flex-start;
        flex-wrap: wrap;
        padding: .8rem 0 0;
        border-left: 0;
        border-top: 1px solid rgba(34, 59, 80, .11);
    }

    .tg-my-snippet-action {
        min-width: 74px;
    }
}

@media (max-width: 520px) {
    .tg-my-snippet-card {
        padding: .9rem;
    }

    .tg-my-snippet-card-actions,
    .tg-my-snippets-delete-actions,
    .tg-my-snippets-empty-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .tg-my-snippet-action,
    .tg-my-snippets-delete-actions .tg-btn,
    .tg-my-snippets-empty-actions .tg-btn {
        width: 100%;
    }
}