/* CPT-1055v: müşteri şablon galerisi (onaylanan Claude Design tasarımı; sitenin yazı tipi, renkleri ve 3px köşeleri).
   Kart yüksekliği ve görsel alanı sabittir (yerleşim kayması yok). */
.tg { font-family: 'CepteFont', 'Volte', Arial, sans-serif; color: #4B4B57; }
.tg *, .tg *::before, .tg *::after { box-sizing: border-box; }
.tg a { color: #0099DF; }
.tg a:hover { color: #007BB5; }
.tg-wrap { max-width: 1170px; margin: 0 auto; padding: 0 16px; }
.tg-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Başlık bandı */
.tg-band { background: #F5F8FA; }
.tg-band .tg-wrap { padding-top: 22px; padding-bottom: 30px; display: flex; flex-direction: column; gap: 18px; }
.tg-crumbs { display: flex; flex-wrap: wrap; gap: 6px; font-size: 11px; margin: 0; padding: 0; list-style: none; }
.tg-crumbs a { background: #E9EDF1; color: #69778A; border-radius: 3px; padding: 3px 9px; text-decoration: none; }
.tg-crumbs a:hover { color: #434F61; }
.tg-crumbs span { color: #9DA3A5; padding: 3px 4px; }
.tg-head { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-end; justify-content: space-between; }
.tg-head-text { display: flex; flex-direction: column; gap: 8px; flex: 1 1 520px; min-width: 0; }
.tg-head h1 { margin: 0; font-size: 32px; font-weight: 400; color: #1F2A44; line-height: 1.25; }
.tg-head p { margin: 0; font-size: 14px; line-height: 1.7; color: #69778A; max-width: 620px; }
/* CPT-1055 v11: ürün galerisinin bant görseli (Admin). Sabit kutu: yerleşim kayması yok; dar ekranda tam genişlik. */
.tg-band-media { flex: 0 1 360px; height: 160px; border-radius: 3px; overflow: hidden; background: #E9EDF1; }
.tg-band-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 767px) { .tg-band-media { flex: 1 1 100%; height: 140px; } }
.tg-tabs { display: flex; background: #fff; border: 1px solid #E5E7EB; border-radius: 3px; overflow-x: auto; max-width: 100%; }
.tg-tabs a { height: 38px; padding: 0 16px; display: flex; align-items: center; border-right: 1px solid #E5E7EB; color: #434F61; font-size: 13px; text-decoration: none; white-space: nowrap; }
.tg-tabs a:last-child { border-right: 0; }
.tg-tabs a[aria-current="page"] { background: #0099DF; color: #fff; }
.tg-summary { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; background: #fff; border: 1px solid #E5E7EB; border-radius: 3px; padding: 12px 16px; font-size: 13px; }
.tg-summary strong { font-weight: 400; color: #1F2A44; }
.tg-summary span { display: flex; align-items: center; gap: 6px; color: #4B4B57; }
.tg-summary span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #0099DF; }
.tg-summary a { margin-left: auto; }

/* Gövde */
.tg-main { display: flex; flex-wrap: wrap; gap: 28px; align-items: flex-start; padding-top: 28px; padding-bottom: 56px; }
.tg-aside { flex: 1 1 230px; max-width: 240px; display: flex; flex-direction: column; gap: 22px; }
.tg-aside-title { font-size: 15px; color: #1F2A44; padding-bottom: 10px; border-bottom: 1px dashed #C8CBCC; margin: 0 0 12px; font-weight: 400; }
.tg-input { height: 36px; border-radius: 3px; border: 1px solid #DADADA; padding: 0 12px; font-size: 12px; color: #464A4C; width: 100%; font-family: inherit; }
.tg-input:focus { outline: none; border-color: #0099DF; }
.tg-sectors { display: flex; flex-direction: column; max-height: 330px; overflow: auto; padding-right: 6px; margin-top: 12px; }
.tg-check { display: flex; align-items: center; gap: 10px; min-height: 30px; font-size: 13px; color: #4B4B57; cursor: pointer; }
.tg-check input { width: 15px; height: 15px; margin: 0; accent-color: #0099DF; flex: none; }
.tg-check .tg-name { flex: 1; }
.tg-check .tg-count { font-size: 12px; color: #9DA3A5; }
.tg-fav-count { min-width: 18px; height: 18px; border-radius: 9px; background: #F7B500; color: #fff; font-size: 10px; display: inline-flex; align-items: center; justify-content: center; padding: 0 5px; }
.tg-hint { background: #F5F8FA; border: 1px solid #E5E7EB; border-radius: 3px; padding: 14px; font-size: 12px; line-height: 1.7; color: #69778A; }
.tg-hint strong { display: block; color: #1F2A44; font-size: 13px; font-weight: 400; margin-bottom: 4px; }
.tg-apply { margin-top: 10px; height: 36px; padding: 0 14px; border-radius: 3px; border: 1px solid #008ED0; background: #0099DF; color: #fff; font-size: 13px; cursor: pointer; font-family: inherit; }

.tg-content { flex: 999 1 600px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.tg-toolbar { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; justify-content: space-between; }
.tg-groups { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.tg-seg { display: flex; border: 1px solid #E5E7EB; border-radius: 3px; overflow: hidden; }
.tg-seg a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-width: 62px; padding: 0 8px; height: 52px; border-right: 1px solid #E5E7EB; font-size: 10px; text-decoration: none; background: #fff; color: #69778A; }
.tg-seg a:last-child { border-right: 0; }
.tg-seg a[aria-current="true"] { background: #EAF6FC; color: #007BB5; }
.tg-ic { display: block; width: 18px; height: 12px; border: 1.5px solid currentColor; border-radius: 2px; }
.tg-ic-all { border-style: dashed; border-width: 1px; }
.tg-ic-two { width: 26px; box-shadow: inset -13px 0 0 -12px currentColor; }
.tg-ic-duz { border-radius: 0; }
.tg-ic-oval { border-radius: 4px; }
.tg-ic-daire { width: 13px; height: 13px; border-radius: 50%; }
.tg-ic-elips { width: 20px; border-radius: 50%; }
.tg-ic-fold { display: flex; gap: 2px; height: 12px; }
.tg-ic-fold i { display: block; height: 12px; border: 1.5px solid currentColor; }
.tg-product-note { font-size: 13px; color: #69778A; }
.tg-tools { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 13px; color: #69778A; }
.tg-search { position: relative; }
.tg-search input { width: 190px; height: 36px; border: 0; border-bottom: 1px solid #DADADA; padding: 0 28px 0 4px; font-size: 13px; color: #464A4C; text-align: right; font-family: inherit; background: transparent; }
.tg-search input:focus { outline: none; border-bottom-color: #0099DF; }
.tg-search button { position: absolute; right: 0; top: 6px; border: 0; background: transparent; padding: 4px; cursor: pointer; color: #9DA3A5; }
.tg-filter-btn { display: none; height: 36px; padding: 0 14px; border: 1px solid #DADADA; border-radius: 3px; background: #fff; color: #434F61; font-size: 13px; font-family: inherit; cursor: pointer; align-items: center; gap: 6px; }
.tg-chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.tg-chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px; border-radius: 15px; border: 1px solid #B3DFF4; background: #EAF6FC; color: #007BB5 !important; font-size: 12px; text-decoration: none; }
.tg-chips .tg-clear { font-size: 12px; color: #69778A; text-decoration: underline; }

/* Izgara ve kart */
.tg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(196px, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.tg-create { text-decoration: none; background: #F3F1EC; border: 1px solid #ECE8DF; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; min-height: 236px; height: 100%; color: #4B4B57 !important; font-size: 13px; }
.tg-create span { width: 52px; height: 52px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; }
.tg-card { background: #fff; border: 1px solid #E5E7EB; display: flex; flex-direction: column; height: 100%; }
.tg-card-body { padding: 12px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.tg-card-top { display: flex; gap: 8px; align-items: flex-start; justify-content: space-between; }
.tg-card h2 { margin: 0; font-size: 13px; font-weight: 400; color: #4B4B57; line-height: 1.45; }
.tg-fav { flex: none; width: 26px; height: 26px; border-radius: 50%; border: 1px solid #DADADA; background: #fff; color: #C8CBCC; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.tg-fav[aria-pressed="true"] { border-color: #F7B500; background: #FFF7E0; color: #E0A300; }
.tg-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.tg-tags span { font-size: 10px; color: #69778A; background: #F3F4F6; border-radius: 3px; padding: 2px 7px; }
.tg-start { margin-top: auto; text-align: center; text-decoration: none; border: 1px solid #0099DF; color: #0099DF; border-radius: 3px; font-size: 13px; padding: 9px 8px; }
.tg-start:hover { background: #0099DF; color: #fff !important; }
.tg-badge { position: absolute; left: 8px; top: 8px; font-size: 10px; background: #26C281; color: #fff; border-radius: 3px; padding: 2px 7px; z-index: 2; }

/* Mockup: kartın kendi önizlemesi ürün türüne göre bir sahnede; üzerine gelince ya da odakta düz önizleme */
.tg-mk { position: relative; display: block; height: 178px; background: #F5F8FA; overflow: hidden; text-decoration: none; }
.tg-mk:focus-visible { outline: 2px solid #0099DF; outline-offset: -2px; }
.tg-scene, .tg-flat { position: absolute; inset: 0; transition: opacity .25s; }
.tg-flat { opacity: 0; display: flex; align-items: center; justify-content: center; padding: 14px; background: #F5F8FA; }
.tg-mk:hover .tg-flat, .tg-mk:focus-visible .tg-flat { opacity: 1; }
.tg-mk:hover .tg-scene, .tg-mk:focus-visible .tg-scene { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .tg-scene, .tg-flat { transition: none; } }
.tg-flat img, .tg-flat .tg-ph { max-width: 100%; max-height: 100%; box-shadow: 0 2px 8px rgba(16,16,16,.18); background: #fff; }
.tg-flat .tg-ph { width: 150px; height: 92px; }
.tg-face { overflow: hidden; background: #fff; }
.tg-face img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tg-ph { background: #fff; background-image: linear-gradient(#E5E7EB, #E5E7EB), linear-gradient(#EEF0F2, #EEF0F2), linear-gradient(#EEF0F2, #EEF0F2);
         background-repeat: no-repeat; background-size: 40% 8%, 56% 5%, 46% 5%; background-position: 12% 32%, 12% 56%, 12% 70%; }
.tg-stage { position: absolute; left: 50%; top: 52%; width: 0; height: 0; perspective: 700px; }
.tg-shape-2 .tg-face { border-radius: 8px; }
.tg-shape-3 .tg-face, .tg-shape-4 .tg-face { border-radius: 50%; }

/* Kartvizit / davetiye: masa üstünde ön ve arka yüz */
.tg-scene-card .tg-scene { background: linear-gradient(160deg, #EDE7DF 0%, #DCD3C8 100%); }
.tg-scene-card .tg-back, .tg-scene-card .tg-front { position: absolute; width: 112px; height: 70px; border-radius: 2px; }
.tg-scene-card .tg-back { left: -78px; top: -29px; transform: rotateX(50deg) rotateZ(-28deg); box-shadow: 8px 12px 14px rgba(40,30,20,.32); filter: brightness(.72) saturate(.9); }
.tg-scene-card .tg-front { left: -50px; top: -57px; transform: rotateX(50deg) rotateZ(-14deg) translateZ(10px); box-shadow: 10px 16px 16px rgba(40,30,20,.34), 0 0 0 1px rgba(0,0,0,.04); }
.tg-scene-card.tg-shape-3 .tg-back, .tg-scene-card.tg-shape-3 .tg-front { width: 76px; height: 76px; }
.tg-scene-card.tg-shape-4 .tg-back, .tg-scene-card.tg-shape-4 .tg-front { width: 104px; height: 76px; }
.tg-scene-card.tg-tall .tg-back, .tg-scene-card.tg-tall .tg-front { width: 70px; height: 112px; }

/* CPT-1055v3 (firma sahibi 2026-10-22): kartvizit ve sticker — döşeli yerleşim. Döndürülmüş ızgara, ön ve arka yüz dama gibi
   sırayla (arka yüz yoksa ön yüz), yumuşak gölge, ortadaki kart biraz kalkık; kenardaki kartlar çerçevede kesilir.
   Görseller --tf (ön) ve --tb (arka) değişkenleriyle gelir; kesim şekli tg-shape-N ile, oran --ar ile. */
.tg-scene-tile .tg-scene { background: radial-gradient(120% 90% at 50% 45%, #FBF9F5 0%, #F3EFE8 70%, #ECE6DC 100%); }
.tg-tiles { position: absolute; inset: 0; overflow: hidden; --tw: 120px; --tgap: 14px; }
.tg-tgrid { position: absolute; left: 50%; top: 50%; display: grid; grid-template-columns: repeat(5, var(--tw)); gap: var(--tgap);
            transform: translate(-50%, -50%) rotate(-20deg); }
.tg-t { display: block; width: var(--tw); aspect-ratio: var(--ar, 1.6); background: #fff var(--tf, none) center / cover no-repeat;
        box-shadow: 0 1px 1px rgba(70,52,34,.10), 2px 5px 9px rgba(70,52,34,.20); }
.tg-t:nth-child(even) { background-image: var(--tb, var(--tf, none)); }
.tg-t:nth-child(13) { position: relative; z-index: 1; transform: translateY(-3px) scale(1.06); box-shadow: 0 2px 3px rgba(70,52,34,.14), 6px 14px 22px rgba(70,52,34,.32); }
.tg-t.tg-ph { background-color: #fff; }
.tg-shape-2 .tg-t { border-radius: 6px; }
.tg-shape-3 .tg-t, .tg-shape-4 .tg-t { border-radius: 50%; }
.tg-scene-tile .tg-flat img { max-height: 100%; }
/* görüntü dışındaki kartlar çizilmez; arka plan görselleri ekrana yaklaşınca iner (img loading="lazy" yerine) */
.tg-grid > li { content-visibility: auto; contain-intrinsic-size: auto 330px; }

/* Hızlı önizleme (CPT-1055v3) */
.tg-card-actions { display: flex; gap: 6px; flex: none; }
.tg-qv { width: min(920px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; border: 1px solid #E5E7EB; border-radius: 3px; color: #4B4B57; font-family: inherit; }
.tg-qv::backdrop { background: rgba(0,0,0,.45); }
/* CPT-1055 v8: "Seçimi değiştir" penceresi (ürün sayfasının seçim kipi, çerçeve içinde). 600 px altında tam ekran. */
.tg-sel { width: min(1100px, calc(100vw - 32px)); height: min(860px, calc(100vh - 32px)); padding: 0; border: 1px solid #E5E7EB; border-radius: 3px; color: #4B4B57; font-family: inherit; }
.tg-sel[open] { display: flex; flex-direction: column; }
.tg-sel::backdrop { background: rgba(0,0,0,.45); }
.tg-sel iframe { flex: 1 1 auto; width: 100%; min-height: 0; border: 0; display: block; }
@media (max-width: 600px) {
    .tg-sel { width: 100vw; max-width: 100vw; height: 100vh; height: 100dvh; max-height: 100dvh; margin: 0; border: 0; border-radius: 0; }
}
.tg-qv-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; border-bottom: 1px solid #E5E7EB; }
.tg-qv-head h2 { margin: 0; font-size: 16px; font-weight: 400; color: #1F2A44; }
.tg-qv-head button { border: 0; background: transparent; font-size: 24px; line-height: 1; cursor: pointer; color: #434F61; }
.tg-qv-body { padding: 18px; display: flex; flex-direction: column; gap: 16px; }
.tg-qv-scene { position: relative; height: 380px; overflow: hidden; background: radial-gradient(120% 90% at 50% 45%, #FBF9F5 0%, #F3EFE8 70%, #ECE6DC 100%); }
.tg-qv-scene[hidden] { display: none; }
.tg-qv-flat figure[hidden] { display: none; }
.tg-qv-scene .tg-tiles { --tw: 180px; --tgap: 22px; }
.tg-qv-flat { display: flex; gap: 16px; flex-wrap: wrap; }
.tg-qv-flat figure { margin: 0; flex: 1 1 200px; display: flex; flex-direction: column; gap: 6px; align-items: center; background: #F5F8FA; padding: 14px; }
.tg-qv-flat img { max-width: 100%; max-height: 220px; box-shadow: 0 2px 8px rgba(16,16,16,.18); background: #fff; }
.tg-qv-flat figcaption { font-size: 12px; color: #69778A; }
.tg-qv-foot { display: flex; justify-content: flex-end; }
.tg-qv-foot .tg-start { padding: 10px 22px; }

/* El ilanı: üst üste iki tabaka */
.tg-scene-sheet .tg-scene { background: linear-gradient(160deg, #E8EDF1 0%, #D5DEE6 100%); }
.tg-scene-sheet .tg-back, .tg-scene-sheet .tg-front { position: absolute; width: 82px; height: 116px; }
.tg-scene-sheet .tg-back { left: -46px; top: -66px; transform: rotateX(40deg) rotateZ(-20deg); box-shadow: 6px 10px 12px rgba(30,40,55,.25); }
.tg-scene-sheet .tg-back img { opacity: 0; }
.tg-scene-sheet .tg-front { left: -36px; top: -74px; transform: rotateX(40deg) rotateZ(-8deg) translateZ(6px); box-shadow: 8px 12px 14px rgba(30,40,55,.30); }
.tg-scene-sheet.tg-wide .tg-back, .tg-scene-sheet.tg-wide .tg-front { width: 116px; height: 82px; }

/* Broşür: ayakta, yarı açık panolar (açık tabaka önizlemesi panolara bölünür) */
.tg-scene-fold .tg-scene { background: linear-gradient(180deg, #E6ECF1 0%, #E6ECF1 64%, #D3DBE2 64%, #C9D2DA 100%); }
.tg-fold-shadow { position: absolute; left: -54px; top: 18px; width: 120px; height: 14px; border-radius: 50%; background: rgba(30,40,55,.25); filter: blur(5px); }
.tg-fold { position: absolute; left: 0; top: -60px; width: 0; height: 0; transform-style: preserve-3d; transform: rotateX(-6deg) rotateY(-22deg); }
.tg-panel { position: absolute; left: 0; top: 0; width: 44px; height: 98px; overflow: hidden; background: #fff; box-shadow: inset 0 0 12px rgba(0,0,0,.14); }
.tg-panel img { position: absolute; top: 0; height: 100%; width: auto; max-width: none; }
.tg-fold-2 .tg-panel:nth-child(1) { transform-origin: right center; transform: translateX(-44px) rotateY(-30deg); }
.tg-fold-2 .tg-panel:nth-child(2) { transform-origin: left center; }
.tg-fold-3 .tg-panel:nth-child(1) { transform-origin: right center; transform: translateX(-54px) rotateY(-56deg); }
.tg-fold-3 .tg-panel:nth-child(2) { transform: translateX(-10px); }
.tg-fold-3 .tg-panel:nth-child(3) { transform-origin: left center; transform: translateX(34px) rotateY(40deg); }

/* Sticker: kraft kutu üzerinde, kesim payı beyaz */
.tg-scene-sticker .tg-scene { background: #E9EEF2; }
.tg-box { position: absolute; left: -78px; top: -66px; width: 156px; height: 132px; transform: rotateX(46deg) rotateZ(10deg); transform-style: preserve-3d; }
.tg-box::before { content: ""; position: absolute; inset: 0; border-radius: 4px; background: linear-gradient(135deg, #C9A57A 0%, #B98F60 100%); box-shadow: 12px 16px 16px rgba(40,40,50,.28); }
.tg-box::after { content: ""; position: absolute; left: 0; right: 0; top: 60px; height: 8px; background: rgba(255,255,255,.35); }
.tg-sticker { position: absolute; left: 40px; top: 28px; width: 76px; height: 76px; padding: 4px; background: #fff; border-radius: 4px; transform: translateZ(2px); box-shadow: 2px 3px 4px rgba(60,40,20,.35); z-index: 1; }
.tg-sticker .tg-face { width: 100%; height: 100%; border-radius: 3px; }
.tg-scene-sticker.tg-shape-2 .tg-sticker { border-radius: 12px; }
.tg-scene-sticker.tg-shape-3 .tg-sticker, .tg-scene-sticker.tg-shape-3 .tg-sticker .tg-face { border-radius: 50%; }
.tg-scene-sticker.tg-shape-4 .tg-sticker { left: 30px; top: 34px; width: 96px; height: 64px; }
.tg-scene-sticker.tg-shape-4 .tg-sticker, .tg-scene-sticker.tg-shape-4 .tg-sticker .tg-face { border-radius: 50%; }

/* Boş sonuç, sayfalama */
.tg-empty { border: 1px solid #E5E7EB; padding: 28px; text-align: center; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.tg-empty strong { color: #1F2A44; font-size: 15px; font-weight: 400; }
.tg-empty span { font-size: 13px; color: #69778A; }
.tg-btn { display: inline-flex; align-items: center; margin-top: 6px; height: 40px; padding: 0 18px; border-radius: 3px; border: 1px solid #008ED0; background: #0099DF; color: #fff !important; font-size: 14px; text-decoration: none; }
/* CPT-1055 v2: sonsuz kaydırma — "Daha fazla göster" yedeği ve yükleniyor göstergesi */
.tg-pages { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 18px; flex-wrap: wrap; min-height: 46px; }
.tg-pages [hidden] { display: none !important; }
.tg-prev { font-size: 13px; color: #0099DF; text-decoration: none; }
.tg-loading { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: #69778A; }
.tg-loading i { width: 16px; height: 16px; border: 2px solid #E5E7EB; border-top-color: #0099DF; border-radius: 50%; animation: tg-spin .8s linear infinite; }
@keyframes tg-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .tg-loading i { animation: none; } }
/* CPT-1055 v2: masaüstünde sol sütun kaydırırken görünür kalır; uzunsa kendi içinde kayar */
@media (min-width: 768px) {
    .tg-aside { position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow-y: auto; overscroll-behavior: contain; }
}
.tg-drawer-head { display: none; }

/* 390 px: süzgeçler "Filtrele" çekmecesinde */
@media (max-width: 767px) {
    .tg-head h1 { font-size: 24px; }
    .tg-main { padding-top: 18px; }
    .tg-filter-btn { display: inline-flex; }
    /* çekmece sitenin üst başlığının (.nav-menu-header z-index 999999) ve alt menüsünün üstünde açılır */
    .tg-aside { position: fixed; z-index: 1000001; inset: 0 auto 0 0; width: min(320px, 88vw); max-width: none; background: #fff; padding: 16px; overflow-y: auto;
                transform: translateX(-105%); transition: transform .2s; box-shadow: 4px 0 16px rgba(0,0,0,.18); }
    .tg-aside.is-open { transform: none; }
    .tg-drawer-head { display: flex; justify-content: space-between; align-items: center; font-size: 15px; color: #1F2A44; }
    .tg-drawer-head button { border: 0; background: transparent; font-size: 22px; line-height: 1; cursor: pointer; color: #434F61; }
    .tg-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 1000000; }
    .tg-seg a { min-width: 52px; }
    .tg-search input { width: 150px; }
    .tg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .tg-mk { height: 150px; }
    .tg-create { min-height: 200px; }
    .tg-tiles { --tw: 92px; --tgap: 10px; }
    .tg-qv-scene { height: 240px; }
    .tg-qv-scene .tg-tiles { --tw: 120px; --tgap: 14px; }
    .tg-qv-flat img { max-height: 150px; }
}