:root{--font-heading: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--bg-gradient: linear-gradient(135deg, #0b0f19 0%, #111827 50%, #070a13 100%);--accent-purple: #8b5cf6;--accent-magenta: #ec4899;--accent-cyan: #06b6d4;--accent-gradient: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);--success-color: #10b981;--success-glow: rgba(16, 185, 129, .15);--card-bg: rgba(17, 24, 39, .5);--card-border: rgba(255, 255, 255, .06);--input-bg: rgba(15, 23, 42, .6);--input-border: rgba(255, 255, 255, .1);--border-focus: rgba(139, 92, 246, .5);--text-main: #f9fafb;--text-muted: #9ca3af;--text-dark: #4b5563;--header-height: 72px;--max-width: 1200px;--border-radius-sm: 8px;--border-radius-md: 16px;--border-radius-lg: 24px;--shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .3);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px rgba(139, 92, 246, .2)}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-gradient);color:var(--text-main);font-family:var(--font-body);min-height:100vh;line-height:1.5;overflow-x:hidden;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;letter-spacing:-.02em;color:var(--text-main)}a{color:inherit;text-decoration:none;transition:color .2s ease}button,input,textarea,select{font-family:inherit;outline:none}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#11182733}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}.app-header{height:var(--header-height);border-bottom:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);position:sticky;top:0;z-index:100;background:#0b0f19cc}.header-container{max-width:var(--max-width);height:100%;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;align-items:center}.app-logo{display:flex;align-items:center;gap:10px;font-family:var(--font-heading);font-size:24px;font-weight:800;color:var(--text-main)}.logo-icon{width:28px;height:28px;color:var(--accent-purple);filter:drop-shadow(0 0 8px rgba(139,92,246,.5))}.app-logo span span{background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.header-actions{display:flex;align-items:center;gap:12px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:var(--border-radius-sm);font-weight:600;font-size:14px;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);border:1px solid transparent;white-space:nowrap}.btn-primary{background:var(--accent-gradient);color:#fff;box-shadow:var(--shadow-sm)}.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-glow);opacity:.95}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:#ffffff0f;color:var(--text-main);border:1px solid var(--card-border)}.btn-secondary:hover{background:#ffffff1f;border-color:#fff3;transform:translateY(-1px)}.btn-danger{background:#ef444426;color:#f87171;border:1px solid rgba(239,68,68,.3)}.btn-danger:hover{background:#ef44444d;border-color:#ef444480;transform:translateY(-1px)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}#app-root{max-width:var(--max-width);margin:0 auto;padding:32px 24px;min-height:calc(100vh - var(--header-height))}.hidden{display:none!important}.text-center{text-align:center}.page-loader{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 0;gap:16px}.spinner{width:48px;height:48px;border:4px solid rgba(255,255,255,.1);border-left-color:var(--accent-purple);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.glass-panel{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--border-radius-md);box-shadow:var(--shadow-md);padding:32px}.form-group{margin-bottom:20px}.form-label{display:block;font-size:14px;font-weight:500;margin-bottom:8px;color:var(--text-muted)}.form-control{width:100%;background:var(--input-bg);border:1px solid var(--input-border);color:var(--text-main);padding:12px 16px;border-radius:var(--border-radius-sm);font-size:15px;transition:all .2s ease}.form-control:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px #8b5cf626}.form-control::placeholder{color:var(--text-dark)}textarea.form-control{resize:vertical;min-height:100px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.auth-container{max-width:420px;margin:60px auto}.auth-title{font-size:28px;margin-bottom:8px;text-align:center}.auth-subtitle{color:var(--text-muted);text-align:center;font-size:14px;margin-bottom:24px}.auth-footer{text-align:center;margin-top:16px;font-size:14px;color:var(--text-muted)}.auth-link{color:var(--accent-purple);font-weight:600;cursor:pointer}.auth-link:hover{text-decoration:underline}.landing-hero{text-align:center;padding:60px 0;max-width:680px;margin:0 auto}.landing-hero h1{font-size:48px;font-weight:800;margin-bottom:16px;line-height:1.1;background:linear-gradient(to right,#fff,#d8b4fe,#ec4899);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.landing-hero p{font-size:18px;color:var(--text-muted);margin-bottom:32px}.hero-actions{display:flex;justify-content:center;gap:16px}.find-event-box{max-width:500px;margin:0 auto 40px}.join-input-group{display:flex;gap:8px}.join-input-group input{flex:1}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.event-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}.event-card{cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;transition:all .2s ease}.event-card:hover{transform:translateY(-4px);border-color:#8b5cf64d;box-shadow:var(--shadow-sm)}.event-card-header h3{font-size:20px;margin-bottom:8px}.event-meta-item{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-muted);margin-bottom:6px}.event-meta-item svg{width:14px;height:14px;color:var(--accent-purple)}.event-card-actions{margin-top:20px;display:flex;gap:10px}.event-detail-header{margin-bottom:32px;position:relative;display:flex;flex-direction:column;gap:24px;padding-bottom:24px;border-bottom:1px solid var(--card-border)}.event-detail-info{flex:1}.event-badge{display:inline-flex;align-items:center;gap:6px;background:var(--success-glow);color:var(--success-color);padding:4px 10px;border-radius:12px;font-size:12px;font-weight:600;margin-bottom:12px}.event-badge:before{content:"";display:block;width:6px;height:6px;border-radius:50%;background:var(--success-color);box-shadow:0 0 8px var(--success-color);animation:pulse 1.5s infinite}@keyframes pulse{0%{transform:scale(.9);opacity:.6}50%{transform:scale(1.2);opacity:1}to{transform:scale(.9);opacity:.6}}.event-detail-info h1{font-size:38px;margin-bottom:16px;line-height:1.2}.event-meta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.event-detail-actions{display:flex;gap:12px;align-self:flex-start}.filter-search-container{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}.search-box-wrapper{position:relative;width:100%}.search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--text-dark);pointer-events:none}.search-input{padding-left:48px}.category-filter-scroller{overflow-x:auto;white-space:nowrap;display:flex;gap:10px;padding:4px 0;-webkit-overflow-scrolling:touch}.category-pill{display:inline-block;padding:8px 18px;border-radius:20px;background:#ffffff0a;border:1px solid var(--card-border);font-size:13px;font-weight:500;color:var(--text-muted);cursor:pointer;transition:all .2s ease}.category-pill:hover{background:#ffffff14;color:var(--text-main)}.category-pill.active{background:var(--accent-gradient);color:#fff;border-color:transparent;box-shadow:0 4px 10px #8b5cf633}.listings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}.listing-card{display:flex;flex-direction:column;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);overflow:hidden;height:100%}.listing-card:hover{transform:translateY(-6px);border-color:#ffffff26;box-shadow:var(--shadow-lg)}.listing-card-image-box{width:100%;aspect-ratio:4/3;position:relative;overflow:hidden;background:#181c26;border-bottom:1px solid rgba(255,255,255,.04)}.listing-card-image-box img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.listing-card:hover .listing-card-image-box img{transform:scale(1.05)}.listing-card-badge{position:absolute;top:12px;right:12px;padding:4px 8px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-radius:4px}.badge-available{background:var(--success-color);color:#fff}.badge-sold{background:#ef4444;color:#fff}.listing-card-body{padding:16px;flex:1;display:flex;flex-direction:column;justify-content:space-between}.listing-card-category{font-size:11px;font-weight:600;text-transform:uppercase;color:var(--accent-magenta);margin-bottom:6px}.listing-card-title{font-size:18px;font-weight:700;line-height:1.3;margin-bottom:8px;color:var(--text-main);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.listing-card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.04)}.listing-card-price{font-size:20px;font-weight:800;color:var(--accent-cyan)}.skeleton-card{height:320px;background:#ffffff05;border:1px solid var(--card-border);border-radius:var(--border-radius-md);overflow:hidden;position:relative}.skeleton-image{height:60%;background:#ffffff0a}.skeleton-text{height:16px;background:#ffffff0a;margin:16px;border-radius:4px}.skeleton-text.short{width:40%}.skeleton-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,#fff0,#ffffff08,#fff0);animation:shimmer 1.5s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.empty-state{text-align:center;padding:60px 24px}.empty-icon{width:64px;height:64px;color:var(--text-dark);margin:0 auto 16px}.empty-state h3{font-size:20px;margin-bottom:8px}.empty-state p{color:var(--text-muted);max-width:360px;margin:0 auto}dialog{border:none;background:transparent;color:var(--text-main);max-width:600px;width:90%;margin:auto;border-radius:var(--border-radius-lg);box-shadow:var(--shadow-lg);opacity:0;transform:scale(.95);transition:opacity .3s ease,transform .3s cubic-bezier(.34,1.56,.64,1);display:block;pointer-events:none}dialog[open]{opacity:1;transform:scale(1);pointer-events:auto}dialog::backdrop{background-color:#070a13bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;transition:opacity .3s ease}dialog[open]::backdrop{opacity:1}.dialog-content{background:#111827;border:1px solid rgba(255,255,255,.08);border-radius:var(--border-radius-lg);padding:32px;position:relative;overflow:hidden}.dialog-close-btn{position:absolute;top:20px;right:20px;background:#ffffff0a;border:1px solid rgba(255,255,255,.06);color:var(--text-muted);width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.dialog-close-btn:hover{background:#ffffff1a;color:var(--text-main)}.dialog-close-btn svg{width:16px;height:16px}.dialog-heading{font-size:26px;margin-bottom:8px}.dialog-desc{color:var(--text-muted);font-size:14px;margin-bottom:24px}.detail-view{display:flex;flex-direction:column;gap:24px}.detail-image-box{width:100%;aspect-ratio:16/9;border-radius:var(--border-radius-md);overflow:hidden;background:#181c26;border:1px solid rgba(255,255,255,.04)}.detail-image-box img{width:100%;height:100%;object-fit:cover}.detail-meta-strip{display:flex;justify-content:space-between;align-items:center}.detail-category{font-size:12px;font-weight:700;text-transform:uppercase;color:var(--accent-magenta)}.detail-title{font-size:24px;margin-bottom:12px}.detail-price-status{display:flex;align-items:center;gap:16px}.detail-price{font-size:28px;font-weight:800;color:var(--accent-cyan)}.detail-status-badge{padding:4px 12px;font-size:12px;font-weight:700;border-radius:12px;text-transform:uppercase}.detail-description{color:var(--text-muted);font-size:15px;line-height:1.6;background:#ffffff05;padding:16px;border-radius:var(--border-radius-sm);border:1px solid var(--card-border);white-space:pre-wrap}.detail-footer-actions{display:flex;gap:12px;margin-top:12px}.upload-zone{border:2px dashed rgba(255,255,255,.1);background:#ffffff03;padding:24px;border-radius:var(--border-radius-sm);text-align:center;cursor:pointer;transition:all .2s ease;position:relative;display:flex;flex-direction:column;align-items:center;gap:12px}.upload-zone:hover,.upload-zone.dragover{border-color:var(--accent-purple);background:#8b5cf60d}.upload-icon{width:32px;height:32px;color:var(--text-muted)}.upload-preview-wrapper{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--border-radius-sm);overflow:hidden;margin-top:12px}.upload-preview-wrapper img{width:100%;height:100%;object-fit:cover}.upload-preview-remove{position:absolute;top:10px;right:10px;background:#000000b3;color:#fff;border:none;width:28px;height:28px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center}.upload-progress-container{width:100%;background:#ffffff14;height:6px;border-radius:3px;margin-top:8px;overflow:hidden}.upload-progress-bar{background:var(--accent-purple);height:100%;width:0%;transition:width .1s ease}.qr-code-wrapper{background:#fff;padding:16px;border-radius:var(--border-radius-md);display:inline-block;margin:0 auto 24px;box-shadow:var(--shadow-md)}.qr-code-wrapper canvas{display:block}.copy-link-wrapper{display:flex;gap:8px}.copy-link-wrapper input{flex:1;background:var(--input-bg);border:1px solid var(--input-border);color:var(--text-main);padding:10px 14px;border-radius:var(--border-radius-sm);font-size:13px}#listing-form-dialog{max-width:550px}@media (max-width: 768px){:root{--max-width: 100%}#app-root{padding:20px 16px}.landing-hero h1{font-size:34px}.event-detail-header{gap:16px}.event-detail-info h1{font-size:28px}.event-meta-grid{grid-template-columns:1fr;gap:12px}.event-detail-actions{width:100%;align-self:auto}.event-detail-actions button{flex:1}.form-row{grid-template-columns:1fr;gap:0}.detail-price-status{flex-direction:column;align-items:flex-start;gap:8px}.dialog-content{padding:24px 16px}.copy-link-wrapper{flex-direction:column}}
