:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#fff;color:#000}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}
/* 02.11.2026: календарь по образцу Мишки — два месяца рядом на компьютере, один с переключателем на телефоне
   (просьба Артёма: «есть все числа и есть активные кнопки, где есть трансляции и заметки»). */
.tcal{margin:26px 0 10px}
.tcal .months{display:grid;gap:16px}
.tcal-bar{display:none;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.tcal-nav{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--accent);font-size:20px;line-height:1;cursor:pointer}
.tcal-nav:hover{border-color:var(--accent)}
.tcal-t{flex:1;text-align:center;font-family:"Oswald",sans-serif;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.tmon{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 12px 16px}
.tmon h3{font-family:"Oswald",sans-serif;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);text-align:center;margin:2px 0 10px}
.tdow{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:5px}
.tdow span{text-align:center;font-family:"Oswald",sans-serif;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.tgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.tday{height:48px;border:1px solid transparent;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--fg);font-size:15px;text-decoration:none;font-variant-numeric:tabular-nums}
.tday.out{opacity:.3}
a.tday.has{background:var(--surface-2);border-color:var(--accent);font-weight:700;transition:background .15s,color .15s}
a.tday.has:hover{background:var(--accent);color:#fff}
.tday .ic{display:flex;gap:2px;height:13px;align-items:center}
.tday .ic svg{width:13px;height:13px;fill:var(--accent);color:var(--accent)}
a.tday.has:hover .ic svg{fill:#fff;color:#fff}
.tcal-legend{display:flex;flex-wrap:wrap;gap:6px 18px;margin:12px 2px 0;padding:0;list-style:none;color:var(--muted);font-size:13.5px}
.tcal-legend li{display:flex;align-items:center;gap:6px}
.tcal-legend .lg svg{width:13px;height:13px;fill:var(--accent);color:var(--accent);vertical-align:-2px}
@media(min-width:900px){.tcal .months{grid-template-columns:1fr 1fr}.tday{height:56px;font-size:16px}}
@media(max-width:899px){
  .tcal-bar{display:flex}
  .tmon{display:none}
  .tmon.on{display:block}
  .tmon h3{display:none}
}
/*tm-build*/
.tm-logo{display:inline-block;margin:0 0 10px}.tm-logo img{display:block;width:44px;height:44px;border-radius:10px}
.note-foot{display:flex;gap:14px;align-items:center;margin-top:10px;font-family:"Oswald",sans-serif;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase}
.note-foot a{color:var(--accent);text-decoration:none;border-bottom:1px dotted var(--accent)}
.note-rub{display:inline-block;margin-right:8px;padding:2px 8px;border-radius:999px;background:var(--accent);color:#fff;font-family:"Oswald",sans-serif;font-size:10.5px;letter-spacing:.08em}
.note-filter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.note-filter button{appearance:none;border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:999px;padding:6px 13px;font-family:"Oswald",sans-serif;font-size:12px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.note-filter button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.note-card.tm-off{display:none}
.note-q{margin:14px 0 0;padding:12px 14px;border-left:3px solid var(--accent);background:var(--surface-2);border-radius:8px;font-weight:700}
.tm-share{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 6px}
.tm-share a,.tm-share button{appearance:none;font:inherit;font-family:"Oswald",sans-serif;font-size:12px;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--accent);color:var(--accent);background:transparent;border-radius:999px;padding:7px 14px;text-decoration:none;cursor:pointer}
.tm-share a:hover,.tm-share button:hover{background:var(--accent);color:#fff}
.tm-more{margin:26px 0 0;padding:0;list-style:none}.tm-more li{margin:0 0 8px}.tm-more a{color:var(--fg);text-decoration:none;border-bottom:1px dotted var(--accent)}
.tm-back{display:block;font-family:"Oswald",sans-serif;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);text-decoration:none}
.tm-art h1{font-size:30px;line-height:1.15;margin:10px 0 8px}.tm-art p{font-size:16px;line-height:1.6;margin:0 0 14px}
.tm-by{color:var(--muted);font-size:13px;margin:0 0 18px}.tm-card{width:100%;height:auto;border-radius:12px;margin:0 0 16px}


/* Макет: вертикальная лента табло — крупное время слева, карточки матчей/заметок как плитки на поле стадиона под прожекторами; палитра — один из трёх вариантов настроения (янтарь/лёд/трава), переключается кнопками. */

/* --- Палитра «Лёд», по умолчанию (выбор Артёма 27.10) --- */
:root, :root[data-palette="ice"]{
  --bg:#eef5fb; --surface:#ffffff; --surface-2:#e3eef8;
  --fg:#0f1b2b; --muted:#5b7086; --line:#cfe0ee;
  --accent:#1f8fae; --live:#2f8f54;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]), :root[data-palette="ice"]:not([data-theme="light"]){
    --bg:#0b1220; --surface:#121b2e; --surface-2:#182540;
    --fg:#eaf2fb; --muted:#8fa3bf; --line:#223455;
    --accent:#4fc3e0; --live:#5fb379;
    color-scheme:dark;
  }
}
:root[data-theme="dark"], :root[data-palette="ice"][data-theme="dark"]{
  --bg:#0b1220; --surface:#121b2e; --surface-2:#182540;
  --fg:#eaf2fb; --muted:#8fa3bf; --line:#223455;
  --accent:#4fc3e0; --live:#5fb379;
  color-scheme:dark;
}

/* --- Палитра «Прожектор» (янтарь) --- */
:root[data-palette="amber"]{
  --bg:#f5f1e8; --surface:#ffffff; --surface-2:#eee7d6;
  --fg:#1b1710; --muted:#6b6355; --line:#e1d8c3;
  --accent:#b9711a; --live:#2f8f54;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root[data-palette="amber"]:not([data-theme="light"]){
    --bg:#12100d; --surface:#1d1a15; --surface-2:#262117;
    --fg:#f3ede1; --muted:#9a9184; --line:#352f24;
    --accent:#e2a23b; --live:#5fb379;
    color-scheme:dark;
  }
}
:root[data-palette="amber"][data-theme="dark"]{
  --bg:#12100d; --surface:#1d1a15; --surface-2:#262117;
  --fg:#f3ede1; --muted:#9a9184; --line:#352f24;
  --accent:#e2a23b; --live:#5fb379;
  color-scheme:dark;
}

/* --- Палитра «Трава» --- */
:root[data-palette="grass"]{
  --bg:#f1f5ec; --surface:#ffffff; --surface-2:#e6eddc;
  --fg:#141f17; --muted:#5c6b55; --line:#d6e0c9;
  --accent:#3f8a2a; --live:#b9711a;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root[data-palette="grass"]:not([data-theme="light"]){
    --bg:#0d1410; --surface:#141f17; --surface-2:#1b2a20;
    --fg:#eef3ea; --muted:#8fa191; --line:#27392c;
    --accent:#6cc24a; --live:#d9a441;
    color-scheme:dark;
  }
}
:root[data-palette="grass"][data-theme="dark"]{
  --bg:#0d1410; --surface:#141f17; --surface-2:#1b2a20;
  --fg:#eef3ea; --muted:#8fa191; --line:#27392c;
  --accent:#6cc24a; --live:#d9a441;
  color-scheme:dark;
}

