
.tjss {
    --tjss-green:#0CB182;
    --tjss-green-dark:#087C5B;
    --tjss-navy:#11192C;
    --tjss-text:#2B3242;
    --tjss-muted:#667085;
    --tjss-mint:#E7F7F2;
    --tjss-border:#E3E7EC;
    --tjss-white:#FFFFFF;
    width:100%;
    color:var(--tjss-text);
    font-family:inherit;
}
.tjss *, .tjss *::before, .tjss *::after { box-sizing:border-box; }
.tjss button { font:inherit; }
.tjss__inner { width:min(1180px, calc(100% - 32px)); margin:0 auto; padding:38px 0; }

.tjss__heading { text-align:center; max-width:720px; margin:0 auto 26px; }
.tjss__eyebrow { display:inline-block; margin-bottom:7px; color:var(--tjss-green-dark); font-size:14px; font-weight:700; }
.tjss__heading h2 { margin:0; color:var(--tjss-navy); font-size:clamp(26px,3vw,38px); line-height:1.25; font-weight:800; }
.tjss__heading p { margin:9px 0 0; color:var(--tjss-muted); font-size:15px; line-height:1.8; }

.tjss__step {
    margin-top:18px;
    padding:20px;
    background:var(--tjss-white);
    border:1px solid var(--tjss-border);
    border-radius:18px;
    box-shadow:0 7px 24px rgba(17,25,44,.045);
}
.tjss__step--hidden { display:none; }

