/* owner: SHELL | contract: DESIGN_BRIEF.md section 13 (component vocabulary). Everyone uses these classes and never redefines them. */

/* ===== HUD panel (section 4) ===== */
.kw-panel{
  position:relative;border:1px solid var(--kw-line);border-radius:var(--kw-r-m);
  background:
    radial-gradient(120% 80% at 8% 0%,rgba(248,246,242,.05),transparent 60%),
    linear-gradient(115deg,transparent 40%,rgba(232,182,200,.05) 41%,transparent 43%),
    var(--kw-panel-bg);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  --kw-brk:rgb(var(--kw-accent-rgb) / .6);
}
.kw-panel::before{
  content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:1;
  background:
    linear-gradient(var(--kw-brk),var(--kw-brk)) top left/10px 1.5px no-repeat,
    linear-gradient(var(--kw-brk),var(--kw-brk)) top left/1.5px 10px no-repeat,
    linear-gradient(var(--kw-brk),var(--kw-brk)) top right/10px 1.5px no-repeat,
    linear-gradient(var(--kw-brk),var(--kw-brk)) top right/1.5px 10px no-repeat,
    linear-gradient(var(--kw-brk),var(--kw-brk)) bottom left/10px 1.5px no-repeat,
    linear-gradient(var(--kw-brk),var(--kw-brk)) bottom left/1.5px 10px no-repeat,
    linear-gradient(var(--kw-brk),var(--kw-brk)) bottom right/10px 1.5px no-repeat,
    linear-gradient(var(--kw-brk),var(--kw-brk)) bottom right/1.5px 10px no-repeat;
}
.kw-panel__head{
  display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--kw-line);
  font:500 11px/1.2 var(--kw-font-mono);text-transform:uppercase;letter-spacing:.14em;color:var(--kw-ink-3);
}
.kw-panel__head::before{content:"\25C6";color:var(--kw-gold);font-size:9px}
.kw-panel__title{flex:1;min-width:0}
.kw-panel__actions{display:flex;gap:6px;align-items:center;margin-left:auto}
.kw-panel__status{width:8px;height:8px;border-radius:50%;background:var(--kw-idle)}
.kw-panel__status--ok{background:var(--kw-ok)}.kw-panel__status--wait{background:var(--kw-wait)}.kw-panel__status--warn{background:var(--kw-warn)}.kw-panel__status--bad{background:var(--kw-loss)}
.kw-panel__body{padding:var(--kw-s-4)}
.kw-panel--gold{--kw-brk:rgb(var(--kw-accent-rgb) / .7)}
.kw-panel--rose{--kw-brk:rgba(232,182,200,.7)}
.kw-panel--violet{--kw-brk:rgba(143,124,255,.75)}
.kw-panel--mint{--kw-brk:rgb(var(--kw-mint-rgb) / .7)}
.kw-panel--foil::after{
  content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;background:var(--kw-foil);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
}
.kw-panel--glow{box-shadow:var(--kw-glow-gold)}
:root[data-theme="day"] .kw-panel, :root[data-theme="auto"]:where([data-resolved="day"]) .kw-panel {--kw-brk:rgb(var(--kw-accent-lo-rgb) / .55);box-shadow:var(--kw-shadow)}

/* ===== buttons ===== */
.kw-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--kw-tap);padding:0 20px;
  border-radius:14px;border:1px solid var(--kw-line-2);background:transparent;color:var(--kw-ink);
  font:600 16px/1.2 var(--kw-font-ui);text-decoration:none;white-space:nowrap;
  transition:transform var(--kw-t-fast) var(--kw-ease),box-shadow var(--kw-t-fast) var(--kw-ease),background var(--kw-t-fast) var(--kw-ease);
}
.kw-btn:hover{text-decoration:none;box-shadow:var(--kw-glow-gold)}
.kw-btn:active{transform:translateY(1px)}
.kw-btn--primary{background:var(--kw-foil);color:var(--kw-on-gold);border-color:transparent}
.kw-btn--ghost{background:rgb(var(--kw-accent-rgb) / .06)}
:root[data-theme="day"] .kw-btn--ghost, :root[data-theme="auto"]:where([data-resolved="day"]) .kw-btn--ghost {background:rgb(var(--kw-accent-lo-rgb) / .06)}
.kw-btn--quiet{border-color:transparent;color:var(--kw-t-gold);padding:0 12px;min-height:40px}
.kw-btn--quiet:hover{box-shadow:none;background:rgb(var(--kw-accent-rgb) / .06)}
.kw-btn--danger{border-color:rgb(var(--kw-loss-rgb) / .55);color:var(--kw-t-loss)}
.kw-btn--danger:hover{box-shadow:0 0 0 1px rgb(var(--kw-loss-rgb) / .4),0 0 22px rgb(var(--kw-loss-rgb) / .18)}
.kw-btn--lg{min-height:56px;font-size:17px;padding:0 26px;border-radius:16px}
.kw-btn--block{display:flex;width:100%}
.kw-btn--icon{padding:0;width:var(--kw-tap);min-width:var(--kw-tap)}
/* A disabled button is still READ (it often carries the only explanation, "Connect QuickBooks (coming)"): flat, dashed, in the quiet text colour at full strength, never faded by half (half-strength
   text on the page was 1.9 to 1 in Evening). WCAG exempts disabled controls, but she should not have to squint to find out why. */
