/* Waykeeper · «Аптечка на стену» · префикс kt-
   Токены берутся со страницы (скетч v3); в скобках — запасные значения. */

.kt{
  color:var(--ink,#0F1722);
  font:400 var(--s4,16px)/1.6 var(--f-text,'Onest',system-ui,sans-serif);
}
.kt--panel{
  padding:44px; border-radius:22px;
  background:var(--glass,rgba(255,255,255,.56));
  -webkit-backdrop-filter:blur(18px) saturate(1.3); backdrop-filter:blur(18px) saturate(1.3);
  border:1px solid rgba(15,23,34,.07);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 22px 44px -28px rgba(15,23,34,.22);
}
.kt p{margin:0}
.kt input,.kt textarea,.kt button{font:inherit; color:inherit}
.kt input::placeholder,.kt textarea::placeholder{color:rgba(15,23,34,.34); opacity:1}

.kt-head,.kt-row{display:grid; grid-template-columns:minmax(0,.8fr) 20px minmax(0,1fr) 20px minmax(0,1.6fr) 32px; column-gap:14px; align-items:end}
.kt-head{padding-bottom:4px; font-size:var(--s5,13px); line-height:1.45; color:var(--ink-3,rgba(15,23,34,.62))}
.kt-head span:nth-child(2){grid-column:3}
.kt-head span:nth-child(3){grid-column:5}
.kt-rows{list-style:none; margin:0; padding:0}
.kt-row{min-height:52px; align-items:start; padding-top:8px}
.kt-cl{display:none}
.kt-in{width:100%; min-width:0; padding:7px 0 6px; border:0; border-bottom:1px solid var(--line-2,rgba(15,23,34,.20)); background:transparent; outline:none; transition:border-color .2s}
.kt-ta{display:block; resize:none; overflow:hidden; line-height:1.6}
.kt-in:focus{border-bottom-color:var(--ink,#0F1722)}
.kt-row--first .kt-in{color:var(--ink-2,rgba(15,23,34,.78))}
.kt-ar{padding-top:7px; text-align:center; color:rgba(15,23,34,.34)}
.kt-x{width:32px; height:44px; padding:0; border:0; background:none; cursor:pointer; font-size:var(--s3,21px); line-height:1; color:rgba(15,23,34,.38); transition:color .2s}
.kt-x:hover{color:var(--ink,#0F1722)}
.kt-add{margin-top:8px; min-height:44px; padding:0; border:0; background:none; cursor:pointer; color:var(--ink-2,rgba(15,23,34,.78));
  text-decoration:underline; text-decoration-color:var(--line-2,rgba(15,23,34,.20)); text-underline-offset:4px}
.kt-add:hover{color:var(--ink,#0F1722); text-decoration-color:var(--ink,#0F1722)}

/* строка «кому я звоню» — её не удалить, вписывает человек */
.kt-call{display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-rows:auto auto; column-gap:12px; align-items:baseline; margin-top:28px; padding-top:22px; border-top:1px solid var(--line,rgba(15,23,34,.10))}
.kt-call i{grid-row:1; width:7px; height:7px; border-radius:50%; background:var(--accent,#EA5F22); align-self:center}
.kt-call span{grid-column:2; font:400 var(--s3,21px)/1.3 var(--f-head,'Spectral',Georgia,serif)}
.kt-call .kt-in{grid-column:2; grid-row:2; max-width:460px; margin-top:4px}

.kt-acts{display:flex; align-items:center; flex-wrap:wrap; gap:12px 20px; margin-top:32px; font-size:var(--s5,13px); line-height:1.45; color:var(--ink-3,rgba(15,23,34,.62))}
.kt .kt-btn{display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 20px; border-radius:999px;
  border:1px solid var(--line-2,rgba(15,23,34,.20)); background:rgba(255,255,255,.6); cursor:pointer; font-size:var(--s4,16px); font-weight:500; color:var(--ink,#0F1722); transition:background .2s, border-color .2s}
.kt-btn:hover{background:#fff; border-color:rgba(15,23,34,.36)}
.kt-btn:active{transform:translateY(1px)}

.kt-sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.kt-foot{display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-top:40px; padding-top:14px; border-top:1px solid var(--line,rgba(15,23,34,.10));
  font-size:var(--s5,13px); line-height:1.45; color:var(--ink-3,rgba(15,23,34,.62))}
.kt-clear{min-height:44px; padding:0; border:0; background:none; cursor:pointer; font:inherit; color:var(--ink-2,rgba(15,23,34,.78));
  text-decoration:underline; text-decoration-color:var(--line-2,rgba(15,23,34,.20)); text-underline-offset:3px}
.kt-clear:hover{color:var(--ink,#0F1722); text-decoration-color:var(--ink,#0F1722)}
.kt-x:focus-visible,.kt-add:focus-visible,.kt-btn:focus-visible,.kt-clear:focus-visible{outline:2px solid var(--ink,#0F1722); outline-offset:2px; border-radius:6px}

/* ---------- телефон: строка — маленький блок из трёх полей ---------- */
@media (max-width:760px){
  .kt--panel{padding:24px 20px; border-radius:18px}
  .kt-head{display:none}
  .kt-row{position:relative; display:block; padding:14px 36px 16px 0; border-bottom:1px solid var(--line,rgba(15,23,34,.10))}
  .kt-row:first-child{border-top:1px solid var(--line,rgba(15,23,34,.10))}
  .kt-c{display:block}
  .kt-c + .kt-ar + .kt-c{margin-top:8px}
  .kt-cl{display:block; font-size:var(--s5,13px); line-height:1.45; color:var(--ink-3,rgba(15,23,34,.62))}
  .kt-ar{display:none}
  .kt-x{position:absolute; right:0; top:6px}
  .kt-row{padding-top:14px}
  .kt-call span{font-size:var(--s3,19px)}
  .kt-foot{flex-direction:column; gap:6px}
}

@media (prefers-reduced-motion: reduce){
  .kt *,.kt *::before,.kt *::after{transition:none !important; animation:none !important}
}

/* ---------- печать: один лист «Моя аптечка» ---------- */
.wk-print-sheet{display:none}
@media print{
  @page{margin:16mm}
  html.wk-print,html.wk-print body{background:#fff !important}
  html.wk-print body > *:not(.wk-print-sheet){display:none !important}
  html.wk-print .wk-print-sheet{display:block}
  .kt-print{color:#0F1722; font:400 12pt/1.45 var(--f-text,'Onest',system-ui,sans-serif)}
  .kt-print h1{margin:0; font:300 30pt/1.1 var(--f-head,'Spectral',Georgia,serif)}
  .kt-pr-sub{margin:2mm 0 8mm; font-size:10pt; color:#5F646B}
  .kt-print table{width:100%; border-collapse:collapse; table-layout:fixed}
  .kt-print th{padding:0 4mm 2mm 0; text-align:left; font-weight:400; font-size:9pt; color:#5F646B; border-bottom:.3mm solid #9AA0A6}
  .kt-print th:nth-child(1){width:26%} .kt-print th:nth-child(2){width:28%}
  .kt-print td{padding:4mm 4mm 4mm 0; vertical-align:top; border-bottom:.2mm solid #D5D8DC; font-size:13pt; overflow-wrap:anywhere}
  .kt-print td:first-child{font:400 14pt/1.3 var(--f-head,'Spectral',Georgia,serif)}
  .kt-print tr{break-inside:avoid}
  .kt-pr-blank td{height:12mm}
  .kt-pr-call{margin:12mm 0 0; padding-top:5mm; border-top:.3mm solid #0F1722; font:400 17pt/1.4 var(--f-head,'Spectral',Georgia,serif); break-inside:avoid}
  .kt-pr-call b{font-weight:400}
  .kt-pr-call i{display:inline-block; width:85mm; height:1em; border-bottom:.3mm solid #0F1722; vertical-align:baseline}
}