.tjss__step-head { display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.tjss__step-number {
    width:36px; height:36px; flex:0 0 36px;
    display:grid; place-items:center;
    border-radius:50%;
    background:var(--tjss-mint);
    color:var(--tjss-green-dark);
    font-weight:800;
}
.tjss__step-head h3 { margin:0; color:var(--tjss-navy); font-size:20px; line-height:1.35; font-weight:800; }
.tjss__step-head p { margin:2px 0 0; color:var(--tjss-muted); font-size:13px; line-height:1.6; }

.tjss__icon-grid { display:grid; gap:14px; }
.tjss__icon-grid--three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.tjss__icon-grid--two { grid-template-columns:repeat(2,minmax(0,1fr)); }

.tjss__icon-card {
    position:relative;
    min-height:205px;
    border:1.5px solid var(--tjss-border);
    background:var(--tjss-white);
    border-radius:16px;
    padding:14px 12px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:var(--tjss-text);
    cursor:pointer;
    transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease, background .2s ease;
}
.tjss__icon-card:hover {
    border-color:rgba(12,177,130,.55);
    transform:translateY(-2px);
    box-shadow:0 9px 21px rgba(17,25,44,.07);
}
.tjss__icon-card:focus-visible,
.tjss__change:focus-visible,
.tjss__edit-step:focus-visible {
    outline:3px solid rgba(12,177,130,.25);
    outline-offset:3px;
}
.tjss__icon-card.is-selected {
    border-color:var(--tjss-green);
    background:linear-gradient(180deg,#fff 0%,#F4FCF9 100%);
    box-shadow:0 0 0 3px rgba(12,177,130,.10),0 9px 22px rgba(17,25,44,.065);
}
.tjss__icon-card.is-selected .tjss__selected-mark { opacity:1; transform:scale(1); }

.tjss__icon-image-wrap { display:block; width:164px; height:164px; max-width:76%; }
.tjss__icon-image-wrap img { display:block; width:100%; height:100%; object-fit:contain; }
.tjss__icon-label { display:block; margin-top:5px; color:var(--tjss-navy); font-size:18px; font-weight:800; }
.tjss__icon-note { display:block; margin-top:2px; color:var(--tjss-muted); font-size:12px; line-height:1.45; }

.tjss__selected-mark {
    position:absolute; top:11px; left:11px;
    width:27px; height:27px;
    display:grid; place-items:center;
    border-radius:50%;
    background:var(--tjss-green);
    color:#fff; font-size:14px; font-weight:800;
    opacity:0; transform:scale(.7);
    transition:opacity .18s ease, transform .18s ease;
}

/* Collapsed step */
.tjss__step-collapsed {
    display:none;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    min-height:50px;
}
.tjss__step.is-collapsed {
    padding:12px 16px;
}
.tjss__step.is-collapsed .tjss__step-expanded { display:none; }
.tjss__step.is-collapsed .tjss__step-collapsed { display:flex; }
.tjss__collapsed-main { display:flex; align-items:center; gap:10px; min-width:0; }
.tjss__collapsed-check {
    width:34px; height:34px; flex:0 0 34px;
    display:grid; place-items:center;
    border-radius:50%;
    background:var(--tjss-mint);
    color:var(--tjss-green-dark);
    font-weight:900;
}
.tjss__collapsed-main small {
    display:block;
    color:var(--tjss-muted);
    font-size:11px;
    line-height:1.2;
}
.tjss__collapsed-value {
    display:block;
    margin-top:2px;
    color:var(--tjss-navy);
    font-size:15px;
    line-height:1.35;
    font-weight:800;
}
.tjss__edit-step {
    flex:0 0 auto;
    border:0;
    background:transparent;
    color:var(--tjss-green-dark);
    text-decoration:underline;
    text-underline-offset:3px;
    cursor:pointer;
    font-size:13px;
    font-weight:800;
    padding:7px 4px;
}

/* Final summary */
.tjss__summary {
    margin-top:16px;
    padding:14px 16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    border-radius:15px;
    border:1px solid rgba(12,177,130,.25);
    background:var(--tjss-mint);
}
.tjss__summary--hidden { display:none; }
.tjss__summary-main { display:flex; align-items:center; gap:10px; }
.tjss__summary-check {
    width:35px; height:35px; flex:0 0 35px;
    display:grid; place-items:center;
    border-radius:50%;
    background:var(--tjss-green-dark);
    color:#fff; font-weight:900;
}
.tjss__summary strong { color:var(--tjss-navy); font-size:14px; font-weight:800; }
.tjss__summary-values { margin-top:2px; color:var(--tjss-green-dark); font-size:13px; font-weight:700; }
.tjss__change {
    flex:0 0 auto;
    border:0;
    background:transparent;
    color:var(--tjss-green-dark);
    text-decoration:underline;
    text-underline-offset:3px;
    cursor:pointer;
    font-weight:800;
    padding:7px 4px;
}

@media (max-width:849px) {
    .tjss__inner { width:min(100% - 28px,760px); padding:32px 0; }
    .tjss__step { padding:18px; }
    .tjss__icon-card { min-height:195px; }
    .tjss__icon-image-wrap { width:150px; height:150px; }
}

@media (max-width:549px) {
    .tjss__inner { width:min(100% - 22px,520px); padding:26px 0; }
    .tjss__heading { margin-bottom:18px; }
    .tjss__heading h2 { font-size:26px; }
    .tjss__heading p { font-size:14px; }

    .tjss__step { margin-top:12px; padding:14px; border-radius:15px; }
    .tjss__step.is-collapsed { padding:10px 12px; }
    .tjss__step-head { margin-bottom:12px; }
    .tjss__step-number { width:33px; height:33px; flex-basis:33px; }
    .tjss__step-head h3 { font-size:18px; }

    .tjss__icon-grid--three,
    .tjss__icon-grid--two { grid-template-columns:1fr; gap:8px; }

    .tjss__icon-card {
        min-height:104px;
        padding:8px 12px;
        flex-direction:row;
        justify-content:flex-start;
        gap:14px;
        text-align:right;
        align-items:center;
    }
    .tjss__icon-image-wrap { width:84px; height:84px; max-width:none; flex:0 0 84px; }
    .tjss__icon-label { margin-top:0; font-size:17px; }
    .tjss__icon-note { margin-top:2px; }

    .tjss__collapsed-value { font-size:14px; }
    .tjss__summary { align-items:flex-start; flex-direction:column; gap:7px; }
    .tjss__change { margin-right:45px; padding:1px 0 4px; }
}

@media (prefers-reduced-motion:reduce) {
    .tjss *, .tjss *::before, .tjss *::after {
        scroll-behavior:auto !important;
        transition:none !important;
    }
}


/* v1.3.0 — final compact personalized summary */
.tjss.is-complete .tjss__step {
    display:none;
}

.tjss__summary {
    margin-top:16px;
    padding:16px 18px;
    display:block;
    border-radius:18px;
    border:1px solid rgba(12,177,130,.28);
    background:linear-gradient(135deg,#F1FBF8 0%,#E7F7F2 100%);
    box-shadow:0 8px 24px rgba(17,25,44,.045);
}
.tjss__summary--hidden {
    display:none !important;
}
.tjss__summary-top {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}
.tjss__summary-main {
    display:flex;
    align-items:center;
    gap:11px;
}
.tjss__summary-check {
    width:38px;
    height:38px;
    flex:0 0 38px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--tjss-green-dark);
    color:#fff;
    font-size:17px;
    font-weight:900;
}
.tjss__summary-main strong {
    color:var(--tjss-navy);
    font-size:16px;
    line-height:1.35;
    font-weight:800;
}
.tjss__summary-subtitle {
    margin-top:2px;
    color:var(--tjss-muted);
    font-size:12px;
}
.tjss__change {
    flex:0 0 auto;
    border:1px solid rgba(8,124,91,.20);
    border-radius:10px;
    background:#fff;
    color:var(--tjss-green-dark);
    text-decoration:none;
    cursor:pointer;
    font-size:13px;
    font-weight:800;
    padding:8px 12px;
    transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.tjss__change:hover {
    border-color:rgba(8,124,91,.45);
    box-shadow:0 5px 14px rgba(17,25,44,.06);
    transform:translateY(-1px);
}

.tjss__summary-choices {
    margin-top:13px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
}
.tjss__summary-choice {
    min-width:0;
    display:flex;
    align-items:center;
    gap:9px;
    padding:9px 11px;
    border:1px solid rgba(12,177,130,.16);
    border-radius:13px;
    background:rgba(255,255,255,.78);
}
.tjss__summary-choice-img {
    width:46px;
    height:46px;
    flex:0 0 46px;
    object-fit:contain;
}
.tjss__summary-choice small {
    display:block;
    color:var(--tjss-muted);
    font-size:10px;
    line-height:1.2;
}
.tjss__summary-choice-label {
    display:block;
    margin-top:2px;
    color:var(--tjss-navy);
    font-size:13px;
    line-height:1.35;
    font-weight:800;
    white-space:normal;
}

@media (max-width:849px) {
    .tjss__summary-choices {
        gap:8px;
    }
    .tjss__summary-choice {
        padding:8px 9px;
    }
    .tjss__summary-choice-img {
        width:42px;
        height:42px;
        flex-basis:42px;
    }
}

@media (max-width:549px) {
    .tjss__summary {
        padding:14px;
    }
    .tjss__summary-top {
        align-items:flex-start;
        flex-direction:column;
        gap:9px;
    }
    .tjss__change {
        margin-right:49px;
        padding:7px 10px;
    }
    .tjss__summary-choices {
        grid-template-columns:1fr;
        gap:7px;
        margin-top:12px;
    }
    .tjss__summary-choice {
        padding:7px 9px;
    }
    .tjss__summary-choice-img {
        width:40px;
        height:40px;
        flex-basis:40px;
    }
}


/* v1.4.0 — dynamic subjects section */
.tjss__subjects {
    margin-top:26px;
    padding:0;
}
.tjss__subjects--hidden {
    display:none;
}
.tjss__subjects-head {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:14px;
}
.tjss__subjects-kicker {
    display:block;
    margin-bottom:3px;
    color:var(--tjss-green-dark);
    font-size:12px;
    line-height:1.4;
    font-weight:800;
}
.tjss__subjects-head h3 {
    margin:0;
    color:var(--tjss-navy);
    font-size:25px;
    line-height:1.3;
    font-weight:900;
}
.tjss__subjects-head p {
    margin:4px 0 0;
    color:var(--tjss-muted);
    font-size:13px;
    line-height:1.6;
}
.tjss__subjects-context {
    flex:0 0 auto;
    color:var(--tjss-muted);
    font-size:11px;
    font-weight:700;
}
.tjss__subjects-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
}
.tjss__subject-card {
    min-height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:13px 14px;
    border:1px solid var(--tjss-border);
    border-radius:15px;
    background:#fff;
    color:var(--tjss-text);
    text-decoration:none;
    box-shadow:0 5px 18px rgba(17,25,44,.035);
    transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.tjss__subject-card:hover {
    border-color:rgba(12,177,130,.55);
    box-shadow:0 8px 21px rgba(17,25,44,.065);
    transform:translateY(-2px);
    color:var(--tjss-text);
}
.tjss__subject-main {
    min-width:0;
}
.tjss__subject-name {
    display:block;
    color:var(--tjss-navy);
    font-size:15px;
    line-height:1.4;
    font-weight:850;
}
.tjss__subject-count {
    display:block;
    margin-top:3px;
    color:var(--tjss-muted);
    font-size:11px;
    line-height:1.35;
}
.tjss__subject-arrow {
    width:30px;
    height:30px;
    flex:0 0 30px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--tjss-mint);
    color:var(--tjss-green-dark);
    font-size:15px;
    font-weight:900;
}
.tjss__subjects-loading,
.tjss__subjects-empty {
    min-height:84px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:18px;
    border:1px dashed var(--tjss-border);
    border-radius:15px;
    color:var(--tjss-muted);
    background:#fff;
    font-size:13px;
    text-align:center;
}
.tjss__subjects-loading[hidden],
.tjss__subjects-empty[hidden] {
    display:none !important;
}
.tjss__spinner {
    width:18px;
    height:18px;
    border:2px solid rgba(12,177,130,.18);
    border-top-color:var(--tjss-green-dark);
    border-radius:50%;
    animation:tjss-spin .7s linear infinite;
}
@keyframes tjss-spin {
    to { transform:rotate(360deg); }
}

@media (max-width:849px) {
    .tjss__subjects-grid {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}
@media (max-width:549px) {
    .tjss__subjects {
        margin-top:20px;
    }
    .tjss__subjects-head {
        align-items:flex-start;
        flex-direction:column;
        gap:5px;
        margin-bottom:11px;
    }
    .tjss__subjects-head h3 {
        font-size:22px;
    }
    .tjss__subjects-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
    }
    .tjss__subject-card {
        min-height:76px;
        padding:10px 11px;
        border-radius:13px;
    }
    .tjss__subject-name {
        font-size:13px;
    }
    .tjss__subject-count {
        font-size:10px;
    }
    .tjss__subject-arrow {
        width:26px;
        height:26px;
        flex-basis:26px;
        font-size:13px;
    }
}
@media (max-width:370px) {
    .tjss__subjects-grid {
        grid-template-columns:1fr;
    }
}


/* v1.5.0 — subject taxonomy icons */
.tjss__subject-card {
    justify-content:flex-start;
}
.tjss__subject-icon {
    width:52px;
    height:52px;
    flex:0 0 52px;
    display:grid;
    place-items:center;
    border-radius:13px;
    background:#F7FBFA;
    overflow:hidden;
}
.tjss__subject-icon img {
    width:100%;
    height:100%;
    object-fit:contain;
    padding:3px;
}
.tjss__subject-icon-fallback {
    font-size:24px;
    line-height:1;
}
.tjss__subject-main {
    flex:1 1 auto;
}
.tjss__subject-arrow {
    margin-right:auto;
}
@media (max-width:549px) {
    .tjss__subject-icon {
        width:44px;
        height:44px;
        flex-basis:44px;
        border-radius:11px;
    }
    .tjss__subject-icon-fallback {
        font-size:20px;
    }
}


/* v1.6.0 — Latest booklets */
.tjss__latest {
    margin-top:34px;
}
.tjss__latest--hidden {
    display:none;
}
.tjss__latest-head {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:14px;
}
.tjss__latest-kicker {
    display:block;
    margin-bottom:3px;
    color:var(--tjss-green-dark);
    font-size:12px;
    line-height:1.4;
    font-weight:800;
}
.tjss__latest-head h3 {
    margin:0;
    color:var(--tjss-navy);
    font-size:25px;
    line-height:1.3;
    font-weight:900;
}
.tjss__latest-head p {
    margin:4px 0 0;
    color:var(--tjss-muted);
    font-size:13px;
    line-height:1.6;
}
.tjss__latest-context {
    flex:0 0 auto;
    color:var(--tjss-muted);
    font-size:11px;
    font-weight:700;
}
.tjss__latest-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
}
.tjss__product-card {
    min-width:0;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:1px solid var(--tjss-border);
    border-radius:16px;
    background:#fff;
    color:var(--tjss-text);
    text-decoration:none;
    box-shadow:0 6px 20px rgba(17,25,44,.04);
    transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.tjss__product-card:hover {
    border-color:rgba(12,177,130,.52);
    box-shadow:0 10px 27px rgba(17,25,44,.075);
    transform:translateY(-3px);
    color:var(--tjss-text);
}
.tjss__product-media {
    position:relative;
    display:block;
    aspect-ratio:1 / 1;
    overflow:hidden;
    background:#F8FAF9;
}
.tjss__product-media img {
    width:100%;
    height:100%;
    display:block;
    object-fit:contain;
    padding:10px;
}
.tjss__product-badge {
    position:absolute;
    top:10px;
    right:10px;
    padding:5px 8px;
    border-radius:999px;
    background:var(--tjss-green-dark);
    color:#fff;
    font-size:10px;
    line-height:1;
    font-weight:800;
}
.tjss__product-body {
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    padding:12px 13px 13px;
}
.tjss__product-name {
    display:-webkit-box;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    min-height:42px;
    color:var(--tjss-navy);
    font-size:14px;
    line-height:1.5;
    font-weight:800;
}
.tjss__product-footer {
    margin-top:auto;
    padding-top:10px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}
.tjss__product-price {
    color:var(--tjss-green-dark);
    font-size:14px;
    line-height:1.3;
    font-weight:900;
}
.tjss__product-price del {
    color:var(--tjss-muted);
    font-size:11px;
    font-weight:500;
}
.tjss__product-price ins {
    text-decoration:none;
}
.tjss__product-cta {
    flex:0 0 auto;
    color:var(--tjss-green-dark);
    font-size:11px;
    font-weight:800;
}
.tjss__latest-loading,
.tjss__latest-empty {
    min-height:110px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:18px;
    border:1px dashed var(--tjss-border);
    border-radius:15px;
    color:var(--tjss-muted);
    background:#fff;
    font-size:13px;
    text-align:center;
}
.tjss__latest-loading[hidden],
.tjss__latest-empty[hidden] {
    display:none !important;
}

@media (max-width:849px) {
    .tjss__latest-grid {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}
@media (max-width:549px) {
    .tjss__latest {
        margin-top:26px;
    }
    .tjss__latest-head {
        align-items:flex-start;
        flex-direction:column;
        gap:5px;
        margin-bottom:11px;
    }
    .tjss__latest-head h3 {
        font-size:22px;
    }
    .tjss__latest-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }
    .tjss__product-card {
        border-radius:13px;
    }
    .tjss__product-media img {
        padding:7px;
    }
    .tjss__product-badge {
        top:7px;
        right:7px;
        padding:4px 7px;
        font-size:9px;
    }
    .tjss__product-body {
        padding:9px 9px 10px;
    }
    .tjss__product-name {
        min-height:39px;
        font-size:12px;
        line-height:1.55;
    }
    .tjss__product-footer {
        align-items:flex-start;
        flex-direction:column;
        gap:3px;
        padding-top:7px;
    }
    .tjss__product-price {
        font-size:13px;
    }
    .tjss__product-cta {
        font-size:10px;
    }
}
@media (max-width:360px) {
    .tjss__latest-grid {
        grid-template-columns:1fr;
    }
}


/* v1.6.1 — Latest booklets horizontal scroll */
.tjss__latest-grid {
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:calc((100% - 42px) / 4);
    grid-template-columns:none;
    gap:14px;
    overflow-x:auto;
    overflow-y:hidden;
    padding:3px 2px 12px;
    scroll-snap-type:x proximity;
    scroll-behavior:smooth;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color:rgba(8,124,91,.28) transparent;
}
.tjss__latest-grid::-webkit-scrollbar {
    height:6px;
}
.tjss__latest-grid::-webkit-scrollbar-track {
    background:transparent;
}
.tjss__latest-grid::-webkit-scrollbar-thumb {
    background:rgba(8,124,91,.24);
    border-radius:999px;
}
.tjss__latest-grid::-webkit-scrollbar-thumb:hover {
    background:rgba(8,124,91,.42);
}
.tjss__product-card {
    width:100%;
    scroll-snap-align:start;
}

@media (max-width:849px) {
    .tjss__latest-grid {
        grid-template-columns:none;
        grid-auto-columns:calc((100% - 24px) / 2.7);
        gap:12px;
    }
}

@media (max-width:549px) {
    .tjss__latest-grid {
        grid-template-columns:none;
        grid-auto-columns:calc((100% - 9px) / 1.72);
        gap:9px;
        padding-bottom:10px;
        scrollbar-width:none;
    }
    .tjss__latest-grid::-webkit-scrollbar {
        display:none;
    }
}

@media (max-width:360px) {
    .tjss__latest-grid {
        grid-template-columns:none;
        grid-auto-columns:82%;
    }
}


/* v1.7.0 — Best sellers */
.tjss__best {
    margin-top:34px;
}
.tjss__best--hidden {
    display:none;
}
.tjss__best-head {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:14px;
}
.tjss__best-kicker {
    display:block;
    margin-bottom:3px;
    color:var(--tjss-green-dark);
    font-size:12px;
    line-height:1.4;
    font-weight:800;
}
.tjss__best-head h3 {
    margin:0;
    color:var(--tjss-navy);
    font-size:25px;
    line-height:1.3;
    font-weight:900;
}
.tjss__best-head p {
    margin:4px 0 0;
    color:var(--tjss-muted);
    font-size:13px;
    line-height:1.6;
}
.tjss__best-context {
    flex:0 0 auto;
    color:var(--tjss-muted);
    font-size:11px;
    font-weight:700;
}
.tjss__best-preview-note {
    margin:-2px 0 12px;
    padding:9px 11px;
    border:1px solid #F0D99B;
    border-radius:10px;
    background:#FFF9E8;
    color:#7A5B00;
    font-size:11px;
    line-height:1.5;
    font-weight:700;
}
.tjss__best-preview-note[hidden] {
    display:none !important;
}
.tjss__best-grid {
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:calc((100% - 42px) / 4);
    grid-template-columns:none;
    gap:14px;
    overflow-x:auto;
    overflow-y:hidden;
    padding:3px 2px 12px;
    scroll-snap-type:x proximity;
    scroll-behavior:smooth;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color:rgba(8,124,91,.28) transparent;
}
.tjss__best-grid::-webkit-scrollbar {
    height:6px;
}
.tjss__best-grid::-webkit-scrollbar-track {
    background:transparent;
}
.tjss__best-grid::-webkit-scrollbar-thumb {
    background:rgba(8,124,91,.24);
    border-radius:999px;
}
.tjss__best-grid .tjss__product-card {
    width:100%;
    scroll-snap-align:start;
}
.tjss__product-badge--best {
    background:var(--tjss-navy);
}
.tjss__best-loading,
.tjss__best-empty {
    min-height:110px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:18px;
    border:1px dashed var(--tjss-border);
    border-radius:15px;
    color:var(--tjss-muted);
    background:#fff;
    font-size:13px;
    text-align:center;
}
.tjss__best-loading[hidden],
.tjss__best-empty[hidden] {
    display:none !important;
}

@media (max-width:849px) {
    .tjss__best-grid {
        grid-template-columns:none;
        grid-auto-columns:calc((100% - 24px) / 2.7);
        gap:12px;
    }
}
@media (max-width:549px) {
    .tjss__best {
        margin-top:26px;
    }
    .tjss__best-head {
        align-items:flex-start;
        flex-direction:column;
        gap:5px;
        margin-bottom:11px;
    }
    .tjss__best-head h3 {
        font-size:22px;
    }
    .tjss__best-grid {
        grid-template-columns:none;
        grid-auto-columns:calc((100% - 9px) / 1.72);
        gap:9px;
        padding-bottom:10px;
        scrollbar-width:none;
    }
    .tjss__best-grid::-webkit-scrollbar {
        display:none;
    }
}
@media (max-width:360px) {
    .tjss__best-grid {
        grid-template-columns:none;
        grid-auto-columns:82%;
    }
}


/* v1.7.1 — More breathing room between homepage sections */
.tjss__subjects {
    margin-top:38px;
}

.tjss__latest,
.tjss__best {
    margin-top:52px;
}

.tjss__subjects-head,
.tjss__latest-head,
.tjss__best-head {
    margin-bottom:20px;
}

.tjss__subjects-head p,
.tjss__latest-head p,
.tjss__best-head p {
    margin-top:6px;
}

@media (max-width:849px) {
    .tjss__subjects {
        margin-top:34px;
    }

    .tjss__latest,
    .tjss__best {
        margin-top:44px;
    }

    .tjss__subjects-head,
    .tjss__latest-head,
    .tjss__best-head {
        margin-bottom:17px;
    }
}

@media (max-width:549px) {
    .tjss__subjects {
        margin-top:28px;
    }

    .tjss__latest,
    .tjss__best {
        margin-top:36px;
    }

    .tjss__subjects-head,
    .tjss__latest-head,
    .tjss__best-head {
        margin-bottom:14px;
    }
}