*{box-sizing:border-box}
body{
  background:var(--bg); color:var(--fg);
  font-family:"PT Sans", "Helvetica Neue", Arial, sans-serif;
  padding-left:max(16px, env(safe-area-inset-left,0px));
  padding-right:max(16px, env(safe-area-inset-right,0px));
  transition:background .2s, color .2s;
}
*{transition:background-color .2s, border-color .2s, color .2s}
.wrap{max-width:660px; margin:0 auto; padding-block:28px 60px}
h1,h2,h3{font-family:"Oswald","Arial Narrow",sans-serif; text-transform:uppercase; text-wrap:balance; margin:0}
.eyebrow{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  font-family:"Oswald",sans-serif; font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--accent); margin:0 0 10px;
}
.dot{width:7px;height:7px;border-radius:50%;background:var(--live); box-shadow:0 0 0 3px color-mix(in srgb, var(--live) 25%, transparent); flex:none}
.hero h1{font-size:clamp(44px,13vw,64px); font-weight:700; letter-spacing:.01em; line-height:.92}
.tagline{font-size:17px; color:var(--muted); max-width:34em; margin:14px 0 0; line-height:1.55}

.palette-switch{display:flex; gap:7px; margin-top:16px; flex-wrap:wrap}
.pal-btn{
  display:inline-flex; align-items:center; gap:7px; font-family:"Oswald",sans-serif; font-size:11.5px;
  letter-spacing:.06em; text-transform:uppercase; padding:7px 12px; border-radius:999px;
  border:1px solid var(--line); background:var(--surface); color:var(--muted); cursor:pointer; font-weight:500;
}
.pal-btn .sw{width:11px; height:11px; border-radius:50%; flex:none; border:1px solid color-mix(in srgb, currentColor 30%, transparent)}
.pal-btn[aria-pressed="true"]{color:var(--fg); border-color:var(--accent); background:var(--surface-2)}

