.home-recording-card{border:1px solid color-mix(in srgb, var(--glow-a) var(--effect-balanced-alpha), var(--border));border-radius:var(--theme-radius-lg);--recording-card-tint:var(--glow-a);background:linear-gradient(155deg, color-mix(in srgb, var(--recording-card-tint) var(--effect-soft-alpha), transparent), transparent 56%), var(--card);min-width:0;min-height:18.5rem;color:var(--card-foreground);box-shadow:var(--shadow-soft);align-content:space-between;padding:1.25rem;display:grid;position:relative;overflow:hidden}.home-recording-card:nth-child(2),.home-recording-card--tone-2{--recording-card-tint:var(--glow-b)}.home-recording-card:nth-child(3),.home-recording-card--tone-3{--recording-card-tint:var(--tertiary)}.home-recording-card--selected{border-color:color-mix(in srgb, var(--primary) var(--effect-strong-alpha), var(--border));box-shadow:0 0 0 .2rem color-mix(in srgb, var(--primary) var(--effect-subtle-alpha), transparent), var(--shadow-raised)}.dark .home-recording-card{border-color:color-mix(in srgb, var(--inverse-foreground) var(--effect-subtle-alpha), transparent);background:linear-gradient(155deg, color-mix(in srgb, var(--recording-card-tint) var(--effect-soft-alpha), transparent), transparent 43%), var(--inverse);color:var(--inverse-foreground);box-shadow:var(--shadow-inverse)}.dark .home-recording-card--selected{border-color:color-mix(in srgb, var(--glow-a) var(--effect-strong-alpha), var(--inverse-foreground-soft));box-shadow:0 0 0 .2rem color-mix(in srgb, var(--glow-a) var(--effect-subtle-alpha), transparent), var(--shadow-inverse)}.home-recording-card-top{justify-content:space-between;align-items:center;gap:1rem;display:flex}.home-recording-number{font:800 .72rem/1 var(--font-display);letter-spacing:.14em;color:var(--muted-foreground)}.dark .home-recording-number{color:color-mix(in srgb, var(--inverse-foreground) var(--effect-balanced-alpha), transparent)}.home-equalizer{align-items:end;gap:.2rem;height:1.75rem;display:flex}.home-equalizer>span{background:var(--glow-a);border-radius:999px;width:.2rem;height:35%}.home-equalizer>span:nth-child(2){height:72%}.home-equalizer>span:nth-child(3){height:100%}.home-equalizer>span:nth-child(4){height:58%}.home-equalizer>span[data-playing]{animation:.9s ease-in-out infinite alternate home-equalizer}.home-equalizer>span[data-playing]:nth-child(2){animation-delay:-400ms}.home-equalizer>span[data-playing]:nth-child(4){animation-delay:-650ms}.home-recording-copy{gap:.3rem;margin:2.5rem 0 1.5rem;display:grid}.home-recording-copy strong{font:750 1.25rem/1.2 var(--font-display)}.home-recording-copy>span{color:var(--muted-foreground)}.home-recording-copy small{color:var(--muted-foreground);margin-top:.5rem}.dark .home-recording-copy>span{color:color-mix(in srgb, var(--inverse-foreground) var(--effect-medium-alpha), transparent)}.dark .home-recording-copy small{color:color-mix(in srgb, var(--inverse-foreground) var(--effect-balanced-alpha), transparent)}.home-recording-progress{background:color-mix(in srgb, var(--foreground) var(--effect-subtle-alpha), transparent);border-radius:999px;height:.2rem;overflow:hidden}.dark .home-recording-progress{background:color-mix(in srgb, var(--inverse-foreground) var(--effect-subtle-alpha), transparent)}.home-recording-progress>span{border-radius:inherit;background:linear-gradient(90deg, var(--glow-a), var(--tertiary));height:100%;transition:width .25s linear;display:block}.home-recording-selected-controls{border-top:1px solid color-mix(in srgb, var(--foreground) var(--effect-subtle-alpha), transparent);gap:.75rem;margin-top:1rem;padding-top:1rem;display:grid}.dark .home-recording-selected-controls{border-color:color-mix(in srgb, var(--inverse-foreground) var(--effect-subtle-alpha), transparent)}.home-recording-timeline{grid-template-columns:auto minmax(5rem,1fr) auto;align-items:center;gap:.65rem;display:grid}.home-recording-timeline>span{min-width:2.5rem;color:var(--muted-foreground);font:700 .72rem/1 var(--font-display);font-variant-numeric:tabular-nums}.home-recording-timeline>span:last-child{text-align:right}.home-recording-timeline input[type=range]{cursor:pointer;appearance:none;width:100%;min-width:0;height:1.5rem;accent-color:var(--primary);background:0 0;margin:0}.home-recording-timeline input[type=range]::-webkit-slider-runnable-track{background:var(--muted);border-radius:999px;height:.25rem}.home-recording-timeline input[type=range]::-webkit-slider-thumb{appearance:none;border:1px solid var(--ring);background:var(--card);width:.75rem;height:.75rem;box-shadow:0 0 0 2px var(--ring-medium);border-radius:999px;margin-top:-.25rem}.home-recording-timeline input[type=range]::-moz-range-track{background:var(--muted);border-radius:999px;height:.25rem}.home-recording-timeline input[type=range]::-moz-range-progress{background:var(--primary);border-radius:999px;height:.25rem}.home-recording-timeline input[type=range]::-moz-range-thumb{border:1px solid var(--ring);background:var(--card);width:.75rem;height:.75rem;box-shadow:0 0 0 2px var(--ring-medium);border-radius:999px}.home-recording-timeline input[type=range]:focus-visible{outline:3px solid var(--ring-medium);outline-offset:2px;border-radius:999px}.home-recording-timeline input[type=range]:disabled{cursor:not-allowed;opacity:.5}.dark .home-recording-timeline>span{color:color-mix(in srgb, var(--inverse-foreground) var(--effect-balanced-alpha), transparent)}.home-recording-seek-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;display:grid}.home-recording-seek-actions button{border:1px solid var(--border);border-radius:var(--theme-radius-sm);background:color-mix(in srgb, var(--elevated) var(--effect-opaque-alpha), transparent);min-height:2.75rem;color:var(--foreground);font:750 .75rem/1 var(--font-display);cursor:pointer;justify-content:center;align-items:center;gap:.4rem;display:inline-flex}.home-recording-seek-actions button:hover,.home-recording-seek-actions button:focus-visible{border-color:var(--primary);background:color-mix(in srgb, var(--primary) var(--effect-subtle-alpha), var(--elevated));color:var(--primary)}.home-recording-seek-actions svg{width:1rem;height:1rem}.dark .home-recording-seek-actions button{border-color:color-mix(in srgb, var(--inverse-foreground) var(--effect-subtle-alpha), transparent);background:color-mix(in srgb, var(--inverse-foreground) var(--effect-subtle-alpha), transparent);color:var(--inverse-foreground)}.home-recording-play{border:1px solid color-mix(in srgb, var(--glow-a) var(--effect-soft-alpha), transparent);background:color-mix(in srgb, var(--glow-a) var(--effect-subtle-alpha), transparent);min-height:3rem;color:var(--glow-a);font:750 .82rem/1 var(--font-display);cursor:pointer;border-radius:999px;justify-content:center;align-items:center;gap:.6rem;margin-top:1rem;transition:background-color .2s,color .2s,transform .2s;display:flex}.home-recording-play:hover,.home-recording-play:focus-visible{background:var(--glow-a);color:var(--gradient-foreground);transform:translateY(-.12rem)}.home-recording-play svg{width:1rem;height:1rem}@keyframes home-equalizer{0%{transform:scaleY(.35)}to{transform:scaleY(1)}}@media (prefers-reduced-motion:reduce){html:not([data-kicc-motion=full]) .home-recording-play{transition:none}html:not([data-kicc-motion=full]) .home-equalizer>span[data-playing]{animation:none}html:not([data-kicc-motion=full]) :is(.home-recording-play:hover,.home-recording-play:focus-visible){transform:translate(0,0)}}html[data-kicc-motion=reduced] .home-recording-play{transition:none}html[data-kicc-motion=reduced] .home-equalizer>span[data-playing]{animation:none}html[data-kicc-motion=reduced] :is(.home-recording-play:hover,.home-recording-play:focus-visible){transform:translate(0,0)}
