:root{--bg-color: #020617;--surface-color: #0f172a;--surface-transparent: rgba(2, 6, 23, .9);--border-color: #1e293b;--text-color: #e2e8f0;--text-muted: #94a3b8;--input-bg: #1e293b;--input-text: #ffffff;--danger-color: #ef4444;--card-bg-hover: rgba(255,255,255,.02);--primary-color: #0ea5e9;--primary-hover: #0284c7}[data-theme=light]{--bg-color: #f8fafc;--surface-color: #ffffff;--surface-transparent: rgba(255, 255, 255, .9);--border-color: #e2e8f0;--text-color: #0f172a;--text-muted: #64748b;--input-bg: #f1f5f9;--input-text: #0f172a;--danger-color: #dc2626;--card-bg-hover: rgba(0,0,0,.02)}[data-color=blue]{--primary-color: #0ea5e9;--primary-hover: #0284c7}[data-theme=light][data-color=blue]{--primary-color: #0284c7;--primary-hover: #0369a1}[data-color=cyan]{--primary-color: #06b6d4;--primary-hover: #0891b2}[data-theme=light][data-color=cyan]{--primary-color: #0891b2;--primary-hover: #0e7490}[data-color=green]{--primary-color: #22c55e;--primary-hover: #16a34a}[data-theme=light][data-color=green]{--primary-color: #16a34a;--primary-hover: #15803d}[data-color=purple]{--primary-color: #a855f7;--primary-hover: #9333ea}[data-theme=light][data-color=purple]{--primary-color: #9333ea;--primary-hover: #7e22ce}[data-color=orange]{--primary-color: #f97316;--primary-hover: #ea580c}[data-theme=light][data-color=orange]{--primary-color: #ea580c;--primary-hover: #c2410c}[data-color=rose]{--primary-color: #f43f5e;--primary-hover: #e11d48}[data-theme=light][data-color=rose]{--primary-color: #e11d48;--primary-hover: #be123c}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:var(--bg-color);color:var(--text-color);line-height:1.5;min-height:100vh;display:flex;flex-direction:column;transition:background-color .3s,color .3s;overflow-x:hidden;width:100%}a{text-decoration:none;color:inherit;transition:color .2s}a:hover{color:var(--primary-color)}*{box-sizing:border-box}#root{width:100%;display:flex;flex-direction:column;min-height:100vh}.container{max-width:1200px;margin:0 auto;padding:0 1rem;width:100%}.navbar{background:var(--surface-transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border-color);position:sticky;top:0;z-index:100;height:64px;display:flex;align-items:center;transition:background-color .3s,border-color .3s}.navbar-content{display:flex;justify-content:space-between;align-items:center;width:100%}.brand{font-size:1.25rem;font-weight:700;color:var(--text-color);display:flex;align-items:center;gap:.5rem}.nav-links{display:flex;gap:1.5rem;align-items:center}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;border-radius:.5rem;font-weight:500;cursor:pointer;border:1px solid transparent;transition:all .2s;font-size:.95rem;gap:.5rem}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--primary-color);color:#fff}.btn-primary:hover{background:var(--primary-hover)}.btn-secondary{background:var(--surface-color);border-color:var(--border-color);color:var(--text-color)}.btn-secondary:hover{background:var(--card-bg-hover);border-color:var(--text-muted)}.btn-danger{background:var(--danger-color);color:#fff}.btn-ghost{background:transparent;color:var(--text-muted)}.btn-ghost:hover{color:var(--text-color);background:var(--card-bg-hover)}.btn-ghost.active{color:var(--primary-color);background:var(--card-bg-hover)}.card{background:var(--surface-color);border:1px solid var(--border-color);border-radius:1rem;padding:2rem;transition:background-color .3s,border-color .3s}.input-group{margin-bottom:1rem}.input-label{display:block;font-size:.875rem;color:var(--text-muted);margin-bottom:.5rem}.input-field{width:100%;background:var(--input-bg);border:1px solid var(--border-color);border-radius:.5rem;padding:.75rem 1rem;color:var(--input-text);font-size:1rem;transition:background-color .3s,color .3s,border-color .3s}.input-field:focus{outline:2px solid var(--primary-color);border-color:transparent}.grid{display:grid;gap:1.5rem}.grid-2{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-4{gap:1rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}.text-center{text-align:center}.text-muted{color:var(--text-muted)}.hidden-mobile{display:none}@media(min-width:768px){.hidden-mobile{display:flex}}.upload-zone{border:2px dashed var(--border-color);border-radius:1rem;height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--card-bg-hover);transition:all .2s}.upload-zone:hover,.upload-zone.active{border-color:var(--primary-color);background:#0ea5e90d}.media-item{aspect-ratio:1;background:var(--surface-color);border-radius:.75rem;overflow:hidden;border:1px solid var(--border-color);position:relative;display:block}.media-item img,.media-item video{width:100%;height:100%;object-fit:cover;opacity:.9;transition:opacity .2s}.media-item:hover img{opacity:1}.media-info{position:absolute;bottom:0;left:0;right:0;padding:1rem;background:linear-gradient(to top,rgba(0,0,0,.9),transparent);opacity:0;transition:opacity .2s}.media-item:hover .media-info{opacity:1}.spinner{width:1.5rem;height:1.5rem;border:2px solid var(--text-muted);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}footer{margin-top:auto;border-top:1px solid var(--border-color);padding:2rem 0;color:var(--text-muted);font-size:.875rem}.detail-frame{border:1px solid var(--border-color);border-radius:.75rem;padding:1.5rem;background:var(--card-bg-hover);transition:background-color .3s}@media(max-width:768px){.navbar{height:auto;padding:.75rem 0;position:relative}.navbar-content{flex-wrap:wrap;gap:1rem}.brand{font-size:1.1rem}.navbar-content>div:last-child{justify-content:flex-end}.grid-2{grid-template-columns:1fr}.card{padding:1.5rem}.detail-frame{padding:1rem}}@media(max-width:480px){.container{padding:0 .75rem}h1{font-size:1.75rem}h2{font-size:1.5rem}.btn{padding:.4rem .8rem;font-size:.85rem}}