/* HK Parkhi Desk: only the layout HK Glass has no piece for. Every colour, radius, shadow and size comes from
   hk-glass.css (linked after this file), so overrides of hkg- pieces start with ".hkg " to win over it. */
.hkg{--hkg-dock-h:64px}
.hkg [hidden]{display:none}
.hkg p{margin:0}
.pk-chip{position:relative;border:0;cursor:pointer;flex:none}
.pk-chip::after{content:"";position:absolute;inset:-11px -4px}               /* 48 px to the finger */
.hkg .pk-tabs{display:none}
.hkg .pk-tabs>button{display:inline-flex;align-items:center;justify-content:center;gap:var(--hkg-s2)}

/* names: never cut, wrap at spaces only (a single word longer than its box still fits) */
.pk-nm{overflow-wrap:break-word;word-break:normal;hyphens:none}
button.pk-nm{appearance:none;-webkit-appearance:none;border:0;background:none;margin:0;padding:0;font:inherit;color:inherit;
  text-align:left;cursor:pointer;display:flex;align-items:center;min-height:44px}
.hkg .pk-wrap{white-space:normal;overflow:visible;text-overflow:clip}           /* a line with an amount or a reason wraps */

/* a task row: the name has the whole first line; the words and the button share the line under it */
.hkg .pk-row{display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;column-gap:var(--hkg-s3);row-gap:2px;min-height:72px}
.pk-row>.hkg-dot{grid-column:1;grid-row:1}
.hkg .pk-row>.hkg-row__hit{grid-column:2/-1;grid-row:1/3;display:grid;grid-template-columns:subgrid;grid-template-rows:subgrid;row-gap:2px;align-items:center;min-height:44px}
.pk-row .hkg-row__t{grid-column:1/-1}
.pk-row .hkg-row__s{grid-column:1;grid-row:2;align-self:start}           /* P17: the line sits right under the name */
.pk-row>.hkg-btn{grid-column:3;grid-row:2}
.pk-row>.pk-err{grid-column:2/-1;grid-row:3}
@supports not (grid-template-columns:subgrid){.hkg .pk-row>.hkg-row__hit{grid-column:2;display:flex;flex-direction:column;align-items:flex-start}.pk-row>.hkg-btn{grid-row:1/3}}
.pk-row--plain{grid-template-columns:9px minmax(0,1fr) auto}
.pk-err{margin:0;color:var(--hkg-bad);font-weight:700}
.pk-err:empty{display:none}

/* state: a dot and a word */
.pk-st{display:inline-flex;align-items:center;gap:var(--hkg-s2);font-weight:700}
.pk-st--ok{color:var(--hkg-ok)}.pk-st--warn{color:var(--hkg-warn)}.pk-st--bad{color:var(--hkg-bad)}.pk-st--wait,.pk-st--calm{color:var(--hkg-text-2)}
.pk-st--line{display:flex;align-items:baseline}
.pk-st--line>.hkg-dot{transform:translateY(-1px)}
.hkg-fold>summary>.pk-st{margin-left:auto}
.hkg-fold>summary>.pk-st+span{margin-left:var(--hkg-s2)}

/* cards */
.pk-card{display:flex;flex-direction:column;gap:var(--hkg-s2);min-width:0}
.pk-card-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;column-gap:var(--hkg-s3)}
.pk-card-h>.pk-nm{flex:1 1 auto;min-width:0}
.pk-parts{display:flex;flex-wrap:wrap;gap:var(--hkg-s1) var(--hkg-s4)}
.pk-fix{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--hkg-s2) var(--hkg-s3);padding-top:var(--hkg-s2);box-shadow:0 -1px 0 var(--hkg-line)}
.pk-fix>.pk-err{grid-column:1/-1}
.pk-pills{display:flex;flex-wrap:wrap;gap:6px}
.pk-clock{display:flex;align-items:baseline;gap:var(--hkg-s3)}
.pk-nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.hkg .pk-nums>.hkg-count{min-height:84px;cursor:default}
.hkg .pk-fold-rows{padding:0}
.pk-skel-h{width:55%;height:40px}
.hkg .hkg-now__t{overflow-wrap:break-word;word-break:normal}
.hkg .hkg-sheet__head>.pk-sheet-t{white-space:normal;overflow:visible;overflow-wrap:break-word}
.hkg .hkg-empty__mark>.hkg-ico{width:26px;height:26px}

/* Quality round 1 (15 Nov 2026) */
.hkg .pk-hide{visibility:hidden}
.hkg .hkg-badge.pk-badge--quiet{color:var(--hkg-text);background:var(--hkg-surface-solid);box-shadow:0 0 0 2px var(--hkg-ground),inset 0 0 0 1px var(--hkg-line-2)}
.hkg .pk-act[disabled],.hkg .pk-login-card .hkg-btn[disabled]{opacity:1;--ink:var(--hkg-text-2);background:var(--hkg-well);box-shadow:inset 0 0 0 1px var(--hkg-line)}
.pk-ready{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px var(--hkg-s3)}
.pk-ready>li{display:flex;align-items:center;gap:var(--hkg-s2);font-weight:600}
.hkg .pk-circ{width:14px;height:14px;background:none;box-shadow:inset 0 0 0 2px var(--hkg-text-2)}   /* N2: to have ready, not done */
.hkg .pk-line{min-height:0;padding-top:0;padding-bottom:0}
.pk-line .hkg-row__hit{display:flex;align-items:center;gap:var(--hkg-s3);min-height:48px;padding-top:4px;padding-bottom:4px}
.pk-line .hkg-row__main{flex:1 1 auto;min-width:0}
.pk-dots{display:flex;gap:5px;flex:none}
.hkg-fold>summary>.pk-dots{margin-left:auto}.hkg-fold>summary>.pk-dots+span{margin-left:var(--hkg-s2)}
.pk-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.pk-cscrim{z-index:70}
.pk-confirm{position:fixed;z-index:71;left:var(--hkg-s4);right:var(--hkg-s4);bottom:calc(var(--hkg-s4) + var(--hkg-safe-b));max-width:420px;margin:0 auto;
  padding:var(--hkg-s5);border-radius:var(--hkg-r-xl);background:var(--hkg-sheet);box-shadow:var(--hkg-shadow-3);
  transform:translateY(24px);opacity:0;transition:transform var(--hkg-t-move) var(--hkg-ease),opacity var(--hkg-t-quick)}