.kw-btn[disabled],.kw-btn[aria-disabled="true"]{opacity:1;cursor:not-allowed;box-shadow:none;transform:none;background:var(--kw-bg-3);color:var(--kw-ink-3);border:1px dashed var(--kw-line-2);filter:none}
.kw-btn[disabled]:hover,.kw-btn[aria-disabled="true"]:hover{box-shadow:none;background:var(--kw-bg-3)}
.kw-btn__label{display:inline-block}

/* ===== chips ===== */
.kw-chip{
  display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:2px 12px;border-radius:var(--kw-r-pill);
  border:1px solid var(--kw-line-2);background:transparent;color:var(--kw-ink-2);font:500 13px/1.2 var(--kw-font-ui);white-space:nowrap;
}
button.kw-chip{cursor:pointer;min-height:36px;background:rgb(var(--kw-accent-rgb) / .06)}
button.kw-chip:hover{box-shadow:var(--kw-glow-gold)}
.kw-chip[aria-pressed="true"],.kw-chip--on{border-color:var(--kw-gold);color:var(--kw-t-gold);background:rgb(var(--kw-accent-rgb) / .12)}
.kw-chip--ok{border-color:rgb(var(--kw-ok-rgb) / .45);color:var(--kw-t-mint)}
.kw-chip--wait{border-color:rgba(165,151,255,.5);color:var(--kw-t-violet)}
.kw-chip--warn{border-color:rgb(var(--kw-warn-rgb) / .55);color:var(--kw-t-warn)}
.kw-chip--bad{border-color:rgb(var(--kw-loss-rgb) / .55);color:var(--kw-t-loss)}
.kw-chip--idle{color:var(--kw-ink-3)}
.kw-chip__glyph{font-size:11px;line-height:1}

/* ===== number tiles ===== */
.kw-tile,.kw-stat{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border:1px solid var(--kw-line);border-radius:var(--kw-r-m);background:var(--kw-bg-2)}
.kw-stat__label{font:500 11px/1.2 var(--kw-font-mono);text-transform:uppercase;letter-spacing:.14em;color:var(--kw-ink-3)}
.kw-stat__value{font:600 28px/1.1 var(--kw-font-ui);font-variant-numeric:tabular-nums}
.kw-stat__unit{font-size:14px;color:var(--kw-ink-3);margin-left:4px;font-weight:500}
.kw-stat__delta{font-size:13px;color:var(--kw-ink-2)}
.kw-stat__hint{font-size:13px;color:var(--kw-ink-3)}
.kw-stat--ok .kw-stat__value{color:var(--kw-t-mint)}.kw-stat--bad .kw-stat__value{color:var(--kw-t-loss)}.kw-stat--warn .kw-stat__value{color:var(--kw-t-warn)}
.kw-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--kw-s-3)}

