:root{--color-bg-page: #F0EBF8;--color-bg-surface: rgba(255, 255, 255, .5);--color-bg-surface-hover: rgba(255, 255, 255, .7);--color-bg-overlay: rgba(255, 255, 255, .8);--color-border: rgba(255, 255, 255, .6);--color-border-subtle: rgba(255, 255, 255, .4);--color-text-primary: #2D1B69;--color-text-secondary: #5A5278;--color-text-muted: #706f6c;--color-text-inverse: #ffffff;--color-accent: #6C3FC5;--color-accent-hover: #5a34a5;--color-accent-subtle: rgba(108, 63, 197, .1);--color-border-input: rgba(45, 27, 105, .2);--color-danger: #dc2626}.dark{--color-bg-page: #0D0A1A;--color-bg-surface: rgba(255, 255, 255, .05);--color-bg-surface-hover: rgba(255, 255, 255, .1);--color-bg-overlay: rgba(17, 12, 34, .8);--color-border: rgba(255, 255, 255, .1);--color-border-subtle: rgba(255, 255, 255, .05);--color-text-primary: #ffffff;--color-text-secondary: rgba(255, 255, 255, .6);--color-text-muted: rgba(255, 255, 255, .4);--color-text-inverse: #0D0A1A;--color-accent: #A78BFA;--color-accent-hover: #C4B5FD;--color-accent-subtle: rgba(167, 139, 250, .15);--color-border-input: rgba(255, 255, 255, .15);--color-danger: #ef4444}:root{--space-2x-small: .4rem;--space-x-small: .8rem;--space-small: 1.2rem;--space-normal: 1.6rem;--space-medium: 2rem;--space-large: 2.4rem;--space-x-large: 3.2rem;--space-2x-large: 4.8rem;--space-3x-large: 6rem;--space-4x-large: 6.4rem;--space-5x-large: 8rem;--space-6x-large: 9.6rem}:root{--font-sans: "Noto Sans", sans-serif;--font-heading: "Space Grotesk", sans-serif;--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--font-x-small: 1.4rem;--font-small: 1.6rem;--font-normal: 1.8rem;--font-medium: 2rem;--font-large: 2.2rem;--font-x-large: 2.6rem;--font-2x-large: 3.2rem;--font-3x-large: 3.8rem;--font-4x-large: 5rem;--leading-tight: 1.1;--leading-snug: 1.25;--leading-normal: 1.5;--leading-relaxed: 1.625}:root{--radius-small: .8rem;--radius: 1.2rem;--radius-large: 1.6rem;--radius-full: 9999px}:root{--shadow-small: 0 .2rem .6rem rgba(0, 0, 0, .08);--shadow: 0 2rem 5rem -1rem rgba(0, 0, 0, .2);--shadow-large: 0 2.5rem 6rem -1.2rem rgba(0, 0, 0, .15), 0 1rem 3rem -.8rem rgba(0, 0, 0, .1);--shadow-glow: 0 1rem 2.5rem -.5rem rgba(147, 51, 234, .2)}.dark{--shadow-small: 0 .2rem .6rem rgba(0, 0, 0, .2);--shadow: 0 2rem 5rem -1rem rgba(0, 0, 0, .5);--shadow-large: 0 2.5rem 6rem -1.2rem rgba(0, 0, 0, .4), 0 1rem 3rem -.8rem rgba(0, 0, 0, .3);--shadow-glow: 0 1rem 2.5rem -.5rem rgba(147, 51, 234, .3)}:root{--gradient-streamer: linear-gradient(to bottom right, #FF6B6B, #FF8E53);--gradient-viewer: linear-gradient(to bottom right, #36D1DC, #5B86E5);--gradient-brand: linear-gradient(to bottom right, #A855F7, #6C3FC5);--gradient-primary: linear-gradient(to right, var(--color-accent), #9333EA);--gradient-logo: linear-gradient(to bottom right, #6C3FC5, #9333EA);--gradient-sidebar: linear-gradient(to bottom, rgba(59, 35, 128, .9), rgba(45, 27, 105, .9))}:root{--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease}html{font-size:62.5%;box-sizing:border-box;scroll-behavior:smooth}*,*:before,*:after{box-sizing:inherit;margin:0;padding:0}body{font-family:var(--font-sans);font-size:var(--font-normal);line-height:var(--leading-normal);color:var(--color-text-primary);background-color:var(--color-bg-page);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .5s,color .5s}img,svg,video{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit;border:none;background:none}button{cursor:pointer}ul,ol{list-style:none}[x-cloak]{display:none!important}.font-heading{font-family:var(--font-heading)}.font-mono{font-family:var(--font-mono)}.flex{display:flex}.grid{display:grid}.hidden{display:none}.block{display:block}.inline-flex{display:inline-flex}.inline-block{display:inline-block}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.flex-1{flex:1}.shrink-0{flex-shrink:0}.gap-1{gap:var(--space-2x-small)}.gap-2{gap:var(--space-x-small)}.gap-3{gap:var(--space-small)}.gap-4{gap:var(--space-normal)}.gap-5{gap:var(--space-medium)}.gap-6{gap:var(--space-large)}.grid-cols-1{grid-template-columns:repeat(1,1fr)}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.inset-0{inset:0}.w-full{width:100%}.h-full{height:100%}.min-h-screen{min-height:100vh}.overflow-hidden{overflow:hidden}.text-center{text-align:center}.text-start{text-align:start}.object-cover{object-fit:cover}.object-contain{object-fit:contain}.pointer-events-none{pointer-events:none}.cursor-pointer{cursor:pointer}.select-none{user-select:none}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}@media(min-width:640px){.sm\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.sm\:grid-cols-3{grid-template-columns:repeat(3,1fr)}}@media(min-width:768px){.md\:flex{display:flex}.md\:hidden{display:none}.md\:block{display:block}.md\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.md\:grid-cols-3{grid-template-columns:repeat(3,1fr)}}@media(min-width:1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.lg\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}.container{width:100%;max-width:128rem;margin-inline:auto;padding-inline:2.4rem}.page-bg{position:fixed;inset:0;z-index:0;pointer-events:none;background-color:var(--color-bg-page);transition:background-color .5s;overflow:hidden}.bg-blob{position:absolute;border-radius:var(--radius-full);filter:blur(64px);pointer-events:none}.bg-blob--guest-1{inset-block-start:-10%;inset-inline-end:-5%;width:60rem;height:60rem;background:radial-gradient(circle,rgba(168,85,247,.12) 0%,rgba(244,114,182,.08) 50%,transparent 100%)}.dark .bg-blob--guest-1{background:radial-gradient(circle,rgba(168,85,247,.1) 0%,rgba(244,114,182,.05) 50%,transparent 100%)}.bg-blob--guest-2{inset-block-end:-10%;inset-inline-start:-5%;width:50rem;height:50rem;background:radial-gradient(circle,rgba(251,146,60,.1) 0%,rgba(251,191,36,.08) 50%,transparent 100%)}.dark .bg-blob--guest-2{background:radial-gradient(circle,rgba(251,146,60,.05) 0%,rgba(251,191,36,.03) 50%,transparent 100%)}.bg-blob--guest-3{inset-block-start:40%;inset-inline-start:30%;width:40rem;height:40rem;background:radial-gradient(circle,rgba(139,92,246,.06) 0%,transparent 100%)}.dark .bg-blob--guest-3{background:radial-gradient(circle,rgba(139,92,246,.03) 0%,transparent 100%)}.guest-content{position:relative;z-index:10;min-height:100vh;padding-block-end:var(--space-3x-large)}@media(min-width:768px){.guest-content{padding-block-end:0}}.app-content{position:relative;z-index:10;min-height:100vh;padding-block-end:var(--space-3x-large)}@media(min-width:768px){.app-content{margin-inline-start:var(--space-3x-large);padding-block-end:0}}.bg-blob--app-1{inset-block-start:-10%;inset-inline-end:-5%;width:50rem;height:50rem;background:#a855f70d}.dark .bg-blob--app-1{background:#a855f70d}.bg-blob--app-2{inset-block-end:-10%;inset-inline-start:20%;width:40rem;height:40rem;background:#6366f10d}.dark .bg-blob--app-2{background:#6366f108}.noise-overlay{position:absolute;inset:0;opacity:.03;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox=%220 0 256 256%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cfilter id=%22noise%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%224%22 stitchTiles=%22stitch%22/%3E%3C/filter%3E%3Crect width=%22100%25%22 height=%22100%25%22 filter=%22url(%23noise)%22/%3E%3C/svg%3E");background-repeat:repeat;background-size:256px 256px}.dark .noise-overlay{opacity:.05}.topbar{position:sticky;inset-block-start:0;z-index:30;height:var(--space-4x-large);display:flex;align-items:center;justify-content:space-between;padding-inline:var(--space-large);backdrop-filter:blur(8px)}.topbar-logo{display:flex;align-items:center;gap:var(--space-x-small)}@media(min-width:768px){.topbar-logo{display:none}}.topbar-logo-icon{width:var(--space-x-large);height:var(--space-x-large);border-radius:var(--radius-full);background:var(--gradient-logo);display:flex;align-items:center;justify-content:center;box-shadow:0 var(--space-2x-small) .6rem #9333ea33}.topbar-logo-icon svg{width:var(--space-normal);height:var(--space-normal);color:#fff}.topbar-logo-text{font-size:var(--font-small);font-weight:700;color:var(--color-text-primary);font-family:var(--font-heading)}@media(max-width:499px){.topbar-logo-text{display:none}}.topbar-actions{display:flex;align-items:center;gap:var(--space-small)}.topbar-user{display:flex;align-items:center;gap:var(--space-x-small);padding:.6rem .6rem .6rem var(--space-small);border-radius:var(--radius-full);background:var(--color-bg-surface);border:1px solid var(--color-border);backdrop-filter:blur(8px)}.topbar-user-avatar{width:var(--space-large);height:var(--space-large);border-radius:var(--radius-full);object-fit:cover}.topbar-user-avatar-fallback{width:var(--space-large);height:var(--space-large);border-radius:var(--radius-full);background:var(--gradient-logo);display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--font-x-small);font-weight:700}.topbar-user-name{font-size:var(--font-small);font-weight:500;color:var(--color-text-primary)}.topbar-spacer{display:none}@media(min-width:768px){.topbar-spacer{display:block}}.locale-flag{border-radius:var(--radius-full);box-shadow:0 0 0 1px #0000001a;flex-shrink:0}.locale-dropdown{position:absolute;inset-block-start:100%;inset-inline-end:0;margin-block-start:var(--space-2x-small);min-width:14rem;background:var(--color-bg-page);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:0 4px 12px #00000026;overflow:hidden;z-index:50}.locale-dropdown form{display:contents}.locale-option{display:flex;align-items:center;gap:var(--space-x-small);padding:var(--space-x-small) var(--space-small);font-size:var(--font-small);color:var(--color-text-secondary);transition:background var(--transition-fast),color var(--transition-fast);width:100%;border:none;background:none;cursor:pointer;font-family:inherit;text-align:start}.locale-option:hover{background:var(--color-bg-surface-hover);color:var(--color-text-primary)}.locale-option.is-active{color:var(--color-accent);font-weight:600}.role-switch-popover{position:absolute;inset-block-start:100%;inset-inline-end:0;margin-block-start:var(--space-x-small);padding:var(--space-normal);min-width:18rem;background:var(--color-bg-overlay);backdrop-filter:blur(48px);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:0 8px 24px #0003;z-index:50;display:flex;flex-direction:column;align-items:center;gap:var(--space-small);text-align:center}.role-switch-icon{color:var(--color-accent)}.role-switch-text{font-size:var(--font-small);font-weight:500;color:var(--color-text-primary)}.sidebar{display:none;position:fixed;inset-inline-start:var(--space-small);inset-block-start:0;inset-block-end:0;z-index:40;width:5.6rem;flex-direction:column;align-items:center;padding-block:var(--space-normal)}@media(min-width:768px){.sidebar{display:flex}}.sidebar-logo{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:4rem;height:4rem;border-radius:var(--radius-full);background:var(--gradient-logo);box-shadow:0 var(--space-2x-small) .6rem #9333ea33}.sidebar-logo svg{width:var(--space-medium);height:var(--space-medium);color:#fff}.sidebar-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.sidebar-inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-x-small);padding:var(--space-small) var(--space-x-small);border-radius:var(--radius-full);background:var(--gradient-logo);border:1px solid rgba(168,85,247,.15);box-shadow:0 var(--space-small) var(--space-medium) #581c874d}.sidebar-nav{display:flex;flex-direction:column;align-items:center;gap:var(--space-small);overflow:visible}.sidebar-nav-item{position:relative;width:4rem;height:4rem}.sidebar-nav-link{position:absolute;inset-block-start:0;inset-inline-start:0;display:flex;align-items:center;width:4rem;height:4rem;padding-inline-start:.8rem;border-radius:var(--radius-full);transition:background var(--transition-base),color var(--transition-base);color:#fff9;white-space:nowrap;z-index:1}.sidebar-nav-link:hover{width:max-content;padding-inline-end:var(--space-small);background:#4c1d95;color:#fff}.sidebar-nav-link.is-active{background:#5b21b6;color:#fff}.sidebar-nav-link svg{width:2.4rem;height:2.4rem;flex-shrink:0}.sidebar-nav-label{width:0;opacity:0;font-size:var(--font-small);font-weight:500;color:#fff;transition:opacity var(--transition-base),margin var(--transition-base);margin-inline-start:0}.sidebar-nav-link:hover .sidebar-nav-label{opacity:1;width:auto;margin-inline-start:var(--space-x-small)}.sidebar-spacer{flex-shrink:0;width:4rem;height:4rem}.mobile-bottom-bar{position:fixed;inset-block-end:0;inset-inline-start:0;inset-inline-end:0;z-index:40;height:var(--space-3x-large);background:var(--color-bg-overlay);backdrop-filter:blur(48px);border-block-start:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-around;padding-inline:var(--space-x-small)}@media(min-width:768px){.mobile-bottom-bar{display:none}}.mobile-bar-link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;padding:var(--space-2x-small) var(--space-x-small);border-radius:var(--radius-small);transition:color var(--transition-base);color:var(--color-text-muted)}.mobile-bar-link.is-active{color:var(--color-accent)}.mobile-bar-link svg{width:var(--space-medium);height:var(--space-medium)}.mobile-bar-link span{font-size:var(--font-x-small);font-weight:500}.section-inner{max-width:128rem;margin-inline:auto;padding-inline:var(--space-large)}.section-header{text-align:center;margin-block-end:var(--space-x-large)}.section-title{font-size:var(--font-x-large);font-weight:700;color:var(--color-text-primary);font-family:var(--font-heading);text-align:center;margin-block-end:var(--space-x-large)}.section-subtitle{font-size:var(--font-small);color:var(--color-text-secondary);max-width:52rem;margin-inline:auto}.section-label{font-size:var(--font-small);font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;text-align:center;margin-block-end:var(--space-large)}.section-sublabel{font-size:var(--font-x-small);color:var(--color-text-muted);text-align:center;margin-block-start:calc(-1 * var(--space-medium));margin-block-end:var(--space-large)}.page-title{font-size:var(--font-3x-large);font-weight:700;color:var(--color-text-primary);font-family:var(--font-heading);margin-block-end:var(--space-large)}.main-content{padding-block:var(--space-large)}.main-content--no-padding{padding:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-x-small);font-weight:600;cursor:pointer;transition:all var(--transition-base)}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-x-small);padding:1rem var(--space-medium);border-radius:var(--radius);font-size:var(--font-small);font-weight:600;color:#fff;background:var(--gradient-primary);box-shadow:var(--shadow-glow);transition:all var(--transition-base);cursor:pointer}.btn-primary:hover{box-shadow:0 1rem 2.5rem -.5rem #9333ea4d;translate:0 -1px}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-x-small);padding:var(--space-x-small) var(--space-normal);border-radius:var(--radius);font-size:var(--font-small);font-weight:600;color:var(--color-text-muted);background:transparent;border:1px solid currentColor;transition:all var(--transition-base);cursor:pointer}.btn-secondary:hover{color:var(--color-text-primary)}.btn-secondary.is-active{background:var(--color-accent-subtle);color:var(--color-accent);border-color:#6c3fc54d}.btn-icon{display:flex;align-items:center;justify-content:center;width:4rem;height:4rem;border-radius:var(--radius-full);color:var(--color-text-muted);transition:all var(--transition-base);cursor:pointer}.btn-icon:hover{background:var(--color-bg-surface-hover);color:var(--color-text-primary)}.btn-icon--small{width:var(--space-x-large);height:var(--space-x-large)}.btn-accent{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-x-small);padding:var(--space-x-small) var(--space-normal);border-radius:var(--radius);font-size:var(--font-x-small);font-weight:600;background:var(--color-accent);color:var(--color-text-inverse);transition:background var(--transition-base);cursor:pointer}.btn-accent:hover{background:var(--color-accent-hover)}.btn-success{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-x-small);padding:var(--space-x-small) var(--space-normal);border-radius:var(--radius);font-size:var(--font-x-small);font-weight:600;background:var(--color-success, #22c55e);color:#fff;transition:background var(--transition-base);cursor:pointer}.btn-success:hover{background:color-mix(in srgb,var(--color-success, #22c55e) 85%,#000)}.btn-outline{display:inline-block;padding:var(--space-x-small) var(--space-normal);border-radius:var(--radius);font-size:var(--font-x-small);font-weight:600;background:var(--color-bg-surface);border:1px solid var(--color-border-subtle);color:var(--color-text-primary);transition:all var(--transition-base);cursor:pointer}.btn-outline:hover{background:var(--color-bg-surface-hover)}.btn-submit{width:100%;padding:var(--space-small);border-radius:var(--radius);font-weight:600;font-size:var(--font-small);background:linear-gradient(to right,var(--color-accent),#7c3aed);color:#fff;box-shadow:var(--shadow-glow);transition:all var(--transition-base);cursor:pointer}.btn-submit:hover{box-shadow:0 1rem 2.5rem -.5rem #9333ea4d;translate:0 -1px}.btn-small{padding:.4rem var(--space-small);font-size:var(--font-x-small)}.btn-danger{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-x-small);padding:var(--space-x-small) var(--space-normal);border-radius:var(--radius);font-size:var(--font-x-small);font-weight:600;background:var(--color-danger);color:#fff;transition:background var(--transition-base);cursor:pointer}.btn-danger:hover{background:color-mix(in srgb,var(--color-danger) 85%,#000)}.btn-icon-logout:hover{background:#ef44440d!important;color:#dc2626!important}.dark .btn-icon-logout:hover{background:#ef44441a!important;color:#f87171!important}.ui-card{border-radius:var(--radius-large);box-shadow:var(--shadow)}.ui-card--glass{background:var(--color-bg-surface);border:1px solid var(--color-border)}.ui-card--solid{background:#fff;border:1px solid #e5e7eb;box-shadow:var(--shadow-small)}.dark .ui-card--solid{background:#111827;border-color:#1f2937}.ui-card--gradient{border:1px solid var(--color-border-subtle);box-shadow:var(--shadow-large)}.ui-card--hover{transition:transform var(--transition-slow)}.ui-card--hover:hover{transform:translateY(-.4rem)}.ui-card--p-none{padding:0}.ui-card--p-sm{padding:var(--space-normal)}.ui-card--p-md{padding:var(--space-large)}.ui-card--p-lg{padding:var(--space-x-large)}.input{width:100%;padding:var(--space-x-small) var(--space-small);border-radius:var(--radius);background:var(--color-bg-surface);border:1px solid var(--color-border-input);font-size:var(--font-small);color:var(--color-text-primary);transition:box-shadow var(--transition-base)}.input::placeholder{color:var(--color-text-muted)}.input:focus{outline:none;box-shadow:0 0 0 2px var(--color-accent)}.input-search{width:100%;padding:var(--space-small) var(--space-normal) var(--space-small) 4rem;border-radius:var(--radius);background:var(--color-bg-surface);border:1px solid var(--color-border-input);font-size:var(--font-small);color:var(--color-text-primary);transition:box-shadow var(--transition-base)}.input-search::placeholder{color:var(--color-text-muted)}.input-search:focus{outline:none;box-shadow:0 0 0 2px var(--color-accent)}.input-mono{padding:1rem 4rem 1rem var(--space-normal);border-radius:var(--radius);background:var(--color-bg-surface);font-size:var(--font-x-small);color:var(--color-text-primary);font-family:var(--font-mono);border:1px solid var(--color-border-input);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.input-label{display:block;font-size:var(--font-x-small);font-weight:500;color:var(--color-text-muted);margin-block-end:.6rem}.search-icon{position:absolute;inset-inline-start:var(--space-normal);inset-block-start:50%;transform:translateY(-50%);z-index:1;width:2.2rem;height:2.2rem;color:var(--color-accent);opacity:.6;pointer-events:none}.search-spinner{position:absolute;inset-inline-end:var(--space-normal);inset-block-start:50%;transform:translateY(-50%);z-index:1;width:var(--space-medium);height:var(--space-medium);color:var(--color-accent);animation:spin 1s linear infinite}.badge{display:inline-block;padding:.2rem var(--space-x-small);border-radius:var(--radius-full);font-size:var(--font-x-small);font-weight:600}.badge--accent{background:var(--color-accent-subtle);color:var(--color-accent)}.badge--success{background:#10b9811a;color:#059669}.dark .badge--success{background:#10b98126;color:#6ee7b7}.badge--warning{background:#f59e0b1a;color:#d97706}.dark .badge--warning{background:#f59e0b26;color:#fcd34d}.badge--error{background:#ef44441a;color:#dc2626}.dark .badge--error{background:#ef444426;color:#fca5a5}.badge--free{padding:var(--space-2x-small) 1rem;font-weight:700;background:#10b981e6;color:#fff}.badge--price{padding:var(--space-2x-small) 1rem;font-weight:700;background:var(--color-bg-overlay);color:var(--color-text-primary)}.badge--active{background:var(--color-accent);color:var(--color-text-inverse);font-weight:700}.badge--streamer{background:#ff6b6b1a;color:#ff6b6b}.badge--viewer{background:#5b86e51a;color:#5b86e5}.badge--status-active{background:#10b9811a;color:#059669}.dark .badge--status-active{background:#10b98126;color:#6ee7b7}.badge--status-disabled{background:#6b72801a;color:#6b7280}.dark .badge--status-disabled{background:#1f2937;color:#9ca3af}.tag-list{display:flex;flex-wrap:wrap;gap:var(--space-x-small)}.tag{display:inline-flex;align-items:center;gap:var(--space-2x-small);padding:var(--space-2x-small) var(--space-x-small);border-radius:var(--radius-full);font-size:var(--font-x-small);font-weight:500;background:var(--color-surface-raised);color:var(--color-text-muted);line-height:1}.tag--accent{background:var(--color-accent-subtle);color:var(--color-accent);font-weight:600}.tag--free{background:#10b98126;color:#10b981;font-weight:600}.filter-tabs{display:grid;grid-template-columns:1fr auto auto;align-items:stretch;border-radius:var(--radius);background:var(--color-bg-surface);border:1px solid var(--color-border);overflow:hidden}.filter-tabs-buttons{display:flex;align-items:center;gap:var(--space-2x-small);padding:var(--space-2x-small)}.filter-tabs-search{position:relative;display:flex;align-items:center;background:var(--color-bg-surface-hover);border-inline:1px solid var(--color-border)}.filter-tabs-search .search-icon{position:absolute;inset-inline-start:var(--space-small);width:var(--space-normal);height:var(--space-normal);color:var(--color-text-muted);pointer-events:none}.filter-tabs-search .input-search{width:100%;min-width:12rem;padding:.6rem var(--space-normal) .6rem var(--space-x-large);font-size:var(--font-x-small);background:transparent;border:none;border-radius:0}.filter-tabs-more{display:inline-flex;align-items:center;padding-inline:var(--space-normal);border-radius:0;border:none;background:var(--color-accent-subtle);color:var(--color-accent);font-weight:600}.filter-tabs-more:hover{background:var(--color-accent-subtle);filter:brightness(1.1)}.filter-tab{padding:.6rem var(--space-normal);border-radius:var(--radius-small);font-size:var(--font-x-small);font-weight:600;transition:all var(--transition-base);cursor:pointer;color:var(--color-text-muted)}.filter-tab:hover{color:var(--color-text-primary)}.filter-tab.is-active{background:var(--color-accent-subtle);color:var(--color-accent);box-shadow:var(--shadow-small)}@media(max-width:639px){.filter-tabs{grid-template-columns:1fr}.filter-tabs-buttons{flex-wrap:wrap}.filter-tabs-search{border-inline:none;border-block-start:1px solid var(--color-border)}.filter-tabs-more{border-block-start:1px solid var(--color-border);justify-content:center;padding-block:var(--space-x-small)}}.chip{display:inline-flex;align-items:center;gap:var(--space-2x-small);padding:var(--space-2x-small) var(--space-small);border-radius:var(--radius-full);font-size:var(--font-x-small);font-weight:500;background:var(--color-accent-subtle);color:var(--color-accent);cursor:pointer}.chip svg{width:var(--space-small);height:var(--space-small)}.chip-tag{padding:.6rem var(--space-small);border-radius:var(--radius-small);font-size:var(--font-x-small);font-weight:500;transition:all var(--transition-base);cursor:pointer;background:var(--color-bg-surface-hover);color:var(--color-text-secondary)}.chip-tag.is-active{background:var(--color-accent);color:#fff}.chip-brand{display:inline-flex;align-items:center;gap:var(--space-x-small);padding:.6rem var(--space-small);border-radius:var(--radius-small);font-size:var(--font-x-small);font-weight:500;transition:all var(--transition-base);cursor:pointer;background:var(--color-bg-surface-hover);color:var(--color-text-secondary)}.chip-brand.is-active{background:var(--color-accent);color:#fff}.chip-brand img{width:var(--space-normal);height:var(--space-normal);border-radius:.4rem;object-fit:contain}.color-swatch{width:var(--space-x-large);height:var(--space-x-large);border-radius:var(--radius-full);border:2px solid rgba(255,255,255,.2);transition:all var(--transition-base);cursor:pointer}.color-swatch.is-active{box-shadow:0 0 0 2px var(--color-accent),0 0 0 4px var(--color-bg-surface)}.toggle{position:relative;display:inline-flex;height:var(--space-large);width:4.4rem;flex-shrink:0;border-radius:var(--radius-full);transition:background-color var(--transition-base);cursor:pointer;background:#d1d5db}.dark .toggle{background:#4b5563}.toggle.is-active{background:#10b981}.toggle-knob{display:inline-block;height:var(--space-medium);width:var(--space-medium);margin-block-start:.2rem;border-radius:var(--radius-full);background:#fff;box-shadow:var(--shadow-small);transition:transform var(--transition-base);transform:translate(.2rem)}.toggle.is-active .toggle-knob{transform:translate(var(--space-medium))}.modal-backdrop{position:absolute;inset:0;background:#0006;backdrop-filter:blur(4px)}.dark .modal-backdrop{background:#0009}.modal-content{position:relative;width:100%;max-width:44.8rem}.login-modal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:var(--space-normal)}.toast{position:fixed;inset-block-end:var(--space-large);inset-inline-end:var(--space-large);z-index:50}@media(max-width:767px){.toast{inset-block-end:7.6rem}}.toast-inner{display:flex;align-items:center;gap:var(--space-small);padding:var(--space-small) var(--space-medium);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid transparent}.toast-inner--success{background:#10b981e6;border-color:#34d3994d;color:#fff}.toast-inner--error{background:#ef4444e6;border-color:#f871714d;color:#fff}.toast-inner svg{width:var(--space-normal);height:var(--space-normal);flex-shrink:0}.toast-inner span{font-size:var(--font-small);font-weight:500}.avatar{width:4rem;height:4rem;border-radius:var(--radius-full);object-fit:cover}.avatar--small{width:var(--space-large);height:var(--space-large)}.avatar--large{width:10rem;height:10rem;box-shadow:var(--shadow)}.avatar-fallback{display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--gradient-logo);color:#fff;font-weight:700}.avatar-fallback--small{width:var(--space-large);height:var(--space-large);font-size:var(--font-x-small)}.avatar-fallback--medium{width:4rem;height:4rem;font-size:var(--font-small)}.avatar-fallback--large{width:10rem;height:10rem;font-size:var(--font-x-large);box-shadow:var(--shadow)}.range-slider{-webkit-appearance:none;appearance:none;background:transparent;pointer-events:none;height:.6rem;margin:0}.range-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--color-accent);border:2px solid white;box-shadow:0 .2rem .6rem #0003;pointer-events:auto;cursor:pointer}.range-slider::-moz-range-thumb{width:1.8rem;height:1.8rem;border-radius:50%;background:var(--color-accent);border:2px solid white;box-shadow:0 .2rem .6rem #0003;pointer-events:auto;cursor:pointer}.style-explore{padding-block-end:var(--space-6x-large)}.filter-controls{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--space-normal);margin-block-end:var(--space-large)}@media(max-width:639px){.filter-controls{flex-direction:column}}.filter-count{width:var(--space-medium);height:var(--space-medium);border-radius:var(--radius-full);background:var(--color-accent);color:#fff;font-size:var(--font-x-small);display:flex;align-items:center;justify-content:center}.chip-clear{font-size:var(--font-x-small);color:var(--color-text-muted);cursor:pointer;text-decoration:underline}.chip-clear:hover{color:var(--color-accent)}.filter-panel{margin-block-end:var(--space-x-large);padding:var(--space-medium);border-radius:var(--radius-large)}.filter-panel-grid{display:grid;grid-template-columns:1fr;gap:var(--space-large)}@media(min-width:768px){.filter-panel-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.filter-panel-grid{grid-template-columns:repeat(4,1fr)}}.filter-group-title{font-size:var(--font-x-small);font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-block-end:var(--space-small)}.price-labels{display:flex;justify-content:space-between;font-size:var(--font-x-small);color:var(--color-text-muted);margin-block-end:var(--space-x-small)}.price-track{position:relative;height:var(--space-large)}.price-track-bg{position:absolute;inset-block-start:50%;transform:translateY(-50%);inset-inline-start:0;inset-inline-end:0;height:.6rem;border-radius:var(--radius-full);background:var(--color-border)}.price-track-fill{position:absolute;height:100%;border-radius:var(--radius-full);background:var(--color-accent)}.price-track .range-slider{position:absolute;width:100%;inset-block-start:50%;transform:translateY(-50%)}.style-grid{display:grid;grid-template-columns:1fr;gap:var(--space-large)}@media(min-width:640px){.style-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.style-grid{grid-template-columns:repeat(3,1fr)}}.empty-state{text-align:center;padding:var(--space-4x-large) 0;color:var(--color-text-muted)}.hero{padding-block-start:var(--space-4x-large);padding-block-end:var(--space-5x-large);text-align:center}.hero-title{font-size:var(--font-3x-large);font-weight:700;color:var(--color-text-primary);font-family:var(--font-heading);letter-spacing:-.02em;line-height:var(--leading-tight)}@media(min-width:768px){.hero-title{font-size:var(--font-4x-large)}}.hero-subtitle{margin-block-start:var(--space-medium);font-size:var(--font-medium);color:var(--color-text-secondary);max-width:56rem;margin-inline:auto;line-height:var(--leading-relaxed)}.audience-cards{margin-block-start:var(--space-4x-large);display:grid;grid-template-columns:1fr;gap:var(--space-large)}@media(min-width:768px){.audience-cards{grid-template-columns:repeat(3,1fr)}}.audience-card{position:relative;border-radius:var(--radius-large);padding:var(--space-large);overflow:hidden;transition:all var(--transition-slow)}.audience-card:hover{transform:translateY(-.6rem)}.audience-card--streamer{background:var(--gradient-streamer);box-shadow:0 2.5rem 6rem -1.2rem #ff6b6b80,0 1rem 3rem -.8rem #0000004d}.audience-card--viewer{background:var(--gradient-viewer);box-shadow:0 2.5rem 6rem -1.2rem #5b86e580,0 1rem 3rem -.8rem #0000004d}.audience-card--brand{background:var(--gradient-brand);box-shadow:0 2.5rem 6rem -1.2rem #a855f780,0 1rem 3rem -.8rem #0000004d}.audience-card-overlay{position:absolute;inset:0;background:#ffffff1a;opacity:0;transition:opacity var(--transition-slow)}.audience-card:hover .audience-card-overlay{opacity:1}.audience-card-body{position:relative;z-index:1}.audience-card-icon{width:5.6rem;height:5.6rem;border-radius:var(--radius-large);background:#fff3;display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-normal)}.audience-card-icon svg{width:2.8rem;height:2.8rem;color:#fff}.audience-card-title{font-size:var(--font-medium);font-weight:700;color:#fff;font-family:var(--font-heading)}.audience-card-text{margin-block-start:var(--space-x-small);font-size:var(--font-small);color:#fffc;line-height:var(--leading-relaxed)}.audience-card-cta{margin-block-start:var(--space-medium);display:inline-flex;align-items:center;gap:var(--space-x-small);padding:var(--space-x-small) var(--space-medium);border-radius:var(--radius-full);background:#fff3;color:#fff;font-size:var(--font-small);font-weight:600;transition:all var(--transition-base)}.audience-card-cta:hover{background:#ffffff4d}.audience-card-cta svg{width:var(--space-normal);height:var(--space-normal)}.featured-streamers{padding-block-end:var(--space-4x-large)}.featured-streamers-grid{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:var(--space-normal);padding-block-start:var(--space-large);padding-block-end:var(--space-2x-large);padding-inline:var(--space-large)}.streamer-avatar-wrap{position:relative;scroll-snap-align:center;flex-shrink:0;transition:transform .3s cubic-bezier(.34,1.56,.64,1);will-change:transform}.streamer-avatar-wrap:hover{transform:scale(1.25);z-index:2}.streamer-avatar-wrap:hover+.streamer-avatar-wrap{transform:scale(1.1);z-index:1}.streamer-avatar-wrap:has(+.streamer-avatar-wrap:hover){transform:scale(1.1);z-index:1}.streamer-avatar-wrap:hover+.streamer-avatar-wrap+.streamer-avatar-wrap{transform:scale(1.03)}.streamer-avatar-wrap:has(+.streamer-avatar-wrap+.streamer-avatar-wrap:hover){transform:scale(1.03)}.streamer-avatar-name{position:absolute;inset-block-end:var(--space-2x-small);inset-inline-start:50%;transform:translate(-50%);padding:.2rem var(--space-small);border-radius:var(--radius-full);background:#fffc;backdrop-filter:blur(8px);font-size:var(--font-x-small);font-weight:600;color:var(--color-text-primary);white-space:nowrap;box-shadow:var(--shadow-small);opacity:0;transition:opacity .2s ease}.streamer-avatar-wrap:hover .streamer-avatar-name{opacity:1}.dark .streamer-avatar-name{background:#ffffff26}@media(max-width:767px){.featured-streamers-grid{flex-wrap:wrap}.streamer-avatar-name{opacity:1}}.skins-section{padding-block-end:var(--space-6x-large)}.streamer-search-result{width:100%;max-width:30rem;padding:var(--space-normal);border-radius:var(--radius-large);border:2px dashed #9333EA}.streamer-search-header{display:flex;align-items:center;gap:var(--space-small);margin-block-end:var(--space-small)}.streamer-search-name{font-size:var(--font-small);font-weight:600;color:var(--color-text-primary)}.streamer-search-handle{display:block;font-size:var(--font-x-small);color:var(--color-text-muted)}.search-results-grid{display:flex;justify-content:center;gap:var(--space-normal);max-width:76.8rem;margin-inline:auto}.testimonials{position:relative;padding-block-end:var(--space-5x-large);max-height:56rem;overflow:hidden;transition:max-height .8s cubic-bezier(.4,0,.2,1)}.testimonials--expanded{max-height:500rem}.testimonials-fade{position:absolute;inset-inline:0;inset-block-end:0;height:16rem;background:linear-gradient(to top,var(--color-bg-page) 10%,transparent);pointer-events:none;z-index:1}.testimonials-fade--transition{transition:opacity .4s ease}.testimonials-fade--visible{opacity:1}.testimonials-fade--hidden{opacity:0}.testimonials-toggle{font-size:var(--font-small);font-weight:600;color:var(--color-accent);cursor:pointer;transition:opacity var(--transition-base)}.testimonials-toggle:hover{opacity:.8}.testimonials-masonry{columns:1;column-gap:var(--space-medium)}@media(min-width:640px){.testimonials-masonry{columns:2}}@media(min-width:1024px){.testimonials-masonry{columns:3}}.testimonial-card{break-inside:avoid;padding:var(--space-medium);border-radius:var(--radius-large);box-shadow:var(--shadow-large);text-align:start;border:1px solid rgba(255,255,255,.3);margin-block-end:var(--space-medium)}.dark .testimonial-card{border-color:#ffffff0d}.testimonial-card--streamer{background:linear-gradient(to bottom right,rgba(255,107,107,.1),rgba(255,142,83,.05),transparent)}.testimonial-card--viewer{background:linear-gradient(to bottom right,rgba(54,209,220,.1),rgba(91,134,229,.05),transparent)}.testimonial-card--brand{background:linear-gradient(to bottom right,rgba(168,85,247,.1),rgba(108,63,197,.05),transparent)}.testimonial-author{display:flex;align-items:center;gap:var(--space-small);margin-block-end:var(--space-normal)}.testimonial-avatar-img{width:4rem;height:4rem;border-radius:var(--radius-full);object-fit:cover;flex-shrink:0}.testimonial-avatar-fallback{width:4rem;height:4rem;border-radius:var(--radius-full);background:var(--gradient-logo);display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--font-small);font-weight:700;flex-shrink:0}.testimonial-meta{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem}.testimonial-name{font-size:var(--font-small);font-weight:600;color:var(--color-text-primary)}a.testimonial-name:hover{text-decoration:underline}.testimonial-quote{font-size:var(--font-small);color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.site-footer{padding-block:var(--space-x-large)}.site-footer-inner{max-width:128rem;margin-inline:auto;padding-inline:var(--space-large);display:flex;flex-direction:column;align-items:center;gap:var(--space-x-small)}.site-footer-row{display:flex;align-items:center;gap:var(--space-normal);flex-wrap:wrap;justify-content:center}.site-footer-text{font-size:var(--font-x-small);color:var(--color-text-muted)}.site-footer-links{display:flex;flex-wrap:wrap;gap:var(--space-normal)}.site-footer-link{font-size:var(--font-x-small);color:var(--color-text-muted);transition:color var(--transition-base)}.site-footer-link:hover{color:var(--color-accent)}.site-footer-disclaimer{font-size:var(--font-x-small);color:var(--color-text-muted);text-align:center;max-width:56rem}.login-modal-header{text-align:center;margin-block-end:var(--space-x-large)}.login-modal-icon{width:5.6rem;height:5.6rem;border-radius:var(--radius-large);background:var(--gradient-logo);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-normal);box-shadow:0 1rem 2rem #9333ea33}.login-modal-icon svg{width:2.8rem;height:2.8rem;color:#fff}.login-modal-title{font-size:var(--font-medium);font-weight:700;color:var(--color-text-primary);font-family:var(--font-heading)}.login-modal-subtitle{margin-block-start:var(--space-x-small);font-size:var(--font-small);color:var(--color-text-muted)}.login-options{display:flex;flex-direction:column;gap:var(--space-small)}.login-option{display:flex;align-items:center;gap:var(--space-normal);width:100%;padding:var(--space-normal);border-radius:var(--radius);border:1px solid;transition:all var(--transition-base)}.login-option--streamer{background:linear-gradient(to right,#ff6b6b1a,#ff8e531a);border-color:#ff8e5333}.dark .login-option--streamer{background:linear-gradient(to right,#ff6b6b0d,#ff8e530d);border-color:#ff8e531a}.login-option--streamer:hover{background:linear-gradient(to right,#ff6b6b33,#ff8e5333)}.dark .login-option--streamer:hover{background:linear-gradient(to right,#ff6b6b1a,#ff8e531a)}.login-option--viewer{background:linear-gradient(to right,#36d1dc1a,#5b86e51a);border-color:#5b86e533}.dark .login-option--viewer{background:linear-gradient(to right,#36d1dc0d,#5b86e50d);border-color:#5b86e51a}.login-option--viewer:hover{background:linear-gradient(to right,#36d1dc33,#5b86e533)}.dark .login-option--viewer:hover{background:linear-gradient(to right,#36d1dc1a,#5b86e51a)}.login-option-icon{width:4rem;height:4rem;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;flex-shrink:0}.login-option-icon--streamer{background:var(--gradient-streamer)}.login-option-icon--viewer{background:var(--gradient-viewer)}.login-option-icon svg{width:var(--space-medium);height:var(--space-medium);color:#fff}.login-option-label{font-weight:600;font-size:var(--font-small);color:var(--color-text-primary)}.login-option-desc{font-size:var(--font-x-small);color:var(--color-text-muted)}.login-option-arrow{width:var(--space-normal);height:var(--space-normal);margin-inline-start:auto;color:var(--color-text-muted);transition:transform var(--transition-base)}.login-option:hover .login-option-arrow{transform:translate(.2rem)}.login-twitch-badge{margin-block-start:var(--space-large);display:flex;align-items:center;gap:var(--space-x-small);justify-content:center}.login-twitch-badge svg{width:var(--space-normal);height:var(--space-normal);color:#6441a5}.login-twitch-badge span{font-size:var(--font-x-small);color:var(--color-text-muted)}.onboarding-page{max-width:52rem;margin-inline:auto;padding:var(--space-6x-large) var(--space-large) 0;text-align:center}.onboarding-title{font-size:var(--font-large);font-weight:700;color:var(--color-text-primary);font-family:var(--font-heading)}.onboarding-subtitle{margin-block-start:var(--space-small);font-size:var(--font-small);color:var(--color-text-muted)}.onboarding-grid{margin-block-start:4rem;display:grid;grid-template-columns:1fr;gap:var(--space-normal)}@media(min-width:640px){.onboarding-grid{grid-template-columns:repeat(2,1fr)}}.onboarding-card{width:100%;padding:var(--space-large);border-radius:var(--radius-large);border:1px solid;transition:all var(--transition-base);text-align:start;cursor:pointer}.onboarding-card--streamer{background:linear-gradient(to bottom right,#ff6b6b1a,#ff8e531a);border-color:#ff8e5333}.dark .onboarding-card--streamer{background:linear-gradient(to bottom right,#ff6b6b0d,#ff8e530d);border-color:#ff8e531a}.onboarding-card--streamer:hover{background:linear-gradient(to bottom right,#ff6b6b33,#ff8e5333)}.onboarding-card--viewer{background:linear-gradient(to bottom right,#36d1dc1a,#5b86e51a);border-color:#5b86e533}.dark .onboarding-card--viewer{background:linear-gradient(to bottom right,#36d1dc0d,#5b86e50d);border-color:#5b86e51a}.onboarding-card--viewer:hover{background:linear-gradient(to bottom right,#36d1dc33,#5b86e533)}.onboarding-card-icon{width:var(--space-2x-large);height:var(--space-2x-large);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;margin-block-end:var(--space-normal)}.onboarding-card-icon svg{width:var(--space-large);height:var(--space-large);color:#fff}.onboarding-card-title{font-weight:700;color:var(--color-text-primary)}.onboarding-card-desc{margin-block-start:var(--space-2x-small);font-size:var(--font-x-small);color:var(--color-text-muted)}.style-card{position:relative;border-radius:var(--radius-large);background:var(--color-bg-surface);border:1px solid var(--color-border);overflow:hidden;box-shadow:var(--shadow-large);transition:all var(--transition-slow)}.style-card:hover{transform:translateY(-.3rem)}a.style-card-thumbnail{display:block;text-decoration:none;color:inherit;cursor:zoom-in}.style-card-thumbnail{aspect-ratio:16/10;overflow:hidden;position:relative}.style-card-thumbnail img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.style-card:hover .style-card-thumbnail img{transform:scale(1.05)}.style-card-preview{width:100%;height:100%;display:flex;flex-direction:column;padding:var(--space-small);pointer-events:none;overflow:hidden;font-size:62.5%;zoom:.45;transition:transform .4s ease-out,transform-origin 0ms}.style-card-preview .sc-chat{flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.is-zoomed .style-card-preview{transform:scale(2.2);transform-origin:var(--zoom-x, 50%) var(--zoom-y, 50%)}.style-card-price{position:absolute;inset-block-start:var(--space-small);inset-inline-end:var(--space-small);z-index:1}.style-card-info{padding:var(--space-normal)}.style-card-name{font-weight:600;color:var(--color-text-primary);font-family:var(--font-heading);font-size:var(--font-medium);line-height:var(--leading-snug)}.style-card-skins{flex-shrink:0}.style-card-description{margin-block-start:.6rem;font-size:var(--font-x-small);color:var(--color-text-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:var(--leading-relaxed)}.line-through{text-decoration:line-through;opacity:.5}.style-active-border{border:2px solid var(--color-accent)!important;box-shadow:0 1rem 2rem #9333ea33!important}.style-status-banner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-normal);padding:var(--space-normal);margin-block-end:var(--space-large);border-radius:var(--radius-large);background:var(--color-bg-surface);border:1px solid var(--color-border)}.style-card-badge-start{position:absolute;inset-block-start:var(--space-small);inset-inline-start:var(--space-small);z-index:1}.style-card-badge-end{position:absolute;inset-block-start:var(--space-small);inset-inline-end:var(--space-small);z-index:1}.style-card-actions{display:flex;align-items:center;gap:var(--space-x-small);margin-block-start:var(--space-small)}.style-status-info{display:flex;align-items:center;gap:var(--space-small);font-size:var(--font-small)}.skin-card{border-radius:var(--radius-large);border:2px solid var(--color-border);padding:var(--space-normal);background:var(--color-surface);box-shadow:var(--shadow-small);transition:border-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast)}.skin-card:hover{border-color:var(--color-accent);box-shadow:var(--shadow-medium);transform:translateY(-2px)}.skin-card--active{border-color:var(--color-success, #22c55e);box-shadow:0 0 0 1px var(--color-success, #22c55e),var(--shadow-small)}.skin-card--active:hover{border-color:var(--color-success, #22c55e);box-shadow:0 0 0 1px var(--color-success, #22c55e),var(--shadow-medium)}.skin-card-thumb{width:100%;border-radius:var(--radius-small);overflow:hidden;margin-block-end:var(--space-x-small)}.skin-card-preview{width:100%;display:flex;flex-direction:column;padding:5px;pointer-events:none;overflow:hidden;font-size:62.5%;zoom:.85}.skin-card-preview .sc-chat{flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end}.skin-card-labels{display:flex;flex-direction:column;gap:var(--space-2x-small);margin-block-start:var(--space-x-small)}.provider-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-small);padding:var(--space-normal);border-radius:var(--radius);border:1px solid var(--color-border);transition:all var(--transition-base);cursor:pointer}.provider-card.is-active{background:var(--color-accent-subtle);border-color:#6c3fc54d}.provider-card:not(.is-active){background:var(--color-bg-surface-hover)}.provider-logo{width:var(--space-x-large);height:var(--space-x-large)}.provider-name{font-size:var(--font-x-small);font-weight:600;color:var(--color-text-primary)}.position-btn{position:relative;aspect-ratio:16/9;border-radius:var(--radius-small);background:var(--color-bg-surface-hover);border:1px solid var(--color-border);overflow:hidden;cursor:pointer;padding:.6rem}.position-btn.is-active{box-shadow:0 0 0 2px var(--color-accent)}.position-indicator{border-radius:.4rem;background:#6c3fc54d}.position-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:var(--font-x-small);font-weight:500;color:var(--color-text-muted)}.direction-btn{position:relative;display:flex;flex-direction:column;aspect-ratio:16/9;border-radius:var(--radius-small);border:1px solid var(--color-border);padding:.6rem;cursor:pointer;transition:all var(--transition-base);overflow:hidden}.direction-btn.is-active{box-shadow:0 0 0 2px var(--color-accent);background:var(--color-accent-subtle)}.direction-btn:not(.is-active){background:var(--color-bg-surface-hover)}.direction-btn:not(.is-active) .direction-indicator{display:none}.direction-btn:not(.is-active):hover .direction-indicator{display:block}.direction-label{font-size:var(--font-x-small);font-weight:500;color:var(--color-text-muted)}.direction-preview{margin-block-start:.4rem;flex:1;position:relative;overflow:hidden;border-radius:var(--radius-small);background:var(--color-bg-surface)}.direction-indicator{position:absolute;inset-inline-start:var(--space-x-small);inset-inline-end:var(--space-x-small);height:var(--space-normal);border-radius:.4rem;background:#6c3fc533}.dark .position-indicator{background:#a78bfa73}.dark .direction-indicator{background:#a78bfa59}.setting-row{display:flex;align-items:center;justify-content:space-between;max-inline-size:50%}.setting-label{font-size:var(--font-small);color:var(--color-text-primary)}.setting-desc{font-size:var(--font-x-small);color:var(--color-text-muted)}.danger-zone{background:color-mix(in srgb,var(--color-danger) 15%,var(--color-bg-surface));border:1px solid var(--color-danger);border-radius:var(--radius-large);box-shadow:var(--shadow);padding:var(--space-large);margin-block-start:var(--space-4x-large);margin-block-end:var(--space-x-large)}.danger-zone h3{font-size:var(--font-small);font-weight:700;color:var(--color-danger);margin-block-end:var(--space-small)}.danger-zone p{font-size:var(--font-x-small);color:var(--color-danger);opacity:.8;margin-block-end:var(--space-normal)}.danger-zone .input-label{color:var(--color-danger)}.danger-zone .input{border-color:var(--color-danger);max-inline-size:24rem}.danger-zone .delete-group .input{margin-block-end:0;border-end-start-radius:0;border-end-end-radius:0}.danger-zone .delete-group .btn-danger{max-inline-size:24rem;width:100%;border-start-start-radius:0;border-start-end-radius:0}@keyframes slideUp{0%{transform:translateY(100%);opacity:0}30%{opacity:1}70%{opacity:1}to{transform:translateY(-100%);opacity:0}}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}30%{opacity:1}70%{opacity:1}to{transform:translateY(100%);opacity:0}}@keyframes slideRight{0%{transform:translate(-100%);opacity:0}30%{opacity:1}70%{opacity:1}to{transform:translate(100%);opacity:0}}@keyframes slideLeft{0%{transform:translate(100%);opacity:0}30%{opacity:1}70%{opacity:1}to{transform:translate(-100%);opacity:0}}.style-preview-layout{display:grid;grid-template-columns:3fr 1fr;gap:var(--space-x-large);align-items:start}@media(max-width:1023px){.style-preview-layout{grid-template-columns:1fr}}.style-preview-viewport{aspect-ratio:16 / 9;background:#0e0e10;border-radius:var(--radius-large);overflow:hidden;position:relative}.style-preview-viewport-bg{position:absolute;inset:0;background-image:var(--preview-bg-image, url(https://images.unsplash.com/photo-1542751371-adc38448a05e?w=1280&q=80));background-size:cover;background-position:center;filter:brightness(.5)}.style-preview-chat{position:absolute;inset-block-end:0;inset-inline-start:0;width:400px;max-width:80%;max-height:200%;padding:5px}.style-preview-chat-inner{width:100%;height:100%;padding:5px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;font-size:62.5%;zoom:.5}@media(max-width:639px){.style-preview-chat{width:520px;max-width:100%}.style-preview-chat-inner{zoom:unset}}.style-preview-buybox{position:sticky;inset-block-start:var(--space-x-large);display:flex;flex-direction:column;gap:var(--space-medium)}.style-preview-buybox-title{font-size:var(--font-x-large);font-weight:700;color:var(--color-text)}.style-preview-notice{display:flex;align-items:flex-start;gap:var(--space-small);padding:var(--space-normal);background:color-mix(in oklch,var(--color-accent) 10%,transparent);border:1px solid color-mix(in oklch,var(--color-accent) 30%,transparent);border-radius:var(--radius-medium);font-size:var(--font-small);line-height:1.5;color:var(--color-text)}.style-preview-notice>svg{flex-shrink:0;color:var(--color-accent);margin-block-start:1px}.style-preview-notice-title{font-weight:600}.style-preview-notice-detail{display:block;color:var(--color-text-muted);margin-block-start:2px}.style-preview-buybox-description{font-size:var(--font-small);color:var(--color-text-muted);line-height:1.5}.style-preview-buybox-price{font-size:var(--font-xx-large);font-weight:700;color:var(--color-accent)}.style-preview-buybox-price-original{font-size:var(--font-normal);color:var(--color-text-muted);text-decoration:line-through;margin-inline-start:var(--space-small)}.style-preview-buybox-actions{display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--space-small)}.style-preview-buybox-actions .btn-group{width:100%}.style-preview-buybox-actions .btn-group>*{flex:1;padding:1rem var(--space-medium);font-size:var(--font-small)}.btn-group>.btn-primary:hover{translate:none}.btn-group{display:flex}.btn-group>:first-child{border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none}.btn-group>:last-child{border-start-start-radius:0;border-end-start-radius:0}.style-preview-buybox-login-hint{color:var(--color-text-muted);font-size:var(--text-small)}.style-preview-skins-section{margin-block-start:var(--space-x-large)}.style-preview-default-skin{max-width:240px;margin-block-end:var(--space-medium)}.style-preview-skins-title{font-size:var(--font-large);font-weight:600;color:var(--color-text);margin-block-end:var(--space-medium)}.style-preview-skins-subtitle{font-size:var(--font-small);font-weight:400;color:var(--color-text-muted)}.style-preview-skins-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--space-medium)}.style-preview-skin-card{border-radius:var(--radius-large);border:2px solid var(--color-border);padding:var(--space-normal);cursor:pointer;transition:border-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast);background:var(--color-surface);box-shadow:var(--shadow-small);text-align:center}.style-preview-skin-card:hover{border-color:var(--color-accent);box-shadow:var(--shadow-medium);transform:translateY(-2px)}.style-preview-skin-card--active{border-color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent),var(--shadow-medium)}.style-preview-skin-card-thumb{width:100%;border-radius:var(--radius-small);margin-block-end:var(--space-x-small);position:relative}.style-preview-skin-card-thumb img{width:100%;height:100%;object-fit:cover}.style-preview-mini-preview{width:100%;font-size:62.5%;padding:var(--space-small);pointer-events:none;zoom:.85}.style-preview-skin-card-name{font-size:var(--font-small);font-weight:500;color:var(--color-text)}.designer-slideout{position:fixed;inset-block-start:0;inset-inline-end:0;inset-block-end:0;width:420px;max-width:100%;background:var(--color-bg-page);border-inline-start:1px solid var(--color-border);box-shadow:-4px 0 24px #00000040;transform:translate(100%);transition:transform var(--transition-slow);z-index:100;overflow:hidden;display:flex;flex-direction:column}.designer-slideout--open{transform:translate(0)}@media(max-width:639px){.designer-slideout{width:100%}}#designer-panel{flex:1;overflow:hidden;min-block-size:0;display:flex;flex-direction:column}.designer-panel-inner{display:flex;flex-direction:column;height:100%;overflow:hidden}.designer-panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-medium) var(--space-large);border-block-end:1px solid var(--color-border);flex-shrink:0}.designer-panel-title{font-size:var(--font-large);font-weight:600;color:var(--color-text)}.designer-panel-close{font-size:var(--font-x-large);color:var(--color-text-muted);background:none;border:none;cursor:pointer;padding:var(--space-x-small);line-height:1;transition:color var(--transition-fast)}.designer-panel-close:hover{color:var(--color-text)}.designer-panel-body{flex:1;overflow-y:auto;padding:var(--space-medium)}.designer-panel-footer{display:flex;align-items:center;gap:var(--space-small);padding:var(--space-medium) var(--space-large);border-block-start:1px solid var(--color-border);flex-shrink:0}.designer-panel-saving{font-size:var(--font-small);color:var(--color-text-muted);margin-inline-start:auto}.style-preview-controls{position:absolute;inset-block-start:var(--space-small);inset-inline-start:var(--space-small);display:flex;align-items:center;gap:6px;opacity:0;transition:opacity var(--transition-fast);z-index:5}.style-preview-viewport:hover .style-preview-controls{opacity:1}.style-preview-control-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;background:#0009;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-small);color:#ffffffb3;cursor:pointer;transition:color var(--transition-fast),background var(--transition-fast)}.style-preview-control-btn:hover{color:#fff;background:#000c}.style-preview-zoom{display:flex;align-items:center;gap:var(--space-x-small);background:#0009;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-small);padding:2px 8px}.style-preview-zoom-label{font-size:var(--font-x-small);color:#ffffffb3;white-space:nowrap}.style-preview-zoom-input{width:80px;accent-color:var(--color-accent)}.style-preview-zoom-value{font-size:var(--font-x-small);font-weight:500;color:#fff;min-width:3ch;text-align:end}.style-preview-chat--custom{transition:none;border:1px dashed transparent;padding:10px;inset-block-end:auto;inset-inline-start:auto}.style-preview-viewport:hover .style-preview-chat--custom{border-color:#ffffff59}.style-preview-chat--custom .style-preview-chat-inner{overflow:hidden}.style-preview-chat--dragging{cursor:grabbing;user-select:none}.style-preview-resize-handle{position:absolute;opacity:0;transition:opacity var(--transition-fast);z-index:10}.style-preview-chat:hover .style-preview-resize-handle,.style-preview-chat--dragging .style-preview-resize-handle{opacity:1}.style-preview-resize-handle:after{content:"";position:absolute;background:var(--color-accent);border-radius:2px;opacity:.6}.style-preview-resize-handle--n,.style-preview-resize-handle--s{inset-inline-start:8px;inset-inline-end:8px;block-size:6px;cursor:ns-resize}.style-preview-resize-handle--n{inset-block-start:-3px}.style-preview-resize-handle--s{inset-block-end:-3px}.style-preview-resize-handle--n:after,.style-preview-resize-handle--s:after{inset-inline-start:50%;transform:translate(-50%);inline-size:32px;block-size:3px;inset-block-start:50%;margin-block-start:-1.5px}.style-preview-resize-handle--e,.style-preview-resize-handle--w{inset-block-start:8px;inset-block-end:8px;inline-size:6px;cursor:ew-resize}.style-preview-resize-handle--e{inset-inline-end:-3px}.style-preview-resize-handle--w{inset-inline-start:-3px}.style-preview-resize-handle--e:after,.style-preview-resize-handle--w:after{inset-block-start:50%;transform:translateY(-50%);inline-size:3px;block-size:32px;inset-inline-start:50%;margin-inline-start:-1.5px}.style-preview-resize-handle--nw,.style-preview-resize-handle--ne,.style-preview-resize-handle--sw,.style-preview-resize-handle--se{inline-size:12px;block-size:12px}.style-preview-resize-handle--nw{inset-block-start:-4px;inset-inline-start:-4px;cursor:nwse-resize}.style-preview-resize-handle--ne{inset-block-start:-4px;inset-inline-end:-4px;cursor:nesw-resize}.style-preview-resize-handle--sw{inset-block-end:-4px;inset-inline-start:-4px;cursor:nesw-resize}.style-preview-resize-handle--se{inset-block-end:-4px;inset-inline-end:-4px;cursor:nwse-resize}.style-preview-resize-handle--nw:after,.style-preview-resize-handle--ne:after,.style-preview-resize-handle--sw:after,.style-preview-resize-handle--se:after{inline-size:8px;block-size:8px;border-radius:50%;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.style-preview-reset-pos{position:absolute;inset-block-start:var(--space-small);inset-inline-end:var(--space-small);background:#0009;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-small);padding:2px 8px;font-size:var(--font-x-small);cursor:pointer;opacity:0;transition:opacity var(--transition-fast);z-index:5}.style-preview-viewport:hover .style-preview-reset-pos{opacity:1}.shop-header{display:flex;align-items:center;gap:var(--space-medium)}.shop-streamer-avatar{width:5.6rem;height:5.6rem;border-radius:50%;object-fit:cover;border:3px solid var(--color-accent);flex-shrink:0}.shop-streamer-name{font-size:2rem;font-weight:700;color:var(--color-text-primary);font-family:var(--font-heading)}.shop-style-name{font-size:var(--font-small);font-weight:500;color:var(--color-accent);margin-block-start:.2rem}.shop-style-desc{font-size:var(--font-x-small);color:var(--color-text-muted);margin-block-start:.4rem}.shop-section-title{font-size:1.8rem;font-weight:700;color:var(--color-text-primary);font-family:var(--font-heading);margin-block-end:1.6rem}.shop-skin-meta{display:flex;align-items:center;gap:.4rem;margin-block-start:.4rem}.shop-skin-price{font-size:var(--font-x-small);font-weight:600;color:var(--color-text-primary)}.shop-skin-price--free{color:var(--color-success)}.shop-skin-price--sub{color:var(--color-accent)}.shop-skin-price--original{text-decoration:line-through;color:var(--color-text-muted);font-weight:400}.shop-skin-price--sale{color:var(--color-error)}.shop-skin-action{width:100%}.shop-skin-badge{display:inline-block;text-align:center;width:100%}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.animate-spin{animation:spin 1s linear infinite}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.icon-12{width:var(--space-small);height:var(--space-small)}.icon-16{width:var(--space-normal);height:var(--space-normal)}.icon-20{width:var(--space-medium);height:var(--space-medium)}.icon-24{width:var(--space-large);height:var(--space-large)}.icon-32{width:var(--space-x-large);height:var(--space-x-large)}.icon-48{width:var(--space-2x-large);height:var(--space-2x-large)}.space-y-3>*+*{margin-block-start:var(--space-small)}.space-y-6>*+*{margin-block-start:var(--space-large)}.space-y-8>*+*{margin-block-start:var(--space-x-large)}