section{margin-top:40px}
.section-head{display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:14px; flex-wrap:wrap}
.section-head h2{font-size:22px; color:var(--fg)}
.section-head .meta{font-size:12.5px; color:var(--muted)}

.about{font-size:14.5px; line-height:1.6; color:var(--fg); max-width:38em; text-align:justify; text-align-last:left; hyphens:auto}
.about b{color:var(--accent)}

.matches{display:flex; flex-direction:column; gap:10px}
.match{
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  padding:14px 16px; display:grid; grid-template-columns:64px 1fr; gap:14px; align-items:center;
}
.match .when{font-family:"Oswald",sans-serif; text-align:center; line-height:1.05}
.match .when .day{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.match .when .time{font-size:22px; font-weight:600; font-variant-numeric:tabular-nums; color:var(--accent)}
.match .body{min-width:0}
.teams{font-size:17px; font-weight:700; margin:0 0 3px}
.league{font-size:12.5px; color:var(--muted); margin:0 0 9px}
.venues{display:flex; gap:6px; flex-wrap:wrap}
.chip{
  display:inline-flex; align-items:center; font-size:11.5px; padding:3px 9px;
  border-radius:999px; background:transparent; border:1px solid var(--line); color:var(--muted);
}
.note{font-size:12.5px; color:var(--muted); margin-top:16px; line-height:1.55}

html{scroll-behavior:smooth}
.cal-layout{display:flex; gap:20px; align-items:flex-start; flex-wrap:wrap}
.cal-nav{flex:1 1 200px; display:flex; flex-direction:column; gap:12px}
@media (min-width:640px){
  .cal-layout{flex-wrap:nowrap}
  .cal-nav{position:sticky; top:14px; max-width:264px}
}
.cal-nav-hero{display:block; background:var(--surface-2); border:1px solid var(--line); border-radius:14px; padding:12px 14px; text-decoration:none; color:inherit}
.cal-nav-label{display:block; font-family:"Oswald",sans-serif; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); margin-bottom:6px}
.cal-nav-date{display:block; font-family:"Oswald",sans-serif; font-size:12px; color:var(--muted)}
.cal-nav-teams{display:block; font-size:15px; font-weight:700; color:var(--fg); margin-top:2px; line-height:1.25}
.cal-nav-dates{display:flex; flex-wrap:wrap; gap:6px}
.cal-nav-dates a{
  font-family:"Oswald",sans-serif; font-size:11.5px; letter-spacing:.03em; padding:6px 10px;
  border-radius:999px; border:1px solid var(--line); background:var(--surface); color:var(--muted); text-decoration:none;
}
.cal-nav-dates a:hover{color:var(--fg); border-color:var(--accent); background:var(--surface-2)}
.cal-box{flex:3 1 320px; min-width:0; background:var(--surface); border:1px solid var(--line); border-radius:14px; overflow:hidden}
.cal-day{padding:9px 16px; font-size:11.5px; color:var(--muted); background:var(--surface-2); font-family:"Oswald",sans-serif; letter-spacing:.06em; text-transform:uppercase; scroll-margin-top:14px}
.cal-row{display:flex; align-items:center; gap:12px; padding:11px 16px; border-top:1px solid var(--line); font-size:14px}
.cal-time{width:46px; font-family:"Oswald",sans-serif; font-variant-numeric:tabular-nums; color:var(--accent); font-weight:600; flex:none}
.cal-teams{flex:1; min-width:0; font-weight:700}
.cal-teams>a{color:inherit; text-decoration:none; border-bottom:1px dotted var(--accent)}
.cal-teams>a:hover{color:var(--accent)}
.cal-league{font-size:11px; color:var(--muted); font-weight:400}
.cal-hook{font-size:11.5px; color:var(--fg); font-weight:400; font-style:italic; margin-top:2px}
.cal-watch{font-size:10.5px; padding:4px 9px; border-radius:999px; background:var(--surface-2); color:var(--muted); font-weight:700; flex:none; font-family:"Oswald",sans-serif; letter-spacing:.03em; text-transform:uppercase; text-decoration:none; white-space:nowrap; border:1px solid transparent}
.cal-watch.live{background:var(--live); color:#fff}
.cal-watch.onreq{background:var(--surface-2); color:var(--live); border:1px solid var(--live)}
button.cal-watch{cursor:pointer; font:inherit; appearance:none}
button.cal-watch.info{border:1px dashed var(--line)}
button.cal-watch.info[aria-expanded="true"]{color:var(--fg); border-color:var(--accent)}
.cal-row{flex-wrap:wrap}
.watch-popover{flex:1 1 100%; font-size:12px; color:var(--muted); line-height:1.5; margin-top:2px; padding-top:8px; border-top:1px dashed var(--line)}
.watch-popover a{color:var(--accent)}

.notes{display:flex; flex-direction:column; gap:10px}
.note-card{
  background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:16px;
  cursor:pointer; position:relative; scroll-margin-top:14px;
}
.note-card h3{font-family:"PT Sans",sans-serif; text-transform:none; font-size:16.5px; font-weight:700; margin:0 0 6px; letter-spacing:0}
.note-card p{font-size:13.5px; color:var(--fg); line-height:1.55; margin:0 0 8px; text-align:justify; text-align-last:left; hyphens:auto}
.note-card p:not(:first-of-type){display:none}
.note-card p:first-of-type{
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  text-align:left; text-align-last:auto; hyphens:none;
}
.note-card.expanded p:not(:first-of-type){display:block}
.note-card.expanded p:first-of-type{display:block; -webkit-line-clamp:unset; line-clamp:unset; overflow:visible; text-align:justify; text-align-last:left; hyphens:auto}
.note-card::after{
  content:"развернуть ↓"; display:block; margin-top:4px; font-family:"Oswald",sans-serif;
  font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--accent);
}
.note-card.expanded::after{content:"свернуть ↑"}
.note-head{display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:7px}
.note-tag{display:inline-block; font-family:"Oswald",sans-serif; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--accent)}
.note-picto{width:13px; height:13px; display:inline-block; vertical-align:-1px; margin-right:5px; fill:currentColor}
.note-date{font-family:"Oswald",sans-serif; font-size:11px; color:var(--muted); letter-spacing:.04em; white-space:nowrap}
.note-src{font-size:11px; color:var(--muted)}

