.App{text-align:center}.homepage{display:flex;flex-direction:column;min-height:100vh}.feed-container{flex:1 0 auto}.banner{width:100%;background-color:var(--habs-red);color:var(--white);text-align:center;padding:8px 0;box-shadow:0 4px 6px #0000001a;text-decoration:none;transition:transform .3s ease,background-color .3s ease}.banner:hover{transform:scale(1.05);background-color:var(--bright-red)}.banner-content{max-width:1200px;margin:0 auto;padding:0 20px}.banner-title,.banner-subtitle{text-decoration:underline;text-decoration-color:var(--white);font-weight:700;margin:0}.banner-title{font-size:2rem}.banner-subtitle{font-size:1rem;margin-top:5px}@media(min-width:769px)and (max-width:1024px){.banner-content{padding:0 15px}.banner-title{font-size:1.75rem}.banner-subtitle{font-size:.9rem}}@media(max-width:768px){.banner{padding:6px 0}.banner-content{padding:0 10px}.banner-title{font-size:1.5rem}.banner-subtitle{font-size:.85rem}}@media(max-width:480px){.banner{padding:5px 0}.banner-content{padding:0 5px}.banner-title{font-size:1.3rem}.banner-subtitle{font-size:.75rem}}.navbar{display:flex;flex-direction:column;align-items:center;gap:4px;width:100%;padding:16px 20px 14px;background-color:var(--surface);border-bottom:4px solid var(--habs-red);position:sticky;top:0;z-index:1000}.navbar-brand{display:flex;align-items:center;gap:10px;text-decoration:none}.navbar-mark{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;background:var(--habs-blue);color:#fff;font-family:Anton,Impact,Arial Narrow Bold,sans-serif;font-size:1.35rem;line-height:1;padding-top:2px}.navbar-wordmark{font-family:Anton,Impact,Arial Narrow Bold,sans-serif;font-size:2rem;letter-spacing:.04em;color:var(--habs-red);transition:color .2s ease}.navbar-brand:hover .navbar-wordmark,.navbar-brand:focus .navbar-wordmark{color:var(--habs-red-bright)}.navbar-tagline{margin:0;font-size:.8rem;color:var(--text-secondary);text-align:center}@media(max-width:480px){.navbar-wordmark{font-size:1.7rem}.navbar-mark{width:30px;height:30px;font-size:1.15rem}.navbar-tagline{font-size:.72rem}}.feed-container{flex:1 0 auto;display:flex;flex-direction:column;padding:28px 20px 40px;background-color:var(--bg)}.feed-content{display:flex;width:100%;max-width:760px;margin:0 auto}.feed-main{flex:1;display:flex;flex-direction:column;gap:20px;min-width:0}.feed-card{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;cursor:pointer;width:100%}.feed-card:hover,.feed-card:focus-visible{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--habs-red);outline:none}.feed-card.article{display:flex;flex-direction:row;min-height:132px}.feed-card.video{display:flex;flex-direction:column}.feed-thumbnail-wrapper{position:relative;background:#eceef2;overflow:hidden}.video .feed-thumbnail-wrapper{width:100%;padding-top:56.25%}.article .feed-thumbnail-wrapper{width:148px;flex-shrink:0}.feed-thumbnail{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.feed-thumbnail--placeholder{display:flex;align-items:center;justify-content:center;background:var(--habs-red);color:#fff;font-family:Anton,Impact,sans-serif;font-size:2.4rem;letter-spacing:.05em}.source-tag{position:absolute;top:10px;left:10px;background-color:#fffffff0;color:var(--habs-blue);padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}.play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:56px;height:56px;background-color:#1018289e;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background-color .18s ease,transform .18s ease}.feed-card:hover .play-button{background-color:var(--habs-red);transform:translate(-50%,-50%) scale(1.06)}.play-icon{width:0;height:0;border-left:20px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:4px}.feed-info{padding:14px 16px;flex:1;display:flex;flex-direction:column;text-align:left;min-width:0}.feed-title{margin:0 0 10px;font-size:15px;font-weight:650;line-height:1.35;color:var(--text-primary);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.feed-meta{font-size:13px;color:var(--text-secondary);margin-top:auto}.author{font-weight:600;color:var(--text-primary)}.separator{margin:0 6px}.loading-spinner{opacity:0;animation:fadeIn .3s ease forwards;height:40px;width:40px;margin:56px auto}.spinner{width:40px;height:40px;border:4px solid #e4e6eb;border-top-color:var(--habs-red);border-radius:50%;animation:spin 1s linear infinite}.error-message{max-width:760px;margin:48px auto;text-align:center;color:var(--text-secondary)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{to{opacity:1}}@media(max-width:768px){.feed-container{padding:20px 14px 32px}.feed-card.article{min-height:116px}.article .feed-thumbnail-wrapper{width:116px}.feed-title{font-size:14.5px}}@media(max-width:480px){.feed-container{padding:16px 12px 28px}.article .feed-thumbnail-wrapper{width:100px}}.video-modal{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#000c;z-index:1000}.video-modal-overlay{position:absolute;width:100%;height:100%;background:transparent}.video-modal-content{position:relative;width:90%;max-width:1000px;background:none;padding:0;border-radius:0;overflow:hidden}.video-modal iframe{width:100%;height:80vh;border:none}.video-modal-close{position:absolute;top:10px;right:10px;background:transparent;border:none;font-size:1.5rem;color:#fff;cursor:pointer}@media(min-width:769px)and (max-width:1024px){.video-modal-content{width:95%}.video-modal iframe{height:70vh}.video-modal-close{font-size:1.3rem}}@media(max-width:768px){.video-modal-content{width:100%;max-width:500px}.video-modal iframe{height:60vh}.video-modal-close{font-size:1.2rem;top:8px;right:8px}}@media(max-width:480px){.video-modal-content{max-width:100%}.video-modal iframe{height:50vh}.video-modal-close{font-size:1rem;top:5px;right:5px}}:root{--habs-blue: #192168;--habs-red: #AF1E2D;--habs-red-bright: #FF4C4C;--bg: #f4f5f7;--surface: #ffffff;--border: #e4e6eb;--text-primary: #1a1a1f;--text-secondary: #6b7280;--shadow-sm: 0 1px 3px rgba(16, 24, 40, .08);--shadow-md: 0 6px 20px rgba(16, 24, 40, .12);--radius: 14px;--gray-light: var(--bg);--white: var(--surface);--black: var(--text-primary);--background-primary: var(--surface);--link-default: var(--text-primary);--link-hover: var(--habs-red);--focus-outline: var(--habs-red-bright);--bright-red: var(--habs-red-bright)}.footer-container{flex-shrink:0;background-color:var(--habs-blue);color:#fff;padding:22px 16px 26px;text-align:center}.social-icons{display:flex;justify-content:center;margin-bottom:10px}.social-icons a{color:#fff;display:inline-flex;transition:color .2s ease,transform .2s ease}.social-icons a:hover{color:var(--habs-red-bright);transform:scale(1.12)}.social-icons svg{width:22px;height:22px}.footer-tagline{margin:0 0 4px;font-size:.82rem;color:#ffffffd1}.copyright{margin:0;font-size:.75rem;color:#ffffff8c}body{margin:0;background-color:#f4f5f7;color:#1a1a1f;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box}