@media (any-hover: hover) and (any-pointer: fine) {
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor]), :root[data-pixel-cursor] body { cursor: var(--pixel-cursor, auto); }
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor]) :where(a,button,summary,select,label:has(input:is([type=radio],[type=checkbox])),[role=button],[type=range],[type=color]) { cursor: var(--pixel-pointer, pointer); }
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor])[data-cursor-held][data-cursor-action=pressed] :where(*) { cursor: var(--pixel-pressed, pointer); }
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor]) :is(p,h1,h2,h3,h4,h5,h6,blockquote,figcaption,[data-cursor-text]) { cursor: var(--pixel-text, text); }
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor]) :is(a[href],button,summary,[role=button]) :where(p,h1,h2,h3,h4,h5,h6,span,strong,em) { cursor: var(--pixel-pointer, pointer); }
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor]) :is(input:not([type=radio],[type=checkbox],[type=range],[type=color],[type=button],[type=submit]),textarea,[contenteditable=true]) { cursor: var(--pixel-text, text); }
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor]) :is(button[aria-busy=true],[aria-busy=true],[data-cursor-busy],[aria-busy=true] *,[data-cursor-busy] *) { cursor: var(--pixel-busy, progress); }
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor]) :is(input:disabled,:disabled,[aria-disabled=true],:disabled *,[aria-disabled=true] *) { cursor: var(--pixel-disabled, not-allowed); }
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor]) [draggable=true] { cursor: var(--pixel-grab, grab); }
  :is(:root[data-pixel-cursor],[data-cursor-preview][data-pixel-cursor]) [draggable=true]:active { cursor: var(--pixel-grabbing, grabbing); }
  .cursor-preview { cursor: var(--pixel-cursor, auto); }
  .cursor-preview :is(button,a) { cursor: var(--pixel-pointer, pointer); }
  .cursor-preview input { cursor: var(--pixel-text, text); }
}
.cursor-settings { grid-column: 1 / -1; padding: 32px; min-width: 0; }
.cursor-heading { padding-bottom: 24px; margin-bottom: 28px; border-bottom: 1px solid var(--line); }
.cursor-heading .eyebrow { margin-bottom: 10px; font-size: .6875rem; letter-spacing: .16em; }
.cursor-heading h2 { margin: 0 0 10px; font-size: clamp(1.5rem, 3vw, 2rem); letter-spacing: -.035em; }
.cursor-heading p, .cursor-help { color: var(--muted); font-size: .8125rem; line-height: 1.6; }
.cursor-heading p { margin: 0; }
.cursor-help { margin: 8px 0 16px; }
.cursor-settings fieldset { min-width: 0; padding: 0; border: 0; }
.cursor-settings legend { margin-bottom: 12px; font-size: .875rem; font-weight: 850; }
.cursor-collection { margin: 0 0 28px; }
.cursor-collection legend { display: flex; align-items: center; gap: 10px; width: 100%; margin-bottom: 14px; font-size: .9375rem; }
.cursor-collection-count { color: var(--muted); font-size: .6875rem; font-weight: 500; font-variant-numeric: tabular-nums; }
.cursor-options { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.cursor-option { --sprite-a: #171d28; --sprite-b: #1a2130; position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 4px; border: 1px solid var(--line); border-radius: 4px; background: var(--input); font-size: .8125rem; font-weight: 650; text-align: center; cursor: pointer; }
[data-cursor-collection=cute] .cursor-option { --sprite-a: #302c41; --sprite-b: #353047; }
.cursor-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.cursor-option:hover { border-color: color-mix(in srgb,var(--paper) 55%,var(--line)); }
.cursor-option:has(input:checked) { border-color: var(--lime); box-shadow: 0 0 0 1px var(--lime); }
.cursor-option:focus-within { outline: 2px solid var(--paper); outline-offset: 4px; }
.cursor-option-art { display: grid; place-items: center; width: 100%; height: 152px; border-radius: 2px; background-color: var(--sprite-a); background-image: conic-gradient(var(--sprite-b) 25%,transparent 0 50%,var(--sprite-b) 0 75%,transparent 0); background-size: 24px 24px; }
.cursor-option svg { width: 128px; height: 128px; image-rendering: pixelated; }
.cursor-option-caption { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 8px 4px; overflow-wrap: anywhere; }
.cursor-option-check { display: none; color: var(--lime); }
.cursor-option:has(input:checked) .cursor-option-check { display: inline; }
.cursor-basics { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cursor-basics .cursor-options { grid-template-columns: 1fr; }
.cursor-basics .cursor-option { flex-direction: row; align-items: center; padding: 8px; gap: 12px; }
.cursor-basics .cursor-option-art { width: 64px; height: 64px; flex-shrink: 0; }
.cursor-basics .cursor-option svg { width: 40px; height: 40px; }
.cursor-basics .cursor-option-caption { justify-content: flex-start; text-align: start; }
:root[data-theme=light] .cursor-option { --sprite-a: #dbe2eb; --sprite-b: #e2e8f0; }
:root[data-theme=light] [data-cursor-collection=cute] .cursor-option { --sprite-a: #ded9ed; --sprite-b: #e6e1f3; }
.cursor-controls { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 16px; margin-top: 24px; }
.cursor-controls > div { min-width: 0; }
.cursor-controls label { display: block; margin-bottom: 8px; font-size: .8125rem; font-weight: 800; }
.cursor-controls select { width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; color: var(--paper); background: var(--input); font: inherit; font-size: .8125rem; }
.cursor-colors { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.cursor-colors input[type=color] { width: 44px; height: 44px; padding: 3px; border: 1px solid var(--line); border-radius: 6px; background: var(--input); }
.cursor-swatch { width: 28px; height: 44px; position: relative; padding: 0; border: 0; background: transparent; }
.cursor-swatch::before { content: ''; position: absolute; inset: 9px 2px; border: 1px solid #20172e; border-radius: 4px; background: var(--swatch); }
.cursor-touch { display: flex; align-items: center; gap: 10px; margin-top: 20px; min-height: 44px; font-size: .875rem; }
.cursor-touch input { width: 18px; height: 18px; accent-color: var(--lime); }
.cursor-editor { margin: 24px 0; }
.cursor-editor[hidden] { display: none; }
.cursor-editor-body { display: grid; grid-template-columns: minmax(180px,256px) minmax(0,1fr); gap: 24px; align-items: start; }
.cursor-editor canvas { display: block; width: 100%; max-width: 256px; height: auto; border: 1px solid var(--line); border-radius: 4px; image-rendering: pixelated; touch-action: none; cursor: crosshair; }
.cursor-editor canvas:focus-visible { outline: 2px solid var(--lime); outline-offset: 4px; }
.cursor-editor output { display: block; min-height: 24px; margin-top: 8px; color: var(--muted); font-size: .75rem; }
.cursor-inks { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.cursor-inks label { display: flex; align-items: center; gap: 5px; min-height: 44px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 5px; font-size: .75rem; }
.cursor-inks input { accent-color: var(--lime); }
.cursor-inks span { width: 12px; height: 12px; background: var(--ink); border: 1px solid var(--line); }
.cursor-editor-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cursor-editor-actions .button { padding-inline: 12px; font-size: .75rem; }
.cursor-hotspot { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.cursor-hotspot legend { width: 100%; }
.cursor-hotspot label { display: grid; gap: 6px; font-size: .75rem; }
.cursor-hotspot input { width: 80px; min-height: 44px; padding: 8px; border: 1px solid var(--line); border-radius: 5px; background: var(--input); color: var(--paper); font: inherit; }
.cursor-hotspot .cursor-help { flex-basis: 100%; margin-bottom: 0; }
.cursor-preview { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 24px; margin-top: 24px; padding: 20px; border: 1px solid var(--line); border-radius: 6px; background: var(--input); }
.cursor-preview > div:first-child { grid-column: 1 / -1; }
.cursor-preview h3 { margin: 0 0 4px; font-size: 1rem; }
.cursor-preview p { margin: 0; color: var(--muted); font-size: .8125rem; }
.cursor-preview-card { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--paper); text-align: start; box-shadow: inset 0 2px 1px var(--glass-edge, #ffffff25), inset 0 -2px 1px #0003; }
.cursor-preview-card :is(svg,img) { display: block; width: 128px; height: 128px; image-rendering: pixelated; }
.cursor-preview-card strong { font-size: 1rem; }
.cursor-preview-card small { color: var(--muted); line-height: 1.5; }
.cursor-action-options { display: flex; flex-wrap: wrap; gap: 8px; grid-column: 1 / -1; }
.cursor-action-options button { min-height: 40px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); color: var(--paper); font: inherit; font-size: .75rem; }
.cursor-action-options button[aria-pressed=true] { border-color: var(--lime); color: var(--lime); }
.cursor-action-label { color: var(--muted); font-size: .75rem; }
.cursor-preview-details { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; min-width: 0; }
.cursor-preview-details a { min-height: 44px; display: inline-flex; align-items: center; color: var(--lime); text-decoration: underline; font-size: .875rem; }
.cursor-preview-details label { display: grid; width: 100%; gap: 8px; font-size: .8125rem; }
.cursor-preview-details input { width: 100%; min-width: 0; min-height: 44px; padding: 10px; border: 1px solid var(--line); border-radius: 5px; background: var(--panel); color: var(--paper); font: inherit; }
.cursor-save { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 24px; }
.cursor-save .cursor-help { width: 100%; margin: 0; }
.cursor-settings .form-status { min-height: 22px; margin: 12px 0 0; color: var(--lime); font-size: .8125rem; }
.cursor-settings .form-status[data-error] { color: var(--pink); }
.cursor-settings :is(input,select,button,a):focus-visible { outline: 2px solid var(--paper); outline-offset: 3px; }
.cursor-impact { position: absolute; inset: 0; z-index: 5; overflow: hidden; border-radius: inherit; pointer-events: none; animation: cursor-impact-fade .62s ease-out forwards; contain: layout paint; }
.cursor-impact svg { display: block; width: 100%; height: 100%; }
.cursor-impact-particle { position: absolute; left: var(--impact-x); top: var(--impact-y); width: 8px; height: 8px; background: var(--impact-color); box-shadow: 1px 1px 0 #20172e; clip-path: polygon(0 0,75% 0,75% 25%,100% 25%,100% 75%,50% 75%,50% 100%,0 100%); animation: cursor-shard .55s cubic-bezier(.18,.65,.36,1) forwards; }
.cursor-impact[data-effect=hearts] .cursor-impact-particle { width: 12px; height: 12px; background: #ff94c7; clip-path: polygon(0 20%,20% 20%,20% 0,40% 0,40% 20%,60% 20%,60% 0,80% 0,80% 20%,100% 20%,100% 60%,80% 60%,80% 80%,60% 80%,60% 100%,40% 100%,40% 80%,20% 80%,20% 60%,0 60%); }
@keyframes cursor-shard { from { opacity: 1; transform: translate(-50%,-50%) scale(1); } to { opacity: 0; transform: translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(var(--spin)) scale(.35); } }
@keyframes cursor-impact-fade { 0%,35% { opacity: 1; } 100% { opacity: 0; } }
@media (max-width: 48rem) {
  .cursor-settings { padding: 16px; }
  .cursor-options { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .cursor-option-art { height: 128px; }
  .cursor-option svg { width: 108px; height: 108px; }
  .cursor-option-caption { font-size: .75rem; }
  .cursor-basics .cursor-option { flex-direction: column; gap: 4px; }
  .cursor-basics .cursor-option-caption { justify-content: center; text-align: center; }
  .cursor-controls { grid-template-columns: 1fr; gap: 14px; }
  .cursor-editor-body, .cursor-preview { grid-template-columns: 1fr; gap: 18px; }
  .cursor-editor canvas { max-width: 256px; }
  .cursor-save .button { flex: 1; }
}
@media (prefers-reduced-motion: reduce) { .cursor-impact { display: none; } }