/* ===== the three standard blocks ===== */
.kw-blocks{display:grid;gap:var(--kw-s-4);grid-template-columns:1fr}
@media (min-width:1100px){.kw-blocks{grid-template-columns:1.35fr 1fr 1fr;align-items:stretch}}
.kw-needs__count{margin-left:auto;color:var(--kw-t-gold);font-weight:500}
.kw-needs__row{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;padding:12px 0;border-bottom:1px solid var(--kw-line)}
.kw-needs__row:last-of-type{border-bottom:0}
.kw-needs__icon{grid-row:1/3;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgb(var(--kw-accent-rgb) / .10);color:var(--kw-t-gold)}
.kw-needs__title{font:600 16px/1.3 var(--kw-font-ui)}
.kw-needs__detail{font-size:14px;color:var(--kw-ink-2)}
.kw-needs__act{grid-column:1/3;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px}
.kw-needs__act .kw-btn{min-height:56px;flex:1 1 auto}
@media (min-width:720px){.kw-needs__act{grid-column:2;margin-top:8px}.kw-needs__act .kw-btn{flex:0 0 auto}}
.kw-needs__empty{display:flex;align-items:center;gap:12px;padding:10px 0;color:var(--kw-ink-2)}
.kw-needs__check{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--kw-mint);box-shadow:var(--kw-glow-mint);background:rgb(var(--kw-mint-rgb) / .1)}
.kw-needs__more{margin-top:8px}
.kw-doing__value{font:600 40px/1.05 var(--kw-font-ui);font-variant-numeric:tabular-nums;text-shadow:var(--kw-hero-shadow);overflow-wrap:anywhere}
@media (min-width:1100px){.kw-doing__value{font-size:52px}}
.kw-doing__value--long{font-size:24px;line-height:1.25}
@media (min-width:1100px){.kw-doing__value--long{font-size:26px}}
.kw-doing__label{color:var(--kw-ink-2);font-size:15px;margin-top:4px}
.kw-doing__row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0}
.kw-doing__spark{height:64px;margin:6px 0}
.kw-doing__sub{font-size:14px;color:var(--kw-ink-2)}
.kw-spark{width:100%;height:100%}
.kw-spark__line{fill:none;stroke:var(--kw-gold);stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.kw-spark__line--dotted{stroke-dasharray:2 5;stroke:var(--kw-ink-3)}
.kw-spark__area{fill:rgb(var(--kw-accent-rgb) / .14);stroke:none}
.kw-spark__dot{fill:var(--kw-gold-hi)}
.kw-ask__who{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:14px;color:var(--kw-ink-2)}
.kw-ask__who strong{color:var(--kw-ink);font-weight:600}
.kw-ask__avatar{width:36px;height:36px;border-radius:50%;overflow:hidden;background:rgb(var(--kw-rose-gold-rgb) / .18);display:grid;place-items:center;flex:none;border:1px solid var(--kw-line-2)}
.kw-ask__row{display:flex;flex-wrap:wrap;gap:8px}
/* the box takes a whole line when the column is narrow and the Ask button drops under it (not squeezed beside it), and a long hint ends in an ellipsis, never mid-word */
.kw-ask__row .kw-input{flex:1 1 15em;min-width:0;text-overflow:ellipsis}
.kw-ask__row .kw-input::placeholder{font-size:14px;text-overflow:ellipsis}
.kw-ask__btns{display:flex;gap:8px;flex:none}
.kw-ask__chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.kw-ask__reply{margin-top:12px;padding:12px 14px;border-radius:14px 14px 14px 4px;background:var(--kw-bg-3);border:1px solid var(--kw-line);animation:kw-pop var(--kw-t-med) var(--kw-ease)}
.kw-ask__reply p{font-size:15px}
.kw-ask__acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.kw-ask__who-reply{font:500 11px/1 var(--kw-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--kw-ink-3);margin-bottom:6px}

/* ===== empty states ===== */
.kw-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:var(--kw-s-6) var(--kw-s-4)}
.kw-empty__art{width:min(260px,70%);margin-bottom:6px}
.kw-empty__title{font:600 30px/1.15 var(--kw-font-display);font-feature-settings:"lnum"}
@media (min-width:720px){.kw-empty__title{font-size:38px}}
.kw-empty__body{color:var(--kw-ink-2);max-width:44ch}
.kw-empty__acts{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:8px}

