.tiu { --tiu-g: #2f8a3e; --tiu-ink: #111827; --tiu-mut: #6b7280; --tiu-line: #e8ebe9; --tiu-bg: #f5f7f6; color: #1f2937; }
.tiu a { text-decoration: none !important; color: inherit; }
.tiu-bar { position: sticky; top: 0; z-index: 5; background: rgba(255,255,255,.96); backdrop-filter: blur(6px); border: 1px solid var(--tiu-line); border-radius: 18px; padding: 16px 18px; display: grid; grid-template-columns: minmax(220px, 1fr) 2fr; gap: 14px 26px; align-items: center; box-shadow: 0 12px 30px -24px rgba(15,23,42,.5); }
.admin-bar .tiu-bar { top: 32px; }
.tiu-rad label { display: flex; justify-content: space-between; font-weight: 600; color: var(--tiu-ink); font-size: .92rem; margin: 0; }
.tiu-rad b { color: var(--tiu-g); font-variant-numeric: tabular-nums; }
.tiu-rad input[type=range] { width: 100%; accent-color: var(--tiu-g); margin: 8px 0 2px; padding: 0; border: 0; background: none; box-shadow: none; }
.tiu-rad small { display: flex; justify-content: space-between; color: var(--tiu-mut); font-size: .72rem; }
.tiu-filters { display: grid; gap: 8px; }
.tiu-chips { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.tiu-chips .l { font-size: .78rem; color: var(--tiu-mut); font-weight: 600; min-width: 62px; }
.tiu-chips button { font: 600 .82rem/1.3 inherit; padding: 6px 12px !important; border-radius: 999px !important; border: 1px solid var(--tiu-line) !important; background: #fff !important; color: #374151 !important; cursor: pointer; box-shadow: none !important; text-transform: none; letter-spacing: 0; }
.tiu-chips button[aria-pressed=true] { background: var(--tiu-ink) !important; border-color: var(--tiu-ink) !important; color: #fff !important; }
.tiu-count { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; border-top: 1px solid var(--tiu-line); padding-top: 10px; font-size: .88rem; color: var(--tiu-mut); }
.tiu-count b { color: var(--tiu-ink); }
.tiu-month { font: 700 1.1rem/1.3 Poppins, Inter, sans-serif !important; color: var(--tiu-ink); margin: 38px 0 14px !important; display: flex; align-items: center; gap: 10px; }
.tiu-month::after { content: ""; flex: 1; height: 1px; background: var(--tiu-line); }
.tiu-month[hidden], .tiu-grid[hidden], .tiu-card[hidden], .tiu-empty[hidden] { display: none !important; }
.tiu-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.tiu-card { border: 1px solid var(--tiu-line); border-radius: 18px; overflow: hidden; background: #fff; display: flex; flex-direction: column; transition: transform .2s, box-shadow .2s; }
.tiu-card:hover { transform: translateY(-2px); box-shadow: 0 18px 36px -20px rgba(15,23,42,.45); }
.tiu-pic { position: relative; aspect-ratio: 16 / 8; background: #eef2ef center / cover no-repeat; display: grid; place-items: center; overflow: hidden; }
.tiu-pic.logo { background: linear-gradient(135deg, #f3f6f4, #e6ece8); }
.tiu-pic.logo img { max-width: 46%; max-height: 70%; object-fit: contain; filter: drop-shadow(0 6px 12px rgba(0,0,0,.12)); }
.tiu-pic.gfx { background: radial-gradient(120% 120% at 20% 10%, #2c6b39 0%, #14361d 60%, #0d2413 100%); }
.tiu-pic.gfx::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(115deg, rgba(255,255,255,.035) 0 2px, transparent 2px 9px); }
.tiu-pic.gfx svg { position: relative; z-index: 1; width: 42%; max-height: 78%; }
.tiu-pic .rg { position: absolute; left: 14px; bottom: 10px; z-index: 2; color: #cfe6d4; font: 700 .72rem Inter, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.tiu-date { position: absolute; left: 12px; top: 12px; z-index: 2; background: #fff; border-radius: 12px; padding: 5px 10px; text-align: center; box-shadow: 0 6px 16px -6px rgba(0,0,0,.35); min-width: 52px; line-height: 1.2; }
.tiu-date small { display: block; font-size: .66rem; font-weight: 700; text-transform: uppercase; color: var(--tiu-g); letter-spacing: .05em; }
.tiu-date b { font: 800 1.2rem/1.1 Poppins, Inter, sans-serif; color: var(--tiu-ink); }
.tiu-date i { font-style: normal; display: block; font-size: .68rem; color: var(--tiu-mut); font-weight: 600; }
.tiu-km { position: absolute; right: 12px; top: 12px; z-index: 2; background: rgba(17,24,39,.82); color: #fff; font-weight: 700; font-size: .78rem; border-radius: 999px; padding: 4px 10px; }
.tiu-km.home { background: var(--tiu-g); }
.tiu-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.tiu-title { font: 700 1.02rem/1.3 Poppins, Inter, sans-serif; color: var(--tiu-ink); }
.tiu-subs { display: flex; flex-wrap: wrap; gap: 5px; }
.tiu-subs span { font-size: .72rem; font-weight: 600; background: var(--tiu-bg); color: #374151; border-radius: 6px; padding: 2px 7px; }
.tiu-where { font-size: .86rem; color: var(--tiu-mut); }
.tiu-foot { margin-top: auto; padding-top: 8px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.tiu-pill { font-size: .72rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; background: #ecf3ee; color: #256b30; }
.tiu-pill.m { background: #fdf3d0; color: #7a5600; }
.tiu-src { margin-left: auto; font-size: .72rem; color: var(--tiu-mut); }
.tiu-go { font-weight: 600; color: var(--tiu-g) !important; font-size: .86rem; margin-top: 4px; }
.tiu-empty { padding: 40px; text-align: center; color: var(--tiu-mut); border: 1px dashed var(--tiu-line); border-radius: 18px; margin-top: 24px; }
.tiu-note { color: var(--tiu-mut); font-size: .82rem; margin: 26px 0 0; }
.tiu-box { border: 1px solid var(--tiu-line); border-radius: 18px; padding: 18px 20px; background: #fff; }
.tiu-eye { font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--tiu-g); }
.tiu-box ul { list-style: none; margin: 10px 0 12px; padding: 0; }
.tiu-box li { margin: 0; border-bottom: 1px solid var(--tiu-line); }
.tiu-box li a { display: grid; grid-template-columns: 54px 1fr auto; gap: 12px; align-items: center; padding: 10px 0; }
.tiu-box .d { text-align: center; background: var(--tiu-bg); border-radius: 10px; padding: 4px 0; line-height: 1.2; }
.tiu-box .d small { display: block; font-size: .64rem; font-weight: 700; color: var(--tiu-g); text-transform: uppercase; }
.tiu-box .d b { font: 800 1.02rem Poppins, Inter, sans-serif; color: var(--tiu-ink); }
.tiu-box strong { display: block; font-weight: 600; color: var(--tiu-ink); font-size: .92rem; line-height: 1.3; }
.tiu-box em { font-style: normal; font-size: .8rem; color: var(--tiu-mut); }
.tiu-box .k { font-size: .78rem; font-weight: 700; color: var(--tiu-g); white-space: nowrap; }
@media (max-width: 1000px) { .tiu-grid { grid-template-columns: 1fr 1fr; } .tiu-bar { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .tiu-grid { grid-template-columns: 1fr; } .tiu-bar { position: static; } }