html, body {
overflow-x: hidden !important;
width: 100% !important;
background-color: #e2e8f0 !important; }
:root { --sj-bg:           #e2e8f0;
--sj-card:         #f1f5f9;
--sj-frame:        #cbd5e1; --sj-text:         #1e293b; 
--sj-muted:        #64748b; --sj-accent-red:   #CE2B37; 
--sj-accent-green: #009246; --sj-red-soft:     rgba(206, 43, 55, 0.08);
--sj-green-soft:   rgba(0, 146, 70, 0.08); --sj-chip:         #e2e8f0;
--sj-chip-border:  #cbd5e1;
--sj-shadow-soft:  0 10px 30px rgba(30, 41, 59, 0.05);
} .site-header, .main-navigation, .main-navigation ul ul, 
.sidebar .widget, .site-info, 
.sj-search-card, .sj-404-card, .archive.category .page-header {
background-color: var(--sj-bg) !important;
}  body:not(.home) .separate-containers .inside-article {
background-color: var(--sj-card) !important;
border: 1px solid var(--sj-frame) !important;
border-radius: 16px !important;
box-shadow: var(--sj-shadow-soft) !important;
padding: 40px !important;
margin-top: 20px !important;
}  body.home .separate-containers .inside-article,
.sj-home {
background: transparent !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
margin-bottom: 24px !important;
} .sj-board, .sj-hero-block, .sj-latest, .sj-popular, .sj-news {
background: var(--sj-card) !important;
border: 1px solid var(--sj-frame) !important;
border-radius: 16px !important;
padding: 30px 40px !important;
margin-bottom: 36px !important;
box-shadow: var(--sj-shadow-soft) !important;
}
.sj-hero-block {
background: radial-gradient(circle at top left, var(--sj-red-soft), var(--sj-card)) !important;
} .sj-search-item, 
.archive.category .site-main > article .inside-article,
.sj-404-game-item, .sj-btn, .sj-trending-label, .sj-trend-icon,
.sj-board-tile, .sj-latest-item, .sj-lt-thumb {
background: var(--sj-card) !important;
border-color: var(--sj-frame) !important;
} input[type="email"], input[type="text"], input[type="search"], textarea {
background: var(--sj-card) !important;
border-color: var(--sj-frame) !important;
color: var(--sj-text) !important;
} .sj-hero-btn, 
.sj-search-form button, 
.sj-news-btn,
.sj-404-submit {
background: var(--sj-accent-red) !important;
box-shadow: 0 4px 12px var(--sj-red-soft) !important;
color: #ffffff !important;
}
.sj-hero-btn:hover, 
.sj-search-form button:hover, 
.sj-news-btn:hover,
.sj-404-submit:hover {
background: #A8222C !important;
} .sj-news-success { color: var(--sj-accent-green) !important; }
.sj-search-main { border-color: var(--sj-accent-green) !important; }
.sj-search-thumb-img, .sj-search-thumb-fallback, .sj-search-pill {
background: var(--sj-green-soft) !important;
color: var(--sj-accent-green) !important;
} .sj-trending-label {
color: var(--sj-accent-red) !important;
border-color: rgba(206, 43, 55, 0.3) !important;
}
.sj-trend:hover .sj-trend-text,
.archive.category .entry-title a:hover, 
.archive.category .read-more a:hover,
.sj-footer-links a:hover {
color: var(--sj-accent-red) !important;
} .sj-news-header {
margin-bottom: 24px !important; }
.sj-news-kicker {
font-size: 0.78rem;
text-transform: uppercase;
letter-spacing: 0.08em;
color: var(--sj-muted);
margin: 0 0 8px !important;
}
.sj-news-title {
font-size: 1.3rem !important; line-height: 1.25;
font-weight: 800;
color: var(--sj-text);
margin: 0 0 16px !important; }
.sj-news-text {
font-size: 0.95rem !important;
color: var(--sj-muted);
margin: 0;
line-height: 1.6;
}
.sj-news-form {
margin-top: 28px !important; display: flex;
gap: 12px;
}
.sj-news-note {
margin-top: 24px !important; font-size: 0.8rem !important;
color: var(--sj-muted);
line-height: 1.5;
} .sj-footer {
background: var(--sj-text) !important; 
color: #f8fafc;
padding: 48px 20px 24px;
margin-top: 40px;
border-top: 4px solid var(--sj-accent-red) !important;
}
.sj-footer-container { max-width: 980px; margin: 0 auto; }
.sj-footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px; margin-bottom: 32px; }
.sj-footer-title { color: #ffffff; font-size: 1.1rem; font-weight: 700; margin: 0 0 16px 0; text-transform: uppercase; letter-spacing: 0.05em; }
.sj-footer-text { color: #94a3b8; font-size: 0.92rem; line-height: 1.6; margin: 0; }
.sj-footer-links { list-style: none; padding: 0; margin: 0; }
.sj-footer-links li { margin-bottom: 12px; }
.sj-footer-links a { color: #cbd5e1; text-decoration: none; font-size: 0.92rem; transition: color 0.2s ease, transform 0.2s ease; display: inline-block; }
.sj-footer-links a:hover { color: var(--sj-accent-red) !important; transform: translateX(3px); }
.sj-footer-bottom { border-top: 1px solid rgba(255, 255, 255, 0.1); padding-top: 24px; text-align: center; font-size: 0.85rem; color: #64748b; }
.sj-footer-bottom p { margin: 0; } .sj-sec-title { font-size: 1.1rem; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; color: var(--sj-muted); margin: 0 0 16px; }
.sj-trending { display: flex; align-items: center; gap: 8px; margin-bottom: 32px; padding: 6px 10px; border-radius: 999px; background: var(--sj-chip); border: 1px solid var(--sj-chip-border); overflow: hidden; }
.sj-trending-label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; color: var(--sj-accent-red); padding: 3px 8px; border-radius: 999px; background: var(--sj-card); border: 1px solid rgba(206, 43, 55, 0.3); flex-shrink: 0; }
.sj-trending-viewport { overflow: hidden; flex: 1; min-width: 0; }
.sj-trending-track { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; animation: sj-marquee 28s linear infinite; }
.sj-trend { display: inline-flex; align-items: center; gap: 6px; font-size: 0.82rem; color: var(--sj-text); text-decoration: none; }
.sj-trend-text { white-space: nowrap; }
.sj-trend-sep { opacity: 0.4; font-size: 0.8rem; }
.sj-trend-icon { width: 26px; height: 26px; border-radius: 9px; object-fit: cover; flex-shrink: 0; background: var(--sj-card); border: 1px solid rgba(148,163,184,0.5); }
.sj-icon-fallback { display: inline-flex; align-items: center; justify-content: center; font-size: 0.9rem; font-weight: 700; color: var(--sj-text); }
@keyframes sj-marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.sj-board-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sj-board-tile { display: flex; align-items: center; gap: 10px; padding: 10px 10px; border-radius: 14px; background: var(--sj-card); border: 1px solid rgba(148,163,184,0.35); text-decoration: none; color: var(--sj-text); box-shadow: 0 6px 14px rgba(148,163,184,0.15); transition: transform 0.12s ease-out, box-shadow 0.12s ease-out, border-color 0.12s ease-out; }
.sj-board-tile:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(30, 41, 59, 0.12); border-color: var(--sj-text); }
.sj-board-name { display: flex; flex-direction: column; gap: 2px; font-size: 0.88rem; line-height: 1.1; }
.sj-name-first { font-weight: 700; }
.sj-name-second { font-weight: 500; opacity: 0.85; font-size: 0.8rem; }
.sj-btn { display: inline-flex; align-items: center; justify-content: center; padding: 6px 14px; border-radius: 999px; border: 1px solid rgba(148,163,184,0.6); background: var(--sj-card); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase; color: var(--sj-text) !important; cursor: pointer; transition: border-color 0.15s ease; }
.sj-btn:hover { border-color: var(--sj-text); }
.sj-hero-search { display: flex; gap: 8px; align-items: center; }
.sj-hero-input { flex: 1; min-width: 0; border-radius: 999px; border: 1px solid rgba(148,163,184,0.8); padding: 8px 12px; font-size: 0.9rem; line-height: 1.4; transition: border-color 0.15s ease, box-shadow 0.15s ease; }
.sj-hero-input:focus { outline: none; border-color: var(--sj-text); box-shadow: 0 0 0 1px rgba(30, 41, 59, 0.25); }
.sj-hero-btn { border: none; border-radius: 999px; padding: 8px 14px; font-size: 0.85rem; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background-color 0.15s ease, transform 0.15s ease; }
.sj-hero-btn-text { display: inline-block; }
.sj-latest-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.sj-latest-item { border-radius: 12px; border: 1px solid rgba(148,163,184,0.3); box-shadow: 0 5px 12px rgba(148,163,184,0.16); transition: border-color 0.15s ease, box-shadow 0.15s ease; }
.sj-latest-item:hover { border-color: var(--sj-text); box-shadow: 0 6px 16px rgba(30, 41, 59, 0.12); }
.sj-latest-row { display: flex; align-items: center; gap: 8px; padding: 7px 9px; text-decoration: none; color: var(--sj-text); }
.sj-lt-thumb { width: 36px; height: 36px; border-radius: 10px; object-fit: cover; flex-shrink: 0; border: 1px solid rgba(148,163,184,0.6); } @media (max-width: 768px) { .sj-footer, .sj-footer-container {
width: 100% !important;
max-width: 100vw !important;
box-sizing: border-box !important;
overflow-x: hidden !important;
}
.sj-footer-grid { grid-template-columns: 1fr; gap: 28px; }
.sj-footer { padding: 32px 16px 16px; } .sj-board-grid, .sj-latest-grid {
grid-template-columns: 1fr !important;
} .sj-board, .sj-hero-block, .sj-latest, .sj-popular, .sj-news {
padding: 16px 12px !important; margin-bottom: 24px !important;
border-radius: 12px !important;
}
body:not(.home) .separate-containers .inside-article {
padding: 16px 12px !important; border-radius: 12px !important;
margin-top: 10px !important;
}
.sj-hero-search { flex-direction: column; align-items: stretch; }
.sj-hero-btn { width: 100%; justify-content: center; }
.sj-news-form { flex-direction: column; align-items: stretch; }
.sj-news-btn { width: 100%; }
}
@media (max-width: 768px){
body.home .site-content,
body.home .site-content .content-area,
body.home .site-content .site-main,
body.home .site-content .grid-container,
body.home .inside-article{
width: 100% !important;
max-width: 100% !important;
}
body.home .site-content .grid-container,
body.home .inside-article{
padding-left: 8px !important;
padding-right: 8px !important;
}
} .sj-le-word{ display:none; } .sj-le-icon{
height: 50px;
width: auto;
margin-right: 10px;
} .sj-highlight {
color: var(--sj-accent-green) !important;
background-color: var(--sj-green-soft) !important;
padding: 2px 6px;
border-radius: 4px;
} .sj-answer-box {
background: var(--sj-green-soft) !important;
border: 1px solid rgba(0, 146, 70, 0.2) !important;
border-left: 4px solid var(--sj-accent-green) !important;
padding: 16px 20px !important;
border-radius: 8px !important;
margin-top: 16px !important;
font-size: 1.05rem !important;
font-weight: 500 !important;
color: var(--sj-text) !important;
line-height: 1.6 !important;
display: block;
} .sj-highlight {
color: var(--sj-accent-green) !important;
background-color: transparent !important;
font-weight: 800 !important;
} .sj-search-item .sj-search-hero-icon {
width: 50px;
height: 50px;
}
.sj-search-main .sj-search-hero-icon {
width: 70px;
height: 70px;
} .sj-search-shell {
max-width: 980px;
margin: 24px auto 32px;
padding: 0 10px;
}
.sj-search-card {
background: var(--sj-card) !important;
border-radius: 16px;
border: 1px solid var(--sj-frame) !important;
padding: 30px 40px !important;
box-shadow: var(--sj-shadow-soft) !important;
}
.sj-search-header {
display: flex;
flex-direction: column;
gap: 12px;
margin-bottom: 24px;
}
.sj-search-title {
font-size: 1.6rem;
font-weight: 800;
margin: 0;
color: var(--sj-text);
}
.sj-search-form {
display: flex;
gap: 8px;
align-items: center;
}
.sj-search-section {
margin-top: 24px;
}
.sj-search-section-title {
font-size: 1.15rem;
font-weight: 700;
margin: 0 0 12px;
color: var(--sj-text);
}
.sj-search-list {
display: flex;
flex-direction: column;
gap: 10px;
}
.sj-search-item {
background: #ffffff !important;
border: 1px solid var(--sj-frame) !important;
border-radius: 12px !important;
transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}
.sj-search-item:hover {
border-color: var(--sj-text) !important;
box-shadow: 0 6px 20px rgba(30, 41, 59, 0.08) !important;
transform: translateY(-1px);
}
.sj-search-item-link {
display: block;
padding: 16px 20px !important;
text-decoration: none;
color: inherit;
}
.sj-search-item-body {
display: flex;
flex-direction: column;
gap: 6px;
}
.sj-search-item-title {
font-size: 1.1rem !important;
font-weight: 700;
margin: 0;
color: var(--sj-text);
}
.sj-search-item-excerpt {
font-size: 0.95rem !important;
color: var(--sj-muted) !important;
margin: 0;
line-height: 1.5;
} .sj-search-main {
border: 2px solid var(--sj-accent-green) !important;
background-color: #ffffff !important;
}
.sj-search-main-body {
display: flex;
flex-direction: row !important;
gap: 16px !important;
align-items: flex-start !important;
}
.sj-search-hero-icon {
flex: 0 0 auto;
}
.sj-search-thumb-img, .sj-search-thumb-fallback {
width: 60px !important;
height: 60px !important;
border-radius: 12px !important;
object-fit: cover;
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--sj-green-soft) !important;
color: var(--sj-accent-green) !important;
font-size: 1.5rem !important;
font-weight: bold;
}
.sj-search-hero-text {
flex: 1 1 auto;
min-width: 0;
display: flex;
flex-direction: column;
gap: 4px;
}
.sj-search-pill {
align-self: flex-start;
padding: 4px 10px;
border-radius: 999px;
background: var(--sj-green-soft) !important;
color: var(--sj-accent-green) !important;
font-size: 0.75rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.05em;
margin-bottom: 6px;
} @media (max-width: 768px) {
.sj-search-shell { padding: 0 !important; }
.sj-search-card { padding: 20px 12px !important; }
.sj-search-main-body {
flex-direction: column !important;
align-items: flex-start !important;
gap: 12px !important;
}
} @media (max-width: 768px) { .sj-search-shell{
padding-left: 10px;
padding-right: 10px;
width: 100%;
box-sizing: border-box;
} .sj-search-card{
max-width: none !important;
width: 100%;
margin-left: 0 !important;
margin-right: 0 !important;
box-sizing: border-box;
} .sj-search-item,
.sj-search-item-link{
box-sizing: border-box;
}
} .single-post .inside-article > .post-image,
.single-post .inside-article > .featured-image,
.single-post .inside-article > figure.post-image,
.single-post .inside-article > figure.featured-image,
.single-post .inside-article > .wp-block-post-featured-image,
.single-post .inside-article > figure.wp-block-post-featured-image,
.single-post .inside-article > .wp-post-image {
display: none !important;
} @media (max-width: 768px) {
.single-post .entry-title {
font-size: 1.8rem; line-height: 1.18;
}
}
.single-post .entry-title{
display: inline-block;
position: relative;
padding-bottom: 10px;
}
.single-post .entry-title::after{
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 7px;
height: 5px;
border-radius: 999px;
background: linear-gradient(90deg, #008C45 0 50%, #CD212A 50% 100%);
}
.single-post .inside-article{
padding-left: 10px !important; padding-right: 10px !important;
}
} .sj-404-shell {
width: 100% !important;
max-width: 980px !important;
margin: 24px auto 32px !important;
padding: 0 10px;
display: block !important;
box-sizing: border-box !important;
}
.sj-404-card {
background: var(--sj-card) !important;
border-radius: 16px;
border: 1px solid var(--sj-frame) !important;
padding: 40px !important;
box-shadow: var(--sj-shadow-soft) !important;
}
.sj-404-hero, .sj-404-search, .sj-404-games, .sj-404-request {
margin-bottom: 32px;
}
.sj-404-title {
font-size: 1.8rem;
font-weight: 800;
margin: 0 0 8px;
color: var(--sj-text);
text-align: center;
}
.sj-404-subtitle {
text-align: center;
font-size: 1rem;
color: var(--sj-muted);
margin: 0;
}
.sj-404-section-title {
font-size: 1.25rem;
font-weight: 700;
margin: 0 0 12px;
color: var(--sj-text);
}
.sj-404-text {
font-size: 0.95rem;
color: var(--sj-muted);
margin: 0 0 16px;
}
.sj-404-search-form {
display: flex;
gap: 12px;
align-items: center;
}
.sj-404-games-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 12px;
}
.sj-404-game-item {
display: flex;
align-items: center;
justify-content: center;
background: #ffffff !important;
border: 1px solid var(--sj-frame) !important;
padding: 12px 16px;
border-radius: 999px;
text-decoration: none;
font-weight: 600;
color: var(--sj-text);
transition: all 0.2s ease;
}
.sj-404-game-item:hover {
border-color: var(--sj-text) !important;
transform: translateY(-2px);
}
.sj-404-request-form {
display: flex;
flex-direction: column;
gap: 16px;
}
.sj-404-form-row {
display: flex;
flex-direction: column;
gap: 6px;
}
.sj-404-form-row label {
font-weight: 600;
font-size: 0.9rem;
color: var(--sj-text);
}
.sj-404-message {
padding: 12px 16px;
border-radius: 8px;
margin-bottom: 20px;
font-weight: 600;
}
.sj-404-message-success { background: var(--sj-green-soft); color: var(--sj-accent-green); border: 1px solid rgba(0, 146, 70, 0.2); }
.sj-404-message-error { background: var(--sj-red-soft); color: var(--sj-accent-red); border: 1px solid rgba(206, 43, 55, 0.2); }
@media (max-width: 768px) {
.sj-404-shell { width: 100% !important; padding: 0 !important; }
.sj-404-card { padding: 20px 16px !important; border-radius: 12px; }
.sj-404-search-form { flex-direction: column; align-items: stretch; }
.sj-404-search-form button { width: 100%; }
} @media (max-width: 768px) { .site-header {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
z-index: 99999 !important;
box-shadow: 0 4px 12px rgba(30, 41, 59, 0.08) !important;
} body {
padding-top: 65px !important; } .main-navigation.toggled .main-nav > ul {
max-height: calc(100vh - 65px) !important; 
overflow-y: auto !important;
}
}  body.single .entry-content p, 
body.page:not(.home) .entry-content p,
body.single .entry-content li, 
body.page:not(.home) .entry-content li {
font-size: 1.15rem !important; line-height: 1.8 !important; } body.home .sj-sec-title {
font-size: 1.3rem !important; }
body.home .sj-board-name {
font-size: 1.05rem !important; }
body.home .sj-name-second {
font-size: 0.95rem !important; }
body.home .sj-lt-title {
font-size: 1.15rem !important; }
body.home .sj-news-text {
font-size: 1.05rem !important; } .entry-content ul li, 
.entry-content ol li,
.inside-article ul li,
.inside-article ol li {
margin-bottom: 14px !important; line-height: 1.7 !important;
} .entry-content ul, 
.inside-article ul {
padding-left: 24px !important; 
}