.barstrip{
  display:flex; flex-direction:column; gap:10px; background:var(--surface-2); border:1px solid var(--line);
  border-radius:14px; padding:14px 16px;
}
.barstrip .row{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap}
.barstrip .name{font-size:14.5px; font-weight:700}
.barstrip .addr{font-size:12px; color:var(--muted)}
.phone-row{display:flex; align-items:center; gap:8px}
.phone{font-family:"Oswald",sans-serif; font-size:15px; font-variant-numeric:tabular-nums; letter-spacing:.01em}
.copybtn{
  border:1px solid var(--line); background:transparent; color:var(--muted);
  font:inherit; font-size:11.5px; padding:5px 9px; border-radius:8px; cursor:pointer;
}
.copybtn:hover{color:var(--fg); border-color:var(--accent)}
.copybtn.copied{color:var(--live); border-color:var(--live)}

footer{margin-top:48px; padding-top:18px; border-top:1px solid var(--line); font-size:12px; color:var(--muted); line-height:1.6}
footer b{color:var(--fg)}
a{color:var(--accent)}

.pictostrip{overflow:hidden; background:var(--surface-2); border:1px solid var(--line); border-radius:14px; padding:10px 0; margin-bottom:22px}
.picto-track{display:flex; align-items:center; gap:30px; width:max-content; animation:picto-scroll 34s linear infinite}
.picto{width:32px; height:32px; flex:none; color:var(--muted); fill:currentColor}
@keyframes picto-scroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
@media (prefers-reduced-motion: reduce){ .picto-track{animation:none} }

