FocusScore \u2014 v12.9 (Smart Habits)<\/title><\/p>\n<style> :root{ --bg:#f6f7fb; --card:#fff; --muted:#6b7280; --text:#0f172a; --accent:#2563eb; --accent2:#0ea5e9; --ok:#10b981; --warn:#f59e0b; --border:#e5e7eb; --danger:#ef4444; } *{box-sizing:border-box} html,body{height:100%} body{margin:0;font:14px\/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)} .wrap{max-width:1240px;margin:0 auto;padding:20px} header{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap} .title{font-weight:700;font-size:22px;letter-spacing:.2px} .cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px} .card{background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:0 1px 2px rgba(0,0,0,.03)} .card h4{margin:12px 12px 0 12px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em} .card .val{padding:6px 12px 14px 12px;font-size:28px;font-weight:700} .section{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px} .muted{color:var(--muted)} .btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);background:transparent;border-radius:10px;padding:8px 12px;cursor:pointer;color:inherit; font-family: inherit; font-size: inherit;} .btn.primary{background:var(--accent);border-color:var(--accent);color:#fff} .btn.small{padding:6px 10px;font-size:12px} .btn.danger{border-color:var(--danger); color:var(--danger)} .btn[disabled]{opacity:.5;cursor:not-allowed} .btnbar{display:flex;gap:8px;flex-wrap:wrap} .input, select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:transparent;color:inherit; font-family: inherit; font-size: inherit;} .hr{height:1px;background:var(--border);margin:12px 0} input[type=range]{width:100%} input[type=number]{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:transparent;color:inherit} canvas{width:100%;height:280px;border:1px solid var(--border);border-radius:10px;background:transparent} #datePicker{border:1px solid var(--border); background:transparent; border-radius:10px; padding:5px 8px; color:inherit; font-family:inherit; font-size:12px;} #syncStatus{position:fixed;bottom:0;left:0;width:100%;padding:8px;text-align:center;font-size:12px;color:#fff;z-index:2000;transition:transform .3s ease;transform:translateY(100%)} #syncStatus.visible{transform:translateY(0)} #syncStatus.syncing{background-color:var(--warn)} #syncStatus.synced{background-color:var(--ok)} #syncStatus.error{background-color:var(--danger)}  .grid{display:grid;grid-template-columns:2fr 1fr;gap:12px;margin-top:12px} .grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px} .calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:8px} .cal-head{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:6px;color:var(--muted);font-size:12px; text-align:center;} .cal-cell{padding:10px 8px 20px;border:1px solid var(--border);border-radius:10px;background:#fff;cursor:pointer;position:relative;min-height:64px;display:flex;align-items:flex-start;justify-content:flex-start} .cal-cell:hover{box-shadow:0 1px 2px rgba(0,0,0,.03)} .cal-cell.dim{opacity:.5} .cal-cell.active{outline:2px solid var(--accent)} .cal-day{font-weight:600;font-size:14px} .cal-chip{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);font-size:11px;border:1px solid var(--border);background:#fff;border-radius:999px;padding:2px 8px} .cal-bar{position:absolute;bottom:0;left:0;height:4px;background:var(--accent2);border-bottom-left-radius:10px;border-bottom-right-radius:10px} #rows .row{display:grid;grid-template-columns:1fr 4fr 90px;gap:10px;align-items:center;margin:10px 0} .warn{background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.35)} .legend{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px;font-size:12px;color:var(--muted)} .habits-toolbar{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-bottom:8px;flex-wrap:wrap} .habits-toolbar .search{flex:1;min-width:200px} .habits{display:grid;grid-template-columns:1fr 1fr;gap:10px} .habit{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;padding:10px;border:1px solid var(--border);border-radius:12px;background:linear-gradient(180deg,#fff, #fafcff)} .habit .title{font-weight:600;margin-bottom:2px} .habit .meta{font-size:12px;color:var(--muted); display: flex; flex-wrap: wrap; gap: 6px; align-items: center;} .habit .desc{font-size:12px;color:var(--muted); margin-top:4px;} .lvl-badge{font-size:12px;border:1px solid var(--border);padding:2px 8px;border-radius:999px;background:#fff} .hbar{height:8px;border-radius:999px;overflow:hidden;border:1px solid var(--border);background:rgba(2,132,199,.12)} .hbar>div{height:100%;background:var(--accent2)} .hab-group{margin-top:8px} .hab-group>summary, details.qa-group > summary {font-weight:600; cursor: pointer;} .hab-progress{display:flex;align-items:center;gap:10px;margin:8px 0 12px} .hab-progress .bar{flex:1;height:12px;border:1px solid var(--border);border-radius:999px;overflow:hidden;background:rgba(16,185,129,.12)} .hab-progress .bar>div{height:100%;background:linear-gradient(90deg,var(--ok),var(--accent2))} .hab-progress .stat{width:84px;text-align:right;font-weight:700} .modal{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;padding:20px; z-index: 1000;} .modal.open{display:flex} .modal-card{background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:16px;max-width:980px;width:100%;max-height:90vh;overflow:auto;padding:16px} .kbar{display:grid;grid-template-columns:32px 1fr 90px 90px 110px 90px;gap:8px;align-items:center; margin-bottom: 6px;} @media (max-width: 1024px){ .cards{grid-template-columns:repeat(2,1fr)} .grid{grid-template-columns:1fr} .grid2{grid-template-columns:1fr} #rows .row{grid-template-columns:1fr 1fr 80px} canvas{height:240px} } @media (max-width: 640px){ .wrap{padding:14px; margin-bottom: 30px;} .title{font-size:18px} .cards{grid-template-columns:1fr} .btn.small{padding:8px 10px} #rows .row{grid-template-columns:1fr;gap:8px} #rows .row input[type=range]{height:34px} input[type=number]{max-width:120px} .habits{grid-template-columns:1fr} .calendar{gap:6px} .cal-cell{min-height:56px} canvas{height:200px} }<\/style>\n<p><\/head><body> <\/p>\n<div id=\"syncStatus\"><\/div>\n<p> <\/p>\n<div class=\"wrap\"> <\/p>\n<header> <\/p>\n<div class=\"title\">FocusScore \u2014 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435\u043c<\/div>\n<p> <\/p>\n<div class=\"btnbar\"> <button id=\"openHabitStats\" class=\"btn\">\u0421\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a<\/button> <button id=\"openSettings\" class=\"btn\">\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438<\/button> <button id=\"exportCSV\" class=\"btn\">\u042d\u043a\u0441\u043f\u043e\u0440\u0442 CSV<\/button> <button id=\"exportJSON\" class=\"btn\">\u042d\u043a\u0441\u043f\u043e\u0440\u0442 JSON<\/button> <label class=\"btn\" for=\"importFile\">\u0418\u043c\u043f\u043e\u0440\u0442 JSON<\/label> <input id=\"importFile\" type=\"file\" accept=\"application\/json\" style=\"display:none\" \/> <\/div>\n<p> <\/header>\n<p> <\/p>\n<div class=\"cards\"> <\/p>\n<div class=\"card\">\n<h4>\u0418\u0442\u043e\u0433 \u0437\u0430 \u0441\u0435\u0433\u043e\u0434\u043d\u044f<\/h4>\n<div class=\"val\" id=\"kpiToday\">\u2014<\/div>\n<\/div>\n<p> <\/p>\n<div class=\"card\">\n<h4>\u0421\u0440\u0435\u0434\u043d\u0435\u0435 \u0437\u0430 7 \u0434\u043d\u0435\u0439<\/h4>\n<div class=\"val\" id=\"kpiWeek\">\u2014<\/div>\n<\/div>\n<p> <\/p>\n<div class=\"card\">\n<h4>\u0421\u0440\u0435\u0434\u043d\u0435\u0435 \u0437\u0430 \u043c\u0435\u0441\u044f\u0446<\/h4>\n<div class=\"val\" id=\"kpiMonth\">\u2014<\/div>\n<\/div>\n<p> <\/p>\n<div class=\"card\">\n<h4>\u0414\u0435\u0444\u0438\u0446\u0438\u0442\u043e\u0432 \u0441\u0435\u0433\u043e\u0434\u043d\u044f<\/h4>\n<div class=\"val\" id=\"kpiDef\">\u2014<\/div>\n<\/div>\n<p> <\/div>\n<p> <\/p>\n<div class=\"section\" style=\"margin-top:12px\"> <\/p>\n<div class=\"btnbar\" style=\"align-items:center\"> <button class=\"btn small\" id=\"prevDay\">\u25c0<\/button> <input type=\"date\" id=\"datePicker\" \/> <button class=\"btn small\" id=\"nextDay\">\u25b6<\/button> <button class=\"btn small\" id=\"todayBtn\">\u0421\u0435\u0433\u043e\u0434\u043d\u044f<\/button> <span class=\"muted\" id=\"todayLabel\"><\/span> <\/div>\n<p> <\/p>\n<div id=\"miniCalendar\"><\/div>\n<p> <\/div>\n<p> <\/p>\n<div class=\"grid\"> <\/p>\n<section class=\"section\" id=\"input\"> <\/p>\n<h3 style=\"margin:0 0 8px 0\">\u0412\u0432\u043e\u0434 \u0437\u0430 \u0434\u0435\u043d\u044c (\u0430\u0432\u0442\u043e\u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435)<\/h3>\n<p> <\/p>\n<div class=\"muted\" style=\"margin-bottom:8px\">\u0428\u043a\u0430\u043b\u0430 0\u2013100. \u0412\u0441\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043f\u0430\u0434\u0430\u044e\u0442 \u0432 \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0443 \u0438 \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0438.<\/div>\n<p> <\/p>\n<div id=\"rows\"><\/div>\n<p> <\/section>\n<p> <\/p>\n<aside class=\"section\"> <\/p>\n<h3 style=\"margin:0 0 8px 0\">\u0427\u0442\u043e \u043f\u043e\u0434\u0442\u044f\u043d\u0443\u0442\u044c \u0441\u0435\u0433\u043e\u0434\u043d\u044f<\/h3>\n<p> <\/p>\n<div id=\"deficitsBox\" class=\"list\">\n<div class=\"muted\">\u041d\u0435\u0442 \u0434\u0430\u043d\u043d\u044b\u0445<\/div>\n<\/div>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4 style=\"margin:0 0 8px 0\">\u0411\u044b\u0441\u0442\u0440\u044b\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f (\u043a\u0430\u0436\u0434\u043e\u0435 \u2014 1 \u0440\u0430\u0437\/\u0434\u0435\u043d\u044c)<\/h4>\n<p> <\/p>\n<div id=\"quickBox\" class=\"list\"><\/div>\n<p> <\/aside>\n<p> <\/div>\n<p> <\/p>\n<section class=\"section\" id=\"habits\" style=\"margin-top:12px\"> <\/p>\n<div class=\"habits-toolbar\"> <\/p>\n<div class=\"muted\">\u0422\u0440\u0435\u043a\u0435\u0440 \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a<\/div>\n<p> <input id=\"habSearch\" class=\"input search\" placeholder=\"\u041f\u043e\u0438\u0441\u043a \u043f\u043e \u043f\u0440\u0438\u0432\u044b\u0447\u043a\u0430\u043c\" \/> <\/p>\n<div class=\"btnbar\"> <button class=\"btn small\" id=\"habCollapse\">\u0421\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0432\u0441\u0435<\/button> <button class=\"btn small\" id=\"habExpand\">\u0420\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0432\u0441\u0435<\/button> <\/div>\n<p> <\/div>\n<p> <\/p>\n<div class=\"hab-progress\"> <\/p>\n<div class=\"bar\">\n<div id=\"habitsProgressBar\" style=\"width:0%\"><\/div>\n<\/div>\n<p> <\/p>\n<div class=\"stat\" id=\"habitsProgressStat\">0\/0<\/div>\n<p> <\/div>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83e\udde0 \u0423\u043c \u0438 \u043c\u044b\u0448\u043b\u0435\u043d\u0438\u0435<\/summary>\n<div class=\"habits\" id=\"group-mind\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83d\udcac \u041e\u0431\u0449\u0435\u043d\u0438\u0435 \u0438 \u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u044f<\/summary>\n<div class=\"habits\" id=\"group-comm\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83c\udfaf \u0420\u0430\u0431\u043e\u0442\u0430 \u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c<\/summary>\n<div class=\"habits\" id=\"group-work\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83d\udcaa \u0417\u0434\u043e\u0440\u043e\u0432\u044c\u0435 \u0438 \u0442\u0435\u043b\u043e<\/summary>\n<div class=\"habits\" id=\"group-body\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83e\uddd8 \u042d\u043c\u043e\u0446\u0438\u0438 \u0438 \u043f\u0441\u0438\u0445\u043e\u043b\u043e\u0433\u0438\u044f<\/summary>\n<div class=\"habits\" id=\"group-psy\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83c\udf00 \u0422\u0432\u043e\u0440\u0447\u0435\u0441\u0442\u0432\u043e \u0438 \u0441\u0432\u043e\u0431\u043e\u0434\u0430<\/summary>\n<div class=\"habits\" id=\"group-crea\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83d\udcc8 \u0421\u0430\u043c\u043e\u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0438 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u0435<\/summary>\n<div class=\"habits\" id=\"group-learn\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83c\udfe0 \u0411\u044b\u0442 \u0438 \u043f\u043e\u0440\u044f\u0434\u043e\u043a<\/summary>\n<div class=\"habits\" id=\"group-home\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83d\udcb5 \u0424\u0438\u043d\u0430\u043d\u0441\u044b \u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u044b<\/summary>\n<div class=\"habits\" id=\"group-fin\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83c\udf0d \u0411\u0430\u043b\u0430\u043d\u0441 \u0438 \u0434\u0443\u0445\u043e\u0432\u043d\u043e\u0441\u0442\u044c<\/summary>\n<div class=\"habits\" id=\"group-spirit\"><\/div>\n<\/details>\n<p> <\/section>\n<p> <\/p>\n<section class=\"section\" style=\"margin-top:12px\"> <\/p>\n<div class=\"periodbar\" style=\"display:flex;gap:6px;align-items:center;margin:6px 0 12px 0\"> <span class=\"muted\">\u041f\u0435\u0440\u0438\u043e\u0434:<\/span> <button class=\"btn small\" data-period=\"7\">7\u0434<\/button> <button class=\"btn small\" data-period=\"14\">14\u0434<\/button> <button class=\"btn small\" data-period=\"30\">30\u0434<\/button> <button class=\"btn small\" data-period=\"90\">90\u0434<\/button> <button class=\"btn small\" data-period=\"180\">180\u0434<\/button> <span class=\"muted\" id=\"periodHint\"><\/span> <\/div>\n<p> <\/p>\n<div class=\"grid2\"> <\/p>\n<div> <\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">\u041b\u0438\u043d\u0438\u0438 \u043f\u043e \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f\u043c<\/div>\n<p> <canvas id=\"chartMulti\"><\/canvas> <\/p>\n<div class=\"legend\" id=\"lineLegend\"><\/div>\n<p> <\/div>\n<p> <\/p>\n<div> <\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">\u041f\u0430\u0443\u0442\u0438\u043d\u0430: \u0441\u0440\u0435\u0434\u043d\u0438\u0435 \u0437\u0430 \u043f\u0435\u0440\u0438\u043e\u0434<\/div>\n<p> <canvas id=\"radarWeek\"><\/canvas> <\/div>\n<p> <\/div>\n<p> <\/p>\n<div class=\"grid2\" style=\"margin-top:12px\"> <\/p>\n<div> <\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">\u0421\u0440\u0435\u0434\u043d\u0438\u0435 \u0437\u0430 \u043f\u0435\u0440\u0438\u043e\u0434 \u043f\u043e \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f\u043c<\/div>\n<p> <\/p>\n<div id=\"weekBars\"><\/div>\n<p> <\/div>\n<p> <\/p>\n<div> <\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">\u0421\u0440\u0435\u0434\u043d\u0438\u0435 \u0437\u0430 30 \u0434\u043d\u0435\u0439 (\u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c)<\/div>\n<p> <\/p>\n<div id=\"monthBars\"><\/div>\n<p> <\/div>\n<p> <\/div>\n<p> <\/section>\n<p> <\/p>\n<div class=\"muted\" style=\"margin-top:14px; text-align:center;\">\u00a9 2025 FocusScore<\/div>\n<p> <\/div>\n<p> <\/p>\n<div id=\"settingsModal\" class=\"modal\"> <\/p>\n<div class=\"modal-card\"> <\/p>\n<div style=\"display:flex;align-items:center;justify-content:space-between;margin-bottom:8px\"> <\/p>\n<h3 style=\"margin:0\">\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438<\/h3>\n<p> <\/p>\n<div class=\"btnbar\"><button id=\"closeSettings\" class=\"btn\">\u0417\u0430\u043a\u0440\u044b\u0442\u044c<\/button><\/div>\n<p> <\/div>\n<p> <\/p>\n<h4 style=\"margin:8px 0\">\u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438<\/h4>\n<p> <\/p>\n<div id=\"catList\"><\/div>\n<p> <\/p>\n<div class=\"btnbar\" style=\"margin-top:8px\"> <input id=\"newCatName\" class=\"input\" placeholder=\"\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438\" style=\"max-width:240px\" \/> <input id=\"newCatDaily\" class=\"input\" type=\"number\" placeholder=\"\u041c\u0438\u043d\/\u0434\u0435\u043d\u044c (0-100)\" style=\"max-width:160px\" \/> <input id=\"newCatWeekly\" class=\"input\" type=\"number\" placeholder=\"\u041c\u0438\u043d\/\u043d\u0435\u0434 (0-100)\" style=\"max-width:160px\" \/> <button id=\"addCat\" class=\"btn primary\">\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044e<\/button> <\/div>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4 style=\"margin:8px 0\">\u0411\u044b\u0441\u0442\u0440\u044b\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f (\u0444\u043e\u0440\u043c\u0430\u0442: \u00ab\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 (+10)\u00bb)<\/h4>\n<p> <\/p>\n<div id=\"qaEditor\"><\/div>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4 style=\"margin:8px 0\">\u041f\u0440\u0438\u0432\u044b\u0447\u043a\u0438<\/h4>\n<p> <\/p>\n<div id=\"habEditor\"><\/div>\n<p> <\/p>\n<div id=\"addHabitForm\" style=\"display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 8px; margin-top: 8px; border: 1px solid var(--border); border-radius: 12px; padding: 10px;\"> <input id=\"newHabName\" class=\"input\" placeholder=\"\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043d\u043e\u0432\u043e\u0439 \u043f\u0440\u0438\u0432\u044b\u0447\u043a\u0438\" style=\"grid-column: 1 \/ -1;\" \/> <select id=\"newHabGroup\" class=\"input\" style=\"grid-column: 1 \/ span 2;\"><\/select> <select id=\"newHabFrequency\" class=\"input\"><\/select> <textarea id=\"newHabDesc\" class=\"input\" placeholder=\"\u041a\u0440\u0430\u0442\u043a\u043e\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 (\u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e)\" style=\"grid-column: 1 \/ -1; height: 60px;\"><\/textarea> <\/div>\n<p> <\/p>\n<div class=\"btnbar\" style=\"margin-top:8px\"> <button id=\"addHabit\" class=\"btn primary\">\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u0440\u0438\u0432\u044b\u0447\u043a\u0443<\/button> <button id=\"bulkHabits\" class=\"btn\">\u0418\u043c\u043f\u043e\u0440\u0442 \u0441\u043f\u0438\u0441\u043a\u043e\u043c<\/button> <\/div>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<div class=\"muted\">\u0421\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u0440\u0430\u0437\u0443. \u042d\u043a\u0441\u043f\u043e\u0440\u0442\/\u0438\u043c\u043f\u043e\u0440\u0442 \u2014 \u043d\u0430 \u0433\u043b\u0430\u0432\u043d\u043e\u0439.<\/div>\n<p> <\/div>\n<p> <\/div>\n<p>  <\/p>\n<div id=\"habitStatsModal\" class=\"modal\"> <\/p>\n<div class=\"modal-card\"> <\/p>\n<div style=\"display:flex;align-items:center;justify-content:space-between;margin-bottom:8px\"> <\/p>\n<h3 style=\"margin:0\">\u0421\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a<\/h3>\n<p> <\/p>\n<div class=\"btnbar\"><button id=\"closeHabitStats\" class=\"btn\">\u0417\u0430\u043a\u0440\u044b\u0442\u044c<\/button><\/div>\n<p> <\/div>\n<p> <\/p>\n<div id=\"habit-stats-content\"><\/div>\n<p> <\/div>\n<p> <\/div>\n<p><script>\/\/ ====== \u041a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u044b \u0438 \u0441\u0442\u0430\u0440\u0442 ======let focus_score_ajax = {};\/\/ \u042d\u0442\u043e\u0442 \u043a\u043e\u0434 \u043d\u0430\u0434\u0451\u0436\u043d\u043e \u043d\u0430\u0439\u0434\u0451\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0442 WordPress, \u0434\u0430\u0436\u0435 \u0435\u0441\u043b\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0430document.addEventListener('DOMContentLoaded', function() { const dataElement = document.getElementById('focus-score-ajax-data'); if (dataElement && dataElement.textContent.trim().startsWith('{')) { focus_score_ajax = JSON.parse(dataElement.textContent); } init(); \/\/ \u0417\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a DOM \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d});const DEFAULT_CATS=[ {id:'family', name:'\u0421\u0435\u043c\u044c\u044f', dailyMin:50, weeklyMin:60}, {id:'health', name:'\u0417\u0434\u043e\u0440\u043e\u0432\u044c\u0435', dailyMin:50, weeklyMin:60}, {id:'sport', name:'\u0421\u043f\u043e\u0440\u0442', dailyMin:50, weeklyMin:60}, {id:'leisure', name:'\u0414\u043e\u0441\u0443\u0433\/\u043e\u0442\u0434\u044b\u0445', dailyMin:40, weeklyMin:55}, {id:'network', name:'\u041d\u0435\u0442\u0432\u043e\u0440\u043a\u0438\u043d\u0433', dailyMin:50, weeklyMin:60}, {id:'invest', name:'\u0418\u043d\u0432\u0435\u0441\u0442\u0438\u0446\u0438\u0438', dailyMin:50, weeklyMin:60}, {id:'pension', name:'\u041f\u0435\u043d\u0441\u0438\u044f\/\u0431\u0443\u0434\u0443\u0449\u0435\u0435', dailyMin:40, weeklyMin:55},];const DEFAULT_IDEAS={ family:['\u0421\u043e\u0432\u043c\u0435\u0441\u0442\u043d\u044b\u0439 \u0443\u0436\u0438\u043d 30 \u043c\u0438\u043d (+30)','\u0417\u0432\u043e\u043d\u043e\u043a \u0431\u043b\u0438\u0437\u043a\u043e\u043c\u0443 15 \u043c\u0438\u043d (+15)','\u041f\u0440\u043e\u0433\u0443\u043b\u043a\u0430 \u0432\u0434\u0432\u043e\u0451\u043c 20 \u043c\u0438\u043d (+20)'], health:['8 \u0441\u0442\u0430\u043a\u0430\u043d\u043e\u0432 \u0432\u043e\u0434\u044b (+10)','\u0421\u043e\u043d +30 \u043c\u0438\u043d (+20)','\u0414\u044b\u0445\u0430\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0430 10 \u043c\u0438\u043d (+10)'], sport:['\u0420\u0430\u0437\u043c\u0438\u043d\u043a\u0430 15 \u043c\u0438\u043d (+10)','\u0425\u043e\u0434\u044c\u0431\u0430 3\u043a \u0448\u0430\u0433\u043e\u0432 (+15)','\u0414\u043e\u043c\u0430\u0448\u043d\u044f\u044f \u0442\u0440\u0435\u043d\u0438\u0440\u043e\u0432\u043a\u0430 25 \u043c\u0438\u043d (+25)'], leisure:['\u041a\u043d\u0438\u0433\u0430 20 \u043c\u0438\u043d (+15)','\u041c\u0443\u0437\u044b\u043a\u0430\/\u043c\u0435\u0434\u0438\u0442\u0430\u0446\u0438\u044f 10 \u043c\u0438\u043d (+10)','\u0424\u0438\u043b\u044c\u043c\/\u0441\u0435\u0440\u0438\u044f \u0441 \u0441\u0435\u043c\u044c\u0451\u0439 (+20)'], network:['1 \u0437\u0432\u043e\u043d\u043e\u043a\/\u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 (+20)','\u041f\u043e\u0441\u0442 \u0432 \u043f\u0440\u043e\u0444.\u0447\u0430\u0442\u0435 (+10)','\u041a\u043e\u0444\u0435-\u0432\u0441\u0442\u0440\u0435\u0447\u0430 (+25)'], invest:['\u0420\u0435\u0432\u0438\u0437\u0438\u044f \u043f\u043e\u0440\u0442\u0444\u0435\u043b\u044f 15 \u043c\u0438\u043d (+15)','\u0414\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0438\u043d\u0432\u0435\u0441\u0442-\u043f\u043b\u0430\u043d (+20)','\u041e\u0431\u0443\u0447\u0430\u044e\u0449\u0435\u0435 \u0432\u0438\u0434\u0435\u043e 20 \u043c\u0438\u043d (+15)'], pension:['\u041e\u0442\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0435 \u0432 \u0434\u043e\u043b\u0433\u043e\u0441\u0447\u0451\u0442 (+20)','\u0421\u0442\u0430\u0442\u044c\u044f \u043f\u043e \u043f\u0435\u043d\u0441\u0438\u0438 (+10)','\u041f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0446\u0435\u043b\u0435\u0439 (+15)'],};const ENTP_GROUPS={ mind:'\ud83e\udde0 \u0423\u043c \u0438 \u043c\u044b\u0448\u043b\u0435\u043d\u0438\u0435', comm:'\ud83d\udcac \u041e\u0431\u0449\u0435\u043d\u0438\u0435 \u0438 \u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u044f', work:'\ud83c\udfaf \u0420\u0430\u0431\u043e\u0442\u0430 \u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c', body:'\ud83d\udcaa \u0417\u0434\u043e\u0440\u043e\u0432\u044c\u0435 \u0438 \u0442\u0435\u043b\u043e', psy:'\ud83e\uddd8 \u042d\u043c\u043e\u0446\u0438\u0438 \u0438 \u043f\u0441\u0438\u0445\u043e\u043b\u043e\u0433\u0438\u044f', crea:'\ud83c\udf00 \u0422\u0432\u043e\u0440\u0447\u0435\u0441\u0442\u0432\u043e \u0438 \u0441\u0432\u043e\u0431\u043e\u0434\u0430', learn:'\ud83d\udcc8 \u0421\u0430\u043c\u043e\u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0438 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u0435', home:'\ud83c\udfe0 \u0411\u044b\u0442 \u0438 \u043f\u043e\u0440\u044f\u0434\u043e\u043a', fin:'\ud83d\udcb5 \u0424\u0438\u043d\u0430\u043d\u0441\u044b \u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u044b', spirit:'\ud83c\udf0d \u0411\u0430\u043b\u0430\u043d\u0441 \u0438 \u0434\u0443\u0445\u043e\u0432\u043d\u043e\u0441\u0442\u044c'};const DEFAULT_HABIT_LISTS={ mind:[{name:'\u041a\u0430\u0436\u0434\u044b\u0439 \u0434\u0435\u043d\u044c \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c 3 \u043d\u043e\u0432\u044b\u0435 \u0438\u0434\u0435\u0438', frequency: 'daily'}], comm:[{name:'\u0420\u0430\u0437 \u0432 \u043d\u0435\u0434\u0435\u043b\u044e \u0437\u0432\u043e\u043d\u0438\u0442\u044c \u0441\u0442\u0430\u0440\u043e\u043c\u0443 \u0434\u0440\u0443\u0433\u0443', frequency: 'weekly'}], work:[{name:'\u041f\u043b\u0430\u043d\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0435\u0434\u0435\u043b\u044e \u0432 \u0432\u043e\u0441\u043a\u0440\u0435\u0441\u0435\u043d\u044c\u0435', frequency: 'weekly'}], body:[{name:'\u0421\u043f\u0430\u0442\u044c 7\u20138 \u0447\u0430\u0441\u043e\u0432 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e', frequency: 'daily'}], psy:[{name:'\u041c\u0435\u0434\u0438\u0442\u0430\u0446\u0438\u044f \u0445\u043e\u0442\u044f \u0431\u044b 5 \u043c\u0438\u043d\u0443\u0442', frequency: 'daily'}], crea:[{name:'\u0420\u0430\u0437 \u0432 \u043c\u0435\u0441\u044f\u0446 \u0443\u0447\u0438\u0442\u044c\u0441\u044f \u043d\u043e\u0432\u043e\u043c\u0443 \u043d\u0430\u0432\u044b\u043a\u0443', frequency: 'monthly'}], learn:[{name:'\u0414\u0435\u043b\u0430\u0442\u044c \u0440\u0435\u0444\u043b\u0435\u043a\u0441\u0438\u044e \u0440\u0430\u0437 \u0432 \u043d\u0435\u0434\u0435\u043b\u044e', frequency: 'weekly'}], home:[{name:'\u0414\u0435\u043b\u0430\u0442\u044c \u0435\u0436\u0435\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u00ab\u0434\u0435\u043d\u044c \u0437\u0430\u0431\u043e\u0442\u044b \u043e \u0434\u043e\u043c\u0435\u00bb', frequency: 'weekly'}], fin:[{name:'\u0420\u0430\u0437 \u0432 \u043c\u0435\u0441\u044f\u0446 \u0434\u0435\u043b\u0430\u0442\u044c \u0444\u0438\u043d\u0430\u043d\u0441\u043e\u0432\u044b\u0439 \u043e\u0431\u0437\u043e\u0440', frequency: 'monthly'}], spirit:[{name:'\u0420\u0430\u0437 \u0432 \u043c\u0435\u0441\u044f\u0446 \u0443\u0435\u0437\u0436\u0430\u0442\u044c \u0432 \u043d\u043e\u0432\u043e\u0435 \u043c\u0435\u0441\u0442\u043e', frequency: 'monthly'}]};\/\/ ====== \u0423\u0442\u0438\u043b\u0438\u0442\u044b ======function fmtDate(d){ const year = d.getFullYear(); const month = String(d.getMonth() + 1).padStart(2, '0'); const day = String(d.getDate()).padStart(2, '0'); return `${year}-${month}-${day}`;}function clamp(v,a,b){ return Math.max(a, Math.min(b, v)); }function colorForScore(v){ v=clamp(v,0,100); const hue = v * 1.2; return `hsl(${hue}, 75%, 45%)`; }function colorByIndex(i){ const hue=(i*57)%360; return `hsl(${hue}, 80%, 45%)`; }function avg(arr){ return Math.round(arr.reduce((s,v)=>s+v,0)\/Math.max(arr.length,1)); }function todayISO(){ return fmtDate(new Date()); }function daysBack(n){ const d=new Date(); d.setDate(d.getDate()-n); return d; }function monthStart(d){ return new Date(d.getFullYear(), d.getMonth(), 1); }function addDays(d, n){ const x=new Date(d); x.setDate(x.getDate()+n); return x; }function debounce(fn, ms){ let t; return (...args)=>{ clearTimeout(t); t=setTimeout(()=>fn(...args), ms); }; }function actionKey(catId,label){ return `${catId}||${label}`; }function getFrequencyText(freq) { switch(freq) { case 'weekly': return '\u0415\u0436\u0435\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u043e'; case 'monthly': return '\u0415\u0436\u0435\u043c\u0435\u0441\u044f\u0447\u043d\u043e'; default: return '\u0415\u0436\u0435\u0434\u043d\u0435\u0432\u043d\u043e'; }}const syncIndicator = document.getElementById('syncStatus');let syncTimeout;function showSyncStatus(status, message) { clearTimeout(syncTimeout); syncIndicator.className = status; syncIndicator.textContent = message; syncIndicator.classList.add('visible'); if (status !== 'syncing') { syncTimeout = setTimeout(() => { syncIndicator.classList.remove('visible'); }, 3000); }}\/\/ ====== WordPress Integration: Data Storage ======async function loadStore() { if (typeof focus_score_ajax === 'undefined' || !focus_score_ajax.ajax_url) { showSyncStatus('error', '\u041e\u0448\u0438\u0431\u043a\u0430! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e\u0442\u0441\u044f \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); try { return JSON.parse(localStorage.getItem('focusScoreData_v12')) || {}; } catch (e) { return {}; } } try { const url = new URL(focus_score_ajax.ajax_url); url.searchParams.append('timestamp', new Date().getTime()); const response = await fetch(url, { method: 'POST', headers: { 'Content-Type': 'application\/x-www-form-urlencoded' }, body: new URLSearchParams({ 'action': 'load_focus_score_data', 'security': focus_score_ajax.nonce }) }); const result = await response.json(); if (result.success) { return JSON.parse(result.data || '{}') || {}; } else { showSyncStatus('error', '\u041e\u0448\u0438\u0431\u043a\u0430 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438! \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435.'); return JSON.parse(localStorage.getItem('focusScoreData_v12')) || {}; } } catch (e) { showSyncStatus('error', '\u041d\u0435\u0442 \u0441\u0432\u044f\u0437\u0438! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e\u0442\u0441\u044f \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); return JSON.parse(localStorage.getItem('focusScoreData_v12')) || {}; }}const saveStore = debounce(function(obj) { const dataToSave = JSON.stringify(obj); showSyncStatus('syncing', '\u0421\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435...'); if (typeof focus_score_ajax === 'undefined' || !focus_score_ajax.ajax_url) { localStorage.setItem('focusScoreData_v12', dataToSave); showSyncStatus('error', '\u041e\u0448\u0438\u0431\u043a\u0430! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u044b \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); return; } fetch(focus_score_ajax.ajax_url, { method: 'POST', headers: { 'Content-Type': 'application\/x-www-form-urlencoded' }, body: new URLSearchParams({ 'action': 'save_focus_score_data', 'security': focus_score_ajax.nonce, 'data': dataToSave }) }) .then(response => response.json()) .then(result => { if (result.success) { showSyncStatus('synced', '\u0421\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u043e \u043e\u043d\u043b\u0430\u0439\u043d'); localStorage.removeItem('focusScoreData_v12_unsynced'); } else { localStorage.setItem('focusScoreData_v12_unsynced', dataToSave); showSyncStatus('error', '\u041e\u0448\u0438\u0431\u043a\u0430! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u044b \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); } }) .catch(e => { localStorage.setItem('focusScoreData_v12_unsynced', dataToSave); showSyncStatus('error', '\u041d\u0435\u0442 \u0441\u0432\u044f\u0437\u0438! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u044b \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); });}, 1500);\/\/ ====== \u0421\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 ======let currentDate = todayISO();let currentScores = {};let statsPeriod = 30;\/\/ ====== \u041a\u0430\u043b\u0435\u043d\u0434\u0430\u0440\u044c ======function renderMiniCalendar(dateISO){ const root=document.querySelector('#miniCalendar'); root.innerHTML=''; const d = new Date(dateISO.replace(\/-\/g, '\/')); const ms=monthStart(d); const start = addDays(ms, -((ms.getDay()+6)%7)); const titleDiv=document.createElement('div'); titleDiv.className='btnbar'; titleDiv.style.justifyContent = 'space-between'; titleDiv.innerHTML=`<button class=\"btn small\" id=\"mcPrev\">\u25c0<\/button> <\/p>\n<div class=\"muted\">${d.toLocaleString('ru-RU',{month:'long'})} ${d.getFullYear()}<\/div>\n<p> <button class=\"btn small\" id=\"mcNext\">\u25b6<\/button>`; root.appendChild(titleDiv); const head=document.createElement('div'); head.className='cal-head'; head.innerHTML=['\u041f\u043d','\u0412\u0442','\u0421\u0440','\u0427\u0442','\u041f\u0442','\u0421\u0431','\u0412\u0441'].map(x=>`<\/p>\n<div>${x}<\/div>\n<p>`).join(''); root.appendChild(head); const grid=document.createElement('div'); grid.className='calendar'; root.appendChild(grid); const days=[]; for(let i=0;i<42;i++){ days.push(addDays(start,i)); } days.forEach(day=>{ const iso=fmtDate(day); const cell=document.createElement('div'); cell.className='cal-cell'; if(day.getMonth()!==d.getMonth()) cell.classList.add('dim'); if(iso===currentDate) cell.classList.add('active'); const scoreAvg = store.days[iso] ? catAvg(store.days[iso]) : 0; cell.innerHTML = `<\/p>\n<div class=\"cal-day\">${day.getDate()}<\/div>\n<p> <\/p>\n<div class=\"cal-chip\">${scoreAvg}<\/div>\n<p> <\/p>\n<div class=\"cal-bar\" style=\"width:${scoreAvg}%; background:${colorForScore(scoreAvg)}\"><\/div>\n<p>`; cell.title=iso; cell.onclick=()=>{ loadDay(iso); }; grid.appendChild(cell); }); document.querySelector('#mcPrev').onclick=()=>{ const prev=new Date(d.getFullYear(), d.getMonth()-1, 1); renderMiniCalendar(fmtDate(prev)); }; document.querySelector('#mcNext').onclick=()=>{ const next=new Date(d.getFullYear(), d.getMonth()+1, 1); renderMiniCalendar(fmtDate(next)); };}\/\/ ====== \u0414\u0435\u043d\u044c: ensure, load, setScore ======function ensureDay(date){ if(!store.days[date]){ const scores={}; store.cats.forEach(c => { scores[c.id] = 0; }); store.days[date]=scores; } if(!store.quickApplied[date] || typeof store.quickApplied[date] !== 'object'){ store.quickApplied[date] = {}; } if(!store.habitDone[date]) store.habitDone[date] = {};}function loadDay(date){ ensureDay(date); currentDate=date; currentScores={...store.days[date]}; document.querySelector('#datePicker').value=date; document.querySelector('#todayLabel').textContent=date; renderRows(); recompute(); renderMiniCalendar(date); drawAll(); renderHabits(); updateHabitsProgress();}function setScore(catId, value){ currentScores[catId]=value; store.days[currentDate]={...currentScores}; saveStore(store); const rowToUpdate = document.querySelector(`#rows .row[data-cat-id=\"${catId}\"]`); if (rowToUpdate) { const range = rowToUpdate.querySelector('input[type=range]'); const num = rowToUpdate.querySelector('input[type=number]'); if (range && range.value != value) { range.value = value; } if (num && num.value != value) { num.value = value; } } recompute(); drawAll(); renderMiniCalendar(currentDate);}const setScoreDebounced = debounce(setScore, 200);function renderRows(){ const rowsEl=document.querySelector('#rows'); rowsEl.innerHTML=''; store.cats.forEach(c=>{ const row=document.createElement('div'); row.className='row'; row.dataset.catId = c.id; row.innerHTML=`<\/p>\n<div>${c.name}<\/div>\n<p> <input type=\"range\" min=\"0\" max=\"100\" step=\"5\" value=\"${currentScores[c.id]||0}\"> <input type=\"number\" min=\"0\" max=\"100\" value=\"${currentScores[c.id]||0}\">`; const range=row.children[1]; const num=row.children[2]; range.addEventListener('input',()=>{ num.value=range.value; setScoreDebounced(c.id, +range.value); }); num.addEventListener('input',()=>{ const v=clamp(+num.value,0,100); num.value=v; range.value=v; setScoreDebounced(c.id, v); }); rowsEl.appendChild(row); });}document.querySelector('#datePicker').onchange=(e)=> loadDay(e.target.value);document.querySelector('#todayBtn').onclick=()=> loadDay(todayISO());document.querySelector('#prevDay').onclick=()=>{ const nd=fmtDate(addDays(new Date(currentDate.replace(\/-\/g, '\/')), -1)); loadDay(nd); };document.querySelector('#nextDay').onclick=()=>{ const nd=fmtDate(addDays(new Date(currentDate.replace(\/-\/g, '\/')), 1)); loadDay(nd); };\/\/ ====== \u041f\u043e\u0434\u0441\u0447\u0451\u0442\u044b ======function catAvg(scores){ return avg(Object.values(scores)); }function getLastNDays(n){ const out=[]; for(let i=n-1;i>=0;i--){ const d=fmtDate(daysBack(i)); ensureDay(d); out.push({date:d, scores: store.days[d]}); } return out; }function categoryAverages(period){ const last=getLastNDays(period); return store.cats.map(c=> ({id:c.id,name:c.name, avg: avg(last.map(d=> (d.scores[c.id]||0))) })); }function deficitsToday(){ return store.cats.map(c=> ({c, v: currentScores[c.id]||0, min:c.dailyMin})).filter(x=> x.v<x.min).sort((a,b)=> a.v-b.v); }\/\/ ====== Quick Actions ======function isActionUsed(date, key){ const qa=store.quickApplied[date]; return !!(qa && qa[key]); }function markActionUsed(date, key){ if(!store.quickApplied[date]) store.quickApplied[date]={}; store.quickApplied[date][key]=true; saveStore(store); }function applyQuickAction(catId, add, label){ const key=actionKey(catId,label); if(isActionUsed(currentDate, key)) return; setScore(catId, clamp((currentScores[catId]||0)+add,0,100)); markActionUsed(currentDate, key); recompute(); }\/\/ ====== KPI\/\u0434\u0435\u0444\u0438\u0446\u0438\u0442\u044b\/\u0431\u044b\u0441\u0442\u0440\u044b\u0435 ======function renderKPIs(){ const openStates = new Map(); document.querySelectorAll('#quickBox details').forEach(d => { if (d.dataset.catId) { openStates.set(d.dataset.catId, d.open); } }); document.querySelector('#kpiToday').textContent = catAvg(currentScores); document.querySelector('#kpiWeek').textContent = avg(getLastNDays(7).map(d=>catAvg(d.scores))); document.querySelector('#kpiMonth').textContent = avg(getLastNDays(30).map(d=>catAvg(d.scores))); const def=deficitsToday(); document.querySelector('#kpiDef').textContent = def.length; const box=document.querySelector('#deficitsBox'); box.innerHTML=''; if(def.length===0){ box.innerHTML='<\/p>\n<div class=\"muted\">\u0412\u0441\u0435 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438 \u0432 \u0437\u0435\u043b\u0451\u043d\u043e\u0439 \u0437\u043e\u043d\u0435<\/div>\n<p>'; } else { def.forEach(({c,v,min})=>{ const item=document.createElement('div'); item.className='section warn'; item.style.padding='10px'; item.style.marginBottom='8px'; item.innerHTML=`<\/p>\n<div class=\"btnbar\" style=\"justify-content:space-between\">\n<div><b>${c.name}<\/b> \u2014 ${v}\/${min}<\/div>\n<\/div>\n<p>`; box.appendChild(item); }); }  const qb=document.querySelector('#quickBox'); qb.innerHTML=''; store.cats.forEach(c=>{ const ideas=(store.ideas[c.id]||[]); if (ideas.length === 0) return;  const details = document.createElement('details'); details.className = 'qa-group'; details.dataset.catId = c.id; if (openStates.get(c.id)) { details.open = true; } const summary = document.createElement('summary'); summary.textContent = c.name; details.appendChild(summary);  const btnContainer = document.createElement('div'); btnContainer.className = 'btnbar'; btnContainer.style.marginTop = '8px'; ideas.forEach(txt=>{ const key=actionKey(c.id, txt); const used=isActionUsed(currentDate, key); const b=document.createElement('button'); b.className='btn small'; b.textContent= used ? `${txt} \u2713` : txt; if(used) b.disabled=true; b.onclick=()=>{ if(isActionUsed(currentDate,key)) return; const m=txt.match(\/\$\\s*\\+\\s*(\\d+)\\s*\$\/); const add=m ? +m[1] : 10; applyQuickAction(c.id, add, txt); }; btnContainer.appendChild(b); }); details.appendChild(btnContainer); qb.appendChild(details); });}function recompute(){ renderKPIs(); }\/\/ ====== \u0413\u0440\u0430\u0444\u0438\u043a\u0438 ======const cMulti=document.querySelector('#chartMulti'); const ctxM=cMulti.getContext('2d');function resizeCanvas(cv, ctx){ const dpr=window.devicePixelRatio||1; const w=cv.clientWidth, h=cv.clientHeight; cv.width=w*dpr; cv.height=h*dpr; ctx.setTransform(dpr,0,0,dpr,0,0); }function perCategorySeries(period){ const days=getLastNDays(period); return store.cats.map(c=>({ name:c.name, values: days.map(d=> (d.scores[c.id]||0)) })); }function drawMultiLine(cv, ctx, series){ resizeCanvas(cv, ctx); const w=cv.clientWidth, h=cv.clientHeight; ctx.clearRect(0,0,w,h); ctx.strokeStyle=getComputedStyle(document.documentElement).getPropertyValue('--border'); ctx.lineWidth=1; for(let i=0;i<=5;i++){ const y=h-(h*i\/5); ctx.beginPath(); ctx.moveTo(0,y); ctx.lineTo(w,y); ctx.stroke(); } const maxLen=Math.max(...series.map(s=>s.values.length)); series.forEach((s,idx)=>{ ctx.beginPath(); ctx.lineWidth=2; ctx.strokeStyle=colorByIndex(idx); s.values.forEach((v,i)=>{ const x=(i*(w\/Math.max(1,maxLen-1))); const y=h-(clamp(v,0,100)\/100)*h; if(i===0) ctx.moveTo(x,y); else ctx.lineTo(x,y); }); ctx.stroke(); }); const legend=document.querySelector('#lineLegend'); legend.innerHTML=''; series.forEach((s,idx)=>{ const span=document.createElement('span'); span.innerHTML=`<i class=\"dot\" style=\"width:10px;height:10px;border-radius:2px;display:inline-block;background:${colorByIndex(idx)}; margin-right: 4px;\"><\/i>${s.name}`; legend.appendChild(span); }); }const rW=document.querySelector('#radarWeek'); const rCtx=rW.getContext('2d');function drawRadar(cv, ctx, labels, values){ const root=document.documentElement; const gridColor=getComputedStyle(root).getPropertyValue('--border').trim()||'#e5e7eb'; const labelColor=getComputedStyle(root).getPropertyValue('--muted').trim()||'#6b7280'; const fillColor=getComputedStyle(root).getPropertyValue('--accent2').trim()||'#0ea5e9'; resizeCanvas(cv, ctx); const w=cv.clientWidth, h=cv.clientHeight; ctx.clearRect(0,0,w,h); const cx=w\/2, cy=h\/2; const radius=Math.min(w,h)*0.38; const steps=5; ctx.strokeStyle=gridColor; ctx.lineWidth=1; ctx.fillStyle='transparent'; for(let s=1;s<=steps;s++){ const r=radius*(s\/steps); ctx.beginPath(); labels.forEach((_,i)=>{ const a=(i\/labels.length)*Math.PI*2 - Math.PI\/2; const x=cx + Math.cos(a)*r; const y=cy + Math.sin(a)*r; if(i===0) ctx.moveTo(x,y); else ctx.lineTo(x,y); }); ctx.closePath(); ctx.stroke(); } ctx.strokeStyle=gridColor; ctx.fillStyle=labelColor; ctx.font='12px system-ui'; ctx.textBaseline='middle'; labels.forEach((label,i)=>{ const a=(i\/labels.length)*Math.PI*2 - Math.PI\/2; const x=cx + Math.cos(a)*radius; const y=cy + Math.sin(a)*radius; ctx.beginPath(); ctx.moveTo(cx,cy); ctx.lineTo(x,y); ctx.stroke(); const lx=cx + Math.cos(a)*(radius+14); const ly=cy + Math.sin(a)*(radius+14); const tw=ctx.measureText(label).width; ctx.fillText(label, lx - tw\/2, ly); }); ctx.globalAlpha=0.25; ctx.fillStyle=fillColor; ctx.strokeStyle=fillColor; ctx.beginPath(); values.forEach((v,i)=>{ const a=(i\/labels.length)*Math.PI*2 - Math.PI\/2; const r=radius*(clamp(v,0,100)\/100); const x=cx + Math.cos(a)*r; const y=cy + Math.sin(a)*r; if(i===0) ctx.moveTo(x,y); else ctx.lineTo(x,y); }); ctx.closePath(); ctx.fill(); ctx.globalAlpha=1; ctx.stroke(); }function drawBars(containerId, data){ const container=document.querySelector(containerId); container.innerHTML=''; data.sort((a,b)=> b.avg-a.avg).forEach(r=>{ const line=document.createElement('div'); line.style.margin='6px 0'; line.innerHTML=`<\/p>\n<div style=\"display:flex;align-items:center;gap:10px\">\n<div style=\"width:160px\">${r.name}<\/div>\n<div style=\"flex:1;background:rgba(2,132,199,.12);border:1px solid var(--border);height:12px;border-radius:999px;overflow:hidden\">\n<div style=\"width:${r.avg}%;height:100%;background:var(--accent2)\"><\/div>\n<\/div>\n<div style=\"width:40px;text-align:right\"><b>${r.avg}<\/b><\/div>\n<\/div>\n<p>`; container.appendChild(line); }); }function drawAll(){ document.querySelector('#periodHint').textContent=`(${statsPeriod} \u0434\u043d\u0435\u0439)`; drawMultiLine(cMulti, ctxM, perCategorySeries(statsPeriod)); const avgs=categoryAverages(statsPeriod); drawRadar(rW, rCtx, avgs.map(x=>x.name), avgs.map(x=>x.avg)); drawBars('#weekBars', avgs); drawBars('#monthBars', categoryAverages(30)); }[...document.querySelectorAll('.periodbar [data-period]')].forEach(b=> b.onclick=()=>{ statsPeriod=+b.dataset.period; drawAll(); });\/\/ ====== \u042d\u043a\u0441\u043f\u043e\u0440\u0442\/\u0438\u043c\u043f\u043e\u0440\u0442 ======function download(filename, content, type='text\/plain'){ const blob=new Blob([content],{type}); const url=URL.createObjectURL(blob); const a=document.createElement('a'); a.href=url; a.download=filename; document.body.appendChild(a); a.click(); setTimeout(()=>{ URL.revokeObjectURL(url); a.remove(); },0); }document.querySelector('#exportJSON').onclick=()=> download('focusscore.json', JSON.stringify(store,null,2), 'application\/json');document.querySelector('#exportCSV').onclick=()=>{ const allDates=Object.keys(store.days).sort(); const cats=store.cats.map(c=>c.id); let csv='date,'+store.cats.map(c=>c.name).join(',')+'\\n'; allDates.forEach(d=>{ const row=[d]; cats.forEach(id=> row.push(store.days[d]?.[id]??0)); csv+=row.join(',')+'\\n'; }); download('focusscore.csv', csv, 'text\/csv'); };document.querySelector('#importFile').onchange=(e)=>{ const file=e.target.files[0]; if(!file) return; const reader=new FileReader(); reader.onload=()=>{ try{ const data=JSON.parse(reader.result); if(data.cats && data.days){ store=data; if(!store.quickApplied) store.quickApplied={}; if(!store.ideas) store.ideas={}; if(!store.habits) store.habits=[]; if(!store.habitDone) store.habitDone={}; saveStore(store); loadDay(todayISO()); } }catch(err){ alert('\u041d\u0435\u0432\u0435\u0440\u043d\u044b\u0439 JSON'); } }; reader.readAsText(file); };\/\/ ====== \u041f\u0440\u0438\u0432\u044b\u0447\u043a\u0438 ======function daysBetweenISO(aISO,bISO){ const a=new Date(aISO.replace(\/-\/g, '\/')); const b=new Date(bISO.replace(\/-\/g, '\/')); return Math.round((b-a)\/86400000); }function habitLevel(streak){ if(streak>=91) return {name:'\u0413\u0443\u0440\u0443 \u0445\u0430\u043e\u0441\u0430 \ud83d\udd2e', idx:4}; if(streak>=31) return {name:'\u041c\u0430\u044d\u0441\u0442\u0440\u043e \u043f\u043e\u0442\u043e\u043a\u0430 \ud83c\udfb6', idx:3}; if(streak>=8) return {name:'\u042d\u043d\u0435\u0440\u0433\u0435\u0442\u0438\u043a\u2011\u0434\u0436\u0435\u0434\u0430\u0439 \u26a1\ufe0f', idx:2}; if(streak>=1) return {name:'\u041d\u043e\u0432\u0438\u0447\u043e\u043a\u2011\u0444\u043e\u043a\u0443\u0441\u043d\u0438\u043a \ud83c\udfa9', idx:1}; return {name:'\u2014', idx:0}; }function ensureHabitDay(date){ if(!store.habitDone[date]) store.habitDone[date]={}; }function isHabitDoneToday(id){ ensureHabitDay(currentDate); return !!store.habitDone[currentDate][id]; }function markHabitDone(id){ ensureHabitDay(currentDate); if(store.habitDone[currentDate][id]) return; const h=store.habits.find(x=>x.id===id); if(!h) return; const today = new Date(currentDate.replace(\/-\/g, '\/')); let streak = h.streak || 0; if (h.lastDoneDate) { const last = new Date(h.lastDoneDate.replace(\/-\/g, '\/')); const frequency = h.frequency || 'daily'; switch (frequency) { case 'weekly': const lastWeekStart = addDays(last, -(last.getDay() + 6) % 7); const thisWeekStart = addDays(today, -(today.getDay() + 6) % 7); const weekDiff = Math.round((thisWeekStart - lastWeekStart) \/ (1000 * 60 * 60 * 24));  if (weekDiff === 7) { streak++; } else if (weekDiff > 7) { streak = 1; } break;  case 'monthly': const monthDiff = (today.getFullYear() * 12 + today.getMonth()) - (last.getFullYear() * 12 + last.getMonth()); if (monthDiff === 1) { streak++; } else if (monthDiff > 1) { streak = 1; } break; default: \/\/ 'daily' const dayDiff = daysBetweenISO(h.lastDoneDate, currentDate); if (dayDiff === 1) { streak++; } else if (dayDiff > 1) { streak = 1; } break; } } else { streak = 1; } h.streak = streak; h.total = (h.total || 0) + 1; h.lastDoneDate = currentDate; store.habitDone[currentDate][id]=true; saveStore(store); renderHabits(); updateHabitsProgress();}function renderHabitCard(h){ const lvl=habitLevel(h.streak||0); const done=isHabitDoneToday(h.id); const card=document.createElement('div'); card.className='habit'; const descriptionHTML = h.description ? `<\/p>\n<div class=\"desc\">${h.description}<\/div>\n<p>` : ''; const freqText = getFrequencyText(h.frequency); card.innerHTML=` <\/p>\n<div><input type=\"checkbox\" style=\"width:20px;height:20px\" ${done?'checked':''}><\/div>\n<p> <\/p>\n<div> <\/p>\n<div class=\"title\">${h.name}<\/div>\n<p> ${descriptionHTML} <\/p>\n<div class=\"meta\"> <span>${lvl.name}<\/span> \u2022  <span class=\"lvl-badge\">${freqText}<\/span> \u2022  <span>\u0441\u0435\u0440\u0438\u044f ${h.streak||0}<\/span> \u2022  <span>\u0432\u0441\u0435\u0433\u043e ${h.total||0}<\/span> <\/div>\n<p> <\/p>\n<div class=\"hbar\" style=\"margin-top:6px\">\n<div style=\"width:${Math.min(100,(h.streak||0))}%\"><\/div>\n<\/div>\n<p> <\/div>\n<p>`; const cb=card.querySelector('input'); cb.onchange=()=>{ if (cb.checked) { markHabitDone(h.id); cb.disabled = true; } }; if (done) cb.disabled = true; return card;}function renderHabits(){ Object.keys(ENTP_GROUPS).forEach(key => { const el = document.querySelector(`#group-${key}`); if(el) el.innerHTML=''; const summary = el?.parentElement.querySelector('summary'); if(summary) summary.textContent = ENTP_GROUPS[key]; }); const q=(document.querySelector('#habSearch').value||'').toLowerCase(); store.habits.forEach(h=>{ if(q && !h.name.toLowerCase().includes(q)) return; const targetSel = `#group-${h.group}`; const host=document.querySelector(targetSel); if(host) host.appendChild(renderHabitCard(h)); });}document.querySelector('#habSearch').oninput=()=> { renderHabits(); };document.querySelector('#habCollapse').onclick=()=>{ document.querySelectorAll('.hab-group').forEach(d=> d.removeAttribute('open')); };document.querySelector('#habExpand').onclick=()=>{ document.querySelectorAll('.hab-group').forEach(d=> d.setAttribute('open','')); };function updateHabitsProgress(){ ensureHabitDay(currentDate); const today=store.habitDone[currentDate]||{}; const doneCnt=Object.keys(today).length; const total=store.habits.length||0; const pct= total? Math.round((doneCnt\/total)*100) : 0; document.querySelector('#habitsProgressBar').style.width = pct+'%'; document.querySelector('#habitsProgressStat').textContent = `${doneCnt}\/${total}`;}\/\/ ====== \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0438 \u0421\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 ======const settingsModal=document.querySelector('#settingsModal');const habitStatsModal = document.querySelector('#habitStatsModal');document.querySelector('#openSettings').onclick=()=>{ renderSettings(); settingsModal.classList.add('open'); };document.querySelector('#closeSettings').onclick=()=> settingsModal.classList.remove('open');document.querySelector('#openHabitStats').onclick=()=>{ renderHabitStats(); habitStatsModal.classList.add('open'); };document.querySelector('#closeHabitStats').onclick=()=> habitStatsModal.classList.remove('open');function renderHabitStats() { const content = document.getElementById('habit-stats-content'); content.innerHTML = ''; const todayDone = Object.keys(store.habitDone[todayISO()] || {}).length; const totalHabits = store.habits.length; const todayProgress = totalHabits > 0 ? Math.round((todayDone \/ totalHabits) * 100) : 0; const topStreaks = [...store.habits].sort((a, b) => (b.streak || 0) - (a.streak || 0)).slice(0, 3); const topTotals = [...store.habits].sort((a, b) => (b.total || 0) - (a.total || 0)).slice(0, 3); let html = ` <\/p>\n<h4>\u041e\u0431\u0449\u0438\u0439 \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441 \u0441\u0435\u0433\u043e\u0434\u043d\u044f: ${todayDone} \u0438\u0437 ${totalHabits} (${todayProgress}%)<\/h4>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4>\u0422\u043e\u043f-3 \u043f\u043e \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0441\u0435\u0440\u0438\u0438:<\/h4>\n<p> <\/p>\n<ul> ${topStreaks.map(h => `<\/p>\n<li>${h.name} (${h.streak || 0} ${getFrequencyText(h.frequency).toLowerCase().replace(\/.$\/, '\u044c')})<\/li>\n<p>`).join('')} <\/ul>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4>\u0422\u043e\u043f-3 \u043f\u043e \u043e\u0431\u0449\u0435\u043c\u0443 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044e:<\/h4>\n<p> <\/p>\n<ul> ${topTotals.map(h => `<\/p>\n<li>${h.name} (${h.total || 0} \u0440\u0430\u0437)<\/li>\n<p>`).join('')} <\/ul>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4>\u0412\u0441\u0435 \u043f\u0440\u0438\u0432\u044b\u0447\u043a\u0438:<\/h4>\n<p> <\/p>\n<div style=\"display: grid; grid-template-columns: 1fr auto auto; gap: 8px; align-items: center;\"> <\/p>\n<div class=\"muted\">\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435<\/div>\n<p> <\/p>\n<div class=\"muted\">\u0421\u0435\u0440\u0438\u044f<\/div>\n<p> <\/p>\n<div class=\"muted\">\u0412\u0441\u0435\u0433\u043e<\/div>\n<p> ${store.habits.map(h => ` <\/p>\n<div>${h.name}<\/div>\n<p> <\/p>\n<div style=\"text-align: right;\">${h.streak || 0}<\/div>\n<p> <\/p>\n<div style=\"text-align: right;\">${h.total || 0}<\/div>\n<p> `).join('')} <\/div>\n<p> `; content.innerHTML = html;}function renderSettings(){ renderCatList(); renderIdeasEditor(); renderHabitsEditor(); const newHabGroupSelect = document.querySelector('#newHabGroup'); newHabGroupSelect.innerHTML = ''; for (const [key, value] of Object.entries(ENTP_GROUPS)) { newHabGroupSelect.innerHTML += `<option value=\"${key}\">${value}<\/option>`; } const newHabFreqSelect = document.querySelector('#newHabFrequency'); newHabFreqSelect.innerHTML = `<option value=\"daily\">\u0415\u0436\u0435\u0434\u043d\u0435\u0432\u043d\u043e<\/option><option value=\"weekly\">\u0415\u0436\u0435\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u043e<\/option><option value=\"monthly\">\u0415\u0436\u0435\u043c\u0435\u0441\u044f\u0447\u043d\u043e<\/option> `;}function renderCatList(){ const wrap=document.querySelector('#catList'); wrap.innerHTML=''; store.cats.forEach((c, idx)=>{ const line=document.createElement('div'); line.className='kbar'; line.innerHTML=`<\/p>\n<div>${idx+1}<\/div>\n<p> <input class=\"input\" value=\"${c.name}\" \/> <input class=\"input\" type=\"number\" value=\"${c.dailyMin}\" \/> <input class=\"input\" type=\"number\" value=\"${c.weeklyMin}\" \/> <\/p>\n<div><button class=\"btn small danger\">\u0423\u0434\u0430\u043b\u0438\u0442\u044c<\/button><\/div>\n<p> <\/p>\n<div><button class=\"btn small\">\u0421\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c<\/button><\/div>\n<p>`; const nameEl=line.children[1]; const dEl=line.children[2]; const wEl=line.children[3]; const del=line.children[4].firstChild; const save=line.children[5].firstChild; del.onclick=()=>{ const id=c.id; store.cats.splice(idx,1); Object.keys(store.days).forEach(date=>{ if(store.days[date]) delete store.days[date][id]; }); delete store.ideas[id]; Object.keys(store.quickApplied).forEach(dt=>{ if(store.quickApplied[dt]){ Object.keys(store.quickApplied[dt]).forEach(k=>{ if(k.startsWith(id+'||')||k.startsWith('DEF||'+id)) delete store.quickApplied[dt][k]; }); } }); saveStore(store); renderSettings(); loadDay(currentDate); }; save.onclick=()=>{ c.name=nameEl.value.trim()||c.name; c.dailyMin=clamp(+dEl.value||0,0,100); c.weeklyMin=clamp(+wEl.value||0,0,100); saveStore(store); renderSettings(); loadDay(currentDate); }; wrap.appendChild(line); }); }document.querySelector('#addCat').onclick=()=>{ const name=document.querySelector('#newCatName').value.trim(); if(!name) return; const daily=clamp(+document.querySelector('#newCatDaily').value||0,0,100); const weekly=clamp(+document.querySelector('#newCatWeekly').value||0,0,100); const id = name.toLowerCase().replace(\/[^a-z\u0430-\u044f0-9]+\/gi,'_') + '_' + Math.random().toString(36).slice(2,6); store.cats.push({id,name, dailyMin:daily, weeklyMin:weekly}); Object.keys(store.days).forEach(date=>{ if(!store.days[date]) store.days[date]={}; store.days[date][id]=0; }); store.ideas[id]=[]; saveStore(store); document.querySelector('#newCatName').value=''; document.querySelector('#newCatDaily').value=''; document.querySelector('#newCatWeekly').value=''; renderSettings(); loadDay(currentDate); drawAll(); };function renderIdeasEditor(){ const wrap=document.querySelector('#qaEditor'); wrap.innerHTML=''; store.cats.forEach(c => { const catContainer = document.createElement('div'); catContainer.style.margin = '12px 0'; catContainer.innerHTML = `<\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">${c.name}<\/div>\n<p>`; const list = document.createElement('div'); list.style.display = 'flex'; list.style.flexDirection = 'column'; list.style.gap = '6px'; (store.ideas[c.id] || []).forEach((idea, idx) => { const item = document.createElement('div'); item.style.display = 'flex'; item.style.gap = '8px'; item.innerHTML = `<input class=\"input\" value=\"${idea}\" style=\"flex:1;\" \/> <button class=\"btn small danger\">\u0423\u0434\u0430\u043b\u0438\u0442\u044c<\/button>`; const inputEl = item.querySelector('input'); const deleteBtn = item.querySelector('button'); inputEl.onblur = () => { if (store.ideas[c.id]) { store.ideas[c.id][idx] = inputEl.value.trim(); saveStore(store); recompute(); } }; deleteBtn.onclick = () => { if (store.ideas[c.id]) { store.ideas[c.id].splice(idx, 1); saveStore(store); renderIdeasEditor(); recompute(); } }; list.appendChild(item); }); catContainer.appendChild(list); const addContainer = document.createElement('div'); addContainer.style.display = 'flex'; addContainer.style.gap = '8px'; addContainer.style.marginTop = '8px'; addContainer.innerHTML = `<input class=\"input\" placeholder=\"\u041d\u043e\u0432\u043e\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435, \u043d\u0430\u043f\u0440. \u041f\u0440\u043e\u0433\u0443\u043b\u043a\u0430 (+15)\" style=\"flex:1;\" \/> <button class=\"btn small primary\">\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c<\/button>`; const addInput = addContainer.querySelector('input'); const addBtn = addContainer.querySelector('button'); addBtn.onclick = () => { const newIdea = addInput.value.trim(); if (newIdea) { if (!store.ideas[c.id]) { store.ideas[c.id] = []; } store.ideas[c.id].push(newIdea); saveStore(store); renderIdeasEditor(); recompute(); } }; catContainer.appendChild(addContainer); wrap.appendChild(catContainer); });}function renderHabitsEditor() { const wrap = document.querySelector('#habEditor'); wrap.innerHTML = ''; if (!store.habits || store.habits.length === 0) { wrap.innerHTML = '<\/p>\n<div class=\"muted\">\u041d\u0435\u0442 \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a \u2014 \u0434\u043e\u0431\u0430\u0432\u044c \u043d\u0438\u0436\u0435<\/div>\n<p>'; return; } store.habits.forEach((h, idx) => { const line = document.createElement('div'); line.style.cssText = ` border: 1px solid var(--border); border-radius: 12px; padding: 10px; margin-bottom: 8px; display: grid; grid-template-columns: 1fr; gap: 8px; `; const row1 = document.createElement('div'); row1.style.display = 'grid'; row1.style.gridTemplateColumns = '2fr 1fr 1fr'; row1.style.gap = '8px'; const nameInput = document.createElement('input'); nameInput.className = 'input'; nameInput.value = h.name; const groupSelect = document.createElement('select'); groupSelect.className = 'input'; for (const [key, value] of Object.entries(ENTP_GROUPS)) { const option = document.createElement('option'); option.value = key; option.textContent = value; if (h.group === key) option.selected = true; groupSelect.appendChild(option); }  const freqSelect = document.createElement('select'); freqSelect.className = 'input'; freqSelect.innerHTML = `<option value=\"daily\">\u0415\u0436\u0435\u0434\u043d\u0435\u0432\u043d\u043e<\/option><option value=\"weekly\">\u0415\u0436\u0435\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u043e<\/option><option value=\"monthly\">\u0415\u0436\u0435\u043c\u0435\u0441\u044f\u0447\u043d\u043e<\/option>`; freqSelect.value = h.frequency || 'daily'; row1.appendChild(nameInput); row1.appendChild(groupSelect); row1.appendChild(freqSelect); line.appendChild(row1); const descInput = document.createElement('textarea'); descInput.className = 'input'; descInput.placeholder = '\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435'; descInput.value = h.description || ''; descInput.style.height = '60px'; line.appendChild(descInput); const buttonBar = document.createElement('div'); buttonBar.className = 'btnbar'; buttonBar.style.justifyContent = 'flex-end'; const deleteBtn = document.createElement('button'); deleteBtn.className = 'btn small danger'; deleteBtn.textContent = '\u0423\u0434\u0430\u043b\u0438\u0442\u044c'; deleteBtn.onclick = () => { store.habits.splice(idx, 1); saveStore(store); renderHabitsEditor(); renderHabits(); updateHabitsProgress(); }; const saveBtn = document.createElement('button'); saveBtn.className = 'btn small primary'; saveBtn.textContent = '\u0421\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c'; saveBtn.onclick = () => { h.name = nameInput.value.trim() || h.name; h.group = groupSelect.value; h.frequency = freqSelect.value; h.description = descInput.value.trim(); saveStore(store); renderHabitsEditor(); renderHabits(); }; buttonBar.appendChild(deleteBtn); buttonBar.appendChild(saveBtn); line.appendChild(buttonBar); wrap.appendChild(line); });}document.querySelector('#addHabit').onclick=()=>{ const name = document.querySelector('#newHabName').value.trim(); if(!name) return; const group = document.querySelector('#newHabGroup').value; const frequency = document.querySelector('#newHabFrequency').value; const description = document.querySelector('#newHabDesc').value.trim(); const id = 'hab_'+Math.random().toString(36).slice(2,8); store.habits.push({id, name, group, frequency, description, streak:0, total:0, lastDoneDate:null}); saveStore(store); document.querySelector('#newHabName').value=''; document.querySelector('#newHabDesc').value=''; renderHabitsEditor(); renderHabits(); updateHabitsProgress();};document.querySelector('#bulkHabits').onclick=()=>{ const raw=prompt('\u0412\u0441\u0442\u0430\u0432\u044c \u0441\u043f\u0438\u0441\u043e\u043a \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a, \u043f\u043e \u043e\u0434\u043d\u043e\u0439 \u0432 \u0441\u0442\u0440\u043e\u043a\u0435'); if(!raw) return; const lines=raw.split(\/\\n+\/).map(s=>s.trim()).filter(Boolean).slice(0,200); lines.forEach(name=>{ const id='hab_'+Math.random().toString(36).slice(2,8); store.habits.push({id,name,group:'mind',frequency:'daily',description:'',streak:0,total:0,lastDoneDate:null}); }); saveStore(store); renderHabitsEditor(); renderHabits(); updateHabitsProgress(); };\/\/ ====== \u0421\u0442\u0430\u0440\u0442 ======let store = {};async function init(){ store = await loadStore(); if(!store.cats || store.cats.length === 0) store.cats=DEFAULT_CATS; if(!store.days) store.days={}; if(!store.ideas) store.ideas = JSON.parse(JSON.stringify(DEFAULT_IDEAS)); if(!store.quickApplied) store.quickApplied={}; if(!store.habits) store.habits=[]; if(!store.habitDone) store.habitDone={}; if(store.habits.length===0){ const pushMany=(group, arr)=> arr.forEach(h_info=> store.habits.push({id:'hab_'+Math.random().toString(36).slice(2,8), name: h_info.name, frequency: h_info.frequency, group, description: '', streak:0,total:0,lastDoneDate:null})); for (const group in DEFAULT_HABIT_LISTS) { if (DEFAULT_HABIT_LISTS.hasOwnProperty(group)) { pushMany(group, DEFAULT_HABIT_LISTS[group]); } } } const d=todayISO(); ensureDay(d); loadDay(currentDate); window.addEventListener('resize', debounce(drawAll, 200));}<\/script><\/body><\/html>[\/et_pb_code][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»][et_pb_column type=»4_4″ _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»][et_pb_text _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»]<\/p>\n<p style=\"text-align: center;\"><a href=\"https:\/\/focus-tracker.panshiny.ru\/wp-admin\">\u0412\u0425\u041e\u0414<\/a><\/p>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=»1″ fullwidth=»on» _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u0412\u0425\u041e\u0414<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-7","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/pages\/7","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/comments?post=7"}],"version-history":[{"count":17,"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":35,"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/pages\/7\/revisions\/35"}],"wp:attachment":[{"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/media?parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":7,"date":"2025-09-04T11:07:27","date_gmt":"2025-09-04T10:07:27","guid":{"rendered":"https:\/\/focus-tracker.panshiny.ru\/?page_id=7"},"modified":"2025-09-05T15:18:10","modified_gmt":"2025-09-05T14:18:10","slug":"h","status":"publish","type":"page","link":"https:\/\/focus-tracker.panshiny.ru\/","title":{"rendered":"H"},"content":{"rendered":"

[et_pb_section fb_built=»1″ _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»][et_pb_row _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»][et_pb_column type=»4_4″ _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»][et_pb_code _builder_version=»4.27.4″ _module_preset=»default» hover_enabled=»0″ global_colors_info=»{}» sticky_enabled=»0″]FocusScore \u2014 v12.9 (Smart Habits)<\/title><\/p>\n<style> :root{ --bg:#f6f7fb; --card:#fff; --muted:#6b7280; --text:#0f172a; --accent:#2563eb; --accent2:#0ea5e9; --ok:#10b981; --warn:#f59e0b; --border:#e5e7eb; --danger:#ef4444; } *{box-sizing:border-box} html,body{height:100%} body{margin:0;font:14px\/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)} .wrap{max-width:1240px;margin:0 auto;padding:20px} header{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap} .title{font-weight:700;font-size:22px;letter-spacing:.2px} .cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px} .card{background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:0 1px 2px rgba(0,0,0,.03)} .card h4{margin:12px 12px 0 12px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em} .card .val{padding:6px 12px 14px 12px;font-size:28px;font-weight:700} .section{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px} .muted{color:var(--muted)} .btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);background:transparent;border-radius:10px;padding:8px 12px;cursor:pointer;color:inherit; font-family: inherit; font-size: inherit;} .btn.primary{background:var(--accent);border-color:var(--accent);color:#fff} .btn.small{padding:6px 10px;font-size:12px} .btn.danger{border-color:var(--danger); color:var(--danger)} .btn[disabled]{opacity:.5;cursor:not-allowed} .btnbar{display:flex;gap:8px;flex-wrap:wrap} .input, select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:transparent;color:inherit; font-family: inherit; font-size: inherit;} .hr{height:1px;background:var(--border);margin:12px 0} input[type=range]{width:100%} input[type=number]{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:transparent;color:inherit} canvas{width:100%;height:280px;border:1px solid var(--border);border-radius:10px;background:transparent} #datePicker{border:1px solid var(--border); background:transparent; border-radius:10px; padding:5px 8px; color:inherit; font-family:inherit; font-size:12px;} #syncStatus{position:fixed;bottom:0;left:0;width:100%;padding:8px;text-align:center;font-size:12px;color:#fff;z-index:2000;transition:transform .3s ease;transform:translateY(100%)} #syncStatus.visible{transform:translateY(0)} #syncStatus.syncing{background-color:var(--warn)} #syncStatus.synced{background-color:var(--ok)} #syncStatus.error{background-color:var(--danger)}  .grid{display:grid;grid-template-columns:2fr 1fr;gap:12px;margin-top:12px} .grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px} .calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:8px} .cal-head{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:6px;color:var(--muted);font-size:12px; text-align:center;} .cal-cell{padding:10px 8px 20px;border:1px solid var(--border);border-radius:10px;background:#fff;cursor:pointer;position:relative;min-height:64px;display:flex;align-items:flex-start;justify-content:flex-start} .cal-cell:hover{box-shadow:0 1px 2px rgba(0,0,0,.03)} .cal-cell.dim{opacity:.5} .cal-cell.active{outline:2px solid var(--accent)} .cal-day{font-weight:600;font-size:14px} .cal-chip{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);font-size:11px;border:1px solid var(--border);background:#fff;border-radius:999px;padding:2px 8px} .cal-bar{position:absolute;bottom:0;left:0;height:4px;background:var(--accent2);border-bottom-left-radius:10px;border-bottom-right-radius:10px} #rows .row{display:grid;grid-template-columns:1fr 4fr 90px;gap:10px;align-items:center;margin:10px 0} .warn{background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.35)} .legend{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px;font-size:12px;color:var(--muted)} .habits-toolbar{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-bottom:8px;flex-wrap:wrap} .habits-toolbar .search{flex:1;min-width:200px} .habits{display:grid;grid-template-columns:1fr 1fr;gap:10px} .habit{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;padding:10px;border:1px solid var(--border);border-radius:12px;background:linear-gradient(180deg,#fff, #fafcff)} .habit .title{font-weight:600;margin-bottom:2px} .habit .meta{font-size:12px;color:var(--muted); display: flex; flex-wrap: wrap; gap: 6px; align-items: center;} .habit .desc{font-size:12px;color:var(--muted); margin-top:4px;} .lvl-badge{font-size:12px;border:1px solid var(--border);padding:2px 8px;border-radius:999px;background:#fff} .hbar{height:8px;border-radius:999px;overflow:hidden;border:1px solid var(--border);background:rgba(2,132,199,.12)} .hbar>div{height:100%;background:var(--accent2)} .hab-group{margin-top:8px} .hab-group>summary, details.qa-group > summary {font-weight:600; cursor: pointer;} .hab-progress{display:flex;align-items:center;gap:10px;margin:8px 0 12px} .hab-progress .bar{flex:1;height:12px;border:1px solid var(--border);border-radius:999px;overflow:hidden;background:rgba(16,185,129,.12)} .hab-progress .bar>div{height:100%;background:linear-gradient(90deg,var(--ok),var(--accent2))} .hab-progress .stat{width:84px;text-align:right;font-weight:700} .modal{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;padding:20px; z-index: 1000;} .modal.open{display:flex} .modal-card{background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:16px;max-width:980px;width:100%;max-height:90vh;overflow:auto;padding:16px} .kbar{display:grid;grid-template-columns:32px 1fr 90px 90px 110px 90px;gap:8px;align-items:center; margin-bottom: 6px;} @media (max-width: 1024px){ .cards{grid-template-columns:repeat(2,1fr)} .grid{grid-template-columns:1fr} .grid2{grid-template-columns:1fr} #rows .row{grid-template-columns:1fr 1fr 80px} canvas{height:240px} } @media (max-width: 640px){ .wrap{padding:14px; margin-bottom: 30px;} .title{font-size:18px} .cards{grid-template-columns:1fr} .btn.small{padding:8px 10px} #rows .row{grid-template-columns:1fr;gap:8px} #rows .row input[type=range]{height:34px} input[type=number]{max-width:120px} .habits{grid-template-columns:1fr} .calendar{gap:6px} .cal-cell{min-height:56px} canvas{height:200px} }<\/style>\n<p><\/head><body> <\/p>\n<div id=\"syncStatus\"><\/div>\n<p> <\/p>\n<div class=\"wrap\"> <\/p>\n<header> <\/p>\n<div class=\"title\">FocusScore \u2014 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435\u043c<\/div>\n<p> <\/p>\n<div class=\"btnbar\"> <button id=\"openHabitStats\" class=\"btn\">\u0421\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a<\/button> <button id=\"openSettings\" class=\"btn\">\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438<\/button> <button id=\"exportCSV\" class=\"btn\">\u042d\u043a\u0441\u043f\u043e\u0440\u0442 CSV<\/button> <button id=\"exportJSON\" class=\"btn\">\u042d\u043a\u0441\u043f\u043e\u0440\u0442 JSON<\/button> <label class=\"btn\" for=\"importFile\">\u0418\u043c\u043f\u043e\u0440\u0442 JSON<\/label> <input id=\"importFile\" type=\"file\" accept=\"application\/json\" style=\"display:none\" \/> <\/div>\n<p> <\/header>\n<p> <\/p>\n<div class=\"cards\"> <\/p>\n<div class=\"card\">\n<h4>\u0418\u0442\u043e\u0433 \u0437\u0430 \u0441\u0435\u0433\u043e\u0434\u043d\u044f<\/h4>\n<div class=\"val\" id=\"kpiToday\">\u2014<\/div>\n<\/div>\n<p> <\/p>\n<div class=\"card\">\n<h4>\u0421\u0440\u0435\u0434\u043d\u0435\u0435 \u0437\u0430 7 \u0434\u043d\u0435\u0439<\/h4>\n<div class=\"val\" id=\"kpiWeek\">\u2014<\/div>\n<\/div>\n<p> <\/p>\n<div class=\"card\">\n<h4>\u0421\u0440\u0435\u0434\u043d\u0435\u0435 \u0437\u0430 \u043c\u0435\u0441\u044f\u0446<\/h4>\n<div class=\"val\" id=\"kpiMonth\">\u2014<\/div>\n<\/div>\n<p> <\/p>\n<div class=\"card\">\n<h4>\u0414\u0435\u0444\u0438\u0446\u0438\u0442\u043e\u0432 \u0441\u0435\u0433\u043e\u0434\u043d\u044f<\/h4>\n<div class=\"val\" id=\"kpiDef\">\u2014<\/div>\n<\/div>\n<p> <\/div>\n<p> <\/p>\n<div class=\"section\" style=\"margin-top:12px\"> <\/p>\n<div class=\"btnbar\" style=\"align-items:center\"> <button class=\"btn small\" id=\"prevDay\">\u25c0<\/button> <input type=\"date\" id=\"datePicker\" \/> <button class=\"btn small\" id=\"nextDay\">\u25b6<\/button> <button class=\"btn small\" id=\"todayBtn\">\u0421\u0435\u0433\u043e\u0434\u043d\u044f<\/button> <span class=\"muted\" id=\"todayLabel\"><\/span> <\/div>\n<p> <\/p>\n<div id=\"miniCalendar\"><\/div>\n<p> <\/div>\n<p> <\/p>\n<div class=\"grid\"> <\/p>\n<section class=\"section\" id=\"input\"> <\/p>\n<h3 style=\"margin:0 0 8px 0\">\u0412\u0432\u043e\u0434 \u0437\u0430 \u0434\u0435\u043d\u044c (\u0430\u0432\u0442\u043e\u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435)<\/h3>\n<p> <\/p>\n<div class=\"muted\" style=\"margin-bottom:8px\">\u0428\u043a\u0430\u043b\u0430 0\u2013100. \u0412\u0441\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043f\u0430\u0434\u0430\u044e\u0442 \u0432 \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0443 \u0438 \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0438.<\/div>\n<p> <\/p>\n<div id=\"rows\"><\/div>\n<p> <\/section>\n<p> <\/p>\n<aside class=\"section\"> <\/p>\n<h3 style=\"margin:0 0 8px 0\">\u0427\u0442\u043e \u043f\u043e\u0434\u0442\u044f\u043d\u0443\u0442\u044c \u0441\u0435\u0433\u043e\u0434\u043d\u044f<\/h3>\n<p> <\/p>\n<div id=\"deficitsBox\" class=\"list\">\n<div class=\"muted\">\u041d\u0435\u0442 \u0434\u0430\u043d\u043d\u044b\u0445<\/div>\n<\/div>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4 style=\"margin:0 0 8px 0\">\u0411\u044b\u0441\u0442\u0440\u044b\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f (\u043a\u0430\u0436\u0434\u043e\u0435 \u2014 1 \u0440\u0430\u0437\/\u0434\u0435\u043d\u044c)<\/h4>\n<p> <\/p>\n<div id=\"quickBox\" class=\"list\"><\/div>\n<p> <\/aside>\n<p> <\/div>\n<p> <\/p>\n<section class=\"section\" id=\"habits\" style=\"margin-top:12px\"> <\/p>\n<div class=\"habits-toolbar\"> <\/p>\n<div class=\"muted\">\u0422\u0440\u0435\u043a\u0435\u0440 \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a<\/div>\n<p> <input id=\"habSearch\" class=\"input search\" placeholder=\"\u041f\u043e\u0438\u0441\u043a \u043f\u043e \u043f\u0440\u0438\u0432\u044b\u0447\u043a\u0430\u043c\" \/> <\/p>\n<div class=\"btnbar\"> <button class=\"btn small\" id=\"habCollapse\">\u0421\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0432\u0441\u0435<\/button> <button class=\"btn small\" id=\"habExpand\">\u0420\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0432\u0441\u0435<\/button> <\/div>\n<p> <\/div>\n<p> <\/p>\n<div class=\"hab-progress\"> <\/p>\n<div class=\"bar\">\n<div id=\"habitsProgressBar\" style=\"width:0%\"><\/div>\n<\/div>\n<p> <\/p>\n<div class=\"stat\" id=\"habitsProgressStat\">0\/0<\/div>\n<p> <\/div>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83e\udde0 \u0423\u043c \u0438 \u043c\u044b\u0448\u043b\u0435\u043d\u0438\u0435<\/summary>\n<div class=\"habits\" id=\"group-mind\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83d\udcac \u041e\u0431\u0449\u0435\u043d\u0438\u0435 \u0438 \u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u044f<\/summary>\n<div class=\"habits\" id=\"group-comm\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83c\udfaf \u0420\u0430\u0431\u043e\u0442\u0430 \u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c<\/summary>\n<div class=\"habits\" id=\"group-work\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83d\udcaa \u0417\u0434\u043e\u0440\u043e\u0432\u044c\u0435 \u0438 \u0442\u0435\u043b\u043e<\/summary>\n<div class=\"habits\" id=\"group-body\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83e\uddd8 \u042d\u043c\u043e\u0446\u0438\u0438 \u0438 \u043f\u0441\u0438\u0445\u043e\u043b\u043e\u0433\u0438\u044f<\/summary>\n<div class=\"habits\" id=\"group-psy\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83c\udf00 \u0422\u0432\u043e\u0440\u0447\u0435\u0441\u0442\u0432\u043e \u0438 \u0441\u0432\u043e\u0431\u043e\u0434\u0430<\/summary>\n<div class=\"habits\" id=\"group-crea\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83d\udcc8 \u0421\u0430\u043c\u043e\u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0438 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u0435<\/summary>\n<div class=\"habits\" id=\"group-learn\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83c\udfe0 \u0411\u044b\u0442 \u0438 \u043f\u043e\u0440\u044f\u0434\u043e\u043a<\/summary>\n<div class=\"habits\" id=\"group-home\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83d\udcb5 \u0424\u0438\u043d\u0430\u043d\u0441\u044b \u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u044b<\/summary>\n<div class=\"habits\" id=\"group-fin\"><\/div>\n<\/details>\n<p> <\/p>\n<details class=\"hab-group\" open>\n<summary>\ud83c\udf0d \u0411\u0430\u043b\u0430\u043d\u0441 \u0438 \u0434\u0443\u0445\u043e\u0432\u043d\u043e\u0441\u0442\u044c<\/summary>\n<div class=\"habits\" id=\"group-spirit\"><\/div>\n<\/details>\n<p> <\/section>\n<p> <\/p>\n<section class=\"section\" style=\"margin-top:12px\"> <\/p>\n<div class=\"periodbar\" style=\"display:flex;gap:6px;align-items:center;margin:6px 0 12px 0\"> <span class=\"muted\">\u041f\u0435\u0440\u0438\u043e\u0434:<\/span> <button class=\"btn small\" data-period=\"7\">7\u0434<\/button> <button class=\"btn small\" data-period=\"14\">14\u0434<\/button> <button class=\"btn small\" data-period=\"30\">30\u0434<\/button> <button class=\"btn small\" data-period=\"90\">90\u0434<\/button> <button class=\"btn small\" data-period=\"180\">180\u0434<\/button> <span class=\"muted\" id=\"periodHint\"><\/span> <\/div>\n<p> <\/p>\n<div class=\"grid2\"> <\/p>\n<div> <\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">\u041b\u0438\u043d\u0438\u0438 \u043f\u043e \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f\u043c<\/div>\n<p> <canvas id=\"chartMulti\"><\/canvas> <\/p>\n<div class=\"legend\" id=\"lineLegend\"><\/div>\n<p> <\/div>\n<p> <\/p>\n<div> <\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">\u041f\u0430\u0443\u0442\u0438\u043d\u0430: \u0441\u0440\u0435\u0434\u043d\u0438\u0435 \u0437\u0430 \u043f\u0435\u0440\u0438\u043e\u0434<\/div>\n<p> <canvas id=\"radarWeek\"><\/canvas> <\/div>\n<p> <\/div>\n<p> <\/p>\n<div class=\"grid2\" style=\"margin-top:12px\"> <\/p>\n<div> <\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">\u0421\u0440\u0435\u0434\u043d\u0438\u0435 \u0437\u0430 \u043f\u0435\u0440\u0438\u043e\u0434 \u043f\u043e \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f\u043c<\/div>\n<p> <\/p>\n<div id=\"weekBars\"><\/div>\n<p> <\/div>\n<p> <\/p>\n<div> <\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">\u0421\u0440\u0435\u0434\u043d\u0438\u0435 \u0437\u0430 30 \u0434\u043d\u0435\u0439 (\u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c)<\/div>\n<p> <\/p>\n<div id=\"monthBars\"><\/div>\n<p> <\/div>\n<p> <\/div>\n<p> <\/section>\n<p> <\/p>\n<div class=\"muted\" style=\"margin-top:14px; text-align:center;\">\u00a9 2025 FocusScore<\/div>\n<p> <\/div>\n<p> <\/p>\n<div id=\"settingsModal\" class=\"modal\"> <\/p>\n<div class=\"modal-card\"> <\/p>\n<div style=\"display:flex;align-items:center;justify-content:space-between;margin-bottom:8px\"> <\/p>\n<h3 style=\"margin:0\">\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438<\/h3>\n<p> <\/p>\n<div class=\"btnbar\"><button id=\"closeSettings\" class=\"btn\">\u0417\u0430\u043a\u0440\u044b\u0442\u044c<\/button><\/div>\n<p> <\/div>\n<p> <\/p>\n<h4 style=\"margin:8px 0\">\u041a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438<\/h4>\n<p> <\/p>\n<div id=\"catList\"><\/div>\n<p> <\/p>\n<div class=\"btnbar\" style=\"margin-top:8px\"> <input id=\"newCatName\" class=\"input\" placeholder=\"\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438\" style=\"max-width:240px\" \/> <input id=\"newCatDaily\" class=\"input\" type=\"number\" placeholder=\"\u041c\u0438\u043d\/\u0434\u0435\u043d\u044c (0-100)\" style=\"max-width:160px\" \/> <input id=\"newCatWeekly\" class=\"input\" type=\"number\" placeholder=\"\u041c\u0438\u043d\/\u043d\u0435\u0434 (0-100)\" style=\"max-width:160px\" \/> <button id=\"addCat\" class=\"btn primary\">\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044e<\/button> <\/div>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4 style=\"margin:8px 0\">\u0411\u044b\u0441\u0442\u0440\u044b\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f (\u0444\u043e\u0440\u043c\u0430\u0442: \u00ab\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 (+10)\u00bb)<\/h4>\n<p> <\/p>\n<div id=\"qaEditor\"><\/div>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4 style=\"margin:8px 0\">\u041f\u0440\u0438\u0432\u044b\u0447\u043a\u0438<\/h4>\n<p> <\/p>\n<div id=\"habEditor\"><\/div>\n<p> <\/p>\n<div id=\"addHabitForm\" style=\"display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 8px; margin-top: 8px; border: 1px solid var(--border); border-radius: 12px; padding: 10px;\"> <input id=\"newHabName\" class=\"input\" placeholder=\"\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043d\u043e\u0432\u043e\u0439 \u043f\u0440\u0438\u0432\u044b\u0447\u043a\u0438\" style=\"grid-column: 1 \/ -1;\" \/> <select id=\"newHabGroup\" class=\"input\" style=\"grid-column: 1 \/ span 2;\"><\/select> <select id=\"newHabFrequency\" class=\"input\"><\/select> <textarea id=\"newHabDesc\" class=\"input\" placeholder=\"\u041a\u0440\u0430\u0442\u043a\u043e\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 (\u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e)\" style=\"grid-column: 1 \/ -1; height: 60px;\"><\/textarea> <\/div>\n<p> <\/p>\n<div class=\"btnbar\" style=\"margin-top:8px\"> <button id=\"addHabit\" class=\"btn primary\">\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u0440\u0438\u0432\u044b\u0447\u043a\u0443<\/button> <button id=\"bulkHabits\" class=\"btn\">\u0418\u043c\u043f\u043e\u0440\u0442 \u0441\u043f\u0438\u0441\u043a\u043e\u043c<\/button> <\/div>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<div class=\"muted\">\u0421\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u0440\u0430\u0437\u0443. \u042d\u043a\u0441\u043f\u043e\u0440\u0442\/\u0438\u043c\u043f\u043e\u0440\u0442 \u2014 \u043d\u0430 \u0433\u043b\u0430\u0432\u043d\u043e\u0439.<\/div>\n<p> <\/div>\n<p> <\/div>\n<p>  <\/p>\n<div id=\"habitStatsModal\" class=\"modal\"> <\/p>\n<div class=\"modal-card\"> <\/p>\n<div style=\"display:flex;align-items:center;justify-content:space-between;margin-bottom:8px\"> <\/p>\n<h3 style=\"margin:0\">\u0421\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a<\/h3>\n<p> <\/p>\n<div class=\"btnbar\"><button id=\"closeHabitStats\" class=\"btn\">\u0417\u0430\u043a\u0440\u044b\u0442\u044c<\/button><\/div>\n<p> <\/div>\n<p> <\/p>\n<div id=\"habit-stats-content\"><\/div>\n<p> <\/div>\n<p> <\/div>\n<p><script>\/\/ ====== \u041a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u044b \u0438 \u0441\u0442\u0430\u0440\u0442 ======let focus_score_ajax = {};\/\/ \u042d\u0442\u043e\u0442 \u043a\u043e\u0434 \u043d\u0430\u0434\u0451\u0436\u043d\u043e \u043d\u0430\u0439\u0434\u0451\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0442 WordPress, \u0434\u0430\u0436\u0435 \u0435\u0441\u043b\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0430document.addEventListener('DOMContentLoaded', function() { const dataElement = document.getElementById('focus-score-ajax-data'); if (dataElement && dataElement.textContent.trim().startsWith('{')) { focus_score_ajax = JSON.parse(dataElement.textContent); } init(); \/\/ \u0417\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a DOM \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d});const DEFAULT_CATS=[ {id:'family', name:'\u0421\u0435\u043c\u044c\u044f', dailyMin:50, weeklyMin:60}, {id:'health', name:'\u0417\u0434\u043e\u0440\u043e\u0432\u044c\u0435', dailyMin:50, weeklyMin:60}, {id:'sport', name:'\u0421\u043f\u043e\u0440\u0442', dailyMin:50, weeklyMin:60}, {id:'leisure', name:'\u0414\u043e\u0441\u0443\u0433\/\u043e\u0442\u0434\u044b\u0445', dailyMin:40, weeklyMin:55}, {id:'network', name:'\u041d\u0435\u0442\u0432\u043e\u0440\u043a\u0438\u043d\u0433', dailyMin:50, weeklyMin:60}, {id:'invest', name:'\u0418\u043d\u0432\u0435\u0441\u0442\u0438\u0446\u0438\u0438', dailyMin:50, weeklyMin:60}, {id:'pension', name:'\u041f\u0435\u043d\u0441\u0438\u044f\/\u0431\u0443\u0434\u0443\u0449\u0435\u0435', dailyMin:40, weeklyMin:55},];const DEFAULT_IDEAS={ family:['\u0421\u043e\u0432\u043c\u0435\u0441\u0442\u043d\u044b\u0439 \u0443\u0436\u0438\u043d 30 \u043c\u0438\u043d (+30)','\u0417\u0432\u043e\u043d\u043e\u043a \u0431\u043b\u0438\u0437\u043a\u043e\u043c\u0443 15 \u043c\u0438\u043d (+15)','\u041f\u0440\u043e\u0433\u0443\u043b\u043a\u0430 \u0432\u0434\u0432\u043e\u0451\u043c 20 \u043c\u0438\u043d (+20)'], health:['8 \u0441\u0442\u0430\u043a\u0430\u043d\u043e\u0432 \u0432\u043e\u0434\u044b (+10)','\u0421\u043e\u043d +30 \u043c\u0438\u043d (+20)','\u0414\u044b\u0445\u0430\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0430 10 \u043c\u0438\u043d (+10)'], sport:['\u0420\u0430\u0437\u043c\u0438\u043d\u043a\u0430 15 \u043c\u0438\u043d (+10)','\u0425\u043e\u0434\u044c\u0431\u0430 3\u043a \u0448\u0430\u0433\u043e\u0432 (+15)','\u0414\u043e\u043c\u0430\u0448\u043d\u044f\u044f \u0442\u0440\u0435\u043d\u0438\u0440\u043e\u0432\u043a\u0430 25 \u043c\u0438\u043d (+25)'], leisure:['\u041a\u043d\u0438\u0433\u0430 20 \u043c\u0438\u043d (+15)','\u041c\u0443\u0437\u044b\u043a\u0430\/\u043c\u0435\u0434\u0438\u0442\u0430\u0446\u0438\u044f 10 \u043c\u0438\u043d (+10)','\u0424\u0438\u043b\u044c\u043c\/\u0441\u0435\u0440\u0438\u044f \u0441 \u0441\u0435\u043c\u044c\u0451\u0439 (+20)'], network:['1 \u0437\u0432\u043e\u043d\u043e\u043a\/\u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 (+20)','\u041f\u043e\u0441\u0442 \u0432 \u043f\u0440\u043e\u0444.\u0447\u0430\u0442\u0435 (+10)','\u041a\u043e\u0444\u0435-\u0432\u0441\u0442\u0440\u0435\u0447\u0430 (+25)'], invest:['\u0420\u0435\u0432\u0438\u0437\u0438\u044f \u043f\u043e\u0440\u0442\u0444\u0435\u043b\u044f 15 \u043c\u0438\u043d (+15)','\u0414\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0438\u043d\u0432\u0435\u0441\u0442-\u043f\u043b\u0430\u043d (+20)','\u041e\u0431\u0443\u0447\u0430\u044e\u0449\u0435\u0435 \u0432\u0438\u0434\u0435\u043e 20 \u043c\u0438\u043d (+15)'], pension:['\u041e\u0442\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0435 \u0432 \u0434\u043e\u043b\u0433\u043e\u0441\u0447\u0451\u0442 (+20)','\u0421\u0442\u0430\u0442\u044c\u044f \u043f\u043e \u043f\u0435\u043d\u0441\u0438\u0438 (+10)','\u041f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0446\u0435\u043b\u0435\u0439 (+15)'],};const ENTP_GROUPS={ mind:'\ud83e\udde0 \u0423\u043c \u0438 \u043c\u044b\u0448\u043b\u0435\u043d\u0438\u0435', comm:'\ud83d\udcac \u041e\u0431\u0449\u0435\u043d\u0438\u0435 \u0438 \u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u044f', work:'\ud83c\udfaf \u0420\u0430\u0431\u043e\u0442\u0430 \u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c', body:'\ud83d\udcaa \u0417\u0434\u043e\u0440\u043e\u0432\u044c\u0435 \u0438 \u0442\u0435\u043b\u043e', psy:'\ud83e\uddd8 \u042d\u043c\u043e\u0446\u0438\u0438 \u0438 \u043f\u0441\u0438\u0445\u043e\u043b\u043e\u0433\u0438\u044f', crea:'\ud83c\udf00 \u0422\u0432\u043e\u0440\u0447\u0435\u0441\u0442\u0432\u043e \u0438 \u0441\u0432\u043e\u0431\u043e\u0434\u0430', learn:'\ud83d\udcc8 \u0421\u0430\u043c\u043e\u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0438 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u0435', home:'\ud83c\udfe0 \u0411\u044b\u0442 \u0438 \u043f\u043e\u0440\u044f\u0434\u043e\u043a', fin:'\ud83d\udcb5 \u0424\u0438\u043d\u0430\u043d\u0441\u044b \u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u044b', spirit:'\ud83c\udf0d \u0411\u0430\u043b\u0430\u043d\u0441 \u0438 \u0434\u0443\u0445\u043e\u0432\u043d\u043e\u0441\u0442\u044c'};const DEFAULT_HABIT_LISTS={ mind:[{name:'\u041a\u0430\u0436\u0434\u044b\u0439 \u0434\u0435\u043d\u044c \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c 3 \u043d\u043e\u0432\u044b\u0435 \u0438\u0434\u0435\u0438', frequency: 'daily'}], comm:[{name:'\u0420\u0430\u0437 \u0432 \u043d\u0435\u0434\u0435\u043b\u044e \u0437\u0432\u043e\u043d\u0438\u0442\u044c \u0441\u0442\u0430\u0440\u043e\u043c\u0443 \u0434\u0440\u0443\u0433\u0443', frequency: 'weekly'}], work:[{name:'\u041f\u043b\u0430\u043d\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0435\u0434\u0435\u043b\u044e \u0432 \u0432\u043e\u0441\u043a\u0440\u0435\u0441\u0435\u043d\u044c\u0435', frequency: 'weekly'}], body:[{name:'\u0421\u043f\u0430\u0442\u044c 7\u20138 \u0447\u0430\u0441\u043e\u0432 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e', frequency: 'daily'}], psy:[{name:'\u041c\u0435\u0434\u0438\u0442\u0430\u0446\u0438\u044f \u0445\u043e\u0442\u044f \u0431\u044b 5 \u043c\u0438\u043d\u0443\u0442', frequency: 'daily'}], crea:[{name:'\u0420\u0430\u0437 \u0432 \u043c\u0435\u0441\u044f\u0446 \u0443\u0447\u0438\u0442\u044c\u0441\u044f \u043d\u043e\u0432\u043e\u043c\u0443 \u043d\u0430\u0432\u044b\u043a\u0443', frequency: 'monthly'}], learn:[{name:'\u0414\u0435\u043b\u0430\u0442\u044c \u0440\u0435\u0444\u043b\u0435\u043a\u0441\u0438\u044e \u0440\u0430\u0437 \u0432 \u043d\u0435\u0434\u0435\u043b\u044e', frequency: 'weekly'}], home:[{name:'\u0414\u0435\u043b\u0430\u0442\u044c \u0435\u0436\u0435\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u00ab\u0434\u0435\u043d\u044c \u0437\u0430\u0431\u043e\u0442\u044b \u043e \u0434\u043e\u043c\u0435\u00bb', frequency: 'weekly'}], fin:[{name:'\u0420\u0430\u0437 \u0432 \u043c\u0435\u0441\u044f\u0446 \u0434\u0435\u043b\u0430\u0442\u044c \u0444\u0438\u043d\u0430\u043d\u0441\u043e\u0432\u044b\u0439 \u043e\u0431\u0437\u043e\u0440', frequency: 'monthly'}], spirit:[{name:'\u0420\u0430\u0437 \u0432 \u043c\u0435\u0441\u044f\u0446 \u0443\u0435\u0437\u0436\u0430\u0442\u044c \u0432 \u043d\u043e\u0432\u043e\u0435 \u043c\u0435\u0441\u0442\u043e', frequency: 'monthly'}]};\/\/ ====== \u0423\u0442\u0438\u043b\u0438\u0442\u044b ======function fmtDate(d){ const year = d.getFullYear(); const month = String(d.getMonth() + 1).padStart(2, '0'); const day = String(d.getDate()).padStart(2, '0'); return `${year}-${month}-${day}`;}function clamp(v,a,b){ return Math.max(a, Math.min(b, v)); }function colorForScore(v){ v=clamp(v,0,100); const hue = v * 1.2; return `hsl(${hue}, 75%, 45%)`; }function colorByIndex(i){ const hue=(i*57)%360; return `hsl(${hue}, 80%, 45%)`; }function avg(arr){ return Math.round(arr.reduce((s,v)=>s+v,0)\/Math.max(arr.length,1)); }function todayISO(){ return fmtDate(new Date()); }function daysBack(n){ const d=new Date(); d.setDate(d.getDate()-n); return d; }function monthStart(d){ return new Date(d.getFullYear(), d.getMonth(), 1); }function addDays(d, n){ const x=new Date(d); x.setDate(x.getDate()+n); return x; }function debounce(fn, ms){ let t; return (...args)=>{ clearTimeout(t); t=setTimeout(()=>fn(...args), ms); }; }function actionKey(catId,label){ return `${catId}||${label}`; }function getFrequencyText(freq) { switch(freq) { case 'weekly': return '\u0415\u0436\u0435\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u043e'; case 'monthly': return '\u0415\u0436\u0435\u043c\u0435\u0441\u044f\u0447\u043d\u043e'; default: return '\u0415\u0436\u0435\u0434\u043d\u0435\u0432\u043d\u043e'; }}const syncIndicator = document.getElementById('syncStatus');let syncTimeout;function showSyncStatus(status, message) { clearTimeout(syncTimeout); syncIndicator.className = status; syncIndicator.textContent = message; syncIndicator.classList.add('visible'); if (status !== 'syncing') { syncTimeout = setTimeout(() => { syncIndicator.classList.remove('visible'); }, 3000); }}\/\/ ====== WordPress Integration: Data Storage ======async function loadStore() { if (typeof focus_score_ajax === 'undefined' || !focus_score_ajax.ajax_url) { showSyncStatus('error', '\u041e\u0448\u0438\u0431\u043a\u0430! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e\u0442\u0441\u044f \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); try { return JSON.parse(localStorage.getItem('focusScoreData_v12')) || {}; } catch (e) { return {}; } } try { const url = new URL(focus_score_ajax.ajax_url); url.searchParams.append('timestamp', new Date().getTime()); const response = await fetch(url, { method: 'POST', headers: { 'Content-Type': 'application\/x-www-form-urlencoded' }, body: new URLSearchParams({ 'action': 'load_focus_score_data', 'security': focus_score_ajax.nonce }) }); const result = await response.json(); if (result.success) { return JSON.parse(result.data || '{}') || {}; } else { showSyncStatus('error', '\u041e\u0448\u0438\u0431\u043a\u0430 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438! \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435.'); return JSON.parse(localStorage.getItem('focusScoreData_v12')) || {}; } } catch (e) { showSyncStatus('error', '\u041d\u0435\u0442 \u0441\u0432\u044f\u0437\u0438! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e\u0442\u0441\u044f \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); return JSON.parse(localStorage.getItem('focusScoreData_v12')) || {}; }}const saveStore = debounce(function(obj) { const dataToSave = JSON.stringify(obj); showSyncStatus('syncing', '\u0421\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435...'); if (typeof focus_score_ajax === 'undefined' || !focus_score_ajax.ajax_url) { localStorage.setItem('focusScoreData_v12', dataToSave); showSyncStatus('error', '\u041e\u0448\u0438\u0431\u043a\u0430! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u044b \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); return; } fetch(focus_score_ajax.ajax_url, { method: 'POST', headers: { 'Content-Type': 'application\/x-www-form-urlencoded' }, body: new URLSearchParams({ 'action': 'save_focus_score_data', 'security': focus_score_ajax.nonce, 'data': dataToSave }) }) .then(response => response.json()) .then(result => { if (result.success) { showSyncStatus('synced', '\u0421\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u043e \u043e\u043d\u043b\u0430\u0439\u043d'); localStorage.removeItem('focusScoreData_v12_unsynced'); } else { localStorage.setItem('focusScoreData_v12_unsynced', dataToSave); showSyncStatus('error', '\u041e\u0448\u0438\u0431\u043a\u0430! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u044b \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); } }) .catch(e => { localStorage.setItem('focusScoreData_v12_unsynced', dataToSave); showSyncStatus('error', '\u041d\u0435\u0442 \u0441\u0432\u044f\u0437\u0438! \u0414\u0430\u043d\u043d\u044b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u044b \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e.'); });}, 1500);\/\/ ====== \u0421\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 ======let currentDate = todayISO();let currentScores = {};let statsPeriod = 30;\/\/ ====== \u041a\u0430\u043b\u0435\u043d\u0434\u0430\u0440\u044c ======function renderMiniCalendar(dateISO){ const root=document.querySelector('#miniCalendar'); root.innerHTML=''; const d = new Date(dateISO.replace(\/-\/g, '\/')); const ms=monthStart(d); const start = addDays(ms, -((ms.getDay()+6)%7)); const titleDiv=document.createElement('div'); titleDiv.className='btnbar'; titleDiv.style.justifyContent = 'space-between'; titleDiv.innerHTML=`<button class=\"btn small\" id=\"mcPrev\">\u25c0<\/button> <\/p>\n<div class=\"muted\">${d.toLocaleString('ru-RU',{month:'long'})} ${d.getFullYear()}<\/div>\n<p> <button class=\"btn small\" id=\"mcNext\">\u25b6<\/button>`; root.appendChild(titleDiv); const head=document.createElement('div'); head.className='cal-head'; head.innerHTML=['\u041f\u043d','\u0412\u0442','\u0421\u0440','\u0427\u0442','\u041f\u0442','\u0421\u0431','\u0412\u0441'].map(x=>`<\/p>\n<div>${x}<\/div>\n<p>`).join(''); root.appendChild(head); const grid=document.createElement('div'); grid.className='calendar'; root.appendChild(grid); const days=[]; for(let i=0;i<42;i++){ days.push(addDays(start,i)); } days.forEach(day=>{ const iso=fmtDate(day); const cell=document.createElement('div'); cell.className='cal-cell'; if(day.getMonth()!==d.getMonth()) cell.classList.add('dim'); if(iso===currentDate) cell.classList.add('active'); const scoreAvg = store.days[iso] ? catAvg(store.days[iso]) : 0; cell.innerHTML = `<\/p>\n<div class=\"cal-day\">${day.getDate()}<\/div>\n<p> <\/p>\n<div class=\"cal-chip\">${scoreAvg}<\/div>\n<p> <\/p>\n<div class=\"cal-bar\" style=\"width:${scoreAvg}%; background:${colorForScore(scoreAvg)}\"><\/div>\n<p>`; cell.title=iso; cell.onclick=()=>{ loadDay(iso); }; grid.appendChild(cell); }); document.querySelector('#mcPrev').onclick=()=>{ const prev=new Date(d.getFullYear(), d.getMonth()-1, 1); renderMiniCalendar(fmtDate(prev)); }; document.querySelector('#mcNext').onclick=()=>{ const next=new Date(d.getFullYear(), d.getMonth()+1, 1); renderMiniCalendar(fmtDate(next)); };}\/\/ ====== \u0414\u0435\u043d\u044c: ensure, load, setScore ======function ensureDay(date){ if(!store.days[date]){ const scores={}; store.cats.forEach(c => { scores[c.id] = 0; }); store.days[date]=scores; } if(!store.quickApplied[date] || typeof store.quickApplied[date] !== 'object'){ store.quickApplied[date] = {}; } if(!store.habitDone[date]) store.habitDone[date] = {};}function loadDay(date){ ensureDay(date); currentDate=date; currentScores={...store.days[date]}; document.querySelector('#datePicker').value=date; document.querySelector('#todayLabel').textContent=date; renderRows(); recompute(); renderMiniCalendar(date); drawAll(); renderHabits(); updateHabitsProgress();}function setScore(catId, value){ currentScores[catId]=value; store.days[currentDate]={...currentScores}; saveStore(store); const rowToUpdate = document.querySelector(`#rows .row[data-cat-id=\"${catId}\"]`); if (rowToUpdate) { const range = rowToUpdate.querySelector('input[type=range]'); const num = rowToUpdate.querySelector('input[type=number]'); if (range && range.value != value) { range.value = value; } if (num && num.value != value) { num.value = value; } } recompute(); drawAll(); renderMiniCalendar(currentDate);}const setScoreDebounced = debounce(setScore, 200);function renderRows(){ const rowsEl=document.querySelector('#rows'); rowsEl.innerHTML=''; store.cats.forEach(c=>{ const row=document.createElement('div'); row.className='row'; row.dataset.catId = c.id; row.innerHTML=`<\/p>\n<div>${c.name}<\/div>\n<p> <input type=\"range\" min=\"0\" max=\"100\" step=\"5\" value=\"${currentScores[c.id]||0}\"> <input type=\"number\" min=\"0\" max=\"100\" value=\"${currentScores[c.id]||0}\">`; const range=row.children[1]; const num=row.children[2]; range.addEventListener('input',()=>{ num.value=range.value; setScoreDebounced(c.id, +range.value); }); num.addEventListener('input',()=>{ const v=clamp(+num.value,0,100); num.value=v; range.value=v; setScoreDebounced(c.id, v); }); rowsEl.appendChild(row); });}document.querySelector('#datePicker').onchange=(e)=> loadDay(e.target.value);document.querySelector('#todayBtn').onclick=()=> loadDay(todayISO());document.querySelector('#prevDay').onclick=()=>{ const nd=fmtDate(addDays(new Date(currentDate.replace(\/-\/g, '\/')), -1)); loadDay(nd); };document.querySelector('#nextDay').onclick=()=>{ const nd=fmtDate(addDays(new Date(currentDate.replace(\/-\/g, '\/')), 1)); loadDay(nd); };\/\/ ====== \u041f\u043e\u0434\u0441\u0447\u0451\u0442\u044b ======function catAvg(scores){ return avg(Object.values(scores)); }function getLastNDays(n){ const out=[]; for(let i=n-1;i>=0;i--){ const d=fmtDate(daysBack(i)); ensureDay(d); out.push({date:d, scores: store.days[d]}); } return out; }function categoryAverages(period){ const last=getLastNDays(period); return store.cats.map(c=> ({id:c.id,name:c.name, avg: avg(last.map(d=> (d.scores[c.id]||0))) })); }function deficitsToday(){ return store.cats.map(c=> ({c, v: currentScores[c.id]||0, min:c.dailyMin})).filter(x=> x.v<x.min).sort((a,b)=> a.v-b.v); }\/\/ ====== Quick Actions ======function isActionUsed(date, key){ const qa=store.quickApplied[date]; return !!(qa && qa[key]); }function markActionUsed(date, key){ if(!store.quickApplied[date]) store.quickApplied[date]={}; store.quickApplied[date][key]=true; saveStore(store); }function applyQuickAction(catId, add, label){ const key=actionKey(catId,label); if(isActionUsed(currentDate, key)) return; setScore(catId, clamp((currentScores[catId]||0)+add,0,100)); markActionUsed(currentDate, key); recompute(); }\/\/ ====== KPI\/\u0434\u0435\u0444\u0438\u0446\u0438\u0442\u044b\/\u0431\u044b\u0441\u0442\u0440\u044b\u0435 ======function renderKPIs(){ const openStates = new Map(); document.querySelectorAll('#quickBox details').forEach(d => { if (d.dataset.catId) { openStates.set(d.dataset.catId, d.open); } }); document.querySelector('#kpiToday').textContent = catAvg(currentScores); document.querySelector('#kpiWeek').textContent = avg(getLastNDays(7).map(d=>catAvg(d.scores))); document.querySelector('#kpiMonth').textContent = avg(getLastNDays(30).map(d=>catAvg(d.scores))); const def=deficitsToday(); document.querySelector('#kpiDef').textContent = def.length; const box=document.querySelector('#deficitsBox'); box.innerHTML=''; if(def.length===0){ box.innerHTML='<\/p>\n<div class=\"muted\">\u0412\u0441\u0435 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0438 \u0432 \u0437\u0435\u043b\u0451\u043d\u043e\u0439 \u0437\u043e\u043d\u0435<\/div>\n<p>'; } else { def.forEach(({c,v,min})=>{ const item=document.createElement('div'); item.className='section warn'; item.style.padding='10px'; item.style.marginBottom='8px'; item.innerHTML=`<\/p>\n<div class=\"btnbar\" style=\"justify-content:space-between\">\n<div><b>${c.name}<\/b> \u2014 ${v}\/${min}<\/div>\n<\/div>\n<p>`; box.appendChild(item); }); }  const qb=document.querySelector('#quickBox'); qb.innerHTML=''; store.cats.forEach(c=>{ const ideas=(store.ideas[c.id]||[]); if (ideas.length === 0) return;  const details = document.createElement('details'); details.className = 'qa-group'; details.dataset.catId = c.id; if (openStates.get(c.id)) { details.open = true; } const summary = document.createElement('summary'); summary.textContent = c.name; details.appendChild(summary);  const btnContainer = document.createElement('div'); btnContainer.className = 'btnbar'; btnContainer.style.marginTop = '8px'; ideas.forEach(txt=>{ const key=actionKey(c.id, txt); const used=isActionUsed(currentDate, key); const b=document.createElement('button'); b.className='btn small'; b.textContent= used ? `${txt} \u2713` : txt; if(used) b.disabled=true; b.onclick=()=>{ if(isActionUsed(currentDate,key)) return; const m=txt.match(\/\$\\s*\\+\\s*(\\d+)\\s*\$\/); const add=m ? +m[1] : 10; applyQuickAction(c.id, add, txt); }; btnContainer.appendChild(b); }); details.appendChild(btnContainer); qb.appendChild(details); });}function recompute(){ renderKPIs(); }\/\/ ====== \u0413\u0440\u0430\u0444\u0438\u043a\u0438 ======const cMulti=document.querySelector('#chartMulti'); const ctxM=cMulti.getContext('2d');function resizeCanvas(cv, ctx){ const dpr=window.devicePixelRatio||1; const w=cv.clientWidth, h=cv.clientHeight; cv.width=w*dpr; cv.height=h*dpr; ctx.setTransform(dpr,0,0,dpr,0,0); }function perCategorySeries(period){ const days=getLastNDays(period); return store.cats.map(c=>({ name:c.name, values: days.map(d=> (d.scores[c.id]||0)) })); }function drawMultiLine(cv, ctx, series){ resizeCanvas(cv, ctx); const w=cv.clientWidth, h=cv.clientHeight; ctx.clearRect(0,0,w,h); ctx.strokeStyle=getComputedStyle(document.documentElement).getPropertyValue('--border'); ctx.lineWidth=1; for(let i=0;i<=5;i++){ const y=h-(h*i\/5); ctx.beginPath(); ctx.moveTo(0,y); ctx.lineTo(w,y); ctx.stroke(); } const maxLen=Math.max(...series.map(s=>s.values.length)); series.forEach((s,idx)=>{ ctx.beginPath(); ctx.lineWidth=2; ctx.strokeStyle=colorByIndex(idx); s.values.forEach((v,i)=>{ const x=(i*(w\/Math.max(1,maxLen-1))); const y=h-(clamp(v,0,100)\/100)*h; if(i===0) ctx.moveTo(x,y); else ctx.lineTo(x,y); }); ctx.stroke(); }); const legend=document.querySelector('#lineLegend'); legend.innerHTML=''; series.forEach((s,idx)=>{ const span=document.createElement('span'); span.innerHTML=`<i class=\"dot\" style=\"width:10px;height:10px;border-radius:2px;display:inline-block;background:${colorByIndex(idx)}; margin-right: 4px;\"><\/i>${s.name}`; legend.appendChild(span); }); }const rW=document.querySelector('#radarWeek'); const rCtx=rW.getContext('2d');function drawRadar(cv, ctx, labels, values){ const root=document.documentElement; const gridColor=getComputedStyle(root).getPropertyValue('--border').trim()||'#e5e7eb'; const labelColor=getComputedStyle(root).getPropertyValue('--muted').trim()||'#6b7280'; const fillColor=getComputedStyle(root).getPropertyValue('--accent2').trim()||'#0ea5e9'; resizeCanvas(cv, ctx); const w=cv.clientWidth, h=cv.clientHeight; ctx.clearRect(0,0,w,h); const cx=w\/2, cy=h\/2; const radius=Math.min(w,h)*0.38; const steps=5; ctx.strokeStyle=gridColor; ctx.lineWidth=1; ctx.fillStyle='transparent'; for(let s=1;s<=steps;s++){ const r=radius*(s\/steps); ctx.beginPath(); labels.forEach((_,i)=>{ const a=(i\/labels.length)*Math.PI*2 - Math.PI\/2; const x=cx + Math.cos(a)*r; const y=cy + Math.sin(a)*r; if(i===0) ctx.moveTo(x,y); else ctx.lineTo(x,y); }); ctx.closePath(); ctx.stroke(); } ctx.strokeStyle=gridColor; ctx.fillStyle=labelColor; ctx.font='12px system-ui'; ctx.textBaseline='middle'; labels.forEach((label,i)=>{ const a=(i\/labels.length)*Math.PI*2 - Math.PI\/2; const x=cx + Math.cos(a)*radius; const y=cy + Math.sin(a)*radius; ctx.beginPath(); ctx.moveTo(cx,cy); ctx.lineTo(x,y); ctx.stroke(); const lx=cx + Math.cos(a)*(radius+14); const ly=cy + Math.sin(a)*(radius+14); const tw=ctx.measureText(label).width; ctx.fillText(label, lx - tw\/2, ly); }); ctx.globalAlpha=0.25; ctx.fillStyle=fillColor; ctx.strokeStyle=fillColor; ctx.beginPath(); values.forEach((v,i)=>{ const a=(i\/labels.length)*Math.PI*2 - Math.PI\/2; const r=radius*(clamp(v,0,100)\/100); const x=cx + Math.cos(a)*r; const y=cy + Math.sin(a)*r; if(i===0) ctx.moveTo(x,y); else ctx.lineTo(x,y); }); ctx.closePath(); ctx.fill(); ctx.globalAlpha=1; ctx.stroke(); }function drawBars(containerId, data){ const container=document.querySelector(containerId); container.innerHTML=''; data.sort((a,b)=> b.avg-a.avg).forEach(r=>{ const line=document.createElement('div'); line.style.margin='6px 0'; line.innerHTML=`<\/p>\n<div style=\"display:flex;align-items:center;gap:10px\">\n<div style=\"width:160px\">${r.name}<\/div>\n<div style=\"flex:1;background:rgba(2,132,199,.12);border:1px solid var(--border);height:12px;border-radius:999px;overflow:hidden\">\n<div style=\"width:${r.avg}%;height:100%;background:var(--accent2)\"><\/div>\n<\/div>\n<div style=\"width:40px;text-align:right\"><b>${r.avg}<\/b><\/div>\n<\/div>\n<p>`; container.appendChild(line); }); }function drawAll(){ document.querySelector('#periodHint').textContent=`(${statsPeriod} \u0434\u043d\u0435\u0439)`; drawMultiLine(cMulti, ctxM, perCategorySeries(statsPeriod)); const avgs=categoryAverages(statsPeriod); drawRadar(rW, rCtx, avgs.map(x=>x.name), avgs.map(x=>x.avg)); drawBars('#weekBars', avgs); drawBars('#monthBars', categoryAverages(30)); }[...document.querySelectorAll('.periodbar [data-period]')].forEach(b=> b.onclick=()=>{ statsPeriod=+b.dataset.period; drawAll(); });\/\/ ====== \u042d\u043a\u0441\u043f\u043e\u0440\u0442\/\u0438\u043c\u043f\u043e\u0440\u0442 ======function download(filename, content, type='text\/plain'){ const blob=new Blob([content],{type}); const url=URL.createObjectURL(blob); const a=document.createElement('a'); a.href=url; a.download=filename; document.body.appendChild(a); a.click(); setTimeout(()=>{ URL.revokeObjectURL(url); a.remove(); },0); }document.querySelector('#exportJSON').onclick=()=> download('focusscore.json', JSON.stringify(store,null,2), 'application\/json');document.querySelector('#exportCSV').onclick=()=>{ const allDates=Object.keys(store.days).sort(); const cats=store.cats.map(c=>c.id); let csv='date,'+store.cats.map(c=>c.name).join(',')+'\\n'; allDates.forEach(d=>{ const row=[d]; cats.forEach(id=> row.push(store.days[d]?.[id]??0)); csv+=row.join(',')+'\\n'; }); download('focusscore.csv', csv, 'text\/csv'); };document.querySelector('#importFile').onchange=(e)=>{ const file=e.target.files[0]; if(!file) return; const reader=new FileReader(); reader.onload=()=>{ try{ const data=JSON.parse(reader.result); if(data.cats && data.days){ store=data; if(!store.quickApplied) store.quickApplied={}; if(!store.ideas) store.ideas={}; if(!store.habits) store.habits=[]; if(!store.habitDone) store.habitDone={}; saveStore(store); loadDay(todayISO()); } }catch(err){ alert('\u041d\u0435\u0432\u0435\u0440\u043d\u044b\u0439 JSON'); } }; reader.readAsText(file); };\/\/ ====== \u041f\u0440\u0438\u0432\u044b\u0447\u043a\u0438 ======function daysBetweenISO(aISO,bISO){ const a=new Date(aISO.replace(\/-\/g, '\/')); const b=new Date(bISO.replace(\/-\/g, '\/')); return Math.round((b-a)\/86400000); }function habitLevel(streak){ if(streak>=91) return {name:'\u0413\u0443\u0440\u0443 \u0445\u0430\u043e\u0441\u0430 \ud83d\udd2e', idx:4}; if(streak>=31) return {name:'\u041c\u0430\u044d\u0441\u0442\u0440\u043e \u043f\u043e\u0442\u043e\u043a\u0430 \ud83c\udfb6', idx:3}; if(streak>=8) return {name:'\u042d\u043d\u0435\u0440\u0433\u0435\u0442\u0438\u043a\u2011\u0434\u0436\u0435\u0434\u0430\u0439 \u26a1\ufe0f', idx:2}; if(streak>=1) return {name:'\u041d\u043e\u0432\u0438\u0447\u043e\u043a\u2011\u0444\u043e\u043a\u0443\u0441\u043d\u0438\u043a \ud83c\udfa9', idx:1}; return {name:'\u2014', idx:0}; }function ensureHabitDay(date){ if(!store.habitDone[date]) store.habitDone[date]={}; }function isHabitDoneToday(id){ ensureHabitDay(currentDate); return !!store.habitDone[currentDate][id]; }function markHabitDone(id){ ensureHabitDay(currentDate); if(store.habitDone[currentDate][id]) return; const h=store.habits.find(x=>x.id===id); if(!h) return; const today = new Date(currentDate.replace(\/-\/g, '\/')); let streak = h.streak || 0; if (h.lastDoneDate) { const last = new Date(h.lastDoneDate.replace(\/-\/g, '\/')); const frequency = h.frequency || 'daily'; switch (frequency) { case 'weekly': const lastWeekStart = addDays(last, -(last.getDay() + 6) % 7); const thisWeekStart = addDays(today, -(today.getDay() + 6) % 7); const weekDiff = Math.round((thisWeekStart - lastWeekStart) \/ (1000 * 60 * 60 * 24));  if (weekDiff === 7) { streak++; } else if (weekDiff > 7) { streak = 1; } break;  case 'monthly': const monthDiff = (today.getFullYear() * 12 + today.getMonth()) - (last.getFullYear() * 12 + last.getMonth()); if (monthDiff === 1) { streak++; } else if (monthDiff > 1) { streak = 1; } break; default: \/\/ 'daily' const dayDiff = daysBetweenISO(h.lastDoneDate, currentDate); if (dayDiff === 1) { streak++; } else if (dayDiff > 1) { streak = 1; } break; } } else { streak = 1; } h.streak = streak; h.total = (h.total || 0) + 1; h.lastDoneDate = currentDate; store.habitDone[currentDate][id]=true; saveStore(store); renderHabits(); updateHabitsProgress();}function renderHabitCard(h){ const lvl=habitLevel(h.streak||0); const done=isHabitDoneToday(h.id); const card=document.createElement('div'); card.className='habit'; const descriptionHTML = h.description ? `<\/p>\n<div class=\"desc\">${h.description}<\/div>\n<p>` : ''; const freqText = getFrequencyText(h.frequency); card.innerHTML=` <\/p>\n<div><input type=\"checkbox\" style=\"width:20px;height:20px\" ${done?'checked':''}><\/div>\n<p> <\/p>\n<div> <\/p>\n<div class=\"title\">${h.name}<\/div>\n<p> ${descriptionHTML} <\/p>\n<div class=\"meta\"> <span>${lvl.name}<\/span> \u2022  <span class=\"lvl-badge\">${freqText}<\/span> \u2022  <span>\u0441\u0435\u0440\u0438\u044f ${h.streak||0}<\/span> \u2022  <span>\u0432\u0441\u0435\u0433\u043e ${h.total||0}<\/span> <\/div>\n<p> <\/p>\n<div class=\"hbar\" style=\"margin-top:6px\">\n<div style=\"width:${Math.min(100,(h.streak||0))}%\"><\/div>\n<\/div>\n<p> <\/div>\n<p>`; const cb=card.querySelector('input'); cb.onchange=()=>{ if (cb.checked) { markHabitDone(h.id); cb.disabled = true; } }; if (done) cb.disabled = true; return card;}function renderHabits(){ Object.keys(ENTP_GROUPS).forEach(key => { const el = document.querySelector(`#group-${key}`); if(el) el.innerHTML=''; const summary = el?.parentElement.querySelector('summary'); if(summary) summary.textContent = ENTP_GROUPS[key]; }); const q=(document.querySelector('#habSearch').value||'').toLowerCase(); store.habits.forEach(h=>{ if(q && !h.name.toLowerCase().includes(q)) return; const targetSel = `#group-${h.group}`; const host=document.querySelector(targetSel); if(host) host.appendChild(renderHabitCard(h)); });}document.querySelector('#habSearch').oninput=()=> { renderHabits(); };document.querySelector('#habCollapse').onclick=()=>{ document.querySelectorAll('.hab-group').forEach(d=> d.removeAttribute('open')); };document.querySelector('#habExpand').onclick=()=>{ document.querySelectorAll('.hab-group').forEach(d=> d.setAttribute('open','')); };function updateHabitsProgress(){ ensureHabitDay(currentDate); const today=store.habitDone[currentDate]||{}; const doneCnt=Object.keys(today).length; const total=store.habits.length||0; const pct= total? Math.round((doneCnt\/total)*100) : 0; document.querySelector('#habitsProgressBar').style.width = pct+'%'; document.querySelector('#habitsProgressStat').textContent = `${doneCnt}\/${total}`;}\/\/ ====== \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0438 \u0421\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 ======const settingsModal=document.querySelector('#settingsModal');const habitStatsModal = document.querySelector('#habitStatsModal');document.querySelector('#openSettings').onclick=()=>{ renderSettings(); settingsModal.classList.add('open'); };document.querySelector('#closeSettings').onclick=()=> settingsModal.classList.remove('open');document.querySelector('#openHabitStats').onclick=()=>{ renderHabitStats(); habitStatsModal.classList.add('open'); };document.querySelector('#closeHabitStats').onclick=()=> habitStatsModal.classList.remove('open');function renderHabitStats() { const content = document.getElementById('habit-stats-content'); content.innerHTML = ''; const todayDone = Object.keys(store.habitDone[todayISO()] || {}).length; const totalHabits = store.habits.length; const todayProgress = totalHabits > 0 ? Math.round((todayDone \/ totalHabits) * 100) : 0; const topStreaks = [...store.habits].sort((a, b) => (b.streak || 0) - (a.streak || 0)).slice(0, 3); const topTotals = [...store.habits].sort((a, b) => (b.total || 0) - (a.total || 0)).slice(0, 3); let html = ` <\/p>\n<h4>\u041e\u0431\u0449\u0438\u0439 \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441 \u0441\u0435\u0433\u043e\u0434\u043d\u044f: ${todayDone} \u0438\u0437 ${totalHabits} (${todayProgress}%)<\/h4>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4>\u0422\u043e\u043f-3 \u043f\u043e \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0441\u0435\u0440\u0438\u0438:<\/h4>\n<p> <\/p>\n<ul> ${topStreaks.map(h => `<\/p>\n<li>${h.name} (${h.streak || 0} ${getFrequencyText(h.frequency).toLowerCase().replace(\/.$\/, '\u044c')})<\/li>\n<p>`).join('')} <\/ul>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4>\u0422\u043e\u043f-3 \u043f\u043e \u043e\u0431\u0449\u0435\u043c\u0443 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044e:<\/h4>\n<p> <\/p>\n<ul> ${topTotals.map(h => `<\/p>\n<li>${h.name} (${h.total || 0} \u0440\u0430\u0437)<\/li>\n<p>`).join('')} <\/ul>\n<p> <\/p>\n<div class=\"hr\"><\/div>\n<p> <\/p>\n<h4>\u0412\u0441\u0435 \u043f\u0440\u0438\u0432\u044b\u0447\u043a\u0438:<\/h4>\n<p> <\/p>\n<div style=\"display: grid; grid-template-columns: 1fr auto auto; gap: 8px; align-items: center;\"> <\/p>\n<div class=\"muted\">\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435<\/div>\n<p> <\/p>\n<div class=\"muted\">\u0421\u0435\u0440\u0438\u044f<\/div>\n<p> <\/p>\n<div class=\"muted\">\u0412\u0441\u0435\u0433\u043e<\/div>\n<p> ${store.habits.map(h => ` <\/p>\n<div>${h.name}<\/div>\n<p> <\/p>\n<div style=\"text-align: right;\">${h.streak || 0}<\/div>\n<p> <\/p>\n<div style=\"text-align: right;\">${h.total || 0}<\/div>\n<p> `).join('')} <\/div>\n<p> `; content.innerHTML = html;}function renderSettings(){ renderCatList(); renderIdeasEditor(); renderHabitsEditor(); const newHabGroupSelect = document.querySelector('#newHabGroup'); newHabGroupSelect.innerHTML = ''; for (const [key, value] of Object.entries(ENTP_GROUPS)) { newHabGroupSelect.innerHTML += `<option value=\"${key}\">${value}<\/option>`; } const newHabFreqSelect = document.querySelector('#newHabFrequency'); newHabFreqSelect.innerHTML = `<option value=\"daily\">\u0415\u0436\u0435\u0434\u043d\u0435\u0432\u043d\u043e<\/option><option value=\"weekly\">\u0415\u0436\u0435\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u043e<\/option><option value=\"monthly\">\u0415\u0436\u0435\u043c\u0435\u0441\u044f\u0447\u043d\u043e<\/option> `;}function renderCatList(){ const wrap=document.querySelector('#catList'); wrap.innerHTML=''; store.cats.forEach((c, idx)=>{ const line=document.createElement('div'); line.className='kbar'; line.innerHTML=`<\/p>\n<div>${idx+1}<\/div>\n<p> <input class=\"input\" value=\"${c.name}\" \/> <input class=\"input\" type=\"number\" value=\"${c.dailyMin}\" \/> <input class=\"input\" type=\"number\" value=\"${c.weeklyMin}\" \/> <\/p>\n<div><button class=\"btn small danger\">\u0423\u0434\u0430\u043b\u0438\u0442\u044c<\/button><\/div>\n<p> <\/p>\n<div><button class=\"btn small\">\u0421\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c<\/button><\/div>\n<p>`; const nameEl=line.children[1]; const dEl=line.children[2]; const wEl=line.children[3]; const del=line.children[4].firstChild; const save=line.children[5].firstChild; del.onclick=()=>{ const id=c.id; store.cats.splice(idx,1); Object.keys(store.days).forEach(date=>{ if(store.days[date]) delete store.days[date][id]; }); delete store.ideas[id]; Object.keys(store.quickApplied).forEach(dt=>{ if(store.quickApplied[dt]){ Object.keys(store.quickApplied[dt]).forEach(k=>{ if(k.startsWith(id+'||')||k.startsWith('DEF||'+id)) delete store.quickApplied[dt][k]; }); } }); saveStore(store); renderSettings(); loadDay(currentDate); }; save.onclick=()=>{ c.name=nameEl.value.trim()||c.name; c.dailyMin=clamp(+dEl.value||0,0,100); c.weeklyMin=clamp(+wEl.value||0,0,100); saveStore(store); renderSettings(); loadDay(currentDate); }; wrap.appendChild(line); }); }document.querySelector('#addCat').onclick=()=>{ const name=document.querySelector('#newCatName').value.trim(); if(!name) return; const daily=clamp(+document.querySelector('#newCatDaily').value||0,0,100); const weekly=clamp(+document.querySelector('#newCatWeekly').value||0,0,100); const id = name.toLowerCase().replace(\/[^a-z\u0430-\u044f0-9]+\/gi,'_') + '_' + Math.random().toString(36).slice(2,6); store.cats.push({id,name, dailyMin:daily, weeklyMin:weekly}); Object.keys(store.days).forEach(date=>{ if(!store.days[date]) store.days[date]={}; store.days[date][id]=0; }); store.ideas[id]=[]; saveStore(store); document.querySelector('#newCatName').value=''; document.querySelector('#newCatDaily').value=''; document.querySelector('#newCatWeekly').value=''; renderSettings(); loadDay(currentDate); drawAll(); };function renderIdeasEditor(){ const wrap=document.querySelector('#qaEditor'); wrap.innerHTML=''; store.cats.forEach(c => { const catContainer = document.createElement('div'); catContainer.style.margin = '12px 0'; catContainer.innerHTML = `<\/p>\n<div class=\"muted\" style=\"margin-bottom:6px\">${c.name}<\/div>\n<p>`; const list = document.createElement('div'); list.style.display = 'flex'; list.style.flexDirection = 'column'; list.style.gap = '6px'; (store.ideas[c.id] || []).forEach((idea, idx) => { const item = document.createElement('div'); item.style.display = 'flex'; item.style.gap = '8px'; item.innerHTML = `<input class=\"input\" value=\"${idea}\" style=\"flex:1;\" \/> <button class=\"btn small danger\">\u0423\u0434\u0430\u043b\u0438\u0442\u044c<\/button>`; const inputEl = item.querySelector('input'); const deleteBtn = item.querySelector('button'); inputEl.onblur = () => { if (store.ideas[c.id]) { store.ideas[c.id][idx] = inputEl.value.trim(); saveStore(store); recompute(); } }; deleteBtn.onclick = () => { if (store.ideas[c.id]) { store.ideas[c.id].splice(idx, 1); saveStore(store); renderIdeasEditor(); recompute(); } }; list.appendChild(item); }); catContainer.appendChild(list); const addContainer = document.createElement('div'); addContainer.style.display = 'flex'; addContainer.style.gap = '8px'; addContainer.style.marginTop = '8px'; addContainer.innerHTML = `<input class=\"input\" placeholder=\"\u041d\u043e\u0432\u043e\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435, \u043d\u0430\u043f\u0440. \u041f\u0440\u043e\u0433\u0443\u043b\u043a\u0430 (+15)\" style=\"flex:1;\" \/> <button class=\"btn small primary\">\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c<\/button>`; const addInput = addContainer.querySelector('input'); const addBtn = addContainer.querySelector('button'); addBtn.onclick = () => { const newIdea = addInput.value.trim(); if (newIdea) { if (!store.ideas[c.id]) { store.ideas[c.id] = []; } store.ideas[c.id].push(newIdea); saveStore(store); renderIdeasEditor(); recompute(); } }; catContainer.appendChild(addContainer); wrap.appendChild(catContainer); });}function renderHabitsEditor() { const wrap = document.querySelector('#habEditor'); wrap.innerHTML = ''; if (!store.habits || store.habits.length === 0) { wrap.innerHTML = '<\/p>\n<div class=\"muted\">\u041d\u0435\u0442 \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a \u2014 \u0434\u043e\u0431\u0430\u0432\u044c \u043d\u0438\u0436\u0435<\/div>\n<p>'; return; } store.habits.forEach((h, idx) => { const line = document.createElement('div'); line.style.cssText = ` border: 1px solid var(--border); border-radius: 12px; padding: 10px; margin-bottom: 8px; display: grid; grid-template-columns: 1fr; gap: 8px; `; const row1 = document.createElement('div'); row1.style.display = 'grid'; row1.style.gridTemplateColumns = '2fr 1fr 1fr'; row1.style.gap = '8px'; const nameInput = document.createElement('input'); nameInput.className = 'input'; nameInput.value = h.name; const groupSelect = document.createElement('select'); groupSelect.className = 'input'; for (const [key, value] of Object.entries(ENTP_GROUPS)) { const option = document.createElement('option'); option.value = key; option.textContent = value; if (h.group === key) option.selected = true; groupSelect.appendChild(option); }  const freqSelect = document.createElement('select'); freqSelect.className = 'input'; freqSelect.innerHTML = `<option value=\"daily\">\u0415\u0436\u0435\u0434\u043d\u0435\u0432\u043d\u043e<\/option><option value=\"weekly\">\u0415\u0436\u0435\u043d\u0435\u0434\u0435\u043b\u044c\u043d\u043e<\/option><option value=\"monthly\">\u0415\u0436\u0435\u043c\u0435\u0441\u044f\u0447\u043d\u043e<\/option>`; freqSelect.value = h.frequency || 'daily'; row1.appendChild(nameInput); row1.appendChild(groupSelect); row1.appendChild(freqSelect); line.appendChild(row1); const descInput = document.createElement('textarea'); descInput.className = 'input'; descInput.placeholder = '\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435'; descInput.value = h.description || ''; descInput.style.height = '60px'; line.appendChild(descInput); const buttonBar = document.createElement('div'); buttonBar.className = 'btnbar'; buttonBar.style.justifyContent = 'flex-end'; const deleteBtn = document.createElement('button'); deleteBtn.className = 'btn small danger'; deleteBtn.textContent = '\u0423\u0434\u0430\u043b\u0438\u0442\u044c'; deleteBtn.onclick = () => { store.habits.splice(idx, 1); saveStore(store); renderHabitsEditor(); renderHabits(); updateHabitsProgress(); }; const saveBtn = document.createElement('button'); saveBtn.className = 'btn small primary'; saveBtn.textContent = '\u0421\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c'; saveBtn.onclick = () => { h.name = nameInput.value.trim() || h.name; h.group = groupSelect.value; h.frequency = freqSelect.value; h.description = descInput.value.trim(); saveStore(store); renderHabitsEditor(); renderHabits(); }; buttonBar.appendChild(deleteBtn); buttonBar.appendChild(saveBtn); line.appendChild(buttonBar); wrap.appendChild(line); });}document.querySelector('#addHabit').onclick=()=>{ const name = document.querySelector('#newHabName').value.trim(); if(!name) return; const group = document.querySelector('#newHabGroup').value; const frequency = document.querySelector('#newHabFrequency').value; const description = document.querySelector('#newHabDesc').value.trim(); const id = 'hab_'+Math.random().toString(36).slice(2,8); store.habits.push({id, name, group, frequency, description, streak:0, total:0, lastDoneDate:null}); saveStore(store); document.querySelector('#newHabName').value=''; document.querySelector('#newHabDesc').value=''; renderHabitsEditor(); renderHabits(); updateHabitsProgress();};document.querySelector('#bulkHabits').onclick=()=>{ const raw=prompt('\u0412\u0441\u0442\u0430\u0432\u044c \u0441\u043f\u0438\u0441\u043e\u043a \u043f\u0440\u0438\u0432\u044b\u0447\u0435\u043a, \u043f\u043e \u043e\u0434\u043d\u043e\u0439 \u0432 \u0441\u0442\u0440\u043e\u043a\u0435'); if(!raw) return; const lines=raw.split(\/\\n+\/).map(s=>s.trim()).filter(Boolean).slice(0,200); lines.forEach(name=>{ const id='hab_'+Math.random().toString(36).slice(2,8); store.habits.push({id,name,group:'mind',frequency:'daily',description:'',streak:0,total:0,lastDoneDate:null}); }); saveStore(store); renderHabitsEditor(); renderHabits(); updateHabitsProgress(); };\/\/ ====== \u0421\u0442\u0430\u0440\u0442 ======let store = {};async function init(){ store = await loadStore(); if(!store.cats || store.cats.length === 0) store.cats=DEFAULT_CATS; if(!store.days) store.days={}; if(!store.ideas) store.ideas = JSON.parse(JSON.stringify(DEFAULT_IDEAS)); if(!store.quickApplied) store.quickApplied={}; if(!store.habits) store.habits=[]; if(!store.habitDone) store.habitDone={}; if(store.habits.length===0){ const pushMany=(group, arr)=> arr.forEach(h_info=> store.habits.push({id:'hab_'+Math.random().toString(36).slice(2,8), name: h_info.name, frequency: h_info.frequency, group, description: '', streak:0,total:0,lastDoneDate:null})); for (const group in DEFAULT_HABIT_LISTS) { if (DEFAULT_HABIT_LISTS.hasOwnProperty(group)) { pushMany(group, DEFAULT_HABIT_LISTS[group]); } } } const d=todayISO(); ensureDay(d); loadDay(currentDate); window.addEventListener('resize', debounce(drawAll, 200));}<\/script><\/body><\/html>[\/et_pb_code][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»][et_pb_column type=»4_4″ _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»][et_pb_text _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»]<\/p>\n<p style=\"text-align: center;\"><a href=\"https:\/\/focus-tracker.panshiny.ru\/wp-admin\">\u0412\u0425\u041e\u0414<\/a><\/p>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=»1″ fullwidth=»on» _builder_version=»4.27.4″ _module_preset=»default» global_colors_info=»{}»][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u0412\u0425\u041e\u0414<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-7","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/pages\/7","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/comments?post=7"}],"version-history":[{"count":17,"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":35,"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/pages\/7\/revisions\/35"}],"wp:attachment":[{"href":"https:\/\/focus-tracker.panshiny.ru\/index.php\/wp-json\/wp\/v2\/media?parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}