/* Сторінка «Персональний асистент»: базовий стиль (/css/base.css) + кнопка запису. */
.st-title{font-family:var(--display);font-weight:700;font-size:20px;margin:0}
.st-login{min-height:100vh;display:grid;place-items:center;padding:16px}
.st-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:28px;width:100%;max-width:360px;display:flex;flex-direction:column;gap:14px}
.st-card p{margin:0}

.st-top{display:flex;align-items:center;gap:12px;max-width:640px;margin:0 auto;padding:22px 16px 0}
.st-top .st-title{margin-right:auto;white-space:nowrap}
.st-top .tag{white-space:nowrap}
.st-main{max-width:640px;margin:0 auto;padding:0 16px 48px}

.st-recorder{display:flex;flex-direction:column;align-items:center;gap:14px;padding:44px 0 36px}
.st-rec{
  width:116px;height:116px;border-radius:50%;border:none;cursor:pointer;
  background:var(--blue);color:#fff;display:grid;place-items:center;
  box-shadow:0 4px 0 #1f4fa8,0 0 0 calc(var(--level,0) * 26px) var(--blue-soft);
  transition:transform .12s ease,background .2s ease;
}
.st-rec:hover{transform:translateY(-1px)}
.st-rec:active{transform:translateY(2px);box-shadow:0 2px 0 #1f4fa8,0 0 0 calc(var(--level,0) * 26px) var(--blue-soft)}
.st-rec:disabled{opacity:.5;cursor:progress;transform:none}
.st-rec svg{width:42px;height:42px}
.st-rec .stop{display:none;width:30px;height:30px;border-radius:7px;background:#fff}
.st-rec.recording{background:var(--danger);box-shadow:0 4px 0 #a3243b,0 0 0 calc(var(--level,0) * 26px) var(--danger-soft)}
.st-rec.recording .mic{display:none}
.st-rec.recording .stop{display:block}
.st-status{margin:0;color:var(--muted);font-weight:700;font-variant-numeric:tabular-nums;text-align:center;min-height:22px}
.st-status.err{color:var(--danger)}
.st-dot{color:var(--danger);animation:st-blink 1s steps(2,start) infinite}
@keyframes st-blink{to{visibility:hidden}}
.st-spin{display:inline-block;width:14px;height:14px;margin-right:8px;vertical-align:-2px;border:2px solid var(--line2);border-top-color:var(--blue);border-radius:50%;animation:st-spin .8s linear infinite}
@keyframes st-spin{to{transform:rotate(360deg)}}

.st-langs{display:inline-flex;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:3px;gap:2px}
.st-langs button{border:none;background:transparent;border-radius:9px;padding:6px 14px;font-weight:800;font-size:14px;color:var(--muted);cursor:pointer}
.st-langs button:hover{color:var(--fg)}
.st-langs button[aria-checked="true"]{background:var(--panel);color:var(--blue);box-shadow:var(--shadow)}

.st-list-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.st-list-head h2{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:900;margin:0}
#results{display:flex;flex-direction:column;gap:10px}
.st-empty{text-align:center;font-size:14px;padding:18px 0;margin:0}
.st-item{background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:14px 16px}
.st-item p{margin:0 0 10px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:16px;line-height:1.5}
.st-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:var(--faint);font-weight:700}
.st-meta .btn.done{color:var(--ok);border-color:var(--ok)}
@media (max-width:400px){.st-title{font-size:17px}.st-top{gap:8px}}

/* ---------- вкладки ---------- */
.st-tabs{display:flex;gap:4px;max-width:640px;margin:16px auto 0;padding:0 16px;overflow-x:auto;scrollbar-width:none}
.st-tabs::-webkit-scrollbar{display:none}
.st-tabs button{border:none;background:transparent;padding:8px 12px;border-radius:10px;font-weight:800;font-size:14px;color:var(--muted);cursor:pointer;white-space:nowrap}
.st-tabs button:hover{color:var(--fg);background:var(--soft)}
.st-tabs button[aria-selected="true"]{background:var(--panel);color:var(--blue);box-shadow:var(--shadow)}
.st-count{display:inline-block;min-width:18px;padding:0 5px;border-radius:999px;background:var(--blue);color:#fff;font-size:11px;line-height:18px;text-align:center;margin-left:2px}
.st-pad{margin-top:24px}

/* ---------- запис: перемикач і поле команди ---------- */
.st-switch{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:var(--muted);cursor:pointer;user-select:none}
.st-switch input{width:18px;height:18px;accent-color:var(--blue);margin:0}
.st-hint{margin:-6px 0 0;text-align:center}
.st-ask{display:flex;gap:8px;margin:0 0 28px}
.st-ask input{flex:1;background:var(--panel);border:1px solid var(--line)}
.st-assist{margin:0 0 10px;padding:10px 12px;border-radius:10px;background:var(--blue-soft);color:var(--fg);font-size:14px;font-weight:600;white-space:pre-wrap;line-height:1.5}
.st-assist.err{background:var(--danger-soft);color:var(--danger)}

/* ---------- задачі ---------- */
.st-summary{background:var(--sun-soft);color:var(--fg);border-radius:14px;padding:14px 16px;margin-bottom:16px;white-space:pre-wrap;line-height:1.5;font-size:15px}
.st-group{margin-bottom:18px}
.st-group h4{margin:0 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--faint);font-weight:900}
.st-task{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:6px}
.st-task label{display:flex;align-items:flex-start;gap:10px;flex:1;min-width:0;cursor:pointer}
.st-task input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--ok);flex:none}
.st-task-text{overflow-wrap:anywhere;font-weight:600}
.st-task.done .st-task-text{text-decoration:line-through;color:var(--faint)}
.st-when{font-size:12px;color:var(--muted);font-weight:800;white-space:nowrap}
.st-x{border:none;background:transparent;color:var(--faint);font-size:20px;line-height:1;cursor:pointer;padding:0 4px}
.st-x:hover{color:var(--danger)}
@media (max-width:480px){.st-task{flex-wrap:wrap}.st-when{order:3;width:100%;padding-left:28px}}

