:root{
  --bg:#0e0e10; --card:#1a1a1f; --card-2:#26262c; --line:#2b2b32;
  --text:#f2f2f4; --muted:#9ea0a8; --red:#e33b3b; --green:#3ecf7a;
  --green-bg:rgba(62,207,122,.14); --red-bg:rgba(227,59,59,.16);
  --radius:16px;
  --font-display:'RC Black Italic',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
@font-face{
  font-family:'RC Black Italic';font-style:italic;font-weight:900;font-display:swap;
  src:url(../fonts/roboto-condensed-black-italic-cyrillic.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:'RC Black Italic';font-style:italic;font-weight:900;font-display:swap;
  src:url(../fonts/roboto-condensed-black-italic-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:16px;line-height:1.45}
body{padding:calc(14px + env(safe-area-inset-top)) 14px calc(28px + env(safe-area-inset-bottom));max-width:560px;margin:0 auto}
button{font-family:inherit;border:0;cursor:pointer}

header{margin:8px 2px 18px}
h1{margin:0;font-size:28px;font-weight:900;font-style:italic;font-family:var(--font-display);letter-spacing:0}
.hrow{display:flex;justify-content:space-between;align-items:center;gap:10px}
.syncdot{flex:0 0 auto;width:34px;height:34px;border-radius:50%;
  background:var(--card);color:var(--muted);font-size:16px;line-height:1;
  display:flex;align-items:center;justify-content:center;transition:color .2s}
.syncdot:active{background:var(--card-2)}
.syncdot[data-s="synced"]{color:var(--green)}
.syncdot[data-s="offline"]{color:var(--red)}
.syncdot[data-s="syncing"]{color:var(--muted)}
.syncdot[data-s="conflict"]{color:var(--red);background:var(--red-bg)}

.conflict-bar{position:sticky;top:env(safe-area-inset-top);z-index:50;
  margin:calc(-1 * (14px + env(safe-area-inset-top))) -14px 14px;
  padding:calc(12px + env(safe-area-inset-top)) 14px 12px;
  background:var(--red-bg);border-bottom:1px solid var(--red)}
.conflict-bar .cb-text{font-size:13.5px;line-height:1.45;color:var(--muted)}
.conflict-bar .cb-text b{color:var(--text)}
.conflict-bar .cb-cmp{margin-top:10px;font-size:12.5px;color:var(--muted);
  background:rgba(0,0,0,.2);border-radius:10px;padding:8px 10px}
.conflict-bar .cb-row{display:flex;gap:8px;line-height:1.5}
.conflict-bar .cb-row .cb-lbl{flex:0 0 50px;color:var(--text);font-weight:700}
.conflict-bar .cb-hint{margin-top:6px;color:var(--text);font-weight:600}
.conflict-bar .cb-actions{display:flex;gap:8px;margin-top:10px}
.conflict-bar .cb-btn{flex:1;height:42px;border-radius:12px;font-size:14px;font-weight:700}
.conflict-bar .cb-mine{background:var(--red);color:#fff}
.conflict-bar .cb-server{background:var(--card-2);color:var(--text)}
.conflict-bar .cb-btn:active{opacity:.85}

.extra{background:var(--card);border-radius:var(--radius);padding:0 16px;margin-bottom:12px}
.extra summary{list-style:none;cursor:pointer;padding:14px 0;display:flex;
  justify-content:space-between;align-items:center;font-size:14px;font-weight:700}
.extra summary::-webkit-details-marker{display:none}
.extra summary .arr{color:var(--muted);font-size:13px;transition:transform .2s}
.extra[open] summary .arr{transform:rotate(90deg)}
.extra-body{padding:2px 0 16px}
.sub{padding:14px 0;border-top:1px solid var(--line)}
.sub-title{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.12em;margin-bottom:10px}

.goal-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.goal-top .label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.12em}
.goal-top .nums{font-size:14px;color:var(--muted)}
.goal-top .nums b{color:var(--text);font-size:20px}
.grip{position:relative;height:22px;border-radius:11px;background:#09090b;overflow:hidden}
.grip .fill{position:absolute;inset:0;width:0%;border-radius:11px;
  background:repeating-linear-gradient(90deg,var(--red) 0 14px,#1a1a1d 14px 22px);
  transition:width .5s ease}
.grip .mark{position:absolute;top:0;bottom:0;width:2px;background:var(--muted);opacity:.6}
.goal-note{margin-top:9px;font-size:13px;color:var(--muted)}
.goal-note b{color:var(--text)}

.history svg{display:block;width:100%;height:auto}
.history .hstats{font-size:12.5px;color:var(--muted);margin-top:8px;line-height:1.5}
.history .hstats b{color:var(--text)}
.history .legend{display:flex;gap:14px;font-size:12px;color:var(--muted);margin-top:6px}
.history .legend i{display:inline-block;width:14px;height:3px;border-radius:2px;vertical-align:middle;margin-right:5px}

.weekbar{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.weekbar button{flex:0 0 48px;height:48px;border-radius:14px;
  background:var(--card);color:var(--text);font-size:22px}
.weekbar button:active{background:var(--card-2)}
.weekinfo{flex:1;text-align:center}
.weekinfo .wnum{font-size:20px;font-weight:900;font-style:italic;font-family:var(--font-display)}

.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:14px;
  background:var(--card);border-radius:16px;padding:4px}
.tab{position:relative;padding:11px 4px 9px;border-radius:12px;
  background:transparent;color:var(--muted);text-align:center}
.tab .d{display:block;font-size:16px;font-weight:900;font-style:italic;font-family:var(--font-display);color:var(--muted)}
.tab .t{display:block;font-size:10.5px;margin-top:1px}
.tab.active{background:var(--card-2)}
.tab.active .d{color:var(--text)}
.tab.active .t{color:var(--red)}
.tab .dot{position:absolute;top:7px;right:9px;width:7px;height:7px;border-radius:50%;background:var(--green);display:none}
.tab.done .dot{display:block}

.ex{background:var(--card);border-radius:var(--radius);padding:14px 14px 13px;margin-bottom:10px}
.ex-name{width:100%;font-weight:900;font-style:italic;font-family:var(--font-display);font-size:20px;display:flex;align-items:center;gap:7px;
  padding:0;background:none;color:var(--text);text-align:left;min-height:34px}
.ex-name .chev{color:var(--muted);font-size:14px;transition:transform .2s;flex:0 0 auto}
.ex.open .ex-name .chev{transform:rotate(90deg)}
.headctl{display:flex;align-items:center;gap:5px;margin-top:6px}
.wshift{position:relative;width:30px;height:30px;border-radius:9px;background:var(--card-2);color:var(--text);font-size:15px}
.wshift:active{background:var(--line)}
.wlabel{height:30px;padding:0 6px;background:none;color:var(--muted);
  font-size:14.5px;font-weight:700;white-space:nowrap}
.edit-btn{position:relative;width:30px;height:30px;border-radius:9px;background:var(--card-2);color:var(--muted);font-size:13px;margin-left:auto}
/* увеличенная невидимая зона нажатия поверх маленьких кнопок — палец промахивается реже,
   а видимый размер кнопок и раскладка строки не меняются */
.wshift::after,.edit-btn::after{content:'';position:absolute;inset:-6px -2px}
.ex-target{font-size:12.5px;color:var(--muted);margin-top:10px}
.ex-target .rest{color:var(--green)}

.detail{margin-top:12px}
.media{position:relative;margin-bottom:10px}
.media img,.media video{display:block;width:100%;border-radius:12px;background:#fff}
.media video{background:#000}
.mtoggle{position:absolute;right:10px;bottom:10px;height:38px;padding:0 14px;border-radius:19px;
  background:rgba(0,0,0,.65);color:#fff;font-size:13px;font-weight:700}
.tech{margin:0 0 10px;font-size:13.5px;color:var(--muted);line-height:1.55}
.ytlink{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 14px;
  border-radius:12px;background:var(--card-2);color:var(--text);
  font-size:14px;font-weight:700;text-decoration:none}
.ytlink:active{background:var(--line)}
.ytlink .yt-ic{flex:0 0 auto}

.sets{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.set{display:flex;align-items:center;border-radius:12px;overflow:hidden;background:var(--card-2)}
.set input{width:54px;height:46px;border:0;background:transparent;color:var(--text);
  font-size:18px;font-weight:700;text-align:center;font-family:inherit}
.set input:focus{outline:2px solid var(--red);outline-offset:-2px;border-radius:10px}
.set .chk{width:46px;height:46px;background:transparent;color:var(--muted);font-size:18px}
.set.done{background:var(--green-bg)}
.set.done .chk,.set.done input{color:var(--green)}

.editor{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
.editor textarea{width:100%;min-height:180px;border-radius:12px;border:0;
  background:#0b0b0d;color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:14px;padding:10px;line-height:1.6;resize:vertical}
.editor textarea:focus{outline:2px solid var(--red);outline-offset:-1px}
.editor .ehint{font-size:12px;color:var(--muted);margin:6px 2px 8px;line-height:1.5}
.editor .ebtns{display:flex;gap:8px}
.editor .ebtns button{flex:1;padding:12px;border-radius:12px;
  background:var(--card-2);color:var(--text);font-size:14px}
.editor .ebtns .save{background:var(--red-bg);color:var(--red);font-weight:700}
.editor .err{color:#f0b429;font-size:12.5px;margin-top:6px;display:none}

.day-summary{margin:4px 2px 14px;font-size:14px;color:var(--muted)}
.day-summary b{color:var(--text)}
.restday{background:var(--card);border-radius:var(--radius);
  padding:18px;text-align:center;color:var(--muted);font-size:14px;margin-bottom:10px}
.footer-actions{display:flex;gap:8px}
.footer-actions button{flex:1;padding:13px;border-radius:14px;
  background:var(--card-2);color:var(--muted);font-size:14px}
.footer-actions button:active{background:var(--line)}
.hint{margin-top:14px;font-size:12px;color:#6b6d75;text-align:center;line-height:1.5}
@media (prefers-reduced-motion: reduce){ .grip .fill{transition:none} }
