.spotify-app{display:flex;min-height:100vh;background-color:var(--spotify-black);color:var(--spotify-white)}.main-content{flex:1 1;margin-left:240px;display:flex;flex-direction:column;background:linear-gradient(180deg,#1e3264 0,var(--spotify-black) 400px);min-height:calc(100vh - 90px)}.content-area{flex:1 1;padding:24px 32px;overflow-y:auto}.greeting-section{margin-bottom:32px}.greeting-section h1{font-size:32px;font-weight:700;margin-bottom:24px;color:var(--spotify-white)}.quick-access-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-gap:16px;gap:16px;margin-bottom:32px}.quick-access-card{display:flex;align-items:center;gap:16px;padding:16px;background-color:rgba(255,255,255,.1);border-radius:8px;text-decoration:none;color:var(--spotify-white);transition:background-color .2s;font-weight:500}.quick-access-card:hover{background-color:rgba(255,255,255,.2)}.quick-access-card .card-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#450af5,#c44569);border-radius:8px;background-repeat:no-repeat;background-position:50%;background-size:24px 24px}.quick-access-card .card-icon.search-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E")}.quick-access-card .card-icon.plus-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' x2='12' y1='5' y2='19'/%3E%3Cline x1='5' x2='19' y1='12' y2='12'/%3E%3C/svg%3E")}.quick-access-card .card-icon.library-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E")}.quick-access-card .card-icon.heart-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z'/%3E%3C/svg%3E")}.section{margin-bottom:32px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.section-header h2{font-size:24px;font-weight:700;color:var(--spotify-white)}.see-all-link{color:var(--spotify-light-gray);text-decoration:none;font-size:14px;font-weight:500;transition:color .2s}.see-all-link:hover{color:var(--spotify-white);text-decoration:underline}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-gap:24px;gap:24px}.feature-card{background-color:var(--spotify-gray);border-radius:8px;padding:16px;text-decoration:none;color:var(--spotify-white);transition:background-color .2s;cursor:pointer}.feature-card:hover{background-color:#3e3e3e}.feature-card-image{width:100%;aspect-ratio:1;background:linear-gradient(135deg,#450af5,#c44569);border-radius:4px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;overflow:hidden;position:relative}.feature-card-image img{width:100%;height:100%;object-fit:cover}.feature-card-image .feature-icon{width:48px;height:48px;background-repeat:no-repeat;background-position:50%;background-size:48px 48px;display:inline-block}.feature-card-image .feature-icon.search-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E")}.feature-card-image .feature-icon.plus-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' x2='12' y1='5' y2='19'/%3E%3Cline x1='5' x2='19' y1='12' y2='12'/%3E%3C/svg%3E")}.feature-card-title{font-size:16px;font-weight:700;margin-bottom:4px}.feature-card-subtitle,.feature-card-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.feature-card-subtitle{font-size:14px;color:var(--spotify-light-gray)}@media (max-width:768px){.main-content{margin-left:0}.content-area{padding:16px}.quick-access-grid{grid-template-columns:1fr;gap:12px}.greeting-section h1{font-size:24px}.cards-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:16px}}