/* ---------- нотатки ---------- */
.st-search{width:180px;background:var(--panel);border:1px solid var(--line)}
.st-note{margin-bottom:10px}
.st-tag{border:none;background:var(--blue-soft);color:var(--blue);border-radius:999px;padding:1px 8px;font-size:12px;font-weight:800;cursor:pointer}

/* ---------- налаштування ---------- */
.st-settings{display:flex;flex-direction:column;gap:14px;padding-top:24px}
.st-block{max-width:none}
.st-block h3{margin:0;font-size:16px}
.st-block a{color:var(--blue)}
.st-row{display:flex;gap:12px;flex-wrap:wrap}
.st-row .fld{flex:1;min-width:150px}
.st-bot p{margin:0 0 8px}
.st-bot .btn.primary{display:inline-block;text-decoration:none;color:#fff;margin-bottom:6px}
select{background:var(--soft);border:1px solid transparent;border-radius:10px;padding:8px 11px;font-size:15px}
@media (max-width:420px){.st-tabs{gap:2px;padding:0 12px}.st-tabs button{padding:7px 8px;font-size:13px}}

/* ---------- v4: проєкти, пріоритети, скасування ---------- */
.st-btns{display:flex;gap:6px}
.st-chips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.st-chips button{border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:4px 12px;font-weight:800;font-size:13px;color:var(--muted);cursor:pointer}
.st-chips button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.st-chips button span{opacity:.75;font-size:11px}
.st-task.child{margin-left:24px;padding:7px 12px}
.st-task.child .st-task-text{font-weight:500}
.st-prio{border:none;background:transparent;cursor:pointer;font-size:14px;width:24px;padding:0;color:var(--faint);font-weight:900}
.st-prio:hover{color:var(--fg)}
.st-when.flash{color:var(--ok)}
.st-undo{margin-top:8px}

/* ---------- стан ---------- */
.st-state-hint{margin:-4px 0 14px}
.st-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.st-tile{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px;font-weight:700;color:var(--muted)}
.st-tile b{font-family:var(--display);font-size:22px;color:var(--fg)}
.st-tile small{width:100%;font-size:11px;color:var(--muted)}
.st-sw{width:10px;height:10px;border-radius:3px;margin-right:6px;align-self:center}
.st-chart{padding:14px 14px 8px;margin-bottom:12px;gap:6px}
.st-chart h3{margin:0;font-size:14px}
.st-legend{display:flex;gap:14px;font-size:12px;font-weight:800;color:var(--muted)}
.st-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.st-plot{position:relative;touch-action:pan-y}
.st-plot svg{display:block;overflow:visible}
.st-grid{stroke:var(--line);stroke-width:1}
.st-avg{stroke:var(--muted);stroke-width:1;stroke-dasharray:3 3}
.st-cross{stroke:var(--line2);stroke-width:1}
.st-ax{font-size:10px;fill:var(--faint);font-weight:700}
.st-dl{font-size:11px;fill:var(--muted);font-weight:800}
.st-tip{position:absolute;top:-6px;transform:translateY(-100%);background:var(--fg);color:#fff;border-radius:8px;padding:6px 9px;font-size:12px;line-height:1.45;pointer-events:none;white-space:nowrap;z-index:2}
.st-hgrid{display:grid;gap:3px;align-items:center;font-size:12px}
.st-hd{text-align:center;color:var(--faint);font-weight:700;font-size:10px}
.st-hn{font-weight:800;color:var(--fg);padding-right:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st-hc{aspect-ratio:1;border-radius:4px;background:var(--soft);min-width:8px}
.st-hc.on{background:var(--ok)}
.st-hk{color:var(--muted);font-weight:800;padding-left:6px;white-space:nowrap}
.st-table{margin-top:4px;font-size:13px}
.st-table summary{cursor:pointer;font-weight:800;color:var(--muted)}
.st-table table{width:100%;border-collapse:collapse;margin-top:8px;background:var(--panel);border-radius:10px;overflow:hidden}
.st-table th,.st-table td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line)}
.st-table th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}