/*tm-home*/
.hm{max-width:1080px;margin:0 auto;padding:16px 16px 60px}
.hm-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.hm-top .tm-logo{margin:0}
.hm-brand{font-family:"Oswald",sans-serif;font-size:28px;letter-spacing:.04em;text-transform:uppercase;font-weight:700;line-height:1;color:var(--fg);text-decoration:none}
.hm-sub{color:var(--muted);font-size:13px;margin-top:3px}
.hm-btns{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.hm-btn{display:inline-block;padding:8px 14px;border-radius:999px;border:1px solid var(--accent);color:var(--accent);text-decoration:none;font-family:"Oswald",sans-serif;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.hm-btn.pri{background:var(--accent);color:#fff}
.hm h2.hm-h{font-size:18px;margin:26px 0 12px}
.hm-grid{display:grid;gap:14px;align-items:start}
@media(min-width:900px){.hm-grid{grid-template-columns:2fr 1fr}}
@media(min-width:900px){.hm-side .hc{display:grid;grid-template-columns:42% 1fr}.hm-side .hc img{height:100%;aspect-ratio:auto;object-fit:cover;object-position:88% 50%}.hm-side .hc .hb{padding:10px 12px}.hm-side .hc h3{font-size:15px;-webkit-line-clamp:4}.hm-side .hc .rub{font-size:10px}}
.hc{display:block;background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;text-decoration:none;color:var(--fg)}
.hc img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;background:var(--surface-2)}
.hc .hb{padding:12px 14px 14px}
.hc .rub{font-family:"Oswald",sans-serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.hc h3{font-family:"PT Sans",sans-serif;text-transform:none;font-size:17px;line-height:1.25;margin:4px 0 6px;font-weight:700;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hc.big h3{font-size:26px;line-height:1.2;-webkit-line-clamp:4}
.hc p{margin:0 0 6px;font-size:14px;line-height:1.45;color:var(--muted)}
.hc .meta{font-size:12px;color:var(--muted)}
.hc:hover{border-color:var(--accent)}
.hm-side{display:grid;gap:14px;align-content:start}
.hm-feed{display:grid;gap:14px}
@media(min-width:700px){.hm-feed{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.hm-feed{grid-template-columns:1fr 1fr 1fr}}
.hm-today{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:6px 16px 10px}
.hm-today .d{font-family:"Oswald",sans-serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:10px 0 2px}
.hm-today .r{display:flex;gap:12px;padding:8px 0;border-top:1px solid var(--line);align-items:baseline}
.hm-today .d + .r{border-top:0}
.hm-today .t{font-family:"Oswald",sans-serif;color:var(--accent);width:50px;flex:none;font-weight:600}
.hm-today .l{font-size:11px;color:var(--muted)}
.hm-all{display:inline-block;margin-top:10px;color:var(--accent);font-family:"Oswald",sans-serif;font-size:12px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none}
.hm-more{display:block;margin:20px auto 0;appearance:none;border:1px solid var(--accent);background:transparent;color:var(--accent);border-radius:999px;padding:9px 22px;font-family:"Oswald",sans-serif;font-size:13px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.hm-off{display:none!important}
.hm-pal{margin-top:8px}.hm-pal button{appearance:none;border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:999px;padding:4px 10px;margin-right:6px;font-size:12px;cursor:pointer}
.hm-pal button[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
.hm footer{margin-top:40px}