/* ===== forms ===== */
.kw-field{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--kw-s-4)}
.kw-field__label{font:600 14px/1.2 var(--kw-font-ui);color:var(--kw-ink-2)}
.kw-field__hint{font-size:13px;color:var(--kw-ink-3)}
.kw-field__err{font-size:14px;color:var(--kw-t-loss);min-height:0}
.kw-field__err:empty{display:none}
.kw-input,.kw-select,.kw-textarea{
  width:100%;min-height:var(--kw-tap);padding:10px 14px;border-radius:12px;border:1px solid var(--kw-line-2);background:var(--kw-bg-3);color:var(--kw-ink);
  font:400 16px/1.3 var(--kw-font-ui);transition:box-shadow var(--kw-t-fast) var(--kw-ease),border-color var(--kw-t-fast) var(--kw-ease);
}
.kw-textarea{min-height:110px;resize:vertical}
.kw-input::placeholder,.kw-textarea::placeholder{color:var(--kw-ink-3)}
.kw-input:focus,.kw-select:focus,.kw-textarea:focus{border-color:var(--kw-gold);box-shadow:var(--kw-glow-gold);outline:none}
.kw-input[aria-invalid="true"]{border-color:var(--kw-loss)}
.kw-input[readonly]{opacity:.75}
.kw-select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--kw-ink-3) 50%),linear-gradient(135deg,var(--kw-ink-3) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:36px}
.kw-input--code{font:500 28px/1 var(--kw-font-mono);letter-spacing:.5em;text-align:center}
.kw-check{display:flex;gap:12px;align-items:flex-start;min-height:var(--kw-tap);padding:8px 0;cursor:pointer}
.kw-check input{appearance:none;-webkit-appearance:none;flex:none;width:26px;height:26px;margin-top:1px;border-radius:8px;border:1.5px solid var(--kw-line-2);background:var(--kw-bg-3);display:grid;place-items:center;cursor:pointer}
.kw-check input:checked{background:var(--kw-foil);border-color:transparent}
.kw-check input:checked::after{content:"\2713";color:var(--kw-on-gold);font-weight:700;font-size:16px;line-height:1}
.kw-check__text{display:flex;flex-direction:column;gap:2px}
.kw-check__text small{color:var(--kw-ink-3);font-size:13px}
.kw-switch{position:relative;flex:none;width:52px;height:30px;border-radius:var(--kw-r-pill);border:1px solid var(--kw-line-2);background:var(--kw-bg-3);padding:0;transition:background var(--kw-t-fast)}
.kw-switch::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--kw-ink-3);transition:transform var(--kw-t-med) var(--kw-ease),background var(--kw-t-fast)}
.kw-switch[aria-checked="true"]{background:rgb(var(--kw-accent-rgb) / .25);border-color:var(--kw-gold)}
.kw-switch[aria-checked="true"]::after{transform:translateX(22px);background:var(--kw-gold-hi)}
.kw-row{display:flex;align-items:center;gap:12px;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--kw-line)}
.kw-row:last-child{border-bottom:0}
.kw-row__text{display:flex;flex-direction:column;gap:2px;min-width:0}
.kw-row__text small{color:var(--kw-ink-3);font-size:13px}
.kw-seg{display:inline-flex;border:1px solid var(--kw-line-2);border-radius:12px;padding:3px;background:var(--kw-bg-3);gap:2px}
.kw-seg button{min-height:40px;padding:0 16px;border:0;border-radius:9px;background:transparent;color:var(--kw-ink-2);font-weight:600}
.kw-seg button[aria-pressed="true"]{background:var(--kw-foil);color:var(--kw-on-gold)}
.kw-form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:var(--kw-s-3)}

/* ===== tables ===== */
.kw-table{font-size:15px}
.kw-table caption{caption-side:top;text-align:left;padding:0 0 8px;color:var(--kw-ink-3);font-size:13px}
.kw-table th{font:500 11px/1.2 var(--kw-font-mono);text-transform:uppercase;letter-spacing:.14em;color:var(--kw-ink-3);text-align:left;padding:8px 10px;border-bottom:1px solid var(--kw-line)}
.kw-table td{padding:12px 10px;border-bottom:1px solid var(--kw-line);vertical-align:middle}
.kw-table tbody tr:hover{background:rgb(var(--kw-accent-rgb) / .06)}
.kw-table tr[tabindex]{cursor:pointer}
.kw-table .is-right{text-align:right}
@media (max-width:719px){
  .kw-table--cards thead{display:none}
  .kw-table--cards,.kw-table--cards tbody,.kw-table--cards tr,.kw-table--cards td{display:block;width:100%}
  .kw-table--cards tr{border:1px solid var(--kw-line);border-radius:var(--kw-r-m);padding:8px 12px;margin-bottom:10px;background:var(--kw-bg-2)}
  .kw-table--cards td{border:0;padding:6px 0;display:flex;justify-content:space-between;gap:12px;text-align:right}
  .kw-table--cards td::before{content:attr(data-label);font:500 11px/1.4 var(--kw-font-mono);text-transform:uppercase;letter-spacing:.14em;color:var(--kw-ink-3);text-align:left;flex:none}
}

