.xtoast-container{z-index:calc(var(--xclues-z-overlay) + 10);gap:var(--xclues-spacing-2);padding:var(--xclues-spacing-3);pointer-events:none;flex-direction:column;justify-content:flex-start;display:flex;position:fixed;top:0;left:0;right:0}@media (min-width:640px){.xtoast-container{width:100%;max-width:480px;padding:var(--xclues-spacing-4);padding-top:var(--xclues-spacing-6);left:50%;right:auto;transform:translate(-50%)}}@media (min-width:1025px){.xtoast-container{max-width:520px;padding-top:var(--xclues-spacing-8)}}.xtoast{pointer-events:auto;align-items:center;gap:var(--xclues-spacing-3);border-radius:var(--xclues-border-radius);-webkit-backdrop-filter:blur(var(--xclues-blur-md));padding:var(--xclues-spacing-3) var(--xclues-spacing-4);box-shadow:var(--xclues-shadow-lg), 0 8px 32px #0000001f;border:1px solid var(--xclues-primary-10);animation:xtoastSlideDown var(--xclues-duration-slow) cubic-bezier(.34, 1.56, .64, 1);will-change:transform, opacity;display:flex}@media (min-width:640px){.xtoast{box-shadow:var(--xclues-shadow-lg), 0 12px 40px #00000026;padding:var(--xclues-spacing-4)}}.xtoast--exiting{animation:xtoastSlideOut var(--xclues-duration-normal) cubic-bezier(.4, 0, 1, 1) forwards}@keyframes xtoastSlideDown{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}@keyframes xtoastSlideOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100%)}}@media (prefers-reduced-motion:reduce){.xtoast{animation:none}.xtoast--exiting{opacity:0;animation:none}}.xtoast--success{background:color-mix(in srgb, var(--xclues-green) 12%, var(--xclues-card-bg));border-color:color-mix(in srgb, var(--xclues-green) 30%, transparent)}.xtoast--error{background:color-mix(in srgb, var(--xclues-accent-dark) 14%, var(--xclues-card-bg));border-color:color-mix(in srgb, var(--xclues-accent-dark) 35%, transparent)}.xtoast--warning{background:color-mix(in srgb, var(--xclues-yellow) 14%, var(--xclues-card-bg));border-color:color-mix(in srgb, var(--xclues-yellow) 30%, transparent)}.xtoast--info{background:color-mix(in srgb, var(--xclues-primary) 10%, var(--xclues-card-bg));border-color:color-mix(in srgb, var(--xclues-primary) 25%, transparent)}.xtoast__icon{width:32px;height:32px;font-size:var(--xclues-font-size-sm);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;line-height:1;display:flex}.xtoast--success .xtoast__icon{background:var(--xclues-green)}.xtoast--error .xtoast__icon{background:var(--xclues-accent-dark)}.xtoast--warning .xtoast__icon{background:var(--xclues-yellow);color:#1a1a1a}.xtoast--info .xtoast__icon{background:var(--xclues-primary)}.xtoast__content{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.xtoast__title{font-weight:var(--xclues-font-weight-semibold);font-size:var(--xclues-font-size-sm);letter-spacing:var(--xclues-tracking-tight);color:var(--xclues-text-primary)}.xtoast__message{font-size:var(--xclues-font-size-xs);color:var(--xclues-text-secondary);line-height:1.4}.xtoast__close{all:unset;cursor:pointer;width:28px;height:28px;font-size:var(--xclues-font-size-lg);color:var(--xclues-text-tertiary);transition:background var(--xclues-transition), color var(--xclues-transition);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;line-height:1;display:flex}.xtoast__close:hover{background:var(--xclues-primary-10);color:var(--xclues-text-primary)}.xtoast__close:focus-visible{outline:var(--xclues-focus-ring-style) var(--xclues-focus-ring-color);outline-offset:2px}
.logo{font-family:var(--xclues-font-family,inherit);white-space:nowrap;-webkit-user-select:none;user-select:none;font-size:1.25em;line-height:1;display:inline}@media (min-width:640px){.logo{font-size:1em}}.logo-word{font-weight:var(--xclues-heading-weight,var(--xclues-font-weight-extrabold));letter-spacing:var(--xclues-heading-letter-spacing,0);background:linear-gradient(135deg, var(--xclues-primary) 0%, var(--xclues-accent) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.logo-slot{vertical-align:baseline;width:1em;display:inline-grid;overflow:hidden}.logo-slot>*{grid-area:1/1}.logo-x{visibility:hidden;justify-content:flex-end;align-items:flex-end;display:flex}.logo-reel{flex-direction:column;align-self:start;align-items:flex-end;max-height:0;display:flex;overflow:visible}.logo-reel-item{flex-shrink:0;justify-content:flex-end;align-items:center;height:1em;display:flex}.logo-reel-x{-webkit-text-fill-color:var(--xclues-primary)}.logo-icon{width:.8em;height:.8em;color:var(--xclues-primary)}
.genre-switch{border-radius:var(--xclues-radius-pill,999px);border:1px solid var(--xclues-header-border);background:var(--xclues-card-bg);gap:2px;padding:2px;display:inline-flex;position:relative}.genre-switch__pill{border-radius:var(--xclues-radius-pill,999px);background:var(--xclues-primary);pointer-events:none;height:calc(100% - 4px);display:block;position:absolute;top:2px}.genre-switch__button{all:unset;box-sizing:border-box;border-radius:var(--xclues-radius-pill,999px);min-height:0;font-size:var(--xclues-font-size-sm);letter-spacing:.02em;cursor:pointer;color:var(--xclues-text-secondary);text-align:center;z-index:1;padding:6px 14px;font-weight:600}.genre-switch__button:hover:not(.genre-switch__button--active){background:var(--xclues-primary-8)}.genre-switch__button--active{color:var(--xclues-card-selected-text);cursor:default;background:0 0}@media (max-width:480px){.genre-switch__button{font-size:var(--xclues-font-size-xs);min-width:44px;min-height:44px;padding:6px 12px}}