/* Styles 7/8 (lines 1417–1673 of styles.css until v122) — feedback, managers, tasks add field, games, workshop, social, What's new, report.
   Order matters (a later rule wins): index.html loads css/1-… → css/8-… in this order; see docs/REFACTOR.md step 4. */
/* ---- FEEDBACK (feedback.js, v76) ---- */
.c-feedback{background:#4f8fe0;}
.set-txt small.fb-new{color:var(--accent); font-weight:600;}
#feedback-body{padding:16px 16px calc(var(--safe-bottom) + 24px);}
.fb-tabs{margin-bottom:6px;}
.fb-dot{display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--accent); vertical-align:middle;}
.fb-cats{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
.fb-cat{background:var(--panel-2); border:1px solid var(--line); color:var(--text); border-radius:var(--r-sm); padding:11px 8px; font-size:14px; cursor:pointer; text-align:left;}
.fb-cat.on{border-color:var(--accent); background:var(--accent-dim); color:var(--accent); font-weight:600;}
.fb-count{text-align:right; font-size:12px; color:var(--muted); margin-top:4px;}
.fb-send{width:100%; margin-top:6px; padding:13px 16px; font-size:15px;}
.fb-send:disabled{opacity:.55; cursor:default;}
.fb-status{color:var(--bad); min-height:1em;}
.fb-item{display:block; width:100%; text-align:left; background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; margin-top:10px; color:var(--text); font:inherit; cursor:pointer;}
.fb-meta{font-size:12.5px; color:var(--muted);}
.fb-title{font-size:15.5px; font-weight:600; margin:3px 0 6px; word-wrap:break-word;}
.fb-state{display:inline-block; font-size:12.5px; color:var(--muted); background:var(--panel-2); border-radius:9px; padding:2px 9px;}
.fb-state.read{color:var(--good, #3fa66a);}
.fb-state.answer{color:var(--accent); background:var(--accent-dim); font-weight:600;}
.fb-text{white-space:pre-wrap; word-wrap:break-word; margin:10px 0 6px; font-size:14.5px;}
.fb-answer{white-space:pre-wrap; word-wrap:break-word; margin-top:10px; background:var(--accent-dim); border-radius:var(--r-sm); padding:10px 12px; font-size:14.5px;}
.fb-answer .fb-meta{margin-bottom:4px;}
.fb-empty{text-align:center; margin-top:30px;}

/* ---- MANAGERS (managers.js, v77) ---- */
.mgr-current{display:flex; align-items:center; gap:12px; width:100%; text-align:left; background:var(--panel-2); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; color:var(--text); cursor:pointer; font:inherit;}
.mgr-av{flex:0 0 52px; width:52px; height:52px; border-radius:50%; overflow:hidden; display:block;}
.mgr-av svg{width:100%; height:100%; display:block;}
.mgr-txt{flex:1; min-width:0;}
.mgr-txt b{display:block; font-size:16px;}
.mgr-txt small{display:block; color:var(--muted); font-size:13px; margin-top:2px;}
.mgr-change{color:var(--accent); font-size:14px; font-weight:600; white-space:nowrap;}
#managers-body{padding:16px 16px calc(var(--safe-bottom) + 24px);}
.mgr-intro{margin:0 0 12px;}
.mgr-list .onb-arch .ds{display:block; margin-top:4px;}
.mgr-list .onb-arch{padding:14px;}
.mgr-list .onb-av.mgr-big{width:60px; height:60px;}
.mgr-style{font-size:12.5px; color:var(--muted); margin-top:1px;}
.mgr-list .qt{margin-top:6px;}

/* ---- TASKS: add field and the empty state (v77) ---- */
.task-add #manual-task-add{display:none;}
.task-add.has-text #manual-task-add{display:inline-block;}
.tasks-empty{text-align:center; padding:28px 8px 8px; color:var(--muted); font-size:14.5px; line-height:1.55;}
.tasks-empty p{margin:0 0 14px;}
.tasks-empty #tasks-recommend{padding:13px 20px; font-size:15px; white-space:normal;}
.tasks-empty .hint{margin-top:12px;}

/* ---- GAMES (games.js, v80) ---- */
.games-card{display:flex; align-items:center; gap:12px; width:100%; text-align:left; background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; margin:10px 0; color:var(--text); cursor:pointer; font:inherit;}
.games-card .gc-ic{font-size:26px; flex:0 0 auto;}
.games-card .gc-txt{flex:1; min-width:0;}
.games-card .gc-txt b{display:block; font-size:15.5px;}
.games-card .gc-txt small{display:block; color:var(--muted); font-size:12.5px; margin-top:2px;}
.games-card .chev{width:18px; height:18px; stroke:var(--muted); fill:none; stroke-width:2; flex:0 0 auto;}
#games-body{padding:16px 16px calc(var(--safe-bottom) + 24px);}
.games-today{color:var(--accent); font-weight:600;}
.games-list{display:flex; flex-direction:column; gap:10px; margin-top:12px;}
.game-card{background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:14px;}
.game-card.soon{opacity:.6;}
.gm-top{display:flex; gap:12px; align-items:flex-start;}
.gm-ic{font-size:30px; line-height:1;}
.gm-txt b{display:block; font-size:16px;} .gm-txt small{display:block; color:var(--muted); font-size:13px; margin-top:2px;}
.gm-stats{font-size:13px; color:var(--muted); margin:10px 0 0;}
.gm-acts{display:flex; gap:8px; margin-top:10px;}
.gm-acts .primary-btn{flex:1; padding:11px 14px; font-size:15px;}
.gm-soon{margin-top:8px; font-size:12.5px; color:var(--muted); font-weight:600; text-transform:uppercase; letter-spacing:.05em;}
.gm-top-list{margin:12px 0 0; padding:0; list-style:none; font-size:14px;}
.gm-top-list li{display:flex; justify-content:space-between; padding:6px 2px; border-bottom:1px solid var(--line);}
.gm-top-list li.me{color:var(--accent); font-weight:700;}
body.playing{overflow:hidden;}
.game-view{position:fixed; inset:0; z-index:200; background:#0f1115; display:flex; flex-direction:column; padding-top:var(--safe-top, env(safe-area-inset-top)); padding-bottom:env(safe-area-inset-bottom);}
.game-view[hidden]{display:none;}
.game-bar{display:flex; align-items:center; gap:10px; padding:8px 12px; color:#fff;}
.game-bar strong{flex:1; text-align:center; font-size:16px;}
.game-bar .back-btn svg{stroke:#fff;}
.game-score{min-width:56px; text-align:right; font-weight:800; font-size:20px; font-variant-numeric:tabular-nums;}
.game-stage{position:relative; flex:1; min-height:0; touch-action:none; user-select:none; -webkit-user-select:none;}
.game-stage canvas{display:block; width:100%; height:100%;}
.game-panel{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(10,12,16,.45); padding:16px;}
.game-panel[hidden]{display:none;}
.gp-box{background:var(--panel); color:var(--text); border-radius:20px; padding:22px 20px; width:100%; max-width:340px; text-align:center; box-shadow:0 12px 40px rgba(0,0,0,.4);}
.gp-box b{font-size:18px;} .gp-box p{color:var(--muted); font-size:14px; line-height:1.5;}
.gp-box .primary-btn.big{width:100%; padding:13px; font-size:16px; margin-top:6px;}
.gp-big{font-size:44px; line-height:1; margin-bottom:6px;}
.gp-label{color:var(--muted); font-size:13px; text-transform:uppercase; letter-spacing:.06em;}
.gp-score{font-size:46px; font-weight:800; line-height:1.1; margin:2px 0 6px;}
.gp-record{color:var(--accent); font-weight:700; margin-bottom:6px;}
.gp-reward{font-weight:600; margin:8px 0 4px; font-size:15px;}
.gp-manager{font-style:italic;}
.gp-acts{display:flex; flex-direction:column; gap:8px; margin-top:10px;}
.gp-acts .ghost-btn{width:100%; padding:11px;}
.game-timer{font-weight:700; font-size:15px; color:#ffd36b; font-variant-numeric:tabular-nums;}
.game-timer[hidden]{display:none;}
.gp-title{font-size:21px; font-weight:800; margin-bottom:8px;}
.gp-acts{transition:opacity .25s;}
.gp-acts.locked{opacity:.3; pointer-events:none;}

/* ---- GOOSE WORKSHOP (games.js, v84) ---- */
.ws{position:absolute; inset:0; display:flex; flex-direction:column; gap:8px; padding:8px 10px 10px; background:linear-gradient(#f7ecd6, #efdcb6); color:#3a2e14; overflow:hidden; user-select:none; -webkit-user-select:none; touch-action:none;}
.ws[hidden]{display:none;}
.ws-top{display:flex; align-items:center; gap:8px;}
.ws-energy{flex:1; min-width:0;}
.ws-energy b{display:block; font-size:16px;} .ws-energy small{display:block; font-size:11.5px; color:#7a6431;}
.ws-buy{font-size:13px; padding:7px 10px; color:#3a2e14; border-color:#c9a560; background:#fff6e2;}
.ws-trash{width:38px; height:38px; border-radius:10px; background:#e8d3a8; display:flex; align-items:center; justify-content:center; font-size:20px;}
.ws-orders{display:grid; grid-template-columns:repeat(3, 1fr); gap:6px;}
.ws-order{background:#fffaf0; border:1.5px solid #e2c992; border-radius:12px; padding:6px; display:flex; flex-direction:column; gap:4px; align-items:center; text-align:center; min-width:0;}
.ws-order.ready{border-color:#3fa66a; box-shadow:0 0 0 2px rgba(63,166,106,.2);}
.ws-who{display:flex; align-items:center; gap:4px; font-size:11px; font-weight:600; max-width:100%;}
.ws-who span:last-child{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ws-pic{flex:0 0 26px; width:26px; height:26px; border-radius:50%; overflow:hidden; display:block;}
.ws-pic svg{width:100%; height:100%; display:block;}
.ws-needs{display:flex; gap:4px; justify-content:center;}
.ws-need{position:relative; font-size:24px; line-height:1;}
.ws-need i, .ws-item i{position:absolute; right:-3px; bottom:-3px; font-style:normal; font-size:9.5px; font-weight:800; background:#3a2e14; color:#fff; border-radius:7px; padding:0 4px; line-height:14px;}
.ws-give{width:100%; padding:5px 4px; font-size:11.5px; white-space:normal; line-height:1.2;}
.ws-give:disabled{opacity:.4;}
.ws-board{flex:1; min-height:0; display:grid; grid-template-columns:repeat(6, 1fr); grid-template-rows:repeat(7, 1fr); gap:4px; background:#e3c88f; border-radius:14px; padding:5px;}
.ws-cell{position:relative; background:rgba(255,255,255,.4); border-radius:9px; display:flex; align-items:center; justify-content:center; min-height:0;}
.ws-item span{font-size:min(28px, 7vw); line-height:1;}
.ws-item i{right:2px; bottom:2px;}
.ws-gen{background:#c98a3a; flex-direction:column; box-shadow:inset 0 -3px 0 rgba(0,0,0,.18);}
.ws-gen span{font-size:20px; line-height:1;} .ws-gen em{font-style:normal; font-size:16px; line-height:1;}
.ws-cell.dragging{opacity:.3;}
.ws-cell.pop{animation:wsPop .25s ease-out;}
@keyframes wsPop{0%{transform:scale(.6);} 70%{transform:scale(1.12);} 100%{transform:scale(1);}}
.ws-ghost{position:fixed; z-index:400; pointer-events:none; transform:translate(-50%, -60%); font-size:36px; line-height:1; filter:drop-shadow(0 4px 6px rgba(0,0,0,.3));}
.ws-info{margin:0; font-size:12.5px; text-align:center; color:#5c4a20; min-height:2.6em; line-height:1.3;}

/* ---- SOCIAL (social.js, v86): profile, friends, active devices, sign-in language ---- */
.c-profile{background:#e07a5f;}
.acc-lang{display:none; justify-content:flex-end; margin:-4px 0 4px;}
body.locked .acc-lang{display:flex;}
.acc-lang select{width:auto; font-size:14px; padding:6px 10px; border-radius:999px;}
#friends-body, #devices-body{padding:16px 16px calc(var(--safe-bottom) + 24px);}
.fr-tabs{margin-bottom:10px;}
.fr-note{background:var(--accent-dim); border-radius:var(--r-sm); padding:10px 12px; font-size:13.5px; margin-bottom:10px;}
.fr-row{display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--line);}
.fr-open{display:block; width:100%; background:none; border:0; padding:0; text-align:left; color:var(--text); font:inherit; cursor:pointer;}
.fr-open .fr-acts{color:var(--muted); font-size:20px;}
.fr-av{flex:0 0 40px; width:40px; height:40px; border-radius:50%; background:var(--accent-dim); color:var(--accent); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:18px;}
.fr-av.big{width:72px; height:72px; font-size:32px; margin:0 auto 6px;}
.fr-txt{flex:1; min-width:0;} .fr-txt b{display:block; font-size:15px;} .fr-txt small{display:block; color:var(--muted); font-size:12.5px;}
.fr-acts{display:flex; gap:6px; flex:0 0 auto;}
.fr-btn{padding:7px 11px; font-size:13px;}
.fr-state{font-size:12.5px; color:var(--muted);}
.fr-h{font-size:14px; margin:16px 0 4px; color:var(--muted); font-weight:600;}
.fr-empty{text-align:center; margin-top:24px;}
.fr-card{text-align:center; margin-top:8px;}
.fr-card h2{margin:0 0 10px; font-size:20px;}
.kv-row{display:flex; justify-content:space-around; gap:8px; background:var(--panel-2); border-radius:var(--r); padding:12px;}
.kv-row b{display:block; font-size:18px;} .kv-row small{color:var(--muted); font-size:12px;}
.fr-games{display:flex; flex-direction:column; gap:6px; text-align:left;}
.fr-games div{display:flex; justify-content:space-between; padding:8px 12px; background:var(--panel-2); border-radius:var(--r-sm); font-size:14px;}
.fr-remove{margin-top:18px; width:100%; color:var(--bad);}
.dev-row{display:flex; align-items:center; gap:10px; padding:12px 0; border-bottom:1px solid var(--line);}
.dev-row.current .dev-txt b{color:var(--accent);}
.dev-ic{font-size:26px;}
.dev-txt{flex:1; min-width:0;} .dev-txt b{display:block; font-size:15px;} .dev-txt small{display:block; color:var(--muted); font-size:12.5px; margin-top:1px;}
.badge-now{font-size:11px; font-weight:600; border:1px solid var(--accent); border-radius:999px; padding:0 7px; margin-left:4px;}

/* ---- WHAT'S NEW (whatsnew.js, v87) ---- */
#whatsnew-body{padding:16px 16px calc(var(--safe-bottom) + 24px);}
.wn-item{background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; margin-bottom:10px;}
.wn-item.latest{border-color:var(--accent-fill);}
.wn-head{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;}
.wn-head b{font-size:17px;} .wn-head small{color:var(--muted); font-size:12.5px; margin-left:auto;}
.wn-tag{font-size:11px; font-weight:700; color:var(--accent); border:1px solid var(--accent); border-radius:999px; padding:0 7px;}
.wn-item ul{margin:8px 0 0; padding-left:18px;} .wn-item li{margin:5px 0; font-size:14.5px; line-height:1.45;}

/* REPORT «Так тримати» (v93, report.js): the chat card and the week / month page */
.report-chat{align-self:stretch; background:var(--panel); border:1px solid var(--line); border-left:3px solid var(--accent-fill); border-radius:var(--r); padding:12px 14px; margin:6px 0;}
.report-chat .rc-head{display:flex; align-items:center; gap:10px;}
.report-chat .rc-head b{display:block; font-size:15.5px;} .report-chat .rc-head small{color:var(--muted); font-size:12.5px;}
.rc-av{flex:0 0 36px; width:36px; height:36px; border-radius:50%; overflow:hidden; display:block;}
.rc-av svg{display:block; width:100%; height:100%;}
.report-chat .rc-nums{margin:8px 0 4px; font-size:14px;}
.report-chat .rc-praise{margin:6px 0 10px; font-size:14.5px; line-height:1.45;}
.report-chat .rc-open{padding:8px 12px; font-size:14px;}
.report-kind{margin:4px 0 12px;}
.report-nav{display:flex; align-items:center; gap:10px; margin-bottom:12px;}
.report-nav > div{flex:1; text-align:center;} .report-nav b{display:block; font-size:16px;} .report-nav small{color:var(--muted); font-size:12.5px;}
.report-nav .icon-btn:disabled{opacity:.3; cursor:default;}
.report-praise{display:flex; gap:10px; align-items:flex-start; background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px;}
.report-praise b{font-size:13px; color:var(--muted);} .report-praise p{margin:3px 0 0; font-size:15px; line-height:1.45;}
.report-big{text-align:center; margin:18px 0 10px;}
.report-big b{display:block; font-size:44px; line-height:1;} .report-big span{display:block; color:var(--muted); margin-top:4px;}
.report-big small{display:block; margin-top:6px; font-size:13.5px; color:var(--accent);}
.rd-grid{display:grid; grid-template-columns:repeat(7, 1fr); gap:5px; margin:10px 0 16px;}
.rd{display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:46px; border-radius:var(--r-sm); background:var(--panel-2); border:1px solid var(--line);}
.rd-grid.month .rd{min-height:38px;}
.rd b{font-size:15px; min-height:18px;} .rd small{font-size:11px; color:var(--muted);}
.rd.on{background:var(--accent-dim); border-color:var(--accent);}
.rd.best{background:var(--accent-fill); color:#1d1b20;} .rd.best small{color:#1d1b20;}
.rd.off{border-style:dashed;} .rd.future{opacity:.4;} .rd.pad{visibility:hidden;}
.report-rows{background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:4px 14px; margin-bottom:20px;}
.report-row{display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); font-size:14.5px;}
.report-row:last-child{border-bottom:none;} .report-row b{text-align:right; display:inline-flex; align-items:center; gap:3px;}
.report-list{margin:-4px 0 6px; padding-left:20px; color:var(--muted); font-size:13.5px;} .report-list li{margin:3px 0;}

/* v96: PROGRESS — the streak chip in the page header, the 2×2 tiles; SETTINGS — the feedback card while testing */
.ph-streak{flex:0 0 auto; display:inline-flex; align-items:center; gap:5px; margin-bottom:2px; padding:7px 12px; border-radius:999px;
  background:var(--accent-dim); border:1px solid var(--accent-fill); color:var(--text); font:inherit; font-size:15px; cursor:pointer;}
.ph-streak[hidden]{display:none;}
.ph-streak .streak-fire{font-size:17px; line-height:1;}
.ph-streak b{font-size:16px;}
.ph-streak .ph-frz{font-size:13px; color:var(--muted); margin-left:4px;}
.ph-streak.zero{background:var(--panel-2); border-color:var(--line);}
.ph-streak.zero .streak-fire{filter:grayscale(1); opacity:.55;}
#streak-body .streak-card{margin-top:0;}
.hub-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:12px 0 4px;}
.hub-tile{position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:2px; min-height:96px; padding:12px 13px;
  background:var(--panel); border:1px solid var(--line); border-radius:var(--r); color:var(--text); text-align:left; font:inherit; cursor:pointer;}
.hub-tile:active{transform:scale(.98);}
.hub-tile .ht-ic{font-size:24px; line-height:1; margin-bottom:6px;}
.hub-tile b{font-size:15.5px;}
.hub-tile small{color:var(--muted); font-size:12.5px; line-height:1.3;}
.hub-tile .ht-bal{display:inline-flex; align-items:center; gap:3px; color:var(--text); font-weight:600;}
.hub-tile .ht-bal svg{flex:0 0 auto;}
.hub-tile .ht-dot{position:absolute; top:10px; right:10px; width:10px; height:10px; border-radius:50%; background:#e5484d; box-shadow:0 0 0 2px var(--panel);}
.hub-tile.soon{opacity:.7;}
.fb-hero{width:100%; display:flex; align-items:center; gap:12px; margin:0 0 16px; padding:14px; border-radius:var(--r);
  background:var(--accent-dim); border:1.5px solid var(--accent-fill); color:var(--text); text-align:left; font:inherit; cursor:pointer;}
.fb-hero[hidden]{display:none;}
.fb-hero .fbh-ic{font-size:26px; flex:0 0 auto;}
.fb-hero .fbh-txt{flex:1; min-width:0;}
.fb-hero b{display:block; font-size:16px;}
.fb-hero small{display:block; color:var(--muted); font-size:13px; margin-top:2px;}
.fb-hero small.fb-new{color:var(--accent); font-weight:600;}
.fb-hero .chev{width:18px; height:18px; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:2; opacity:.6;}
.set-row[hidden]{display:none;}

/* v99: new chat bubbles (Shop, feathers) — the manager's (data-bubble) and yours (data-bubble-me) */
body[data-bubble="sticky"] .msg.agent, body[data-bubble-me="sticky"] .msg.user, .bub-prev[data-bubble="sticky"] i{
  background:#fff1a6 !important; color:#3b3400 !important; border:none !important; border-radius:2px !important; box-shadow:2px 3px 0 rgba(0,0,0,.18) !important;}
body[data-bubble="chalk"] .msg.agent, body[data-bubble-me="chalk"] .msg.user, .bub-prev[data-bubble="chalk"] i{
  background:#2e4436 !important; color:#f1f1e6 !important; border:3px solid #8a6a3e !important; border-radius:6px !important;
  font-family:"Chalkboard SE", "Segoe Print", "Comic Sans MS", cursive; letter-spacing:.2px;}
body[data-bubble="terminal"] .msg.agent, body[data-bubble-me="terminal"] .msg.user, .bub-prev[data-bubble="terminal"] i{
  background:#0b0f0b !important; color:#39ff6a !important; border:1px solid #1f6a32 !important; border-radius:4px !important;
  font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size:14px;}
body[data-bubble="terminal"] .msg.agent::before{content:"> "; opacity:.7;}
body[data-bubble="watercolor"] .msg.agent, body[data-bubble-me="watercolor"] .msg.user, .bub-prev[data-bubble="watercolor"] i{
  color:#2b2440 !important; border:none !important; border-radius:22px 18px 24px 16px !important;
  background:radial-gradient(circle at 20% 30%, rgba(255,170,190,.85), transparent 55%), radial-gradient(circle at 80% 70%, rgba(150,200,255,.85), transparent 55%),
    radial-gradient(circle at 60% 20%, rgba(255,230,150,.8), transparent 50%), #f6efe9 !important;}
body[data-bubble="chalk"] .msg.agent a, body[data-bubble="terminal"] .msg.agent a{color:inherit;}

/* v99: icon packs — sketch (hand-drawn wobble), pixel (blocky), neon (glow on dark) */
.item-icon.pack-sketch{background:#fbf8f1 !important; border:1.5px dashed #8b8172 !important; color:#4a4238 !important;}
.item-icon.pack-sketch svg{filter:url(#ico-sketch); stroke-width:2.2;}
.item-icon.pack-pixel{border-radius:0 !important; background:var(--panel-2) !important; border:2px solid currentColor !important;}
.item-icon.pack-pixel svg{filter:url(#ico-pixel); stroke-width:2.6;}
.item-icon.pack-neon{background:#0e0f14 !important; border:1px solid var(--ic) !important; color:var(--ic) !important; box-shadow:0 0 8px var(--ic) !important;}
.item-icon.pack-neon svg{filter:drop-shadow(0 0 2px currentColor);}