/* ---------- задачі: сфери, види, список, редагування, масові дії, сортування по одній (tasks.js) ---------- */
textarea{font:inherit;color:inherit;background:var(--soft);border:1px solid transparent;border-radius:10px;padding:8px 11px;font-size:15px;resize:vertical;width:100%}
textarea:focus{background:var(--panel);border-color:var(--line2);outline:none}
.st-tabs{max-width:860px}
.st-main.tk-main{max-width:860px;padding-bottom:110px}
#taskCount.tk-has-inbox{background:var(--sun-ink)}

.tk-areas{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0 0 12px}
.tk-areas button{border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:10px 8px;font-weight:800;font-size:14px;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}
.tk-areas button:hover{color:var(--fg);border-color:var(--line2)}
.tk-areas button[aria-selected="true"]{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 2px 0 #1f4fa8}
.tk-areas span{font-size:12px;opacity:.8;font-variant-numeric:tabular-nums}
.tk-areas span:empty{display:none}
.tk-areas button[data-area="inbox"]:not([aria-selected="true"]) span{background:var(--sun-soft);color:var(--sun-ink);opacity:1;border-radius:999px;padding:0 7px}

.tk-inbox{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:var(--sun-soft);color:var(--sun-ink);border-radius:12px;padding:10px 12px;margin:0 0 12px;font-weight:700}
.tk-inbox>span{margin-right:auto}

.tk-add{display:flex;gap:6px;margin:0 0 10px}
.tk-add input{flex:1;background:var(--panel);border:1px solid var(--line)}
.tk-add select{background:var(--panel);border:1px solid var(--line);padding:8px 6px}

.tk-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 8px}
.tk-tools input[type=search]{flex:1 1 200px;background:var(--panel);border:1px solid var(--line)}
.tk-tools select{background:var(--panel);border:1px solid var(--line);font-size:14px;padding:7px 8px;max-width:190px}
.tk-tools .btn[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}