/* ===== sub navigation ===== */
.kw-subnav{display:flex;gap:8px;overflow-x:auto;padding:4px 0 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.kw-subnav::-webkit-scrollbar{display:none}
.kw-subnav a,.kw-subnav button{flex:none;display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:var(--kw-r-pill);border:1px solid var(--kw-line);background:transparent;color:var(--kw-ink-2);font:600 14px/1 var(--kw-font-ui);text-decoration:none}
.kw-subnav a:hover{border-color:var(--kw-line-2);text-decoration:none;color:var(--kw-ink)}
.kw-subnav a[aria-current="page"]{border-color:var(--kw-gold);color:var(--kw-t-gold);background:rgb(var(--kw-accent-rgb) / .12)}

/* ===== overlays: modal, sheet, toast ===== */
.kw-modal-scrim{position:fixed;inset:0;display:grid;place-items:center;padding:var(--kw-gutter);background:var(--kw-scrim);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:var(--kw-z-modal);animation:kw-fade var(--kw-t-med) var(--kw-ease)}
.kw-modal{width:min(520px,100%);max-height:calc(100dvh - 2 * var(--kw-gutter));overflow:auto;border-radius:var(--kw-r-l);border:1px solid var(--kw-line-2);background:var(--kw-bg-2);box-shadow:var(--kw-shadow);animation:kw-pop var(--kw-t-med) var(--kw-ease)}
.kw-modal--wide{width:min(720px,100%)}
.kw-modal__head{display:flex;align-items:center;gap:12px;padding:16px 18px 8px}
.kw-modal__title{flex:1;font:600 26px/1.15 var(--kw-font-display);font-feature-settings:"lnum"}
.kw-modal__close{flex:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--kw-line);background:transparent;color:var(--kw-ink-2);font-size:22px;line-height:1}
.kw-modal__close:hover{border-color:var(--kw-line-2);color:var(--kw-ink)}
.kw-modal__body{padding:8px 18px 18px}
.kw-modal__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.kw-modal__lead{color:var(--kw-ink-2);margin-bottom:12px}
.kw-sheetmodal{align-items:end;padding:0}
@media (min-width:720px){.kw-sheetmodal{align-items:center;padding:var(--kw-gutter)}}
.kw-sheetmodal .kw-modal{width:min(760px,100%);border-radius:var(--kw-r-l) var(--kw-r-l) 0 0;max-height:92dvh}
@media (min-width:720px){.kw-sheetmodal .kw-modal{border-radius:var(--kw-r-l)}}
.kw-toast{display:flex;align-items:center;gap:12px;max-width:min(520px,100%);padding:10px 12px 10px 16px;border-radius:var(--kw-r-pill);border:1px solid var(--kw-line-2);background:var(--kw-bg-3);box-shadow:var(--kw-shadow);pointer-events:auto;animation:kw-rise var(--kw-t-med) var(--kw-ease)}
.kw-toast--ok{border-color:rgb(var(--kw-ok-rgb) / .5)}.kw-toast--bad{border-color:rgb(var(--kw-loss-rgb) / .6)}.kw-toast--warn{border-color:rgb(var(--kw-warn-rgb) / .6)}
.kw-toast__text{font-size:15px}
.kw-toast .kw-btn{min-height:36px;padding:0 14px;border-radius:var(--kw-r-pill);font-size:14px}

