/* Life OS — finishing touches: pointer tilt and a resting glow on edges. Loaded last. */

/* ------------------------------------------------------------------ tilt toward the pointer */

.is-tilt {
  transform: perspective(820px) rotateX(var(--tx, 0deg)) rotateY(var(--ty, 0deg)) translateZ(var(--tz, 0px)) !important;
  will-change: transform;
}
/* windows had no transform transition of their own */
.ed-lib,
.ed-toolbar,
.ed-insp,
.onb-card,
.tl-empty-card,
.d-next,
.d-today,
.sum-chip,
.brand,
.set-folder,
.tpl-row {
  transition: transform 0.3s var(--ease), box-shadow 0.3s ease, border-color 0.25s ease;
}
/* a soft highlight that sits under the pointer on the leaning surface */
.act,
.ov-day,
.ov-item,
.d-next,
.d-today,
.onb-chip,
.rp-opt,
.ed-lib,
.ed-toolbar,
.ed-insp {
  background-attachment: scroll;
}
.act.is-tilt::after,
.ov-day.is-tilt::after,
.ov-item.is-tilt::after,
.d-next.is-tilt::after,
.d-today.is-tilt::after,
.onb-chip.is-tilt::after,
.rp-opt.is-tilt::after,
.ed-lib.is-tilt::after,
.ed-toolbar.is-tilt::after,
.ed-insp.is-tilt::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(260px circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, 0.11), transparent 62%);
}
.d-next,
.d-today,
.ov-item,
.onb-chip,
.rp-opt {
  position: relative;
}

/* ------------------------------------------------------------------ resting glow on edges */

/* panels: a faint accent rim instead of a plain hairline */
.glass,
.tl {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.07),
    0 30px 60px -34px rgba(0, 0, 0, 0.9),
    0 0 0 1px rgba(var(--accent-rgb), calc(0.1 * var(--glow))),
    0 0 calc(26px * var(--glow)) rgba(var(--accent-rgb), calc(0.13 * var(--glow)));
}
.glass.is-tilt,
.tl:hover {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 34px 64px -34px rgba(0, 0, 0, 0.9),
    0 0 0 1px rgba(var(--accent-rgb), calc(0.26 * var(--glow))),
    0 0 calc(40px * var(--glow)) rgba(var(--accent-rgb), calc(0.22 * var(--glow)));
}

/* library chips and small tiles glow at rest, not only on hover */
.act {
  box-shadow: 0 0 calc(14px * var(--glow)) rgba(var(--c-rgb), calc(0.2 * var(--glow))), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.sum-chip {
  box-shadow: 0 0 calc(12px * var(--glow)) rgba(var(--c-rgb), calc(0.26 * var(--glow)));
}
.tb-date,
.tb-status.is-template,
.tabs,
.seg,
.dd,
.input:not(:focus) {
  box-shadow: 0 0 calc(12px * var(--glow)) rgba(var(--accent-rgb), calc(0.1 * var(--glow)));
}
.live-chip {
  box-shadow: 0 0 calc(16px * var(--glow)) rgba(var(--c-rgb), calc(0.3 * var(--glow)));
}
.btn:not(.btn-ghost):not(.btn-primary):not(:disabled),
.chip,
.tb-wd,
.ov-kind:not(.is-on) {
  box-shadow: 0 0 calc(10px * var(--glow)) rgba(var(--accent-rgb), calc(0.09 * var(--glow)));
}
.ip-cell,
.cal-day.has-custom,
.cal-day.has-template {
  box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb), 0.12);
}
.color-dot {
  box-shadow: 0 0 calc(8px * var(--glow)) var(--c);
}
.insp-link-slot:not(.is-on) {
  box-shadow: 0 0 calc(8px * var(--glow)) rgba(var(--c-rgb), calc(0.18 * var(--glow)));
}

/* overview: quiet days keep a thin lit edge so the grid reads as one piece */
.ov-day.is-empty {
  border-style: solid;
  border-color: rgba(150, 162, 255, 0.28);
  box-shadow: inset 0 0 0 1px rgba(150, 162, 255, 0.06), 0 0 calc(10px * var(--glow)) rgba(150, 162, 255, calc(0.14 * var(--glow)));
}
.ov-next-title span,
.lib-count {
  box-shadow: 0 0 calc(10px * var(--glow)) rgba(var(--accent-rgb), calc(0.2 * var(--glow)));
}

/* display: the small read-outs get the same lit edge as the big cards */
.d-today-item {
  box-shadow: 0 0 calc(16px * var(--glow)) rgba(var(--n-rgb), calc(0.45 * var(--glow))), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.d-bar,
.d-day-bar {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05), 0 0 calc(14px * var(--glow)) rgba(var(--accent-rgb), calc(0.22 * var(--glow)));
}
.d-ctl,
.ov-flip {
  box-shadow: 0 0 calc(12px * var(--glow)) rgba(var(--accent-rgb), calc(0.22 * var(--glow)));
}

/* minimap + ruler strip */
.tl-mini {
  box-shadow: 0 0 calc(10px * var(--glow)) rgba(var(--accent-rgb), calc(0.16 * var(--glow)));
}