.pk-confirm.is-open{transform:none;opacity:1}
.hkg .pk-bad{color:var(--hkg-bad);font-weight:700}
.hkg .pk-logout{margin-top:var(--hkg-s2)}
.hkg .pk-logout--quiet{--ink:var(--hkg-text-2);align-self:center}
.pk-skel-first{min-height:196px}
.pk-skel-btn{display:block;height:56px;border-radius:var(--hkg-r-m)}

/* rule 7: nothing under 12.5 px, also where the shared pieces go smaller */
.hkg .hkg-dock__i,.hkg .hkg-eyebrow,.hkg .hkg-badge{font-size:12.5px}

/* Quality round 2 (15 Nov 2026) */
.pk-held{display:inline-flex;align-items:center;gap:var(--hkg-s1)}                  /* S4: a held press, "Marked" and its own Undo */
.pk-held--wide{display:flex;width:100%}.pk-held--wide>.pk-act{flex:1}
.pk-row>.pk-held{grid-column:3;grid-row:2}
.hkg .pk-look{font-size:12.5px;min-height:0;margin-bottom:calc(-1 * var(--hkg-s3))}  /* look only: a thin line under the bar */
.hkg .pk-tabs .hkg-pill{background:var(--hkg-surface-solid);box-shadow:inset 0 0 0 1px var(--hkg-line-2)}   /* N6: tab badges on a solid ground, 5:1 or more */
.hkg .hkg-search>input::-webkit-search-cancel-button{-webkit-mask:url("clear.svg") center/20px no-repeat;mask:url("clear.svg") center/20px no-repeat}   /* 1.1's clear mark as a file: the CSP refuses data: images */
.hkg .pk-tabs .pk-pill--quiet{color:var(--hkg-text)}.hkg .pk-tabs .hkg-pill--bad{box-shadow:inset 0 0 0 1px var(--hkg-bad-line)}
@media (max-height:799px) and (max-width:767px){.hkg .pk-main.hkg-stack{gap:var(--hkg-s3)}}   /* N5: short phones */

/* 15 Nov, going live: users, the real / demo line, a second word for one name twice, the demo's Start again */
.pk-me{flex:none;font-weight:700;color:var(--hkg-text-2);white-space:nowrap}.hkg .pk-tell{font-size:13px;font-weight:600;letter-spacing:0;color:var(--hkg-text-2);white-space:nowrap}
.pk-demo-a{display:inline-flex;align-items:center;min-height:44px;flex-basis:100%;padding-left:var(--hkg-s5);color:var(--hkg-gold-ink);font-weight:700}.hkg .pk-look:has(.pk-demo-a){flex-wrap:wrap;align-items:center}
.hkg .pk-whos{width:100%}.hkg .pk-whos>button{min-height:56px;font-size:17px}.hkg .pk-again{--ink:var(--hkg-text-2);align-self:center}.pk-tools{display:flex;flex-direction:column;gap:var(--hkg-s4)}

/* login */
.pk-login{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:var(--hkg-s6) var(--hkg-s4)}
.hkg .pk-login-card{width:100%;max-width:400px;align-items:center;text-align:center;padding:var(--hkg-s7) var(--hkg-s5)}
.pk-msg{min-height:1.4em}
.pk-keylogin{width:100%}
.hkg .pk-keylogin>summary{justify-content:center}

/* iPad and desktop from 768 px (HK Glass 1.2; I-P1): top tabs, no dock, two columns, a card never wider than 560 px,
   the left column stays in view while the right one scrolls (no empty half) */
@media (min-width:768px){
  .hkg{--hkg-dock-h:0px}.hkg .hkg-dock{display:none}
  .hkg .pk-tabs{display:grid;grid-auto-columns:auto;flex:0 1 auto;min-width:0}
  .hkg .pk-tabs>button{padding:0 10px}
  .hkg .pk-main{max-width:1120px;padding-left:var(--hkg-s6);padding-right:var(--hkg-s6)}
  .hkg .pk-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--hkg-s5);align-items:start}
  .hkg .pk-cols>.hkg-stack:first-child{position:sticky;top:calc(56px + var(--hkg-safe-t) + var(--hkg-s4))}
  .hkg .pk-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--hkg-s4);align-items:start}.hkg .pk-grid>.pk-span{grid-column:1/-1}
  .hkg .pk-main>.hkg-card,.hkg .pk-main>.pk-look,.hkg .pk-cols .hkg-card,.hkg .pk-grid>.hkg-card{max-width:560px}
  .pk-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--hkg-s4);align-items:center}.pk-confirm{top:50%;bottom:auto;transform:translateY(-40%)}.pk-confirm.is-open{transform:translateY(-50%)}
}
@media (min-width:768px) and (max-width:899px){.hkg .hkg-bar__brand>span,.hkg .hkg-bar__brand>em{display:none}}   /* upright iPad: the logo, the tabs, the name */
@media (min-width:1024px){.hkg .pk-cols{grid-template-columns:minmax(0,560px) minmax(0,1fr)}}