/* ===== small parts ===== */
.kw-mock{display:inline-flex;align-items:center;padding:2px 8px;border-radius:6px;border:1px solid rgb(var(--kw-accent-rgb) / .5);color:var(--kw-t-gold);font:500 10px/1.4 var(--kw-font-mono);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.kw-ribbon{display:flex;align-items:center;justify-content:center;gap:8px;padding:6px 12px;background:linear-gradient(rgb(var(--kw-accent-rgb) / .12),rgb(var(--kw-accent-rgb) / .12)),var(--kw-bg-1);border-bottom:1px solid var(--kw-line-2);color:var(--kw-t-gold);font:500 11px/1.3 var(--kw-font-mono);letter-spacing:.12em;text-transform:uppercase;text-align:center}
.kw-live{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--kw-mint);box-shadow:0 0 0 0 rgb(var(--kw-mint-rgb) / .6);animation:kw-pulse 2.4s ease-in-out infinite}
.kw-hotspot{position:absolute;width:44px;height:44px;border:0;background:transparent;color:transparent;cursor:pointer}
.kw-hatch{background-image:repeating-linear-gradient(45deg,currentColor 0 2px,transparent 2px 6px)}
.kw-banner{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:var(--kw-r-m);border:1px solid var(--kw-line-2);background:rgb(var(--kw-accent-rgb) / .07);color:var(--kw-ink-2);font-size:14px;line-height:1.45}
.kw-banner--ok{border-color:rgb(var(--kw-ok-rgb) / .4);background:rgb(var(--kw-ok-rgb) / .07)}
.kw-banner--bad{border-color:rgb(var(--kw-loss-rgb) / .45);background:rgb(var(--kw-loss-rgb) / .07)}
.kw-banner--wait{border-color:rgba(165,151,255,.45);background:rgba(165,151,255,.07)}
.kw-banner strong{color:var(--kw-ink)}
.kw-progress{display:block;width:100%;height:8px;border-radius:var(--kw-r-pill);background:var(--kw-bg-3);overflow:hidden;border:0;appearance:none;-webkit-appearance:none}
.kw-progress::-webkit-progress-bar{background:var(--kw-bg-3)}
.kw-progress::-webkit-progress-value{background:var(--kw-foil);border-radius:var(--kw-r-pill)}
.kw-progress::-moz-progress-bar{background:var(--kw-foil);border-radius:var(--kw-r-pill)}
.kw-progress__wrap{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--kw-ink-2)}
.kw-skel{display:flex;flex-direction:column;gap:10px;padding:6px 0}
.kw-skel__bar{position:relative;height:14px;border-radius:7px;background:var(--kw-bg-3);overflow:hidden}
.kw-skel__bar:nth-child(2n){width:80%}.kw-skel__bar:nth-child(3n){width:62%}
.kw-skel__bar::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(248,246,242,.07),transparent);animation:kw-shimmer 1.4s infinite}
.kw-ring{display:block}
.kw-ring__track{fill:none;stroke:var(--kw-bg-3);stroke-width:6}
.kw-ring__arc{fill:none;stroke:var(--kw-gold);stroke-width:6;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%}
.kw-ring__text{fill:var(--kw-ink);font:600 20px var(--kw-font-ui);text-anchor:middle;dominant-baseline:central}
.kw-avatar{width:36px;height:36px;border-radius:50%;overflow:hidden;display:grid;place-items:center;flex:none;background:linear-gradient(160deg,var(--kw-rose-gold),var(--kw-gold-lo));color:var(--kw-on-gold);font:700 14px var(--kw-font-ui);border:1px solid var(--kw-line-2)}
.kw-kbd{display:inline-block;padding:1px 7px;border-radius:6px;border:1px solid var(--kw-line-2);font:500 12px var(--kw-font-mono);color:var(--kw-ink-2)}
.kw-dropzone{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:var(--kw-s-5);border:1.5px dashed var(--kw-line-2);border-radius:var(--kw-r-m);background:rgb(var(--kw-accent-rgb) / .06);transition:background var(--kw-t-fast),border-color var(--kw-t-fast)}
.kw-dropzone.is-over{border-color:var(--kw-gold);background:rgb(var(--kw-accent-rgb) / .10)}
.kw-dropzone__input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.kw-stack{display:flex;flex-direction:column;gap:var(--kw-s-4)}
.kw-cluster{display:flex;gap:var(--kw-s-3);flex-wrap:wrap;align-items:center}
.kw-grid{display:grid;gap:var(--kw-s-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.kw-sticky-bar{position:sticky;bottom:calc(84px + env(safe-area-inset-bottom));z-index:5;margin-top:var(--kw-s-4)}
.kw-sticky-bar .kw-btn{width:100%;min-height:56px;box-shadow:var(--kw-shadow)}
@media (min-width:720px){.kw-sticky-bar{display:none}}
.kw-link-btn{display:inline;background:none;border:0;padding:0;color:var(--kw-t-gold);font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer;min-height:0}
.kw-tooltip-host{position:relative}