:root{
--primary:#2f5acf; --accent:#08a05c; --muted:#6b7785;
--bg:#f6f8fb; --card:#fff; --border:#e6ebf3;
--shadow:0 10px 28px rgba(15,35,75,.06); --r:16px;
}
*{box-sizing:border-box}
.rs-wrap{max-width:1200px;margin:0 auto;padding:18px}
.rs-cats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:14px}
@media (max-width:760px){.rs-cats{grid-template-columns:1fr}}
.rs-cat{display:flex;align-items:center;gap:14px;padding:10px 14px;background:#eef3fb;border:1px solid var(--border);border-radius:999px;box-shadow:inset 0 0 0 1px #e9eef7;cursor:pointer}
.rs-cat .title{font:800 18px system-ui;color:#0f1b2e}
.rs-cat .sub{font:700 13px system-ui;color:#5a677b;margin-left:auto}
.rs-cat .sub .num{color:#ef3b2დ}
.rs-top{display:flex;gap:10px;overflow:auto;padding:6px 2px 10px}
.rs-tab{padding:10px 14px;border:1px solid var(--border);border-radius:999px;background:#f6f8fc;cursor:pointer;font:700 14px system-ui;white-space:nowrap}
.rs-tab.active{background:var(--primary);color:#fff}
.rs-bar{display:flex;gap:10px;margin:14px 0;flex-wrap:wrap}
.rs-search{flex:1;min-width:220px}
.rs-search input{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:#fff;font:600 14px system-ui}
.rs-count{padding:12px 14px;border:1px dashed var(--border);border-radius:12px;background:#fbfcfe;color:#4a576a;font:700 14px}
.rs-panel{background:var(--card);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);padding:16px}
.rs-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
@media (max-width:1100px){.rs-grid{grid-template-columns:repeat(5,1fr)}}
@media (max-width:900px){.rs-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:700px){.rs-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.rs-grid{grid-template-columns:repeat(2,1fr)}}
.rs-card{background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:transform .22s ease,box-shadow .22s ease;cursor:pointer}
.rs-card:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(0,0,0,.10)}
.rs-thumb{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#f2f5fb}
.rs-thumb img{width:76%;height:auto;object-fit:contain;display:block}
.rs-body{padding:10px 12px}
.rs-title{font:700 13px system-ui;margin:0 0 4px;color:#0f1b2e}
.rs-code{font:700 11px system-ui;color:#6b7785}
.rs-tag{display:inline-block;padding:2px 8px;border-radius:999px;background:#eaf3ff;color:#2f5acf;font:800 10px system-ui;margin-left:6px}
.rs-empty{padding:40px 10px;text-align:center;color:#738197}
.rs-modal{position:fixed;inset:0;display:none;z-index:9999}
.rs-modal.active{display:block}
.rs-overlay{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.rs-dialog{position:relative;max-width:980px;margin:40px auto;background:#fff;border-radius:14px;box-shadow:0 18px 60px rgba(0,0,0,.35);padding:18px}
@media (max-width:720px){.rs-dialog{margin:20px 14px;padding:12px}}
.rs-close{position:absolute;right:10px;top:10px;width:36px;height:36px;border-radius:50%;border:0;background:#111;color:#fff;font-size:22px;cursor:pointer;line-height:36px}
.rs-dialog-grid{display:grid;grid-template-columns:360px 1fr;gap:18px}
@media (max-width:900px){.rs-dialog-grid{grid-template-columns:1fr}}
.rs-dialog-media{background:#f5f7fb;border-radius:12px;display:flex;align-items:center;justify-content:center;min-height:280px}
.rs-dialog-media img{width:88%;height:auto;object-fit:contain;display:block}
.rs-dialog-body h3{margin:6px 0 8px;font:800 22px system-ui;color:#0e1b2e}
.rs-code-line{color:#4a576a;font:700 12px system-ui;margin-bottom:8px}
.rs-desc{font:600 14px/1.6 system-ui;color:#16202a}
/* ===== Typography: Georgian-friendly font stack ===== */
.rsdka, .rs-wrap, .rs-cats, .rs-cat, .rs-cat .title, .rs-cat .sub {
font-family: "BPG Nino Mtavruli", "Noto Sans Georgian", system-ui, -apple-system, "Segoe UI", "DejaVu Sans", Arial, sans-serif;
letter-spacing: 0.1px;
}
/* ===== Category Pills: icon slot ===== */
.rs-cat{
position:relative;
padding-left:62px; /* space for icon */
}
.rs-cat::before{
content:"";
position:absolute; left:22px; top:50%; transform:translateY(-50%);
width:28px; height:28px; border-radius:9999px;
background: var(--rs-accent-soft, rgba(45,107,255,.12));
border:1px solid rgba(45,107,255,.18);
}
.rs-cat::after{
content:"";
position:absolute; left:29px; top:50%; transform:translateY(-50%);
width:14px; height:14px;
background: #2D6BFF;
-webkit-mask-repeat:no-repeat; -webkit-mask-position:center; -webkit-mask-size:contain;
mask-repeat:no-repeat; mask-position:center; mask-size:contain;
}
/* Icons per category */
.rs-cat.is-warning::after{
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.rs-cat.is-priority::after{
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.rs-cat.is-guide::after{
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.rs-cat.is-service::after{
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.rs-cat.is-info::after{
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.rs-cat.is-signpost::after{
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.rs-cat.is-plates::after{
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.rs-cat.is-american::after{
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.rs-cat.is-marine::after{
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}