/* Small copper cursors, with native text carets and resize handles. */
@media (hover: hover) and (pointer: fine) {
  .portfolio-page { cursor: url("../assets/cursor.svg") 3 2, auto; }
  .portfolio-page :is(a, button, summary, label[for], [role="button"]) { cursor: url("../assets/cursor-hand.svg") 9 2, pointer; }
  .portfolio-page :is(input, textarea, [contenteditable="true"]) { cursor: text; }
  .portfolio-page :is(select, input[type="checkbox"], input[type="radio"], input[type="range"], input[type="color"], input[type="file"], input[type="button"], input[type="submit"]) { cursor: auto; }
  .portfolio-page :is(button:disabled, input:disabled, select:disabled, textarea:disabled) { cursor: not-allowed; }
}
.cursor-halo {
  position: fixed;
  top: 0;
  left: 0;
  width: 30px;
  height: 30px;
  margin: -15px 0 0 -15px;
  z-index: 50;
  pointer-events: none;
  border: 1px solid var(--orange);
  border-radius: 50%;
  opacity: 0;
  transition: opacity .15s, width .18s, height .18s, margin .18s, background-color .18s;
}
.cursor-halo.is-visible { opacity: .45; }
.cursor-halo.is-action { width: 42px; height: 42px; margin: -21px 0 0 -21px; background: #d8915910; }
.cursor-halo.is-pressed { width: 22px; height: 22px; margin: -11px 0 0 -11px; }
@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce), (forced-colors: active), print {
  .cursor-halo { display: none; }
}
@media (forced-colors: active) {
  .portfolio-page { cursor: auto; }
  .portfolio-page :is(a, button, summary, label[for], [role="button"]) { cursor: pointer; }
}