/* Обновления ughs (2026-09-29). Токены и фактуры из /home.css. Одна колонка, новые сверху,
   слева рельс с отметками, у правил «было / стало», внизу записи ссылки на цепочку. */
.up{max-width:820px}
.up-head{margin-top:6px; padding:8px 4px 0}
.up-title{margin:0; font-size:56px; font-weight:800; letter-spacing:-.05em; line-height:.95; font-variation-settings:"opsz" 96}
.up-sub{margin:12px 0 0; color:var(--fg-2); font-size:16px; line-height:1.55; max-width:60ch}

/* стекло, как у панелей главной */
.up-rules,.up-entry{background:var(--glass); border:1px solid var(--glass-line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13), inset 0 0 0 1px rgba(255,255,255,.02), 0 30px 60px -32px rgba(0,0,0,.75);
  -webkit-backdrop-filter:blur(7px) saturate(1.5); backdrop-filter:blur(7px) saturate(1.5)}

/* правила на сейчас: чтобы старые записи не читались как действующие */
.up-rules{margin-top:26px; border-radius:var(--r-lg); padding:22px 24px}
.up-rules-head{display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap}
.up-rules-head h2{margin:0; display:flex; align-items:center; gap:10px; font-size:22px; font-weight:800; letter-spacing:-.03em}
.up-rules-head h2::before{content:""; width:10px; height:10px; background:var(--lime)}
.up-rules-head p{margin:0; color:var(--fg-3); font-size:13.5px}
.up-rules ul{margin:14px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:9px}
.up-rules li{color:var(--fg-2); font-size:15px; line-height:1.55}
.up-rules li b{color:var(--fg)}
.up-rules-link{display:inline-block; margin-top:14px; color:var(--fg); font-weight:700; font-size:15px}

.up-month{margin:38px 0 14px; display:flex; align-items:center; gap:14px; color:var(--fg-3); font-weight:700; font-size:14px}
.up-month::after{content:""; flex:1; height:1px; background:rgba(236,239,226,.12)}

/* лента: рельс слева, у каждой записи квадратная отметка, у свежей лаймовая */
.up-list{list-style:none; margin:0; padding:0 0 0 28px; position:relative; display:flex; flex-direction:column; gap:16px}
.up-list::before{content:""; position:absolute; left:6px; top:12px; bottom:12px; width:2px; background:rgba(236,239,226,.1)}
.up-list > li{position:relative}
.up-list > li::before{content:""; position:absolute; left:-27px; top:26px; width:12px; height:12px; background:var(--bg); border:2px solid var(--fg-3)}
.up-list > li:first-child::before{background:var(--lime); border-color:var(--lime)}

.up-entry{border-radius:var(--r-lg); padding:20px 22px 20px; scroll-margin-top:20px}
.up-entry:target{border-color:rgba(204,255,1,.55)}
.up-meta{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.up-meta time{margin-right:4px; font-weight:800; font-size:15px; font-variant-numeric:tabular-nums}
.up-tag{height:24px; padding:0 10px; display:inline-flex; align-items:center; border-radius:999px; border:1px solid rgba(236,239,226,.16);
  color:var(--fg-2); font-size:12.5px; font-weight:600}
.up-latest{height:26px; padding:0 10px 0 3px; display:inline-flex; align-items:center; gap:6px; border-radius:999px; background:var(--lime); color:var(--bg); font-size:12.5px; font-weight:800}
.up-latest img{width:20px; height:20px; border-radius:50%; image-rendering:pixelated; background:var(--lime)}
.up-perma{margin-left:auto; color:var(--fg-3); text-decoration:none; font-weight:700; opacity:0; transition:opacity .15s}
.up-entry:hover .up-perma,.up-perma:focus-visible{opacity:1}
.up-perma:hover{color:var(--fg)}
.up-entry h2{margin:12px 0 0; font-size:26px; font-weight:800; letter-spacing:-.035em; line-height:1.15}
.up-lede{margin:8px 0 0; color:var(--fg-2); font-size:16px; line-height:1.55}
.up-kind{margin:18px 0 0; display:flex; align-items:center; gap:8px; color:var(--fg); font-size:14px; font-weight:800}
.up-kind::before{content:""; width:6px; height:6px; background:var(--lime)}
.up-items{margin:8px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:10px}
.up-items li{color:var(--fg-2); font-size:15px; line-height:1.6}
.up-items li b{color:var(--fg)}

/* было и стало: старое приглушено и зачёркнуто, новое ярко */
.up-was{margin:10px 0 2px; border-radius:var(--r-md); overflow:hidden; border:1px solid rgba(236,239,226,.09)}
.up-was div{display:grid; grid-template-columns:52px minmax(0,1fr); gap:12px; align-items:baseline; padding:10px 14px; background:rgba(15,18,9,.45)}
.up-was div + div{border-top:1px solid rgba(236,239,226,.07)}
.up-was dt{font-size:12.5px; font-weight:800; color:var(--fg-3)}
.up-was dd{margin:0; color:var(--fg-3); font-size:14.5px; line-height:1.5; text-decoration:line-through; text-decoration-color:rgba(236,239,226,.35)}
.up-was .now dt{color:var(--lime)}
.up-was .now dd{color:var(--fg); text-decoration:none}

.up-why{margin:16px 0 0; color:var(--fg-3); font-size:14.5px; line-height:1.6}
.up-why b{color:var(--fg-2)}
.up-receipts{margin:16px 0 0; display:flex; flex-wrap:wrap; gap:8px}
.up-receipts a{height:30px; padding:0 12px; display:inline-flex; align-items:center; border-radius:999px; color:var(--fg-2); font-size:13px; font-weight:600; text-decoration:none;
  background:linear-gradient(180deg, rgba(236,239,226,.1), rgba(236,239,226,.04)); border:1px solid rgba(236,239,226,.14)}
.up-receipts a:hover{color:var(--fg); border-color:rgba(236,239,226,.3)}
.up-list + *{margin-top:0}
main.up{padding-bottom:60px}

@media (max-width:760px){
  .up-title{font-size:40px}
  .up-rules{padding:18px 16px}
  .up-list{padding-left:20px}
  .up-list::before{left:3px}
  .up-list > li::before{left:-21px; width:10px; height:10px}
  .up-entry{padding:16px 16px 18px}
  .up-entry h2{font-size:22px}
  .up-perma{opacity:1}
  .up-was div{grid-template-columns:44px minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){ .up-perma{transition:none} }
