/* Weekly availability grid (js/avail-grid.js): the profile card design, used read-only and interactive. Generic class names (av-*), tokens from styles.css. No blur. */
.av-wrap{--av-a:var(--primary);--av-b:var(--teal-light);display:grid;gap:10px;min-width:0}
.av-grid{display:grid;gap:5px;min-width:0}
.av-r{display:grid;grid-template-columns:86px repeat(7,minmax(0,1fr));gap:5px;align-items:center;min-width:0}
.av-h,.av-s{margin:0;padding:0;border:0;background:none;font:inherit;color:var(--text-soft2);line-height:1.3;min-width:0}
.av-h{text-align:center;font-size:.78rem;font-weight:700;padding:4px 0;border-radius:10px;overflow:hidden;text-overflow:clip;white-space:nowrap}
.av-s{font-size:.82rem;font-weight:700;text-align:left;overflow-wrap:anywhere}
.av-x{display:grid;place-items:center;height:34px;min-width:0;padding:0;border-radius:10px;background:var(--tint-soft);border:1px solid var(--line-chip);color:transparent}
.av-x svg{width:16px;height:16px}
.av-x.on{background:linear-gradient(135deg,var(--av-a),var(--av-b));border-color:transparent;box-shadow:0 6px 14px -8px var(--av-a);color:#fff}
:root[data-theme="dark"] .av-x.on{color:#04201c}
/* interactive */
.av-wrap:not(.av-ro) .av-x,.av-wrap:not(.av-ro) .av-h,.av-wrap:not(.av-ro) .av-s{cursor:pointer}
.av-wrap:not(.av-ro) .av-x{transition:background .15s,border-color .15s,box-shadow .15s}
.av-wrap:not(.av-ro) .av-x:not(.on):hover{border-color:var(--av-a);background:var(--tint)}
.av-wrap:not(.av-ro) .av-h:hover,.av-wrap:not(.av-ro) .av-s:hover{background:var(--tint);color:var(--ink)}
.av-wrap:not(.av-ro) .av-s{padding:4px 6px;border-radius:10px}
.av-x:focus-visible,.av-h:focus-visible,.av-s:focus-visible,.av-act:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.av-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.av-act{min-height:36px;padding:0 14px;border-radius:99px;border:1.5px solid var(--btn-line);background:var(--card);color:var(--primary);font:inherit;font-size:.86rem;font-weight:700;cursor:pointer}
.av-act:hover{background:var(--tint);border-color:var(--primary)}
.av-act-x{color:var(--text-soft2);border-color:var(--line-field)}
.av-sum{margin-left:auto;font-size:.88rem;font-weight:700;color:var(--ink)}
.av-sum.av-none{color:var(--muted);font-weight:600}
.av-note{margin:0;font-size:.85rem;line-height:1.5;color:var(--muted)}
.fld.bad .av-x:not(.on){border-color:var(--coral)}
@media(max-width:479px){
  .av-r{grid-template-columns:64px repeat(7,minmax(0,1fr));gap:4px}
  .av-grid{gap:4px}
  .av-x{height:36px;border-radius:9px}
  .av-x svg{width:14px;height:14px}
  .av-h{font-size:.7rem;padding:4px 0}
  .av-s{font-size:.74rem}
  .av-wrap:not(.av-ro) .av-s{padding:4px 2px}
  .av-sum{margin-left:0;flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){.av-wrap:not(.av-ro) .av-x{transition:none}}