.tk-views{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin:0 0 12px;padding-bottom:2px}
.tk-views::-webkit-scrollbar{display:none}
.tk-views button{border:none;background:transparent;border-radius:999px;padding:5px 11px;font-weight:800;font-size:13px;color:var(--muted);cursor:pointer;white-space:nowrap}
.tk-views button:hover{background:var(--soft);color:var(--fg)}
.tk-views button[aria-pressed="true"]{background:var(--fg);color:#fff}
.tk-views span{font-size:11px;opacity:.7;margin-left:2px}
.tk-views button.warn span{color:var(--danger);opacity:1}
.tk-views button.warn[aria-pressed="true"] span{color:#ffb3c0}

#taskList{transition:opacity .15s}
#taskList.tk-busy{opacity:.55}
.tk-group{margin:14px 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--faint);font-weight:900}
.tk-group:first-child{margin-top:0}
.tk-row{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:8px 10px;margin-bottom:5px;min-height:46px}
.tk-row.child{margin-left:28px;padding:5px 10px;min-height:38px;background:transparent;border-style:dashed}
.tk-row.p2{border-left:3px solid var(--danger)}
.tk-row.p1{border-left:3px solid #e8a33d}
.tk-row.sel{background:var(--blue-soft);border-color:var(--blue)}
.tk-sel{width:18px;height:18px;margin:0;accent-color:var(--blue);flex:none}
.tk-done{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid var(--line2);background:var(--panel);cursor:pointer;padding:0;position:relative}
.tk-done:hover{border-color:var(--ok);background:var(--ok-soft)}
.tk-done:hover::after,.tk-row.done .tk-done::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;font-size:12px;font-weight:900;color:var(--ok)}
.tk-row.done .tk-done{border-color:var(--ok);background:var(--ok)}
.tk-row.done .tk-done::after{color:#fff}
.tk-body{flex:1;min-width:0;cursor:pointer}
.tk-text{font-weight:650;overflow-wrap:anywhere;line-height:1.35}
.tk-row.child .tk-text{font-weight:500;font-size:14px}
.tk-row.done .tk-text{text-decoration:line-through;color:var(--faint)}
.tk-meta{font-size:12px;color:var(--muted);font-weight:700;display:flex;flex-wrap:wrap;gap:2px 0;margin-top:2px}
.tk-meta:empty{display:none}
.tk-meta i{font-style:normal;margin:0 6px;color:var(--faint)}
.tk-late{color:var(--danger)}
.tk-badge{border-radius:999px;padding:0 7px;background:var(--soft)}
.tk-badge.a-inbox{background:var(--sun-soft);color:var(--sun-ink)}
.tk-badge.a-work{background:var(--blue-soft);color:var(--blue)}
.tk-badge.a-personal{background:var(--ok-soft);color:var(--ok)}
.tk-quick{display:flex;gap:4px;flex:none}
.tk-quick button{border:1px solid var(--line);background:var(--panel);border-radius:9px;width:34px;height:32px;cursor:pointer;font-size:15px;padding:0}
.tk-quick button:hover{border-color:var(--blue);background:var(--blue-soft)}
.tk-quick .tk-sug{width:auto;padding:0 8px;border-color:var(--blue);background:var(--blue-soft);font-size:13px;font-weight:800}
.tk-prio{border:none;background:transparent;cursor:pointer;font-size:14px;width:26px;padding:0;color:var(--faint);font-weight:900;flex:none}
.tk-prio:hover{color:var(--fg)}
.tk-more{margin-top:8px}

.tk-editor{background:var(--panel);border:1px solid var(--blue);border-radius:12px;padding:12px;margin:-2px 0 10px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow)}
.tk-erow{display:flex;flex-wrap:wrap;gap:8px}
.tk-erow:empty{display:none}
.tk-erow .fld{flex:1 1 150px}
.tk-erow input,.tk-erow select{width:100%}
.tk-seg{display:inline-flex;background:var(--soft);border-radius:10px;padding:3px;gap:2px}
.tk-seg label{cursor:pointer}
.tk-seg input{position:absolute;opacity:0;pointer-events:none}
.tk-seg span{display:block;padding:6px 12px;border-radius:8px;font-weight:800;font-size:14px;color:var(--muted)}
.tk-seg input:checked+span{background:var(--panel);color:var(--fg);box-shadow:var(--shadow)}
.tk-seg input:focus-visible+span{outline:3px solid var(--blue)}
.tk-eact{display:flex;gap:6px;flex-wrap:wrap}
.tk-eact .danger{margin-left:auto}

.tk-bulk{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:20;width:min(840px,calc(100% - 20px));display:flex;flex-wrap:wrap;align-items:center;gap:6px;background:var(--fg);color:#fff;border-radius:14px;padding:8px 10px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.tk-bulk b{margin-right:4px;font-size:14px}
.tk-bulk .btn{background:rgba(255,255,255,.1);border-color:transparent;color:#fff}
.tk-bulk .btn:hover{background:rgba(255,255,255,.2)}
.tk-bulk select{background:rgba(255,255,255,.1);color:#fff;border:none;font-size:13px;padding:5px 6px}
.tk-bulk select option{color:var(--fg)}
.tk-bulk-r{margin-left:auto;display:flex;gap:4px}

.tk-toast{position:fixed;left:50%;bottom:76px;transform:translateX(-50%);z-index:40;max-width:min(560px,calc(100% - 24px));display:flex;align-items:center;gap:12px;background:#1a2132;color:#fff;border-radius:12px;padding:10px 14px;font-size:14px;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.25);white-space:pre-line}
.tk-toast .btn{background:rgba(255,255,255,.12);border-color:transparent;color:#fff;flex:none}

body.tk-modal{overflow:hidden}
.tk-triage{position:fixed;inset:0;z-index:30;background:rgba(18,24,40,.55);display:grid;place-items:center;padding:16px}
.tk-tcard{width:min(560px,100%);background:var(--panel);border-radius:20px;padding:18px 20px 16px;box-shadow:0 20px 60px rgba(0,0,0,.3);display:flex;flex-direction:column;gap:12px}
.tk-thead{display:flex;justify-content:space-between;align-items:center;font-weight:800;color:var(--muted);font-size:13px}
.tk-tbar{height:4px;background:var(--soft);border-radius:4px;overflow:hidden}
.tk-tbar i{display:block;height:100%;background:var(--blue);transition:width .2s}
.tk-ttext{font-size:22px;font-weight:800;line-height:1.3;margin:6px 0 0;overflow-wrap:anywhere}
.tk-tmeta{margin:0;color:var(--muted);font-size:14px;font-weight:700}
.tk-tmeta i{font-style:normal;margin:0 6px}
.tk-tsug{margin:0;color:var(--blue);font-weight:800}
.tk-tbtns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.tk-big{border:2px solid var(--line);background:var(--panel);border-radius:16px;padding:20px 10px;font-size:18px;font-weight:900;cursor:pointer;color:var(--fg)}
.tk-big.work:hover,.tk-big.work.suggested{border-color:var(--blue);background:var(--blue-soft)}
.tk-big.personal:hover,.tk-big.personal.suggested{border-color:var(--ok);background:var(--ok-soft)}
.tk-big.suggested{box-shadow:0 0 0 3px var(--blue-soft)}
.tk-tsmall{display:flex;flex-wrap:wrap;gap:4px;justify-content:space-between}
kbd{font:700 11px/1 var(--body);background:var(--soft);color:var(--muted);border:1px solid var(--line2);border-bottom-width:2px;border-radius:5px;padding:2px 5px;margin-left:4px;vertical-align:1px}
@media (hover:none){kbd{display:none}}

@media (max-width:560px){
  .tk-areas{grid-template-columns:repeat(2,1fr)}
  .tk-tools select{flex:1 1 40%;max-width:none}
  .tk-row{flex-wrap:wrap}
  .tk-body{flex-basis:calc(100% - 80px)}
  .tk-quick{margin-left:32px}
  .tk-row.child{margin-left:16px}
  .tk-ttext{font-size:19px}
  .tk-big{padding:16px 8px;font-size:16px}
  .tk-add{flex-wrap:wrap}.tk-add input{flex-basis:100%}
}
@media (max-width:560px){.st-top{flex-wrap:wrap;row-gap:6px}.st-top .st-title{white-space:normal;flex:1 1 100%;margin-right:0}}
