.community-clips-page .page-intro{text-align:center;font-size:1.1rem;color:var(--text-secondary);max-width:700px;margin:-1.5rem auto 3rem;line-height:1.6}.community-clips-page .page-title{text-align:center}.submission-section{background-color:var(--bg-secondary);padding:1.25rem;border-radius:var(--border-radius-large);border:1px solid var(--border-color);margin-bottom:3rem;box-shadow:0 4px 12px hsla(var(--shadow-color-hsl),.05)}.submission-form{display:flex;flex-direction:column;gap:1rem}.form-row{display:flex;gap:.75rem;align-items:center}.clip-url-input{flex-grow:1;height:44px;padding:0 1.1rem;font-size:1rem;background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--border-radius);color:var(--text-primary);transition:all .2s ease}.clip-url-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px hsla(var(--accent-primary-hsl),.2)}.submit-clip-btn{height:44px;width:44px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:0;font-size:1.2rem;border-radius:var(--border-radius)}.form-auth-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;padding:0 .25rem}.guest-identity,.user-identity{display:flex;align-items:center;gap:.75rem;color:var(--text-secondary);font-size:.9rem}.guest-name-input{height:36px;background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--border-radius-small);padding:0 .75rem;color:var(--text-primary);max-width:160px}.guest-name-input.input-invalid{border-color:#e74c3c;box-shadow:0 0 0 3px rgba(235,71,71,.15)}.auth-divider{font-size:.9rem;color:var(--text-secondary)}.twitch-login-btn{display:inline-flex;align-items:center;gap:.6em;padding:.5rem 1rem;background-color:#9146ff;color:#fff;border:none;border-radius:var(--border-radius-small);font-weight:600;cursor:pointer;transition:background-color .2s ease}.twitch-login-btn:hover{background-color:#772ce8}.twitch-login-btn svg{font-size:1.1em}.user-identity strong{color:var(--text-primary);font-weight:600}.user-logout-btn{background:none;border:none;padding:0;margin-left:.5rem;color:var(--text-secondary);text-decoration:underline;cursor:pointer;font-size:.85rem}.user-logout-btn:hover{color:var(--accent-primary)}.clips-grid{display:grid;grid-gap:1.25rem;gap:1.25rem;grid-template-columns:repeat(2,1fr)}@media (min-width:768px){.clips-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width:1200px){.clips-grid{gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}}.clip-card{background-color:var(--bg-secondary);border-radius:var(--border-radius);border:1px solid var(--border-color);overflow:hidden;box-shadow:0 2px 8px hsla(var(--shadow-color-hsl),.05);transition:transform .3s ease,box-shadow .3s ease}.clip-card:hover{transform:translateY(-5px);box-shadow:0 6px 20px hsla(var(--shadow-color-hsl),.1)}.clip-embed{width:100%;aspect-ratio:16/9;background-color:#0e0e10}.clip-embed iframe{display:block}.clip-info{padding:.8rem 1rem}.clip-title{font-size:1rem;font-weight:600;color:var(--text-primary);margin:0 0 .6rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.clip-meta{display:flex;flex-direction:column;gap:.4rem;font-size:.85rem;color:var(--text-secondary)}.meta-item{display:flex;align-items:center;gap:.5em;margin:0}.meta-item strong{color:var(--text-primary);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.feedback-message,.input-error-message{margin-top:0;padding:.8rem 1.2rem;border-radius:var(--border-radius);font-weight:500;display:flex;align-items:center;gap:.6em}.feedback-message.success{background-color:rgba(46,204,112,.15);color:#2ecc71}.feedback-message.error,.input-error-message{background-color:rgba(235,71,71,.15);color:#e74c3c}.input-error-message{font-size:.9rem}.loading-placeholder,.no-clips-placeholder{text-align:center;padding:4rem 1rem;font-size:1.2rem;color:var(--text-secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background-color:var(--bg-secondary);border-radius:var(--border-radius-large);border:2px dashed var(--border-color)}.no-clips-placeholder h3{color:var(--text-primary);margin:0}@keyframes spin{to{transform:rotate(1turn)}}.fa-spin{animation:spin 1s linear infinite}.clip-submission-meta{margin-left:10px;color:#888}